/**
 * @file
 * Subtheme specific CSS.
 */

 /***
.highlighted {
 heigth:30%;
 min-height:400px;
 width:100%;
 margin:0;
 padding:0;
 background-color:black;
 background-position: center;
}

.content-region-2-wrapper {
	background-color:black;
	color:white;
}

.content-region-2-wrapper a,
.content-region-2-wrapper h2 a,
.content-region-2-wrapper h3 a 
{
	color:white;
}
***/

/****************************/
/**
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Comfortaa:300,400,700&display=swap');
**/
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,700,900&display=swap');


body{
	font-family: 'Source Sans Pro', sans-serif;
}

#page-wrapper{
	overflow:hidden;
}

a{
	text-decoration:none;
	transition:all 0.3s;
	-moz-transition:all 0.3s;
	-webkit-transition:all 0.3s;
}
a:hover{
	text-decoration:none;
}

#header{
	position:fixed;
	width:100%;
	z-index:9;
	height:70px;
}

#navbar-main{
	background:none !important;
}

#header #navbar-top {
    background: none;
	z-index:3;
	padding:15px;
	height:70px;
	position:relative;
	transition:all 0.3s;
	-moz-transition:all 0.3s;
	-webkit-transition:all 0.3s;
}

.cf-scrolled #header #navbar-top {
	background: #3c3c3b;
}

.region-top-header{
	margin:0;
	display:block;
	position:relative;
	width:100%;
	overflow:hidden;
	height:70px;
}

#block-menutrigger{
	position:absolute;
	left:0;
	top:0;
	z-index:9;
}

.burger-menu{
	display:block;
	width:30px;
	height:45px;
	cursor:pointer;
	position:relative;
	padding-top:15px;
	transition:all 0.2s;
	-moz-transition:all 0.2s;
	-webkit-transition:all 0.2s;
}

.burger-menu-close{
	display:block;
	width:30px;
	height:45px;
	cursor:pointer;
	position:relative;
	padding-top:15px;
	opacity:0;
	position:absolute;
	top:0;
}


.active-menu .burger-menu{
	opacity:0;
}

.active-menu .burger-menu-close{
	opacity:1;
}

.burger-menu:before{
	position:absolute;
	background:url(../images/cf-menu-white.png) no-repeat center bottom;
	background-size:30px 15px;
	height:0;
	width:100%;
	content:"";
	transition:all 0.2s;
	-moz-transition:all 0.2s;
	-webkit-transition:all 0.2s;
	overflow:hidden;
	bottom:31px;
}

.cf-scrolled .burger-menu:before{
	height:15px;
}

.burger-menu-close span,
.burger-menu span{
	position:absolute;
	top:50%;
	height:3px;
	width:100%;
	background:#fff;
	transition:all 0.2s;
	-moz-transition:all 0.2s;
	-webkit-transition:all 0.2s;
}

.active-menu .burger-menu span,
.burger-menu-close span{
	background:none;
}

.burger-menu-close span:before,
.burger-menu-close span:after,
.burger-menu span:before,
.burger-menu span:after{
	background:#fff;
	position:absolute;
	content:"";
	width:100%;
	height:3px;
	top:-11px;
	transition:all 0.2s;
	-moz-transition:all 0.2s;
	-webkit-transition:all 0.2s;
}

.burger-menu-close span:before,
.burger-menu-close span:after{
	background:#fff;
	transition:all 0.3s ease 0.2s;
	-moz-transition:all 0.3s ease 0.2s;
	-webkit-transition:all 0.3s ease 0.2s;
}

.burger-menu-close span:after,
.burger-menu span:after{
	top:11px;
}

.cf-scrolled .burger-menu span,
.cf-scrolled .burger-menu span:before,
.cf-scrolled .burger-menu span:after{
	height:6px;
}

.active-menu .burger-menu-close span:before{
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	top:0;
	height:6px;
}
.active-menu .burger-menu-close span:after{
	transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	top:0;
	height:6px;
}

