@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url("https://unpkg.com/aos@2.3.1/dist/aos.css");




/* .theme-rounded{border-radius: var(--rounded);} */
:root{--bs-navbar-active-color:var(--bs-danger)!important}

html{
    scrollbar-width: thin;
    -webkit-scrollbar-width: thin;}
body {
    font-family: "Inter", sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: var(--text-color);
    line-height: 26px;
    background-color: var(--bg-body);
    position: relative;
}
/* body::before{position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; content: ""; background: var(--bg-gradient);} */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    text-transform: capitalize;
}

* p:last-child{margin-bottom: 0;}

.display-1,.display-2,.display-3,.display-4,.display-5{line-height: 1.1;}
/* .container{max-width: 1280px;} */

a,
a:hover {
    transition: all 0.2s ease-in 0s;
    text-decoration: none;
    cursor: pointer!important;
}

a:hover {
    color: var(--bs-default);
}
a,
button {
    color: inherit;
    outline: none;
    border: none;
}

[routerLink] {
    cursor: pointer;
}

.text-default{color: var(--bs-default);}

button:focus {
    outline: none;
    box-shadow: none!important;
}

ul,
ul li {
    list-style: none;
    padding-left: 0;
}

[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%
}

.text-1x {
    font-size: 100%
}

.text-2x {
    font-size: 125%
}

.text-3x {
    font-size: 150%
}

.text-4x {
    font-size: 200%
}

.zi-0,
.zi-1,
.zi-2,
.zi-3,
.zi-4,
.zi-5 {
    position: relative;
}

.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-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.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);
}

.obj-p-end{object-position: 75%;}
.obj-p-center{object-position: center;}
.obj-p-start{object-position: left;}

.container,
.container-fluid,
.container-fluid,
.container-fluid px-lg-5 px-md-4,
.container-md,
.container-sm {
    position: relative;
    z-index: 2
}
.text-justify{text-align:justify}

.wrapper {
    /* max-width: 1800px; */
    margin: 0 auto;
    z-index: 1;
    min-height: 100vh;
    /* box-shadow: 0 0 36px rgba(43, 27, 58, 0.2); */
    /* outline: solid 1px rgba(68, 63, 44, 0.4); */
    position: relative;
    background-color: var(--bg-body);
    overflow: hidden;
}

.bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    object-fit: cover;
    overflow: hidden;
}

.bg-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.op-top{object-position:top}

.h-30 {
    max-height: 35%;
}

.h-40 {
    max-height: 45%;
}

.h-50 {
    max-height: 55%;
}

.h-60 {
    max-height: 65%;
}

.h-70 {
    max-height: 75%;
}

.h-80 {
    max-height: 85%;
}

.h-90 {
    max-height: 95%;
}

.bg-blur {
    filter: blur(70px);
}
.bg-blur-1{filter: blur(5px);}
.bg-blur-2{filter: blur(15px);}
.bg-blur-3{filter: blur(25px);}
.bg-blur-4{filter: blur(50px);}
.pg-header .bg-img {
    z-index: 0;
}

.bg-black{background-color: #000;}

header,
section {
    position: relative;
}

header>.container,
section>.container {
    position: relative;
    z-index: 4;
}

.section {
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.min-vh-25 {
    min-height: 25vh;
}

.min-vh-50 {
    min-height: 50vh;
}

.min-vh-75 {
    min-height: 75vh;
}

.navbar {
    /* max-width: 1800px; */
    /* margin: 0 auto;
    transition: all 0.3s ease-in 0s;
    background-color: var(--nav-color);
    backdrop-filter: blur(26px); */
}
.nav-link.active{color: var(--bs-danger)!important;}
.navbar.fixed-top {
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% + 1px);
}

.navbar-brand img {
    width:100%;
    max-width: 150px;
    max-height: 72px;
    display: block;
    object-fit: cover;
    object-position: left;
}

.navbar .dropdown-menu .dropdown-item, .navbar .dropdown-menu .dropdown-item{padding-top:.5rem; display:block; padding-bottom:.5rem; min-width:200px}
@media screen and (min-width: 992px) {
    .navbar .dropdown:hover > .dropdown-menu {
            display: block;
            -webkit-animation: slide-up .25s ease-in-out;
            animation: slide-up .25s ease-in-out;
            visibility:visible;
            opacity:1;
            overflow:hidden
        }
}

@-webkit-keyframes slide-up {
        from {
            transform: translateY(0.5rem);
            opacity: 0;
            visibility:visible;
        }
        to {
            transform: translateY(0);
            opacity: 1;
            visibility:visible;
        }
    }
    
    @keyframes slide-up {
        from {
            transform: translateY(0.5rem);
            opacity: 0;
            visibility:visible;
        }
        to {
            transform: translateY(0);
            opacity: 1;
            visibility:visible;
        }
    }
    .carousel-indicators [data-bs-target]{background-color: var(--bs-secondary);}
    .carousel-indicators [data-bs-target].active{background-color: #efc82f;}

.w-100px{width: 125px;}


.img-sm,
.img-md,
.img-lg,
.img-xl,
.img-xxl {
    position: relative;
    object-fit: contain;
}

.img-sm {
    width: 36px;
    height: 36px;
}

.img-md {
    width: 48px;
    height: 48px;
}

.img-lg {
    width: 64px;
    height: 64px;
}

.img-xl {
    width: 96px;
    height: 96px;
}

.img-xxl {
    width: 128px;
    height: 128px;
}

.img-cover {
    object-fit: cover;
}

.img-contain {
    object-fit: contain;
}

.vid-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    z-index: 1;
 }
 @media (min-width: 62em) {
  .vid-bg {
     display:block;
  }
}

.mt--7{margin-top: -140px;}

.fixed-bg {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

.swiper {
    padding-bottom: 24px;
}

.swiper .swiper-pagination {
    bottom: 0;
}

.hover-up, .scale-up
.card,
.card img {
    transition: all 0.3s ease-in-out 0s;
}

.hover-up:hover {
    transform: translateY(-4px);
}

.card.hover-up:hover .card-img-top img {
    transform: scale(1.1) rotate(3deg);
}

.card.hover-up:hover {
    box-shadow: 0 10px 16px rgba(25, 18, 56, 0.1)!important;
}

.scale-up{
    display: inline-block;}
.scale-up:hover{
    transform: scale(1.05);
}


footer a {
    color: rgba(0, 0, 0, 1);
    transition: all .2s ease-in 0s;
}

footer a:hover {
    color: var(--bs-warning);
}

footer small a:hover {
    color: var(--bs-secondary);
}

.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: var(--bs-secondary);
    left: 4px;
    top: 8px;
    content: "";
    transform: rotate(45deg);
}

.breadcrumb-item{font-weight:500; color:var(--bs-body)}
.breadcrumb-item.active, .breadcrumb-item a:hover{color:var(--bs-warning);}

#loading {
    width: 40px;
    height: 20px;
    object-fit: cover;
}

