@charset "UTF-8";

/*
Theme Name: APEX Reality
*/

:root{
	white: #fff;
}
*{
	box-sizing:border-box;
}

body{
	font-family: 'Space Grotesk', sans-serif;
	color: #fff;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 162.5%;
	margin:0;
	padding:0;
	background:#000;
}



.container{
	width:100%;
	max-width:1310px;
	margin:0 auto;
	padding:0 15px;
}

.greyLine{
	background:url('img/line.svg') repeat-x left center;
	min-height:1px;
}


.more{	
	min-width: 180px;
	height: 50px;	
}
.more a{
	display:flex;
	justify-content:center;
	align-items:center;	
	height:100%;
	background:none;
	text-decoration:none;	
	color: #FFF;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 100%; /* 14px */
	padding:0 30px;
}

.white-grad:hover{
	background-image:linear-gradient(to right, #603DFA, #7BB5FA);
}

.white-grad:hover::before {
	border-radius: 25px;
	--mask: none;
	-webkit-mask: none
}

.white-grad {
  color: #313149;
  padding: 0;
  border-radius: 15px;
  display: inline-block;
  margin: 0;
  background-size: 0 0;
  position: relative;
  z-index: 0;
  background-image:linear-gradient(to right, #7BB5FA, #603DFA);
}
.white-grad::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: inherit;
  background-size: auto;
  --mask: url('data:image/svg+xml;utf8,<svg  xmlns="http://www.w3.org/2000/svg" ><rect x="1" y="1" width="100%" height="100%" style="height:calc(100% - 2px);width:calc(100% - 2px)" rx="25" ry="25" stroke-width="2" fill="transparent" stroke="white"/></svg>');
  -webkit-mask: var(--mask);
          mask: var(--mask);
}

h1{
	margin:0;
	padding:0;
	font-size: 48px;
	font-style: normal;
	font-weight: 700;
	line-height: 104.167%;	
}
h2{	
	font-size: 48px;
	font-style: normal;
	font-weight: 700;
	line-height: 110%;	
	background: var(--gradient-blue-to-green, linear-gradient(91deg, #2175FC 0%, #11C97A 100%));
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin:0;
	padding:0 0 30px 0;
}
h3{
	color: #FFF;
	font-size: 32px;
	font-style: normal;
	font-weight: 700;
	line-height: 120%;
	margin:0;
	padding:0 0 30px 0;
}
h4{
	color: #FFF;
	font-size: 24px;
	font-style: normal;
	font-weight: 700;
	line-height: 133.333%;
	margin:0;
	padding:0 0 20px 0;
}
h5{
	color: #FFF;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: 133.333%;
	margin:0;
	padding:0 0 20px 0;
}

img, svg{
	max-width:100%;
	max-height:100%;
	vertical-align:top;
}

body .sl-overlay {
	background: #000;
}
body .sl-wrapper .sl-navigation button,
body .sl-wrapper .sl-close,
body .sl-wrapper .sl-counter{
	color:#fff;
}

/*-------------------------------------------------- HEADER TOP ----------*/

header{
	position: relative;	
	overflow: hidden;
}
header .container{
	position:relative;
	z-index:9;
}

.headerPage .headerTopWrap{
	position: relative;
}
.headerPageName{
	min-height:210px;
	padding:20px 0;
	display:flex;
	align-items:center;
}

.video-wrapper-header video {
	width:100%;
	height:auto;
}
.videoBg-header{
	width:100%;
	height:564px;
	overflow: hidden;
	position: absolute;
	bottom: 0;
	left:0;
	right:0;
	margin: 0 auto;
	z-index:2;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.96) 58.33%, #000 100%);
}
.video-wrapper-header  {
	width:100%;
	height:auto;
	overflow: hidden;
	position: absolute;
	top: 0;
	left:0;
	right:0;
	margin: 0 auto;
	z-index:1;
}

.headerTopWrap{
	position: absolute;
    z-index: 10;
    width: 100%;
    background-image: linear-gradient(to bottom, rgba(0,0,0,0.9), rgba(0,0,0,0));

}

.headerBottom .bottomGradient{
    position: absolute;
    z-index: 10;
    width: 100%;
    background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.9));
	bottom: 0;
	
}

.headerBottom .bottomGradient .container {
	height: 120px;
	box-sizing: border-box;
}

.headerBottom .bottomGradient h3 {
	position: absolute;
	bottom: 10px;
	padding-bottom: 0;
}

.headerTop{
	display:flex;
	justify-content:space-between;
	align-items:center;
	height:120px;
	
}
.logo{
	max-width:100px;
}
.logo a{
	display:block;
}

/*-------------------------------------------------- HEADER MENU ----------*/

.menu-button-container{
	display:none;
}
.headerMenu #primary-menu-list{
	display:flex;
	list-style:none;
	margin:0;
	padding:0;
	gap:60px
}
.headerMenu #primary-menu-list li{
	padding:0 5px;
}
.headerMenu #primary-menu-list li a{
	color: #FFF;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 26px; /* 185.714% */
letter-spacing: 0.7px;
text-transform: uppercase;
padding:0 5px 2px 5px;
text-decoration:none;
line-height:45px;
display:block;
}
.headerMenu #primary-menu-list li a:hover, .headerMenu #primary-menu-list li.current_page_item a{	
	border-bottom: 1px solid #fff
} 



