html, body {
 margin: 0px;
 padding: 0px;
 border: 0px;
 color: #000;
 }

body {
	  background-color: #FFFFFF;
	 font-family: Georgia, times, 'times new roman', serif; 
	}
	
#wrapper  /* Size of page container  */
{
position: relative;
width: 1100px;
margin: 25px auto;
background-color: #FFF;
background-image: url("images/paper12.gif");
border-width: 6px; border-style: double; border-color: #000; border-radius: 25px; /* Double Border */
font-size: 1em;
}

.img { border: 2px solid #000; border-radius: 5px;  }

 /* Center image in box Horizontal and Vertical */ 
.boximg { 
    position: relative;  
    top: 0;  
    bottom: 0;  
    left: 0;  
    right: 0;  
    margin: auto; 
 }
 
img.center { display: block; margin-left: auto; margin-right: auto; border: 2px solid #000; border-radius: 15px; }

img.b  { border: 2px solid #000; border-radius: 15px; }
 
table.cs { background-color: #0000FF; width: 100%; border-style:solid; border-width:1px; }

.bd  { border: 2px solid #0000FF; } /* Border Blue */

.trans  { height:25px; padding-left:15px; } /* padding and margin for Transmissions */

h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; }
 
 h1 { font-size: 3em; font-family: times, 'times new roman', serif; font-style: italic; }
 h2 { font-size: 1.5em; }
 h3 { font-size: 1.25em ; font-family: Arial, Helvetica, sans-serif; }
 h4 { font-size: 1.0em; }
 h5 { font-size: 0.75em; }
 h6 { font-size: 0.5em; }
 
a:link { color: #000000; outline: none;  }
a:visited { color: #000000; outline: none;  }
a:hover { color: red; }
a:active { color: #0000FF; }

a.x { border-radius: 25px; text-decoration : none; outline: none; border-style: solid; border-width : 1px 4px 4px 1px; padding : 4px 6px; }   
a.x:link { border-color : #000; color: #000; background-color: #FFF; }
a.x:active { border-color : #000; color: #000; background-color: #FFF;}
a.x:visited  { border-color : #000; color: #000; background-color: #FFF; }
a.x:hover { border-color : #CC0920; background-color: #ccc; color: #CC0920; } 

a.f { text-decoration : none; outline: none; /* get rid of dotted borders in FireFox -- Use only on footers */} 
a.f:link { color: #000; }
a.f:active { color: #000; }
a.f:visited { color: #000; }
a.f:hover { color: RED; }

.fleft { float:left; display: block; }

.fright{float:right; display: block; }

.cf:after { content: ' '; display: block; clear: both; }

.fscenterdiv { border-style: solid; border-width: 0px 2px 0px 2px; border-color: #000; } /* Middle Box Center */

.width30 { position: relative; width: 30%; margin: 0 auto; }

.width40 { position: relative; width: 40%; margin: 0 auto; }

.width60 { position: relative; width: 60%; margin: 0 auto; }

.width70 { position: relative; width: 70%; margin: 0 auto; }

.width80 { position: relative; width: 80%; margin: 0 auto; }

.width90 { position: relative; width: 90%; margin: 0 auto; }

.pcenter { text-align: center;}
 
.pleft { text-align: left;} 

.pright { text-align: right; }

.vtop { vertical-align: top; }

.hr80  { width:80%; border: 1px solid #000; margin: 0 auto; }

.hr90  { width:90%; border: 1px solid #000; margin: 0 auto; }

.tfont0  /* Text Font */
{ font-size: 1em; font-family: Georgia, times, 'times new roman', serif; }

.tfont1  /* Text Font Bold */
{ font-size: 1em; font-family: Georgia, times, 'times new roman', serif; font-weight: bold; }

.pageheader { font-size: 2.25em; font-family: Tahoma; font-weight : bold; }

.footer /* Used in footer */
{ font-size: .75em; font-family: 'Times New Roman', Times, Georgia, serif; text-align: center;  } 

.footer2 /* Used in footer */
{ font-size: .85em; font-family: 'Times New Roman', Times, Georgia, serif; text-align: center;  } 

.afont1 { font-size: 16px; font-family: "times new roman", sans-serif, arial, helvetica; font-weight : bold; color: #333399; }
 
.afont2 { font-size: 20px; font-family: Georgia, times, 'times new roman', serif; font-weight : bold; }
 
.afont3 { font-size: 24px; font-family: Georgia, times, 'times new roman', serif; font-weight : bold; }
  
.bfont1 { font-size: 1.25em; font-family: "times new roman", sans-serif, arial, helvetica; font-weight : bold; color: #333399; }
  
.bfont2 { font-size: 2em; font-family: "times new roman", sans-serif, arial, helvetica; font-weight : bold; color: #333399; }

.sfont0 { font-size: 1.75em; font-family: tahoma; font-weight : bold; color: #000000; }

.sfont1 { font-size: 1.25em; font-family: tahoma; font-weight : bold; color: #000000; }

.sfont2 { font-size: .75em; font-family: tahoma; color: #000000; }

.sfont3 { font-size: .75em; font-family: tahoma; font-weight: bold; color: #000000; }

.sfont4 { font-size: .75em; font-family: tahoma; font-weight: bold; color: #FFFFCC; }

.sfont5 { font-size: 1em; font-family: tahoma; color: #000000; }

.fontGeorgia { font-family: Georgia, times, 'times new roman', serif; }

.styleI { font-style: italic; }

.styleB { font-weight: bold; } 
 
div.center  { width: 80%; margin-left: auto; margin-right: auto; }

div.clear { clear:both; }
 
.suffix { text-align: left; padding: 10px 0px 10px 25px; width: 33%; vertical-align: top; }
.green { background-color: #CCFFCC; }
.yellow{ background-color: #FFFFCC; }
.grey{ background-color: #999999; }
 
 /* PHOTO GALLERY CSS BELOW THIS */

.container {
    background:#ddd;
    margin:20px auto;
    padding:20px;
    position:relative;
    width:700px;

    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;

    box-shadow:1px 1px 5px #111;
    -moz-box-shadow:1px 1px 5px #111;
    -webkit-box-shadow:1px 1px 5px #111;
}

/* css3 photo gallery styles */
.gallery {
    width:610px;
    margin:0 auto;
}
.gallery a {
    display:inline-block;
    height:150px;
    position:relative;
    width:200px;
}
.gallery a img {
    border:5px solid blue;
    cursor:pointer;
    display:block;
    height:100%;
    left:0px;
    position:absolute;
    top:0px;
    width:100%;
    z-index:1;

    -moz-user-select: none;
    -khtml-user-select: none;
    user-select: none;

    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;

    -webkit-transition-property:width, height, top, bottom, left, right, z-index, border;
    -webkit-transition-duration:0.5s;
    -moz-transition-property:width, height, top, bottom, left, right, z-index, border;
    -moz-transition-duration:0.5s;
    -o-transition-property:width, height, top, bottom, left, right, z-index, border;
    -o-transition-duration:0.5s;
    transition-property:width, height, top, bottom, left, right, z-index, border;
    transition-duration:0.5s;
}
.gallery a:focus img {
    border:15px solid red;
    cursor:default;
    height:250%;
    position:absolute;
    width:250%;
    z-index:25;

    box-shadow:1px 1px 5px #888;
    -moz-box-shadow:1px 1px 5px #888;
    -webkit-box-shadow:1px 1px 5px #888;
    -webkit-transition-property:width, height, top, bottom, left, right, z-index, border;
    -webkit-transition-duration:0.5s;
    -moz-transition-property:width, height, top, bottom, left, right, z-index, border;
    -moz-transition-duration:0.5s;
    -o-transition-property:width, height, top, bottom, left, right, z-index, border;
    -o-transition-duration:0.5s;
    transition-property:width, height, top, bottom, left, right, z-index, border;
    transition-duration:0.5s;
}

/* custom focus rules */
.gallery a:focus:nth-child(3n+1) img {
left:150px;
}
.gallery a:focus:nth-child(3n+2) img {
    left:-50px;
}
.gallery a:focus:nth-child(3n+3) img {
    left:-250px;
}
.gallery a:focus:nth-child(-n+3) img {
    top:140px;
}
.gallery a:focus:nth-child(n+7) img {
    top:-150px;
}
.gallery a:focus:nth-child(n+10) img {
    top:-295px;
}

/* extra close layer */
.gallery .close {
    background:transparent;
    cursor:pointer;
    display:none;
    height:352px;
    left:170px;
    position:absolute;
    top:160px;
    width:500px;
    z-index:30;
}
.gallery a:focus ~ .close {
    display:block;
}