/* Reset all the styles so as to not worry about browser settings. */
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, tr { margin: 0em; padding:0em; border:0em; }

body {
  font-family:Arial, Helvetica, sans-serif;
  font-size:100%;
  background-color:black;
  line-height:1.3em;
}

table {
  border-collapse: collapse;
  background-color: #c0c0c0;
}

td {
  vertical-align: top;
}

td.title {
  background-color: #808080;
}

table, td {
  color:black;
  border: 1px solid black;
  padding: 0.3em;
} 

#container {
  max-width: 1024px;
  margin-left:auto; /*Centers the container.*/
  margin-right:auto; /*Centers the container.*/
}

#header {
  padding:0.5em;
  color:white;
  background-color:#004080;
  text-align:center;
}

#navbar {
  padding:0.5em;
  color:white;
  background-color:#808080;
  text-align:center;
  border-bottom:0.1em solid black;
}


/* colcontent is specifically for the sizing of the content column, the content itself is then nested in a content div to allow all things like margins, border, and padding to work normally (IE has an issue with these sizes if they're used directly on the #colcontent) */
#content { 
  padding:1.0em;
}

#contentpanel {
  margin-bottom:0.7em;
  padding:0.5em;
  background-color:#c0c0c0;
  border: 0.2em;
  border-radius: 0.3em;
  font-size: 0.8em;
}

#contentpanelvideo {
  width: 455px;
  margin-left: auto;
  margin-right: auto;
}

#contentgrid {
  margin-bottom:0.7em;
  padding:0.5em;
  background-color:#c0c0c0;
  border: 0.2em;
  border-radius: 0.3em;
  font-size: 0.8em;
  float: left; 
  margin-left:0.3em; 
  margin-right:0.3em;
}

/* colsidebar is specifically for the sizing of the sidebar column, the content itself is then nested in a sidebar div to allow all things like margins, border, and padding to work normally (IE has an issue with these sizes if they're used directly on the #colsidebar) */
#sidebar {
  padding:1.0em;
  font-size:0.8em;
}

#sidebarnews {
  margin-bottom:0.7em;
  padding:0.5em;
  color:#cfcfcf;
  background-color:#333333;
  border: 0.2em;
  border-radius: 0.3em;
}

#footer  {
  padding:0.5em;
  color:white;
  background-color:#808080;
  clear:both; /*Remove the floating from above, I think.*/
  text-align:center;
  font-size:0.7em;
}

/* left column - this style is defined here for old browsers that don't support @media (see below) so the content format still looks acceptable */
#colcontent { 
  overflow:hidden;
  color:black;
  background:#e8e8e8; /* LEFT column background colour */
}

/* right column - this style is defined here for old browsers that don't support @media (see below) so the sidebar format still looks acceptable */
#colsidebar { 
  overflow:hidden;
  color:black;
  background:#808080; /* RIGHT column background colour */
}


/* left column - this style is defined here for old browsers that don't support @media (see below) so the left content column format still looks acceptable */
#colcontentleft { 
  overflow:hidden;
  color:black;
  background:#e8e8e8; /* LEFT column background colour */
}

/* right column - this style is defined here for old browsers that don't support @media (see below) so the right content column format still looks acceptable */
#colcontentright { 
  overflow:hidden;
  color:black;
  background:#e8e8e8; /* RIGHT column background colour */
}