.pageContentWrapper{
	padding:80px 0;
}
.pageContentWrap p{
	padding:0 0 20px 0;
	margin:0;
}

/*-------------------------------------------------- HOME HEADER VIDEO ----------*/

.headerBottom{
	padding:0px 0;
	position: relative;
    z-index: 9;
    top: 0;
	max-width: 1920px;
    margin: 0 auto;
}
.headerBottomText{
	margin-top: 15px;
}
.headerVideoWrap{

	margin: auto;
}

.video-compare-container.twentytwenty-after {
	position: absolute;
	top: 0px;
	left: 0px;
	overflow: hidden;
	z-index: 10;
}

.video-compare-container.twentytwenty-before {
	position: relative;
	z-index: 9;
}

.video-compare {
	border-radius: 0px;
}

.video-compare-container video {
	vertical-align: middle;
	max-width:100%;
}
/*-------------------------------------------------- SECTION STYLE ------------*/
.sectionHead {
	margin-bottom: 40px;
}
	
.sneakpeek {
	font-size: 34px;
	font-weight: 700;
	line-height: 41px;
	letter-spacing: 0em;
	text-align: left;
	display: flex;
	margin-top: 25px;
	justify-content: space-between;
    align-items: center;
}

.sneakpeek .description {
	width: 70%;
}

.sneakpeek .more a {
	padding-right: 0;
}

.typeName {
	font-family: Helvetica;
	font-size: 12px;
	font-weight: 400;
	line-height: 12px;
	letter-spacing: 0.16em;
	text-align: left;
	display: flex;
	align-items: center;
}

.typeName .border {
	width: 2px;
	height: 10px;
	background: #fff;
	border-radius: 0 100% 100% 0;
	margin-right: 8px;
}

/*-------------------------------------------------- EMBLA SLIDER -----------*/

	.rightContainer {
		width: 100%;
		max-width: 1440px;
		margin: 0 auto;
		padding-left: 80px;
	}

	.embla {
        overflow: hidden;
		position: relative;
    }
    .embla__container {
        display: flex;

    }
    .embla__slide {
        flex: 0 0 30%;
        min-width: 0;
        margin-right: 3%;
       
        overflow: hidden;
		height: 820px
    }
	
	.processSlider {
		overflow: hidden;
		position: relative;
	}
	.processSlide {
		  flex: 0 0 24%;
        min-width: 0;
        margin-right: 0;
       
        overflow: hidden;

	}
	
	

    .embla__slide.active {

        flex: 0 0 60%;

    }

    .embla__slide.active img {
        transition: all 0.2s;

    }

    .embla__slide img{
        height: 100%;
        margin: 0 auto;
    }
	
	.embla__slide video {
		height: 286px;
	}
	
	.embla__slide.active video {
		height: 525px;
	}
	
	.embla__viewport {
		
	}
	
	.embla__next {
		width: 5%;
		height: 100%;
		position: absolute;
		top: 0;
		bottom: 0;
		background: rgba(0,0,0,0.6) url('img/next-ico.svg') no-repeat center 241px;
		background-size: 42px auto;
		border: none;
		right: 0;
		cursor: pointer;
	}
	
	.slideInfo {
		margin-top: 30px;
		
	}
	.slideInfo h3 {
		margin-top: 10px;
		font-size: 34px;
		font-weight: 700;
		line-height: 34px;
		letter-spacing: 0em;
		text-align: left;

	}
	
	.slideInfo .description {
		font-size: 20px;
		font-weight: 400;
		line-height: 25px;
		letter-spacing: 0em;
		text-align: left;
		height: 0;
		overflow:hidden;
	}
	
	.active .slideInfo .description{
		transition: height 0.4s linear;
		height: 50px;
	}
	
	
	.slideInfo .date {
		font-family: Helvetica;
		font-size: 12px;
		font-weight: 400;
		line-height: 16px;
		letter-spacing: 0.16em;
		text-align: left;
		color: #6C6C6C;
		
	}
	
	.active .slideInfo .date {
		margin-top: 30px;
	}
	
/*-------------------------------------------------- HOME TRUSTED ----------*/
.trustedWrap {
	margin: 50px auto;
	padding: 40px 0;
	background: #181818;
	max-width: 1440px;
	
}

.trusterTextWrap{
	display:flex;
	align-items: center;
	height:90px;
}
.trusterText{
	font-size: 18px;
	font-style: normal;
	font-weight: 700;
	line-height: 177.778%;
	background:#000;
	padding-right:25px;
}
.trustedIconsWrap{
	display:flex;
	justify-content:space-between;
	align-items: center;
	height:110px;
}

/*-------------------------------------------------- HOME PROCESS ----------*/

.processSection {
	margin: 40px auto;
	padding: 100px 0;
	background: #181818;
	max-width: 1440px;
}

.beam{
	
	position: relative;

	display: flex;
	align-items: center;
	margin-bottom:25px;
}

.beam .circle {
	position: relative;
	width: 38px;
	height: 34px;
	border: 2px solid #202020;
	border-radius: 50%;
	background: #181818;
	
}

.beam .circle:after {
	content: '';
	display: block;
	position: absolute;
	width: 24px;
	height: 24px;
	background: rgba(255,255,255, 0.3);
	border-radius: 50%;
	top: 3px;
	left: 3px;
}

