/* 
	Photo layout - basic styles
*/

body, html{
	margin:0; padding:0;
	width:100%;  height:100%;
	font-family: Arial, Helvetica, sans-serif;
	color: #333;
	font-size:12px;
	background: #F9F9F9 url('../images/bg/page.jpg') repeat-x;
	font-family:"Trebuchet MS",Sans-serif;

}

#wrap{
}

#page{
	width: 100%;
	margin:0; 
	padding:0;
}

/* Header Styles */

#header,
#header #menu,
#header #menu ul,
#header #menu li,
#header #menu li a:link,
#header #menu li a:visited,
#header #menu li li a:link,
#header #menu li li a:visited{
	z-index:2000;
}

#header{
	display:block;
	width:977px;
	margin:0 auto; padding:45px 0 0 0;
	position:relative;
}
#header a{
	width:auto;
}
#header  #logo{
	position:relative;
	left:-8px;
	width:175px; height:33px;
	display:block;
	padding:0; margin:0;
	background:url('../images/tech/logo.gif') bottom left no-repeat;
	z-index: 2000;
	
}

#header #logo h1{ 
	display:none; 
}

#header .element,
#footer .element{
	z-index: 1000;
	position:relative;
	margin:0; padding:0;
}

#menu{
	position:relative;
	display:block;
	top:-10px; right:-5px;
	padding: 0; margin:0;	
	clear:both; float:right;
	position:relative;		
}

#menu li{
	list-style:none;
	padding: 0; margin:0;
	position:relative;
	float:left;
	
	
}

#menu li a span{
	display:none;
}	
#menu li a:link,
#menu li a:visited{
	position:relative;

	padding:0; margin:0;
	float:left;
	display:block;	
	height:11px;
	overflow:hidden;
	background-repeat:no-repeat;
}

#menu li a:hover,
#menu li a.selected:link,
#menu li a.selected:visited{
	background-position:bottom;
}

#menu #graphic-design{
	width:103px;
	background-image:url('../images/design.gif'); 

}

#menu #video-production{
	width:120px;
	background-image:url('../images/video.gif');
}

#menu #art-culture{
	width:79px;
	background-image:url('../images/art.gif');
}

#menu #music-collective{
	width:102px;
	background-image:url('../images/music.gif');
}


/* Content Area Styles */

#content{
	position:relative;
	clear:both;
	width: 100%;
	height:auto;	
	margin:0 auto; 
	padding:0;
	overflow:hidden;
}

#home{
	display:block;
	width:981px; height:500px;
	margin:0 auto; padding:0;
	position:relative;
	top:-5px;	
}

#homel{
	position:absolute;
	top:-10px;
	left:0px;
	
}

#homer{
	position:absolute;
	left:351px;
	top:0;
	width:585px;
	height:460px;
	background-color:#666;
	overflow:hidden;
	
}

.contbox{
	background-color:#000;
	border-left:35px solid #0099FF;
	margin:0 auto;
	position:relative;
	width:945px;
	height:435px;
	top:-10px;
}

.contbox h2{
	color:#0099FF;
	position:relative;
	top:40px;
	left:50px;
	text-transform:uppercase;	
	font-size:30px;
	font-weight:normal;
	letter-spacing:1px;
}

.tbody{
	position:absolute;
	top:75px;
	left:50px;
	color:#FFF;
	line-height:26px;
	font-size:13px;
	width:820px;
	
}

.tbody a:link,
.tbody a:visited{
	color:#FFF;
	text-decoration:none;
}


.tbody a:hover{
	color:#0099FF;	
}

.bluebox{
	width:342px; height:225px;
	background-color:#0099FF;
	color:#FFF;
	margin:0; 
	padding:0;
}

.bluebox .boxtext{
	position:relative;
	top:0;
	font-size:13px;
	line-height:18px;
	padding:0 25px 0 25px;
}
.bluebox h2{
	width:317px;
	height:40px;
	color:#0099FF;
	background-color:#000;
	line-height:40px;
	padding:4px 0 5px 25px;
	text-transform:uppercase;
	margin:10px 0 0 0;
}

.bluebox a{
	color:#FFF;
	text-decoration:none;
	font-style:italic;
}

