/* 
	
	Name: layout.css
	Version: 1.0.0
	
	-
	
	Table of Contents
========================
   
   	#Site Styles
	#Page Styles
	#Media Queries
		

	 
*/

/* #Site Styles (>1024px width screen resolutions)
==================================================================================================== */

	#wrap{ width:940px; padding:60px; margin:0px auto; background-color:#fff;
		   -webkit-box-shadow:0 0 6px rgba(0,0,0,.2);  -moz-box-shadow:0 0 6px rgba(0,0,0,.2);  box-shadow:0 0 6px rgba(0,0,0,.2); }


		#header{ padding-bottom:30px; }
		
		
			/* Logo 
			-----------------------------------------------------------------------------------------------*/

			#logo{ display:block; margin-top:-2px; }
			
			
			/* Dropdown Menu 
			-----------------------------------------------------------------------------------------------*/

			.selectnav{ display:none;  cursor:pointer;  width:100%;  padding:10px;  height:40px; color:#666;  }
			
			/* level 1 menu */
			ul#dropdown-menu{ list-style:none;  margin-bottom:0px; float:right; }
			ul#dropdown-menu li{ float: left;  }
			ul#dropdown-menu li a{ display: block;  padding:6px 10px 20px 10px; color:#666; font-size:13px; text-transform:uppercase; font-family:'Open Sans', Arial, sans-serif; }
			ul#dropdown-menu li.last > a{ padding-right:0;  }
			ul#dropdown-menu li.hover,  ul.dropdown-menu li:hover{ position: relative;  text-decoration:none;  }
			
			/* LEVEL 1 menu item styling ON HOVER */
			ul#dropdown-menu li.hover a{ text-decoration:none; color:#333; }
			
			/* styling of LEVEL 1 menu item that is current */ 
			ul#dropdown-menu li.current > a{ color:#62a70f;  }
			  
				/* level 2 menu */
				ul#dropdown-menu ul{ width:170px;  position:absolute;  top:100%;  left:-6px;  margin:0; list-style:none;  display:none; background-color:#fff;  border:1px solid rgba(0, 0, 0, 0.1); z-index:15; 
									 padding:0; background: none repeat scroll 0% 0% rgb(255, 255, 255);  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1); }
									 
				ul#dropdown-menu ul li{ width:170px;  padding:0;  }
				
				/* LEVEL 2 menu element styling  */ 
				ul#dropdown-menu li .sub-menu li > a{ width:140px; display:inline-block;  border:none; padding:10px 15px; text-transform:none; font-size:11px; text-transform:uppercase; border-bottom:1px dotted rgba(0, 0, 0, 0.15); }
				 
				/* LEVEL 2 menu item styling ON HOVER */ 
				ul#dropdown-menu li .sub-menu li > a:hover{ text-decoration:none; color:#62a70f; background-color:#f9f9f9; }
				
				/* LAST LEVEL 2 menu item styling */
				ul#dropdown-menu li .sub-menu li:last-child > a{ border:none; }
				ul#dropdown-menu li .sub-menu li:last-child > a:hover{  }
			
					/* level 3 menu */
					ul#dropdown-menu ul ul{ left:100%;  top:-1px;  }
					ul#dropdown-menu li:hover > ul{ visibility:visible;  }
					
					/* LEVEL 3 menu styling */
					ul#dropdown-menu ul ul li > a{ border-bottom:1px solid #fff;  border-bottom:none;  }
			 
			/* IE Dropdown Fix */
			.ie7 .ie-dropdown-fix, 
			.ie8 .ie-dropdown-fix{position: relative;  z-index: 5; }
			
			/* Search
			-----------------------------------------------------------------------------------------------*/
 
			#search fieldset{ position: relative; margin-top:-2px; }
			#search-input{ padding: 8px 40px 8px 10px;  margin-bottom:0; width:170px; color:#ccc; }
			#search-input:focus{ color:#666; }
			#search .search-submit-btn{ position:absolute; top: 7px; right:10px; height:18px; width:20px; outline:none; background:url(../images/bg-search.png) no-repeat center center; cursor:pointer; border:none; }
	
		
		#content{ border-top:1px solid #e9e9e9; padding-top:40px; padding-bottom:40px; }
		
		
			/* Headline Titles 
			-----------------------------------------------------------------------------------------------*/
			
			.headline{background: url(../images/bg-headline.png) repeat-x center left; margin:30px 0; }
			.headline span{background-color: #FFFFFF; padding-right: 20px; }
			
			/* Page Header
			-----------------------------------------------------------------------------------------------*/
			
			.page-header{ margin-bottom:40px; }
				
				.page-header img{ max-width:100%; display:block; }
				.page-header-text{ background-color:#303030; color:#aeb0b3; height:40px; padding:35px 0 35px 35px; }	
				.page-header-text h3{ width:185px; float:left; color:#ffffff; line-height:20px; font-weight:600; }
				.page-header-text p{ float: left; margin-bottom:0; width: 665px; margin-left: 20px; }
		
			/* Side Nav
			-----------------------------------------------------------------------------------------------*/
			
			.side-nav{ list-style-type:none; list-style-position:outside; border-top:1px solid #efefef; margin-bottom:30px; }
			.side-nav li{ border-bottom:1px solid #efefef; }
			.side-nav li a:hover{ }
			.side-nav li a{ display:block; padding:10px 0 10px 35px; background: url(../images/bg-side-nav.png) no-repeat center left; }
			.side-nav li:last-child{ border-color:#efefef; }
			.side-nav li.current a{ color:#303030; }
			.side-nav li.current a:hover{ text-decoration:none; }
			
			/* Extra Info
			-----------------------------------------------------------------------------------------------*/
			
			.extra-info{ padding:25px; border:1px solid #e9e9e9; margin-bottom:20px; background-color:#f9f9f9; }
			.extra-info h6{ text-transform:uppercase; }
			.extra-info h5{ margin-bottom:15px; }
			.extra-info p{ margin-bottom:0; }
		
				.pdf{ background:#fff url(../images/bg-pdf.png) no-repeat right 0px; }
			
			.extra-info.last{ margin-bottom:0; }
			
			/* Accordion
			-----------------------------------------------------------------------------------------------*/
			
			.accordion{ list-style-type: none; margin-bottom:30px; }
			.accordion li{ float: left; display: block; width:100%; border-top:1px solid #e9e9e9; margin-bottom:0;   }
			.accordion li.current>a{  }
			.accordion li:last-child{ border-bottom:1px solid #e9e9e9;}
			.accordion li:hover{  }
			.accordion li.current{  }
			.accordion li div{ padding:0px 25px;  }
			.accordion li>a{ text-decoration: none; display: block; cursor: pointer;padding:15px 25px; }	
	
	
			/* Tabs
			-----------------------------------------------------------------------------------------------*/
			
			.tabs-menu{ list-style:none; border-bottom:1px solid #e9e9e9; margin-bottom:0; }
			.tabs-menu li{ display:inline; }
			.tabs-menu li a{ float:left; padding:10px 25px; display:block; margin-bottom:-1px;  }
			.tabs-menu li.active a{  border:1px solid #efefef; border-bottom-color:#fff; border-top:1px solid #ccc; color:#666; }
			.tabs-content{ padding:25px; border:1px solid #e9e9e9; border-top:none; margin-bottom:30px; }
		
		
		#footer{ border-top:1px solid #e9e9e9; padding-top:40px; }
		
			#footer .hr{ margin:40px 0; }
			
			a.back-to-top{ color:#999; }
			a.back-to-top:hover{ text-decoration:none; }
			
			/* =social-media
			-----------------------------------------------------------------------------------------------*/
			
			#social-media{ list-style-type:none; margin-bottom:0; }
			#social-media li{ margin-bottom:2px;  }
			#social-media li img{ display:block; float:left; margin-right:5px; }
			#social-media li a{ display:block; float:left; margin-right:5px; line-height:18px; }
				
			

/* #Page Styles
==================================================================================================== */


/* Index
----------------------------------------------------------------------------------------------------*/

	/* Clients Overview 
	----------------------*/
	
	.clients-overview{  }
	.clients-overview a{ float:left; display:block; margin-right:10px; margin-bottom:10px; }
	.clients-overview a img{ display:block; }
	.clients-overview a.last{ margin-right:0; }


/* About
----------------------------------------------------------------------------------------------------*/



/* Services
----------------------------------------------------------------------------------------------------*/

	/* Services Overview 
	----------------------*/
	
	.service-overview{ padding:27px 34px; padding-bottom:0px; border:1px solid #e9e9e9; position:relative; }
	.service-overview:hover{ cursor:pointer; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1); }
	.service-overview a:hover{ text-decoration:none; }
	.service-overview img{ display:block; max-width:100%; }
	.service-overview-overlay{ position:absolute; top:28px; right:-10px; padding:5px 11px; background-color:#f90000; color:#fff; font-weight:bold; font-size:16px; font-family:'Open Sans', Arial, sans-serif; }


/* Portfolio
--------------------------------------------------------------------------------------------------*/
	
	.portfolio-item{ text-align:center;  padding-bottom:0px; position:relative; }
	.portfolio-item:hover{ cursor:pointer; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1); }
	.portfolio-item img{ width:100%; display:block; }
	.portfolio-item-description{ border:1px solid #e9e9e9; padding-top:20px; margin-bottom:30px; border-top:none; }
	.portfolio-item p{ color:#999; }
	.portfolio-item-overlay{ position:absolute; top:28px; right:-10px; padding:5px 11px; background-color:#f90000; color:#fff; font-weight:bold; font-size:16px; font-family:'Open Sans', Arial, sans-serif; }
	
	
	/* =portfolio-pagination ( main portfolio page )
	-----------------------------------------------------------------------------------------------*/
	
	.pagination{ list-style:none; }
	
		.pagination li{ float:left; }
	
		.pagination a{ display:block; padding:5px 10px; margin-right:5px; }
		.pagination li.first a{ padding-left:0; }
		.pagination li.last a{ padding-right:0; }
		.pagination li.current a{ color:#666; border:1px solid #e9e9e9; background-color:#f9f9f9; }	
		.pagination li.current a:hover{ text-decoration:none;}
		.pagination .disabled a{ color:#999; text-decoration:none; }	
	
	
/* Blog
---------------------------------------------------------------------------------------------------*/
 	
	/* =blog-post
	-----------------------------------------------------------------------------------------------*/
	
	.blog-post{ }

		.blog-post-title{ margin:0 0 24px 0; line-height:18px;  }
		
		.blog-post-title + .blog-post-info.alt{ margin-top:-10px; }
		
		.blog-post-thumb{ max-width:100%; }
		
		.blog-post-info{ list-style-type:none; list-style-position:outside;  }
		.blog-post-info li{ padding:0 0 10px 0;  }

		.blog-post-info.alt li{ float:left; margin-right:15px; }
		.blog-post-info.alt{ margin-bottom:20px; }
			
		.blog-post-readmore{  }
		
		#comment-form{ border:1px solid #e9e9e9; padding:30px 30px 20px 30px; margin-top:40px; margin-bottom:20px; }
		
	
	/* =blog-post-comment  ( blog post page comment section )
	-----------------------------------------------------------------------------------------------*/
	
	.blog-post-comment{ margin-top:20px; border-bottom:1px solid #efefef; padding-bottom:10px; }
		.blog-post-comment .who{ margin-bottom:10px; }
		.blog-post-comment .who span{ color:#999; float:right; }
		.blog-post-comment .bordered{ margin:0 20px 0 0; padding:5px; }
		.blog-post-comment-reply{ margin-left:90px; }	


/* Contact
-------------------------------------------------------------------------------------------------*/

	#contact-form{ border:1px solid #e9e9e9; margin-bottom:30px; overflow:hidden; }
		#contact-form fieldset{ margin:0; padding:30px 30px 20px 30px; }
		#contact-form p#formstatus{ margin-bottom:0; }	
		#contact-form textarea{ width:370px; }
		

/* #Media Queries
==================================================================================================== */

	/* #Smaller then 1024px wide screen resolution */
	
	@media only screen and (max-width: 1024px) {
		
		body{ background-image:none; background-color:#fff;  }
		
		#wrap{ margin:0 auto; padding:60px 0 30px 0; width:940px; -webkit-box-shadow:none;  -moz-box-shadow:none; box-shadow:none; }

			#header{}
			
			#footer{ margin:0 auto; padding:30px 0; width:auto; }
		
	}


	/* #Tablet (Portrait) - designed for 705px width grid */
	
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		
		#wrap{ width:705px; }
		
			#header{  }
			
				.selectnav{ display: block; margin-top:-10px; }
			
				#dropdown-menu{ display: none; }
				#search{ display:none; }
				
				.page-header-text{ height:auto; }
				.page-header-text h3{ width:auto; float:none; }
				.page-header-text p{ float:none; width:auto; margin-left:0px; }
				
				#contact-form textarea{ width:220px; }
				
	}
	
	/* #Mobile (Portrait) - designed for 280px width */
	
	@media only screen and (max-width: 767px) {
	
		#wrap{ padding:30px 0 0 0; width:280px; }
			
			#header{ padding-bottom:20px; }
			
				.selectnav{ display: block;}
				
				#logo{ display:block; text-align:center; padding-bottom:20px; }
				#dropdown-menu{ display: none; }
				#search{ display:none; }
			
			#content{ padding-top:20px; }
			
				.service-overview{ margin-bottom:20px; padding-bottom:30px; }
				.service-overview p{ margin-bottom:0; }
				.service-overview img{ display:none; }
				
				.page-header-text{ height:auto; }
				.page-header-text h3{ width:auto; float:none; margin-bottom:0; }
				.page-header-text p{ float:none; width:auto; margin-left:0px; display:none; }

				#contact-form fieldset{ margin:0; padding:30px 15px 10px 15px; }
				#contact-form textarea{ width:220px; }
				
				#comment-form{ padding:30px 15px 20px 15px; }

		p.last, h1.last, h2.last, h3.last, h4.last, h5.last, address.last, ul.last, ol.last, .extra-info.last{ margin-bottom:20px; }
		.text-right{ text-align:left; }
	
	}
	
	/* #Mobile (Landscape) - designed for 420px width */
	
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	
		#wrap{ width:420px; }
		
	}
