/* SMALL HEIGHT */

@media screen and (max-height: 750px) {

	.pAbout .about .contain {
		font-size: 12px;
	}
	.pAbout .about p {
		margin-bottom: 8px;
	}
	.pAbout .partner {
		margin-top: 20px;
	}
	.pAbout .partner .item {
		width: 100px;
    	height: 30px;
	}
	.pAbout .partner img {
	    max-height: 35px;
	}

	/* .pAbout .partner h4 {
		margin-bottom: 10px;
	} */
	.pAbout .about h1 {
		font-size: 36px;
	}
	.pAbout .scroll-cta {
		font-size: 10px;
	}

	.menu {
		height: 80px;
		padding-top: 16px;
	}
	.menu .logo img {
		height: 60px;
	}
	/* .nav-holder {
		max-width: 990px;
		padding-left: 120px;
	} */
	.nav-holder .left {
		padding-right: 80px;
	}

	.nav-holder .right {
		padding-left: 80px;
	}
	.nav {
		font-size: 12px;
	}
	.nav.space-after {
		margin-right: 180px;
	}
	#body-wrapper {
		padding-top: 80px;
	}

	footer {
		font-size: 12px;
		padding-top: 20px ;
		padding-bottom: 20px;
		/*background-color: #fff;*/
	}

	.viewmode.grid .item .name {
		font-size: 30px;
		padding-top: 5px;
	}
	.viewmode.grid .btn {
		padding: 2px 25px;
    	padding-top: 4px;
	}

	.pService, .pService2 {
		padding-top: 100px;
		padding-bottom: 60px;
	}

	.scene .info {
		font-size: 12px;
	}

	.scene .info .title {
		font-size: 28px;
	    line-height: 36px;
	}

}

@media screen and (max-height: 650px) {
	.menu {
		height: 80px;
		padding-top: 16px;
	}
	.menu .logo img {
		height: 60px;
	}
	/* .nav-holder {
		max-width: 990px;
		padding-left: 120px;
	} */
	.nav-holder .left {
		padding-right: 80px;
	}

	.nav-holder .right {
		padding-left: 80px;
	}
	.nav {
		font-size: 12px;
	}
	.nav.space-after {
		margin-right: 180px;
	}
	#body-wrapper {
		padding-top: 80px;
	}
}

@media screen and (max-height: 580px) {
	/* .pAbout .clip {
		height: 100px;
		overflow: scroll;
	} */
}

/* MOBILE */

@media screen and (max-width: 1440px) {
	.pContact .newsletter .input {
		margin-top: 30px;
	}
}

@media screen and (max-width: 1280px) {
	.pContact .newsletter .input {
		margin-top: 20px;
	}
}

@media screen and (max-width: 1210px) {
	.menu {
		height: 127px;
		padding-top: 44px;
	}
	.menu .logo img {
		height: 80px;
	}
	.nav-holder {
		/* max-width: 990px;
		padding-left: 6%; */
	}
	.nav {
		font-size: 12px;
	}
	.nav.space-after {
		margin-right: 220px;
	}
	#body-wrapper {
		/*padding-top: 127px;*/
	}
	
}

@media screen and (max-width: 1100px) {
	.nav-holder .left {
		padding-right: 80px;
	}

	.nav-holder .right {
		padding-left: 80px;
	}
}

