/* 
	Theme Name: exSite
	Theme URL: http://www.exsite.ie
	Description: Website by exSite
	Author: Rroy Doyle
	Version: 1.0
*/

/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

img.aligncenter{
	display: block;
	margin: 0 auto;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ==========================================================================
   Author: Rory Doyle - www.exsite.ie 
   ========================================================================== */

   
   
   
   

/*=====================================
  GENERAL
======================================*/   
   
*{
	-webkit-font-smoothing: antialiased;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;   
	box-sizing: border-box; 
	
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0); 
	-webkit-tap-highlight-color: transparent; 
}
   
  
textarea:focus, input:focus{
    outline: 0;
}

*:focus{
	outline: 0;
}

.nolinky{
	cursor: default;
}

a{
	-o-transition: all ease-in-out 0.3s;
	-ms-transition: all ease-in-out 0.3s;
	-moz-transition: all ease-in-out 0.3s;
	-webkit-transition: all ease-in-out 0.3s;
	transition: all ease-in-out 0.3s;
}

a > img{
    border: 0;
}

body{
	color: #6c6969;
	font:  300 10px/2.8em 'Open Sans', sans-serif;
	font-size: 10px;
	margin: 0;
	padding: 0;
}

.body_wrap{
	overflow: hidden;
	position: relative;
}

body.page-template-page_about .body_wrap{
	overflow: visible;
}

.wrapper{
	margin: 0 auto;
	max-width: 1000px;
	padding: 0 20px;
}

h1,h2,h3,h4,h5,h6{
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	line-height: 1.5em;
}
h2{
	font-size: 1.2em;
}
h3{
	font-size: 1.1em;
}
h4{
	font-size: 1em;
}

h2.error_title,
h3.error_title{
	font-size: 2.5em;
	text-align: center;
}	

h3.error_title{
	font-size: 1.8em;
}


input,
textarea {
    -webkit-appearance: none;
    border-radius: 0;
}

iframe{
  display: block;
  margin: 40px auto;
}

.blog_post img{
	height: auto;
	max-width: 100%;
}

blockquote{
	font-style: italic;
	font-weight: 300;
	position: relative;
	margin: 30px 20px;
}

.work_maintext blockquote:first-child{
	margin: 10px 20px 50px;
}
	
	blockquote p:before,
	blockquote p:after{
		display: inline;
		font-size: 20px;
		position: absolute;
	}
	
	blockquote p:before{
		content: open-quote;
		left: -20px;
		top: 3px;
	}
	
	blockquote p:after{
		content: close-quote;
		padding: 0 0 0 4px;
		position: relative;
	}

/*==========================================================================
	Header //
========================================================================== */

header{
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 3;
}

	header .wrapper{
		padding: 15px 10px;
		position: relative;
	}

	.logo{
		display: inline-block;
		float: left;
	}
		
		.logo a{
			background-repeat: no-repeat;
			background-size: 100%;
			display: inline-block;
			height: 63px;
			text-indent: -99999px;
			width: 54px;
		}
		
		.svg body.home .logo a{
			background-image: url(images/logo_homepage.svg);
			background-size: 100%;
		}
		
		.no-svg body.home  .logo a{
			background-image: url(images/logo_homepage.png);
			background-size: 100%;
		}
		
		.svg .logo a{
			background: url(images/logo_internal.svg) no-repeat ;
			background-size: 100%;
		}
		
		.no-svg .logo a{
			background: url(images/logo_internal.png) no-repeat ;
			background-size: 100%;
		}
		
	

	#menu_button{
		display: inline-block;
		cursor: pointer;
		float: right;
		position: relative;
		text-align: left;
		z-index: 8;
	}
	
		#menu_button a{
			cursor: pointer;
			display: block;
			height: 40px;
			position: relative;
			width: 40px;
		}
		
		.burger,
		.burger:before,
		.burger:after {
			background: #605c5a;
			position: absolute;
			top: 18px;
			left: 5px;
			width: 30px;
			height: 3px;
			
			transition: background .2s .4s ease;
			
			-webkit-backface-visibility: hidden; 
		}
		
		
		.burger:before,
		.burger:after {
			transform-origin: 50% 50%;
			transition: top .2s .4s ease, transform .3s ease;
		}
		
		
		body.home .burger,
		body.home .burger:before,
		body.home .burger:after, 
		.show_menu .burger:before,
		.show_menu .burger:after {
			background: #fff;
			z-index: 20;
		}
		
		.burger:before {
		  top: -9px;
		  left: 0;
		  content: "";
		}
		

		.burger:after {
		  top: 9px;
		  left: 0;
		  content: "";
		}
		
		
		#menu_button.menu_button_change{
			display: block;
			float: none;
			height: 50px;
			margin: 30px auto 0;
			width: 50px;
		}
		
		.menu_button_change .burger,
		.menu_button_change .burger:before,
		.menu_button_change .burger:after {
			height: 5px;
			width: 50px;
		}
		
		body.home .menu_button_change .burger,
		.menu_button_change .burger {
		    transition: background .2s 0s ease;
			background: transparent;
		}
	
		
		
		
		.menu_button_change .burger:before, 
		.menu_button_change .burger:after {
			transition: top .2s ease, transform .2s .4s ease;      
			top:0;
		}
		
		.menu_button_change .burger:before {
			transform: rotate3d(0,0,1,45deg); 
		}

		.menu_button_change .burger:after {
		    transform: rotate3d(0,0,1,-45deg); 
		}
		
		
		.mobile_menu.menu_button_change .burger{
			display: none;
		}
		
		#menu_button.mobile_menu.menu_button_change{
			background: url(images/phone_menu_button.png) no-repeat center;
		}
	

	
	.nav_wrap{
		background: rgba(45, 43, 43, 0.85);
		display: none;
		min-height: 480px;
		right: 0;
		opacity: 0;
		padding: 140px 0 20px;
		position: absolute;
		top: 0;
		width: 100%;
		z-index: 7;
		transition: all 0.5s ease-in-out;
		-webkit-transition: all 0.5s ease-in-out;
	}
	
	.nav_wrap.show_menu{
		display: block;
	}
	
	.nav_wrap.reveal{
		opacity: 1;
	}
	
		nav.main_nav,
		.logo_heading{
			opacity: 0;
		}
		
		.nav_wrap.reveal nav.main_nav,
		.nav_wrap.reveal .logo_heading{
			opacity: 1;
		}
	

	
		nav.main_nav{
			font-family: 'Open Sans', sans-serif;
			text-align: center;
		}
		
		
		nav.main_nav ul{
			display: inline-block;
			margin: 0;
			padding: 0;
		}
		
			nav.main_nav ul li{
				list-style: none;
				text-align: left;
			}
			
				nav.main_nav ul li a{
					color: #fff;
					font-size: 2.4em;
					font-weight: 300;
					line-height: 2.2em;
					text-decoration: none;
					text-transform: uppercase;
					
					transition: all ease-in-out 0.2s;
					-o-transition: all ease-in-out 0.2s;
					-ms-transition: all ease-in-out 0.2s;
					-moz-transition: all ease-in-out 0.2s;
					-webkit-transition: all ease-in-out 0.2s;
				}
				
				nav.main_nav ul li a:hover,
				nav.main_nav ul li a:active{
					color: #df5204;
				}
					
				

