@charset "windows-1252";
/* author: wanda smith */
/* Creation date: 3/27/10 */ 
							   

/*may want to change margins later*/

body {background-color:#000080;
font-family:arial, helvetica,"sans serif";
font-size:12px normal;  
text-align:center;


}
 
 #page{
 margin:5px auto;/* adding auto for centering content on the page for FF*/
 width:800px;/*width of main container for centering on FF*/
 padding:10;
 border:5px red solid; 
 background-color:#ffffff; 
 height:auto;
 
}

 
/*to fill top area you need to nest inside this id - div (Orange)settingmargin bottom is what gave space at the bottom of this cell*/	

#top1{ 

    padding:10px 10px 5px 10px;
	margin:5px 10px 10px 30px;
    background-color: #ffffff;
    display:inline;top:20px;
	
	} 
	
#top{ text-align:center; 
    padding:10px 10px 10px 10px;
	margin:5px 10px 10px 30px;
    background-color: #ffffff;
    display:inline;top:20px;	
	border:0px green solid;
	}
 

 /*What national has to offer you Title*/
#h1
 {background-color:navy;
margin-left:175px;
margin-top:3px;
padding-top:1px;
padding-bottom:1px;
/*added this to get rid of maincontent*/
text-align:center;
font-weight:bold;
color:white;
border:1px double navy;
font-size:14pt;
width:550px;}


#h2
 {background-color:white;
color:red;
text-align:center;}	

h2.allothers
{background-color:white;
color:red;
text-align:center;
margin-left:155px;
margin-top:13px;
padding-top:1px;
padding-bottom:1px;
display:block;
}


#logo{
text-align:center; 
padding:10px 10px 10px 10px;
margin:5px 10px 10px 30px;
display:block;top:20px;
border:0px green solid;}

/*this keeps the links dispayed in the right order Padding keeps space at the top of the links*/	

#nav{background-color:#ffffff;
margin:0px 2px 10px 10px;
padding-top:1px; 
/*trying to get nav to work newest stuff added*/
float:left;
width:150px;
display:block;
height:auto;
border:0px green solid;
padding-right:10px; } 

#maintext
{margin-right:5px;
margin-left: 10px;
padding-top:10px;
width:auto;	
height:auto;
border:0px black solid;	

}


  

div.mainlinks a {display:block;
font-size:12px;
text-decoration:none;
text-align:center;
padding: 2px 5px;
color:red;
border:1px double #cc0000;
font-weight:bold;
}

div.mainlinks a:link {
display:block;
font-size:12px;
text-decoration:none;
text-align:center;
padding: 2px 5px;
color:red;
border:1px double #cc0000;
font-weight:bold;
background:navy;
color:white
}
div.mainlinks a:visited {
display:block;
font-size:12px;
text-decoration:none;
text-align:center;
padding: 2px 5px;
color:red;
border:1px double #cc0000;
font-weight:bold;
background:navy;
color:white
}
div.mainlinks a:hover {
display:block;
font-size:12px;
text-decoration:none;
text-align:center;
padding: 2px 5px;
color:red;
border:1px double navy;
font-weight:bold;
background:#cc0000;
color:white;
}  

h2.smheaders{ 
font-size:12pt;
background-color :navy;
color:#ffffff;
padding-left:3px;
text-align:center;
width:550px;
display:block;
margin-left:155px;
}
 
h4.smheaders{
background-color :navy;
color:#ffffff;
padding-left:3px;
text-align:center;
width:550px;
display:block;
margin-left:155px;
}
 
#list{
list-style-image: url(./images/star3.gif);
list-style-position: outside;
text-indent: 1px;
color:navy; 
font-weight:400;
font-size:normal;
vertical-align: middle;
line-height: 1.5em;
width:auto;
margin-left:155px;
margin-top:13px;
text-align:left;
border:0px purple solid;
}
  
#list2{
text-indent: 1px;
color:navy; 
font-weight:400;
font-size:12pt;
vertical-align: middle;
line-height: 1.5em;
width:auto;
margin-left:155px;
margin-top:13px;
} 


#list
a:link
{ color:red;} 
  
#bottomnav{
text-align:center;
font-size:x-small; 
color:navy;
padding:10px;
padding-bottom:15px;
border:0px teal solid;
} 

p.maintext a:link
{ color:red;}

