@import url("w2default.css");
@import url("//hello.myfonts.net/count/39fdbb");
@font-face { font-family: 'CeraPRO-Regular'; src: url("../fonts/regular/39FDBB_9_0.eot"); src: url("../fonts/regular/39FDBB_9_0.eot?#iefix") format("embedded-opentype"), url("../fonts/regular/39FDBB_9_0.woff2") format("woff2"), url("../fonts/regular/39FDBB_9_0.woff") format("woff"), url("../fonts/regular/39FDBB_9_0.ttf") format("truetype"); }
@font-face { font-family: 'CeraPRO-Bold'; src: url("../fonts/bold/39FDBB_5_0.eot"); src: url("../fonts/bold/39FDBB_5_0.eot?#iefix") format("embedded-opentype"), url("../fonts/bold/39FDBB_5_0.woff2") format("woff2"), url("../fonts/bold/39FDBB_5_0.woff") format("woff"), url("../fonts/bold/39FDBB_5_0.ttf") format("truetype"); }
@font-face { font-family: 'CeraPRO-Black'; src: url("../fonts/black/39FDBB_3_0.eot"); src: url("../fonts/black/39FDBB_3_0.eot?#iefix") format("embedded-opentype"), url("../fonts/black/39FDBB_3_0.woff2") format("woff2"), url("../fonts/black/39FDBB_3_0.woff") format("woff"), url("../fonts/black/39FDBB_3_0.ttf") format("truetype"); }
@keyframes typing { from { width: 0; }
  to { width: 100%; } }
@keyframes blink-caret { from, to { border-color: transparent; }
  50% { border-color: orange; } }
@keyframes blinkcaret { 0% { opacity: 0; }
  49% { opacity: 0; }
  50% { opacity: 1; } }