/*==========================================================================
	Home - banner //
========================================================================== */

.home_banner{
	height: 480px;
	overflow: hidden;
	text-align: center;
}	
		
	figure.back_img{
		height: 100%;
		margin: 0;
		position: relative;
		width: 100%;
	}

		figure.back_img img{
			height: auto;
			left: -9999px;
			margin: 0 auto;
			min-width: 100%;
			right: -9999px;
			top: 0;
			position: absolute;
		}
		

	
		.ban_plane{
			display: block;
			right: 0;
			left: 0;
			height: 50px;
			margin: 0 auto;
			max-width: 655px;
			padding: 0 30px;
			position: absolute;
			top: 150px;
			width: 70%;
		}
		
		.svg  .ban_plane{ 
			background: url(images/exsite_airplane_header.svg) no-repeat center center;
			background-size: 100%;
		}
		
		.no-svg  .ban_plane{
			background: url(images/exsite_airplane_header.png) no-repeat center center;
			background-size: 100%;
		}
		
		
			
		.ban_text{
			color: #ff5a00;
			font-family: 'Open Sans', sans-serif;
			font-size: 60px;
			font-weight: 800;
			left: 0;
			line-height: 0.8em;
			margin: 0;
			position: absolute;
			opacity: 0.4;
			top: 240px;
			width: 100%;
		}
		
		.ban_link{
			left: 0;
			position: absolute;
			top: 360px;
			text-align: center;
			width: 100%;
		}
		
			.ban_link a{
				border: 1px solid #fff;
				color: #fff;
				display: inline-block;
				font: 600 2.2em 'Open Sans', sans-serif;
				letter-spacing: 1px;
				padding: 10px 20px;
				text-decoration: none;
				
				transition: all ease-in-out 0.2s;
				-o-transition: all ease-in-out 0.2s;
				-ms-transition: all ease-in-out 0.2s;
				-moz-transition: all ease-in-out 0.2s;
				-webkit-transition: all ease-in-out 0.2s;
			}
			
			.ban_link a:hover,
			.ban_link a:active{
				background: #fff;
				color: rgba(45, 43, 43, 0.75);
			}
	
/*==========================================================================
	Home - about //
========================================================================== */

.home_about{
	overflow: hidden;
	margin: 0 0 50px;
	padding: 50px 0 30px;
	position: relative;
}


	.home_about h2{
		color: #908d8c;
		font-size: 40px;
		font-weight: 300;
		letter-spacing: 2px;
		line-height: 40px;
		margin: 0 0 40px;
		text-align: center;
	}
		
		.home_about h2 span{
			color: #ff7d39;
		}
	
	.home_about .about_text{
		font-size: 1.8em;
	}
	
		.home_about .about_text strong{
			display: block;
			margin: 0 0 10px;
		}
		
		.home_about .about_text p{
			margin: 0;
		}
	
		.home_about .contact_link{ 
			color: #ff7d39;
			display: inline-block;
			font-size: 1.1em;
			font-style: italic;
			margin: 25px auto 0;
			text-align: left;
			text-decoration: none;
		}
		
		.home_about .contact_link:hover,
		.home_about .contact_link:active{
			color: #e95201;
		}
		
		
		
/*==========================================================================
	Home - clients //
========================================================================== */
		
	.client_logos{
		height: 221px;
		margin: 20px auto 0;
		overflow: hidden;
		padding: 30px 10px;
		position: relative;
		text-align: center;
	}
	
		.client_logos:before{
			background: url(images/border_dash_horizontal.png) repeat-x top;
			content: '';
			height: 1px;
			left: 0;
			position: absolute;
			top: 0;
			width: 100%;
			z-index: 10;
		}
		
		.client_logos .wrapper{
			height: 100%;
			max-width: 400px;
			padding: 0;
			position: relative;
		}

			.client_logos .c_logo{
				display: inline-block;
				text-align: center;
				padding: 10px;
				width: 49%;
			}
			
				.client_logos .c_logo img{
					height: auto;
					width: 135px;
					max-width: 100%;
				}
				
				.client_logos .c_logo.tall_logo img{
					width: 60px;
				}
				
	.client_logos a{
		background: rgba(255, 255, 255, 0.85);
		display: table;
		color: #ff7d39;
		font-size: 40px;
		font-weight: 300;
		height: 100%;
		left: 0;
		letter-spacing: 3px;
		line-height: 40px;
		position: absolute;
		text-align: center;
		text-decoration: none;
		top: -110%;
		width: 100%;
		
		transition: all ease-in-out 0.3s;
		-o-transition: all ease-in-out 0.3s;
		-ms-transition: all ease-in-out 0.3s;
		-moz-transition: all ease-in-out 0.3s;
		-webkit-transition: all ease-in-out 0.5s;
	}
	
		.client_logos a span{
			display: table-cell;
			opacity: 0;
			margin: auto;
			text-align: center;
			vertical-align: middle;
			width: 100%;
			
			transition: all ease-in-out 0.5s;
			-o-transition: all ease-in-out 0.5s;
			-ms-transition: all ease-in-out 0.5s;
			-moz-transition: all ease-in-out 0.5s;
			-webkit-transition: all ease-in-out 0.5s;
		}
		
			.client_logos a span strong{
				color: #908d8c;
				font-weight: 300;
			}
	
	.client_logos:hover > .wrapper a{
		top: 1px;
	}
	
	.client_logos:hover > .wrapper a span{
		opacity: 1;
	}


/*==========================================================================
	Home - projects //
========================================================================== */

			
.portfo{
	margin: 40px 0 0;
}
	
	.project{  
		margin-bottom: 2px;
		overflow: hidden;
		position: relative;
	}
	
		.project:before{
			background: #000;
			content: '';
			height: 100%;
			left: 0;
			opacity: 0.4;
			position: absolute;
			top: 0;
			width: 100%;
		}
	
	
		.project h3{
			display: block;
			height: 96%;
			left: 0;
			margin: 0;
			position: absolute;
			top: 2%;
			width: 100%;
		}
		
		
		.project a{
			color: #fff;
			display: table;
			font-size: 30px;
			font-weight: 300;
			height: 100%;
			left: 0;
			position: absolute;
			text-decoration: none;
			top: 0;
			width: 100%;
		}
		
			.project a img{
				height: auto;
				width: 100%;
			}
		
			.project a span{
				display: table-cell;
				line-height: 1.3em;
				margin: auto;
				padding: 0 10px 0 15px;
				text-align: center;
				vertical-align: middle;
				width: 100%;
			}
			
				.project a span strong{
					border: 1px solid #ff7d39;
					clear: both;
					display: inline-block;
					font-size: 0.5em;
					font-weight: 400;
					line-height: 1.9em;
					margin: 20px 0 0 -5px;
					padding: 4px 12px;
					position: relative;
				}
				
		
		
		.project figure{
			margin: 0;
		}
		
			.project figure img{
				height: auto;
				width: 100%;
			}
		