@media screen and (max-width: 1024px) {
	#body-wrapper {
		padding-top: 80px;
	}
	footer {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	.menu {
		height: 80px;
		padding-top: 16px;
	}
	.menu .logo img {
		height: 60px;
	}
	.icon-holder {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 80px;
	}
	.menu-icon {
		width: 30px;
		height: auto;
		position: absolute;
		/* top: 24px; */
		right: 30px;
	}
	.only-mobile {
		position: fixed;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    box-sizing: border-box;
	    padding-top: 80px;
	}
	.only-mobile .menu-mobile {
		background-color: rgba(255,255,255,0.8);
		width: 100%;
		height: 100%;
		position: relative;
	}
	.only-mobile .holder {
		width: 100%;
    	max-width: 600px;
	}
	.nav {
		width: 100%;
	    font-size: 26px;
	    text-align: center;
	    box-sizing: border-box;
	    overflow: visible;
	    color: #000;
	}
	.nav.active .border, .nav:active .border {
		opacity: 1;
	}
	.nav.active .name, .nav:active .name {
		font-weight: bold;
	}
	.social {
		text-align: center;
    	height: 60px;
	}
	.menu .nav.icon {
		height: auto;
	}
	.pAbout .about .contain {
		font-size: 14px;
	}
	.pAbout .team .section-content ul li {
		position: relative;
	    width: 50%;
	    display: inline-block;
	    vertical-align: top;
	}
	.pAbout .team .section-content ul li .img img {
		width: 100%;
		height: auto;
	}
	.pAbout .team .section-content ul li .info {
		position: absolute;
		width: 100%;
		bottom: 0;
		left: 0;
		color: #fff;
		text-align: center;
    	box-sizing: border-box;
		padding: 20px 30px;
		background: rgba(0,0,0,0);
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0.6)));
		background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
		background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
		background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
		background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
	}
	.pAbout .team .section-content ul li .title {
		font-family: "Narziss";
	}
	.pAbout .team .section-content ul li h4 {
		font-size: 16px;
	}
	.pAbout .partner .item img {
		background: #fff;
		 /*border-radius: 10px; */
		/*width: 140px;*/
		padding: 42px;
	}
	.scene .info {
		padding-top: 0;
		padding-bottom: 0;
		padding-left: 0;
		padding-right: 0;
		box-sizing: border-box;
	}
	/*.spliter-hor {
		margin: 20px 0;
	}*/
	footer .bar-btn.credit {
		margin-left: 50px;
	}
}

@media screen and (max-width: 768px) {
	/*footer {*/
		/*position: fixed;*/
	    /*bottom: 0;*/
	    /*padding-top: 10px !important;*/
	    /*padding-bottom: 10px;*/
	    /*width: 100%;*/
	    /*box-sizing: border-box;*/
	/*}*/
	/*footer .bar-btn.newsletter {*/
		/*display: block;*/
	    /*padding: 7px 10px 5px 10px;*/
	    /*border: 1px solid #999;*/
	    /*!* width: 100%; *!*/
	    /*box-sizing: border-box;*/
	    /*text-align: center;*/
	    /*margin-bottom: 10px;*/
	    /*font-size: 10px;*/
	    /*position: absolute;*/
	    /*right: 30px;*/
	    /*margin-bottom: 0;*/
	    /*bottom: 16px;*/
	/*}*/
	/*.bar-btn.newsletter .hover-bar {*/
		/*display: none;*/
	/*}*/
	/*footer .bar-btn.credit {*/
		/*margin-left: 0;*/
    	/*float: none;*/
	/*}*/
	/*footer div.float-right {*/
		/*float: none;*/
	/*}*/
	.pService3 .topBtn {
		bottom: 80px;
	}

	#body-wrapper {
		padding-bottom: 60px;
	}

	.two-cols li.item {
		height: 225px;
	}
	.nav {
		font-size: 23px;
	}
	.pContact .half-left {
		width: 100%;
    	height: 40%;
	}
	.pContact .half-right {
		width: 100%;
    	height: 60%;
	}
	.pContact .newsletter .input {
		margin-top: 25px;
	}
	.pAbout .team {
		padding-bottom: 10px;
	}
	.pAbout .team .section-content ul li {
		display: inline-block;
		width: 50%;
		vertical-align: top;
	}
	.pAbout .team .section-content ul li .title {
		font-size: 24px;
	}
	.pAbout .team .section-content ul li .position {
		font-size: 14px;
	}
	
	/*.spliter-hor {
		margin: 0;
	}*/
	#start.contain.noselect .scene.ending {
		padding-bottom: 60px;
	}
	.scene .welcome-txt .title {
		font-size: 40px;
	}
	.scene.ending .welcome-txt p {
		font-size: 13px;
		margin-bottom: 5px;
	}
	.scene.ending .welcome-txt .btn {
		margin-top: 10px;
	}
	.scene.ending .welcome-txt .copy {
		font-size: 16px;
	}
	
	.scroll-item.info {
		top: -7px;
	}
	footer .bar-btn {
		margin-left: 0px;
	}
}