#block-mainnavigation{
	width:0;
	overflow:hidden;
	background:rgba(0,0,0,0);
	position:fixed;
	top:0;
	left:0;
	bottom:0;
	transition:width 0.1s ease 0.3s, background 0.3s;
	-moz-transition:width 0.1s ease 0.3s, background 0.3s;
	-webkit-transition:width 0.1s ease 0.3s, background 0.3s;
	z-index:8;
}

#block-mainnavigation > h2{
	display:none;
}

#block-mainnavigation a{
	font-weight:900;
	padding:10px 20px;
	color:#fff;
	font-size:40px;
}

#block-mainnavigation a:hover{
	padding-left:35px;
}

#block-mainnavigation ul.navbar-nav{
	top:45%;
	transform:translate(-100%,-45%);
	-moz-transform:translateY(-100%,-45%);
	-webkit-transform:translateY(-100%,-45%);
	position:relative;
	display:inline-block;
	transition:0.2s;
	-moz-transition:0.2s;
	-webkit-transition:0.2s;
}

.active-menu #block-mainnavigation ul.navbar-nav{
	transform:translate(0,-45%);
	-moz-transform:translateY(0,-45%);
	-webkit-transform:translateY(0,-45%);
	transition:0.2s ease 0.3s;
	-moz-transition:0.2s ease 0.3s;
	-webkit-transition:0.2s ease 0.3s;
}

.active-menu #block-mainnavigation{
	width:100vw;
	background:rgba(0,0,0,0.8);
	transition:width 0.2s, background 0.3s ease 0.2s;
	-moz-transition:width 0.2s, background 0.3s ease 0.2s;
	-webkit-transition:width 0.2s, background 0.3s ease 0.2s;
}


.language-switcher-language-url{
	float:right;
	position:relative;
	z-index:2;
}

.language-switcher-language-url ul{
	padding:0;
}

.language-switcher-language-url ul li{
	list-style:none;
	display:inline-block;
	margin-left:20px;
	line-height:40px;
}

.language-switcher-language-url a,
.language-switcher-language-url a:active,
.language-switcher-language-url a:focus{
	color:#bbb;
	font-size:15px;
	text-transform:uppercase;
}

.language-switcher-language-url a.is-active{
	color:#fff;
	font-weight:bold;
}
.language-switcher-language-url a:hover{
	color:#fff;
}

.highlighted {
	position:relative;
	overflow:hidden;
	background:#3c3c3b;
	min-height:100px;
}

.path-frontpage .highlighted {
	height:100vh;
}

.path-frontpage .highlighted:after {
	position:absolute;
	left:50%;
	bottom:30px;
	margin-left:-50px;
	content:"";
	background:url(../images/mouse.png) no-repeat center;
	background-size:100px 100px;
	width:100px;
	height:100px;
	-webkit-animation: shake-vertical 10s infinite both;
	        animation: shake-vertical 10s infinite both;
}

@-webkit-keyframes shake-vertical {
  0%,
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  80% {
    -webkit-transform: translateY(6.4px);
            transform: translateY(6.4px);
  }
  90% {
    -webkit-transform: translateY(-6.4px);
            transform: translateY(-6.4px);
  }
}
@keyframes shake-vertical {
  0%,
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  80% {
    -webkit-transform: translateY(6.4px);
            transform: translateY(6.4px);
  }
  90% {
    -webkit-transform: translateY(-6.4px);
            transform: translateY(-6.4px);
  }
}

.h2, h2 {
    font-size: 1.8rem;
}

.highlighted > .container{
	width:100%;
	padding:0 30px;
	max-width:100%;
	position:relative;
	top:50%;
	transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	text-align:center;
}

.highlighted > .container img{
	max-width:90%;
}

.highlighted .navbar-brand{
    display: block;
    width: 60%;
    height: 60%;
    margin: 0 auto 30px;
    max-height: 220px;
    max-width: 180px;
    text-align: center;
}

.highlighted .navbar-brand img{
	height:100%;
}

.layout-main-wrapper{
	background-color:#3c3c3b !important;
	color:white;
}

.path-frontpage .content-region-1-wrapper,
.path-frontpage .content-region-2-wrapper,
.path-frontpage .content-region-4-wrapper,
.path-frontpage .content-region-5-wrapper {
	padding-top:120px;
	padding-bottom:120px;
	overflow:hidden;
}