@media only screen and (max-width: 600px) {

		
/*	Home - projects Award 
--------------------------*/	



	.project.wa_win a{
		background: url(images/winner.png) no-repeat center;
		background-size: 151px 120px;
	}
	
		.project.wa_win a strong{
			margin: 140px 0 0 -5px;
		}
		
}
			
			
				
/*==========================================================================
	Home - services //
========================================================================== */


.services{
	text-align: center;
}

	.services h2{
		color: #ff7d39;
		font-size: 40px;
		font-weight: 300;
		line-height: 40px;
		letter-spacing: 2px;
		margin: 40px 0 30px;
		text-align: center;
	}
		
		.services h2 span{
			color: #908d8c;
		}


	ul.service_nav {
		display: block;
		list-style: none;
		margin: 0 auto 10px;
		max-width: 290px;
		padding: 0;
		text-align: center;
	}

		.service_nav li {
			display: block;
			float: left;
			padding: 10px 20px;
			width: 50%;
		}

		.service_nav li.current {
			position: relative;
			z-index: 5;
		}

			.service_nav li a {
				color: #646060;
				display: inline-block;
				font-size: 1.5em;
				font-weight: 600;
				max-width: 100%;
				line-height: 1.2em;
				position: relative;
				text-decoration: none;
				text-transform: uppercase;
			}

			.service_nav .current a {
				color: #ff7d39;
			}
				
				.service_nav a span{
					border-bottom: 4px solid #fff;
					display: block;
					margin: 5px 0 10px;
					padding: 15px 0 10px;
					position: relative;
				}
				
					.service_nav a span:after{
						background: #ff7d39;
						content: '';
						height: 4px;
						left: 0;
						opacity: 0;
						position: absolute;
						top: 100%;
						width: 0;
						
						transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
						-o-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
						-ms-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
						-moz-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
						-webkit-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
					}
					
					
					.service_nav .current a span:after{
						opacity: 1;
						width: 100%;
					}
			
				.service_nav a figure{
					margin: 0;
					opacity: 1;
					text-align: center;
					width: 100%;
					
					transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
					-o-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
					-ms-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
					-moz-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
					-webkit-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
				}
				
			
				.service_nav  a figure.serv_front{
					left: 0;
					opacity: 0;
					position: absolute;
					top: 0;
				}
				
				
				.service_nav li.current a figure.serv_back{
					opacity: 0;
				}
				
				.service_nav li.current a figure.serv_front{
					opacity: 1;
				}
					
					.service_nav a figure img{
						height: auto;
						width: 100%;
					}

			
		.services_content {
			margin: 0 auto 20px;
			max-width: 625px;
			width: auto;
		}

			.services_tab {
				padding: 0 20px 20px;
				display: none;
				font-size: 1.8em;
			}
			
				.services_tab p{
					margin-top: 0;
				}

			.service_tab_current{
				display: block;
			}

			
/*==========================================================================
	Content //
========================================================================== */


body.home .body_wrap{
	padding-top: 0;
}

.main_wrap{
	padding-top: 100px;
}
	
	
	.main_title.top_title{
		margin-top: 30px;
	}
	
	
	.dark_plane{
		display: block;
		height: 70px;
		left: 0;
		margin: 20px auto 0;
		max-width: 655px;
		padding: 0 30px;
		text-align: center;
		width: 70%;
	}
	
	.svg  .dark_plane{ 
		background: url(images/exsite_airplane_internal.svg) no-repeat center center;
		background-size: 100%;
	}
	
	.no-svg  .dark_plane{
		background: url(images/exsite_airplane_internal.png) no-repeat center center;
		background-size: 100%;
	}
	
	
	.main_title{
		color: #908d8c;
		font-size: 40px;
		font-weight: 300;
		letter-spacing: 2px;
		line-height: 50px;
		margin: 20px 0 40px;
		text-align: center;
		text-transform: uppercase;
	}
		
		.main_title span{
			color: #ff7d39;
		}
		
			
		
		

	
			
/*==========================================================================
	Projects //
========================================================================== */


#load_content{
	margin-bottom: 125px;
}

.more_projects{
	clear: both;
}

.portfo.portfo_page{
	margin: 60px 0 80px;
}	
	
	.load_posts{
		clear: both;
		text-align: center;
		margin: 80px 0 0;
		width: 100%;
	}
		
		.load_posts a{
			border: 1px solid #646060;
			color: #646060;
			display: inline-block;
			font: 600 2.2em 'Open Sans', sans-serif;
			letter-spacing: 1px;
			padding: 10px 20px;
			text-decoration: none;
		}

		.load_posts a:hover, 
		.load_posts a:active {
			background: #646060;
			color: #fff;
		}
		
		
	.view_clients{
		font-size: 2em;
		margin: 0 0 40px;
		text-align: center;
	}	
		
		
		
		
