.header-1 * {transition:.3s;}
.header-1 > .color {border-bottom:1px solid #ddd;}
.header-1 {position:sticky; top:0; z-index:10;}
.header-1 #logo {display:block;}
.header-1 #logo:hover {opacity:.75;}
.header-1 #logo img {max-width:200px; max-height:200px;}
.header-1 .module-background {backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}

.header-1 #header_items {margin:.5rem 0; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
.header-1 #header_items .logo svg path {fill: var(--color-base);}
.header-1 #header_items .logo svg path.arrow {fill: var(--color-body);}
.header-1 #top_menu {}
.header-1 #top_menu ul {display:flex; padding: 0; flex-wrap:wrap; margin:0;}
.header-1 #top_menu ul li {position: relative; flex: auto; text-align: center; display:block;}
.header-1 #top_menu ul li a {color: var(--color-text); display:block; padding:1rem;}
.header-1 #top_menu ul li:hover a {color: var(--color-base);}
.header-1 #top_menu ul li ul {display:none; position:absolute; top:100%; left:0; background:#fff; text-align:left; box-shadow: 0 6px 12px rgb(0 0 0 / 18%); white-space: nowrap;}
.header-1 #top_menu ul li ul li {text-align:left; border-bottom:1px solid #ddd; position: unset; max-width: 60rem;}
.header-1 #top_menu ul li ul li a {color: var(--color-text) !important;}
.header-1 #top_menu ul li ul li:hover > a {background:#ddd;}
.header-1 #top_menu ul li ul li ul li:hover a {box-shadow: 0 6px 12px rgb(0 0 0 / 18%);}
.header-1 #top_menu ul li:hover > ul {display: block;}
.header-1 #top_menu ul li ul li ul {display: none; top: 0; left: 100%; min-height: 100%;}
.header-1 #top_menu ul li ul li.parent > a {padding-right:2rem; position:relative;}
.header-1 #top_menu ul li ul li.parent > a::before {content: '\27A4'; position:absolute; right:.5rem; top:50%; transform:translateY(-50%);}
.header-1 .mobile-window {}
.header-1 .mobile-window .bg {position:fixed; background:rgba(0,0,0,.5); top:0; left:0; right:100%; bottom:0; border-radius:0 100% 100% 0;}
.header-1 .mobile-window .window {width:0; background:#fff; position:fixed; top:0; left:0; bottom:0; border-radius:0 100% 100% 0; opacity:0; padding:0; overflow:auto; display:flex; flex-direction: column; text-align: center;}
.header-1 .mobile-window .close {position:fixed; top:0; left:300px; margin:1rem; font-size:0; color:#fff; cursor:pointer;}
.header-1 .mobile-window .close:hover {opacity:.7;}
.header-1 .mobile-window .window > div {margin:1rem 0;}
.header-1 .mobile-window .mobile_menu {background:var(--color-base); text-align:left; margin-bottom:auto;}
.header-1 .mobile-window .mobile_menu ul {display:block; margin:0; padding:0;}
.header-1 .mobile-window .mobile_menu ul li {display:block; margin:0; padding:0; border-bottom:1px solid #ddd; position:relative;}
.header-1 .mobile-window .mobile_menu ul li a {color: var(--color-base-text); display:block; padding:.5rem;}
.header-1 .mobile-window .mobile_menu ul li ul li {display:none; background:rgba(255,255,255,.3); padding-left:.5rem;}
.header-1 .mobile-window .mobile_menu ul li ul.active > li {display:block;}
.header-1 .mobile-window .mobile_menu ul li.parent ul::before {content:'\f107'; font-family: "Font Awesome 6 Free"; font-weight: 900; position:absolute; background:#fff; padding:0 .5rem; top: .5rem; right:.5rem; cursor:pointer;}

body.active-menu {overflow:hidden;}
body.active-menu .header-1 .mobile-window {display:block;}
body.active-menu .header-1 .mobile-window .bg {right:0; border-radius:0;}
body.active-menu .header-1 .mobile-window .close {font-size:3rem;}
body.active-menu .header-1 .mobile-window .window {width:300px; border-radius:0; opacity:1; padding:1rem;}


[data-color="#000000FF"] {color:#000000FF}

.cover-1.vh100 {max-height: 800px; min-height: auto !important; height: 100vh;}
.cover-1 .container {height: 100%; position: relative; flex:1;}
.cover-1 .title {font-size: 2rem; text-transform: uppercase; word-spacing: 9999px; margin-top:60px;}
.cover-1 .uptitle {position: absolute; font-size: 1rem; text-transform: uppercase; top:50px; left:210px;}

.cover-1 .desc ul {margin: 100px 0 0; display: flex; flex-direction: column; gap:1rem; align-items: start; padding: 0; font-size: 1rem;}
.cover-1 .desc ul li {display: block; background: #fff; padding: 1rem;}

@media screen and (min-width: 576px) {
    .cover-1 .title {font-size: 4.8rem;}
    .cover-1 .uptitle {font-size: 1.2rem; top:155px; left:330px;}
    .cover-1.vh100 {max-height: 1000px;}
}
@media screen and (min-width: 768px) {
    .cover-1 .image img {position: absolute; right: 50%; margin-right: -50vw; bottom: 0; max-height: 60%; z-index: 8;}
    .cover-1 .uptitle {top:160px;}
    .cover-1.vh100 {max-height: 800px;}
}

@media screen and (min-width: 992px) {
    .cover-1 .image img {max-height: 90%;}
}

@media screen and (min-width: 1920px) {
    .cover-1 .image img {margin-right: -960px;}
}

.cover-1 .module-background {max-width: 1920px; margin: 0 auto;}


/*

@media screen and (min-width: 1200px) { :root .site, body.site {font-size: 16px;} }
@media screen and (min-width: 1400px) { :root .site, body.site {font-size: 16px;} }

*/

.benefits-1 {padding: 200px 0 !important; margin: -200px 0 -120px; z-index: 8;}
.benefits-1 .card {overflow: hidden; border-radius: 0; background: var(--color-base); border: 0 none; color:#fff; text-transform: uppercase;}
.benefits-1 .card img {transition: .3s;}
.benefits-1 .card:hover img {transform: scale(1.1) rotate(-1deg);}
.benefits-1 .module-background {background-size: 1920px 100%;}

.module.benefits-1 {padding:100px 0;}

.texts-6 {}
.texts-6 .part1 {position: relative; text-transform: uppercase; padding: 1rem;}
.texts-6 .part1 .img {position: absolute; right:0; top:0; height: 100%; z-index: -1; width: 100%; object-fit: cover; max-width: none;}
.texts-6 .part1 .t-1 {padding: 3rem 0 1rem;}
.texts-6 .part1 .t-2 {text-align: right; padding: 1rem 0;}
.texts-6 .part2 {font-size: .85rem; text-transform: uppercase;}
.texts-6 .part2 span {font-size: 1.3rem;}

.texts-6 .part2 img {width:100%; height:100%; object-fit: cover;}

.bg-danger {background: var(--color-base) !important;}
.texts-6 .bg-white,
.texts-6 .bg-danger {height:100%; padding: 1rem; display: flex; flex-direction: column; justify-content: end;}
.texts-6 .bg-danger {color:#fff;}

@media screen and (min-width: 768px) {
    .texts-6 .part1 {font-size: 2rem;}
    .texts-6 .part1 .img {width: 50vw;}
    .texts-6 .part2 .row .col-12 .bg-danger {min-height: 380px;}
    .texts-6 .part2 {font-size: 1rem;}
    .texts-6 .part2 span {font-size: 2rem;}
}
@media screen and (min-width: 992px) {
    .texts-6 .part1 {font-size: 3rem;}
}

@media screen and (min-width: 1200px) {
    .texts-6 .part1 {font-size: 4rem;}
}
@media screen and (min-width: 1920px) {
    .texts-6 .part1 .img {width: 960px;}
}

[data-color="#000"] {color:#000}

.sections-4 .card {overflow: hidden; position: relative; background: none; border:0 none; border-radius: 0; cursor: pointer;}
.sections-4 .card .card-body {background: none; border-radius: 0;}
.sections-4 .card .card-body .cards-title {color:#fff; text-align: left;}
.sections-4 .card .card-body .cards-title::before {content:'';position: absolute; top:0; left:0; right: 0; height: 5rem; z-index: -1;
    background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.00) 100%);}
.sections-4 .card .card-body .cards-desc {opacity: 0; transition: .3s; transform:scale(0) rotate(25deg);}
.sections-4 .card:hover .card-body .cards-desc {opacity: 1; transform:scale(1);}
.sections-4 .card img {transition: .3s; position: absolute; z-index: -2; left: 0; top: 0; width:100%; height: 100%; object-fit: cover; border-radius: 0;}
.sections-4 .card:hover img {transform: scale(1.1) rotate(-1deg);}

.sections-4 .module-background {opacity: 0; transition: .3s; z-index: -1;}
.sections-4 .card:hover .module-background {opacity: 1;}

@media screen and (min-width: 576px) {
    .sections-4 .card .card-body {height: 300px;}
}

.module.sections-4 {padding:100px 0;}

.texts-7 .module-background {background-repeat: repeat-x !important; background-position: bottom !important;}
.texts-7 .item-1 {position: relative;}
.texts-7 .item-1 > *:nth-child(1) {font-size: 2rem; text-transform: uppercase;}
.texts-7 .item-2 {color:var(--color-base); font-size: 1.5rem;}
.texts-7 .item-3 {color:#fff; background: var(--color-base); padding: 50px 1rem;}
.texts-7 .item-3 .btn-light {color:var(--color-base);}

@media screen and (min-width: 768px) {
    .texts-7 .item-1::before {position: absolute; content:url('/assets/img/028.svg'); left:-100px; top: -270px; z-index: -1}
}
@media screen and (min-width: 992px) {
    .texts-7 .item-2 {font-size: 2.6rem; display: flex; flex-direction: column; justify-content: center; height: 292px; margin-top: 100px;}
    .texts-7 .item-3 {display: flex; flex-direction: column; justify-content: center; height: 434px;}
    .texts-7 .row > div {position: relative;}
    .texts-7 img {max-width: none; position: absolute; right: 0; bottom: 0;}
}
@media screen and (min-width: 1200px) {
    .texts-7 .item-2 {font-size: 2.6rem;}
}

#audio-player {
    position: fixed;
    top: 100px;
    left: 10px;
    background: #000;
    color: #fff;
    padding: 8px;
    border-radius: 6px;
    display: none;
    z-index: 9999;
}

#audio-player button {
    background: none;
    border: none;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    margin-right: 5px;
}

.videos-3 {padding-top: 50px;}
.videos-3 .video {position: relative; overflow: hidden; cursor:pointer; height:150px;}
.videos-3 .video img {width:100%; height:100%; object-fit:cover;}
.videos-3 .video:hover {opacity:.75;}
.videos-3 .owl-carousel {position: absolute; bottom: 3rem; left:50%; margin-left: -49vw; width:98vw;}
.owl-carousel .owl-dots {bottom: -20px; white-space: nowrap; max-width: 90vw; overflow: hidden;}
.videos-3 .title {font-size: 2rem; color:var(--color-base); text-transform: uppercase; word-spacing: 9999px; position: relative;}
.videos-3 .video::after {
    content: '';
    position: absolute;
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 35px 0 35px 70px;
    border-color: transparent transparent transparent #fff;
    left: 50%;
    top: 50%;
    right: 0;
    bottom: 0;
    margin: 0;
	transform:translate(-35px, -35px);
}

@media screen and (min-width: 576px) {
    .videos-3 .owl-carousel {position: relative; margin-top: 2rem;}
}
@media screen and (min-width: 992px) {
    .videos-3 .owl-carousel {position: absolute; margin-top: 0;}
    .videos-3 .title {font-size: 4.8rem;}
    .videos-3 .title::before {content:url('/assets/img/031.svg'); position: absolute; top:40px; right:-100px;}
    .videos-3 .video {height:250px;}
}

.texts-9 {overflow: hidden;}
.texts-9 .part1 {padding:1rem; position: relative; text-transform: uppercase;}
.texts-9 .part1 .img {position: absolute; left:0; top:0; height: 100%; z-index: -1; width: 100%; object-fit: cover; max-width: none;}

.texts-9 .part1 .t-1 {padding: 3rem 0 1rem;}
.texts-9 .part1 .t-2 {text-align: right; padding: 1rem 0;}
.texts-9 .part2 {}


.texts-9 .part2 img {width:100%; height:100%; object-fit: cover;}

.bg-danger {background: var(--color-base) !important;}
.texts-9 .bg-light,
.texts-9 .bg-danger {height:100%; padding: 1rem; display: flex; flex-direction: column; justify-content: end;}
.texts-9 .bg-danger {color:#fff;}

@media screen and (max-width: 575px) {
    .texts-9 .h2 {font-size: 1.5rem;}
    .texts-9 .h3 {font-size: 1.5rem;}
    .texts-9 .h4 {font-size: 1.2rem;}
}
@media screen and (min-width: 768px) {
    .texts-9 .part1 {font-size: 2rem;}
    .texts-9 .part2 .row .col-12 .bg-danger {min-height: 380px;}
    .texts-9 .part1 .img {width: 50vw;}
}
@media screen and (min-width: 992px) {
    .texts-9 .part1 {font-size: 3rem;}
}

@media screen and (min-width: 1200px) {
    .texts-9 .part1 {font-size: 4rem;}
}

@media screen and (min-width: 1920px) {
    .texts-9 .part1 .img {width: 960px;}
}

[data-color="#000"] {color:#000}

.sections-5 .card {overflow: hidden; position: relative; background: none; border:0 none; border-radius: 0;}
.sections-5 .card .card-body {background: none; border-radius: 0; color:#fff; display: flex; flex-direction: row; gap:1rem; text-align: left;}
.sections-5 .card .card-body .cards-title {font-size: 4rem; font-weight: bold;}
.sections-5 .card .card-body .cards-title::before {content:'';position: absolute; top:0; left:0; right: 0; height: 10rem; z-index: -1;
    background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.00) 100%);}
.sections-5 .card .card-body .cards-desc {font-size: 1rem; text-transform: uppercase; margin-top: 15px;}


.sections-5 .card img {transition: .3s; position: absolute; z-index: -2; left: 0; top: 0; width:100%; height: 100%; object-fit: cover; border-radius: 0;}
.sections-5 .card .module-background {z-index: -1;}
.sections-5 .card:hover img {transform: scale(1.1) rotate(-1deg);}

.sections-5 .module-background {opacity: 0; transition: .3s; z-index: -1;}
.sections-5 .card:hover .module-background {opacity: 1;}

@media screen and (min-width: 575px) {
    .sections-5 .card .card-body {height: 250px;}
    .sections-5 .card .card-body .cards-desc {font-size: 1.5rem;}
}

.module.sections-5 {padding:100px 0;}

.forms-3 .icons img {height:60px;}
.forms-3 .module-background {background-position: -350px;}
@media screen and (min-width: 768px) {
    .forms-3 .title::after {content:url('/assets/img/042.svg'); display: block; position: relative; margin-right:0; top:15px;}
    .forms-3 {min-height: 406px;}
}

.module.forms-3 {padding:100px 0;}
[data-color="#000"] {color:#000}

.videos-4 .card {overflow: hidden;}
.videos-4 .card img {transition: .3s;}
.videos-4 .card:hover img {transform: scale(1.1) rotate(-1deg);}
.videos-4 .card-img-top {position: relative;}
.videos-4 .card-img-top::after {
    content: '';
    position: absolute;
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 35px 0 35px 70px;
    border-color: transparent transparent transparent #fff;
    left: 50%;
    top: 50%;
    right: 0;
    bottom: 0;
    margin: 0;
    transform:translate(-35px, -35px);
}
.videos-4 .title {position: relative;}
.videos-4 .h4 {font-size: 1rem; font-weight: normal;}
@media screen and (min-width: 1200px) {
    .videos-4 .title::after {content: url('/assets/img/043.svg'); position: absolute; bottom: -80px; left:100%;}
    .videos-4 .h4 {font-size: 1.5rem;}
}

.module.videos-4 {padding:100px 0;}
[data-color="#000000FF"] {color:#000000FF}

.texts-10 textarea {text-align: center;}

[data-color="#000000FF"] {color:#000000FF}

.forms-1 input::placeholder, .forms-1 textarea::placeholder { color: #4B484688 !important;}
.forms-1 ul {margin:0; padding: 0; display: block;}
.forms-1 ul li {margin:0; padding: 10px 0 10px 40px; display: block; position: relative; font-weight: normal;}
.forms-1 ul li::before {content:url('/assets/img/li.svg'); position: absolute; top: 50%; left:0; transform: translateY(-50%);}
.forms-1 .h4 {font-size: 1rem;}
@media screen and (min-width: 576px) {
    .forms-1 .h4 {font-size: 1.5rem;}
}


.module.forms-1 {padding:100px 0;}

.footer-1 {overflow: hidden;}
.footer-1 {padding:3rem 0 0 !important;}
.footer-1 ul {display:block; margin:0; padding:0;}
.footer-1 ul li {display:block; margin:0; padding:0; border-bottom:1px solid var(--color-inverse);}
.footer-1 ul li a {display:block; margin:0; padding:.3rem 1rem;}
.footer-1 .zerro-author {display: flex; color:#A2A2A2;}
.footer-1 .zerro-author:hover {color:#A2A2A2;}
.footer-1 .zerro-author::before {content: url('/assets/images/zerro.svg'); margin-right:1rem; filter:grayscale(1) invert(1);}

.footer-1 .wrap {position: relative; color:#fff;}
.footer-1 .wrap::before {background: var(--color-base); z-index: -1; content:''; position: absolute; left:50%; margin-left: -50vw; width:100vw; top:0; bottom: 0;}

.footer-1 .icons img {height: 32px;}


.footer-1 .title {font-size: 2rem; text-transform: uppercase;}
.footer-1 .uptitle {position: absolute; font-size: 1rem; text-transform: uppercase; top:135px; left:210px;}

@media screen and (min-width: 576px) {
    .footer-1 .uptitle {top:100px;}
}
@media screen and (min-width: 768px) {
    .footer-1 .title {font-size: 4.8rem;}
    .footer-1 .uptitle {font-size: 1.2rem; top:195px; left:310px}
    .footer-1 .img img {position: absolute; right:0; bottom: 0; max-height: 40%;}
}
@media screen and (min-width: 992px) {
    .footer-1 .img img {position: absolute; right:0; bottom: 0; max-height: 90%;}
}

[data-color="#ffffffFF"] {color:#ffffffFF}
[data-color="#000000FF"] {color:#000000FF}
[data-color="#A2A2A2"] {color:#A2A2A2}