@media screen and (min-width: 700px) {
  #colcontainer2 {
    margin: 0em; 
    padding:0em; 
    border:0em;
    clear:left;
    float:left;
    width:100%;
    overflow:hidden;
    background:#808080; /* RIGHT column background colour */
  }

  #colcontainer1 {
    margin: 0em; 
    padding:0em; 
    border:0em;
    float:left;
    width:100%;
    position:relative;
    right:30%; /* size of the RIGHT background color (the LEFT is then 100% minus this size) */
    background:#e8e8e8; /* LEFT column background colour */
  }

  #colcontent { /* left column */
    margin: 0em; 
    padding:0em; 
    border:0em;
    float:left;
    width:70%; /* width of the LEFT column */
    position:relative;
    left:30%; /* size of the RIGHT column */
  }

  #colsidebar { /* right column */
    margin: 0em; 
    padding:0em; 
    border:0em;
    float:left;
    width:30%; /* width of the RIGHT column */
    position:relative;
    left:30%; /* size of the RIGHT column */
  }


  /* The following are for two columns nested within the main content column. */
  #colcontentcontainer2 {
    margin: 0em; 
    padding:0em; 
    border:0em;
    clear:left;
    float:left;
    width:100%;
    overflow:hidden;
    background:#e8e8e8; /* RIGHT column background colour */
  }

  #colcontentcontainer1 {
    margin: 0em; 
    padding:0em; 
    border:0em;
    float:left;
    width:100%;
    position:relative;
    right:60%; /* size of the RIGHT background color (the LEFT is then 100% minus this size) */
    background:#e8e8e8; /* LEFT column background colour */
  }

  #colcontentleft { /* left column */
    margin: 0em; 
    padding:0em; 
    border:0em;
    float:left;
    width:40%; /* width of the LEFT column */
    position:relative;
    left:60%; /* size of the RIGHT column */
  }

  #colcontentright { /* right column */
    margin: 0em; 
    padding:0em; 
    border:0em;
    float:left;
    width:60%; /* width of the RIGHT column */
    position:relative;
    left:60%; /* size of the RIGHT column */
  }

}

li {
  text-align: justify;
}

p.content {
  text-align: justify;
  padding: 0.3em; 
}

p.contentIndent {
  text-indent: 1.0em;
  text-align: justify;
  padding: 0.3em; 
}

p.contentIndentHidden {
  text-indent: 1.0em;
  text-align: justify;
  padding: 0.3em; 
  color: #c0c0c0;
}

p.sidebarContent {
  padding-bottom: 0.4em;
}


a.NavLink:link {
  color: white; 
  text-decoration : none; 
  background: transparent;}
a.NavLink:visited {
  color: white; 
  text-decoration : none;
  background: transparent;}
a.NavLink:hover { 
  color: #59acff; 
  text-decoration : none; 
  background: transparent;}

a.NavLink2:link {
  color: white; 
  text-decoration : underline; 
  background: transparent;}
a.NavLink2:visited {
  color: white; 
  text-decoration : underline;
  background: transparent;}
a.NavLink2:hover { 
  color: #59acff; 
  text-decoration : underline; 
  background: transparent;}

a.ContentLink:link {
  color: #006bd7; 
  text-decoration : none; 
  background: transparent;}
a.ContentLink:visited {
  color: #006bd7; 
  text-decoration : none;
  background: transparent;}
a.ContentLink:hover { 
  color: #59acff; 
  text-decoration : none; 
  background: transparent;}

ul {
  margin-left: 2.5em;
}

ol {
  margin-left: 2.5em;
}

p.blogcontenttitle {
  padding-left: 0.3em;
  padding-right: 0.3em;
  padding-top: 0.3em;
  padding-bottom: 0.0em;
  font-size: 1.5em;
  text-align: justify;
}

p.blogcontentdate {
  padding: 0.3em;
  font-size: 0.75em;
}

p.blogcontentcaption {
  padding: 0.3em;
  font-size: 0.8em;
  text-align: center;
}

p.bloglinks {
  padding: 0.3em; 
  font-weight: bold;
  text-align: center;
}

p.blogtitle {
  padding: 0.3em; 
  font-weight: bold;
}

p.blogyear {
  padding-left: 1.0em; 
}

p.blogmonth {
  padding-left: 1.0em; 
}

p.blogday {
  padding-left: 1.0em; 
}

a.bloglink:link {
  color: white; 
  text-decoration : none; 
}
a.bloglink:visited {
  color: white; 
  text-decoration : none; 
}
a.bloglink:hover {
  color: #59acff; 
  text-decoration : none; 
}

.overlay {
  display: none;
  position: fixed;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}

.overlayshadow {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background-color: black;
  filter: alpha(opacity=50);
  opacity: 0.5;
}

p.overlaypanel {
  padding: 0.5em;
  background-color:white;
  text-align: center;
  margin: auto;
  position:absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}

.overlayclose {
  position: absolute;
  top: -20px;
  right: -20px;
}

#snow {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  pointer-events: none;
}