/*==========================================================================
	About Us //
========================================================================== */		
		
		
	
	.about_wrap .main_title{
		margin: 40px 0;
	}
	
	.about_content{
		font-size: 1.8em;
	}
	
		.main_title.team_title{
			margin: 40px 0 40px;
		}
	
	.team{
		margin: 0 auto;
		width: 240px;
	}
	
		.member{
			display: block;
			float: left;
			font-size: 1.8em;
			margin: 0 10px 40px;
			position: relative;
			width: 220px;
		}
		
			
			
				
			.close_info_top{
				display: none;
				height: 220px;
				left: 0;
				overflow: hidden;
				position: absolute;
				top: 0;
				width: 100%;
				z-index: 5;
			}
			
			.member.show_info .close_info_top{
				display: block;
			}
			
				.close_info_top .close_info{
					background: #000;
					bottom: -60px;
					cursor: pointer;
					display: block;
					height: 60px;
					right: 1px;
					opacity: 0.5;
					padding: 10px;
					position: absolute;
					width: 40px;
					
					transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-o-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-ms-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-moz-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-webkit-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
				}
				
					.close_info_top .close_info:before{
						  background: url(images/close_x.png) no-repeat center;
						  content: '';
						  left: 10px;
						  position: absolute;
						  height: 20px;
						  top: 10px;
						  width: 20px;
					}
				
				.close_info_top:hover > .close_info{
					bottom: -20px;
				}
			
			
			
			.member.show_info figure:hover > span.close_info{
				height: 20px;
			}
			
			.member figure{
				cursor: pointer;
				overflow: hidden;
				margin: 0 0 15px;
				position: relative;
			}
			
			.member.show_info figure{
				cursor: default;
			}
			
				.member figure:before{
					background: #000;
					content: '';
					display: block;
					height: 300px;
					left: 0;
					opacity: 0;
					position: absolute;
					top: 0;
					width: 300px;
					
					transition: all 0.3s cubic-bezier(.32,.79,.63,.99);
					-o-transition: all 0.3s cubic-bezier(.32,.79,.63,.99);
					-ms-transition: all 0.3s cubic-bezier(.32,.79,.63,.99);
					-moz-transition: all 0.3s cubic-bezier(.32,.79,.63,.99);
					-webkit-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
				}
				
				.member:hover > figure:before{
					opacity: 0.4;
				}
				
				
				.member.opaque:hover > figure:before{
					opacity: 0.3;
				}
				
				.member.show_info:hover > figure:before{
					opacity: 0;
				}
	
				
				.member figure strong{
					background: url(images/team_hover.png) no-repeat center;
					background-size: 0 0;
					display: block;
					font-size: 0;
					font-weight: 300;
					height: 220px;
					left: 0;
					opacity: 0;
					position: absolute;
					top: 0;
					text-align: center;
					width: 100%;
					
					transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-o-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-ms-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-moz-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
					-webkit-transition: all 0.4s cubic-bezier(0,.75,.4,1.35);
				}
				
				.member:hover > figure strong{
					background: url(images/team_hover.png) no-repeat center;
					background-size: 80px 80px;
					opacity: 0.7;
				}
				
				.member.show_info:hover > figure strong{
					opacity: 0;
				}
				
	
			
			.member span{
				display: block;
				text-align: left;
			}
			
			.member.show_info span{
				font-weight: 400;
			}
			
			.member.show_info span.m_name{
				color: #ff7d39;
			}
				
		.member.opaque {
			opacity: .5;
		}
		
			.member.opaque img{
				opacity: .2;
			}

				
			.member .member_info{
				background: #fff;
				border-top: 1px solid #605c5a;
				display: none;
				font-size: 0.9em;
				left: 0;
				margin: 20px 0;
				padding: 10px 0 77px;
				position: absolute;
				text-align: left;
				top: 100%;
				width: 100;
				z-index: 4;
				
				transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
				-o-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
				-ms-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
				-moz-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
				-webkit-transition: all 0.5s cubic-bezier(.32,.79,.63,.99);
			}
			
				.member .member_info:before,
				.member .member_info:after{
					background: #fff;
					content: '';
					height: 100%;
					padding: 20px 0 0;
					position: absolute;
					top: 0;
					width: 20px;
				}
				
				.member .member_info:before{
					left: -20px;
				}
				
				.member .member_info:after{
					right: -20px;
				}
				
			
			.member.show_info .member_info{
				display: block;
				opacity: 0;
				position: relative;
			}
			
			.member.show_info.team_fade .member_info{
				opacity: 1;
			}
			
			
				.close_bottom{
					border-bottom: 1px solid #9c9a99;
					border-top: 1px solid #9c9a99;
					bottom: 0;
					left: 0;
					position: absolute;
					text-align: center;
					width: 100%;
				}
					
					.close_bottom:before{
						background: #fff;
						bottom: -21px;
						content: '';
						display: block;
						height: 20px;
						left: 0;
						position: absolute;
						width: 100%;
					}
					
					.close_bottom .close_info{
						background: url(images/close_x.png) no-repeat center;
						content: '';
						cursor: pointer;
						display: block;
						height: 25px;
						margin: 15px auto;
						width: 25px;
					}
					
				
	
			
/*==========================================================================
	Portfolio Post //
========================================================================== */


h1.main_title.work_title{
	color: #ff7d39;
}


	.workbox{
		background: #e2e0e0;
		padding: 30px 10px;
		text-align: center;
	}
	
	.workbox.work_main_img{
		background: #fff;
		padding: 0;
	}
		
		.workbox figure{
			margin: 50px 0 0;
		}
		
		.workbox figure:first-child{
			margin-top: 0;
		}
		
		
		
		
			.workbox img{
				height: auto;
				max-width: 100%;
			}
		
	.work_intro{
		color: #5f5e5e;
		font-size: 1.8em;
		margin: 50px 0;
		text-align: center;
	}

		.work_intro br{
			display: none;
		}

	.work_maintext{
		color: #5f5e5e;
		font-size: 1.8em;
		margin: 50px 0;
		padding: 30px 20px;
		text-align: left;
	}	
		
		.work_link{
			margin: 25px 0 5px;
			text-align: center;
		}
		
			.work_link a{
				color: #ff7d39;
				font-weight: 400;
				text-decoration: none;
			}
			
			.work_link a:hover{
				color: #929191;
			}
		
	.work_nav ul{
		display: block;
		list-style: none;
		margin: 0 auto 50px;
		padding: 0;
		text-align: center;
	}
	
		.work_nav ul li{
			display: inline-block;
			width: 70px;
		}
		
			.work_nav ul li{ 
				margin-left: 20px;
			}
			.work_nav ul li:first-child{ 
				margin-left: 0;
			}
		
			.work_nav ul li a{
				color: #929191;
				display: block;
				height: 80px;
				font-size: 16px;
				padding: 70px 0 0;
				position: relative;
				text-decoration: none;
				width: 100%;
			}
			
				.work_nav ul li a span{
					display: none;
				}
			
				.work_nav ul li a:before{
					background: url(images/post_nav.png) no-repeat 0 0;
					content: '';
					height: 58px;
					left: 20px;
					position: absolute;
					top: 0;
					width: 31px;
					
					
					transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-o-transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-ms-transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-moz-transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-webkit-transition: all 0.3s cubic-bezier(.13,.26,.42,1.06);
				}
				
				.work_nav ul li a:after{
					background: url(images/post_nav.png) no-repeat 0 0;
					content: '';
					height: 58px;
					left: 20px;
					position: absolute;
					top: 0;
					width: 31px;
					
					
					transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-o-transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-ms-transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-moz-transition: all 0.4s cubic-bezier(.13,.26,.42,1.06);
					-webkit-transition: all 0.3s cubic-bezier(.13,.26,.42,1.06);
				}
				
				.work_nav ul li.next_p a:before{
					background: url(images/post_nav.png) no-repeat -109px 0;
				}
				
				.work_nav ul li.next_p a:after{
					background: url(images/post_nav.png) no-repeat -109px 0;
				}
				
				.work_nav ul li.all_p a:before{
					background: url(images/post_nav.png) no-repeat -41px 0;
					content: '';
					height: 58px;
					left: 5px;
					position: absolute;
					top: 0;
					width: 60px;
				}
				
				.work_nav ul li.all_p a:after{
					background: url(images/post_nav.png) no-repeat -41px 0;
					content: '';
					height: 58px;
					left: 5px;
					position: absolute;
					top: 0;
					width: 60px;
				}
				
		
				
				.work_nav ul li.next_p a:hover:after{
					left: 30px;
					opacity: 0.4;
				}
				
				.work_nav ul li.prev_p a:hover:after{
					left: 10px;
					opacity: 0.4;
				}
				
				.work_nav ul li.all_p a:hover:before{
					top: -4px;
				}
				.work_nav ul li.all_p a:hover:after{
					opacity: 1;
					top: 4px;
				}