.beam .sliderGreyLine {
	height: 1px;
	background: #202020;
	width: 100%;
}

.processSlide .imgWrap{
	position: relative;
	width: 88%;
	height: 160px;
	background: #060606;
}

.processSlideInfo {
	margin-top: 30px;
}

.processSlideInfo h3{
	font-size: 20px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: 0.3px;
	text-align: left;
	padding-bottom: 5px;
}

.processSlideInfo h4 {
	font-family: Helvetica;
	font-size: 12px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0.16em;
	text-align: left;
	margin-top: 25px;
	padding-bottom: 10px;
}

.processSlideInfo .processSlideDesc{
	font-family: Space Grotesk;
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	letter-spacing: 0.5px;
	text-align: left;
	color: #808191;

}

/*-------------------------------------------------- HOME ABOUT US --------*/
.aboutUsSection {
	margin-top: 120px;
}

.aboutUsSection .container {
	display: flex;
	align-items: center;
}

.aboutUsSection .aboutRight {
	width: 50%;
	padding-left: 60px;
}

.aboutUsSection .aboutLeft {
	
	width: 50%;
}

.aboutUsSection .aboutRight .sneakpeek .description {
	width: auto;
}

.aboutUsSection .sectionContent {
	
	font-size: 17px;
	font-weight: 400;
	line-height: 22px;
	letter-spacing: 0em;
	text-align: left;

}

.aboutUsSection .more {
	margin-top: 25px;
}

.aboutUsSection .more a {
	padding-left: 0;
	justify-content: flex-start;
}
/*-------------------------------------------------- FOOTER CONTACT -------*/

.footerContactSection {
	
	margin-top: 100px;
	background: url('img/bg-contact.jpg') no-repeat center top;
	height: 295px;
}

.footerContactSection .container1100{
	width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 15px;
	display:flex;
	height: 100%;
	    align-items: center;
    justify-content: space-between;
}

.footerContactSection .container1100 .text {
	max-width: 770px;
	
}

.footerContactSection .container1100 .more {
	background: #000;
	min-width: 160px;
    height: 60px;
}

.footerContactSection .container1100 .text h3 {

	font-size: 20px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: 0.3px;
	text-align: left;
	padding: 0;
	margin-bottom: 10px;
	color: #fff;

}

.footerContactSection .container1100 .text .description {

	font-size: 17px;
	font-weight: 400;
	line-height: 22px;
	letter-spacing: 0em;
	text-align: left;

}

/*-------------------------------------------------- HOME VISION ----------*/

.visionWrap{
	height:710px;
	display:flex;
	flex-direction:column;
	justify-content: center;
	position: relative;	
	overflow: hidden;
}

.video-wrapper video {
	height:100%;
	width:auto;
}
.videoBg{
	width:1000px;
	height:562.5px;
	overflow: hidden;
	position: absolute;
	top: 0;
	bottom:0;
	margin:auto 0;
	right: 0;
	z-index:2;
	background: radial-gradient(50% 50.00% at 50% 50.00%, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.30) 69.27%, #000 100%);
}
.video-wrapper  {
	width:1000px;
	height:562.5px;
	overflow: hidden;
	position: absolute;
	top: 0;
	bottom:0;
	margin:auto 0;
	right: 0;
	z-index:1;
}

.visionTextWrap{
	position:relative;
	z-index:5;
	max-width:630px;
	padding-left:100px;
}
.visionText{
	padding-bottom: 30px;
}

/*-------------------------------------------------- ----------*/

.headerText {

font-size: 19px;
font-weight: 400;
line-height: 32px;
letter-spacing: 0em;
text-align: left;

}

.revolutionWrap{
	min-height:760px;
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	position: relative;	
	overflow: hidden;
	padding: 0;
}
.revolutionWrap h2{
	max-width:750px;
	text-align:center;
	position: relative;	
	z-index:5;
}
.revolutionWrap .more, .revolutionWrap h4{
	position: relative;	
	z-index:5;
}
.revolutionBoxesWrap{
	display:flex;
	justify-content: space-between;
	padding:40px 0 70px 0;
	position: relative;	
	z-index:5;
}
.revolutionBox{
	width:32%;
	padding:70px 50px 40px 50px;
	border-radius:16px;
}
.revolutionBoxIco{
	padding-bottom:15px;
}
.revolutionBox1{
	background:url('img/box-blue-bg.png') no-repeat center center;
	background-size:cover;
}
.revolutionBox2{
	background:url('img/box-green-bg.png') no-repeat center center;
	background-size:cover;
}
.revolutionBox3{
	background:url('img/box-purple-bg.png') no-repeat center center;
	background-size:cover;
}


.video-wrapperRev video {
	width: 100%;
	height: auto;
}
.videoBgRev{
	width: 100%;
	height: auto;
	overflow: hidden;
	position: absolute;
	top: 0;
	bottom:0;
	margin:auto 0;
	right: 0;
	z-index:2;
	background: radial-gradient(50% 50.00% at 50% 50.00%, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.30) 69.27%, #000 100%);
}
.video-wrapperRev{
	width: 100%;
	height: auto;
	overflow: hidden;
	position: absolute;
	top: 0;
	bottom:0;
	margin:auto 0;
	right: 0;
	z-index:1;
}

