﻿:root{
    --bg-color: #f1f2f3;
    --text-color: #787878;
    --primary-color: #1e11ae;
    --second-color: #7dd6e1;
}
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200;300;400;600;700;900&display=swap');
body {
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif,'Source Sans Pro', sans-serif;
    font-size:1rem;
    color:var(--text-color);
    background-color:var(--bg-color);
    font-weight:400;
}

h1, h2, h3, h4, h5, h6{font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif,'Source Sans Pro', sans-serif; line-height:normal; font-weight:600}
h1, .h1 {font-size: 3.6rem;}
h2, .h2 {font-size: 2.6rem;}
h3, .h3 {font-size: 2.0rem;}
h4, .h4 {font-size: 1.6rem;}
h5, .h5 {font-size: 1.4rem;}
h6, .h6 {font-size: 1.2rem;}

[class^="bi-"]::before, [class*=" bi-"]::before{vertical-align:middle;}
.bi{line-height:1}
.bi-x  {font-size:100%}
.bi-2x {font-size:150%}
.bi-3x {font-size:200%}
.bi-4x {font-size:250%}
.bi-5x {font-size:300%}

.display-3{line-height:1!important}

.inpage-section{padding-top:70px; margin-top:-70px;}

p{text-align:justify;}
div p:last-child{margin-bottom:0;}
/*.text-center p, p.text-center, .text-center .text-justify{
    text-align-last:center; -webkit-text-align-last:center; -moz-text-align-last:center; -ms-text-align-last:center;
}*/

ul, ol {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
}
button:focus, button:active{outline:none;}
a{cursor:pointer; transition:all 0.3s ease-in 0s; text-decoration:none;color:#787878}
a:hover{color:var(--primary-color)}

.form-control:focus{outline:none; box-shadow:none}
.modal-backdrop.show{background-color:rgba(0,0,0,0.7); backdrop-filter:blur(20px); opacity:1}

section, .section{padding-top:4rem; padding-bottom:4rem; overflow:hidden; position:relative;}
footer{margin:0 auto; z-index:1; position:relative;}
header{overflow:hidden;}

.pg-header + section .container-lg{position:relative;}
.pg-header + section .container-lg:before {
    content: "";
    width: 146px;
    height: 146px;
    left: -3px;
    top: -36px;
    z-index: -1;
    position: absolute;
    background-image: url('../img/dots.png');
    background-size:100%;
    opacity:.3
}

.offcanvas{max-width:86%;}
.text-1x{font-size:100%}
.text-2x{font-size:125%}
.text-3x{font-size:150%}
.text-4x{font-size:200%}

.zi-0{z-index:0}
.zi-1{z-index:1}
.zi-2{z-index:25}
.zi-3{z-index:50}
.zi-4{z-index:75}
.zi-5{z-index:99}

.op-1{opacity:0.1!important}
.op-2{opacity:0.2!important}
.op-3{opacity:0.3!important}
.op-4{opacity:0.4!important}
.op-5{opacity:0.5!important}
.op-6{opacity:0.6!important}
.op-7{opacity:0.7!important}
.op-8{opacity:0.8!important}
.op-9{opacity:0.9!important}
.op-x{opacity:1!important}

.fw-1{font-weight:100!important}
.fw-2{font-weight:200!important}
.fw-3{font-weight:300!important}
.fw-4{font-weight:400!important}
.fw-5{font-weight:500!important}
.fw-6{font-weight:600!important}
.fw-7{font-weight:700!important}
.fw-8{font-weight:800!important}

.max-line-2{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.max-line-3{display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.max-line-4{display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;}
.max-line-5{display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;}

.text-shadow{text-shadow:1px 1px 2px rgba(0,0,0,0.5);}

.container, .container-fluid, .container-xl, .container-lg, .container-md, .container-sm{position:relative; z-index:5}

.wrapper{max-width:1600px; margin:0 auto; z-index:1}
.navbar{max-width:1600px; margin:0 auto;}
.navbar.fixed-top{left:50%; transform:translateX(-50%); width:calc(100% + 1px);}

.bg-img { position:absolute; bottom:0; left:0; width:100%; height:100%; z-index:2; object-fit:cover; }
.pg-header .bg-img {z-index:0;}

.bg-second{background-color:var(--second-color)}
.bg-primary{background-color:var(--primary-color)}

.fancybox-is-open .fancybox-bg{ background-color:rgba(90, 90, 90, 0.85); backdrop-filter:blur(50px); opacity:1;}

.btn{transition:all 0.2s ease-in 0s;}

.points {
    padding: 0;
    list-style: none;
}

    .points.row {
        padding-left: 10px;
    }

    .points > li {
        position: relative;
        padding: 2px 4px 12px 24px;
    }

        .points > li:before {
            position: absolute;
            width: 8px;
            height: 8px;
            background-color: #fecc00;
            left: 4px;
            top: 8px;
            content: "";
            transform: rotate(45deg);
        }


/* Scroll Top Button */
#scroll-top {
	width: 48px;
	height: 48px;
	position: fixed;
	right: 20px;
	bottom: 25px;
	z-index: 9999;
	color: #333;
	display: none;
	align-items: center;
	justify-content: center;
	text-align: center;
	line-height: 1;
	visibility: hidden;
	opacity: 0;
	border-radius: 0;
	border: none;
	background-color: rgba(204, 204, 204, 0.70);
	transition: all 0.4s ease;
	transform: translateY(60px);
	-ms-transform: translateY(60px);
    backdrop-filter:blur(10px);
    border-radius:50%;
}

#scroll-top:hover,
#scroll-top:focus {
	color: #777;
	background-color: #eaeaea;
}

#scroll-top.show {
    display:block;
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
}
.logowraper, .logowraper .container, .logowraper .container-fluid{z-index:9999; height:0; overflow:visible;}