.content-region-1-wrapper,
.content-region-5-wrapper {
	background-color:#fff;
	color:#2c2c2b;
}

.content-region-1-wrapper .block,
.content-region-2-wrapper .block,
.content-region-4-wrapper .block,
.content-region-5-wrapper .block{
	padding-top:60px;
	padding-bottom:60px;
	padding-left:12%;
}

.node--view-mode-teaser{
	border:0 none;
}

.view-work .views-row{
	padding:0;
	position:relative;
}

.view-work .views-row:before{
	position:absolute;
	top:0;
	left:0;
	content:"";
	width:100%;
	height:100%;
	opacity:0;
	transition:all 0.3s;
	-moz-transition:all 0.3s;
	-webkit-transition:all 0.3s;
	background:#3c3c3b;
}

.view-work .views-row:hover:before{
	opacity:0.7;
}

.view-work .views-row:hover .views-field-field-url{
	opacity:1;
}

.view-work .views-row .views-field-field-url{
	opacity:0;
	position:absolute;
	left:0;
	bottom:0;
	padding:30px;
	transition:all 0.3s;
	-moz-transition:all 0.3s;
	-webkit-transition:all 0.3s;
}

.view-work .views-row .views-field-field-url a{
	font-weight:bold;
	line-height:normal;
	color:#fff;
	font-size:28px;
}

.view-work .views-row .views-field-field-url a{
	font-weight:bold;
	color:#fff;
	font-size:28px;
}

.view-work .views-row img{
	width:100%;
	height:auto;
	display:block;
}

.node--view-mode-teaser .node__content {
    clear: none;
    font-size: 1.4em;
    line-height: normal;
	font-weight:300;
}

.block{
	position:relative;
}

.block > h2{
	margin:0;
	position:absolute;
	left:0;
	top:0;
	transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform-origin:0 100%;
	-moz-transform-origin:0 100%;
	-webkit-transform-origin:0 100%;
	font-size:70px;
	font-weight:900;
	line-height:1.1em;
	text-transform:uppercase;
}

h2.node__title{
	font-weight:bold;
}

/*
.block > h2:after {
    content: '';
    position: absolute;
	bottom: 18px;
    left: -2500px;
    height: 1px;
    width: 10000px;
    background: #e5e5e5;
    display: block;
}

.content-region-1-wrapper .block > h2:after,
.content-region-3-wrapper .block > h2:after{
	background: #333;
}
*/

.node .node__title{
	margin-bottom:40px;
}

.view-about .view-content.row > div,
.view-services .view-content.row > div{
	padding:0 50px;
}

/*
.view-about .view-content.row > div:after,
.view-services .view-content.row > div:after,
.view-team .view-content.row > div:after {
    content: '';
    position: absolute;
	left: 50px;
    top: -2500px;
    width: 1px;
    height: 10000px;
    background: #e5e5e5;
    display: block;
}

.view-about .view-content.row > div:after ,
.view-team .view-content.row > div:after {
	background: #333;
}
*/

.view-team .view-content.row{
	font-size:1.4em;
	font-weight:300;
}

.view-team .view-content.row .views-row{
	line-height:normal;
	padding: 0 50px 50px;
}

.view-team .view-content.row .views-row .views-field-field-image{
	float:left;
	margin-right:1em;
}

.view-team .view-content.row h3{
	font-size:1.2em;
	font-weight:700;
	padding-top:0.5em;
}

.form-control {
    border-radius: 0;
	border: 1px solid #3c3c3b;
	background:#fff;
	padding: .75rem;
	border-color:#3c3c3b;
}

.form-control:focus {
    box-shadow: 0 0 0 0.1rem rgba(0,0,0,.35);
	border-color:#3c3c3b;
}

.webform-submission-form .js-form-item label{
	text-transform:uppercase;
	font-weight:bold;
}

.webform-submission-form > .captcha,
.webform-submission-form .form-group{
	margin-left:50%;
	padding-left:50px;
	padding-right:50px;
}

