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

/* Webfont Load */

.wf-loading * {opacity:0;}
.wf-active *, .wf-inactive * {opacity:1}


.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}


/* Preset */
		
* {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-kerning: auto;	
}

html {
	-webkit-text-size-adjust: 100%;
}

/* Reset */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}


body {background-color:rgba(255,255,255,1.0); color:rgb(26,26,26); font-family: 'Montserrat', sans-serif; font-size:14px; font-weight:400; font-style: normal;
	  -webkit-transition: none !important;
	  -moz-transition: none !important;
	  -ms-transition: none !important;
	  -o-transition: none !important;
}
	
	/* Global Links */
	
	a {
		color: rgba(216,94,0,1.0);
		text-decoration: none;
	}
	
	a:visited {
		color: rgba(216,94,0,1.0);
		text-decoration: none;
	}

	a:hover, a:visited:hover {
		color: rgba(0,137,150,1.0);
		text-decoration: none;
		-moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
	}





/* --------------------------------- */	
/* Containers */	

	.container {
		width: 100%;
		max-width: 1000px;
		text-align: center;
		margin: 0 auto;
	}

	.container-1200 {
		width: 100%;
		max-width: 1200px;
		text-align: center;
		margin: 0 auto;
	}

	.container-1400 {
		width: 100%;
		max-width: 1400px;
		text-align: center;
		margin: 0 auto;
	}

/* --------------------------------- */	
/* Common Text */	

	strong {
		font-weight: 700;
	}

/* --------------------------------- */	
/* Colors */

	.lightblue {color:rgb(32,165,220);}
	.blue {color:rgb(0,76,110);}

	.confirmation {
		background-color:rgb(0,76,110);
	}

/* --------------------------------- */	
/* Announcement */			
	
	.announcement {
		position:fixed;
		top: 0; 
		left: 0; 
		z-index:5000; 
		width:calc(100% - 40px); 
		background-color:rgba(32,165,220,1.0); 
		padding:20px; 
		text-align:center; 
		color:#ffffff; 
		font-size:16px; 
		line-height:21px;
	}
	
	.announcement a {
		color:#ffffff; 
		font-weight:bold;
	}



/* --------------------------------- */	
/* Billboard */		
							
	.billboard.w-announcement {
		margin-top: 60px;
	}
	
	.billboard {
		width: 100%;
		height: 90vh;
		max-height: 700px;
		display: flex;
		align-items: center;
		overflow: hidden;
		position: relative;
		z-index: 100;
		background-color: rgb(0,76,110);
		background-image: url("../images/billboard-background.jpg");
		background-size: 100% auto;
		background-position: center center;
		background-repeat: no-repeat;
	}


		.confirmation .billboard {
			width: 100%;
			height: 70vh;
			max-height: 640px;
		}


			.billboard-container {
				position: relative;
				z-index: 300;
				display: flex;
				flex-wrap: nowrap;
				width: 100%;
				height: auto;
				align-items: flex-start;
				text-align: right;
			} 

			.billboard-container-left {
				flex-basis: 40%;	
			}

			.billboard-container-left img {
				width: 80%;
				max-width: 200px;
				height: auto;
				margin: 0 10% 40% 0;
			}
				


			.billboard-container-right {
				flex-basis: 40%;
				text-align: left;
			}

				.billboard-container-right h2 {
					font-size: 36px;
					line-height: 44px;
					font-weight: 400;
					color: rgba(26,26,26);
					margin: 0 0 0 18%;
				}




/* --------------------------------- */	
/* Intro */		
							
	.intro {
		padding: 8% 4%;
		background-color:rgba(0,76,110,1.0);
		color: rgb(255,255,255);
	}

	.intro h1 {
		font-size: 21px;
		line-height: 36px;
		margin-bottom: 40px;
	}

	.confirmation .intro h1 strong {
		font-size: 28px;
		display: block;
	}

	.intro h2 {
		font-size: 21px;
		line-height: 36px;
	}