@media screen and (max-width: 736px) {
	#start.contain.noselect .scene.ending {
		padding-bottom: 4px;
	}
	.scene .welcome-txt .title {
		font-size: 40px;
		height: 50px;
	}
	.scene.ending .welcome-txt .spliter-hor {
		margin: 10px 0;
	}
	.scene.ending .welcome-txt .btn {
		margin-top: 0;
	}
	.scene.ending .welcome-txt .copy {
		font-size: 14px;
	}
	.two-cols li.item {
		height: 235px;
	}
}

@media screen and (max-width: 667px) {
	.scene .welcome-txt .title {
		margin-top: 0;
		font-size: 30px;
		height: 30px;
	}
	.scene.ending .welcome-txt p {
		font-size: 12px;
		margin-bottom: 3px;
	}
	.scene.ending .welcome-txt .btn .copy {
		font-size: 15px;
	}
	.scene.ending .welcome-txt .spliter-hor {
		margin: 0;
	}
	.scene.ending .welcome-txt .btn {
		top: -1px;
	}
	footer .bar-btn.credit {
		margin-left: 50px;
	}
}

@media screen and (max-width: 736px) {
	.nav {
		font-size: 16px;
		padding: 4px 20px 2px 20px;
	}
	.pContact .newsletter .title, .pContact .connect .title {
		font-size: 30px;
	}
	.pContact .newsletter .input input {
		border: 1px solid #999;
		width: 90%;
	}
	.pContact .newsletter .input .btn {
		right: 40px;
	}

	.page {
		min-height: 600px;
	}
	/* .pDirector .fullscreen-no-ui {
		height: 570px !important;
	} */
	.nav .border {
		width: 80%;
		left: 10%;
	}

	.menu {
		height: 50px;
	}
	.menu .logo img {
		height: 40px;
	}
	.only-mobile {
		/* height: 40px !important; */
		padding-top: 40px;
	}
	.menu-icon {
		width: 20px;
	    /* top: 10px; */
	    right: 20px;
	}
	footer {
		font-size: 8px;
		/* padding: 0;
		padding-top: 0 !important;
    	padding-bottom: 0 !important; */
	}
	.bar-btn .hover-bar {
		display: none;
	}
	footer .bar-btn.credit {
		display: none;
	}
	footer div.float-right {
		display: inline-block;
	    float: none;
    }
    #body-wrapper {
    	padding-top: 40px;
    }
    .scene .welcome-txt {
    	font-size: 12px;
    	width: 80%;
    }
    .scene.start .btn.black {
    	font-size: 12px;
    }
    .scene.start .icon-scroll {
    	width: 40px;
	    height: auto;
	    bottom: 0px;
    }
    .scene .spliter-hor {
    	margin: 0px 0;
    }
    .scene .info .title {
    	font-size: 20px;
    	line-height: 20px;
    }
    .scroll-item.info {
    	font-size: 10px;
    }
    .pService3 .topBtn {
    	bottom: 20px;
		right: 20px;
		width: 20px;
		height: 20px;
    }
    section.page.pDirector {
    	min-height: 0;
    }
    .pDirector .grid .nextBtn, .pDirector .grid .prevBtn {
    	display: none;
    }
    .section.director.fullscreen-no-ui {
	    height: auto !important;
	}
	.pDirector .detail .right {
		top: 30%;
	}
	.pDirector .detail {
		height: 400px;
		position: fixed;
		top: 0;
		padding-top: 0;
		z-index: 10;
	}
	.pDirector .close {
		top: 20%;
	}
	.pDirector .white-bg {
		top: 0;
    	left: 0;
	}
	.nav {
		margin: 5px 0px;
	}
	.scene.start .btn.black {
		background-color: rgba(0,0,0,0.4);
		font-size: 12px;
	}

}

