/*-----------------------------------------------------------------------------
date:      012/11/09
author:    Adam McAmis
email:     adam@no-refuge.com

website:   http://no-refuge.com */

/* Remove margin, padding and border from everything
-----------------------------------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
	border: 0;
}


/* Styles for layout
-----------------------------------------------------------------------------*/

.clear {
	clear:both;
}

.right {
	float: right;
}

.left {
	float: left;
}

/* Set up the document-----------------------------------------------------------------------------*/

body {
	font: 62.5%/1.5  "helvetica", "Arial", Verdana, sans-serif;
	background: white;
	
}

#page{
	width:100%;
	height:100%;
	background:url(images/catfish_bg.jpg) no-repeat;
	background-position: top center;
}



#header img{
	float:left;
}

	#header{
	width:985px;
	height:285px;
	margin:0px auto;
	padding:0 20px 0 0;
}
#social img{
	padding:2px;
}
#social{
	padding:250px 0 0;
	float:right;
}
	


#welcome{margin:0 0 30px 0;
	z-index:0;
	
}

	 
	 #welcome_overlay{
position:absolute;
font-size:25px;
top:25px;
left:25px;
width:835px;
height:30px;
padding:10px 0 5px 10px;
	background: #0f0f0f;
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
z-index:1;

	}

#wrapper{

	width:990px;
		margin:0px auto;
		background:url(images/wrapper_bg.jpg) no-repeat;
	background-position: top center;

}
.hr{
	display:block;
	margin:0px auto;}
	
	#contentbg {	

		width:850px;
		padding: 25px;
	
	}
	
		#content {
			background:url(images/content.jpg) no-repeat;
		background-position:0% 0%;
		position:relative;
		text-align:left;
	width:900px;
		height:1080px;
		margin:0px auto;
		margin-top:15px;
	

	overflow:hidden;
}
	#right_colum{
		min-height:400px;
		float:left;
		background:url(images/vertical_rule.png) no-repeat;
		background-position:top left;
		padding:0 0 0 20px;
		margin:0px 0 0 20px;
	}
	#new{
		width:560px;
		float:left;

	}
	
	#new h3{
		margin:0 0 10px 0;
		width:266px;
		height:25px;
		background:url(images/newest.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
			}		
			
			#equip h1{
		margin:0 0 15px 0;
		width:281px;
		height:29px;
		background:url(images/services.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
			}	
			#drums h1{
		margin:0 0 15px 0;
		width:141px;
		height:23px;
		background:url(images/studiotour.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
			}	
			
			#contactmain span{
				text-align:right;
				width:220px;
				height:300px;
				float:left;
				font-size:17px;
				font-weight:100;
			}
				#contactmain a{
					color: #194b69;
				}#contactmain a:hover{
					color: #f38a39;
				}
					#contactmain{
					background:url(images/getintouch.jpg) no-repeat;
			background-position:top left;
				margin-top:30px;
		width:540px;
		height:360px;
		float:left;
		padding:20px 10px 0;

	}
	
	#contactmain h3{
			text-indent:-9999px;
			}
		#equip{
		background:url(images/spacer.png) no-repeat;
			background-position:top center;
		}
	#services{
		padding:0 10px ;
		width:370px;
		height:920px;
	background:url(images/equip1.jpg) no-repeat;
	float:left;
	margin-right:70px;
font-size:12px;
	color:white;

}	
#services h2{
	margin-top:7px;
	color:white;
	font-size:15px;
}#services h3{
	padding:10px 0 0 0;
		color:white;
	font-size:18px;
}#equipment h3{
	padding:5px 0 10px;

			color:#60a9cc;
	font-size:18px;
}
#equipment{
		width:370px;
		height:600px;
	background:url(images/equip2.jpg) no-repeat;
	float:left;
padding:5px 10px;
	font-size:15px;
	color:#60a9cc;


}