/* --------------------------------- */	
/* Approach */		
							
	.approach {
		padding-top: calc(8% + 68px);
		padding-right: 4%;
		padding-bottom: calc(8% + 68px);
		padding-left: 4%;
		background-color:rgb(255,255,255);
		background-image: url("../images/diagonal-pattern.png");
		background-position: top center;
		background-repeat: repeat-x;
		background-size: 68px auto;
		position: relative;
	}

	.approach-overlay {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 68px;
		background-color:rgb(255,255,255);
		background-image: url("../images/diagonal-pattern.png");
		background-position: bottom center;
		background-repeat: repeat-x;
		background-size: 68px auto;
	}

	.approach h2 {
		font-size: 28px;
		color: rgb(0,76,110);
		font-weight: 700;
		text-transform: uppercase;
		margin-bottom: 60px;
	}

	.approach h3 {
		font-size: 21px;
		line-height: 36px;
		margin-bottom: 60px;
	}


	.approach-diagram {
		width: 90%;
		margin: 0 auto 100px auto;
	}

	.benefit-blocks {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		column-gap: 3%;
	}

		.benefit-block {
			background-color: rgba(207,210,211,.3);
			flex-basis: calc(31% - 8%);
			padding: 4%;
		}

			.benefit-block h4 {
				font-size: 18px;
				font-weight: 700;
				color: rgb(0,76,110);
				margin-bottom: 30px;
			}

			
			.benefit-block .seperator {
				width: 50%;
				margin: 0 auto 30px auto;
			}

			.benefit-block .seperator img {
				width: 100%;
				height: auto;
			}

			.benefit-block p {
				font-size: 18px;
				line-height: 28px;
				margin-bottom: 0;
			}



/* --------------------------------- */	
/* Meeting Room Panel */		
							
	.meeting {
		padding: 25% 4%;
		background-color:rgb(255,255,255);
		background-image: url('../images/meeting-background.jpg');
		background-size: cover;
		background-attachment: fixed;
		background-position: center center;
		background-repeat: no-repeat;
	}



/* --------------------------------- */	
/* About */		
							
	.about {
		padding-top: calc(8% + 68px);
		padding-right: 4%;
		padding-bottom: 8%;
		padding-left: 4%;
		background-color:rgba(32,165,220,1.0);
		background-image: url("../images/diagonal-pattern.png");
		background-position: top center;
		background-repeat: repeat-x;
		background-size: 68px auto;
		background-blend-mode: multiply;
		color: rgb(255,255,255);
	}

	.about h2 {
		font-size: 28px;
		color: rgb(255,255,255);
		font-weight: 700;
		text-transform: uppercase;
		margin-bottom: 60px;
	}

	.about h3 {
		font-size: 21px;
		line-height: 36px;
		margin-bottom: 40px;
	}



/* --------------------------------- */	
/* Cogs */		
							
	.cogs {
		padding: 25% 4%;
		background-color:rgb(255,255,255);
		background-image: url('../images/cogs-background.jpg');
		background-size: cover;
		background-attachment: fixed;
		background-position: center center;
		background-repeat: no-repeat;
	}

		.cogs-panel {
			margin: 0 auto;
			text-align: center;
		}

			.cogs-panel h3 {
				font-size: 24px;
				color: rgb(255,255,255);
				font-weight: 700;
			}



/* --------------------------------- */	
/* Profile */		
							
	.profile {
		padding-top: calc(8% + 68px);
		padding-right: 4%;
		padding-bottom: 8%;
		padding-left: 4%;
		background-color:rgb(255,255,255);
		background-image: url("../images/diagonal-pattern.png");
		background-position: top center;
		background-repeat: repeat-x;
		background-size: 68px auto;
	}
	

	.profile .container-1200 {
		display: flex;
		text-align: left;
		align-items: flex-start;
	}
	
		.profile .photo {
			flex-basis: 30%;
			text-align: center;
		}

			.profile .photo img {
				width: 80%;
				max-width: 200px;
				height: auto;
				border: 12px solid rgb(242,242,242);
				border-radius: 50%;
			}

		.profile .description {
			flex-basis: 70%;
		}

			.profile .description h3 {
				font-size: 21px;
				line-height: 28px;
				margin: 0 0 30px 0;
			}

				.profile .description h3 strong {
					font-weight: 700;
					display: block;
				}


			.profile .description p {
				font-size: 21px;
				line-height: 28px;
				margin: 0 0 30px 0;
			}


			.profile .description p.linkedin a, .profile .description p.linkedin a:visited {
				display: inline-block;
				background-color: rgba(32,165,220,0.90);
				color: rgb(255,255,255);
				padding: 14px 32px;
				font-size: 18px;
				font-weight: 600;
				text-transform: uppercase;
			}

				.profile .description p.linkedin a:hover, .profile .description p.linkedin a:visited:hover {
					background-color: rgba(0,76,110,1.0);
				}