/* LANDSCAPE */
@media screen and (max-width: 736px) and (orientation: landscape) {
	#body-wrapper {
		padding-bottom: 32px;
	}
	.pDirector .fullscreen-no-ui {
		height: 570px !important;
	}
	.nav {
		margin: 0px 0px;
		font-size: 16px;
	}
	.menu-icon {
		width: 20px;
	}
	.viewmode.grid .item .img {
		height: 200px;
    	margin-right: 20px;
	}
	.viewmode.grid .item .desc {
		font-size: 12px;
	}

	.pDirector .detail .left {
		width: 100%;
	}
	.pDirector .detail .left .info {
		padding: 0 30px;
		position: relative;
	    top: 50%;
	    margin-top: 60px;
	}
	.pDirector .detail .left .title {
		font-size: 30px;
	}
	.pDirector .detail .left .img {
		display: none;
	}
	.pDirector .detail .right {
		position: absolute;
	    width: 90%;
	    height: 50%;
	    padding-right: 0;
	    padding-top: 10px;
	    margin-left: 5%;
	}
	.pDirector .close {
		width: 25px;
		height: 25px;
	}
	footer .bar-btn.copyright {
		padding-left: 0;
	}
	footer .bar-btn.newsletter {
		padding: 4px 10px 2px 10px;
		font-size: 8px;
		bottom: 6px;
	}
}

