@charset "UTF-8";
/* CSS Document */


body {
	background: #F4F4F4;
	font-family: Didact Gothic;
	min-height: calc(100vh - 15px);
	border: 15px solid rgba(255,255,255,1.0);
	border-top: 0px;
	min-width: 290px;
}


.inside_logo {
	width: 80px;
	height: 65px;
	padding: 5px 48px 12px 48px;
	position: absolute;
	left: 50%;
	transform: translate(-50%, 0%);
	border-radius: 0% 0% 150px 150px;
	background: #ffffff;
	-webkit-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.05);
	-moz-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.05);
	box-shadow: 0 8px 6px -6px rgba(0,0,0,0.05);
}

.inside_logo .img {
	margin: 0 auto;
	postion: relative;
	bottom: 10px;
}

.inside_content {
	width: 90%;
	margin: 0 auto;
	margin-top: 80px;
	max-width: 1500px;
}

.pagetitle {
	font-size: 42px;
	line-height: 1.0;
	text-transform: uppercase;
	letter-spacing: 6px;
	color: #828fa2;
	padding: 20px 0px 25px;
	background: #F4F4F4;
}

.topstatic {
	position: -webkit-sticky;
	position: sticky;
	top: 40px;
	z-index: 9;
	padding-top: 110px;
}