.webform-submission-form .form-type-webform-markup{
	float:left;
	width:100%;
	padding-right:30px;
	margin-left:0;
	font-size: 1.2em;
	margin-bottom:50px;
}

.btn,
.btn-primary{
	background-color:#3c3c3b !important;
	color:#fff;
	border: 2px solid #3c3c3b !important;
	border-radius: 0;
	padding: .75rem;
	text-transform:uppercase;
	font-weight:bold;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #fff !important;
	color:#3c3c3b;
}

.site-footer{
	background:#3c3c3b !important;
}

#block-backgroundvideo{
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	width:100%;
	height:100vh;
	z-index:-1;
}

#block-backgroundvideo:before{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	content:"";
	background:#000;
	opacity:0.7;
	background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAIUlEQVQYV2NkYGD4z8DAsIUBChihAiAuWBBZACyILsAAAOyYBh1KAgjdAAAAAElFTkSuQmCC) repeat;
}

#block-backgroundvideo video{
	min-width:110%;
	min-height:100vh;
	height:auto;
	width:auto;
}

.view-sorting .table td{
	padding: 5px 10px;
}
.view-sorting td a{
	color:#fff;
}

.site-footer .block{
	border:0 none;
}

.alert-wrapper{
	margin:10px;
}

#main{
    min-height:400px;
    padding-top: 100px;
    padding-bottom: 60px;
    padding-left: 12%;
}

.path-frontpage #main{
    min-height:0;
    padding: 0;
}

@media (min-width: 1200px){
	.container {
		max-width: 1600px;
	}
}


@media all and (max-width: 1400px){
	.view-work .views-row .views-field-field-url a{
		font-weight:bold;
		color:#fff;
		font-size:24px;
	}
}

@media all and (max-width: 1200px){
	.view-about .view-content.row > div,
	.view-services .view-content.row > div,
	.view-team .view-content.row > div	{
		padding-right: 0;
	}
	.block > h2 {
		font-size: 60px;
		line-height:1.25em;
	}
	.view-team .view-content.row h3 {
		margin-top: 10px;
	}
}

@media all and (max-width: 991px){
	.webform-submission-form .form-type-webform-markup{
		width:100%;
		float:none;
	}
	.webform-submission-form > .captcha,
	.webform-submission-form .form-group {
		margin-left: 0;
	}
}

@media all and (max-width: 768px){
	.block > h2 {
		font-size: 40px;
		line-height:1.25em;
		transform:rotate(0deg);
		-moz-transform:rotate(0deg);
		-webkit-transform:rotate(0deg);
		position:relative;
		margin-bottom:25px;
	}
	.block > h2:after {
		display:none;
	}
	#main,
	.content-region-1-wrapper .block,
	.content-region-2-wrapper .block,
	.content-region-4-wrapper .block,
	.content-region-5-wrapper .block {
		padding: 0;
	}
	.view-team .view-content.row .views-row,
	.view-about .view-content.row > div,
	.view-services .view-content.row > div,
	.view-team .view-content.row > div	{
		padding-left: 0;
	}
	.view-about .view-content.row > div:after,
	.view-services .view-content.row > div:after,
	.view-team .view-content.row > div:after{
		display:none;
	}
	.webform-submission-form > .captcha,
	.webform-submission-form .form-group,
	.container-fluid > .container {
		padding-right: 0;
		padding-left: 0;
	}
	.path-frontpage .content-region-1-wrapper,
	.path-frontpage .content-region-2-wrapper,
	.path-frontpage .content-region-4-wrapper,
	.path-frontpage .content-region-5-wrapper {
		padding-top: 50px;
		padding-bottom: 50px;
	}
	.node .node__title {
		margin-bottom: 25px;
	}
	.h2, h2 {
		font-size: 1.8rem;
	}
		
}

@media all and (max-width: 680px){
	#block-codefactory,
	.highlighted .navbar-brand{
		transform:translateY(-50px);
		-moz-transform:translateY(-50px);
		-webkit-transform:translateY(-50px);
	}
	.path-frontpage .highlighted:after {
		bottom: 100px;
	}
}