/*==========================================================================
	Blog page //
========================================================================== */

.main_title.main_blog_title{
	margin-bottom: 20px;
}

.blog_post {
	background: url(images/border_dash_horizontal.png) repeat-x top;
	padding: 50px 0;
}

.blog_post:first-child {
	background: none;
} 

	.blog_post .wrapper{ 	
		max-width: 620px;
		text-align: center;
	}


		.blog_title{
			color: 605c5a;
			font-size: 2.4em;
			font-weight: 400;
			margin: 0;
		}

		.date{
			color: #ff7d39;
			font-size: 1.6em;
			margin: 25px 0;
		}
		
		.excerpt{
			font-size: 1.6em;
			text-align: left;
		}
		
			.excerpt a{
				color: #ff7d39;
				text-decoration: none;
			}
		
		.blog_post figure{
			margin: 30px 0 0;
		}
		
			.blog_post figure img{
				height: auto;
				max-width: 100%;
			}
		
		a.continue{	
			color: #ff7d39;
			display: inline-block;
			font-size: 1.6em;
			line-height: 50px;
			margin: 30px 0 0;
			overflow: hidden;
			position: relative;
			text-decoration: none;
			
			transition: all ease-in-out 0.5s;
			-o-transition: all ease-in-out 0.5s;
			-ms-transition: all ease-in-out 0.5s;
			-moz-transition: all ease-in-out 0.5s;
			-webkit-transition: all ease-in-out 0.5s;
		}
		
		a.continue:hover {
			color: #444242;
		}
		

			
		

		
		.blog_page .load_posts a{
			border: none;
		}

	
	/*
	Single Blog page
	*/
	
	.single_blog_page h1.blog_title{
		margin-top: 70px;
	}
	
		.single_blog_page a.continue{
			margin: 60px 0 0 -25px;
			padding: 0 0 0 25px;
		}
	
			.single_blog_page a.continue:before {
				left: 280px;
			}
			
			.single_blog_page a.continue:after{ 
				border-color: transparent #ffc8aa transparent transparent;
				left: 230px;
			}

			
			.single_blog_page a.continue:hover:before {
				left: 25px;
			}
			
			.single_blog_page a.continue:hover:after {
				left: -25px;
			}

	
				
/*==========================================================================
	CONTACT //
========================================================================== */

.contact_wrap{
	text-align: center;
}

	.contact_wrap .main_title {
	  margin: 40px 0;
	}


	.contact_info{
		color: #989795;
		font-size: 2.4em;
		line-height: 1.5em;
		margin: 0 auto;
		max-width: 350px;
	}
		
		.contact_info p{
			text-align: left;
		}
		
			.contact_info span{
				display: block;
			}
		
				.contact_info a{
					color: #989795;
					text-decoration: none;
				}
				
.contact_content{
	background: #74716f;
	margin: 30px 0 0;
	position: relative;
}	
		
	#the_map{	
		height: 950px;
		margin-bottom: -30px;
		max-width: 100%;
		position: relative;
	}
	
		#the_map:before{
			background: #fff;
			bottom: 0;
			content:'';
			height: 30px;
			left: 0;
			position: absolute;
			width: 100%;
		}
		
		.scroll_click{
			cursor: crosshair;
			height: 100%;
			left: 0;
			position: absolute; 
			top: 0;
			width: 100%;
		}
		
		.scroll_click.zoom_please{
			display: none;
		}
		
	.form{
		height: 950px;
		left: 0;
		padding: 310px 20px 80px;
		position: absolute;
		top: 0;
		width: 100%;
	}
	
		.form_inner{
			margin: 0 auto;
			max-width: 400px;
		}
	
		.form .gform_body ul{
			list-style: none;
			margin: 0;
			padding: 0;
		}
			
			li.gfield{
				position: relative;
			}
			
			 li#field_1_5,
			 li#field_1_6{
				margin-bottom: 30px;
			 }
		
				.form label{
					display: none;
				}
				
				
				.form input[type="text"],
				.form input[type="email"],
				.form textarea{
					border: 1px solid #fff;
					font: 300 2.2em 'Open Sans', sans-serif;
					padding: 15px 20px;
					width: 100%;
				}
				
				.form input[type="text"]:focus,
				.form input[type="email"]:focus,
				.form textarea:focus{
					border: 1px solid #ff7d39;
				}
				
				.form textarea{
					height: 240px;
				}
				
				::-webkit-input-placeholder {
				  color: #b4b4b4;
				}

				:-moz-placeholder { 
				  color: #b4b4b4;
				}

				::-moz-placeholder { 
				  color: #b4b4b4;
				}

				:-ms-input-placeholder {
				  color: #b4b4b4;
				}
				
				.form input[type="submit"]{
					background: #ff7d39;
					border: 0;
					color: #fff;
					font-size: 25px;
					font-weight: 500;
					margin-top: 20px;
					padding: 15px 40px;
					text-transform: uppercase;
					
					transition: all ease-in-out 0.1s;
					-o-transition: all ease-in-out 0.1s;
					-ms-transition: all ease-in-out 0.1s;
					-moz-transition: all ease-in-out 0.1s;
					-webkit-transition: all ease-in-out 0.1s;
				}
				
				.form input[type="submit"]:hover{
					background: #e95201;
				}
	
	.validation_error{
		display: none;
	}
		
	.validation_message,
	.validation_error {
		background: #929191;
		color: white;
		padding: 0 10px;
	}
	
	.validation_message{
		bottom: -20px;
		font-size: 12px;
		left: 0;
		position: absolute;
		width: 100%;
	}
	
	li#field_1_7 .validation_message{
		bottom: -10px;
	}
			
		.gform_confirmation_message {
			background: #fff;
			border: 1px solid #ff7d39;
			font-size: 20px;
			margin: 50px 0 0;
			padding: 80px 50px;
		}
				
	.form_christmas{
		width:100%;
	}
	
		.form_christmas_inner{
			
		}
	
		.form_christmas .gform_body ul{
			list-style: none;
			margin: 0;
			padding: 0;
		}
			
			li.gfield{
				position: relative;
			}
			
			 li#field_1_5,
			 li#field_1_6{
				margin-bottom: 30px;
			 }
		
				.form_christmas label{
					display: none;
				}
				
				
				.form_christmas input[type="text"],
				.form_christmas input[type="email"],
				.form_christmas textarea,
				.form_christmas select{
					    border: 1px solid #ff7d39;
						font: 300 1.8em 'Open Sans', sans-serif;
						padding: 15px 20px;
						width: 100%;
						margin-bottom: 20px;
				}
				.gform_validation_container{
					display:none
				}
				.form_christmas input[type="text"]:focus,
				.form_christmas input[type="email"]:focus,
				.form_christmas textarea:focus{
					border: 1px solid #ff7d39;
				}
				.form_christmas select{
					color:#b4b4b4;
				}
				.form_christmas textarea{
					height: 240px;
				}
				
				::-webkit-input-placeholder {
				  color: #b4b4b4;
				}

				:-moz-placeholder { 
				  color: #b4b4b4;
				}

				::-moz-placeholder { 
				  color: #b4b4b4;
				}

				:-ms-input-placeholder {
				  color: #b4b4b4;
				}
				
				.form_christmas input[type="submit"]{
					background: #ff7d39;
					border: 0;
					color: #fff;
					font-size: 25px;
					font-weight: 500;
					margin-top: 20px;
					padding: 15px 40px;
					text-transform: uppercase;
					
					transition: all ease-in-out 0.1s;
					-o-transition: all ease-in-out 0.1s;
					-ms-transition: all ease-in-out 0.1s;
					-moz-transition: all ease-in-out 0.1s;
					-webkit-transition: all ease-in-out 0.1s;
				}
				
				.form_christmas input[type="submit"]:hover{
					background: #e95201;
				}	
		#gform_fields_2.validation_error{
		display: none;
	}
		
	#gform_fields_2.validation_message,
	#gform_fields_2.validation_error {
		background: #929191;
		color: white;
		padding: 0 10px;
	}
	
