﻿/*
IITS CSS Layout licensed under the Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported (http://creativecommons.org/licenses/by-nc-nd/3.0/)
*/

body
{
	background-color:silver;
	background-image:url('../img/bg.jpg');
	/*background-image:url('../img/logo.png'); background-repeat:no-repeat; background-position:5% -20%;*/
	
	font-family:Verdana, Geneva, Tahoma, sans-serif;
	font-weight:500;
	color:silver;
	text-shadow:0 0 5px #333;
}

img
{
	border:none;
}

#logo
{
	position:fixed;
	top:5%; left:0px;
	height:175px; width:402px;
	background-image:url('../img/logo.png'); background-repeat:no-repeat; background-position:center;
	opacity:0.5;
	
	z-index:2;
}

#screen
{
	position:fixed;
	top:0px; bottom:60px; left:0px; right:0px;
	background-color:rgba(0, 0, 0, 0.2);
	
	z-index:3;
}

#video
{
	position:fixed;
	top:50%; left:50%;
	margin-top:-384px; margin-left:-512px;
	max-height:768px; height:95%; width:1024px;
	/*top: 0px; bottom: 0px; left: 0px; right: 0px;*/	

	opacity:0.5;
	
	overflow:hidden;
	
	z-index:1;
}

	#video-toggle
	{
		position:fixed;
		font-size:x-small;
		z-index:8;	
	}
	
		#video-toggle:hover
		{
			text-decoration:underline;
			cursor:pointer;
		}


.navigation-locs
{
	display:none;	
}

#navigation
{
	position:fixed;
	bottom:0px; left:0px; right:0px;
	height:60px;
	background-color:rgba(16, 16, 16, 0.7);
	
	z-index:8;
}

	#navigation ul
	{
		position:relative;
		left:0px; right:0px;
		list-style:none;
		margin-left:20px;
		
		text-align:center;
	}
	
		#navigation ul li
		{
			display:inline;
			margin-right:20px;
						
			font-size:25px;
			text-align:center;
			color:silver;
		}
		
			#navigation ul li a
			{
				color:silver;
				text-decoration:none;
			}

		
			#navigation ul li a:hover
			{
				color:white;
				text-decoration:underline;
			}

#social
{
	position:fixed;
	top:10px; right:25px;
	
	z-index:8;
}

	#social img
	{
		opacity:0.8;	
	}

		#social img:hover
		{
			opacity:1.0;	
		}
		
#title
{
	position:fixed;
	bottom:80px; right:50px;
	
	font-size:70px;
	font-weight:normal;
	
	opacity:0.3;
	
	z-index:4;
}		
		
#page
{
	position:absolute;
	top:0px; bottom:60px; left:0px; right:0px;
	
	overflow-y:auto;
	overflow-x:hidden;
	
	z-index:4;
}

	#page-center
	{
		position:relative;
		float:left;
		left:50%;
	}	

		.page-container
		{
			position:relative;
			left:-50%;
			top:60px; bottom:60px;
			clear:both;
		}
		
		#news-container
		{
			position:fixed;
			top:20%; bottom:10%;
			left:5%;
			height:70%; width:60%;
			z-index:5;
		}
		
			#news
			{
				display:none;
				position:relative;
				width:30%;
				padding:1em;
				text-align:center;
				background-color:rgba(0, 0, 0, 0.9);
				z-index:6;
			}
			
				#news:hover
				{
					color:white;
					text-decoration:underline;
					background-color:rgba(255, 255, 255, 0.3);
					cursor:pointer;
				}

	.nav-box
	{
		display:inline-block;
		position:relative;
		top:10px; left:10px;
		margin-bottom:10px; margin-right:10px;		
		height:175px; width:175px;
		
		background-color:rgba(0, 0, 0, 0.5);
		
		z-index:7;
		
		font-size:25px;
		text-align:center;
		text-decoration:none;
		text-shadow:0 0 5px #000;
		padding:1em;
		color:silver;
		
		cursor:pointer;

	}
	
		.nav-box:hover
		{
			color:white;
			text-decoration:underline;
			background-color:rgba(255, 255, 255, 0.3);
		}
		
		#home-aftercare-nav
		{
			background-image:url('../img/aftercare-cover.png'); background-position:center, bottom; background-repeat:no-repeat;
		}
		
		#home-gallery-nav
		{
			background-image:url('../img/cams-cover.png'); background-position:center, bottom; background-repeat:no-repeat;
		}
		
		#home-cams-nav
		{
			background-image:url('../img/cams-cover.png'); background-position:center, bottom; background-repeat:no-repeat;
		}
		
		#home-about-nav
		{
			background-image:url('../img/about-cover.png'); background-position:center, bottom; background-repeat:no-repeat;
		}



	
	.nav-tile
	{
		display:inline-block;
		position:relative;
		top:10px; left:10px;
		margin-bottom:10px; margin-right:10px;		
		height:100px; width:100px;
		
		background-color:rgba(0, 0, 0, 0.5);
		
		z-index:7;
		
		font-size:25px;
		text-align:center;
		color:silver;
		
		cursor:pointer;

	}
	
		.nav-tile:hover
		{
			color:white;
			text-decoration:underline;
			background-color:rgba(255, 255, 255, 0.3);
		}

	