#clients,
#main,
#contact,
#equip,
#drums, #vocal, #live, #control{
	height:1280px;
}
#clients h1{		margin:0 0 25px 0;
		width:120px;
		height:23px;
		background:url(images/ourwork.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;}
			#clientsleft{
				width:380px;
				float:left;
				margin-right:15px;
			
			}
			#clientsright{
						width:455px;
	
	
				float:left;
			}
			#clientsleft h3{
						width:333px;
		height:24px;
		background:url(images/audiosamples.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
		}
		
		
		
		h3#artists{
						width:333px;
		height:25px;
		background:url(images/artists.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
		}	h3#testimonials{
		
						width:333px;
		height:25px;
		background:url(images/testimonials.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
		}
		#artistlist{
			padding:12px;
			margin:14px 0 10px;
			width:455px;
			height:250px;
			background:url(images/artistsbg.png) no-repeat;
		}
			#artistlist ul{
				font-size:15px;
				
				padding: 0 0 0 15px;
				float:left;
				}
			
			
			
			#artistlist img{
				margin:3px 0 0 0;
				float:left;
			}
		#clientsplayer{
			margin:15px 0 0;
			width:380px;
			height:627px;
					background:url(images/playerbg.jpg) no-repeat;
			background-position:top;
		}
		#tour{
		margin:0px auto;
	
	}
	#tour h1{
			margin:0 0 10px 0;
		width:141px;
		height:23px;
		background:url(images/studiotour.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
		}
	#drums{
					width:848px;
			background:url(images/drumbg.jpg) no-repeat;
		}#vocal{
					width:848px;
			background:url(images/voxbooth.jpg) no-repeat;
		}#live{
					width:848px;
			background:url(images/liveroom.jpg) no-repeat;
		}#control{
					width:848px;
			background:url(images/controlbg.jpg) no-repeat;
		}
		.enlarge{
			margin:10px;
			width:168px;
			height:20px;
			
			float:right;
		}
		.studiomap{
			width:345px;
			margin:400px 0 0 30px;
			float:left;
		}
		
h3#drumheader{
		background:url(images/drumroom.png) no-repeat;
	}
	h3#controlheader{
		background:url(images/controlroom.png) no-repeat;
		}
		
h3#liveheader{	background:url(images/liveroom.png) no-repeat;
}

h3#vocalheader {	background:url(images/vocalbooth.png) no-repeat;
	
	
	
}

h3#drumheader,
h3#controlheader,
h3#liveheader,
h3#vocalheader{
	margin:0 0 10px;
	width:300px;
	height:25px;
	background-position:top left;
	text-indent:-9999px;
}
		
		
		
		
		
		
		.roomdesc{
			font-size:15px;
			width:400px;
			float:left;
					margin:450px 0 0 30px;
	
		}
		
		#mediaspace{
			padding:5px;
		}
/*BLOCKQUOTE -------------*/
	
#quote	 {
	float:left;
		width:230px;
  font: 18px Georgia, serif;
  text-align:justify;

  padding: 35px 10px 0px 10px;
  background-color: #dce5e9 !important;
  background-image: url(images/openquote.png);
  background-position: top left;
  background-repeat: no-repeat;

  }
#quote span {
    	display: block;
    	background-image: url(images/closequote.png);
    	background-repeat: no-repeat;
    	background-position: bottom right;
  	}
	#quote img{
		margin-top:-5px;
		padding:0 10px 15px 0;
		float:left;
	
	}.tests	 {
	float:left;
		width:435px;
		
  font: 13px Georgia, serif;
  text-align:justify;

  padding: 28px 10px 0px;
  margin:15px 0 0 0;
  
  background-image: url(images/testsbg.jpg);
  background-position: top left;
  background-repeat: no-repeat;

  }
  .bottomquote{
float:left;
	    width:454px;
		height:25px;
  background-image: url(images/bottomquote.jpg);
  background-position: top left;
  background-repeat: no-repeat;
	  }
.tests p{
	margin:10px 0 0 0;
	font-size:15px;
}
	.tests img{
		margin:0 0 0 190px;
		padding:0 10px 0px 0;
		float:left;
	
	}
	
	#imgright{
		float:right;
	}

/* CONTACT PAGE-------------------------------------------------*/
#contact p{
	font-size:16px;

}
#contact{
	padding:0 15px;
}

#contact h1{
			margin:0 0 15px -15px;
		width:141px;
		height:23px;
		background:url(images/contactus.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
}
h3#emailhdr{
			margin:10px 0 5px 0;
		width:135px;
		height:27px;
		background:url(images/emailhdr.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
}h3#phonehdr{
			margin:15px 0 5px 0;
		width:135px;
		height:27px;
		background:url(images/phonehdr.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
}h3#locationhdr{
			margin:15px 0 5px 0;
		width:135px;
		height:27px;
		background:url(images/locationhdr.png) no-repeat;
			background-position:top left;
			text-indent:-9999px;
}

#contactleft iframe{margin: 0 0 0 -20px;

	
}
#contactleft{
	margin:20px 40px 0 0;
	width:255px;
	padding: 0 20px;
	height:825px;
	float:left;
		background:url(images/mapbg.jpg) no-repeat;
		font-size:18px;
	}
	
/* Typography-----------------------------------------------------------------------------*/
a {
	color:black;
	text-decoration: none;
}
a:hover{
color:#C82C2A;
}
	