p.maintext{color:navy;
text-align:left;
text-indent:30px;
font-size:normal;
width:auto;
margin-left:155px;
}

p.customertestname
{color:navy;
text-align:right;
font-size:normal;
width:520px;
margin-left:155px; 
font-weight:bold;
}


div.line {text-align:center;
padding:10px;
 margin-left:13px;
} 
 
 p.maintext2{color:navy;
text-align:center;
text-indent:15px;
font-size:normal;
padding-top:20px;
width:550px;
font-weight:bold;
}

p.maintext3{color:navy;
text-align:center;
padding-top:20px;
width:550px;
font-weight:bold;
}

p.cards { text-align:center;
}  


 /* The containing box for the gallery. */
#container {
    position:relative;
    width:550px;
    height:auto;
    margin:20px auto 0 auto;
    border:1px solid #aaa;
    }

	/* Removing the list bullets and indentation */
#container ul {
    padding:0;
    margin:0;
    list-style-type:none;
    }

	
	/* Remove the images and text from sight */
#container a.gallery span {
    position:absolute;
    width:1px;
    height:1px;
    top:-1px;
    left:-1px;
    overflow:hidden;
    background:#fff;
    }
  
	
	/* Adding the thumbnail images */
#container a.gallery, #container a.gallery:visited {
    display:block;
    color:#000;
    text-decoration:none;
    border:1px solid #000;
    margin:1px 2px 1px 2px;
    text-align:left;
    cursor:default;
    }
#container a.slidea {
    background:url(./images/examples/2_27_1Before_thumb.jpg);
    height:113px;
    width:150px;
    }
#container a.slideb {
    background:url(images/examples/2_27_4Before_thumb.jpg);
    height:113px;
    width:150px;
    }
#container a.slidec {
    background:url(images/elephantTh.jpg);
    height:93px;
    width:60px;
    }	
	
	* html #container a.slidec {
    width:91px;
    w\idth:93px;
    }
#container a.slided {
    background:url(images/barsceneTh2.jpg);
    height:60px;
    width:93px;
    }

#container a.slidee {
    background:url(images/carrideTh2.jpg);
    height:60px;
    width:93px;
    }
#container a.slidef {
    background:url(images/susanandannieTh2.jpg);
    height:60px;
    width:93px;
    }
* html #container a.slidef {
    width:91px;
    w\idth:93px;
    }
#container a.slideg {
    background:url(images/windowsceneTh2.jpg);
    height:60px;
    width:93px;
    }
#container a.slideh {
    background:url(images/castTh.jpg);
    height:93px;
    width:60px;
    }
#container a.slidei {
    background:url(images/rockcityposterTh.jpg);
    height:93px;
    width:60px;
    }
#container a.slidej {
    background:url(images/southernmostpointTh.jpg);
    height:93px;
    width:60px;
    }
#container a.slidek {
    background:url(images/cast2Th2.jpg);
    height:60px;
    width:93px;
    }
* html #container a.slidek {
    width:91px;
    w\idth:93px;
    }
#container a.slidel {
    background:url(images/carTh2.jpg);
    height:60px;
    width:93px;
    }
 
	
	/* set the size of the unordered list to neatly house the thumbnails */
#container ul {
    width:198px;
    height:386px;
    }
#container li {
    float:left;
    }

	
	/* move the thumbnails into the correct position */
#container ul {
    margin:5px;
    float:right;
    }

	
	/* change the thumbnail border color */
#container a.gallery:hover {
    border:1px solid #fff;
    }

	
	/* styling the :hover span */
#container a.gallery:hover span {
    position:absolute;
    width:372px;
    height:372px;
    top:10px;
    left:75px;
    color:#000;
    background:#fff;
    }

	
	#container a.gallery:hover img {
    border:1px solid #fff;
    float:left;
    margin-right:5px;
    }

	
	#container a.slideb:hover img, #container a.slidei:hover img {
    float:right;
    }

	
	#container {
    background:#fff url(images/Susan6.jpg) 75px 10px no-repeat;
    }  
	
	
	
  /*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
	
	.gallerycontainer{
position: relative;
height: 263px;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid white;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: black;
padding: 5px;
left: -1000px;
border: 1px solid gray;
visibility: hidden;
color: white;
text-decoration: none;

}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible; 
left: 230px; /*position where enlarged image should offset horizontally */
z-index: 50;
}