.form_christmas.validation_message{
		bottom: -20px;
		font-size: 12px;
		left: 0;
		position: absolute;
		width: 100%;
	}
	
	#gform_fields_2 li#field_2_7 .validation_message{
		bottom: -10px;
	}
			
	#gform_fields_2	.gform_confirmation_message {
			background: #fff;
			border: 1px solid #ff7d39;
			font-size: 20px;
			margin: 50px 0 0;
			padding: 80px 50px;
		}
			

	
				
/*==========================================================================
	Client Page //
========================================================================== */

.client_wrap{
	margin-bottom: 70px;
	position: relative;
}

	.client_wrap:before{
		background: #fff;
		bottom: 0;
		display: block;
		content: '';
		height: 2px;
		position: absolute;
		width: 100%;
		z-index: 2;
	}

.client_content{
	margin: 60px 0 0;
	position: relative;
}


	.client{
		padding: 20px;
		position: relative;
		text-align: center;
		width: 100%;
	}
	
		.client:nth-child(even):before,
		.client:nth-child(odd):before{
			border-left: 1px solid #e0dfdf;
			content: '';
			height: 100%;
			right: 0;
			position: absolute;
			top: 0;
			width: 1px;
		}
		
		.client:nth-child(even):before{
			right: 100%;
		}
		
		.client:after{
			border-bottom: 1px solid #e0dfdf;
			bottom: 0;
			content: '';
			height: 1px;
			left: 0;
			position: absolute;
			width: 100%;
		}
		
		.client img{
			height: auto;
			max-width:100%;
		}	
	
				
	
				
/*==========================================================================
	Footer //
========================================================================== */

footer{
	background: #929191;
	color: #fff;
	font-size: 1.8em;
	padding: 120px 0 10px;
	position: relative;
	text-align: center;
	z-index: 3;
}

	footer:before{
		background: url(images/footer_plane.png) no-repeat bottom right;
		content: '';
		height: 86px;
		left: 50%;
		margin-left: -350px;
		position: absolute;
		top: 0;
		width: 408px;
	}
	
	.svg  footer:before{ 
		background: url(images/exsite_airplane_footer.svg) no-repeat bottom right;
	}
	
	.no-svg  footer:before{
		background: url(images/exsite_airplane_footer.png) no-repeat bottom right;
	}
	
	.foot_details{
		display: inline-block;
		margin: 0 auto;
	}
	
		.foot_details span{
			display: block;
			margin: 20px 0;
		}
		
		.foot_details span.slash{
			border-top: 1px solid #fff;
			margin: 0 auto;
			max-height: 1px;
			max-width: 50px;
			text-indent: -9999px;
		}
		
	
			.foot_details a{
				color: #fff;
				text-decoration: none;
				text-transform: lowercase;
			}
	
	
		.social{
			margin: 20px 0 40px;
			padding: 0;
			text-align: center;
		}
		
			.social li{
				display: inline-block;
				list-style: none;
				margin: 0 10px;
			}
			
				.social li a{
				  border: 1px solid #fff;
				  color: #fff;
				  display: block;
				  height: 38px;
				  font-size: 20px;
				  line-height: 38px;
				  -moz-line-height: 34px;
				  width: 38px;
				  
				  
				  border-top-left-radius: 200px;
				  border-top-right-radius: 200px;
				  border-bottom-left-radius: 200px;
			      border-bottom-right-radius: 200px;
				  
				  border-radius: 200px;
				  -moz-border-radius: 200px;
				  -webkit-border-radius: 200px;
				}
				
				.social li a:hover{
					border-color: #ffa372 ;
					color: #ffa372;
				}
				
					.social li.linkedin a i{
						line-height: 36px;
						vertical-align: top;
					}
				
				/*-----------------------------
					 mozilla specific css
				------------------------------*/
				@-moz-document url-prefix() {
				
					.social li.linkedin a i,
					.social li a{
						line-height: 34px;
					}
					
				}
			
	
	.foot_reg{
		font-size: 0.6em;
		margin: 20px 0 10px;
	}	
	
		.foot_reg span{
			display: block;
			line-height: 1.5em;
		}

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

@media only screen and (min-width: 420px) {
		
/*==========================================================================
	Portfolio Post // 420px
========================================================================== */

	
	
	.work_nav ul li:first-child,
	.work_nav ul li{
		margin: 0 20px;
	}
	
		.work_nav ul li a{
			padding: 85px 0 0;
		}
		
			.work_nav ul li a span{
				display: inline;
			}
	
/*==========================================================================
	Client Page // 420px
========================================================================== */
		
	.client{
		float: left;
		width:50%;
	}	

}

@media only screen and (min-width: 540px) {


/*==========================================================================
	About Us // 540px
========================================================================== */

.team{
	width: 480px;
}


	.member .member_info {
		width: 460px;
	}
	
	
	.member:nth-child(even) .member_info{
		left: -240px;
	}

.member.show_info .member_info{
				display: block;
				opacity: 0;
				position: absolute;
			}
	
	
	
}