@media screen and (max-width: 480px) {
	.menu .logo img {
		height: 20px;
	}
	#body-wrapper {
		padding-bottom: 60px;
		padding-top: 80px;
	}
	/*footer {*/
		/*position: fixed;*/
	    /*bottom: 0;*/
	    /*padding-top: 10px !important;*/
	    /*width: 100%;*/
	/*}*/
	/*footer div.float-right {*/
		/*width: 100%;*/
	    /*!* padding: 0 30px; *!*/
	    /*box-sizing: border-box;*/
	    /*padding-bottom: 20px;*/
	    /*margin-top: 0;*/
	/*}*/
	/*footer .bar-btn.copyright {*/
		/*width: 100%;*/
	    /*padding: 0;*/
	    /*text-align: center;*/
	    /*position: absolute;*/
	    /*bottom: 10px;*/
	    /*left: 0;*/
	/*}*/
	/*footer .bar-btn.newsletter {*/
		/*position: static;*/
		/*display: block;*/
	    /*padding: 7px 10px 5px 10px;*/
	    /*border: 1px solid #999;*/
	    /*width: 100%;*/
	    /*box-sizing: border-box;*/
	    /*text-align: center;*/
	    /*!* margin-bottom: 10px; *!*/
	    /*font-size: 10px;*/
	/*}*/
	.works-holder {
		overflow: hidden;
	}
	.pAbout .team {
		/* padding-bottom: 70px; */
	}
	.carousel .list {
		width: 100%;
		margin-left: 0;
	    left: 0;
	    padding: 0px 20px;
	    box-sizing: border-box;
	    font-size: 10px;
	}
	.carousel .item .desc {
		font-size: 11px;
	}
	section.page.pContact {
		/* padding-bottom: 70px; */
	}

	.pHome .showreel .overlay-panel .playBtn{
		width: 60px;
    	height: 60px;
	}
	.section-header {
		padding-bottom: 0;
	}
	.section-header h1 {
		font-size: 38px;
	}

	.only-mobile .holder {
		padding: 0 0px;
    	box-sizing: border-box;
	}
	.nav {
		font-size: 14px;
	}
	.two-cols li.item {
		width: 100%;
	}
	#canvas {
		width: 120px;
		height: 120px;
	}
	.pContact .half-left {
		height: 30%;
	}
	.pContact .half-right {
		height: 70%;
	}
	.pContact .half-left .box {
		padding: 20px 30px;
		width: 80%;
	}
	
	.pContact .half-right .box:nth-child(5), .pContact .half-right .box:nth-child(6){
		height: 30%;
	}
	.pContact .half-left .title, .pContact .half-right .box .title{
		font-size: 20px;
	}
	.pContact .box {
		font-size: 12px;
	}
	.connect .social .icon {
		margin: 0 20px;
	}
	.pAbout .about .contain {
		padding: 0 30px;
    	box-sizing: border-box;
	}
	.viewmode.grid .item {
		width: 100%;
	}
	.pDirector .detail .left {
		width: 100%;
	}
	.pDirector .detail .left .info {
		padding: 0 30px;
		position: relative;
	    top: 50%;
	    margin-top: 60px;
	}
	.pDirector .detail .left .title {
		font-size: 30px;
	}
	.pDirector .detail .left .img {
		display: none;
	}
	.pDirector .detail .right {
		position: absolute;
	    width: 90%;
	    height: 50%;
	    padding-right: 0;
	    padding-top: 10px;
	    margin-left: 5%;
	}
	.pDirector .close {
		width: 25px;
		height: 25px;
	}
	.scene.start .btn.black {
		font-size: 14px;
	}
	.scene .welcome-txt .title {
		font-size: 50px;
	}
	footer .float-right {
		float: none;
	}
	footer .credit {
		display: none;
	}
	.scene.ending .holder {
		position: relative;
	}
	.scene.ending .welcome-txt {
		position: relative;
		width: 90%;
	}
	.scene.ending .btn {
		width: 100%;
    	box-sizing: border-box;
    	font-size: 14px;
	}
	.pContact .newsletter .input input {
		width: 95%;
		border: 1px solid #999;
	}
	.pContact .newsletter .input .btn {
		right: 20px;
	}
	.pAbout .team .section-content ul li .title {
		font-size: 16px;
	}
	.pAbout .team .section-content ul li .position {
		font-size: 12px;
	}
	.scene.ending .holder {
		height: 90%;
	}
	.spliter-hor {
		margin: 10px 0;
	}
	.scene.ending .welcome-txt p {
		font-size: 13px;
		margin-bottom: 30px;
	}
	.newsletter.show-when-scroll p {
		font-size: 13px;
	}
	.btn .arrow {
		top: 8px;
    	left: 17px;
	}
	
	.btn.hasArrow {
		padding-left: 30px;
	}
	.btn {
		padding: 4px 14px;
    	padding-top: 5px;
	}
	.scene .welcome-txt .title {
		height: 50px;
		font-size: 40px;
	}
	.scene.start, .scene.ending {
		padding-left: 0px;
    	padding-right: 0px;
	}
	.scene.start .holder, .scene.ending .holder {
		border: none;
	}

	.viewmode.grid {
		height: 100%;
		overflow: auto;
		padding-left: 20px;
		padding-right: 20px;
	}
	.viewmode.grid .item {
		position: static;
		margin-bottom: 20px;
	}
	.viewmode.grid .item .img {
		height: 180px;
		margin-right: 20px;
	}
	.viewmode.grid .item .name {
		font-size: 24px;
	    line-height: 30px;
	    padding-top: 5px;
	}
	.viewmode.grid h5.desc {
		/* display: none; */
		font-size: 12px;
	}
	.viewmode.grid .btn {
		padding: 2px 15px;
	    font-size: 12px;
	}
	.viewmode.grid .contain {
		height: auto;
	}
	.viewmode.grid ul {
		height: auto;
	}
	.pDirector .section-header h1 {
		font-size: 40px;
	}
	/* .pContact .half-right .box {
		width: 100%;
	    margin-bottom: 1px;
	    height: 34%;
	}
	.pContact .half-right .box.empty {
		width: 0;
	} */
	.pContact .half-right .box {
		width: 80%;
		margin-bottom: 10px;
	    height: 30%;
	    margin-left: 10%;
	}
	.pContact .half-right .box.empty {
		width: 0;
		margin-left: 0;
	}
	.pContact .half-right .box:nth-child(5), .pContact .half-right .box:nth-child(6){
		/* height: 28%; */
	}

	.section.works .item .info .title {
		font-size: 22px;
	}
	.section.works .item .info .contain ul {
		font-size: 12px;
	}
	.section.works .item .info .contain h5 {
		font-size: 12px;
	}
	.two-cols li.item .video .info .close {
		width: 20px;
		height: 20px;
	}
}