/* --------------------------------- */	
/* Experience */		
							
	.experience {
		padding-top: 8%;
		padding-right: 4%;
		padding-bottom: calc(8% + 68px);
		padding-left: 4%;
		background-color:rgba(207,210,211,.3);
		background-image: url("../images/diagonal-pattern.png");
		background-position: bottom center;
		background-repeat: repeat-x;
		background-size: 68px auto;
		background-blend-mode: multiply;
	}

		.experience h2 {
			font-size: 36px;
			color:rgb(102,102,102);
			font-weight: 600;
			text-transform: uppercase;
			margin-bottom: 60px;
		}

		.experience-items {
			width: 100%;
			max-width: 1200px;
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-start;
			margin: 40px auto 0 auto;
		}

			.experience-items li {
				flex-basis: 28%;
				margin: 20px 2.666% 20px 2.666%;
				text-align: left;
				font-size: 16px;
				line-height: 21px;
				color: rgb(77,77,77);
			}

				.experience-items li strong {
					display: block;
					font-size: 18px;
					line-height: 21px;
					margin-bottom: 4px;
				}




/* --------------------------------- */	
/* Contact Form */		
							
	.contactform {
		padding: 6% 4%;
		background-color:rgba(0,76,110,1.0); 
	}

		.contactform .container {
			max-width: 800px;
			margin: 0 auto;
		}

		.contactform .form-container {
			max-width: 500px;
			margin: 0 auto;
		}

			.contactform h2 {
				font-size: 36px;
				color:rgb(255,255,255);
				font-weight: 600;
				text-transform: uppercase;
				margin-bottom: 30px;
			}

			.contactform p {
				font-size: 18px;
				line-height: 24px;
				color:rgb(255,255,255);
				margin: 0 4% 30px 4%;
			}


		.contact-venture-worx label {
			display: none;
		}
		
		.contact-venture-worx input[type="text"], .contact-venture-worx input[type="email"] {
			-webkit-appearance: none;
			display: block;
			width: calc(100% - 44px);
			margin: 0 0 15px 0;
			padding: 20px; 
			border: 2px solid rgba(91,102,112,0.20);
			font-family: 'Montserrat', sans-serif;
			font-size: 16px;
			font-weight: 700;
			color: rgba(92,102,112,1.0);
			background-color: rgb(248,248,248);
		}
		
			.contact-venture-worx input[type="text"]:focus, .contact-venture-worx input[type="email"]:focus {
				outline: none;
				border: 2px solid rgba(32,165,220,1.0);
				-moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
			}
		
			.contact-venture-worx input[type="text"]::placeholder, .contact-venture-worx input[type="email"]::placeholder {
				display: inline-block;
				width: 80%;
				margin: 0 -4px 0 0;
				color:rgb(100,100,100);
			}

			.contact-venture-worx button[type="submit"] {
				font-family: 'Montserrat', sans-serif;
				display: block;
				width: calc(100% - 0px);
				background-color: rgba(32,165,220,1.0);
				border: 2px solid rgba(32,165,220,1.0);
				color: rgba(255,255,255,0.80);
				vertical-align: baseline;
				font-size: 18px;
				line-height: 18px;
				padding: 20px;
				cursor: pointer;
				margin: 5px 0;
				font-weight: 600;
				text-transform: uppercase;
				text-align: center;
				-moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
			}

				.contact-venture-worx button[type="submit"]:focus {
					outline: none;
					border: 2px solid rgba(20,150,200,1.0);
					color: rgba(255,255,255,1.0);
					-moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
				}

			.contact-venture-worx button[type="submit"]:hover {
				border: 2px solid rgba(20,150,200,1.0);
				background-color: rgba(20,150,200,1.0);
				color: rgba(255,255,255,1.0);
				-moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
			}		


		#loop {
			animation: rotation 1s infinite;
		}

		p.captcha-statement {
			text-align: center;
			font-size: 12px;
			line-height: 16px;
			margin: 0;
			color: rgba(255,255,255,1.0);
		}

			p.captcha-statement a {
				color: rgba(255,255,255,1.0);
				text-decoration: underline;
			}

			p.captcha-statement a:hover {
				color: rgba(255,255,255,1.0);
				text-decoration: none;
			}

		.grecaptcha-badge {
			opacity: 0;
		}