@media only screen and (min-width: 600px) {


blockquote{
	margin: 30px 60px;
}

.work_maintext blockquote:first-child{
	margin: 10px 60px 50px;
}


/*==========================================================================
	Home  // 600px
========================================================================== */


		.ban_link{
			top: 380px;
		}

/*==========================================================================
	Home - about // 600px
========================================================================== */

		
	.home_about {
		padding-bottom: 20px;
	}

	
/*==========================================================================
	Home - clients // 600px
========================================================================== */


	
	.client_logos .wrapper{
		max-width: 100%;
	}

		.client_logos .c_logo{
			padding: 10px 20px;
			width: auto;
		}
		

/*==========================================================================
	Home - projects // 600px
========================================================================== */
			
.portfo{
	margin: 40px 0 0;
}
	
	.project{
		float: left;
		margin: 0;
		width: 50%;
	}
	
		.project:before{
			opacity: 0;
			
			transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
			-o-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
			-ms-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
			-moz-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
			-webkit-transition: all 0.6s cubic-bezier(.32,.79,.63,.99);
		}
		
		.portfo_mobile .project:before{
			opacity: 0.7;
		}	
		
		.project:hover:before{
			opacity: 0.7;
		}
		
		.project h3{
			height: 100%;
			top: 0;
		}

		.project a{
			opacity: 0;	
			
			transition: all ease-out 0.6s;
			-o-transition: all ease-out 0.6s;
			-ms-transition: all ease-out 0.6s;
			-moz-transition: all ease-out 0.6s;
			-webkit-transition: all ease-out 0.6s;
		}
		
		.portfo_mobile .project a{
			opacity: 1;
			
		}
		.project a:hover{
			opacity: 1;
		}
		
			.project a img{
				height: auto;
				width: 100%;
			}
		
			.project a span{
				display: table-cell;
				margin: auto;
				text-align: center;
				vertical-align: middle;
				width: 100%;
			}
			
				.project a span strong{
					border: 1px solid #ff7d39;
					
					transition: all 1s cubic-bezier(.32,.79,.63,.99);
					-o-transition: all 1s cubic-bezier(.32,.79,.63,.99);
					-ms-transition: all 1s cubic-bezier(.32,.79,.63,.99);
					-moz-transition: all 1s cubic-bezier(.32,.79,.63,.99);
					-webkit-transition: all 1s cubic-bezier (.09,.98,.67,.33);
				}
				
				.project a:hover > span strong{
					border: 1px solid #ff7d39;
				}
				
			
		
		
		.project figure{
			margin: 0;
		}
		
			.project figure img{
				height: auto;
				width: 100%;
			}
			

/*	Home - projects Award 
--------------------------*/	

	.project.wa_win:before{
		background: #5d5c5c;
		opacity: 0.4;
	}

	.project.wa_win:hover:before{
		background: #000;
		opacity: 0.7;
	} 
			
	.project.wa_win:after{
		background: url(images/winner.png) no-repeat center;
		background-size: 40%;
		content: '';
		display: block;
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
		z-index: 1;
		

		transition: all 1s cubic-bezier(.04,.8,.75,1.27);
		-o-transition: all 1s cubic-bezier(.04,.8,.75,1.27);
		-ms-transition: all 1s cubic-bezier(.04,.8,.75,1.27);
		-moz-transition: all 1s cubic-bezier(.04,.8,.75,1.27);
		-webkit-transition: all 0.5s cubic-bezier(.04,.8,.75,1.27);
	}
	
	.project.wa_win:hover:after {
		opacity: 0;
	}
		
		.project.wa_win h3{	
			z-index: 3;
		}

			
		
/*==========================================================================
	Home - services // 600px
========================================================================== */

.services{
	text-align: center;
}



	ul.service_nav {
		display: block;
		margin: 0 auto 15px;
		max-width: 1090px;
		width: auto;
	}	
	
		.service_nav li {
			width: 25%;
			padding: 10px;
		}
		
			.service_nav li a{
				font-size: 1.8em;
			}
			
				.service_nav a span {
					padding: 15px 0;
				}
		
/*==========================================================================
	About Us // 600px
========================================================================== */		

.about_wrap .ban_plane{
	margin: 10px 0 60px;
}

/*==========================================================================
	Client Page // 600px
========================================================================== */
		
	.client{
		float: left;
		width: 33%;
	}		
	
		.client:nth-child(even):before,
		.client:nth-child(odd):before{
			right: 0;
		}
		
		.client:nth-child(3n):before{
			display: none;
		}
		
		
		
		
		
		
	

}   

@media only screen and (min-width: 670px) {

/*==========================================================================
	Home - clients // 670px
========================================================================== */
		
	.client_logos{
		height: 155px;

	}

}

@media only screen and (min-width: 768px) {


/*==========================================================================
	Header // 768px
========================================================================== */


header .wrapper{
	padding: 20px 20px 30px;
}

		.logo a{
			height: 75px;
			width: 66px;
		}	

	#menu_button{
		margin-top: 3px;
	}	


	#menu_button.menu_button_change{
		float: right;
		margin: 3px auto 0;
			height: 26px;
			width: 32px;
	}

		#menu_button a {
			height: 26px;
			width: 32px;
		}
		
			.menu_button_change .burger, 
			.burger, 
			.menu_button_change .burger:before, 
			.burger:before, 
			.menu_button_change .burger:after,
			.burger:after {
				height: 3px;
				left: 0;
				top: 11px;
				width: 100%;
			}
			
			
			.burger:before{
				top: -11px;
			}
			
			.burger:after{
				top: 11px;
			}
			
			.menu_button_change .burger{
				top: 0;
			}
			
			.menu_button_change .burger:after,
			.menu_button_change .burger:before{
				height: 3px;
				width: 100%;
			}
			
			.mobile_menu.menu_button_change .burger{
				display: none;
			}
			
			#menu_button.mobile_menu.menu_button_change{
				background: url(images/tablet_menu_button.png) no-repeat center;
			}
			
			
		
		.nav_wrap{
			height: 760px;
			padding:0;
			width: 410px;
			
			transition: all ease-in-out 0.3s;
			-o-transition: all ease-in-out 0.3s;
			-ms-transition: all ease-in-out 0.3s;
			-moz-transition: all ease-in-out 0.3s;
			-webkit-transition: all ease-in-out 0.3s;
		}

		
			.nav_wrap:before{
				content: '';
				height: 100%;
				position: absolute;
				left: 100%;
				top: 0;
				width: 9999px;
			}
			
			.nav_wrap.reveal:before{
				background: rgba(45, 43, 43, 0.85);
			}
			
			nav.main_nav,
			.logo_heading{
				
				transition: all ease-in-out 0.3s;
				-o-transition: all ease-in-out 0.3s;
				-ms-transition: all ease-in-out 0.3s;
				-moz-transition: all ease-in-out 0.3s;
				-webkit-transition: all ease-in-out 0.3s;
			}
	
	
		
	nav.main_nav{
		display: table-cell;
		height: 760px;
		text-align: center;
		width: 410px;
		vertical-align: middle;
	}
			
			nav.main_nav ul{
				display: block;
			}
			
				nav.main_nav ul li{
					text-align: center;
				}
				
					nav.main_nav ul li a{
						font-size: 40px;
						line-height: 72px;
					}
					
		

/*==========================================================================
	Home - banner // 768px
========================================================================== */

	.home_banner{
		height: 760px;
	}

		.ban_plane{
			height: 100px;
			top: 210px;
		}
			
		.ban_text{
			top: 350px;
		}
		
		.ban_link{
			top: 580px;
		}
		
			
/*==========================================================================
	Home - about // 768px
========================================================================== */