/*-------------------------------------------------- HOME GALLERY ----------*/

.galleryWrapper{

}
.galleryWrap{
	display:flex;
	flex-direction: column;
    align-items: center;
}
.galleryWrap h2{
	text-align:center;
}
.galleryImagesWrap{

}
.galleryBox{
	height:300px;
	margin-bottom:20px;
	border-radius:16px;
}
.galleryBoxSmall{
	width:23.5%;
}
.galleryBoxBig{
	width:49%;
}

/*-------------------------------------------------- HOME LATEST WORK ----------*/

.latestWorkWrap{
	padding:60px 0;
}
.latestWorkWrap h2{
	max-width:670px;
	padding-bottom:60px;
}

.lastWorkFirst{
	padding-bottom:70px;
}
.lastWorkFirstVideo iframe{
	width:100%;
	border:none;
}
.lastWorkFirstTitleWrap h3{
	padding:0;
}
.lastWorkFirstDescription{
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 160%;
}
.latestWorkFilmsSlider{
	display:flex;
	justify-content:space-between;
}
.latestWorkSlideItem{
	width:48%;
}
.latestWorkSlideItem h3{
	padding:0;
}
.latestWorksMore{
	padding-top:50px;
	display:flex;
	justify-content: center;
}

/*-------------------------------------------------- HOME POWER ----------*/

.powerWrapper{
	background:url('img/latest-work.png') no-repeat center center;
	background-size:auto 100%;
}
.powerWrap{
	padding:45px 0;
	
}
.powerBoxesWrap{
	display:flex;
	justify-content:space-between;
	padding:25px 0;
}
.powerBox{
	width:100%;
	padding:180px 0 0 0;
	border-radius:16px 16px 18px 18px;
}
.powerBoxTitleWrap{
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.00) 0%, #000 50%, #000 100%);
	padding:0 25px 25px 25px;
	border-radius:16px;
}
.powerBoxTitleWrap h3{
	padding-bottom:0;
}
.powerBoxWrap{
	width:23.5%;
}
.powerBoxWrap2{
	padding-top:80px;
}
.powerBoxWrap3{
	padding-top:160px;
}
.powerBoxWrap4{
	padding-top:240px;
}
.moreCenter{
	display:flex;
	justify-content:center;
}

/*-------------------------------------------------- TESTIMONIALS ----------*/

.testimonialsWrapper{
	padding:50px 0;
}
.testimonialsWrap .glsr-reviews{
	display:flex;
}
.testimonialsWrap .glsr-default .glsr-review{
	width:32%;
	background:#101012;
	padding:40px;
	border-radius:16px;
	overflow:hidden;
	border:1px solid #212125;
}
.testimonialsWrap .glsr-default .glsr-review{
	align-content: space-between;
}
.testimonialsWrap .glsr-review-author{
	padding-top:25px;
	font-weight:700;
}
.glsr-review-bottom{
	padding-top:30px;
}

/*-------------------------------------------------- CONTACT ----------*/

.contactWrapper{
	position:relative;
}
.contactBg{
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	margin:0 auto;
	height:330px;
	width:100%;
	z-index:5;
	background:url('img/contacy.png') no-repeat bottom center;
}
.contactWrap{
	height:auto;
	display:flex;
	flex-direction:column;
	justify-content: center;
	position: relative;	
	overflow: hidden;
}
.contact-video-wrapper2{
	position:relative;
	width:100%;
	height:auto;;
}
.contact-video-wrapper video {
	height:100%;
	width:auto;
}
.contact-videoBg{
	width: 1280px;
	height: 720px;
	overflow: hidden;
	position: absolute;
	top: 0;	
	right: 0;
	z-index:2;
	background: radial-gradient(50% 50% at 50% 50%, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.30) 69.27%, #000 100%);
}
.contact-video-wrapper  {
	width: 1280px;
	height: 720px;
	overflow: hidden;
	position: absolute;
	top: 0;	
	right: 0;
	z-index:1;
}
.contactTextWrap{
	height:560px;
	position:relative;
	z-index:9;
	display:flex;
	justify-content:space-between;
	align-items:center;
	
}
.contactTextWrapLeft{
	width:40%;
}
.contactTextWrapRight{
	width:57%;
}
.contactTextWrapRight h2{
	max-width:580px;
}
.contactFormWrap{
	position:relative;
	z-index:9;
	display:flex;
	justify-content:space-between;
	align-items: center;
	padding-bottom:150px;
}
.contactFormWrapLeft{
	width:48%;
}
.contactFormWrapLeft h4{
	padding:0;
}
.contactPhone{
	padding-left:40px;
	background:url('img/icon-phone.png') no-repeat left center;
}
.contactMail{
	padding-left:40px;
	background:url('img/icon-mail.png') no-repeat left center;
}
.contactPhone a, .contactMail a{
	color: #FFF;
	font-size: 24px;
	font-style: normal;
	font-weight: 500;
	line-height: 40px;
	text-decoration:none;
}
.contactPhone a:hover, .contactMail a:hover{
	color:#2175FC;
}
.contactFormWrapRight{
	width:50%;
	background: #101012;
    padding: 40px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #212125;
}
.contactFormWrapRight form{
	
}
.contactFormWrapRight form p{
	margin:0;
}
.contactFormWrapRight form label{
	color: #FFF;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px; /* 125% */
	letter-spacing: 0.08px;
	
}
.contactFormWrapRight form input{
	width:100%;
	background:none;
	border:none;
	color: #4C4C4C;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px; /* 125% */
	letter-spacing: 0.08px;
	border-bottom:2px solid #4C4C4C;
	margin-bottom:15px;
}
.contactFormWrapRight form input::placeholder, .contactFormWrapRight form textarea::placeholder{
	color: #4C4C4C;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px; /* 125% */
	letter-spacing: 0.08px;
}
.contactFormWrapRight form textarea{
	font-family: 'Space Grotesk', sans-serif;
	width:100%;
	background:none;
	border:none;
	color: #4C4C4C;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px; /* 125% */
	letter-spacing: 0.08px;
	border-bottom:2px solid #4C4C4C;
	margin-bottom:15px;
}
.contactFormWrapRight form input[type="submit"] {
	display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    background: none;
    text-decoration: none;
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    padding: 0 30px;
	border:none;
	margin-bottom:0;
	cursor:pointer;
}




