/*This is a comment*/

/*sets background color for html and body so you can use percentage width and height*/
html, body
{
background-color:#E81919;
}

h3
{
text-align:center;
}

.header
{
text-align:center;
font-family:Arial,'DejaVu Sans','Liberation Sans',Freesans,sans-serif;
font-size:125%;
margin:10%;
}

.maintext
{
font-family:'Bookman Old Style',Bookman,'URW Bookman L','Palatino Linotype',serif;
font-size:110%;
margin:5%;
text-align:justify;
}
 
.maintext h3
{text-align:left;}


/*Banner slash header with lower drop shadow, contains nav*/
.banner
{
top:0;
left:0;
width:100%;
position:fixed;
margin-left:auto;
margin-right:auto;
            -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
               -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    height:100px;
                    background-color:#E81919;
                    z-index:5
        }
        
.banner img
{
position:relative;
left:25px;
top:15px;
padding:10px;
  -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
               -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                
}
/*End Banner*/


/*Nav Lobby*/
ul.nav{
	list-style:none;
	font-weight:bold;
	margin-bottom:10px;
	clear:both;
	float:left;
	top:15px;
	position:relative;
	z-index:3;
	
	}
ul.nav li{
	float:left;
	margin-right:10px;
	position:relative;
	      -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);   
               -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
                    box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
                    
            

}
ul.nav a{
	display:block;
	padding:5px;
	background-color:#FFFFFF;
	color:#E81919;
	text-decoration:none;
	
}
ul.nav a:hover{
	background:#ffffff;
	color:#E81919;
	text-decoration:underline;
}
/*End Nav Lobby*/


/*Nav 2nd Floor*/
ul.nav li ul.nav2
{
	background:#FFFFFF; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	left:-8000px; /* Hide off-screen when not needed (this is more accessible than display:none;) */\
	z-index:5;
}

ul.nav li ul.nav2 li
{
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:left; /* DALE, IS THIS WHAT YOU THINK THE PROBLEM IS, THAT MY NESTED LIs AREN'T FLOATED? */
	display:inline-block;
	width: 175px;
	border:1px solid #E81919;
	        -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);   
               -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
                    box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
}

ul.nav li ul.nav2 a
{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}

ul.nav li:hover ul.nav2
{ /* Display the dropdown on hover */
	left: 0; /* Bring back on-screen when needed */
}

ul.nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background:#FFFFFF;
	text-decoration:underline;
}

ul.nav li:hover ul.nav2 a
{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
}
ul.nav li:hover ul.nav2 li a:hover
{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background:#FFFFFF;
}
/*End Nav 2nd Floor*/


/*Nav 3rd Floor*/
ul.nav li ul.nav2 li ul.nav3
{
	background:#FFFFFF; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	color:#E81919;
	position:absolute;
	left:-8000px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
	margin: -24px 0 0 61px;
	z-index:6;
}

ul.nav li ul.nav2 li ul.nav3 li
{
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:left; /* DALE, IS THIS WHAT YOU THINK THE PROBLEM IS, THAT MY NESTED LIs AREN'T FLOATED? */
	width: 175px;
	border:1px solid #E81919;
	display:inline-block;
	        -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);   
               -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
                    box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
	
}

ul.nav li ul.nav2 li ul.nav3 a
{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}

ul.nav li ul.nav2 li:hover ul.nav3
{ /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}

ul.nav li ul.nav2 li:hover a
{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background:#FFFFFF;
	text-decoration:underline;
}

ul.nav li ul.nav2 li:hover ul.nav3 a
{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
}

ul.nav li ul.nav2 li:hover ul.nav3 li a:hover
{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background:#FFFFFF;
}
/*End Nav 3rd Floor*/


/*Main Content Container*/

.main
{
width:1000px;
height:100%;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
z-index:-1;
-webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);   
               -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
                    box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
}

.mainpad
{
height:100px;
}
/* End Main Content Container*/

/*Gallery*/

.gallery
{
margin-left:auto;
margin-right:auto;
width:70%;
padding:20px;
}

.bigimage
{
height:420px;
width:700px;
border:10px solid red;
}

.bigimage p
{
text-align:center;
}

.bigimage img
{
height:400px;
border:5px solid black;
margin-top:5px;
margin-left:150px;
margin-right:150px;
}

.text
{ 
height:200px;
width:700px;
border:2px solid red;
overflow:auto;
}
.text p
{
text-align:justify;
font-family:'Bookman Old Style',Bookman,'URW Bookman L','Palatino Linotype',serif;
margin-left:20px;
margin-right:20px;
font-size:125%;
}

.thumbs 
{
height:65px;
width:700px;
border-right:2px solid red;
border-left:2px solid red;
text-align:center;
}

.thumbs2 
{
height:65px;
width:700px;
border-right:2px solid red;
border-left:2px solid red;
text-align:center;
}

.thumbs2 img
{
position:relative;
width:40px;
border:1px solid black;
}

.thumbs img
{
position:relative;
width:65px;
border:1px solid black;
}
/*End Gallery*/