.home_about{
	margin: 0 0 50px;
	padding: 80px 0 23px;
}

	.home_about .wrapper{
		max-width: 990px;
	}

		.home_about h2{
			float: left;
			margin: 5px 0 0;
			padding: 0 70px 0 0;
			text-align: right;
			width: 50%;
		}
		
		.home_about .about_text{
			float: left;
			font-size: 1.8em;
			margin: 2px 0 0;
			padding-left: 70px;
			position: relative;
			width: 50%;
		}
		
			.home_about .about_text:before{
				background: url(images/border_dash.png) repeat-y left;
				content: '';
				height: 100%;
				left: 0;
				margin-top: -8px;
				padding: 80px 0 0;
				position: absolute;
				top: -80px;
				width: 1px;
			}



		
/*==========================================================================
	Home - clients // 768px
========================================================================== */
		
	.client_logos{
		height: 221px;
		margin: 40px auto 0;
		padding: 50px 10px;
	}
	
		.client_logos .c_logo{
			padding: 10px 35px;
			max-width: 25%;
		}
		
			.client_logos .c_logo img{
				width: auto;
				max-width: 100%;
			}
			
			.client_logos .c_logo.tall_logo img{
				width: auto;
			}		


/*==========================================================================
	Content // 768px
========================================================================== */

		.dark_plane{
			height: 70px;
		}		
			
			
/*==========================================================================
	Home - projects // 768px
========================================================================== */
			
.portfo{
	margin: 60px 0 0;
}

/*==========================================================================
	Home - services // 768px
========================================================================== */

	.services h2{
		margin: 80px 0 70px;
	}
	
		ul.service_nav{
			margin: 0 auto 25px;
		}

				.service_nav  a figure.serv_front{
					opacity: 1;
					overflow: hidden;
					width: 0;
				}
				
				
				.service_nav li.current a figure.serv_back{
					opacity: 0;
				}
				
				.service_nav li.current a figure.serv_front{
					width: 100%;
				}
					
					.service_nav a figure img{
						width: auto;
					}
					
				.services_content{
					margin: 0 auto 40px;
				}
					
				.service_nav a span {
					padding: 25px 0 15px;
				}


/*==========================================================================
	About Us // 768px
========================================================================== */

.team_top{
	margin: 100px auto 0;
}
				
	.team_top h1.main_title{
		float: left;
		margin: 0;
		text-align: left;
		width: 50%;
	}

	.about_content{
		float: left;
		width: 50%;
	}
		
		.about_content p:first-child{
			margin-top: 0;
		}
	
	
	.main_title.team_title{
		text-align: left;
	}
	
	.team{
		margin-bottom: 120px;
		width: 720px;
	}
	
		.member:nth-child(even) .member_info{
			left: 0;
		}
		
		.member:nth-child(3n) .member_info{
			left: -240px;
		}
	
		
/*==========================================================================
	Portfolio Post // 768px
========================================================================== */

	h1.main_title.work_title{
		color: #ff7d39;
		margin-bottom: 60px;
	}
	
		.workbox{
			padding: 50px;
		}
		
		.workbox.work_main_img{
			background: #e2e0e0;
			padding: 50px;
		}
		
		.workbox figure.half_width{
			display: inline-block;
			padding: 0 0 0 25px;
			width: 49%;
		}
		
		.workbox figure.half_width:nth-child(2n){
			padding: 0 25px 0 0;
		}
		
		.work_intro{
			font-size: 2.4em;
			line-height: 1.6em;
		}
		
			.work_intro br{
				display: block;
			}
			
		
			
		.work_maintext{
			padding: 50px 130px;
		}
		
		.work_link{
			margin: 30px 0 0;
		}	
			
		.work_nav ul li:first-child,	
		.work_nav ul li{
			margin: 0 40px;
			width: 100px;
		}
		
		
			.work_nav ul li a{
				font-size: 23px;
			}
	
			
				.work_nav ul li a:before{
					left: 34px;
					width: 31px;
				}
				
				.work_nav ul li a:after{
					left: 34px;
					width: 31px;
				}
				
				.work_nav ul li.all_p a:before{
					left: 21px;
					width: 60px;
				}
				
				.work_nav ul li.all_p a:after{
					left: 21px;
					width: 60px;
				}
				
		
				
				.work_nav ul li.next_p a:hover:after{
					left: 44px;
				}
				
				.work_nav ul li.prev_p a:hover:after{
					left: 24px;
				}
				
				
				
/*==========================================================================
	CONTACT // 768px
========================================================================== */




	.contact_wrap .main_title {
		float: left;
		margin: -2px 0 0;
		text-align: left;
		width: 50%;
	}
	
		.contact_top{
			margin: 100px auto 0;
		}

	.contact_info{
		float: left;
		font-size: 3em;
		line-height: 1.5em;
		padding: 4px 0 0;
		width: 50%;
	}
		
		.contact_info p:first-child{
			margin-top: 0;
		}
		
		
	

	#the_map{
		height: 675px;
	}		

	.form{
		height: 700px;
		left: 50%;
		padding: 70px 20px 0 0;
		position: absolute;
		top: 0;
		width: 50%;
	}
	
		.form_inner{
			margin: 0;
		}
	.form_christmas{
		
	}
	
		.form_christmas_inner{
			margin: 0;
		}

		
/*==========================================================================
	Client Page // 768px
========================================================================== */
	
	.client{
		float: left;
		width: 25%;
	}	

		.client:nth-child(3n):before{
			display: block;
		}	
		
		.client:nth-child(4n):before{
			display: none;
		}	

	

/*==========================================================================
	Footer // 768px
========================================================================== */

/*------------------
	sticky footer
-------------------*/

html,body{
	height: 100%;
}

.body_wrap{
	min-height: 100%;
	margin-bottom: -345px;
}

.body_wrap:after{
	content:"";
	display: block;
}

footer,
.body_wrap:after{
	height: 345px;
}

footer{
	padding: 115px 0 45px;
}	

	.foot_Details{
		font-size: 1.6em;
	}
	
		.foot_details span{
			display: inline-block;
		}
		
		.foot_details span.slash{
			border: none;
			text-indent: 0;
			margin: 0 15px;
			max-height: 100px;
			max-width: 100px;
		}
		
		.foot_details span.slash:last-child{
			display: none;
		}
		
			.foot_details span br{
				display: none;
			}
			
		ul.social{
			margin: 27px 0 44px;
		}
			
			
}

@media only screen and (min-width: 1024px) {


/*==========================================================================
	Home - banner // 1024px
========================================================================== */

	
		.ban_text{
			letter-spacing: 0.05em;
		}


/*==========================================================================
	About Us // 1024px
========================================================================== */
	
	.team{
		width: 940px;
	}
	
	
		.member{
			display: block;
			float: left;
			margin: 0 20px 50px 0;
			max-width: 220px;
			width: 25%;
		}
		
		.member:nth-child(4n){
			margin: 0 0 50px 0;
		}	
		
			.member .member_info{
				width: 450px;
			}
			
			.member:nth-child(3n) .member_info{
				left: 0;
			}
			
			.member:nth-child(4n+3) .member_info{
				left: -230px;
			}
			
			.member:nth-child(4n) .member_info{
				left: -230px;
			}
				

		


}




@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}