.img-box, .img-box-4_3, .img-box-4_2, .img-box-4_1, .img-box-16_9, .video{position:relative; overflow:hidden; width:100%; height:0; padding-top:100%; display:block; background-color:#939396}
.img-box-4_3{padding-top:75%!important}
.img-box-4_2{padding-top:50%!important}
.img-box-4_1{padding-top:25%!important}
.img-box-16_9, .video{padding-top:56.25%!important}
.img-box img, .img-box-4_3 img, .img-box-4_2 img, .img-box-4_1 img, .img-box-16_9 img, .video iframe{position:absolute; width:100%; left:0; top:0; object-fit:cover; width:100%; height:100%;}

.img-cover{object-fit:cover}
.img-contain{object-fit:contain}
.bg-mask:after {
    position:absolute;
    top:0; left:0; content:""; width:100%; height:100%;
    background-position: center center;
    background: url('../img/banner-mask.png');
    background-repeat: no-repeat;
    background-size:100% 100%;
    opacity:.8;
}

.navbar{transition:all 0.4s ease-in 0s;}
.navbar .nav-link{text-transform:uppercase}
.navbar-brand img, .footer-logo{max-width:256px; max-height:58px;}
.navbar-brand{
    padding-top: 0; 
    padding-bottom: 0;
    /*margin-top:-.5px;
    margin-bottom:-.5px*/
}
.nav-link{padding:1rem .75rem!important; white-space:nowrap}
/*---------page Header---------*/
.home-header{z-index:0; margin-top:-76px}/*position:relative;*/
.slide-wrap{position:relative;}
.home-header.fullscreen, .home-header.fullscreen .item, .home-header.fullscreen .slide-wrap{min-height:calc(100vh - 120px);}
.home-header .container, .home-header .container-fluid, .home-header .row {height: 100%;}
.banner-img{width:100%; z-index:0; position:absolute; height:100%; object-fit:cover; }
.home-header .video-wrap{width:100%; z-index:0; position:absolute!important; height:100%; object-fit:cover; top:0; left:0; transform:translate(0, 0); overflow:hidden }
.home-header .video-wrap video{transform:scale(1.12) translate(-50%, -50%); overflow:hidden}
.home-header-content{position:absolute; left:0; top:50%; transform:translateY(-50%); width:100%; z-index:9}
.home-header.fullscreen .carousel-item, .header-space{height:calc(100vh - 120px);}
.carousel-control-next, .carousel-control-prev{z-index:99}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{position:absolute;top:50%; transform:translateY(-50%); color:#fff; opacity:0.6; text-shadow:1px 1px 4px rgba(0,0,0,0.5);}
.owl-carousel .owl-nav button.owl-next{right:0px} .owl-carousel .owl-nav button.owl-prev{left:0px;}
.home-header .owl-carousel .owl-nav button.owl-next{right:20px} .home-header .owl-carousel .owl-nav button.owl-prev{left:20px;}
.owl-carousel .owl-nav button.owl-next:hover, .owl-carousel .owl-nav button.owl-prev:hover{ opacity:1;}
.owl-carousel .owl-nav button.owl-next.disabled, .owl-carousel .owl-nav button.owl-prev.disabled,.owl-carousel .owl-nav button.owl-next.disabled:hover, .owl-carousel .owl-nav button.owl-prev.disabled:hover{opacity:0.3!important}
.home-header .owl-dots{width:100%; position:absolute; left:0; top:92vh; bottom:auto; text-align:center; padding:0 60px; z-index:11}
.owl-dots{width:100%; position:absolute; left:0; top:auto; bottom:0px; text-align:center; padding:0 60px; z-index:11}
.owl-dots .owl-dot{position:relative; box-shadow:1px 1px 2px rgba(0,0,0,0.4); width:14px; height:14px; background:rgba(255,255,255,0.4)!important; border:solid 2px rgba(255,255,255,0.75)!important; border-radius:50%; margin:0 4px; cursor:pointer; transition:all 0.4s ease-in 0s;}
.owl-dots .owl-dot.active, .owl-dots .owl-dot:hover{background-color:rgb(255, 180, 0)!important;}

.header-content{position:absolute; bottom:0; left:0; width:100%;}

.pg-header{ min-height:240px; max-height:400px; position:relative; padding-bottom:50px; padding-top:100px;}
.pg-header:after{position:absolute; content:""; left:0; bottom:0; height:25vh; width:100%; opacity:0.4; z-index:1; background:linear-gradient(0deg, #141727 0%, rgba(0,8,45,0) 100%);}
.pg-header > .bottom-bg { z-index:2; position:absolute; bottom:-1px; left:0; width:100%; -webkit-transform: scaleX(-1); transform: scaleX(-1);}
.pg-header .container-fluid{position:relative; z-index:9; }
.breadcrumb-wrap { border-top:solid 1px rgba(255,255,255,0.1); backdrop-filter:blur(7px); padding:0.5rem 0; position: sticky; position: -webkit-sticky; position: -moz-sticky; top: 78px; z-index:999!important}
.breadcrumb {color:#333;position:relative; z-index:9; margin-bottom:0; padding:0; }
.breadcrumb .active{color:#333;}
.breadcrumb a{color:var(--primary-color);}
.breadcrumb a:hover{color:#333;}
.breadcrumb.section-dark .active{color:#fff;}
.breadcrumb.section-dark a{color:var(--second-color);}
.breadcrumb.section-dark a:hover{color:#fff;}

@media screen and (max-width: 768px) {
    .home-header.fullscreen, .home-header.fullscreen .item, .home-header.fullscreen .slide-wrap{min-height:calc(50vh);}
    .home-header.fullscreen .carousel-item, .header-space{height:calc(50vh);}
    section{padding:3.5rem 0;}
}

.navbar .dropdown-menu .dropdown-item{padding-top:.5rem; padding-bottom:.5rem; min-width:200px}
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link{
    color:var(--primary-color);
}
@media screen and (min-width: 768px) {
    .navbar .dropdown:hover>.dropdown-menu {
            display: block;
            -webkit-animation: slide-up .25s ease-in-out;
            animation: slide-up .25s ease-in-out;
        }
}

@-webkit-keyframes slide-up {
        from {
            transform: translateY(0.5rem);
            opacity: 0;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }
    
    @keyframes slide-up {
        from {
            transform: translateY(0.5rem);
            opacity: 0;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }

section .video-wrap{z-index:1;     
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    top: 50%;
    left: 50%;
    transform:translate(-50%, -50%);
   pointer-events: none;
   overflow: hidden;
}

.video-wrap video {
    top: 50%;
    left: 50%;
    transform:translate(-50%, -50%);
    position: absolute;
    z-index: 1;
    opacity: 1;
    min-width: 100%;
    width:auto;
    min-height: 100%;
    transition: opacity .3s 1s ease;
}

.video-wrap iframe {
   width: 100vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 100vh;
   min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
    z-index: 1;
}

.contact-box {
    /*background-image: url('../img/bg-c.jpg');*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size:cover;
    background-image:linear-gradient(0,  #330055aa 0%, #000000aa 100%), url('../img/bg-c.jpg')
}

a.card{transition:all 0.2s ease-in 0s; }
a.card:hover{transform:translateY(-0.3rem); box-shadow:0px 3px 9px rgba(0 0 0 /.2); }


#loading {
    width: 40px;
    height: 20px;
    object-fit: cover;
}

.scaling-anim{animation: leaves 36s ease-in-out infinite alternate;}

@keyframes leaves {
    0% {transform: scale(1.0);}
    100% {transform: scale(1.5);}
}

@-webkit-keyframes leaves {
    0% {transform: scale(1.0);}
    100% {transform: scale(1.5);}
}
@-moz-keyframes leaves {
    0% {transform: scale(1.0);}
    100% {transform: scale(1.5);}
}

footer, .topbar{background-color:#222!important;}

footer a:hover{color:#fff!important}
.c-footer{background-color:rgba(0,0,0,0.5)}

.text-va-center{
    display: flex;
    align-items: center;
    justify-content: center;
}