h1 {
	color:#C82C2A;
	font-size: 4.0em; /* Equivalent to 20pt */
	line-height:.8em;

}
	h2 {

}
h3 {
	color:#2D2823;
	font-size: 2.0em; /* Equivalent to 20pt */
	line-height:.8em;
}
	
h4 {

	color:#2D2823;
	font-size: 1.3em; /* Equivalent to 18pt */
}

h5 {
	display:inline;
	font-size: 1.4em; /* Equivalent to 14pt */
}

h6 {
	display:inline;
}

p, q, cite {
	font-size: 1.4em; /* Equivalent to 12pt */
}

ul, ol, dl {
	list-style: none;
	
}

li, dd, dt {

}



	

/* Navigation-----------------------------------------------------------------------------*/

#nav{

margin:10px 0 0 0 ;
   float:left;
   width:100%;
height:40px;
   overflow:hidden;
   position:relative;

}

#mainNav {	

   float:left;
   list-style:none;

   position:relative;
   left:50%;


}
#mainNav li {   display:block;
   float:left;


   position:relative;
   right:50%; }

#mainNav li a {
display:block;
	text-indent:-9999px;
	height:40px;
	background:url(images/nav.png) no-repeat;
}
#mainNav li.home a {
	width:125px;
	background-position: 0px 10px; 
	}
	
#mainNav li.home a:hover{
	background-position:0px -35px;
}

#mainNav li.work a { 
	width:125px;
	background-position: -20px -81px; 
	}
	#mainNav li.work a:hover{
	background-position:-20px -126px;
}
#mainNav li.studio a { 
	width:140px;
	background-position: -20px -172px; 
	}
	#mainNav li.studio a:hover{
	background-position:-20px -217px;
}
	
#mainNav li.equipment a { 
	width:260px;
	background-position: -15px -264px; 
	}	
	#mainNav li.equipment a:hover{
	background-position:-15px -307px;
}
#mainNav li.contact a { 
	width:110px;
	background-position:-25px -361px; 
	}
		#mainNav li.contact a:hover{
	background-position:-25px -404px;
}
	/* Footer ---------------------------------------------------------*/
	
 #footer{
	 margin:0px auto;
	 height:43px;
	 padding: 200px 75px 0;
	 width:750px;
	   background-image: url(images/footerbg.jpg);
  background-position: top left;
  background-repeat: no-repeat;
  font-size:13px;
  color: #60a9cc;
  }
  #footer span{
	  float:right;
  }


/*Contact Form-----------------------------------------------------*/
#contactright{
		padding:40px 0 0 182px;
	margin:15px 0 0 0;
	width:303px;
	height:825px;
	float:left;
		background:url(images/contactformbg.jpg) no-repeat;
		font-size:18px;
	}
#contact input,#contact textarea
{
	border:none;
	height:25px;
	width:230px;
	float:left;
	margin:0 0 40px 0;
	 background-color: transparent;
}


#comments{
	min-width:280px;
	min-height:300px;	
	max-width:280px;
	max-height:300px;
}

	
#contact label
{
display:none;
}



.phpbutton:hover {
		cursor: pointer; 
	}
	
.phpbutton {
	width:100px !important;
	height:50px !important;
	margin:10px 0 0 0;
	float:left;

}

/*-----Main Contact---------------------------*/
.fronttext

{
	height:20px;
	width:200px;
	 background-color: transparent;


	margin: 15px 0 15px 30px;

	
}

#contactmain textarea{	
	float:left;
	margin: 15px 0 0 30px;
	min-width:200px;
	min-height:135px;	
	max-width:200px;
	max-height:135px;
 background-color: transparent;

}

	
#contactmain label
{
	float:left;

}


.button{
	width:90px;
	height:40px;
margin:20px 0 0 140px;
 background-color: transparent;
color:white;

}
.button:hover{
	cursor: pointer;
}



 /*What;'s  new slider-----------------*/
 #jFlowSlide{ background:#dce5e9; font-family: Georgia; }  
#myController { font-family: Georgia; padding:2px 0;  width:560px; background:#60a9cc; }  
#myController span.jFlowSelected { background:#3e88ab;margin-right:0px; }  
  
.slide-wrapper { padding: 8px 8px 0px;}  
.slide-thumbnail { width:270px; float:left; }  
.slide-thumbnail img {max-width:270px; }  
.slide-details { width:260px; float:right; margin-left:10px;}  
.slide-details h2 { font-size:1.5em; font-style: italic; font-weight:normal; line-height: 1; margin:0; }  
.slide-details .description { margin-top:10px; }  
  
.jFlowControl, .jFlowPrev, .jFlowNext { color:#FFF; cursor:pointer; padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px; }  
.jFlowControl:hover, .jFlowPrev:hover, .jFlowNext:hover { background: #6bbfe7; } 