/* --------------------------------- */	
/* Footer */		
							
	footer {
		padding: 4%;
		text-align: center;
		color: rgb(255,255,255);
		background-color:rgba(0,76,110,1.0); 
	}





/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* Mobile */

@media screen and (max-width: 769px){
	
	
	.profile, .approach, .approach-overlay, .about, .experience {
		background-size: 48px auto;
	}
	
	.confirmation .billboard {
		max-height: 200px;
	}
		
	.billboard {
		max-height: 300px;
		background-size: auto 100%;
		align-items: flex-start;
	}
	
		.billboard-container {
			flex-wrap: wrap;
			padding-top: 16%;
		}
	
			.billboard-container-left {
			  flex-basis: 38%;
			}
	
			.billboard-container-left img {
				padding-top: 3px;
				max-width: 90px;
			}

			.billboard-container-right {
			  flex-basis: 55%;
			}
	
			.billboard-container h2 {
				font-size: 18px;
				line-height: 21px;
				margin: 0 0 0 20px;
			}
	
	
	.intro, .about, .experience, .profile, .contactform  {
		padding: 80px 8%;
	}
	
	
	.intro h1, .intro h2 {
		font-size: 18px;
 		line-height: 24px;
	}
	
	.approach h2 {
		margin-bottom: 30px;
	}
	
	.approach h3 {
		font-size: 18px;
 		line-height: 24px;
	}
	
	
	.benefit-block {
		flex-basis: 80%;
		padding: 40px 4%;
		margin-bottom: 40px;
	}
	
	.cogs, .meeting {
		background-attachment: initial;
	}
	
	.about h3 {
		font-size: 18px;
 		line-height: 24px;
	}
	
	.cogs-panel h3 {
		line-height: 32px;	
	}
	
	
	.profile .container-1200 {
		flex-wrap: wrap;
	}
	
		.profile .photo {
			flex-basis: 80%;
			margin: 0 auto 40px auto;
		}
	
		.profile .description {
			flex-basis: 80%;
			margin: 0 auto;
		}
	
			.profile .description p {
				font-size: 18px;
 				line-height: 24px;
			}
	
		.experience-items li {
			flex-basis: 80%;
			margin: 20px 0;
			font-size: 14px;
		}
	
		
}
	

	
/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* Desktop */

@media screen and (min-width: 769px){
		
	.billboard {	
		background-size: 100% auto;
		background-position: top center;
		background-attachment: fixed;
		background-repeat: no-repeat;
	}
	
	.culture {
		background-size: 100% auto;
		background-position: top center;
		background-attachment: fixed;
		background-repeat: no-repeat;
	}
	
	.cc-panel {
		background-size: 100% auto;
		background-position: center center;
		background-attachment: fixed;
		background-repeat: no-repeat;
	}
		
}
	

/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* Smaller Screen */

@media screen and (min-width: 530px) and (max-width: 955px){
		
				
		
}



/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */			
/* Large Screen */

@media screen and (min-width: 1800px) {
	
	.billboard {
		max-height: 1000px;
	}
	
	
	.billboard-container-left img {
		margin-right: 0;
	}
	
		
}



/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */	
/* Desktop (Portrait) - This effects large tablets as well. */

@media only screen and (min-width: 769px) and (max-width: 1760px) and (orientation: portrait) {
	
	
	
	.billboard {
		max-height: 500px;
		background-attachment: scroll;
	}
	

		.billboard-container {
			flex-wrap: wrap;
			align-self: flex-start;
			padding-top: 12%;
		}
	
			.billboard-container-left {
			  flex-basis: 38%;
			}
	
			.billboard-container-left img {
				padding-top: 3px;
				max-width: 100px;
			}

			.billboard-container-right {
			  flex-basis: 45%;
			}
	
			.billboard-container h2 {
				font-size: 28px;
				line-height: 26px;
				margin: 0 0 0 20px;
			}
	
	
	.meeting, .cogs {
		background-attachment: scroll;
	}
	
}



/* iPad Pro Portrait and Landscape */
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 1112px)
  and (-webkit-min-device-pixel-ratio: 2) {

	  
	.billboard, .meeting, .cogs {
		background-attachment: scroll;
	}
	  
}




/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */
/* --------------- */	
/* --------------- */			
/* Mobile Landscape */

@media screen and (max-width: 769px) and (orientation: landscape){
		
	
	
		
		
}


@keyframes rotation {
  0% {
	transform: rotate(0deg);
  }
  100% {
	transform: rotate(360deg);
  }
}