.portpagetitle {
	padding: 115px 7.5% 15px;
	width: calc(85% - 30px);
    position: fixed;
    left: 0;
	font-size: 42px;
	line-height: 1.0;
	text-transform: uppercase;
	letter-spacing: 6px;
	color: #828fa2;
	background: #F4F4F4;
	border-left: 15px solid #ffffff;
	border-right: 15px solid #ffffff;
}

	/**Portfolio CSS**/
	
	.inside_content_port {
	width: 85%;
	margin: 0 auto;
	margin-top: 0px;
	max-width: 1500px;
	padding-top: 165px;
	}
	
	.portpagetitleinner {
		margin: 0 auto;
		width: 100%;
		max-width: 1500px;
		
	}
	
	.portfolio_item_holder {
		width: 100%;
		padding: 2vh 0%;	
		margin-top: 3vh;
		margin-bottom: 5vh;
	}
	
	.portfolio_item {
		display: flex;
		flex-wrap: wrap;
		position: relative;
		overflow: visible;
	}
	
	.portfolio_image {
		width: calc(50% - 50px);
		position: relative;
		overflow: hidden;
		}
		
	.portfolio_image img {
		outline: 10px solid white;
  		outline-offset: -9px;
		box-shadow: 4px 4px 8px rgba(0,0,0,0.01);
		position: relative;
	}
	
	.more {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		height: 75px;
		width: 75px;
		opacity: .25;
		background: url(../template_img/plus.png);
		background-size: cover;
		z-index: 8;
		-webkit-transition: all ease-in .75s;
		-moz-transition: all ease-in .75s;
		transition: all ease-in .75s;
	}
	
	.portraitafter .more {
		left: 40%;
	}
	
	.portfolio_image:hover .more {
		height: 100px;
		width: 100px;
		opacity: 1;
	}
	
	.landscape {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	
	.portrait {
		width: 80%;
		height: auto;
	}
	
	.portfolio_image_before .portrait, .portfolio_image_before_porttall .portrait {
		margin-left: 20%;
	}
	
	.landscape_after {
		margin-top: 10vh;
		margin-bottom: 10vh;
	}
	
	.portfolio_image_before_porttall {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
	}
	
	.portfolio_title_holder {
		position: relative;
		width: 100px;
	}
	
	.portfolio_title {
		font-size: 30px;
		line-height: 30px;
		padding: 8px 10px 12px 10px;
		text-transform: uppercase;
		letter-spacing: 4px;
		color: #4a5b73;
		background: #F4F4F4;
		text-align: center;
		width: 300px;
		position: absolute;
		top: 50%;
		margin-left: -110px;
		transform: translateY(-50%);
		z-index: 5;
		outline: 10px solid white;
  		outline-offset: -9px;
	}
	
	.divider {
		color: #828fa2;
		font-size: 40px;
		letter-spacing: 0px;
		width: 45px;
    	display: inline-block;
	}
	
	.portfolio_caption {
		width: 75%;
		margin: 3vh 12.5% 5vh;
	}
	
	.portfolio_image_caption {
		font-family: 'Didact Gothic', sans-serif;
		font-size: 22px;
		font-weight: 300;
		letter-spacing: 6px;
		text-transform: uppercase;
		text-align: center;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	.portfolio_image_caption a {
		color: #9E9E9E;
		text-decoration: none;
	}
	
	
	.grow {
		-webkit-transition: all .75s;
		-moz-transition: all .75s;
		transition: all .75s;
	}
	
	.grow:hover {
		transform: scale(1.05);
	}
	
	.half{
		width: calc(47.5% - 20px);
		padding: 10px;
		float: left;
		position: relative;
		margin-bottom: 50px;
	}
	
	.half img {
		outline: 10px solid white;
  		outline-offset: -9px;
		box-shadow: 4px 4px 8px rgba(0,0,0,0.01);
		
	}
	
	.half:nth-of-type(even) {
		margin-right: 2.5%;
		margin-left: 0%;
	}
	
	.half:nth-of-type(odd){
		margin-left: .5%;
		margin-right: 0%;
	}
	
	.pin-it {
	position: absolute;
    right: 15px;
    bottom: 41px;
	}
	
	/**Profile CSS**/
	
	.profile_holder {
		padding: 0vh 0% 5vh 0%;
	}
	
	.profileholder {
		width: 50%;
		margin-right: 10%;
		float: left;
		padding: 0px 0% 2vh 0%;
	}

	.profilepicture {
		margin-top: 20px;
		width: 40%;
		float: right;
	}
	
	.profilepicture img {
		outline: 10px solid white;
  		outline-offset: -9px;
		box-shadow: 4px 4px 8px rgba(0,0,0,0.01);
	}
	
	/**Services CSS**/
	
	.services_content {
		margin: 0vh -2%;
		padding: 2vh 0% 8vh 0%;
	}
	
	.services_list {
		list-style: none;
		display: flex;
		flex-wrap: wrap;
	}
	
	.services_list li {
		background: #E6E6E6;
		display: inline-block;
		width: calc((100% - (3% * 4)) / 4);
		margin: 2vh 1.5%;
		outline: 10px solid white;
  		outline-offset: -9px;
		box-shadow: 4px 4px 8px rgba(0,0,0,0.01);
		-webkit-transition: all .75s;
		-moz-transition: all .75s;
		transition: all .75s;
		position: relative;
		z-index: inherit;
		-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
		filter: grayscale(100%);
		  -webkit-transition-timing-function:cubic-bezier(.53,.32,.63,1);
  			-webkit-transform: translate3d(0, 0, 0);
	}
	
	.services_image {
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	
	.services_image img {
	
	}
	
	.services_caption {
		position: absolute;
		bottom: 8px;
		background: rgba(255,255,255,0.89);
		padding: 1vh 5%;
		width: 90%;
		text-align: center;
		box-shadow: 4px 4px 8px rgba(0,0,0,0.0);
		-webkit-transition: all .5s;
		-moz-transition: all .5s;
		transition: all .5s;
	}
	
	.services_caption h4 {
		color: #4a5b73;
	}
	
	.services_list li:hover {
		transform: scale(1.20);
		box-shadow: 4px 4px 15px rgba(0,0,0,0.15);
		overflow: visible;
		z-index: 5;
		-webkit-filter: none; /* Safari 6.0 - 9.0 */
		filter: none;
	}
	
	.services_list li:hover .services_caption {
		position: absolute;
		bottom: -30px;
		background: rgba(255,255,255,1.00);
		box-shadow: 4px 4px 15px rgba(0,0,0,0.15);
	}
	
	/**Press CSS**/
		.pressholder {
			display: flex;
			flex-wrap: wrap;
		}
	
		.pressitemholder {
			width: calc(48% - 30px);
			margin-bottom: 3vh;
			background: #ffffff;
			box-shadow: 2px 2px 5px rgba(0,0,0,0.05);
			padding: 15px;
			display: flex;
		}
		
		.pressitemholder:nth-child(odd) {
			margin-right: 1%;
		}

		.pressitemholder:nth-child(even) {
			margin-left: 1%;
		}
		
		.pressimage {
			width: calc(40% - 2px);
			display: inline-block;
		}
		
		.pressimage img {
			box-shadow: 1px 1px 3px rgba(0,0,0,0.20);
		}
		
		.pressoverview {
			width: calc(60% - 50px);
			padding: 0px 25px;
			display: inline-block;
		}
		
		.presstextholder {
		
		}
		
		.presstextholder a {
			font-family: 'Didact Gothic', sans-serif;
			font-size: 16px;
			font-weight: 700;
			letter-spacing: 2px;
			color: #828fa2;
			text-decoration: none;
			padding-top: 15px;
			display:block;
		}
		
		.pressdate {
		font-family: 'Didact Gothic', sans-serif;
	font-size: 16px;
	font-weight: 300;
	letter-spacing: 2px;
			color: #424242;
			text-transform: uppercase;
}
	
	
	/** CONTACT CSS**/
	
	.mapholder {
		margin-bottom: 5vh;
		border: 10px solid white;
	}
	
	.contactholder {
	display: flex;
	flex-wrap: wrap;
		}

   .col {
	   width: calc(45% - 80px);
	   padding: 40px;
	   float: left;
	   outline: 10px solid white;
  		outline-offset: -9px;
		box-shadow: 4px 4px 8px rgba(0,0,0,0.01);
   }
   
   .col:nth-of-type(even) {
   	margin-right: 0%;
	margin-left: 5%;
   }
   
   .col:nth-of-type(odd){
   	margin-left: 0%;
	margin-right: 5%;
   }
   
	#social_holder li {
		display: inline-block;
		width: 20px;
		padding: 0px 20px 0px 0px;
	}
	
	
	.contactbuttonholder {
		display: flex;
		 justify-content: center;
  align-items: center;
		}
    	
    .contactbutton {
		width: 200px;
		margin-bottom: 4vh;
		margin: 10px 10px 4vh 10px;
		}
		
    .contactbuttonicon {
		width: 50px;
		margin: 0px 75px 10px 75px;
		}
		
    .downloadicon {}
	
    .contactbuttontext {
		width: calc(100% - 20px);
		padding: 10px;
		text-align: center;
		font-family: 'Didact Gothic', sans-serif;
		font-size: 17px;
		line-height: 1.25;
		font-weight: 300;
		letter-spacing: 2px;
		color: #ffffff;
		background: #aeb6bf;
		border-radius: 5px;
		}
		
		.contactbuttontext a, .contactbutton a, contactbuttona, contactbuttona a {
		text-decoration: none;
		}
		
		.social {
			display: inline-block;
			width: 25%;
			margin: 15px 25px 10px 0px;
		}
	
	
	@media only screen and (max-width: 1500px) {
	.services_list li {
		width: calc((100% - (2% * 4)) / 4);
		margin: 1.5vh 1%;
	}
	}
	
	
@media only screen and (max-width: 1200px) {
	
	.portfolio_image {
		width: calc(50% - 50px);
		position: relative;
		overflow: hidden;
		}
	
	.portfolio_title_holder {
		width: 100px;
	}
	
	.portfolio_title {
		font-size: 24px;
		line-height: 24px;
		padding: 10px 15px 15px 15px;
		width: 225px;
		margin-left: -80px;
	}
	
	.divider {
		font-size: 35px;
		letter-spacing: 0px;
		width: 35px;
    	display: inline-block;
	}
	
	.services_list li {
		width: calc((100% - (3% * 3)) / 3);
		margin: 1.5vh 1.5%;
	}
	
	.contactbutton {
		width: 155px;
		margin-bottom: 4vh;
		margin: 10px 8px 4vh 8px;
		}
		
    .contactbuttonicon {
		width: 40px;
		margin: 0px 70px 10px 70px;
		}
		
    .downloadicon {}
	
    .contactbuttontext {
		width: calc(100% - 12px);
		padding: 6px;
		font-size: 14px;
		}
		
		.inactive {
			opacity: 0.60;
		}
	
}


@media only screen and (max-width: 1024px) {
	
	.portfolio_item_holder {
		width: 100%;
		padding: 2vh 0%;	
	}
	
	.profile_holder {
		padding: 1vh 0% 4vh 0%;
	}
	
	
	.profileholder {
		width: 80%;
		margin-right: 0%;
		float: none;
		padding: 3vh 10%;
	}

	.profilepicture {
		width: 50%;
		padding: 0vh 25%;
		float: none;
	}
	
	.pressholder {
		display: inherit;
	}
	
	.pressitemholder {
			width: calc(100% - 30px);
			padding: 15px;
		}
		
			.pressitemholder:nth-child(odd) {
			margin-right: 0%;
		}

		.pressitemholder:nth-child(even) {
			margin-left: 0%;
		}
	
}


	
@media only screen and (max-width: 968px) {
	
	.portfolio_image {
		width: calc(50% - 25px);
		position: relative;
		overflow: hidden;
		}
	
	.portfolio_title_holder {
		width: 50px;
	}
	
	.portfolio_title {
		font-size: 18px;
		line-height: 18px;
		padding: 8px 10px 12px 10px;
		width: 180px;
		margin-left: -80px;
	}
	
	.divider {
		font-size: 25px;
		letter-spacing: 0px;
		width: 25px;
    	display: inline-block;
	}
	
	.portfolio_caption {
		width: 85%;
		margin: 2vh 7.5% 2vh;
	
	}
	
	.contactbuttonholder {
		display: inherit;
	}
	
	.contactbutton {
		width: 180px;
		margin-left: calc(50% - 90px); 
		margin-top: 2vh;
		margin-bottom: 2vh;
		}
		
	.contactbuttonicon {
		width: 40px;
		margin: 0px 70px 10px 70px;
		margin-left: calc(50% - 20px);
		}
}
	
@media only screen and (max-width: 768px) {	

	.inside_logo {
		position: -webkit-sticky;
		position: sticky;
		top: 0;
	}
	
	.inside_content {
		margin-top: 0px;
		padding-top: 10px;
		max-width: 1500px;
	}
	
	.portfolio_item {
		display: flex;
	}
	
	.portfolio_image {
		width: 48%;
		padding: .5vh 0%;
		display: flex;
		margin: 0vh 1%;
		}
	
	.portfolio_title_holder {
		width: 100%;
		position: absolute;
		bottom: -10px;
	}
	
	.half {
	   width: calc(100% - 20px);
	   float: none;
	   margin-bottom: 0vh;
   }
   
   .half:nth-of-type(odd) {
   	margin-right: 0%;
	margin-left: 0%;
   }
   
   .half:nth-of-type(even){
   	margin-left: 0%;
	margin-right: 0%;
   }
	
	
	.landscape {
		position: inherit;
		transform: translate(0%,0%);
	}
	
	.portfolio_title {
		font-size: 20px;
		line-height: 20px;
		padding: 12px 10px 14px 10px;
		width: 94%;
		box-shadow: none;
		background: none;
		outline: none;
		outline-offset: inherit;
		top: -20px;
		margin-left: 0px;
	}
	
	.divider {
		width: 75px;
	}
	
	.services_list li {
		width: calc((100% - (2% * 2)) / 2);
		margin: .75vh 1%;
	}
	
	.services_list li:hover {
		transform: scale(1.10);
	}
	
	.services_caption h4 {
		font-size: 15px;
	}
	
	.profilepicture {
		width: 60%;
		padding: 0vh 20%;
		float: none;
		margin-top: 0px;
	}
	
	.mapholder {
		margin-bottom: 5vh;
	}

   .col {
	   width: calc(100% - 80px);
	   float: none;
	   margin-bottom: 4vh;
   }
   
   .col:nth-of-type(odd) {
   	margin-right: 0%;
	margin-left: 0%;
   }
   
   .col:nth-of-type(even){
   	margin-left: 0%;
	margin-right: 0%;
   }
	
	.contactbuttonholder {
		display: inherit;
		}
		
.portfolio_item_holder {
		width: 100%;
		padding: 10px 0% 25px 0%;	
		margin-top: 20px;
		margin-bottom: 20px;
	}
	
	.portfolio_toggle {
		bottom: 10px;
		right: 30px;
		width: 100px;
	}
	
	.toggleimage {
		width: 80px;
		padding: 5px 10px;
	}

	.more {
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		height: 40px;
		width: 40px;
	}
	
	.portraitafter .more {
		left: 40%;
	}
	
	.portfolio_image:hover .more, .half img:hover .more {
		height: 50px;
		width: 50px;
	}
	
	.pagetitle, .portpagetitle {
			font-size: 36px;
}
	
	
	.inside_content_port {
    margin-top: -100px;
	}
	
	.pagetitle .topstatic {
		padding: 100px 0px 25px;
}

.topstatic {
	top: 5px;
	padding-top: 100px;
}

.portfolio_image_caption a span {
	display: none;
}
	
}

@media only screen and (max-width: 480px) {
	.inside_logo {
	width: 80px;
	height: 65px;
	padding: 5px 48px 12px 48px;
	position: absolute;
	left: 50%;
	transform: translate(-50%, 0%);
	border-radius: 0% 0% 150px 150px;
	background: #ffffff;
	-webkit-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.05);
	-moz-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.05);
	box-shadow: 0 8px 6px -6px rgba(0,0,0,0.05);
}
	
	.services_list li {
		width: calc(100% - 3%);
		margin: .5vh 1.5%;
	}
	
	.services_list li:hover {
		transform: scale(1.05);
	}
	
	.profilepicture {
		width: 65%;
		padding: 0vh 17.5%;
		float: none;
	}
	
	.pressitemholder {
		display: inherit;
	}
		
		.pressimage {
			width: 75%;
			margin: 0vh 12.5% 2vh 12.5%;
		}
		
		.pressoverview {
			width: calc(100% - 50px);
			padding: 0px 25px;
			display: inline-block;
		}
		
		.pagetitle, .portpagetitle {
			font-size: 28px;
}

	.portfolio_image img {
		outline: 6px solid white;
  		outline-offset: -5px;
	}
	
	.portfolio_image {
		width: 48%;
		margin: 0vh 1%;
		}
	
	.inside_content_port {
		margin-top: 120px;
		width: calc(100% - 20px);
		padding-top: 20px;
	}
	
	.divider {
		width: 50px;
	}
	
	
	.inside_content {
		margin-top: 0px;
		padding-top: 80px;
		max-width: 1500px;
	}
	
}