/*-------------------------------------------------- STUDIO ----------*/

.studioSection {
	margin-top: 60px;
}

.studioCategories {
	display: flex;
	margin-top: 30px;
	flex-wrap: wrap;
    justify-content: space-between;
}

.studioCategories .categoryItem {
	border: 1px solid rgba(255,255,255,0.2);
	max-width: 620px;
	position: relative;
	margin-bottom: 40px;

}

.studioCategories .categoryItem h3 {
	font-size: 22px;
	font-weight: 700;
	line-height: 41px;
	letter-spacing: 0em;
	text-align: left;
	position: absolute;
	bottom: 30px;
	left: 30px;
	padding: 0;
}

.studioInfo {
	margin-bottom: 40px;
	display: flex;
	align-items: flex-start;
	margin-top: 20px;
}

.studioInfo .typeName {
	width:25%;
	margin-top: 5px;
}

.studioInfo .description {
	width:50%;
	font-size: 20px;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: 0em;
	text-align: left;

}

.talentsSlider {
	margin-left: 25%;
	width: 75%;
}


.talentSlider {
	overflow: hidden;
	position: relative;
}
.talentSlide {
	 flex: 0 0 29%;
	min-width: 0;
	margin-right: 3%;
   
	overflow: hidden;

}

.talentSlide img {
	width: 100%;
}

.talentSlide h3 {
	margin-top: 20px;
	font-size: 22px;
	font-weight: 700;
	line-height: 41px;
	letter-spacing: 0em;
	text-align: left;
	padding: 0;
}

.talentSlide .job {
	font-family: Helvetica;
	font-size: 12px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0.16em;
	text-align: left;
	margin-top: 10px;
	color: #6C6C6C;

}

.talentSlide .description {
	font-family: Space Grotesk;
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0em;
	text-align: left;
	color: #B1B1B1;
	margin-top: 25px;

}

.studioGreyLine {
	height: 1px;
	background: rgba(255,255,255,0.5);
	margin-top: 40px;
	margin-bottom: 40px;
	
}

.gallerySlide {
	 flex: 0 0 29%;
	min-width: 0;
	margin-right: 3%;
   
	overflow: hidden;
	height: 330px;
	display: block;
}

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

.galleryWrapper {
	margin-left: 25%;
	width: 75%;
}

.gallerySlide.active {
	flex: 0 0 61%;
}

.galleryWrapper .embla__next {
	background: rgba(0,0,0,0.6) url('img/next-ico.svg') no-repeat center 150px
}


/*-------------------------------------------------- WORKS ----------*/

.worksWrapper {
	display: flex;
	justify-content: space-between;
}

.worksWrapper .newVideo {
	max-width: 70%;
}

.worksWrapper .video {
	max-width: 25%;
}

.worksWrapper .slideInfo .description {
	height: auto;
	margin-bottom: 25px;
}

.worksWrapper .videoItem {
	margin-bottom: 70px;
}

.worksWrapper video{
	max-width: 100%;
}

/*-------------------------------------------------- ABOUT US ----------*/

.aboutUsSection .sectionContent .aboutText, .about .aboutText {

	font-size: 19px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: -0.02em;
	text-align: left;
}

.about .sectionHead {
	margin-bottom: 20px;
}

.aboutContainer{
	width: 100%;
    max-width: 870px;
    margin: 90px auto;
    padding: 0 15px;
}

.aboutContainer h3 {
	padding: 0;
	font-size: 34px;
	font-weight: 700;
	line-height: 41px;
	letter-spacing: 0em;
	text-align: left;
	margin-bottom: 15px;
}

.headerAbout {
	
	text-align: center;
}

.aboutHeaderInfo {
	position: absolute;
	top: 200px;
	width: 100%;
}

.aboutHeaderInfo .container {
	display: flex;
	align-items: center;
}

.aboutHeaderInfo .aboutHeadText {
	max-width: 412px;
	margin-right: 25px;
	font-size: 16px;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: 0em;
	text-align: left;

}

.aboutHeaderInfo h1 .line1 {
	font-size: 64px;
	font-weight: 700;
	line-height: 64px;
	letter-spacing: 0em;
	text-align: left;

}