.bluebar{
	position:absolute;
	top:0;
	right:0;
	width:35px;
	background-color:#0099FF;
	height:460px;
}

/*  Photo slide effect  */

.slide-effect{
	position:relative;
	margin:0 auto;
	width:977px;
	height:520px;
	overflow:visible;
}


.slide-effect .slide{
	position:absolute;
}

#loading-indicator{
	position:absolute;
	left:428px; bottom:-43px;
	width:100px; height:100px;
	/*background:url('http://static.legitify.com/img/loader_background_100x100.png') no-repeat; */
	background:transparent;
}

#loading-indicator img{
	position:absolute;
	top:28px; left:28px;
	width:25px; height:25px;
}

#prev-button, #next-button{
	position:absolute;
	bottom:8px;
	width:39px; height:24px;	
}

#prev-button{
	left:0; 
	background:url('../images/back.gif') no-repeat;
}

#next-button{
	right:0;
	background:url('../images/forward.gif') no-repeat;
}

#prev-button span, #next-button span{
	display:none;
}


/* Footer */

#footer{
	position:relative;
	width: 977px; top:5px;
	margin:0 auto; padding:0;
	clear:both;
	font-size:12px;

}

#footer .callout{	
	position:relative;
	top:15px;
	padding: 10px 0;
	text-align:left;
	text-transform:uppercase;
	color:#CCCCCC;
	width:46%;
	float:left;
}


#footer .menu{
	position:relative;
	top:3px;
	background-color: transparent;
	float:right;

}

#footer .menu ul {
	list-style:none;
}

#footer .menu ul li{
	float:left;
}
#footer .menu span{
	display:none;
}

#footer .menu a:link,
#footer .menu a:visited{
	display:block;
	height:11px;
	overflow:hidden;
	background-position:0 0;
}

#footer .menu li a:hover,
#footer .menu li a.selected:link,
#footer .menu li a.selected:visited{
	background-position:bottom;
}

#footer .menu #about{
	width:52px;
	background-image:url('../images/about.gif');
}
#footer .menu #clients{
	width:56px;
	background-image:url('../images/clients.gif');
}

#footer .menu #services{
	width:63px;
	background-image:url('../images/services.gif');
}
#footer .menu #contact{
	width:55px;
	background-image:url('../images/contact.gif');
}



#footer .siblings ul{
	margin:0 auto;
	width: auto;
}

#footer .siblings li{
	float:left;
}

#footer .siblings li a:link,
#footer .siblings li a:visited{
	padding: 5px 10px;
}

.random img{
	width: 640px;
	border: 1px solid white;
}


/* notifications */
.error{
	color:#FFF;
	background-color:#CC0000;
	padding:5px;
}
.notify{
	display:none;
	color:#FFF;
	background-color:#FF9900;
}


/*   forms   */
label{
	display:block;
	width:100px;
	float:left;
}

input, textarea{
	float:left; margin:2px 6px 10px 0;
	padding:2px; font-size:15px; 	
	font-family:"Trebuchet MS",Verdana, Sans-serif;
	border-top:1px solid #222;
	border-left:1px solid #222;
	border-bottom:1px solid #CCC;
	border-right:1px solid #CCC;
	width:300px;
}

.fieldwrap{
	clear:both;
}

.textareawrap{
	clear:both;
}


.checkboxwrap{
	clear:both;
	margin:5px 0 5px 100px;
}
.checkboxwrap input, .checkboxwrap label{
	width:auto; font-size:12px;
	cursor:pointer;
}

.signupfield{
	width: 150px;
}

.submit { clear:both; margin:0 0 0 100px; }
.submit input{ 
	width:auto;
	border-bottom:1px solid #222;
	border-right:1px solid #222;
	border-top:1px solid #CCC;
	border-left:1px solid #CCC; 
}

input.submit{
	float:left; width:auto; clear:none;
	font-size:13px;
	border-bottom:1px solid #222;
	border-right:1px solid #222;
	border-top:1px solid #CCC;
	border-left:1px solid #CCC;
	margin:2px 0 0 0;
}
.disabled{
	color:#888;
}

.clear{
	clear:both; 
	margin:0; padding:0;
	width:0; height:0;
}