/*

@Author: Themezinho
@URL: http://www.themezinho.net
 
This file contains the styling for the actual theme, this
is the file you need to edit to change the look of the
theme.


	// Table of contents //

		01. GOOGLE FONTS
		02. BODY
		03. HTML TAGS
		04. CUSTOM TAGS
		05. SECTIONS
		06. CONTENT
		07. ODOMETER
		08. EQUALIZER
		09. REVEAL EFFECT
		10. PAGE TRANSITION
		11. PRELOADER
		12. PAGE LOADED
		13. TEXT ROTATER
		14. PERSPECTIVE 
		15. SOCIAL BAR
		16. HEADER
		17. DROPDOWN
		18. SLIDER
		19. SLIDER FRACTION
		20. SLIDER BUTTONS
		21. SLIDER CONTENT
		22. SLIDER LINKS
		23. INT HERO
		24. ABOUT STUDIO
		25. WORKS
		26. WORKS FILTER
		27. WORKS FIGURE
		28. ICON FEATURES
		29. TEAM MEMBERS
		30. CLIENTS
		31. SIDE IMAGE CONTENT
		32. AWARDS
		33. JOURNAL
		34. CONTACT
		35. FOOTER
		36. SCROLL DOWN
		37. RESPONSIVE MEDIUM FIXES
		38. RESPONSIVE TABLET FIXES
		39. RESPONSIVE MOBILE FIXES

	

*/





/* GOOGLE FONTS */
@import url('https://fonts.googleapis.com/css?family=Playfair+Display|Fjalla+One|Poppins:300,400,500,600,700,900&subset=latin-ext');


