/* =RESET
=------------------------------------*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline}:focus{outline:0}body{line-height:1;color:black;background:white}ol,ul{list-style:none}table{border-collapse:separate;border-spacing:0}caption,th,td{text-align:left;font-weight:normal}blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{quotes:""""}

/* =GENERAL
--------------------- */

	body{
		position:relative;
		background:#1d1d1d url(images/bg-body.jpg) repeat top left;
		font-family:Arial, Helvetica, sans-serif;
		color:#5d5d5d; 
	}
	
	h1{ margin-bottom:15px; font-size:30px; letter-spacing:-2px; }
	h2{ margin-bottom:15px; font-size:25px; letter-spacing:-1px; }
	
	blockquote{ 
		margin-bottom:15px; padding:5px 25px 0 45px;
		background: url(images/bg-quote.jpg) no-repeat top left;
		font-style:italic;  
	}

	p { margin-bottom:15px; }
	ul{ margin-bottom:15px; list-style: inside; }
	
	a { color:#0085CF; } 
	strong{ font-weight:700; }
	em{ font-style:italic; }
	
	
	/* Clear Fix Hack - add  class="fixed"  to div's that have floated elements in them */
	.fixed:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
		.fixed{display:block;}
		/*  \*/
		.fixed{min-height:1%;}
		* html .fixed{height:1%;}
	
	
/* =LAYOUT
--------------------- */
	
	#line-top{  position:absolute; left:0; top:53px; height:2px; background:url(images/bg-line-top.jpg) repeat-x top left; }
	
	#container{
		background-color:#ffffff; list-style:none;
		position:absolute; top:75px; left:0px;
		padding:25px 0;
		height:500px; /* ! height must be the same with the height of the pictures you will be using */  
	}
		
		#container li{}
		
			/* =NAVIGATION
			--------------------- */
			#container li.navigation{ 
				float:left; 
				height:500px;  /* ! height must be the same with the height of the pictures you will be using */
				width:320px; 
				margin-right:25px; 
				background-color:#EDEFF0; 
			}
		
				#logo{ margin-top:20px; margin-left:38px; }
				
				#nav{ list-style-type:none; margin-top:15px; margin-right:-7px; padding:15px 0 15px 15px; background:url(images/bg-nav.png) no-repeat top right; }
				#nav li{ float:left; padding:13px 0 0 10px; color:#ffffff; }
				#nav li a{ font-size:18px; color:#ffffff; text-decoration:none; letter-spacing:-0.5px; }
				#nav li a:hover { color:#fff; text-decoration:underline; }
				#nav li a.active{ color:#fff; text-decoration:underline; }
				
				#nav-galleries{ margin-top:40px; margin-left:25px; list-style: inside; list-style-type:none; }
				#nav-galleries li{ }
				#nav-galleries li a{color:#8b8989; font-size:22px; text-decoration:none; }
				#nav-galleries li a:hover { color:#000; }
				#nav-galleries li a.active{ color:#000; }
					
					
			/* =PHOTO
			--------------------- */		
			#container li.photo{ 
				float:left; position:relative; margin-right:25px; 
				height:500px; /* ! height must be the same with the height of the pictures you will be using */
			}
			
				#container li .photo-description{ 
					position:absolute; left:0; bottom:25px;  padding:10px 30px;
					background:url(images/bg-photo-description.png) repeat top left;
					color:#fff; font-size:16px; font-weight:700; 
				}
			
			/* =TEXT
			--------------------- */
			#container li.text{ 
				float:left; position:relative;  overflow:hidden; 
				margin-right:25px; width:270px; 
				height:425px; padding: 45px 30px 30px 30px; /* ! height must be height of the pictures - paddin-top - padding-bottom */ 
				background-color:#EDEFF0; font-size:14px; line-height:22px;
			}
								  
			#container li.service{ padding-top:0; height:470px; }	
			#container li.service img{ margin-bottom:25px; }				  
								
			/* =ENDING
			--------------------- */	
			#container li.ending{ 
				 position:relative; float:left; 
				 margin-right:0; 
				 width:80px; height:500px;  
				 background-color:#EDEFF0; 
			}	
		
	#line-bottom{ position:absolute; left:0; top:646px; height:2px; background:url(images/bg-line-bottom.jpg) repeat-x top left; }


/* =OTHER
--------------------- */
	
	/* =SOCIAL-MEDIA
	--------------------- */
	#social-media{ list-style:none; }
	#social-media li{ display:inline; }			
			
	/* =CONTACT-FORM
	--------------------- */
	form{}
		form p{ clear:both; margin-bottom:15px; text-indent:0px; }
		label{ width:150px; }
		input, textarea{ width:250px; border:1px solid #ccc; padding:5px; background-color:#fff; }
		textarea{ height:78px; }
		.btn{ margin-left:133px; width:120px; cursor:pointer; }	
		#formstatus{ font-size:11px;  font-weight:bold; }
			.formstatuserror{ color:#FF0000; }
			.formstatusok	{ color:#00CC33; }
						
	/* =HOVER-NAVIGATION
	--------------------- */
	#arrows{
		position:fixed; top:602px; left:68px; 
		width:90px; height:30px;
		/* IE6 Hack  as position fixed is not supported */
		_position: absolute;
		_top: expression( ( 602 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
		_left: expression( ( 68 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );

	}
	
		#arrows ul{ margin:0; padding:0; list-style:none; }
		#arrows ul li{ display:inline; margin:0; padding:0; width:20px; height:20px; }
		#arrows ul li a{ overflow:hidden; float:left; display:block;  margin-right:5px; width:20px; height:20px; cursor:pointer; text-indent:-9000px; }
		#arrows ul #left a{ background: url(images/bg-arrow-left.png) no-repeat top right; }
		#arrows ul #right a{ background:  url(images/bg-arrow-right.png) no-repeat top left; }
		
	#below{
		position:fixed; top:660px; left:30px; 
		width:290px; height:30px;
		font-family:Arial, Helvetica, sans-serif;
		color:#ffffff;
		/* IE6 Hack  as position fixed is not supported 
		_position: absolute;
		_top: expression( ( 602 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
		_left: expression( ( 68 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' ); */

	}
	
		#below ul{ margin:0; padding:0; list-style:none; }
		#below ul li{ display:inline; margin:0; padding:0; width:20px; height:20px; }
		#below ul li a{ overflow:hidden; float:left; display:block;  margin-right:5px; width:20px; height:20px; cursor:pointer; text-indent:-9000px; }
		