/* colours
   background              white
   writing    dark blue    #01448b
   selected tab light blue #6dcdf3
*/

      html, body {margin:0px; padding:0px; background:white; font-family:verdana; font-size:12px;}

      /* The header and footer */

      .head {display:block; height:190px; background:white; color:#01448b; text-align:center; padding:5px;font-size:15px;}
      .foot {display:block; height:30px; background:white; color:#01448b; text-align:center; padding:15px;font-size:.8em;}


      #headlogo {background: transparent url(images/nortec_logo.png) no-repeat;
  display: block;
  width: 380px;
  height: 97px;
  font-size: 0px;
  color: #c31d1d;
  border: none;
  padding: 5px;
  margin-left: auto;
  margin-right: auto;
}

      #footlogo {background: transparent url(images/tcs_logo.jpg) no-repeat;
  display: block;
  width: 250px;
  height: 20px;
  font-size: 0px;
  color: #c31d1d;
  border: none;
  padding: 5px;
  margin-left: auto;
  margin-right: auto;
}

      /* This bit does all the work */

      #container {position:relative; display:block; background:white; border-left:300px solid white; border-right:300px solid white; overflow:visible;}
      #left {float:left; position:relative; width:298px; margin-left:-297px; display:inline;}
      #right {float:right; position:relative; width:298px; margin-right:-297px; display:inline;}

      .clear {clear:both;height:1px;overflow:hidden;}
  
      a:visited {color:#fff;}
  
      /* Just to extend each column */
  
      #container a:visited, a {color:#fff; text-decoration:none;}
  
      #container a span {display:none;}
  
      #container a:active, #container a:focus {color:white; text-decoration:none; background:transparent; cursor:default;}
  
      #container a:active span, #container a:focus span {display:inline; left:0;}
  
      .comment {text-align:center;}
  
      .comment a {text-decoration:underline;}
  
      em {font-weight:bold;}



    #info {padding-bottom:150px;}
    .images {background:white; width:20px; height:20px; padding:1px;}
    #nav {margin-top:10px;}
    #nav ul {margin:0 auto 100px auto; padding:0; list-style:none; display:table; white-space:nowrap; font-family: arial, verdana, sans-serif; font-size:11px;}
    #nav li {display:table-cell; margin:0; padding:0;}
    #nav a {float:left; color:#fff; background: #01448b url(images/left2.gif) no-repeat left bottom; margin:0 2px 0 0; padding:0 0 0 2px; text-decoration:none; letter-spacing:1px;}
    #nav a:visited {color:#fff; text-decoration:none; }
    #nav a b {float:left; display:block; background:transparent url(images/right2.gif) no-repeat right bottom; padding:5px 16px 5px 12px;}
    #nav a:hover {background-color:#6dcdf3; cursor:pointer;}
    #nav #current a {background-color:#6dcdf3;}
    #nav {padding:1px 0 0 0; background:white; border-top:8px solid #01448b;}





/* default link style - needed to make the :active work correctly in IE */
a, a:visited, a:hover, a:active {color:#6dcdf3;}

/* style the outer cntaining div to fit the landscape, portrait and buttons */
#album {width:320px;height:360px;background:white url(images/Comm18.jpg) 0 40px no-repeat;border:1px solid #01448b;margin:0 auto 20px auto;}

/* remove the padding margin and bullets from the list. Add a top margin and width to fit the images and a position relative */
.gallery {padding:0;margin:320px 0 0 0;list-style-type:none;position:relative;width:320px;}

/* remove the default image border */
.gallery img {border:5px solid #000;}

/* make the list horizontal */
.gallery li {float:left;}

/* style the link text to be central in a surrounding box */
.gallery li a, .gallery li a:visited {font-size:11px;float:left;text-decoration:none;color:red;background:#01448b;text-align:center;width:26px;height:26px;line-height:24px;border:1px solid #01448b;margin:2px;}

/* position the images using an absolute position and hide them from view */
.gallery li a img {position:absolute;top:-320px;left:0;visibility:hidden;border:0;}

/* fix the top position for the landscape images */
.gallery li a img.landscape {top:-280px;}

/* fix the left position for the portrait images */
.gallery li a img.portrait {left:0;border-left:40px solid #eee;border-right:40px solid #eee;}

/* style the hover background color for the text boxes */
.gallery li a:hover {background: #6dcdf3;border:1px solid #6dcdf3;}

/* style the active/focus colors for the text boxes (required for IE) */
.gallery li a:active, .gallery li a:focus {background:#6dcdf3;color:red;outline:0;}

/* make the images visible on active/focus */
.gallery li a:active img, .gallery li a:focus img {visibility:visible;outline:0;}