.aboutHeaderInfo h1 .line2 {
	font-size: 96px;
	font-weight: 700;
	line-height: 96px;
	letter-spacing: 0em;
	text-align: left;
}

.aboutHeaderInfo h1{
	text-align: left;
}

.about .galleryWrapper {
	margin-left: 0;
	width: 100%;
}

.about .gallerySlide {
	flex: 0 0 22%;
	margin-right: 2%;
}

.about .gallerySlide.active {
	flex: 0 0 46%;
}

/*-------------------------------------------------- video ----------*/

.videoContainer {
	margin: 30px auto;
	max-width:1440px;
}

.videoContainer video {
	width: 100%;
}

.videoSection h3 {
	margin-top: 10px;
	padding: 0;
	font-size: 28px;
	font-weight: 700;
	line-height: 34px;
	letter-spacing: 0em;
	text-align: left;
	margin-bottom: 20px;

}

.videoSection .videoText {

	font-size: 20px;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: 0em;
	text-align: left;

}

.videoSection .galleryWrapper {
	margin-left: 0;
	width: 100%;
	margin-top: 40px;
}

.videoSection .gallerySlide {
	flex: 0 0 42%;
	margin-right: 2%;
	height: 350px;
}
.videoSection .gallerySlide a {
	display: block;
	height: 330px;
}

.videoSection .mt {
	margin-top: 60px;
	margin-bottom: 80px;
}

.videoSection .gallerySlide .imgDesc{

font-size: 14px;
font-weight: 400;
line-height: 30px;
letter-spacing: 0em;
text-align: left;
color: rgba(255,255,255,0.5);

}

.credits {
	width: 100%;
    max-width: 1090px;
    margin: 120px auto;
    padding: 0 15px;
}

.dataWrapper {
	display: flex;
	justify-content: space-between;
}

.dataWrapper .dataLeft, .dataWrapper .dataRight {
	width: 500px;
}

.dataWrapper .dataItem {
	display: flex;
	border-bottom: 1px solid #40404070
}

.dataWrapper .dataItem .itemLeft, .dataWrapper .dataItem .itemRight {
	width: 50%;
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	line-height: 45px;
	letter-spacing: 0em;
	text-align: left;

}

.dataWrapper div.dataItem .itemLeft {
	font-weight: 700;
}

.videoHide {
	display: none;
}

.slideInfo h3 a {
	text-decoration: none;
	color: #fff;
}

.slideInfo h3 a:hover {
	text-decoration: underline;
}

/*-------------------------------------------------- ----------*/






















footer{
	margin-top: 100px;
	padding-bottom:100px;
	padding-top:0;
}

.footTop{
	height:110px;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.footMenu #primary-menu-list{
	display:flex;
	list-style:none;
	margin:0;
	padding:0;
}
.footMenu #primary-menu-list li{
	padding:0 25px;
}
.footMenu #primary-menu-list li a{
	color: #FFF;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 26px; /* 185.714% */
letter-spacing: 0.7px;
text-transform: uppercase;
padding:0 20px 1px 20px;
text-decoration:none;
line-height:35px;
display:block;
}
.footMenu #primary-menu-list li a:hover, .footMenu #primary-menu-list li.current_page_item a{
	background-image: linear-gradient(to right, #7BB5FA, #603DFA);
  background-size: 100% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
} 


.footSocialWrap{
	display:flex;
}
.footSocialIco{
	padding-left:40px;
}
.footSocialIco svg{
	fill:#fff;
	height:24px;
}


.footSocialIcoFacebook svg:hover{
	fill: #1877F2;
}
.footSocialIcoTwitter svg:hover{
	fill: #1DA1F2;
}
.footSocialIcoVimeo svg:hover{
	fill: #1ca7cc;
}
.footSocialIcoYouTube svg:hover{
	fill: #F61C0D;
}


.footBottom{
	height:140px;
	display:flex;
	justify-content:space-between;
	align-items:center;
}

.logoFoot{
	max-width:100px;
}
.logoFoot a{
	display:block;
}











.copyright{
	color: rgba(255,255,255,0.5);
	font-size: 14px;
	font-weight: 400;
	line-height: 26px;
	letter-spacing: 0em;
	text-align: right;

}
.policyWrap{
	display:flex;
}
.policyItem{
	padding-left:30px;
}
.policyItem a{
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	color:#fff;
	text-decoration:none;
}
.policyItem a:hover{
	text-decoration:underline;
}

.iframeWrapper{
	
	overflow:hidden;
}

.headerVideoWrap .twentytwenty-handle {

}

.headerVideoWrap .twentytwenty-horizontal .twentytwenty-handle:before, .headerVideoWrap .twentytwenty-horizontal .twentytwenty-handle:after {
	width: 1px;
	
}

.headerVideoWrap .twentytwenty-handle {
	height: 1px;
	width: 1px;
	border: none;
	margin-left:0;
	margin-right: 0;
}
.headerVideoWrap .twentytwenty-horizontal .twentytwenty-handle:before {
	margin-bottom: 0;
}

.headerVideoWrap .twentytwenty-horizontal .twentytwenty-handle:after {
	margin-top: 0;
}