* { color: #343434; font-family: "CeraPRO-regular", sans-serif; font-size: 20px; line-height: 30px; }

.wrapper { width: 1200px; }

h1 { position: relative; }

h1, h1 * { font-family: "CeraPRO-Black", sans-serif; font-weight: normal; }

h2 { position: relative; }

h3 { position: relative; }

h4 { position: relative; }

h4, h4 * { font-family: "CeraPRO-bold", sans-serif; }

h5, h5 * { font-family: "CeraPRO-bold", sans-serif; margin-bottom: 0 !important; }

p { line-height: 30px; }

strong { font-family: "CeraPRO-bold", sans-serif; }

.general-section { padding: 60px 0; }

.mobile { display: none; }

.btn { background-color: rgba(200, 0, 0, 0.2); display: inline-flex; align-items: center; height: 40px; font-size: 20px; line-height: 20px; white-space: nowrap; text-transform: uppercase; font-family: "CeraPRO-bold", sans-serif; transition: all 0.3s ease; }

.btn:hover { color: #2EE29C; }

.btn-link { background: none; color: #706F6F; padding: 0; }

.btn-animated { position: relative; display: inline-block; }

.btn-animated .hidden { position: absolute; visibility: hidden; }

.btn-animated .icon { background-color: #78F9C7; display: inline-flex; width: 10px; height: 4px; position: relative; bottom: -5px; opacity: 0; }

.btn-animated:hover .icon { opacity: 1; }

.btn-animated.blink .icon { animation: blinkcaret 0.5s infinite; }

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 20px; text-align: right; padding-right: 20px; }

.swiper-pagination-bullet { height: 2px; width: 30px; border-radius: 0; opacity: 1; }

.swiper-container[data-back="light"] .swiper-pagination-bullet { background: #fff; }

.swiper-container[data-back="dark"] .swiper-pagination-bullet { background: #343434; }

.swiper-container .swiper-pagination-bullet-active { background-color: #78F9C7 !important; }

.db-content h1 { position: relative; margin-bottom: 50px; }

.db-content h1, .db-content h1 * { font-size: 30px; line-height: 30px; font-weight: bold; }

.db-content h1:after { background-color: #78F9C7; content: ""; display: inline-flex; width: 20px; height: 5px; margin-left: 10px; }

.db-content ul li, .db-content ol li { padding-left: 50px; }

.db-content.columns-2 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; }

input[type="text"], input[type="password"], input[type="email"], input[type="date"], input[type="number"] { background-color: #F8F8F8; border: none; border-bottom: solid 1px #706F6F; height: 65px; }

textarea { background-color: #F8F8F8; border: none; border-bottom: solid 1px #706F6F; height: 170px; padding-top: 25px; }

input[type="submit"], input[type="button"] { background: none; width: auto; padding: 0; border-radius: 0; font-family: "CeraPRO-bold", sans-serif; text-transform: uppercase; color: #343434; transition: color 0.3s ease; }

input[type="submit"]:hover, input[type="button"]:hover { color: #2EE29C; }

video::-webkit-media-controls { display: none !important; }

.invalidfield { color: #F85754; font-size: 13px; position: absolute; bottom: -24px; }

/*##########################################
				   LOADING
############################################*/
#loading-pepper { display: flex; align-items: center; justify-content: center; }

#loading-pepper #lottie-loading { width: 70%; height: auto; }

/*##########################################
				   MOBILE
############################################*/
#mobile-menu-switch { width: 40px; height: 40px; z-index: 14; position: fixed; top: 30px; right: 30px; padding: 10px; cursor: pointer; }

#mobile-menu-switch span { background-color: #706F6F; display: block; width: 20px; height: 2px; position: relative; transition: all 0.5s ease; }

/*#mobile-menu-switch:hover span {background-color: $colorB}*/
#mobile-menu-switch span:nth-child(2) { top: 7px; }

#mobile-menu-switch span:nth-child(3) { top: 14px; }

#mobile-menu-switch.active span:nth-child(1) { top: 9px; transform: rotate(45deg); }

#mobile-menu-switch.active span:nth-child(2) { display: none; }

#mobile-menu-switch.active span:nth-child(3) { top: 7px; transform: rotate(-45deg); }

#mobile-menu { background-color: #fff; width: 100%; height: 100%; position: fixed; top: 0; left: 0; opacity: 0; z-index: 13; pointer-events: none; transition: opacity 0.3s ease; }

#mobile-menu.active { opacity: 1; pointer-events: all; }

#mobile-menu .container { height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; justify-content: center; }

#mobile-menu .container .logo { background: url("../images/header-logo.svg") no-repeat 0 0; background-size: 100%; position: absolute; width: 180px; height: 65px; top: 20px; left: 20px; }

#mobile-menu nav { display: flex; flex-direction: column; align-items: center; margin-bottom: 75px; }

#mobile-menu nav a { font-size: 20px; text-transform: uppercase; }

#mobile-menu nav a:not(:last-child) { margin-bottom: 60px; }

#mobile-menu nav a:hover { color: #2EE29C; }

#mobile-menu nav a .icon { display: none !important; }

#mobile-menu .social-container { display: flex; margin-bottom: 30px; }
#mobile-menu .social-container a { display: inline-flex; align-items: center; justify-content: center; width: auto; height: 22px; }
#mobile-menu .social-container a:before { content: ""; font-family: 'Font Awesome 5 Brands'; font-size: 20px; color: #706F6F; transition: color 0.3s ease; }
#mobile-menu .social-container a[data-icon="facebook"]:before { content: "\f39e"; }
#mobile-menu .social-container a[data-icon="instagram"]:before { content: "\f16d"; }
#mobile-menu .social-container a[data-icon="youtube"]:before { content: "\f167"; }
#mobile-menu .social-container a[data-icon="linkedin"]:before { content: "\f0e1"; }
#mobile-menu .social-container a:not(:last-child) { margin-right: 15px; }
#mobile-menu .social-container a:hover:before { color: #2EE29C; }

.languages-container { display: flex; align-items: center; height: 22px; }
.languages-container a { color: #706F6F; font-size: 12px; line-height: 12px; display: inline-flex; align-items: center; text-transform: uppercase; font-family: "CeraPRO-bold", sans-serif; transition: all 0.3s ease; }
.languages-container a:not(:last-child) { margin-right: 5px; }
.languages-container a.active, .languages-container a:hover { color: #78F9C7; }
.languages-container a.active { cursor: default; }

/*############################################*/
body { padding-top: 240px; }

header { position: fixed; top: 0; left: 0; width: 100%; height: 220px; z-index: 11; box-shadow: 0 0 10px rgba(52, 52, 52, 0); transition: all 0.3s ease; }
header .wrapper { display: flex; justify-content: space-between; /*.left img {color: $grey;font-size: 24px;line-height: 27px;width: 400px;height: 140px;transition: height 0.3s ease;}*/ }
header .wrapper .left { transition: padding 0.3s ease; }
header .wrapper #lottie-mainlogo { width: 390px; cursor: pointer; display: block; transform: translate3d(0, 0, 0); opacity: 1; }
header .wrapper #truncatedlogo { display: none; }
header .wrapper .right { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; padding-top: 40px; width: 50%; }
header .wrapper .right nav { display: flex; align-items: center; height: 22px; }
header .wrapper .right nav a { display: inline-flex; align-items: flex-end; transition: color 0.3s ease; position: relative; }
header .wrapper .right nav a .text { color: #706F6F; font-size: 14px; line-height: 14px; white-space: nowrap; text-transform: uppercase; font-family: "CeraPRO-regular", sans-serif; }
header .wrapper .right nav a .text.hidden { position: absolute; visibility: hidden; }
header .wrapper .right nav a .icon { background-color: #78F9C7; display: inline-flex; width: 7px; height: 3px; margin-left: 0px; position: relative; bottom: -3px; opacity: 0; }
header .wrapper .right nav a.active .text { font-family: "CeraPRO-bold", sans-serif; }
header .wrapper .right nav a.active .icon { opacity: 1; }
header .wrapper .right nav a:not(:last-child) { margin-right: 15px; }
header .wrapper .right nav a.active { font-family: "CeraPRO-bold", sans-serif; }
header .wrapper .right nav a:hover .text { font-family: "CeraPRO-bold", sans-serif; }
header .wrapper .right nav a:hover .icon { opacity: 1; }
header .wrapper .right .innerright { display: flex; }
header .wrapper .right .innerright .social-container { display: flex; margin-left: 20px; }
header .wrapper .right .innerright .social-container a { display: inline-flex; align-items: center; justify-content: center; width: auto; height: 22px; }
header .wrapper .right .innerright .social-container a:before { content: ""; font-family: 'Font Awesome 5 Brands'; font-size: 16px; color: #706F6F; transition: color 0.3s ease; }
header .wrapper .right .innerright .social-container a[data-icon="facebook"]:before { content: "\f39e"; }
header .wrapper .right .innerright .social-container a[data-icon="instagram"]:before { content: "\f16d"; }
header .wrapper .right .innerright .social-container a[data-icon="youtube"]:before { content: "\f167"; }
header .wrapper .right .innerright .social-container a[data-icon="linkedin"]:before { content: "\f0e1"; }
header .wrapper .right .innerright .social-container a:not(:last-child) { margin-right: 10px; }
header .wrapper .right .innerright .social-container a:hover:before { color: #2EE29C; }
header .wrapper .right .innerright .languages-container { display: flex; align-items: center; height: 22px; margin-left: 20px; }
header .wrapper .right .innerright .languages-container a { color: #706F6F; font-size: 12px; line-height: 12px; display: inline-flex; align-items: center; text-transform: uppercase; font-family: "CeraPRO-bold", sans-serif; transition: all 0.3s ease; }
header .wrapper .right .innerright .languages-container a:not(:last-child) { margin-right: 5px; }
header .wrapper .right .innerright .languages-container a.active, header .wrapper .right .innerright .languages-container a:hover { color: #78F9C7; }
header .wrapper .right .innerright .languages-container a.active { cursor: default; }

#headersec { position: relative; margin-bottom: 50px; z-index: 12; pointer-events: none; transition: opacity 0.3s ease; }
#headersec .wrapper { margin-top: -100px; display: flex; justify-content: flex-end; }
#headersec .wrapper #header-slogan { margin-right: 0; width: 50%; }
#headersec .wrapper #header-slogan * { font-family: "CeraPRO-bold", sans-serif; }
#headersec .wrapper #header-slogan .title { font-size: 23px; }
#headersec .wrapper #header-slogan .subtitle { font-weight: normal; font-family: "CeraPRO-regular", sans-serif; }
#headersec .wrapper #header-cats { width: 50%; display: flex; flex-wrap: wrap; justify-content: flex-start; pointer-events: all; }
#headersec .wrapper #header-cats a { display: inline-flex; align-items: flex-end; white-space: nowrap; margin: 0 5px 2px 0; position: relative; font-size: 14px; line-height: 17px; font-family: "CeraPRO-regular", sans-serif; color: #706F6F; border-bottom: solid 2px transparent; padding-bottom: 3px; transition: color 0.3s ease; }
#headersec .wrapper #header-cats a:after { background-color: #78F9C7; content: ""; display: inline-flex; width: 7px; height: 3px; margin-left: 0px; position: relative; bottom: -2px; opacity: 0; transition: opacity 0.3s ease; }
#headersec .wrapper #header-cats a.active { font-family: "CeraPRO-bold", sans-serif; }
#headersec .wrapper #header-cats a.active:after, #headersec .wrapper #header-cats a.active:hover:after { opacity: 0 !important; }
#headersec .wrapper #header-cats a:hover { font-family: "CeraPRO-bold", sans-serif; }
#headersec .wrapper #header-cats a:hover:after { opacity: 1; }
#headersec .wrapper #header-selcats { background-color: rgba(200, 0, 0, 0.2); width: 50%; justify-content: flex-end; pointer-events: all; }
#headersec .wrapper #header-selcats select { border: none; border-bottom: solid 1px #706F6F; padding-left: 0; }

body.truncated header { background-color: #fff; position: fixed; height: 100px; box-shadow: 0 0 10px rgba(52, 52, 52, 0.5); }

body.truncated header .left #lottie-mainlogo { display: none; }

body.truncated header .left #truncatedlogo { display: block; width: 279px; position: relative; cursor: pointer; overflow: hidden; }

/*body.truncated header .left #truncatedlogo #lottie-truncatedlogo-on {position: relative;  opacity: 1; transition-delay: 3s; transition: opacity 0.3s ease; z-index: 1}*/
body.truncated header .left #truncatedlogo #lottie-truncatedlogo-off { position: absolute; top: 0; left: 0; opacity: 0; transition-delay: 3s; transition: opacity 0.3s ease; display: none; }

/*body.truncated header .left #truncatedlogo:hover #lottie-truncatedlogo-off {opacity: 1;  transition-delay: 3s; z-index: body.truncated header .left #truncatedlogo:hover #lottie-truncatedlogo-on {opacity: 0; transition-delay: 3s;z-index: 0} */
/*body.truncated header .left img {width: auto;height: 60px; display: none}*/
body.truncated header .left a { height: 70px; width: 210px; display: block; }

body.truncated header .left a:before { background: url("../images/header-logo-truncated.svg") no-repeat 0 0; content: ""; background-size: 100%; display: block; width: 100%; height: 100%; }

body.truncated #headersec { opacity: 0; }

header .left .mobile, body.truncated header .left .mobile { display: none; }

footer { /*h4:after {background-color: $colorA; content: "";display: inline-flex;width: 17px;height: 5px;margin-left: 5px; position: relative; top: 5px;}*/ }
footer h4 { font-size: 40px; line-height: 43px; margin-bottom: 30px; }
footer .top:before { background-color: #78F9C7; content: ""; display: inline-flex; width: 29px; height: 10px; position: relative; position: absolute; top: 0; left: 0; }
footer .top { display: flex; justify-content: space-between; margin-bottom: 90px; position: relative; padding-top: 30px; }
footer .top * { font-size: 16px; line-height: 19px; color: #706F6F; }
footer .top .left { width: 50%;             /*.box:before {background: url("../images/icons-01.svg") no-repeat 0 0; background-size:520px; content: "";display: block;width: 26px;height: 26px;position: absolute;top: 0;left: 0;}
			.box[data-icon="address"]:before {background-position: 0 0;} 
			.box[data-icon="phone"]:before {background-position: -26px 0;}
			.box[data-icon="email"]:before {background-position: -52px 0;}*/ }
footer .top .left .box { width: 50%; position: relative; float: left; padding-right: 20px; }
footer .top .left .box .item { padding-top: 3px; }
footer .top .left .box .item:not(:last-child) { margin-bottom: 10px; }
footer .top .left .box .item a { display: block; white-space: nowrap; transition: color 0.3s ease; }
footer .top .left .box .item a:hover { font-family: "CeraPRO-bold", sans-serif; }
footer .top .right { display: flex; justify-content: flex-end; width: 40%; }
footer .top .right a { display: inline-flex; align-items: flex-end; }
footer .top .right a .text { font-family: "CeraPRO-bold", sans-serif; }
footer .top .right a:not(:last-child) .icon { background-color: #78F9C7; width: 10px; height: 3px; }
footer .top .right a:hover .text { color: #78F9C7; }
footer .bot { display: flex; align-items: flex-start; }
footer .bot * { font-size: 13px; line-height: 16px; color: #706F6F; white-space: nowrap; }
footer .bot .left { display: flex; margin-right: 40px; }
footer .bot .left a { color: #706F6F; display: inline-flex; height: 24px; white-space: nowrap; border-bottom: solid 1px transparent; transition: color 0.3s ease; }
footer .bot .left a:not(:last-child) { margin-right: 20px; }
footer .bot .left a:hover { font-family: "CeraPRO-bold", sans-serif; }
footer .bot .left a.active { font-family: "CeraPRO-bold", sans-serif; }

#homebanner { width: 100%; height: auto; }
#homebanner .wrapper { width: 100%; }
#homebanner .swiper-container { height: auto; /*.swiper-slide[data-type="video"] a:before {content: "play_"; font-family: $fontC; font-size:60px !important; color: $colorA !important; position: absolute;top: 0; left: 0; display: flex; justify-content: center; align-items: center;height: 100%; width: 100%; color: $black; font-size: 17px;z-index: 2}*/ }
#homebanner .swiper-container .swiper-slide { background-color: #343434; /*.mask {background-color: rgba($black,0.2);background: linear-gradient(38deg, rgba(238,238,238,1) 3%, rgba(238,238,238,0) 100%);position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}*/ /*a {display: flex;align-items: flex-end;width: 100%;height: auto; padding-bottom: 56.25%; position: relative;z-index: 2;}*/ }
#homebanner .swiper-container .swiper-slide .wrapper { height: auto; }
#homebanner .swiper-container .swiper-slide a { display: flex; align-items: flex-end; width: 100%; height: 0; padding-bottom: 56.25%; position: relative; z-index: 2; }
#homebanner .swiper-container .swiper-slide a[href="javascript:void(0);"] { pointer-events: none; cursor: default; }
#homebanner .swiper-container .swiper-slide .info { display: block; position: absolute; left: 30px; top: 30px; z-index: 2; }
#homebanner .swiper-container .swiper-slide .info * { font-size: 23px; line-height: 26px; }
#homebanner .swiper-container .swiper-slide .title { font-family: "CeraPRO-bold", sans-serif; margin-bottom: 0; display: block; }
#homebanner .swiper-container .swiper-slide .subtitle { display: block; }
#homebanner .swiper-container .swiper-slide[data-type="video"] .btn-animated { padding: 25.125% 0 31.125% 0; height: 0; width: 100%; display: block; text-align: center; position: absolute; top: 0; left: 0; z-index: 2; }
#homebanner .swiper-container .swiper-slide[data-type="video"] .btn-animated .text { color: #fff; font-size: 60px; color: #78F9C7; font-family: "CeraPRO-Black", sans-serif; }
#homebanner .swiper-container .swiper-slide[data-type="video"] .btn-animated .icon { width: 26px; height: 8px; }
#homebanner .swiper-container .swiper-slide[data-type="video"] a:after { content: ""; background-color: #000; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.35; z-index: 1; pointer-events: none; }
#homebanner .swiper-container .w2-arrows { position: absolute !important; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; position: relative; opacity: 0; transition: opacity 0.5s ease; pointer-events: none; }
#homebanner .swiper-container .w2-arrows div { pointer-events: auto; }
#homebanner .swiper-container:hover .w2-arrows { opacity: 1; }
#homebanner .swiper-container[data-back="light"] .info .title, #homebanner .swiper-container[data-back="light"] .info .subtitle { color: #fff; }
#homebanner .swiper-container[data-back="dark"] .title, #homebanner .swiper-container[data-back="dark"] .subtitle { color: #343434; }
#homebanner .swiper-container .w2-arrows .swiper-button-next, #homebanner .swiper-container .w2-arrows .swiper-button-prev { background: url("../images/icons-01.svg") no-repeat 0 0; background-size: 1000px; width: 50px; height: 50px; }
#homebanner .swiper-container[data-back="light"] .w2-arrows .swiper-button-next { background-position: -200px -50px; }
#homebanner .swiper-container[data-back="dark"] .w2-arrows .swiper-button-next { background-position: -200px 0px; }
#homebanner .swiper-container .w2-arrows .swiper-button-next:hover { background-position: -200px -200px; }
#homebanner .swiper-container[data-back="light"] .w2-arrows .swiper-button-prev { background-position: -250px -50px; }
#homebanner .swiper-container[data-back="dark"] .w2-arrows .swiper-button-prev { background-position: -250px 0px; }
#homebanner .swiper-container .w2-arrows .swiper-button-prev:hover { background-position: -250px -200px; }
#homebanner .swiper-container .w2-arrows .swiper-button-next.swiper-button-disabled, #homebanner .swiper-container .w2-arrows .swiper-button-prev.swiper-button-disabled { pointer-events: none !important; }

#home-about .wrapper { display: flex; }
#home-about .wrapper .left { width: 50%; padding-right: 12px; }
#home-about .wrapper .left h1 { color: #706F6F; font-size: 30px; line-height: 38px; font-family: "CeraPRO-bold", sans-serif; position: relative; }
#home-about .wrapper .left h1:after { content: ""; display: inline-flex; width: 14px; height: 5px; margin-left: 5px; background-color: #78F9C7; position: relative; top: 8px; }
#home-about .wrapper .right { width: 50%; }
#home-about .wrapper .right .description, #home-about .wrapper .right .description * { font-size: 16px; line-height: 25px; }
#home-about .wrapper .right .box-knowmore { padding-top: 40px; }
#home-about .wrapper .right .box-knowmore .text { text-transform: uppercase; font-family: "CeraPRO-bold", sans-serif; color: #706F6F; }

#home-projects { padding-bottom: 160px; }

.grid-a { display: grid; grid-gap: 25px; /*grid-template-columns: repeat(4, 1fr)*/ grid-template-columns: repeat(4, 1fr); }
.grid-a .grid-item { min-width: 0; }
.grid-a .grid-item .grid-item-content .media { height: 0; margin-bottom: 10px; position: relative; cursor: pointer; }
.grid-a .grid-item .grid-item-content[data-type="video"] .media { padding-bottom: 72.535%; }
.grid-a .grid-item .grid-item-content[data-type="video"] .media .video-wrapper { position: relative; width: 100%; height: 0; padding-bottom: 72.535%; }
.grid-a .grid-item .grid-item-content[data-type="video"] .media video { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; }
.grid-a .grid-item .grid-item-content[data-type="gif"] .media { height: 0; padding-bottom: 72.535%; }
.grid-a .grid-item .grid-item-content[data-type="gif"] .media .image { width: 100%; height: 0; padding-bottom: 72.535%; position: absolute; top: 0; left: 0; }
.grid-a .grid-item .grid-item-content[data-type="images"] .media { height: 0; padding-bottom: 72.535%; /*.image:before {background-color:rgba($colorB,0); content: "+"; opacity: 0; box-sizing: border-box; display: flex; justify-content: flex-end; align-items: flex-end; width: 100%; height: 100%; padding: 20px;  color: #fff; font-size: 40px; position: absolute; top: 0; left: 0; transition: background-color 0.3s ease , opacity 0.3s ease; }*/ }
.grid-a .grid-item .grid-item-content[data-type="images"] .media .image { width: 100%; height: 0; padding-bottom: 72.535%; position: absolute; top: 0; left: 0; }
.grid-a .grid-item a { display: flex; flex-direction: column; height: 100%; }
.grid-a .grid-item .title { font-size: 18px; line-height: 21px; font-family: "CeraPRO-bold", sans-serif; display: block; margin-bottom: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.grid-a .grid-item .subtitle { color: #706F6F; font-size: 14px; line-height: 17px; white-space: nowrap; display: block; height: 17px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.grid-a .grid-item.bigger { grid-column: span 2; grid-row: span 2; }
.grid-a .grid-item.bigger .grid-item-content .media { height: 0; padding-bottom: 81.873%; margin-bottom: 10px; display: block; }
.grid-a .grid-item.bigger .grid-item-content .media .image { height: 0; padding-bottom: 81.873%; }

.grid-b { display: grid; grid-gap: 24px; grid-template-columns: repeat(3, 1fr); }
.grid-b .grid-item { min-width: 0; }
.grid-b .grid-item .grid-item-content .media { background-color: #fff; height: 250px; margin-bottom: 5px; position: relative; cursor: pointer; }
.grid-b .grid-item .grid-item-content[data-type="video"] .media { height: 0; padding-bottom: 70%; }
.grid-b .grid-item .grid-item-content[data-type="video"] .media video { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; }
.grid-b .grid-item .grid-item-content[data-type="gif"] .media { height: 0; padding-bottom: 70%; }
.grid-b .grid-item .grid-item-content[data-type="gif"] .media .image { width: 100%; height: 0; padding-bottom: 70%; position: absolute; top: 0; left: 0; }
.grid-b .grid-item .grid-item-content[data-type="images"] .media { height: 0; padding-bottom: 70%; /*.image:before {background-color:rgba($colorB,0); content: "+"; opacity: 0; box-sizing: border-box; display: flex; justify-content: flex-end; align-items: flex-end; width: 100%; height: 100%; padding: 20px;  color: #fff; font-size: 40px; position: absolute; top: 0; left: 0; transition: background-color 0.3s ease , opacity 0.3s ease; }*/ }
.grid-b .grid-item .grid-item-content[data-type="images"] .media .image { background-color: #78F9C7; width: 100%; height: 0; padding-bottom: 70%; position: absolute; top: 0; left: 0; }
.grid-b .grid-item a { display: block; width: 100%; }
.grid-b .grid-item .info { display: block; width: 100%; }
.grid-b .grid-item .title { display: block; font-family: "CeraPRO-bold", sans-serif; font-size: 18px; line-height: 21px; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.grid-b .grid-item .subtitle { color: #706F6F; font-size: 14px; line-height: 17px; white-space: nowrap; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.grid-b .grid-item:hover { /*a .title {color: $colorB;}*/ /*a .image:before{background-color:rgba($colorB,0.5); opacity: 1;}*/ }

.grid-c { display: grid; grid-gap: 24px; grid-template-columns: repeat(3, 1fr); }
.grid-c .grid-item { display: block; height: auto; overflow: hidden; position: relative; }
.grid-c .grid-item .image { background-color: #343434; display: block; height: auto; padding-bottom: 100%; z-index: 1; }
.grid-c .grid-item .info { background-color: #78F9C7; position: absolute; top: 100%; left: 0; width: 100%; height: 100%; z-index: 2; padding: 30px; transition: top 0.5s ease; }
.grid-c .grid-item .info * { font-size: 30px; line-height: 33px; }
.grid-c .grid-item .info .title { font-family: "CeraPRO-bold", sans-serif; display: block; }
.grid-c .grid-item .info .subtitle { font-size: 20px; line-height: 23px; display: block; padding-top: 5px; }
.grid-c .grid-item .info .description { position: relative; display: block; padding-top: 10px; }
.grid-c .grid-item .info .description:before { content: "_"; }
.grid-c .grid-item:hover .info { top: 0; }

.grid-d { display: grid; grid-gap: 24px; grid-template-columns: repeat(6, 1fr); }
.grid-d .grid-item { display: block; overflow: hidden; position: relative; padding: 30px; }
.grid-d .grid-item .image { display: block; }
.grid-d .grid-item img { width: 100%; }

#clients-top { padding-bottom: 60px; }
#clients-top .wrapper { display: flex; }
#clients-top .wrapper .left { width: 50%; padding-right: 12px; }
#clients-top .wrapper .left h1 { color: #706F6F; font-size: 40px; line-height: 49px; font-family: "CeraPRO-Black", sans-serif; position: relative; font-weight: normal; }
#clients-top .wrapper .left h1:after { content: ""; display: inline-flex; width: 19px; height: 7px; margin-left: 5px; background-color: #78F9C7; position: relative; top: 5px; }
#clients-top .wrapper .right { width: 50%; padding-left: 12px; }
#clients-top .wrapper .right * { font-size: 20px; line-height: 30px; }

/*##############################################
				ABOUT US
###################################################*/
#about-container { padding-bottom: 160px; padding-top: 0; }
#about-container h1 { color: #706F6F; font-size: 40px; line-height: 49px; margin-bottom: 50px; position: relative; }
#about-container h1:after { background-color: #78F9C7; content: ""; display: inline-block; height: 7px; width: 19px; margin: 0 0 -5px 5px; }

.about-banner { background-color: #706F6F; width: 100%; height: auto; margin-bottom: 80px; }

.about-banner a { display: flex; width: 100%; height: 0 !important; min-width: 0 !important; padding-bottom: 56.25%; position: relative; z-index: 2; }

.about-banner[data-type="video"] a:after { content: ""; background-color: #000; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.35; z-index: -1; }

.about-banner[data-type="video"] .btn-animated { padding: 25.125% 0 31.125% 0; height: 0; width: 100%; display: block; text-align: center; }

.about-banner[data-type="video"] .btn-animated .text { color: #fff; font-size: 60px; color: #78F9C7; font-family: "CeraPRO-Black", sans-serif; }

.about-banner[data-type="video"] .btn-animated .icon { width: 26px; height: 8px; }

.about-banner[data-type="image"] { pointer-events: none; }

.about-banner .box-video { position: relative; padding-bottom: 56.25%; height: 0; width: 100%; display: block; }

.about-banner .box-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

#about-container .presentation { margin-bottom: 80px; }

#about-container .presentation .description-contents { display: flex; }
#about-container .presentation .description-contents .description { width: 50%; }
#about-container .presentation .description-contents .description:nth-child(1) { padding-right: 20px; margin-bottom: 20px; }
#about-container .presentation .description-contents .description:nth-child(2) { padding-left: 20px; }

#about-container .presentation .db-content, #about-container .presentation .db-content * { font-size: 19px; line-height: 23px; }

#about-container .grid-c .grid-item .info { display: flex; flex-direction: column; justify-content: center; }

#about-container .grid-c .grid-item .info .title { font-family: "CeraPRO-Black", sans-serif; }

#about-container .grid-c .grid-item .info .description { max-height: 58%; overflow: hidden; font-family: "CeraPRO-bold", sans-serif; font-size: 22px; line-height: 25px; }

/*##############################################
					404
###################################################*/
.c404 { background-color: #706F6F; }

.c404, .c404 * { color: #fff; }

.c404 body { padding: 50px; }

.c404 header { position: relative; }

.c404 header a img { width: 405px; }

.c404 h1 { font-size: 50px; line-height: 60px; margin-bottom: 110px; position: relative; }

.c404 h1 * { font-size: 50px; line-height: 60px; }

/*.c404 h1:after {content: ""; background-color: $colorA; width: 19px; height: 7px; display: inline-block; position: absolute; bottom: 0px;}*/
.c404 .description { font-size: 20px; line-height: 30px; color: #706F6F; margin-bottom: 50px; }

.c404 .box-back a { text-transform: uppercase; font-family: "CeraPRO-bold", sans-serif; }

.c404 a:hover { color: #78F9C7; }

.c404 footer { position: absolute; bottom: 50px; font-size: 13px; color: #706F6F; }

.c404 footer * { font-size: 13px; color: #78F9C7; }

/*##############################################
					403
###################################################*/
.c403 { background-color: #343434; }

.c403, .c403 * { color: #fff; }

.c403 body { padding: 50px; }

.c403 header { position: relative; }

.c403 header a img { width: 405px; }

.c403 h1 { font-size: 50px; line-height: 60px; margin-bottom: 110px; position: relative; }

.c403 h1:after { content: ""; background-color: #78F9C7; width: 19px; height: 7px; display: inline-block; position: absolute; bottom: 0px; }

.c403 .description { font-size: 20px; line-height: 30px; color: #706F6F; margin-bottom: 50px; }

.c403 .box-back a { text-transform: uppercase; font-family: "CeraPRO-bold", sans-serif; }

.c403 .box-back a:hover { color: #2EE29C; }

.c403 footer { position: absolute; bottom: 50px; font-size: 13px; color: #706F6F; }

.c403 footer * { font-size: 13px; color: #706F6F; }

/*##############################################
					PROJETOS
###################################################*/
.projects #header-slogan .title:after { background-color: #343434; content: ""; width: 15px; height: 4px; display: block; margin-left: -7px; margin-top: 5px; }

.projects header .right .title { color: #343434; font-size: 26px; line-height: 30px; position: relative; }

.projects header .right .title:after { background-color: #343434; content: ""; position: absolute; display: block; height: 4px; width: 15px; bottom: -7px; left: -7px; }

.projects header .right .subtitle { color: #706F6F; font-size: 16px; }

#projects-container { padding-bottom: 160px; padding-top: 0; }

.project-banner { background-color: #706F6F; width: 100%; height: auto; margin-bottom: 80px; }

.project-banner a { display: flex; width: 100%; height: 0 !important; min-width: 0 !important; padding-bottom: 56.25%; position: relative; z-index: 2; }

/*.project-banner[data-type="video"] a:before {content: "play_"; font-size:60px !important; color: $colorA !important; position: absolute;display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; top:0; left: 0; color: $black; font-family: $fontC; font-size: 17px;z-index: 2}*/
.project-banner[data-type="video"] { position: relative; padding-bottom: 56.25%; height: 0; width: 100%; display: block; }

.project-banner[data-type="video"] .box-video { position: relative; padding-bottom: 56.25%; height: 0; width: 100%; display: block; }

.project-banner[data-type="video"] iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

.project-banner[data-type="video"] .btn-animated { padding: 25.125% 0 31.125% 0; height: 0; width: 100%; display: block; text-align: center; }

.project-banner[data-type="video"] .btn-animated .text { color: #fff; font-size: 60px; color: #78F9C7; font-family: "CeraPRO-Black", sans-serif; }

.project-banner[data-type="video"] .btn-animated .icon { width: 26px; height: 8px; }

.project-banner[data-type="video"] a:hover:before { color: #fff !important; }

.project-banner[data-type="video"] a:after { content: ""; background-color: #000; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.35; z-index: -1; }

.project-banner[data-type="image"] a { pointer-events: none; }

#projects-detail { padding-bottom: 160px; }

#projects-detail .item { display: flex; flex-direction: column; }
#projects-detail .item .text-image-container { display: flex; margin-bottom: 20px; }
#projects-detail .item .text-image-container .left-text { width: 50%; padding-right: 10px; }
#projects-detail .item .text-image-container .left-image { width: 50%; padding-right: 10px; }
#projects-detail .item .text-image-container .right-text { width: 50%; padding-left: 17px; }
#projects-detail .item .text-image-container .right-image { width: 50%; padding-left: 10px; }
#projects-detail .item .text-image-container .left-image img, #projects-detail .item .text-image-container .right-image img { width: 100%; }
#projects-detail .item .text-image-container .db-content h2, #projects-detail .item .text-image-container .db-content h2 * { font-size: 36px; line-height: 40px; font-family: "CeraPRO-bold", sans-serif; }
#projects-detail .item .text-image-container .db-content h3 { font-size: 36px; line-height: 40px; font-family: "CeraPRO-bold", sans-serif; padding: 0; color: #343434; position: relative; }
#projects-detail .item .text-image-container h3:before { background-color: #343434; content: ""; width: 15px; height: 4px; display: block; margin-left: -7px; position: absolute; top: -15px; }
#projects-detail .item .text-image-container h4 { margin-bottom: 6px; color: #343434 !important; }
#projects-detail .item .text-image-container h4:after { background-color: #343434; content: ""; width: 15px; height: 4px; display: block; margin-left: -7px; margin-top: 5px; }
#projects-detail .item .text-image-container .db-content * { line-height: 29px; color: #343434; }

#projects-detail .grid-item { margin-bottom: 20px; }

#projects-detail .project-grid .grid-item { /*a.btn-video:before, a.btn-sound:before{content: "play_"; font-size:60px !important; color: $colorA !important; position: absolute;display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; top: 0; left: 0; color: $black; font-family: $fontC; font-size: 17px;z-index: 2}*/ }
#projects-detail .project-grid .grid-item .btn-sound, #projects-detail .project-grid .grid-item .btn-video { padding: 24.125% 0 31.125% 0; height: 0 !important; min-width: 0 !important; width: 100%; display: block; text-align: center; position: relative; }
#projects-detail .project-grid .grid-item .btn-sound .text, #projects-detail .project-grid .grid-item .btn-video .text { color: #fff; font-size: 60px; color: #78F9C7; font-family: "CeraPRO-Black", sans-serif; position: relative; z-index: 1; }
#projects-detail .project-grid .grid-item .btn-sound .text.hidden, #projects-detail .project-grid .grid-item .btn-video .text.hidden { position: absolute; }
#projects-detail .project-grid .grid-item .btn-sound .icon, #projects-detail .project-grid .grid-item .btn-video .icon { width: 26px; height: 8px; position: relative; z-index: 1; }
#projects-detail .project-grid .grid-item .btn-sound:after, #projects-detail .project-grid .grid-item .btn-video:after { content: ""; background-color: #000; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.35; z-index: 0; }
#projects-detail .project-grid .grid-item .box-video { position: relative; /*padding-bottom: 56.25%;height: 0;*/ width: 100%; display: block; }
#projects-detail .project-grid .grid-item .box-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#projects-detail .project-grid .grid-item .box-sound { position: relative; padding-bottom: 56.25%; height: 0; width: 100%; display: block; }
#projects-detail .project-grid .grid-item .box-sound iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#projects-detail .project-grid .grid-item .btn-sound:after, #projects-detail .project-grid .grid-item .btn-sound .text, #projects-detail .project-grid .grid-item .btn-sound .text.hidden { display: none !important; }

#projects-detail .project-grid.grid1 { display: block; }

#projects-detail .project-grid.grid1nogap .grid-item { margin-bottom: 0; }

#projects-detail .project-grid.grid2 { display: flex; flex-wrap: wrap; }

#projects-detail .project-grid.grid2 .grid-item { width: calc(50% - 20px); margin-right: 20px; flex-grow: 1; }

#projects-detail .project-grid.grid2 .grid-item:nth-child(2n+2) { margin-right: 0; }

#projects-detail .project-grid.grid3 { display: flex; flex-wrap: wrap; }

#projects-detail .project-grid.grid3 .grid-item { width: calc(33.3% - 20px); margin-right: 20px; flex-grow: 1; }

#projects-detail .project-grid.grid3 .grid-item:nth-child(3n+3) { margin-right: 0; }

#projects-detail .project-grid.grid4 { display: flex; flex-wrap: wrap; }

#projects-detail .project-grid.grid4 .grid-item { width: calc(25% - 20px); margin-right: 20px; flex-grow: 1; }

#projects-detail .project-grid.grid4 .grid-item:nth-child(4n+4) { margin-right: 0; }

#projects-detail .project-grid .grid-item:last-child { margin-right: 0; }

#projects-detail .project-grid img { width: 100%; }

#projects-detail .description, #projects-detail .description * { font-size: 24px; line-height: 34px; }

#projects-detail .description { position: relative; }

#projects-detail .description:before { background-color: #343434; content: ""; margin-left: -7px; width: 15px; height: 4px; display: block; }

#projects-detail .description h2 { font-size: 40px; line-height: 50px; color: #706F6F; margin-bottom: 0; }

#projects-detail .description h3 { font-size: 35px; line-height: 45px; margin-bottom: 0; }

#projects-detail .description a { color: #2EE29C; }

#projects-detail .opttext_left { padding: 80px 50% 80px 0; }

#projects-detail .opttext_right { padding: 80px 0 80px 50%; }

#projects-detail .opttext_cols_2 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; padding: 80px 120px; }

#projects-detail .blocks-container { margin-bottom: 130px; }

#projects-detail #project-bot .box-categories { display: flex; flex-wrap: wrap; justify-content: center; margin-bottom: 50px; padding: 0 40px; }

#projects-detail #project-bot .box-categories a { margin: 10px 20px; }

#projects-detail #project-bot .box-categories a .text { font-size: 23px; font-family: "CeraPRO-regular", sans-serif; }

#projects-detail #project-bot .box-categories a .icon:before { content: "< "; font-family: "CeraPRO-bold", sans-serif; color: #78F9C7; }

#projects-detail #project-bot .box-categories a:hover .text { font-family: "CeraPRO-bold", sans-serif; }

#projects-detail #project-bot .box-back { text-align: center; }

#projects-detail #project-bot .box-back a { display: inline-flex; color: #706F6F; justify-content: center; align-items: center; font-family: "CeraPRO-regular", sans-serif; text-transform: uppercase; transition: all 0.3s ease; }

#projects-detail #project-bot .box-back a:before { content: "<"; color: #2EE29C; margin-right: 5px; }

#projects-detail #project-bot .box-back a:hover { font-family: "CeraPRO-bold", sans-serif; }

/*##############################################
					CLIENTES
###################################################*/
#clients-container { padding-bottom: 160px; }

/*##############################################
					CONTACTOS
###################################################*/
#contacts-container { padding-bottom: 160px; }

#contacts-container .wrapper { display: flex; }

#contacts-container .wrapper .left { width: 33.3%; padding-right: 50px; }

#contacts-container .wrapper .left .item { margin-bottom: 40px; position: relative; padding-left: 35px; }

#contacts-container .wrapper .left .item:before { background: url("../images/icons-01.svg") no-repeat 0 0; background-size: 400px; content: ""; position: absolute; top: 5px; left: 0; width: 20px; height: 20px; display: block; }

#contacts-container .wrapper .left .item[data-icon="address"] a { display: inline-flex; margin-top: 10px; align-items: center; }

#contacts-container .wrapper .left .item[data-icon="address"] a .text { font-size: 18px; color: #706F6F; transition: color 0.3s ease; }

#contacts-container .wrapper .left .item[data-icon="address"] a .icon { background: url("../images/icons-01.svg") no-repeat -36px -24px; background-size: 240px; width: 12px; height: 12px; margin-left: 15px; }

#contacts-container .wrapper .left .item[data-icon="address"] a:hover .text { color: #2EE29C; }

#contacts-container .wrapper .left .item[data-icon="address"] a:hover .icon { background-position: -36px -48px; }

#contacts-container .wrapper .left .item[data-icon="phone"]:before { background-position: -20px 0; }

#contacts-container .wrapper .left .item[data-icon="email"]:before { background-position: -40px 0; }

#contacts-container .wrapper .left .description * { font-family: "CeraPRO-bold", sans-serif; font-size: 24px; line-height: 33px; color: #706F6F; }

#contacts-container .wrapper .left .description a { transition: color 0.3s ease; }

#contacts-container .wrapper .left .description a:hover { color: #78F9C7; text-decoration: none; }

#contacts-container .wrapper .right { width: 66.6%; }

#contacts-container .wrapper .right .description, #contacts-container .wrapper .right .description * { font-size: 20px; line-height: 30px; }

#contacts-container .wrapper .right .description { margin-bottom: 60px; }

#contacts-container .wrapper .right form .contents { display: flex; flex-wrap: wrap; padding-top: 10px; }

#contacts-container .wrapper .right form .box { margin-bottom: 40px; position: relative; }

#contacts-container .wrapper .right form .box .label { font-size: 12px; line-height: 12px; opacity: 1; transition: opacity 0.3s ease; }

#contacts-container .wrapper .right form .box-firstname, #contacts-container .wrapper .right form .box-email { width: calc(50% - 10px); margin-right: 10px; }

#contacts-container .wrapper .right form .box-lastname, #contacts-container .wrapper .right form .box-phone { width: calc(50% - 10px); margin-left: 10px; }

#contacts-container .wrapper .right form .box-company, #contacts-container .wrapper .right form .box-message { width: 100%; }

#contacts-container .wrapper .right form .box-submit { margin-bottom: 0; }

#contacts-container .wrapper .right form .box-submit input { display: none; }

#contacts-container .wrapper .right form .box-submit a .text { font-family: "CeraPRO-bold", sans-serif; text-transform: uppercase; color: #706F6F; }

#contacts-container .wrapper .right form .box.error input, #contacts-container .wrapper .right form .box.error textarea { border-bottom-color: #F85754; }

#contacts-container .wrapper .right form .invalidfield { opacity: 0; transition: opacity 0.3s ease; }

#contacts-container .wrapper .right form .box.error .invalidfield { opacity: 1; }

#contacts-container .wrapper .right form .box.valid input, #contacts-container .wrapper .right form .box.valid textarea { border-bottom-color: #78F9C7; }

/*##############################################
		          GENERAL PAGE
###################################################*/
#general-page h1 { font-size: 40px; line-height: 49px; margin-bottom: 130px; position: relative; }

#general-page h1:after { background-color: #78F9C7; content: ""; display: inline-flex; width: 19px; height: 7px; margin-left: 5px; position: relative; bottom: -9px; }

#general-page .db-content, #general-page .db-content * { font-size: 16px; line-height: 26px; }

#general-page .db-content p { margin-bottom: 35px; }

#general-page .db-content h4 { padding-top: 0; }

body.spechighlight { padding-top: 100px; }
body.spechighlight header { background-color: #fff; position: fixed; height: 100px; box-shadow: 0 0 10px rgba(52, 52, 52, 0.5); }
body.spechighlight header .wrapper { padding: 0 50px; }
body.spechighlight header .right { display: none !important; }
body.spechighlight header .left #lottie-mainlogo { display: none; }
body.spechighlight header .left #truncatedlogo { display: block; width: 279px; position: relative; cursor: pointer; overflow: hidden; }
body.spechighlight #headersec { display: none; }
body.spechighlight #spechighlight .wrapper { padding: 0 50px; }
body.spechighlight footer { display: none !important; }
body.spechighlight #mobile-menu-switch, body.spechighlight #mobile-menu { display: none !important; }

#spechighlight { background-color: #78F9C7; padding: 50px 0; /*.image {position: relative;margin-bottom: 60px;}
.image:after {content: "";display: block; padding-bottom: 56.25%;}*/ }
#spechighlight * { color: #999; }
#spechighlight .gentitle { font-size: 30px; line-height: 35px; text-align: right; margin-bottom: 30px; }
#spechighlight .title { font-size: 30px; line-height: 35px; text-align: right; }
#spechighlight .title, #spechighlight .title *, #spechighlight .description, #spechighlight .description * { font-family: "CeraPRO-Black", sans-serif; font-weight: normal; }
#spechighlight .box-image, #spechighlight .box-video, #spechighlight .box-mp4 { margin-bottom: 80px; }
#spechighlight .box-mp4 video { width: 100%; }
#spechighlight .box-video, #spechighlight .box-mp4 { position: relative; padding-bottom: 56.25%; height: 0; width: 100%; display: block; }
#spechighlight .box-video video, #spechighlight .box-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#spechighlight .box-image img { width: 100%; }
#spechighlight .description h2 { margin-bottom: 60px; }
#spechighlight .box-knowmore { padding-top: 30px; }
#spechighlight .box-knowmore a { background-color: #fff; }

.video-responsive { padding: 133.52% 0 0 0; position: relative; }

.video-responsive iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.video-responsive.horizontal { padding: 56.25% 0 0 0; }

/*.video-responsive:before {display: block;content: "";padding-top: 56.25%;}
.video-responsive-item {position: absolute;top: 0;bottom: 0;left: 0;width: 100%;height: 100%;border: 0;}*/
/*.video-responsive {   position: relative;  padding-bottom: 56.25%;  height: 0; overflow: hidden;  max-width: 100%; 
} 

.video-responsive iframe, 
.video-responsive object, 
.video-responsive embed {  position: absolute;  top: 0; left: 0;  width: 100%;  height: 100%; 
}*/