#loading
{
	display:none;
	position:absolute;
	top:10px; left:50%;
	margin-left:-10%;
	width:20%; height:40px;
	
	font-size:x-large;
	text-align:center;
	
	z-index:9;
}	

#content
{
	display:none;
	position:absolute;
	top:50%; left:50%;
	margin-top:-35%; margin-left:-40%;
	height:70%; width:80%;
	
	background-color:rgba(0, 0, 0, 0.8);
	
	z-index:7;
	
	clear:both;
}

	#content-close
	{
		position:relative;
		height:30px; width:30px;
		float:right;
		
		font-size:xx-large;
		color:silver;
		z-index:8;
	}
	
		#content-close:hover
		{
			color:white;
		}
		
.lightbox
{
	display:inline-block;
	width:auto; height:auto;
	min-width:300px; min-height:300px;
	background-color:rgba(0, 0, 0, 0.6);
}

.textbox
{
	position:relative;
	display:inline-block;
	padding:1em;
	left:25%;
	width:50%; height:auto;
	background-color:rgba(0, 0, 0, 0.6);
}

#home-right-nav
{
	position:fixed;
	top:15%;
	right:10%;
}

	#supersized-loader { position:absolute; top:50%; left:50%; z-index:10; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background-color:#111; background:rgba(0,0,0,0.8) url(../img/progress.gif) no-repeat center center; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
	
	#supersized { position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
		#supersized img{ width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
			#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
			#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/
		
		#supersized a { z-index:-30; position:absolute; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111;}
			#supersized a.prevslide { z-index:-20; }
			#supersized a.activeslide { z-index:-10; }
			#supersized a.prevslide img, #supersized a.activeslide img{ display:inline; }
	
	/*Controls Section*/
	#controls-wrapper { position:fixed; height:62px; width:100%; bottom:65px; left:0; z-index:4; /*background:url(../img/nav-bg.png) repeat-x; position:fixed;*/ }
		#controls { overflow:hidden; height:100%; text-align:left; z-index:5; padding:0 114px; /* Increase padding to give thumbnails room */ }
			#slidecounter { float:left; color:#888; font:23px "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:bold; text-shadow:#000 0 -1px 0; margin:19px 10px 18px 20px; }
			#slidecaption { overflow:hidden; float:left; color:#FFF; font:16px "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:bold; text-shadow:#000 0 2px 0; margin:23px 20px 23px 0; }
			#gallery-navigation { float:right; margin:10px 20px 0 0; }
	
	/*Thumbnail Navigation*/	
	#nextthumb,#prevthumb { z-index:6; display:none; position:fixed; bottom:65px; height:75px; width:100px; overflow:hidden; background:#ddd; border:2px solid #fff; -webkit-box-shadow:0 0 5px #000; }
		#nextthumb { right:12px; }
		#prevthumb { left:12px; }
			#nextthumb img, #prevthumb img { width:150px; height:auto;  }
			#nextthumb:active, #prevthumb:active { bottom:65px; }
			#gallery-navigation > :hover,#nextthumb:hover, #prevthumb:hover { cursor:pointer; }			
		
	
	