.headerVideoWrap .twentytwenty-left-arrow, .headerVideoWrap .twentytwenty-right-arrow {
	border-right: 1px solid white;
    border-top: 1px solid white;
    right: 50%;
    margin-right: -17px;
    width: 8px;
    height: 8px;
    display: block;
    
}

.getInTouchArrow {
	background: url('img/icon-arrow-up@1x.svg') no-repeat top left;
	background-size: 100% auto;
    width: 11px;
    height: 11px;
    margin-left: 10px;
}

.headerVideoWrap .twentytwenty-right-arrow {
	transform: rotate(45deg);
	border-left: 6px inset transparent;
}

.headerVideoWrap .twentytwenty-left-arrow {
	transform: rotate(225deg);
}


.twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after, .twentytwenty-vertical .twentytwenty-handle:before, .twentytwenty-vertical .twentytwenty-handle:after {
	background:rgba(255,255,255,0.4);
	-webkit-box-shadow: none;
	box-shadow: none;
}

h2.compareText {
		background: rgba(0,0,0,0.6);
		color: #fff;
		position: absolute;
		left: 0;
		right: 0;
		margin: 0 auto;
		padding: 40px;
		width: 100%;
		height: 100%;
		z-index: 99;
		-webkit-text-fill-color: initial;
		text-align: center;
		transition: opacity ease 3s;
		opacity: 1;
		box-sizing: border-box;
	}
	
	h2.compareText div {
		max-width:800px;
		margin: 0 auto;
	}
	
	.headerVideoWrap:hover h2.compareText {
		transition: all ease .3s;
		opacity: 0;
	}
	
	.headerVideoWrap {
		overflow: hidden;
		position: relative;
	}
	
	.sound {
		position:absolute;
		top: 20px; 
		right: 20px;
		height: 40px;
		width: 40px;
		background: url('img/sound.png') no-repeat center center;
		background-size:cover;
		z-index: 99;
		cursor: pointer;
		transition: opacity ease .3s;
		opacity: 0;
	}
	
	.sound.muted{
		background: url('img/mute.png') no-repeat center center;
		background-size:cover;
	}
	
	.headerVideoWrap:hover .sound {
		transition: opacity ease .3s;
		opacity: 1;
	}
	


.latestWorkFilmsSliderPage{
	flex-wrap:wrap;
}
.latestWorkFilmsSliderPage .latestWorkSlideItem{
	margin-bottom:50px;
}

.powerBoxesWrapPage{
	
}
.powerBoxesWrapPage .powerBoxWrap2, .powerBoxesWrapPage .powerBoxWrap3, .powerBoxesWrapPage .powerBoxWrap4 {
    padding-top: 0;
}


.modalActive {
	overflow: hidden;
}

.modalActive .modal {
	overflow-x: hidden;
	overflow-y: auto;
}

.fade.show {
	opacity: 1;
}

.modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9999;
	display: none;
	overflow-x: hidden;
	outline: 0;
	background: rgba(0,0,0,0.85);
}

.fade {
	opacity: 0;
	transition: opacity .15s linear;
}

.modal-dialog {
	
	height: 100%;
	position: relative;
	width: auto;
}

.modal-content {
	display: flex;
	justify-content: center;
	height: 100%;
	align-items: center;
}

.modal-content video {
	max-width: 1100px;
	width: 90%;
}

.closeModal {
	background-image: url(img/modal-close.png);
	background-size: 15px auto;
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	right: 0;
	top: 0;
	height: 60px;
	text-align: center;
	width: 60px;
	cursor: pointer;
	z-index: 9999999;
}

.reelWrapper {
	display: flex;
	justify-content: center;
	position: absolute;
	bottom: 40px;
	z-index: 999;
	width: 100%;
	transition: opacity ease .6s;
	opacity: 0;
}

.headerVideoWrap:hover .reelWrapper {
	transition: all ease .6s;
	opacity: 1;
}

.pageWrapper h2, .pageWrapper h4{
	text-align: center;
}

.pageWrapper .latestWorkWrap h2 {
	margin: 0 auto;
}









/*-----------------------------------------------------------------*/
/*-------------------------------------------------- RWD ----------*/
/*-----------------------------------------------------------------*/