@media screen and (max-width: 414px) {
	
	.scene.ending .welcome-txt p {
		margin-bottom: 20px;
	}
	.pAbout .team .section-content ul li {
		width: 100%;
	}
	.pAbout .team .section-content ul li .title {
		font-size: 28px;
	}
	.pAbout .team .section-content ul li .position {
		font-size: 18px;
	}
}

@media screen and (max-width: 375px) {
	.scene.ending .welcome-txt .btn {
		top: 0;
		margin-top: 10px;
	}
	.pContact .newsletter .title, .pContact .connect .title {
		font-size: 30px;
	}
	.newsletter.show-when-scroll p {
		font-size: 12px;
	}
	.pContact .half-right .box .info {
		width: 100%;
	}
	.pAbout .team .section-content ul li {
		width: 100%;
	}
	.pAbout .team .section-content ul li .title {
		font-size: 26px;
	}
	.pAbout .team .section-content ul li .position {
		font-size: 16px;
	}
}

@media screen and (max-width: 320px) {

	.nav {
		font-size: 16px;
	}
	.pContact .half-right .box p {
		font-size: 12px;
	    word-break: break-word;
	    padding: 0 7px;
	}
	
	.two-cols li.item {
		height: 180px;
	}

	.pAbout .partner .item img {
		width: 69px;
		height: 30px;
		background-color: #fff;
		border-radius: 10px;
		padding: 20px;
	}
	.pAbout .team .section-content ul li {
		width: 100%;
	}
	.pAbout .team .section-content ul li .title {
		font-size: 20px;
	}
	.pAbout .team .section-content ul li .position {
		font-size: 14px;
	}
	.scene.ending .welcome-txt .spliter-hor {
		margin: 10px 0;
	}
	.scene.ending .welcome-txt p {
		margin-bottom: 0;
	}
	.scene.ending .welcome-txt .btn .copy {
		font-size: 12px;
	}
	.pContact .half-right .box .title {
		font-size: 16px;
	}
	.pContact .half-right .box p {
		font-size: 9px;
	}
	.scene .welcome-txt {
		font-size: 10px;
	}
	.scene.start .btn.black {
		font-size: 11px;
	}
}

@media screen and (max-width: 480px) and (orientation: landscape) {
	#body-wrapper {
		padding-bottom: 32px;
	}
	/*footer {*/
	    /*position: fixed;*/
	    /*bottom: 0;*/
	    /*padding-top: 10px !important;*/
	    /*padding-bottom: 10px;*/
	    /*width: 100%;*/
	    /*box-sizing: border-box;*/
	    /*height: 32px;*/
	    /*padding-left: 20px;*/
	/*}*/
	/*footer div.float-right {*/
		/*padding-bottom: 0px;*/
		/*position: absolute;*/
	    /*top: 0;*/
	    /*left: 0;*/
	    /*height: 100%;*/
    	/*width: 100%;*/
	/*}*/
	/*footer .bar-btn.copyright {*/
		/*position: static;*/
		/*padding-left: 0;*/
		/*bottom: 0;*/
		/*text-align: left;*/
	/*}*/
	/*footer .bar-btn.newsletter {*/
		/*display: block;*/
	    /*border: 1px solid #999;*/
	    /**/
	    /*box-sizing: border-box;*/
	    /*text-align: center;*/
	    /*margin-bottom: 10px;*/
	    /*font-size: 10px;*/
	    /*position: absolute;*/
	    /*right: 20px;*/
	    /*margin-bottom: 0;*/
	    /**/
	    /*width: auto;*/
		/*padding: 4px 10px 2px 10px;*/
		/*font-size: 8px;*/
		/*bottom: 6px;*/
	/*}*/
}