.bg-rotate{animation: spin 20s linear infinite; }
@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}
@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}
@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}
@-moz-keyframes bounce { 
    50% { -moz-transform: translateY(10%); } 
    0% { -moz-transform: translateY(0%); } 
}
@-webkit-keyframes bounce { 
    50% { -webkit-transform: translateY(10%); } 
    0% { -webkit-transform: translateY(0%); } 
}
@keyframes bounce { 
    50% { 
        -webkit-transform: translateY(10%); 
        transform:translateY(10%); 
    }
    0% { 
        -webkit-transform: translateY(0%); 
        transform:translateY(0%); 
    } 
}
@-moz-keyframes rl { 
    50% { -moz-transform: translateX(15%); } 
    0% { -moz-transform: translateX(0%); } 
}
@-webkit-keyframes rl { 
    50% { -webkit-transform: translateX(15%); } 
    0% { -webkit-transform: translateX(0%); } 
}
@keyframes rl { 
    50% { 
        -webkit-transform: translateX(15%); 
        transform:translateX(15%); 
    }
    0% { 
        -webkit-transform: translateX(0%); 
        transform:translateX(0%); 
    } 
}
.header{overflow-y: visible; position: relative; overflow-x: hidden; overflow: visible;}
header > div {position: relative; z-index: 4;} 

.breadcrumb-item+.breadcrumb-item::before{margin-top: 10px;}


.mock{position: relative; max-width: 100%; z-index: 9; border-radius: 3vw; background-color: rgba(0, 0, 0, 0.15);
    transform:
    perspective(1000px)
    rotateX(4deg)
    rotateY(-16deg)
    rotateZ(4deg);
  box-shadow: 24px 16px 64px 0 rgba(0, 0, 0, 0.15);}
.mock .carousel{position: absolute; width: calc(100% - 9%); height: (100% - 8%); left: 6%; top: 5%; box-shadow: 0 0 30px rgba(0, 0, 0, 0.125) inset; overflow: hidden; border-radius: 2vw;}
section{position: relative; }
section > div{ position: relative; z-index: 2;}
.section{padding: 10vh 0; }
.f-item{width: 80px; margin-bottom: 1.2rem;}
.bg-white{background-color: #fff;}
.backdrop-blur{ backdrop-filter: blur(20px);}

.gslide-image{ background: #fff; }
.trasn-m5{ transform: translate(-5% -5%);}

  .swiper-wrapper {transition-timing-function: linear; height: initial;}
  .sidefade{position: relative;}
  .sidefade::before{content: " "; position: absolute; left: 0; top:0; width:10%; height: 100%; background: linear-gradient(90deg, rgba(var(--bs-body-bg-rgb),1), rgba(var(--bs-body-bg-rgb),0)); z-index: 9;}
  .sidefade::after{content: " "; position: absolute; right: 0; top:0; width:10%; height: 100%; background: linear-gradient(270deg, rgba(var(--bs-body-bg-rgb),1), rgba(var(--bs-body-bg-rgb),0)); z-index: 9;}

  .thumb-48{width: 60px!important; display: block;}

  .contact-box {
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
    background-image: linear-gradient(0, #002078aa 0%, #000000aa 100%), url(../img/bg-products.png);
}

.contact-info a:hover{color: var(--bs-danger);}

.gslide-title{text-align: center;}

.yottie-popup-inner{top:0!important}