/* BODY */
*{outline: none !important}
body{margin: 0; padding: 0; font-family: 'Poppins', sans-serif; font-size: 14px; color: #131314; background: #131314;}
body{-webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale;}
body{height: 100%;}
html{height: 100%;}



/* HTML TAGS */
a{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
img{ max-width: 100%;}
strong{ font-weight: 700;}
b{font-weight: 700;}



/* CUSTOM TAGS */
.pull-left{ float: left;}
.pull-right{ float: right;}
.overflow-hidden{overflow: hidden;}
.no-margin{margin: 0 !important;}

/* SECTIONS */
main {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	position: relative;
	overflow: hidden;
	background: #222327;
}

section {
	position: relative;
}

aside {
	position: relative;
}



/* CONTENT */
.content{ width: calc(100% - 120px); float: left; background: #fff; margin: 0 60px;}




/* ODOMETER */
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-car .odometer-digit{ padding:0;}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-car .odometer-digit .odometer-digit-inner{ left:0;}




/* EQUALIZER */
.equalizer { width: 18px; height: 20px; cursor: pointer; position: relative;}
.equalizer span { background: #fff; width: 3px; height: 0px; bottom: 0; left: 0%; display: block; position: absolute; transition: height 0.2s linear;}
.equalizer span:nth-child(1) { margin-left: 5px;}
.equalizer span:nth-child(2) { margin-left: 10px;}
.equalizer span:nth-child(4) { margin-left: 15px;}
.equalizer span:nth-child(5) {margin-left: 20px;}
.equalizer.paused span { height: 3px !important;}






/* PAGE TRANSITION */
.transition-overlay{ width:100%; height:100%; position:fixed; left:0; top:0; background:#F50C19; z-index:99999; opacity:0; visibility:hidden;}
.transition-overlay{ -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease; transition: all 0.5s ease;}
.transition-overlay.show-me{ opacity:1; visibility:visible;}




/* PRELOADER */
.preloader{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 99; background:#5ba7db; }
.preloader{-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transform:all 0.4s ease; transition: all 0.4s ease;  }
.preloader *{-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transform:all 0.4s ease; transition: all 0.4s ease;} 
.preloader img{ width: 80px; height: 80px; position: absolute; left: 50%; top:50%; margin-left: -40px; margin-top: -40px; z-index: 4; border-radius: 50%; padding: 10px; background: #fff;}




/* PAGE LOADED */
.page-loaded .preloader{ top: -100%; transition-delay: 0.60s;}
.page-loaded .preloader img{ opacity: 0; margin-top: -120px; transition-delay: 0.30s;}
.page-loaded .header{top: 0; opacity: 1; transition-delay: 0.6s;}
.page-loaded .slider{transform: translateY(0); transition-delay: 0.6s; opacity: 1;}
.page-loaded .int-hero .inner h2{transform: translateY(0); transition-delay: 0.6s; opacity: 1;}




/* TEXT ROTATER*/
.text-rotater{ width: 100%; float: left; height: 20px; position: absolute; left: 0; top: 50%; margin-top: 60px; font-size: 11px; font-weight: 600; color: #fff; text-transform:uppercase;}
.text-rotater li{ width: 100%; position: absolute; left: 0; top: 0; text-align: center; opacity: 0; animation: play 4.5s infinite; }
.text-rotater li:nth-child(2) { animation-delay: 1.5s; }
.text-rotater li:nth-child(3) { animation-delay: 3s; }




/* PERSPECTIVE HOVER */
 .perspective-box { position: relative; display:inline-block; width:100%; margin: 5px; cursor: pointer; transform: perspective(600px) translate3d(0, 0, 0);   backface-visiblity:none;  transform-style: preserve-3d;}	
.perspective-box img { width:100%; float: left;}
.perspective-box:hover { box-shadow: 0 66px 75px -10px rgba(0,0,0,.3);  transform-style: preserve-3d; z-index:20; }




/* SOCIAL BAR */
.social-bar{ width: 400px; position: fixed; left: 0; top: 50%; margin-top: 200px; z-index: 3; -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -webkit-transform-origin: 0 0; transform-origin: 0 0; text-align: center;}
.social-bar li{display:inline-block; list-style: none; padding: 20px 0; margin: 0 10px; font-weight: 600;}
.social-bar li a{float: left; color: #fff; font-size: 11px;}
.social-bar li a:hover{text-decoration: none; color: #f50c1a;}



	
/* HEADER */
.header{ width: 100%; position: absolute; left: 0; top: -100%; z-index: 5; padding: 30px 100px; opacity: 0;}
.header{-webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transform:all 1s ease; transition: all 1s ease; } 
.header .logo{float: left; margin-right: 20px;}
.header .logo img{ width: 100%;}
.header .phone{float: left; color: #fff !important; line-height: 32px; font-family: "Fjalla One";}
.header .language{ float: right; margin-right: 30px; margin-bottom: 0;}
.header .language li{ float: left; list-style: none; margin: 0; margin-left: 20px; font-family: "Fjalla One";}
.header .language li a{float: left; color: #fff; line-height: 35px;}
.header .language li a:hover{text-decoration: none; opacity: 0.8;}
.header .hamburger{float: right; margin-top: -5px;}
.header .equalizer{float: right; margin-top: 5px; margin-right: 20px;}
.overflow-hidden .header .logo img{-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);}




/* DROPDOWN */
.hamburger-navigation li:hover ul{display: block;}
.hamburger-navigation li ul{ width: 100%; float: left; margin: 0; padding: 0; text-align: center; display: none;}
.hamburger-navigation li ul li{width: auto; float: none; display: inline-block; padding: 0; margin: 0; position: relative;}
.hamburger-navigation li ul li:after{content: ""; width: 6px; height: 6px; background: #fff; position: absolute; right: -16px; top: 7px; border-radius: 50%;}
.hamburger-navigation li ul li:last-child:after{display: none;}
.hamburger-navigation li ul li a{font-size: 15px; padding: 0 10px;}

/* SECTION TITLES */
.section-title {
	font-family: "Fjalla One", sans-serif;
	margin-bottom: 80px;
	line-height: 1.4;
	font-size: 4vw;
	letter-spacing: 2px;
}
/* SPLITTING */
.splitting .word, .splitting .char {
  display: inline-block;
}

.splitting .char {
  position: relative;
}

.animated .char {
  display: inline-block;
  animation: texteffect 0.6s cubic-bezier(0.5, 0, 0.5, 1) both;
  animation-delay: calc(10ms * var(--char-index));
}

/* SLIDER */
.slider{ width: 100%; height: 100vh; float: left; position: relative; background: #131314; z-index: 1;}
.slider{transform: translateY(250px); opacity: 0;}
.slider{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.slider .video-bg{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden; background: #5ba7db;}
.slider .video-bg video{min-height: 100%; min-width: 100%; float: left; mix-blend-mode: hard-light; -webkit-filter: grayscale(100%) contrast(1); filter: grayscale(100%) contrast(0.8);}
.slider .video-bg:after{content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #1d3162; mix-blend-mode: lighten;}
.slider .animation-hero{width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:url(../images/hero1.gif) center no-repeat #131314; background-size: 600px 450px;}
.slider .swiper-container{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden;}
.slider .swiper-container{-webkit-transition: all 0.8s ease; -moz-transition: all 0.8s ease; -ms-transform:all 0.8s ease; transition: all 0.8s ease; } 
.slider .swiper-container .swiper-wrapper{ width: 100%; float: left; display: flex; flex-direction: row;}



/* SPLIT */
.split{width:100%; height:100vh; float:left; position: relative; background: #131314; z-index: 1;}
.split .inner{width:100%; float:left; padding:0 100px; color:#fff;}
.split .inner p{ display:inline-block; width:50%; font-size:17px; font-weight:300;}
.split .inner a{ display:inline-block; font-size: 12px; font-weight: 600; color: #fff; position: relative;}
.split .inner a:hover{ text-decoration: none;}
.split .inner a:before { content: ''; display: block; position: absolute; left: 0; bottom: 2px; height: 7px; width: 0; transition: width 0s ease, background .25s ease; mix-blend-mode: color;}
.split .inner a:after { content: ''; display: block; position: absolute; right: 0; bottom: 2px; height: 7px; width: 0; background: #56e9b1; transition: width .25s ease; mix-blend-mode: color;}
.split .inner a:hover:before { width: 100%; background: #56e9b1; transition: width .25s ease;}
.split .inner a:hover:after { width: 100%; background: transparent; transition: all 0s ease;}
.split  .split-back { position: relative; background: #ebca1c; color: #fff;  height: 100%;  overflow: hidden;  display: flex;  align-items: center; }
.split .split-front { position: absolute; top: 0; left: 0; width: 100%; justify-content: flex-end; height: 100%;  overflow: hidden;  display: flex;  align-items: center;}
.split .split-front .front-bg{width: 100%; height: 100%; float: left; background: #8e8973; position: absolute; left: 0; top: 0;}
.split .split-front .text-holder{position: relative; z-index: 2;}
.split .inner h1{ width:100%;  float: left;  font-size: 15vw; font-weight: 700; padding-bottom:15px; overflow:hidden; -webkit-background-clip: text;    -webkit-text-fill-color: transparent; background-image: url(../images/hero1.jpg); background-size:cover; background-position: center;}



/* SLIDER FRACTION */
.slider .swiper-container .swiper-pagination-fraction{ width: 120px; height: 50px; position: absolute; left: 100px; right: auto; top: auto; bottom: 30px; color: #fff; font-size: 11px;}
.slider .swiper-container .swiper-pagination-fraction span:first-child{font-size: 56px; height: 50px; line-height: 50px; float: left; overflow: hidden; text-indent: 0px; margin-right: -25px; padding-top: 3px; font-weight: 500;}
.slider .swiper-container .swiper-pagination-fraction span:last-child{font-size: 14px;}
.slider .swiper-container .swiper-pagination-fraction span:before{content: "0";}



/* SLIDER BUTTONS */
.slider .swiper-container .swiper-button-prev{ width: 40px; height: 26px; float: left; right: 200px; left: auto; top: 50%; z-index: 6; background: none; overflow: hidden; text-align: right;}
.slider .swiper-container .swiper-button-prev img{height: 26px;}
.slider .swiper-container .swiper-button-prev span{width: 100%; float: left; line-height: 26px; font-weight: 500; color: #fff;}
.slider .swiper-container .swiper-button-prev:hover img{transform: translateY(-100%);}
.slider .swiper-container .swiper-button-prev:hover span{transform: translateY(-100%);}
.slider .swiper-container .swiper-button-prev *{-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transform:all 0.4s ease; transition: all 0.4s ease; }
.slider .swiper-container .swiper-button-next{ width: 40px; height: 26px; float: left; right: 100px; left: auto; top: 50%; z-index: 6; background: none; overflow: hidden;}
.slider .swiper-container .swiper-button-line{ width: 40px; height: 2px; background: #fff; position: absolute; right: 150px; top: 50%; z-index: 2; margin-top: -10px;}
.slider .swiper-container .swiper-button-next img{height: 26px;}
.slider .swiper-container .swiper-button-next span{width: 100%; float: left; line-height: 26px; font-weight: 500; color: #fff;}
.slider .swiper-container .swiper-button-next:hover img{transform: translateY(-100%);}
.slider .swiper-container .swiper-button-next:hover span{transform: translateY(-100%);}
.slider .swiper-container .swiper-button-next *{ -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transform:all 0.4s ease; transition: all 0.4s ease; }




/* SLIDER CONTENT */
.slider .swiper-container .swiper-slide{ color: #fff; display: flex;  flex-direction: column; justify-content: center; background-size:cover;}
.slider .swiper-container .swiper-slide:after{content: ""; width: 100%; height: 300px; position: absolute; left: 0; bottom: 0; z-index: 3; background-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(19,19,20,1) 100%);
background-image: -o-linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(19,19,20,1) 100%);
background-image: -moz-linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(19,19,20,1) 100%);
background-image: -webkit-linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(19,19,20,1) 100%);
background-image: -ms-linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(19,19,20,1) 100%);}
.slider .swiper-container .swiper-slide .inner { width: 100%; padding: 0 100px; position: relative; z-index: 4;}
.slider .swiper-container .swiper-slide .inner h5{ font-size: 12px; font-weight: 700;}
.slider .swiper-container .swiper-slide .inner h5:before{content: ""; width: 4px; height: 10px; float: left; background: #f50c1a; margin-left: -10px; margin-top: 2px;}
.slider .swiper-container .swiper-slide .inner h2{ max-width: 50%; font-family: "Playfair Display"; font-size: 6em; margin-bottom: 30px;}
.slider .swiper-container .swiper-slide .inner p{ max-width: 40%; line-height: 25px; margin-bottom: 30px;}




/* SLIDER LINKS */
.slider .swiper-container .swiper-slide .inner .link{ float: left; font-size: 12px; font-weight: 600; color: #fff; position: relative;}
.slider .swiper-container .swiper-slide .inner .link:hover{ text-decoration: none;}
.slider .swiper-container .swiper-slide .inner .link:before { content: ''; display: block; position: absolute; left: 0; bottom: 2px; height: 7px; width: 0; transition: width 0s ease, background .25s ease; mix-blend-mode: color;}
.slider .swiper-container .swiper-slide .inner .link:after { content: ''; display: block; position: absolute; right: 0; bottom: 2px; height: 7px; width: 0; background: #56e9b1; transition: width .25s ease; mix-blend-mode: color;}
.slider .swiper-container .swiper-slide .inner .link:hover:before { width: 100%; background: #56e9b1; transition: width .25s ease;}
.slider .swiper-container .swiper-slide .inner .link:hover:after { width: 100%; background: transparent; transition: all 0s ease;}
.slider .swiper-container .swiper-slide .inner .video-link {  width: 40px; height: 40px; float: left; border-radius: 50%; position: relative; transition:all .5s; margin-left: 30px; margin-top: -13px;}
.slider .swiper-container .swiper-slide .inner .video-link:after{content: ""; position: absolute; left: 50%; top: 50%; margin-left: -3px; margin-top: -7px; width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 10px; border-color: transparent transparent transparent #fff;}
.slider .swiper-container .swiper-slide .inner .video-link .video-play-circle { stroke-dasharray: 315; stroke-dashoffset: 315; transition: stroke-dashoffset .5s;}
.slider .swiper-container .swiper-slide .inner .video-link svg { transform: rotate(-90deg); transition: transform .3s; }
.slider .swiper-container .swiper-slide .inner .video-link:hover .video-play-circle { stroke-dashoffset: 0; } 
.slider .swiper-container .swiper-slide .inner .video-link .video-play-outline{width: 40px; height: 40px; position: absolute; left: 0; top: 0; border-radius: 50%; border: 3px solid rgba(255,255,255,0.05);}

/* INTRO */
.intro {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 150px 0;
	color: #161619;
	background: #fff;
}

	.intro .col-lg-7 {
		padding-left: 10%;
	}

	.intro h6 {
		font-weight: 600;
		text-transform: uppercase;
		font-size: 19px;
	}

		.intro h6:after {
			content: "";
			width: 70px;
			height: 1px;
			background: #fff;
			display: inline-block;
			margin-left: 15px;
			margin-bottom: 7px;
		}

	.intro b {
		font-size: 120px;
		line-height: 1;
		font-family: "Fjalla One", sans-serif;
		float: left;
		font-weight: 400;
		margin-right: 20px;
	}

	.intro h4 {
		font-weight: 600;
	}

	.intro p {
		font-size: 20px;
		font-weight: 300;
		margin-bottom: 35px;
	}

	.intro small {
		display: block;
		opacity: 0.7;
		margin-bottom: 50px;
	}

	.intro a {
		color: #000;
		font-size: 17px;
		border-bottom: 1px solid #75dab4;
		padding-bottom: 5px;
	}

		.intro a:hover {
			border-color: #fff;
		}

/* INTRO IMAGE */
.intro-image {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 150px;
	position: relative;
}

	.intro-image:before {
		content: "";
		width: 100%;
		height: 100px;
		background: #fff;
		position: absolute;
		left: 0;
		top: 0;
	}

	.intro-image.light:before {
		background: #fff;
	}

	.intro-image .office-slider {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		background: #222327;
		position: relative;
		overflow: hidden;
	}

	.intro-image figure {
		width: 100%;
		display: block;
		margin: 0;
		position: relative;
	}

		.intro-image figure img {
			width: 100%;
			opacity: 0.7;
		}

		.intro-image figure figcaption {
			position: absolute;
			left: 0;
			bottom: 0;
			padding: 20px;
			line-height: 1;
		}

			.intro-image figure figcaption h6 {
				font-size: 13px;
				color: #fff;
				font-weight: 600;
			}

/* PROCESS */
.process {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 150px;
	color: #fff;
	text-align: center;
}

	.process .odometer {
		font-family: "Fjalla One", sans-serif;
		font-size: 5vw;
		line-height: 1;
	}

	.process .symbol {
		width: 100%;
		display: block;
		font-size: 12px;
	}

	.process small {
		width: 80%;
		display: block;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		padding-top: 30px;
		margin: 20px 10%;
		font-weight: 600;
	}

/* ICON CONTENT BLOCK */
.icon-content-block {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	text-align: center;
	color: #fff;
	background: #222327;
}

	.icon-content-block .container {
		position: relative;
		z-index: 2;
	}

	.icon-content-block .content-block {
		width: 100%;
		display: block;
		margin: 0;
		padding: 50px 30px;
		position: relative;
		-webkit-transition: 0.25s ease-in-out;
		-moz-transition: 0.25s ease-in-out;
		-ms-transition: 0.25s ease-in-out;
		-o-transition: 0.25s ease-in-out;
		transition: 0.25s ease-in-out;
	}

		.icon-content-block .content-block.selected {
			background: #161619;
			box-shadow: 15px 15px 30px rgba(0, 0, 0, 0.3);
		}

			.icon-content-block .content-block.selected:before {
				content: "";
				width: 50%;
				height: 50%;
				position: absolute;
				right: -25px;
				bottom: -30px;
				z-index: -1;
				background: url(../images/dot-pattern.png) right;
				background-size: 10px;
			}

		.icon-content-block .content-block figure {
			width: 100%;
			display: block;
			margin-bottom: 40px;
		}

			.icon-content-block .content-block figure img {
				height: 75px;
			}

		.icon-content-block .content-block h6 {
			display: block;
			font-weight: 600;
			letter-spacing: 0.5px;
			margin-bottom: 10px;
		}

		.icon-content-block .content-block ul {
			margin: 0;
			padding: 0;
		}

			.icon-content-block .content-block ul li {
				padding: 3px 0;
				opacity: 0.7;
				list-style: none;
				font-weight: 300;
			}

/* TEXT CONTENT BLOCK */
.text-content-block {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 150px 0;
	background: #fff;
}

	.text-content-block .col-md-4 {
		margin: 20px 0;
	}

	.text-content-block .section-title {
		margin-bottom: 30px;
	}

	.text-content-block h5 {
		font-size: 20px;
		font-weight: 300;
		line-height: 1.5;
		padding-right: 20%;
		margin-bottom: 70px;
	}

	.text-content-block small {
		font-size: 40px;
		font-weight: 800;
		margin-bottom: -20px;
		opacity: 0.1;
		display: block;
	}

	.text-content-block h6 {
		font-size: 20px;
		font-family: "Fjalla One", sans-serif;
	}

	.text-content-block p {
		padding-right: 20%;
		margin-bottom: 0;
		line-height: 1.5;
	}

/* TESTIMONIALS */
.testimonials {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin-top: 150px;
	color: #fff;
	background: #161619;
	position: relative;
}

	.testimonials:before {
		content: "";
		width: 100%;
		height: 50px;
		background: #222327;
		position: absolute;
		left: 0;
		top: 0;
	}

	.testimonials .section-title {
		margin-bottom: 0;
	}

	.testimonials .testimonials-slider {
		width: 80%;
		display: flex;
		flex-wrap: wrap;
		overflow: hidden;
		position: relative;
	}

	.testimonials .swiper-pagination {
		width: 100px;
		right: 80px;
		left: auto;
		bottom: 115px;
		text-align: right;
	}

	.testimonials .swiper-pagination-bullet {
		background: #222327;
	}

		.testimonials .swiper-pagination-bullet:hover {
			border-color: #222327;
		}

	.testimonials .swiper-pagination-bullet-active {
		border-color: #222327;
		background: none;
	}

	.testimonials .testimonial {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		padding: 100px 80px;
		background: #75dab4;
		color: #222327;
	}

		.testimonials .testimonial blockquote {
			font-size: 21px;
			line-height: 1.7;
			font-weight: 300;
			padding-bottom: 30px;
			margin-bottom: 30px;
			border-bottom: 1px solid rgba(0, 0, 0, 0.2);
		}

		.testimonials .testimonial .reviewer {
			width: 100%;
			display: flex;
			flex-wrap: wrap;
		}

			.testimonials .testimonial .reviewer img {
				width: 50px;
				height: 50px;
				border-radius: 50%;
				margin-right: 15px;
				float: left;
			}

			.testimonials .testimonial .reviewer .reviewer-infos {
				width: calc(100% - 65px);
				float: left;
			}

			.testimonials .testimonial .reviewer h6 {
				display: block;
				font-weight: 600;
			}

			.testimonials .testimonial .reviewer small {
				display: block;
			}

/* TEAM */
.team {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding-top: 150px;
	padding-bottom: 100px;
	color: #fff;
	background: #161619;
	position: relative;
	z-index: 2;
}

	.team:before {
		content: "";
		width: 100%;
		height: 100px;
		position: absolute;
		left: 0;
		bottom: 0;
		background: #fff;
	}

	.team .reveal-effect.masker:after {
		background: #222327;
	}

	.team h5 {
		font-size: 20px;
		font-weight: 300;
		line-height: 1.5;
	}

	.team figure {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		position: relative;
		margin-bottom: -100px;
	}

		.team figure:hover ul {
			opacity: 1;
			visibility: visible;
		}

		.team figure img {
			width: 100%;
		}

		.team figure figcaption {
			display: block;
			color: #222327;
			margin-top: 20px;
		}

			.team figure figcaption h6 {
				display: block;
				font-weight: 600;
			}

			.team figure figcaption small {
				display: block;
				opacity: 0.5;
			}

		.team figure ul {
			width: 80%;
			display: flex;
			margin: 10%;
			padding: 0;
			background: #fff;
			position: absolute;
			left: 0;
			bottom: 60px;
			-webkit-transition: 0.25s ease-in-out;
			-moz-transition: 0.25s ease-in-out;
			-ms-transition: 0.25s ease-in-out;
			-o-transition: 0.25s ease-in-out;
			transition: 0.25s ease-in-out;
			opacity: 0;
			visibility: hidden;
			box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
		}

			.team figure ul li {
				flex: 1;
				margin: 0;
				padding: 10px 0;
				list-style: none;
				text-align: center;
				border-right: 1px solid #eee;
			}

				.team figure ul li:last-child {
					border-right: 0;
				}

				.team figure ul li a {
					color: #222327;
					font-size: 13px;
					padding: 5px;
				}

					.team figure ul li a:hover {
						color: #75dab4;
					}

/* WORKS */
.works {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 150px 0;
	background: #222327;
	color: #fff;
}

	.works ul {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin: -60px 0;
		padding: 0;
		position: relative;
		z-index: 2;
	}

		.works ul li {
			width: 33.33333%;
			display: inline-block;
			margin: 0;
			padding: 0;
			list-style: none;
			padding: 60px;
		}

			.works ul li:nth-child(2n+2) {
				margin-top: 100px;
			}

			.works ul li:nth-child(3n+3) {
				margin-top: 40px;
			}

			.works ul li figure {
				width: 100%;
				display: block;
				margin-bottom: 30px;
				position: relative;
				z-index: 2;
				background: #222327;
				-webkit-transition: 0.25s ease-in-out;
				-moz-transition: 0.25s ease-in-out;
				-ms-transition: 0.25s ease-in-out;
				-o-transition: 0.25s ease-in-out;
				transition: 0.25s ease-in-out;
			}

				.works ul li figure:hover {
					box-shadow: 15px 15px 30px rgba(0, 0, 0, 0.3);
					transform: translateY(-10px);
				}

					.works ul li figure:hover:before {
						opacity: 1;
					}

				.works ul li figure:before {
					content: "";
					width: 90%;
					height: 30%;
					position: absolute;
					right: -25px;
					bottom: -30px;
					z-index: -1;
					background: url(../images/dot-pattern.png) right;
					background-size: 10px;
					opacity: 0;
					-webkit-transition: 0.25s ease-in-out;
					-moz-transition: 0.25s ease-in-out;
					-ms-transition: 0.25s ease-in-out;
					-o-transition: 0.25s ease-in-out;
					transition: 0.25s ease-in-out;
				}

				.works ul li figure a {
					width: 100%;
					background: #222327;
					display: block;
					position: relative;
					z-index: 2;
				}

					.works ul li figure a img {
						width: 100%;
					}

			.works ul li h3 {
				font-weight: 600;
				margin-bottom: 5px;
				font-size: 26px;
				letter-spacing: -1px;
			}

			.works ul li small {
				display: block;
				font-family: "Fjalla One", sans-serif;
				opacity: 0.7;
			}

/* CASE STUDY */
.case-study {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 150px 0;
	background: #fff;
}

	.case-study h6 {
		font-weight: 600;
		margin-top: 30px;
	}

	.case-study h5 {
		font-family: "Fjalla One", sans-serif;
		font-size: 5vw;
		text-align: center;
		margin-top: 50px;
		text-transform: uppercase;
	}

	.case-study p {
		margin-bottom: 20px;
		line-height: 1.5;
	}

	.case-study figure {
		width: 100%;
		display: block;
		margin-bottom: 30px;
	}

		.case-study figure img {
			width: 100%;
		}

		.case-study figure video {
			width: 100%;
		}

	.case-study .container-fluid {
		margin-top: 80px;
		padding-left: 30px;
		padding-right: 30px;
	}

/* BLOG */
.blog {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 100px 0;
	background: #fff;
}

	.blog .col-lg-9 {
		padding-right: 60px;
	}

	.blog .sidebar {
		width: 100%;
		float: left;
		display: flex;
		flex-wrap: wrap;
		padding: 50px 0;
	}

		.blog .sidebar .widget {
			width: 100%;
			display: block;
			border-left: 1px solid #eee;
			margin-bottom: 40px;
			padding-left: 30px;
			padding-bottom: 10px;
		}

			.blog .sidebar .widget .title {
				display: block;
				font-weight: 800;
				font-size: 19px;
				padding: 15px 0;
				position: relative;
			}

				.blog .sidebar .widget .title:before {
					content: "";
					width: 1px;
					height: 100%;
					background: #222327;
					position: absolute;
					left: -31px;
					top: 0;
				}

			.blog .sidebar .widget p {
				margin: 0;
			}

			.blog .sidebar .widget form {
				width: 100%;
			}

				.blog .sidebar .widget form input[type=text] {
					width: 100%;
					margin-bottom: 10px;
				}

			.blog .sidebar .widget .categories {
				width: 100%;
				margin: 0;
				padding: 0;
			}

				.blog .sidebar .widget .categories li {
					display: flex;
					flex-wrap: wrap;
					margin: 4px 0;
					padding: 0;
					list-style: none;
				}

					.blog .sidebar .widget .categories li span {
						width: 20px;
						height: 20px;
						line-height: 20px;
						background: #ccc;
						color: #fff;
						margin-right: 15px;
						margin-left: 0;
						text-align: center;
						font-size: 11px;
						font-weight: 600;
					}

					.blog .sidebar .widget .categories li a {
						color: #222327;
						margin-left: 0;
						font-weight: 600;
					}

			.blog .sidebar .widget .tags {
				width: 100%;
				display: block;
				margin-bottom: 0;
				padding: 0;
			}

				.blog .sidebar .widget .tags li {
					display: inline-block;
					list-style: none;
					margin-bottom: 5px;
				}

					.blog .sidebar .widget .tags li a {
						font-weight: 600;
						font-size: 11px;
						background: #222327;
						color: #fff;
						line-height: 1;
						padding: 3px 6px;
					}

						.blog .sidebar .widget .tags li a:hover {
							color: #75dab4;
							text-decoration: none;
						}

			.blog .sidebar .widget .mini-works {
				width: 100%;
				display: flex;
				flex-wrap: wrap;
				margin: 0;
				padding: 0;
			}

				.blog .sidebar .widget .mini-works li {
					width: 33.3333%;
					display: inline-block;
					margin: 0;
					padding: 4px;
					list-style: none;
				}

	.blog .post {
		width: 100%;
		float: left;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		margin: 50px 0;
	}

		.blog .post.single {
			position: relative;
		}

			.blog .post.single .post-image {
				width: 100%;
				margin-bottom: 50px;
			}

			.blog .post.single .post-content {
				width: 100%;
				padding: 0 60px;
			}

				.blog .post.single .post-content .post-title {
					font-size: 4vw;
					line-height: 1.4;
				}

		.blog .post:nth-child(even) {
			position: relative;
		}

			.blog .post:nth-child(even) .post-image {
				order: 2;
			}

				.blog .post:nth-child(even) .post-image:before {
					right: auto;
					left: -25px;
				}

			.blog .post:nth-child(even) .post-content {
				order: 1;
				padding-right: 60px;
				padding-left: 0;
				text-align: right;
			}

		.blog .post .post-image {
			width: 45%;
			margin: 0;
			position: relative;
			box-shadow: 15px 15px 30px rgba(0, 0, 0, 0.1);
		}

			.blog .post .post-image img {
				position: relative;
				width: 100%;
			}

			.blog .post .post-image:before {
				content: "";
				width: 90%;
				height: 60%;
				position: absolute;
				right: -25px;
				bottom: -30px;
				z-index: 0;
				background: url(../images/dot-pattern.png) right;
				background-size: 10px;
				-webkit-transition: 0.25s ease-in-out;
				-moz-transition: 0.25s ease-in-out;
				-ms-transition: 0.25s ease-in-out;
				-o-transition: 0.25s ease-in-out;
				transition: 0.25s ease-in-out;
				opacity: 0.2;
			}

		.blog .post .post-content {
			width: 55%;
			padding-left: 60px;
		}

			.blog .post .post-content h5 {
				font-weight: 600;
				margin-top: 30px;
			}

			.blog .post .post-content ul {
				margin-bottom: 30px;
				padding-left: 20px;
			}

				.blog .post .post-content ul li {
					margin: 0;
				}

			.blog .post .post-content .social-share {
				width: 100%;
				float: left;
				padding: 0;
				margin-bottom: 40px;
				text-align: center;
			}

				.blog .post .post-content .social-share li {
					float: left;
					margin-right: 5px;
					padding: 0;
					list-style: none;
				}

					.blog .post .post-content .social-share li.facebook a {
						background: #475993;
					}

					.blog .post .post-content .social-share li.twitter a {
						background: #76a9ea;
					}

					.blog .post .post-content .social-share li.google-plus a {
						background: #f34a38;
					}

					.blog .post .post-content .social-share li.linkedin a {
						background: #0077b7;
					}

					.blog .post .post-content .social-share li.youtube a {
						background: #f61c0d;
					}

					.blog .post .post-content .social-share li a {
						width: 44px;
						height: 44px;
						line-height: 44px;
						float: left;
						background: #222327;
						color: #fff;
						border: none;
						border-radius: 0;
					}

			.blog .post .post-content .image-left {
				width: 40%;
				float: left;
				margin-right: 30px;
				margin-bottom: 30px;
				margin-top: 20px;
			}

			.blog .post .post-content .image-full {
				width: 100%;
				display: block;
				margin: 30px 0;
			}

			.blog .post .post-content .post-date {
				width: 100%;
				display: block;
				margin-bottom: 10px;
				text-transform: uppercase;
				opacity: 0.5;
			}

			.blog .post .post-content .post-title {
				width: 100%;
				display: block;
				margin-bottom: 20px;
				font-size: 3vw;
				font-weight: 800;
			}

				.blog .post .post-content .post-title a {
					color: #161619;
				}

					.blog .post .post-content .post-title a:hover {
						color: #75dab4;
						text-decoration: none;
					}

			.blog .post .post-content .post-author {
				width: 100%;
				display: block;
				margin-bottom: 20px;
			}

				.blog .post .post-content .post-author img {
					width: 50px;
					height: 50px;
					display: inline-block;
					margin-right: 15px;
					border-radius: 50%;
				}

				.blog .post .post-content .post-author span {
					display: inline-block;
					color: #A7A7A7;
				}

					.blog .post .post-content .post-author span a {
						color: #222327;
						font-size: 15px;
					}

						.blog .post .post-content .post-author span a:hover {
							color: #222327;
						}

			.blog .post .post-content .post-categories {
				width: 100%;
				display: block;
				margin-bottom: 30px;
				padding: 0;
			}

				.blog .post .post-content .post-categories li {
					display: inline-block;
					list-style: none;
				}

					.blog .post .post-content .post-categories li a {
						font-weight: 600;
						font-size: 11px;
						background: #222327;
						color: #fff;
						line-height: 1;
						padding: 3px 6px;
					}

						.blog .post .post-content .post-categories li a:hover {
							color: #75dab4;
							text-decoration: none;
						}

			.blog .post .post-content .post-link {
				font-family: "Fjalla One", sans-serif;
				border-bottom: 2px solid #222327;
				padding-bottom: 5px;
			}

				.blog .post .post-content .post-link:hover {
					color: #75dab4;
					text-decoration: none;
				}

/* CLIENTS */
.clients {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 150px 0;
	background: #fff;
	box-shadow: 15px 15px 50px rgba(0, 0, 0, 0.3);
}

	.clients ul {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin: 0;
		padding: 0;
		border-right: 1px solid #eee;
		border-bottom: 1px solid #eee;
	}

		.clients ul li {
			width: 33.33333%;
			margin: 0;
			padding: 40px;
			list-style: none;
			border-left: 1px solid #eee;
			border-top: 1px solid #eee;
		}

/* CONTACT */
.contact {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 150px 0;
	background: #fff;
}

	.contact h6 {
		font-weight: 600;
		margin-top: 30px;
	}

	.contact address {
		display: block;
	}

		.contact address p {
			margin: 0;
		}

		.contact address a {
			text-decoration: underline;
		}

	.contact .contact-form {
		width: 100%;
		display: block;
	}

		.contact .contact-form #contact {
			display: block;
		}

			.contact .contact-form #contact .form-group {
				display: block;
				position: relative;
				margin-bottom: 35px;
			}

				.contact .contact-form #contact .form-group span {
					width: 100%;
					line-height: 58px;
					position: absolute;
					left: 0;
					top: 0;
					padding: 0 20px;
					z-index: 0;
					-webkit-transition: 0.25s ease-in-out;
					-moz-transition: 0.25s ease-in-out;
					-ms-transition: 0.25s ease-in-out;
					-o-transition: 0.25s ease-in-out;
					transition: 0.25s ease-in-out;
				}

					.contact .contact-form #contact .form-group span.label-up {
						font-size: 13px;
						line-height: 16px;
						top: -20px;
						font-weight: 600;
					}

				.contact .contact-form #contact .form-group input[type=text] {
					width: 400px;
					background: none;
					position: relative;
					z-index: 2;
				}

				.contact .contact-form #contact .form-group input:focus + span {
					font-size: 13px;
					line-height: 16px;
					top: -20px;
					font-weight: 600;
				}

				.contact .contact-form #contact .form-group textarea {
					width: 500px;
					background: none;
					position: relative;
					z-index: 2;
				}

					.contact .contact-form #contact .form-group textarea:focus + span {
						font-size: 13px;
						line-height: 16px;
						top: -20px;
						font-weight: 600;
					}

				.contact .contact-form #contact .form-group label.error {
					width: 100%;
					color: red;
					margin-top: 5px;
					margin-bottom: 0;
					font-weight: 600;
					font-size: 13px;
				}

		.contact .contact-form #success, .contact .contact-form #error {
			display: none;
			float: left;
		}

		.contact .contact-form #error {
			background: red;
			color: #fff;
		}

		.contact .contact-form #success {
			background: green;
			color: #fff;
		}

		.contact .contact-form .alert {
			border: none;
			border-radius: 0;
			padding: 20px 30px;
		}

	.contact .map {
		width: 80%;
		height: 400px;
		display: block;
		background: #222327;
	}

		.contact .map iframe {
			width: 100%;
			height: 100%;
			border: none;
		}

/* FOOTER */
.footer {
	width: 100%;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: -1;
	display: flex;
	flex-wrap: wrap;
	padding-top: 100px;
	color: #fff;
	background: url(../images/footer-bg.png) top center no-repeat;
	background-size: 80% auto;
}

	.footer ul {
		margin: 0;
		padding: 0;
		float: right;
	}

		.footer ul li {
			display: inline-block;
			margin-left: 10px;
		}

			.footer ul li a {
				color: #fff;
				font-size: 13px;
			}

				.footer ul li a:hover {
					color: #75dab4;
				}

	.footer h6 {
		font-family: "Fjalla One", sans-serif;
		font-size: 2vw;
		margin-bottom: 20px;
	}

	.footer h2 {
		font-size: 4vw;
		font-weight: 300;
		line-height: 1.3;
		margin-bottom: 50px;
		opacity: 0.7;
	}

	.footer .link {
		color: #fff;
		font-size: 17px;
		border-bottom: 1px solid #75dab4;
		padding-bottom: 5px;
	}

		.footer .link:hover {
			border-color: #fff;
			text-decoration: none;
		}

	.footer .footer-bar {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin-top: 100px;
		padding: 50px 0;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		font-size: 13px;
	}

		.footer .footer-bar .copyright {
			margin: 0;
		}

		.footer .footer-bar .creation {
			margin-left: auto;
		}

			.footer .footer-bar .creation a {
				color: #fff;
				text-decoration: underline;
			}

				.footer .footer-bar .creation a:hover {
					text-decoration: none;
					color: #75dab4;
				}



/* INT HERO */
.int-hero{ width: 100%; float: left; padding: 0 100px; padding-top: 170px; padding-bottom: 120px; background: #131314; color: #fff; position: relative;}
.int-hero .video-bg{width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden;}
.int-hero .video-bg video{min-width: 100%; min-height: 100%; float: left; opacity: 0.1;}
.int-hero .video-bg:after{content: ""; width: 100%; height: 300px; position: absolute; left: 0; bottom: 0; z-index: 2; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(19,19,20,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(19,19,20,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(19,19,20,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#131314',GradientType=0 ); }
.int-hero .inner{ width: 100%; float: left; position: relative; z-index: 3;}
.int-hero .inner{-webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -ms-transform:all 0.7s ease; transition: all 0.7s ease; } 
.int-hero .inner h2{max-width: 60%; font-size: 5em; float: left;}
.int-hero .inner h2{transform: translateY(250px); opacity: 0;}
.int-hero .inner h2{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}



/* ABOUT STUDIO */
.about-studio{ width: 100%; float: left;}
.about-studio .hero-image{ width: 100%; margin-bottom: 120px; position: relative; z-index: 2;}
.about-studio .hero-image img{ width: 100%;}
.about-studio h5{ font-size: 3em; font-family: "Playfair Display"; line-height: 1; margin-top: -5px; margin-bottom: 30px;}
.about-studio .lead{ margin-bottom: 40px; opacity: 1; line-height: 32px;}
.about-studio .lead u{position: relative; text-decoration: none;}
.about-studio .lead u:after{content: ""; width: 100%; height: 7px; background: #56e9b1; position: absolute; left: 0; bottom: 6px; mix-blend-mode: color;}
.about-studio p{line-height: 24px; opacity: 0.8;}
.about-studio p:last-child{max-width: 50%; margin-bottom: 0;}
.about-studio .link{ display: inline-block; color: #000; font-weight: 500; font-size: 12px; position: relative; z-index: 2; margin-bottom: 60px;}
.about-studio .link:hover{ text-decoration: none;}
.about-studio .link:before { content: ''; display: block; position: absolute; left: 0; bottom: 2px; height: 7px; width: 0; transition: width 0s ease, background .25s ease; mix-blend-mode: color;}
.about-studio .link:after { content: ''; display: block; position: absolute; right: 0; bottom: 2px; height: 7px; width: 0; background: #56e9b1; transition: width .25s ease; mix-blend-mode: color;}
.about-studio .link:hover:before { width: 100%; background: #56e9b1; transition: width .25s ease;}
.about-studio .link:hover:after { width: 100%; background: transparent; transition: all 0s ease;}



/* WORKS  */
/*.works { width: 100%; float: left; background: #131314;}
.works.five-cols{width: 100%;}
.works.five-cols .grid-sizer{width: 20%;}
.works.five-cols .grid-item{width: 20%;}
.works.five-cols .grid-item-double{width: 40%;}
.works.four-cols .grid-sizer{ width: 25%; float: left;}
.works.four-cols .grid-item{ width: 25%; float: left;}
.works.four-cols .grid-item-double{ width: 50%; float: left;}
.works.three-cols{width: 100%;}
.works.three-cols .grid-sizer{width: 33.33333%;}
.works.three-cols .grid-item{width: 33.33333%;}
.works.three-cols .grid-item-double{width: 66.66666%;}
.works.two-cols{width: 100%;}
.works.two-cols .grid-sizer{width: 50%;}
.works.two-cols .grid-item{width: 50%;}
.works.two-cols .grid-item-double{width: 100%;}*/





/* WORKS FILTER */
.isotope-filter{ width: 100%; float: left; margin: 0; padding-bottom: 30px ; text-align: center; background: #131314;}
.isotope-filter li{ display: inline-block; margin: 0 15px; padding: 0; list-style: none;}
.isotope-filter li a{ float: left; font-size: 13px; font-weight: 500; color: #fff; opacity: 0.99; font-weight: 600; position: relative;}
.isotope-filter li a:hover{text-decoration: none;}
.isotope-filter li a:before { content: ''; display: block; position: absolute; left: 0; bottom: 2px; height: 7px; width: 0; transition: width 0s ease, background .25s ease; mix-blend-mode: color;}
.isotope-filter li a:after { content: ''; display: block; position: absolute; right: 0; bottom: 2px; height: 7px; width: 0; background: #56e9b1; transition: width .25s ease; mix-blend-mode: color;}
.isotope-filter li a:hover:before { width: 100%; background: #56e9b1; transition: width .25s ease;}
.isotope-filter li a:hover:after { width: 100%; background: transparent; transition: all 0s ease;}
.isotope-filter li a.current{ color: #56e9b1;}
.isotope-filter li a.current:before{display: none;}
.isotope-filter li a.current:after{display: none;}


/* WORKS FIGURE */
/*.works figure{ width: 100%; float: left; position: relative; margin: 0; overflow: hidden;}
.works figure *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.works figure a{ width: 100%; float: left; text-align: center;}
.works figure img{ width: 100%; float: left; opacity: 1; }
.works figure figcaption{ width: 100%; height: 100%; float: left; position: absolute; left: 0; bottom: 0; color: #fff; font-size: 13px; font-weight: 700; opacity: 0; padding: 0; }
.works figure figcaption .bg-color{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0.9;}
.works figure figcaption .brand{ width: 100%; float: left; margin-bottom: 20px;}
.works figure figcaption .brand img{ width: auto !important; height: 50px; float: none;}
.works figure figcaption a{ width: 100%; height: 100%; float: left; color: #fff; padding: 30px; justify-content: center; display: flex; flex-direction: column; }
.works figure figcaption a:hover{color: #fff; text-decoration: none;}
.works figure figcaption h5{ width: 100%; float: left;transform: translateY(-10px); opacity: 0; font-family: 'Playfair Display', serif; font-size: 20px;}
.works figure figcaption small{ width: 100%; float: left; transform: translateY(10px); opacity: 0; font-weight: 700;}
.works figure:hover figcaption{ opacity: 1;}
.works figure:hover img{transform: scale(1.05);}
.works figure:hover figcaption h5{transform: translateY(0); opacity: 1;}
.works figure:hover figcaption small{transform: translateY(0); opacity: 1;}*/



/* PROJECT HERO */
.project-hero{ width: calc(100% - 120px); float: left; background: #131314; color: #fff; position: relative; margin: 0 60px;}
.project-hero figure{ width: 100%; float: left; margin: 0; position: relative;}
.project-hero figure img{ width: 100%; float: left;}
.project-hero figure figcaption{ width: 100%; position: absolute; left: 0; top: 0; padding: 0 100px; padding-top: 170px; padding-bottom: 120px;}
.project-hero figure figcaption h2{max-width: 60%; font-size: 5em; float: left;}


/* PROJECT DETAIL */
.project-detail{ width: 100%; display: flex; background: #fff; padding: 120px 0;}
.project-detail .project-navbar{ width: 100%; float: left; margin-bottom: 50px; padding: 0; background: #fff;  text-align: center; z-index: 2; position: -webkit-sticky; position: -moz-sticky; position: -ms-sticky; position: -o-sticky; position: sticky; top: 0;}
.project-detail .project-navbar .navbar{ padding: 20px 0; background: #fff; }
.project-detail .project-navbar .navbar li{display: inline-block; margin: 0; padding: 0; list-style: none;}
.project-detail .project-navbar .navbar li a{color: #131314; font-weight: 600;}
.project-detail .project{width: 100%; float: left;}
.project-detail .project h2{ font-size: 70px; font-weight: 700;}
.project-detail .project .lead{margin-bottom: 30px; padding-right: 30%; opacity: 1; line-height: 32px;}
.project-detail .project p{line-height: 26px; opacity: 0.7;}
.project-detail .project figure{display: block; margin: 100px 0;}
.project-detail .project .client-logo{ width: 140px; margin-top: 50px; -webkit-filter: brightness(1) invert(1); filter: brightness(1) invert(1);}




/* ICON FEATURES */
.icon-features{ width: 100%; float: left; padding-top: 120px; padding-bottom: 60px; text-align: center;}
.icon-features img{ width: 60px; display: inline-block; margin-bottom: 20px;}
.icon-features small{display: block; font-weight: 600; margin-bottom: 10px;}
.icon-features h3{ display: block; font-family: "Playfair Display"; font-size: 24px; line-height: 32px; margin-bottom: 20px; }
.icon-features p{display: block; padding: 0 10%; margin-bottom: 20px; opacity: 0.8;}
.icon-features a{ display: inline-block; color: #000; font-weight: 500; font-size: 12px; position: relative; z-index: 2; margin-bottom: 60px;}
.icon-features a:hover{ text-decoration: none;}
.icon-features a:before { content: ''; display: block; position: absolute; left: 0; bottom: 2px; height: 7px; width: 0; transition: width 0s ease, background .25s ease; mix-blend-mode: color;}
.icon-features a:after { content: ''; display: block; position: absolute; right: 0; bottom: 2px; height: 7px; width: 0; background: #56e9b1; transition: width .25s ease; mix-blend-mode: color;}
.icon-features a:hover:before { width: 100%; background: #56e9b1; transition: width .25s ease;}
.icon-features a:hover:after { width: 100%; background: transparent; transition: all 0s ease;}




/* TEAM MEMBERS */
.team-members{ width: 100%; float: left; margin-top: 120px;}
.team-members *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.team-members .member{width: 20%; float: left; position: relative; z-index: 2; margin: 0; background: #f50c1a; overflow: hidden;}
.team-members .member:nth-child(2){margin-top: 100px;}
.team-members .member:nth-child(4){margin-top: 100px;}
.team-members .member figcaption{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0;}
.team-members .member figcaption div{ width: 100%; height: 30px; float: left; position: absolute; left: 0; top: 50%; margin-top: -15px; text-align: center;}
.team-members .member figcaption div h3{font-size: 13px; font-weight: 700; color: #fff; margin: 0;}
.team-members .member figcaption div small{ display: block; color: #fff;}
.team-members .member:hover{ box-shadow: 0 66px 75px -10px rgba(0,0,0,.3);}
.team-members .member:hover img{opacity: 0.2; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1);}
.team-members .member:hover figcaption{opacity: 1;}




/* CLIENTS */
/*.clients{width: 100%; float: left; padding: 120px 0;}
.clients *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.clients ul{ width: 100%; float: left; margin: 0; padding: 0;}
.clients ul li{ width: 20%; float: left; margin: 0; padding: 0; list-style: none; position: relative;}
.clients ul li figure{ width: 100%; float: left; margin: 0; padding: 0 10%;}
.clients ul li figure img{ width: 100%; float: left;}
.clients ul li:after{content: ""; width: 1px; height: 30px; background: #eee; position: absolute; right: 0; top: 30px;}
.clients ul li:last-child:after{display: none;}
.clients ul li:hover figure{opacity: 0.4;}*/




/* SIDE IMAGE CONTENT */
.side-image-content{width: 100%; float: left; display: flex; flex-direction: row; margin: 100px 0;}
.side-image-content.right-align{ float: left;}
.side-image-content.right-align .inner.bg1{order: 2;}
.side-image-content.right-align .inner .main-image{margin-top: 0 !important;}
.side-image-content .inner {width: 50%; display: flex; justify-content: center; flex-direction: column; position: relative;}
.side-image-content .inner.bg1{ background: #f50c1a;}
.side-image-content .inner .main-image{ width: 100%; float: left; margin: 0; margin-top: -100px; margin-bottom: 100px;}
.side-image-content .inner .sub-image{ width: 250px; position: absolute; right: -50px; bottom: -100px; z-index: 2;}
.side-image-content .inner img{ width: 100%; }
.side-image-content .inner .contenty{ width: 100%; float: left; padding: 0 15%; color: #fff;}
.side-image-content .inner .contenty h5{ font-size: 12px; font-weight: 700;}
.side-image-content .inner .contenty h5:before{content: ""; width: 4px; height: 10px; float: left; background: #fff; margin-left: -10px; margin-top: 2px;}
.side-image-content .inner .contenty h2{ font-family: "Playfair Display"; font-size: 4em; margin-bottom: 30px; text-indent: -5px;}
.side-image-content .inner .contenty p{ line-height: 25px;}
.side-image-content .inner .contenty a{height: 60px; line-height: 58px; display: inline-block; border: 1px solid #fff; padding: 0 40px; font-size: 11px; font-weight: 700; color: #fff; margin-top: 30px; overflow: hidden;}
.side-image-content .inner .contenty .award-list{ width: 100%; float: left; margin: 0; padding: 0; list-style: none;}
.side-image-content .inner .contenty .award-list li{ width: 100%; float: left; padding:5px 0;}
.side-image-content .inner .contenty .award-list li span{ float: left; margin-right: 6px; line-height: 23px;}
.side-image-content .inner .contenty .award-list li small{ width: 18px; height: 18px; line-height: 20px; display: inline-block; border-radius: 50%; background: #fff; color: #f50c1a; text-align: center; font-weight: 600; font-size: 11px; margin-bottom: 5px;}
.side-image-content .inner .contenty a *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.side-image-content .inner .contenty a span { position: relative; display: inline-block;}
.side-image-content .inner .contenty a span:before {position: absolute;top: 100%; content: attr(data-hover); }
.side-image-content .inner .contenty a span:before {-webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
.side-image-content .inner .contenty a:hover span{-webkit-transform: translateY(-100%);-moz-transform: translateY(-100%);transform: translateY(-100%);}




/* AWARDS */
.awards{ width: 100%; float: left; padding: 120px 0;}
.awards h5{ font-size: 12px; font-weight: 700; margin-top: 20px;}
.awards h5:before{content: ""; width: 4px; height: 10px; float: left; background: #f50c1a; margin-left: -10px; margin-top: 2px;}
.awards h2{ font-family: "Playfair Display"; font-size: 4em; margin-bottom: 30px; text-indent: -5px;}
.awards figure{ width: 100%; float: left; margin-bottom: 20px; padding: 20px 30px; position: relative;}
.awards figure:after{content: ""; width: 40px; height: 3px; background: #f50c1a; position: absolute; left: 50%; bottom:0; margin-left: -20px;}
.awards figure img{ width: 100%; float: left; opacity: 0.5; }
.awards .award{ width: 100%; float: left; border: 1px solid #eee; padding-bottom: 20px;}
.awards .odometer{ display: block; text-align: center; font-family: "Fjalla One"; font-size: 30px;}




/* JOURNAL */
.journal{ width: 100%; float: left; padding-bottom: 40px;}
.journal *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.journal .post{ width: 100%; float: left; position: relative; margin-bottom: 80px;}
.journal .post.detail{ width: 100%; float: left;}
.journal .post.detail figure{margin-bottom: 50px;}
.journal .post.detail .post-content{ padding: 0 15%;}
.journal .post.detail .post-content.left{padding: 0 30px; width: 75%;}
.journal .post.detail .post-content .author{ width: 100%; float: left; position: static; margin-bottom: 20px;}
.journal .post.detail .post-content .author img{ width: 60px; border-radius: 50%; float: left; margin-right: 10px;  opacity: 1;}
.journal .post.detail .post-content .author small{line-height: 60px; opacity: 1;}
.journal .post.detail .post-content .lead{line-height: 30px;}
.journal .post.detail .post-content small{opacity: 0.4;}
.journal .post.detail .post-content h3{ width: 100%; float: left; padding-right: 0; font-size: 3em;}
.journal .post.detail .post-content blockquote{ width: 100%; float: left; border-left: 3px solid #eee; padding: 20px 0; padding-left: 30px;}
.journal .post.detail .post-content blockquote p{margin-bottom: 10px;}
.journal .post.detail .post-content blockquote h5{margin-bottom: 0; font-family: "Playfair Display";}
.journal .post.detail .post-content p{ width: 100%; float: left; padding-right: 0;}
.journal .post.highlight{width: 100%; float: left; position: relative; margin-bottom: 120px;}
.journal .post.highlight figure{ width: 100%; float: left; margin: 0; }
.journal .post.highlight figure img{ opacity: 0.4;}
.journal .post.highlight .post-content{position: absolute; left: 0; bottom: 0; padding: 50px; padding-right: 40%; color: #fff;}
.journal .post.highlight .post-content h3{font-size: 3em;}
.journal .post.highlight .post-content .author{position: static;}
.journal .post.highlight .post-content .author img{opacity: 1;}
.journal .post.highlight .post-content .link{ font-weight: 700;}
.journal .post.highlight .post-content p{opacity: 1;}
.journal .post.highlight .post-content a{color: #fff;}
.journal .post.highlight .post-content a:hover{color: #fff;}
.journal .post.highlight:hover figure img{opacity: 0.6;}
.journal .post figure{ width: 100%; float: left; margin-bottom: 20px; position:relative; background: #131314; overflow: hidden;}
.journal .post figure img{ width: 100%; float: left; opacity: 0.6;}
.journal .post figure .author{ width: 100%; line-height: 50px; position: absolute; left: 30px; bottom: 30px; color: #fff;}
.journal .post figure .author img{ width: 50px; border-radius: 50%; float: left; margin-right: 10px; border:3px solid rgba(255,255,255,0.2); opacity: 1;}
.journal .post .post-content{ width: 100%; float: left;}
.journal .post .post-content small{display: block; margin-bottom: 10px;}
.journal .post .post-content small a{color: #131314;}
.journal .post .post-content h3{ display: block; font-family:"Playfair Display"; margin-bottom: 20px; padding-right: 15%;}
.journal .post .post-content h3 a{color: #131314;}
.journal .post .post-content h3 a:hover{text-decoration: none; color: #f50c1a;}
.journal .post .post-content p{line-height: 24px; opacity: 0.6; padding-right: 15%; margin-bottom: 30px;}
.journal .post .post-content .link{ display: inline-block; color: #000; font-weight: 500; font-size: 12px; position: relative; z-index: 2;}
.journal .post .post-content .link:hover{ text-decoration: none;}
.journal .post .post-content .link:before { content: ''; display: block; position: absolute; left: 0; bottom: 2px; height: 7px; width: 0; transition: width 0s ease, background .25s ease; mix-blend-mode: color;}
.journal .post .post-content .link:after { content: ''; display: block; position: absolute; right: 0; bottom: 2px; height: 7px; width: 0; background: #56e9b1; transition: width .25s ease; mix-blend-mode: color;}
.journal .post .post-content .link:hover:before { width: 100%; background: #56e9b1; transition: width .25s ease;}
.journal .post .post-content .link:hover:after { width: 100%; background: transparent; transition: all 0s ease;}
.journal .post:hover figure img{opacity: 0.8; -moz-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05);}


.journal .sidebar { width: 25%; float: left; padding:0 30px; border-left: 1px solid #eee; }
.journal .sidebar .widget { width: 100%; float: left; margin-bottom: 30px; position: relative; }
.journal .sidebar .widget .title { display: block; margin-bottom: 15px; font-size: 22px; font-family: "Playfair Display"; }
.journal .sidebar .widget p { font-size: 13px; line-height: 20px; opacity: 0.7; }
.journal .sidebar .widget form { width: 100%; float: left; border: 1px solid #eee; padding: 4px; }
.journal .sidebar .widget form input[type="text"] { width: calc(100% - 60px); height: 40px; border: none; padding: 0 15px; background: none; }
.journal .sidebar .widget form button { width: 50px; height: 40px; padding: 0; background: none; border:none; font-weight: 700; font-size: 13px; }
.journal .sidebar .widget .tags { width: 100%; float: left; margin: 0; padding: 0; }
.journal .sidebar .widget .tags li { float: left; margin-right: 6px; margin-bottom: 6px; padding: 0; list-style: none; }
.journal .sidebar .widget .tags li a { height: 23px; line-height: 23px; float: left; border: 1px solid #eee; padding: 0 10px;  font-size: 11px; font-weight: 600; color: #131314; }
.journal .sidebar .widget .tags li a:hover { background: #f50c1a; border-color: #f50c1a; text-decoration: none; color: #fff; }
.journal .sidebar .widget .categories { width: 100%; float: left; margin: 0; padding: 0; }
.journal .sidebar .widget .categories li { width: 100%; float: left; margin: 0; padding: 3px 0; list-style: none; }
.journal .sidebar .widget .categories li span { float: right; opacity: 0.7; font-size: 12px; }
.journal .sidebar .widget .categories li a { float: left; font-weight: 600; font-size: 12px; color: #131314; opacity: 0.7; }
.journal .sidebar .widget .gallery { width: 100%; float: left; margin: 0; padding: 0; background: none;}
.journal .sidebar .widget .gallery li { width: 33.33333%; float: left; padding: 5px; margin: 0; list-style: none; }
.journal .sidebar .widget .gallery li a { float: left; }
.journal .sidebar .widget .gallery li img { width: 100%; float: left; }

.journal .post-comment{ width: 75%; float: left; padding: 0 30px; margin-top: 50px;}
.journal .post-comment h6{font-size: 20px; font-family: 'Playfair Display', serif; text-transform: uppercase; margin-bottom: 20px;}
.journal .post-comment .comments{ width: 100%; float: left;}
.journal .post-comment .comments .comment{ width: 100%; float: left; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #eee;}
.journal .post-comment .comments .comment.inner{ padding-left: 80px;}
.journal .post-comment .comments .comment .comment-avatar{ width: 80px; float: left; background: none;}
.journal .post-comment .comments .comment .comment-avatar img{ width: 60px; float: left; border-radius: 50%; opacity: 1; -moz-transform: scale(1.0) !important; -webkit-transform: scale(1.0) !important; transform: scale(1.0) !important;}
.journal .post-comment .comments .comment .comment-content{ width: calc(100% - 80px); float: left;}
.journal .post-comment .comments .comment .comment-content h4{font-family:'Playfair Display', serif; font-size: 18px;}
.journal .post-comment .comments .comment .comment-content p{opacity: 0.7;}
.journal .post-comment .comments .comment .comment-content small{font-family: 'Fjalla One', sans-serif; text-transform: uppercase;}
.journal .post-comment .comments .comment .comment-content a{ float: right; font-weight: 600; font-size: 12px; padding: 4px 8px; border: 1px solid #eee; color: #131314;}
.journal .post-comment textarea{ width: 100%;}
.journal .post-comment .comment-form{ width: 100%; float: left; margin-top: 40px;}
.journal .post-comment .comment-form label{width: 100%; float: left; margin: 0; position: relative; z-index: 2;}
.journal .post-comment .comment-form label span{ float: left; background: #fff; font-size: 12px; margin-left: 14px; padding: 0 6px; font-weight: 600; margin-bottom: -10px;}
.journal .post-comment .comment-form input{width: 100%; height: 62px; border: 1px solid #ccc; padding: 0 20px;}
.journal .post-comment .comment-form textarea{width: 100%; height: 120px; border: 1px solid #ccc; padding:20px;}
.journal .post-comment .comment-form button{height: 60px; line-height: 58px; display: inline-block; border:none; padding: 0 40px; font-size: 11px; border:none; font-weight: 700; color: #fff; background: #131314; overflow: hidden;}
.journal .container-fluid{padding: 0 30px;}


/* CONTACT */
.contact{ width: 100%; float: left; padding-top: 120px; padding-bottom: 90px;}
.contact .titles{ width: 100%; float: left; text-align: center; margin-bottom: 40px; padding: 0 25%;}
.contact .titles h5{ font-size: 12px; font-weight: 700; text-transform: uppercase;}
.contact .titles h2{ font-family: "Playfair Display"; font-size: 4em; margin-bottom: 30px;}
.contact .address{ width: 100%; float: left; text-align: center; padding: 0 10%; margin-bottom: 50px;}
.contact .address h4{ display: block; font-family: "Playfair Display"; font-size: 24px; line-height: 32px; margin-bottom: 20px; }
.contact .address p{display: block;}
.contact .address p a{font-weight: 600; color: #131314;}
.contact .address a{display: inline-block; font-weight: 600; color: #131314;}
.contact .address a:hover{text-decoration: none;}
.contact .address a svg{ width: 20px; display: inline-block; margin-bottom: -8px; }
.contact form{ margin-top: 50px;}
.contact form .form-group{margin-bottom: 30px;}
.contact form label{ width: 100%; float: left; margin: 0; position: relative; z-index: 2;}
.contact form label span{float: left; background: #fff; font-size: 12px; margin-left: 14px; padding: 0 6px; font-weight: 600; margin-bottom: -10px;}
.contact form input[type="text"]{ width: 100%; height: 62px; border: 1px solid #ccc; padding: 0 20px;}
.contact form textarea{ width: 100%; height: 140px; float: left; line-height: 26px; border: 1px solid #ccc; padding: 20px;}
.contact form button[type="submit"]{height: 60px; line-height: 58px; display: inline-block; border:none; padding: 0 40px; font-size: 11px; font-weight: 700; color: #fff; background: #131314; overflow: hidden;}
.contact .alert{ width:100%; float:left;}
.contact #success, .contact #error {display:none}
.contact #success, .contact #error { float:left;}
.contact #contact label.error{ width:100%; color:#f50c1a; margin-top: 10px; text-align: center;}
.contact #contact input.error  {width:100%; border:1px solid #f50c1a;}
.contact #contact textarea.error{width:100%; border:1px solid #f50c1a;}
.map{ width: 70%; height: 420px; display: inline-block; margin:0 15%;  background: #f50c1a; display: none;}




/* FOOTER */
/*.footer-spacing{ width: 100%; float: left;}
.footer{ width: calc(100% - 120px); position: fixed; left: 0; bottom: 0; margin: 0 60px; padding-top: 50px; background:url(../images/anchor-line-bg.png) center no-repeat #131314; background-size: auto 150%; z-index: 1; text-align: center; color: #fff;}
.footer img{width: 32px; margin-bottom: 20px; display: inline-block;}
.footer .social-media{ width: 100%; float: left; display: none; text-align: center; margin-bottom: 20px; padding: 0;}
.footer .social-media li{display: inline-block; margin: 0 10px; list-style: none;}
.footer .social-media li a{ float: left; font-size: 12px; font-weight: 600; color: #fff;}
.footer .social-media li a:hover{text-decoration: none; color: #f50c1a;}}
.footer h4{font-weight: 300; letter-spacing: -1px; font-size: 2em;}
.footer h2{ font-family: "Fjalla One"; text-transform: uppercase; font-size: 4em; margin-bottom: 30px; padding: 0 10%;}
.footer .btn-contact{height: 60px; line-height: 58px; display: inline-block; border: 1px solid rgba(255,255,255,0.2); padding: 0 40px; font-size: 11px; font-weight: 700; color: #fff; margin-bottom: 30px; overflow: hidden;}
.footer .btn-contact *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.footer .btn-contact span { position: relative; display: inline-block;}
.footer .btn-contact span:before {position: absolute;top: 100%; content: attr(data-hover); }
.footer .btn-contact span:before {-webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
.footer .btn-contact:hover span{-webkit-transform: translateY(-100%);-moz-transform: translateY(-100%);transform: translateY(-100%);}
.footer .footer-bar{ width: 100%; float: left; border-top:1px solid rgba(255,255,255,0.05); margin-top: 50px; padding: 20px 0;}
.footer .footer-bar span{font-size: 12px;}
.footer .footer-bar span a{color: #fff; font-weight: 600;}
*/



/* SCROLL DOWN */
.scroll-down{width: 1px; height: 70px; position: absolute; left: 50%; bottom: 30px; z-index:2;}
.scroll-down span {display: block; position: relative; padding-top: 79px; text-align:center;}
.scroll-down span::before { -webkit-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite; -moz-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;  -o-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite; animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;}
.scroll-down span::before{ position: absolute; top: 0px; left: 50%; margin-left: -0.5px; width: 1px; height: 70px; background: #fff; content:"";}




/* RESPONSIVE MEDIUM  FIXES */
@media only screen and (max-width: 1199px), only screen and (max-device-width: 1199px) {
	.header{padding: 30px 60px;}
	.slider .swiper-container .swiper-slide .inner h2{font-size: 4em;}
	.slider .swiper-container .swiper-slide .inner{padding: 0 60px;}
	.slider .swiper-container .swiper-pagination-fraction{left: 60px;}
	.icon-features p{padding: 0;}
	.icon-features h3{font-size: 20px;}
	.side-image-content .inner .contenty h2{font-size: 2em; text-indent: 0;}
	.awards h2{font-size: 3em; text-indent: 0;}
}	




/* RESPONSIVE TABLET FIXES */
@media only screen and (max-width: 991px), only screen and (max-device-width: 991px) {
	.slider .swiper-container .swiper-slide .inner h2{max-width: 70%;}
	.slider .swiper-container .swiper-slide .inner p{max-width: 70%;}
	.slider .swiper-container .swiper-button-prev{ right: 160px;}
	.slider .swiper-container .swiper-button-line{right: 110px;}
	.slider .swiper-container .swiper-button-next{ right: 60px;}
	.works .grid-item{width: 50% !important;}
	.works .grid-item-double{width: 50% !important;}
	.works .grid-sizer{width: 50% !important;}
	.int-hero .video-bg{display: none;}
	.int-hero .inner h2{max-width: 100%;}
	.side-image-content{display: block;}
	.side-image-content .inner{width: 100%; float: left; display: block;}
	.side-image-content .inner .contenty{padding: 100px 15%;}
	.journal .post.detail .post-content.left{width: 100%;}
	.journal .sidebar{width: 100%; border:none;}
	.journal .post-comment{width: 100%;}
	.contact form input[type="text"]{border-radius: 0 !important; box-shadow: none !important;}
	.contact form textarea{border-radius: 0 !important; box-shadow: none !important;}
	
}




/* RESPONSIVE MOBILE FIXES */
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
	.header {
		padding: 30px;
	}

		.header .language {
			display: none;
		}

	.social-bar {
		display: none;
	}

	.slider .swiper-container .swiper-slide .inner {
		padding: 0 30px;
	}

		.slider .swiper-container .swiper-slide .inner h2 {
			max-width: 100%;
			font-size: 3.5em;
		}

		.slider .swiper-container .swiper-slide .inner p {
			max-width: 100%;
		}

	.slider .swiper-container .swiper-button-prev {
		display: none;
	}

	.slider .swiper-container .swiper-button-line {
		display: none;
	}

	.slider .swiper-container .swiper-button-next {
		display: none;
	}

	.slider .swiper-container .swiper-pagination-fraction {
		display: none;
	}

	.scroll-down {
		display: none;
	}

	.int-hero {
		padding-left: 30px;
		padding-right: 30px;
	}

		.int-hero .inner h2 {
			max-width: 100%;
			font-size: 3.5em;
		}

	.content {
		width: calc(100% - 30px);
		margin: 0 15px;
	}

	.about-studio .hero-image {
		overflow: hidden;
		margin-bottom: 50px;
	}

		.about-studio .hero-image img {
			width: 150%;
			max-width: inherit;
		}

	.about-studio h5 {
		font-size: 2em;
	}

	.about-studio p:last-child {
		max-width: 100%;
		margin-bottom: 0;
	}

	.team-members .member {
		width: 50%;
	}

	.works .grid-item {
		width: 100% !important;
	}

	.works .grid-item-double {
		width: 100% !important;
	}

	.icon-features a {
		margin-bottom: 50px;
	}

	.side-image-content {
		margin-bottom: 0;
	}

		.side-image-content .inner .contenty {
			padding: 60px 30px;
			text-align: center;
		}

			.side-image-content .inner .contenty h5:before {
				display: none;
			}

			.side-image-content .inner .contenty h2 {
				font-size: 3em;
			}

			.side-image-content .inner .contenty .award-list li span {
				float: none;
			}

		.side-image-content .inner .main-image {
			margin-bottom: 0;
		}

		.side-image-content .inner .sub-image {
			width: 100%;
			float: left;
			position: static;
			margin: 0;
		}

	.awards {
		text-align: center;
	}

		.awards h5:before {
			display: none;
		}

		.awards .award {
			width: 60%;
			margin: 0 20%;
			margin-top: -1px;
		}

	.clients ul li {
		width: 50%;
	}

		.clients ul li:after {
			display: none;
		}

	.journal .post.highlight {
		margin-bottom: 50px;
	}

	.journal .post figure {
		overflow: hidden;
	}

		.journal .post figure img {
			width: 150%;
			max-width: inherit;
		}

	.journal .post.highlight .post-content {
		padding: 15px;
		padding-right: 0;
	}

		.journal .post.highlight .post-content h3 {
			font-size: 2em;
		}

		.journal .post.highlight .post-content p {
			display: none;
		}

	.contact .titles {
		padding: 0;
	}

	.footer {
		width: calc(100% - 30px);
		margin: 0 15px;
	}

		.footer h2 {
			font-size: 3em;
			padding: 0;
		}

		.footer .social-media {
			display: block;
		}

		.footer .footer-bar span {
			width: 100%;
			text-align: center;
		}
	/* RESPONSIVE TABLET FIXES */
	@media only screen and (max-width: 991px), only screen and (max-device-width: 991px) {
		.section-title {
			font-size: 8vw;
			margin-bottom: 50px;
		}

		.page-header .inner {
			padding-left: 160px;
		}

		.all-cases .inner {
			padding-left: 160px;
		}

		.social-media .inner ul li {
			font-size: 4vw;
		}

		.all-cases .inner ul li {
			font-size: 10vw;
		}

		.works {
			padding: 80px 0;
		}

			.works ul li {
				width: 50%;
			}

		.slider .gallery-thumbs .swiper-slide-active span {
			width: 100%;
			font-size: 8vw;
			line-height: 11vw;
		}

		.intro .col-lg-7 {
			padding-left: 15px;
			margin-top: 50px;
		}

		.text-content-block {
			padding: 80px 0;
		}

		.intro-image {
			padding-bottom: 80px;
		}

		.icon-content-block .col-lg-3:nth-child(3) {
			margin-top: 0;
		}

		.icon-content-block .content-block {
			padding: 30px 20px;
		}

		.process {
			margin-bottom: 80px;
		}

			.process .col-lg-3:first-child {
				margin-bottom: 40px;
			}

			.process .odometer {
				font-size: 8vw;
			}

		.testimonials {
			margin-top: 80px;
		}

			.testimonials:before {
				display: none;
			}

			.testimonials .col-lg-6:first-child {
				order: 2;
			}

			.testimonials .col-lg-6:last-child {
				order: 1;
			}

			.testimonials .testimonials-slider {
				margin-top: 40px;
				width: 100%;
			}

			.testimonials .swiper-pagination {
				bottom: 65px;
			}

			.testimonials .testimonial {
				padding: 50px 80px;
			}

			.testimonials .section-title {
				margin-top: 80px;
			}

		.team {
			padding: 80px 0;
		}

			.team:before {
				display: none;
			}

			.team .col {
				width: 33.33333%;
				flex-basis: auto;
				flex-grow: inherit;
			}

			.team figure {
				margin: 30px 0;
			}

				.team figure figcaption {
					color: #fff;
				}

			.team h5 {
				margin-bottom: 40px;
				margin-top: 0;
			}

		.intro {
			padding: 80px 0;
		}

		.clients {
			padding: 80px 0;
		}

		.blog {
			padding: 30px 0;
		}

			.blog .col-lg-9 {
				padding-right: 15px;
			}

		.contact {
			padding: 80px 0;
		}

			.contact .map {
				width: 100%;
				margin: 50px 0;
			}

			.contact .contact-form {
				margin-top: 30px;
			}

		.footer h6 {
			font-size: 26px;
		}

		.footer ul {
			width: 100%;
			float: left;
			margin-bottom: 30px;
		}

			.footer ul li {
				margin-left: 0;
				margin-right: 10px;
			}
	}
	/* RESPONSIVE MOBILE FIXES */
	@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
		.section-title {
			font-size: 9vw;
			margin-bottom: 40px;
		}

		.slider .gallery-thumbs {
			width: 100%;
			margin: 0;
		}

		.page-header .inner {
			padding-left: 100px;
		}

			.page-header .inner p {
				font-size: 17px;
				padding-right: 10%;
			}

		.all-cases .inner {
			padding-left: 100px;
		}

			.all-cases .inner ul li {
				font-size: 13vw;
			}

		.site-navigation .inner {
			padding-left: 0;
		}

			.site-navigation .inner ul li {
				line-height: 1;
			}

				.site-navigation .inner ul li a {
					font-size: 34px;
				}

				.site-navigation .inner ul li i {
					font-size: 20px;
					margin-left: 13px;
				}

				.site-navigation .inner ul li small {
					display: none;
				}

				.site-navigation .inner ul li ul {
					margin-top: 10px;
				}

					.site-navigation .inner ul li ul li a {
						font-size: 22px;
					}

		.left-side {
			width: 80px;
			border-right: none;
		}

			.left-side .follow-us {
				display: none;
			}

		.slide-progress {
			display: none;
		}

		.all-cases-link {
			right: 15px;
		}

		.swiper-button-next {
			right: 20px;
		}

		.swiper-button-prev {
			right: 90px;
		}

		.icon-content-block .col-lg-3:nth-child(3) {
			margin: 50px 0;
		}

		.icon-content-block .content-block {
			padding: 0;
		}

			.icon-content-block .content-block.selected {
				background: none;
				box-shadow: none;
			}

				.icon-content-block .content-block.selected:before {
					display: none;
				}

		.testimonials .testimonial {
			padding: 70px 50px;
		}

		.testimonials .swiper-pagination {
			bottom: 85px;
		}

		.team .col {
			width: 50%;
			flex-basis: 50%;
			flex-grow: inherit;
		}

		.team figure {
			display: block;
			height: auto;
		}

			.team figure img {
				height: auto;
				object-fit: cover;
			}

		.works ul li {
			width: 100%;
		}

			.works ul li:nth-child(2n+2) {
				margin-top: 0;
			}

			.works ul li:nth-child(3n+3) {
				margin-top: 0;
			}

		.clients ul li {
			padding: 30px 20px;
			width: 50%;
		}

			.clients ul li:last-child {
				display: none;
			}

		.blog .post .post-image {
			width: 100%;
			margin-bottom: 40px;
		}

		.blog .post .post-content {
			width: 100%;
			padding: 0 !important;
		}

		.blog .post:nth-child(even) {
			text-align: left;
		}

			.blog .post:nth-child(even) .post-image {
				order: 1;
			}

			.blog .post:nth-child(even) .post-content {
				order: 2;
				text-align: left;
			}

		.blog .post .post-content .post-title {
			font-size: 7vw;
		}

		.blog .post.single .post-content .post-title {
			font-size: 8vw;
		}

		.footer h2 {
			font-size: 7vw;
		}

			.footer h2 br {
				display: none;
			}

		.footer .footer-bar .creation {
			width: 100%;
			display: block;
			margin-top: 5px;
		}
	}
	/* ANIMATIONS */
	@keyframes texteffect {
		0% {
			transform: translateY(50%);
			opacity: 0;
		}

		100% {
			transform: translateY(0);
			opacity: 1;
		}
	}

	@keyframes texteffect {
		0% {
			transform: translateY(50%);
			opacity: 0;
		}

		100% {
			transform: translateY(0);
			opacity: 1;
		}
	}

	@-webkit-keyframes show-img-1 {
		0%, 66.6% {
			visibility: hidden;
		}

		100%, 66.7% {
			visibility: visible;
		}
	}

	@keyframes show-img-1 {
		0%, 66.6% {
			visibility: hidden;
		}

		100%, 66.7% {
			visibility: visible;
		}
	}

	@-webkit-keyframes slide-bg-2 {
		33.3% {
			-webkit-transform-origin: left top;
			transform-origin: left top;
			-webkit-transform: scale(0.05, 1);
			transform: scale(0.05, 1);
		}

		66.6% {
			-webkit-transform-origin: left center;
			transform-origin: left center;
			-webkit-transform: scale(1, 1);
			transform: scale(1, 1);
		}

		66.7% {
			-webkit-transform-origin: right center;
			transform-origin: right center;
			-webkit-transform: scale(1, 1);
			transform: scale(1, 1);
		}

		100% {
			-webkit-transform-origin: right center;
			transform-origin: right center;
			-webkit-transform: scale(0, 1);
			transform: scale(0, 1);
		}
	}

	@keyframes slide-bg-2 {
		33.3% {
			-webkit-transform-origin: left top;
			transform-origin: left top;
			-webkit-transform: scale(0.05, 1);
			transform: scale(0.05, 1);
		}

		66.6% {
			-webkit-transform-origin: left center;
			transform-origin: left center;
			-webkit-transform: scale(1, 1);
			transform: scale(1, 1);
		}

		66.7% {
			-webkit-transform-origin: right center;
			transform-origin: right center;
			-webkit-transform: scale(1, 1);
			transform: scale(1, 1);
		}

		100% {
			-webkit-transform-origin: right center;
			transform-origin: right center;
			-webkit-transform: scale(0, 1);
			transform: scale(0, 1);
		}
	}

	/*# sourceMappingURL=style.css.map */