@media screen and (max-width: 1440px){
	.video-wrapper-header, .video-wrapper-header video {
		width: auto;
		height: 100%;
	}
}
@media screen and (max-width: 1310px){
	.visionTextWrap{
		padding-left:0;
	}
	.revolutionBox{
		padding:30px;
	}
	.powerBox{
		padding-top:140px;
	}
	.contact-video-wrapper {
		width: 100%;
		height: auto;
	}
	.contact-videoBg {
		width: 100%;
		height: 100%;
	}
	.contact-video-wrapper video {
    height: auto;
    width: 100%;
}
}
@media screen and (max-width: 1090px){
	.galleryBox{
		height:250px;
	}
}
@media screen and (max-width: 1030px){
	.visionWrap{
		height:auto;
		padding:50px 0;
	}
	.video-wrapper{
		width: 100%;
		height: auto;
		position:relative;
	}
	.video-wrapper video {
		height: auto;
		width: 100%;
	}
	.videoBg{
		width: 100%;
		height: 100%;
	}
	.visionTextWrap{
		padding-top:30px;
		max-width:100%;
	}
}
@media screen and (max-width: 990px){
	.revolutionBoxesWrap{
		flex-direction: column;
	}
	.revolutionBox{
		width:auto;
		margin-bottom:15px;
	}
	.powerBoxesWrap{
		flex-wrap: wrap;
	}
	.powerBoxWrap {
		width: 50%;
		margin: 0 auto;
	}
	.powerBox{
		max-width:300px;
		margin:0 auto;
	}
	.powerBoxWrap1, .powerBoxWrap3{
		padding-right:8px;
	}
	.powerBoxWrap2, .powerBoxWrap4{
		padding-left:8px;
	}
	.powerBoxWrap3 {
		padding-top: 0;
	}
	.powerBoxWrap4 {
		padding-top: 80px;
	}
	.contactWrap{
		height:auto;
		padding:50px 0;
	}
	.contactTextWrap{
		flex-direction: column;
		height:auto;
	}
	.contact-videoBg{
		width:100%;
		height:100%;
	}
	.contactTextWrapLeft{
		width:auto;
		padding-bottom:30px;
	}
	.contactTextWrapRight{
		width:auto;
		text-align:center;
	}
	.contactTextWrapRight h2{
		max-width:100%;
	}
	h1, h2{	
		font-size: 40px;
	}
	h3{
		font-size: 26px;
	}
	h4, .lastWorkFirstDescription{
		font-size: 20px;
	}
	.testimonialsWrap .glsr-default .glsr-review{
		width:49%;
	}
	.testimonialsWrap .glsr-default #review-33{
		display:none;
	}
	.powerBoxesWrapPage .powerBoxWrap1, .powerBoxesWrapPage .powerBoxWrap2, .powerBoxesWrapPage .powerBoxWrap3, .powerBoxesWrapPage .powerBoxWrap4 {
		margin-bottom:30px;
	}
	.contactFormWrap{
		padding-bottom:0;
	}
}
@media screen and (max-width: 900px){
	.trustedIconsWrap{
		flex-wrap: wrap;
		height:auto;
	}
	.trustedIco{
		width:32%;
		margin-bottom:15px;
		text-align: center;
	}
	.headerMenu #primary-menu-list li a{
		padding: 0 10px 2px 10px;
	}
	.galleryBox{
		height:200px;
	}
}

@media screen and (max-width: 750px){
	.footMenu #primary-menu-list li a{
		padding: 0 10px 1px 10px;
	}
	.footSocialIco{
		padding-left:20px;
	}
	.policyItem{
		padding-left:15px;
	}
	.galleryBoxTabletSmall{
		width:32%;
	}
	.galleryBoxTabletBig{
		width:66%;
	}
	.galleryBoxTabletLast{
		width:100%;
	}
}

@media screen and (max-width: 720px){
	.headerTop .more{
		display:none;
	}
	.latestWorkFilmsSlider{
		flex-direction: column;
	}
	.latestWorkSlideItem {
		width: auto;
		margin-bottom:20px;
	}
	.contactFormWrap{
		flex-direction: column;
	}
	.contactFormWrapLeft{
		width:100%;
		padding-bottom:30px;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.contactFormWrapRight{
		width:100%;
	}
}

@media screen and (max-width: 640px){
	.footTop {
		height: auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: column;
		padding: 15px 0;
	}
	.footSocialWrap {
		padding-top: 15px;
	}
	.footBottom {
		height: auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: column;
		padding: 15px 0;
	}
	.logoFoot{
		padding-top:15px;
	}
	h1, h2{	
		font-size: 34px;
	}
	h3{
		font-size: 22px;
	}
	h4, .lastWorkFirstDescription{
		font-size: 18px;
	}
	body{
		font-size:14px;
	}
	.testimonialsWrap .glsr-reviews{
		flex-direction: column;
	}
	.testimonialsWrap .glsr-default .glsr-review {
		width: 100%;
		margin-bottom:15px;
		padding:30px;
	}
	.galleryBox{
		height:150px;
	}
}

@media screen and (max-width: 560px){
	.trustedIco{
		width:49%;
	}
	.powerBoxWrap {
		width: 100%;
		margin-bottom:15px;
	}
	.powerBoxWrap1, .powerBoxWrap3{
		padding-right:0;
	}
	.powerBoxWrap2, .powerBoxWrap4{
		padding-left:0;
	}
	.powerBoxWrap2, .powerBoxWrap4 {
		padding-top: 0;
	}
	h1, h2{	
		font-size: 30px;
	}
	h2.compareText{
		padding:15px;
	}
	.contactFormWrapRight{
		padding:15px;
	}
	.headerTop{
		flex-direction: column;
		padding:20px 0;
		height:auto;
	}
	.headerPageName{
		min-height:0;
		padding:40px 0;
	}
	.galleryBox{
		margin-bottom:10px;
	}
	.galleryBoxTabletBig, .galleryBoxTabletLast{
		width:32%;
	}
}

@media screen and (max-width: 410px){
	.footMenu #primary-menu-list{
		flex-direction: column;
		align-items: center;
	}
	h1, h2{	
		font-size: 24px;
	}
	.headerMenu #primary-menu-list li a{
		padding:0 0 2px 0;
	}
	.galleryBoxTabletBig, .galleryBoxTabletSmall{
		width:49%;
	}
	.galleryBoxTabletLast{
		width:100%;
	}
}





















