
/* Sterco Digitex */

@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Karla:ital,wght@0,200..800;1,200..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url("aos.css");
@import url("swiper-bundle.min.css");
@import url("jquery.fancybox.min.css");
@import url("custom.css");
@import url("header.css");
@import url("footer.css");
@import url("mobile-menu.css");

* { padding: 0; margin: 0; box-sizing: border-box; font-family: var(--font-Karla);}
main{padding-top: 0rem;  position: relative; z-index: 1;    background-color: var(--color-f5);overflow-x: hidden;}

.text-danger{color: red;font-size: var(--font-12);}

.container-inner{
    max-width: 1440px;
    margin-right: auto;
    margin-left: auto;
}

/* @media(max-width:991px){main{padding-top: 7.5rem;}}
@media(max-width:320px){main{padding-top: 6.9rem;}} */
:root {
     --color-15: #9E9E0B;
     --color-9e: #9e9e9e;
    --color-17: #263868;
    --color-12: #122F7E;
    --color-23: #A02B2D;
    --color-a0: #A02B2D;
    --color-22:#225F25;
    --color-21:#212121;
    --color-28:#383838;
    --color-26:#263868;
    --color-f0: #FFCC00;
    --color-0e:#161616;
    --color-00: #000000;
    --color-19:#191615;
    --color-38:#383838;
    --color-ff: #ffffff;
    --color-f6: #F6F6F6;
    --color-e6: #E6E6E6;
    --color-f9: #f9f9f9;
    --color-f5:#f5f5f5;
    --color-27:#272727;
    --color-51:#515151;
    --color-19:#191615;
    --color-1f:#1F1A17;
    --color-bc:#BCBCBC;
    --color-d4:#D4D4D4;
    --color-e9:#E9EBEF;
    --font-Karla: "Karla", sans-serif;
    --font-Barlow: "Barlow Condensed", sans-serif;
    --font-Geist: "Geist", sans-serif;
    --font-150: 15rem;
    --font-128: 12.8rem;
    --font-122: 12.2rem;
    --font-120: 12rem;
    --font-100: 10rem;
    --font-94: 9.4rem;
    --font-76: 7.6rem;
    --font-86: 8.6rem;
    --font-80: 6.6rem;
    --font-72: 5.2rem;
    --font-62: 6.2rem;
    --font-60: 6rem;
    --font-56: 5.6rem;
    --font-54: 3.8rem;
    --font-52: 5.2rem;
    --font-50: 5rem;
    --font-48: 3.8rem;
    --font-46: 3.6rem;
    --font-42: 2.8rem;
    --font-38: 3rem;
    --font-32: 2.5rem;
    --font-36: 2.8rem;
    --font-34: 2.4rem;
    --font-30: 2.3rem;
    --font-28: 2.1rem;
    --font-26: 2.1rem;
    --font-25: 2.1rem;
    --font-24: 2rem;
    --font-22: 1.9rem;
    --font-20: 1.8rem;
    --font-21: 1.7rem;
    --font-19: 1.6rem;
    --font-18: 1.6rem;
    --font-17: 1.5rem;
    --font-16: 1.4rem;
    --font-15: 1.3rem;
    --font-14: 1.2rem;
    --font-13: 1.2rem;
    --font-12: 1rem;
    --font-11: 0.9rem;
    --font-10: 0.9rem;

    --line-height-65: 6.5rem;
    --line-height-36: 1.25;
    --line-height-32: 3.2rem;
    --line-height-35: 3.5rem;
    --line-height-30: 3rem;
    --line-height-29: 2.9rem;
    --line-height-26: 2.6rem;
    --line-height-24: 1.8rem;
    --line-height-23: 2.1rem;
    --line-height-21: 2.1rem;
    --line-height-18: 1.8rem;
    --line-height-17: 1.7rem;
}
.container, .container-inner, .container-in{padding-left:1.6rem;padding-right: 1.6rem;}

@media(max-width:330px) {
    .container, .container-inner{padding-left: 1.5rem;padding-right: 1.5rem;}

}

@media(min-width:992px) {
    :root{
        --font-131: 9.1rem;
        --font-128: 8.9rem;
        --font-122: 7.8rem;
        --font-120: 8rem;
        --font-94: 6.4rem;
        --font-80: 6rem;
        --font-76: 5.4rem;
        --font-72: 5.2rem;
        --font-62: 4.2rem;
        --font-56: 4.6rem;
        --font-52: 4.2rem;
        --font-48: 3.8rem;
        --font-46: 3.6rem;
        --font-42: 3.2rem;
        --font-38: 2.8rem;
        --font-32: 2.5rem;
        --font-36: 2.6rem;
        --font-34: 2.4rem;
        --font-30: 2.2rem;
        --font-28: 2.1rem;
        --font-26: 2rem;
        --font-25: 2rem;
        --font-24: 1.9rem;
        --font-22: 1.8rem;
        --font-20: 1.7rem;
        --font-21: 1.6rem;
        --font-19: 1.5rem;
        --font-18: 1.5rem;
        --font-17: 1.4rem;
        --font-16: 1.3rem;
        --font-15: 1.3rem;
        --font-14: 1.2rem;
        --font-13: 1.2rem;
        --font-12: 1rem;
        --font-11: 0.9rem;
        --font-10: 0.9rem;
        --line-height-36: 3.6rem;
        --line-height-35: 3.5rem;
        --line-height-30: 3rem;
        --line-height-26: 2.6rem;
        --line-height-24: 1.8rem;
        --line-height-23: 2.1rem;
        --line-height-21: 2.1rem;
        --line-height-18: 1.8rem;
        --line-height-17: 1.7rem;
    }
    .container {max-width:1000px;padding-left: 1.5rem;padding-right: 1.5rem;}
    .container-inner{max-width:100%;margin-right: auto;margin-left: auto;}
}


@media(min-width:1200px) {
    :root {
        --font-131: 13.1rem;
        --font-122: 12.2rem;
        --font-120: 12rem;
        --font-94: 9.4rem;
        --font-80: 8rem;
        --font-76: 7.6rem;
        --font-72: 7.2rem;
        --font-62: 6.2rem;
        --font-54: 4.4rem;
        --font-52: 5.2rem;
        --font-48: 4.8rem;
        --font-46: 4.6rem;
        --font-42: 4.2rem;
        --font-38: 3.8rem;
        --font-36: 3.6rem;
        --font-34: 3.4rem;
        --font-32: 3.2rem;
        --font-30: 3.0rem;
        --font-28: 2.8rem;
        --font-26: 2.6rem;
        --font-25: 2.5rem;
        --font-24: 2.4rem;
        --font-22: 2.2rem;
        --font-20: 2rem;
        --font-21: 1.9rem;
        --font-19: 1.9rem;
        --font-18: 1.8rem;
        --font-17: 1.7rem;
        --font-16: 1.6rem;
        --font-15: 1.5rem;
        --font-14: 1.4rem;
        --font-13: 1.3rem;
        --font-12: 1.2rem;
        --font-11: 1.1rem;
        --font-10: 1rem;
        --line-height-36: 2.4rem;
        --line-height-35: 2.3rem;
        --line-height-30: 2.2rem;
        --line-height-26: 2.1rem;
        --line-height-24: 1.8rem;
        --line-height-23: 2.3rem;
        --line-height-21: 2.1rem;
        --line-height-18: 1.8rem;
        --line-height-17: 1.7rem;
    }
    .container {
        max-width: 1196px;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .container-in{
        max-width: 1490px;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        margin-right: auto;
        margin-left: auto;
    }
       .container-inner{
        max-width: 1200px;
        margin-right: auto;
        margin-left: auto;
    }
    .container-fluid {
        max-width: 100%;
        padding-inline: 2.5rem;
    }
}

@media(min-width:1366px) {
    .container-inner{ max-width: 1320px;}
}

@media(min-width:1200px) {
    .container {
        max-width: 1180px;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}


@media(min-width:1550px) {
    :root {
        --font-131: 11.1rem;
        --font-120: 10rem;
        --font-122: 10.2rem;
        --font-94: 8.4rem;
        --font-80: 7rem;
        --font-76: 6.9rem;
        --font-72: 6.2rem;
        --font-62: 5.2rem;
        --font-54: 5rem;
        --font-52: 4.2rem;
        --font-48: 3.8rem;
        --font-42: 3.6rem;
        --font-38: 3.0rem;
        --font-36: 2.8rem;
        --font-34: 2.6rem;
        --font-32: 2.5rem;
        --font-30: 2.4rem;
        --font-26: 2.1rem;
        --font-25: 2.1rem;
        --font-24: 2rem;
        --font-20: 1.9rem;
        --font-22: 2rem;
        --font-21: 1.9rem;
        --font-19: 1.9rem;
        --font-18: 1.8rem;
        --font-17: 1.7rem;
        --font-16: 1.6rem;
        --font-15: 1.5rem;
        --font-14: 1.4rem;
        --font-13: 1.3rem;
        --font-12: 1.2rem;
        --font-11: 1.1rem;
        --font-10: 1rem;
      --line-height-40: 4.0rem;
        --line-height-36: 3rem;
        --line-height-35: 2.8rem;
        --line-height-30: 2.6rem;
        --line-height-26: 2.4rem;
        --line-height-24: 2.2rem;
        --line-height-23: 2.1rem;
        --line-height-21: 1.8rem;
        --line-height-18: 1.9rem;
        --line-height-17: 1.8rem;
    }
    .container {
        max-width: 1366px;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .container-fluid {
        max-width: 100%;
        padding-inline: 2.5rem;
    }
.container-inner{max-width:1440px;margin-right:auto;margin-left:auto;}
.container-in{max-width:1590px;padding-left:1.5rem;padding-right:1.5rem;margin-right:auto;margin-left:auto;}


}

/* @media(min-width:1600px) {
    .container {
        max-width: 1400px;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
} */

@media(min-width:1800px) {
    :root {
        --font-131: 13.1rem;
        --font-122: 12.2rem;
        --font-120: 12rem;
        --font-94: 9.4rem;
        --font-80: 8rem;
        --font-76: 7.6rem;
        --font-72: 7.2rem;
        --font-62: 6.2rem;
        --font-54: 5.4rem;
        --font-56: 5.6rem;
        --font-52: 5.2rem;
        --font-48: 4.8rem;
        --font-46: 4.6rem;
        --font-42: 4.2rem;
        --font-38: 3.8rem;
        --font-36: 3.6rem;
        --font-34: 3.4rem;
        --font-32: 3.2rem;
        --font-30: 3rem;
        --font-28: 2.8rem;
        --font-26: 2.6rem;
        --font-25: 2.5rem;
        --font-24: 2.4rem;
        --font-20: 2.0rem;
        --font-22: 2.2rem;
        --font-21: 2.1rem;
        --font-18: 1.8rem;
        --font-17: 1.7rem;
        --font-16: 1.6rem;
        --font-15: 1.5rem;
        --font-14: 1.4rem;
        --font-13: 1.3rem;
        --font-12: 1.2rem;
        --font-11: 1.1rem;
        --font-10: 1rem;
        --line-height-40: 4.0rem;
        --line-height-36: 3.6rem;
        --line-height-35: 3.5rem;
        --line-height-30: 3rem;
        --line-height-26: 2.6rem;
        --line-height-24: 2.4rem;
        --line-height-23: 2.3rem;
        --line-height-21: 2.1rem;
        --line-height-18: 1.8rem;
        --line-height-17: 1.7rem;
    }
    .container {
        max-width: 1291px;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .container-fluid {
        max-width: 100%;
        padding-inline: .75rem;
    }
    .container-inner{max-width:1470px;margin-right:auto;margin-left:auto;}
    .container-in{max-width:1624px;padding-left:1.5rem;padding-right:1.5rem;margin-right:auto;margin-left:auto;}
}

@media(min-width:2300px){
    .container{max-width:1640px;padding-left:1.5rem;padding-right:1.5rem;}
    .container-fluid{max-width:100%;padding-inline:.75rem;}
    .container-in{max-width:2134px;padding-left:1.5rem;padding-right:1.5rem;margin-right:auto;margin-left:auto;}
    .container-inner{max-width:1930px;padding-left:1.5rem;padding-right:1.5rem;margin-right:auto;margin-left:auto;}
}
::after,
::before { box-sizing: border-box; }
audio,
canvas,
embed,
iframe,
img,
object,
svg,
video { display: block; max-width: 100%; width: 100%; }
body { margin: 0; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent;
    background-color: var(--color-f5);font-size: var(--font-16);
    /* scroll-behavior: unset !important; */
}
html { font-size: 62.5%;  }

@media(min-width:2300px){
  html { font-size: 86%;  }
}

p { font-size: var(--font-16); color: var(--color-00); line-height: 1.5; margin-bottom: 3rem; }
p:empty { display: none !important; }
a { text-decoration: none; }
figure { margin-bottom: 0; }
button { cursor: pointer; }
h1 { font-size: var(--font-48); font-family: var(--font-Karla); color: var(--color-24); font-weight: normal; }
h2 { font-size: var(--font-36); font-family: var(--font-Karla); font-weight: normal; }
h3 { font-size: var(--font-30); line-height: var(--line-height-30); font-family: var(--font-Karla); color: var(--color-24); font-weight: normal; }
h4 { font-size: var(--font-24); line-height: var(--line-height-36); font-family: var(--font-Karla); font-weight: normal; color: var(--color-24); }
h5 { font-size: var(--font-21); font-family: var(--font-Karla); font-weight: normal; }
h6 { font-size: var(--font-18); line-height: var(--line-height-26); font-family: var(--font-Karla); font-weight: normal; }
/* @media(max-width:1199px) {
    h1 { font-size: 4.8rem; }
    h2 { font-size: 3.6rem; }
    h3 { font-size: 3rem; line-height: 3.5rem; }
    h4 { font-size: 2.4rem; line-height:3.6rem; }
    h5 { font-size: 2.1rem; }
    h6 { font-size: 1.8rem; line-height: 2.6rem; }
 }
@media(max-width:350px) {
    h1 { font-size: 4.2rem; }
    h2 { font-size: 3.4rem; }
    h3 { font-size: 2.8rem; line-height: 3.3rem; }
    h4 { font-size: 2.1rem; line-height:2.8rem; }
    h5 { font-size: 1.9rem; }
    h6 { font-size: 1.6rem; line-height: 2.4rem; }
 } */
 ::-webkit-scrollbar {width: 0.5rem;}
 ::-webkit-scrollbar-thumb {background-color: var(--color-17);border-radius: 0.2rem;}
 ::-webkit-scrollbar-track {background-color: var(--color-f5);border-radius: 0.2rem;}

.arrow_btn{width: 2.4rem;height: 2.4rem;line-height: normal;font-size: 0;border: .1rem solid #263868;color: #263868;background-color: transparent;display: inline-flex;align-items: center;justify-content: center;font-weight: 800;  transition: all 0.5s ease; border-radius: 100px;}
.arrow_btn>span{font-weight: 600; font-size: var(--font-12);    line-height: 0;}
.arrow_btn:hover{background-color: var(--color-17);color: var(--color-ff);border-color: var(--color-17);}
.arrow_btn:hover span{
    color: var(--color-ff);
}




@media(max-width:1450px){
    .arrow_btn { width: 2.2rem;height: 2.2rem;}
}
@media(max-width:767px){
    .arrow_btn {width: 2.2rem;height: 2.2rem;font-size: 1rem;font-weight: 600;}
}
.more_btn { position: relative; display: inline-flex; gap: 0; font-size: var(--font-18); line-height: var(--line-height-24); font-weight: 400;letter-spacing: -0.54px; gap: 0.5rem; padding-bottom: .8rem; border-bottom: .1rem dashed var(--color-f0); font-family: var(--font-Karla); color: var(--color-24); transition: all .5s ease; }
.more_btn::after {position: relative;content: '\F285';font-family: bootstrap-icons !important;font-size: var(--font-16);right: 0;font-weight:400;transition: all .5s ease;}
.more_btn:hover {color: var(--color-f0);}
.more_btn:hover::after { right: -0.8rem; }
@media(max-width:1199px) {
 .more_btn { font-size: 1.4rem;letter-spacing: -0.42px;line-height: 2.4rem;padding-bottom: .7rem; }
 .container-in{ padding: 0 1.5rem;}

 }
 @media(max-width:1199px) {.container{max-width: 100%;}}
@media(max-width:350px) {
 .more_btn { font-size: 1.4rem; line-height: 2.1rem; padding-bottom: .6rem; }
 }
.view_more_btn {margin-top: 7rem;}
.btn_theme{display: inline-block;font-size: var(--font-14);color: var(--color-19);background-color: var(--color-17);font-weight:600;padding: 1rem 3.2rem;background: linear-gradient(to right, var(--color-23) 49%, var(--color-f0) 49%);background-size: 210% 110%;background-position: right bottom;transition: all .5s ease-out;}
.btn_theme:hover {background-position: left bottom;color: var(--color-ff);}
.back_btn { position: relative; display: inline-flex; flex-direction: row-reverse; gap: 1rem; font-size: var(--font-16); line-height: var(--line-height-24); font-weight: 400; padding-bottom: .5rem; border-bottom: .1rem dashed var(--color-24); font-family: var(--font-Karla); color: var(--color-24); transition: all .5s ease; }
.back_btn::after { position: relative; content:'\F12F'; font-family: bootstrap-icons !important; font-size: var(--font-15); left: 0; font-weight: 400; transition: all .5s ease; }
.back_btn:hover {color: var(--color-f0);}
.back_btn:hover::after { left: -0.2rem; }
.overlap_btn { position: absolute; top: 0; left: 0; bottom: 0; right: 0; font-size: 0; }
:is(.swiper-button-prev, .swiper-button-next) { position: relative; margin-top: 0; width: 4.1rem; height: 3.7rem; right: auto; left: auto; font-size: var(--font-12); font-weight: bold; color: var(--color-28); background-color: var(--color-ff); transition: all .5s ease; }
:is(.swiper-button-prev, .swiper-button-next):hover { color: var(--color-ff); background-color: var(--color-24); }
.swiper-button-prev::after { content: '\F284';font-family: bootstrap-icons !important; font-size: inherit; }
.swiper-button-next::after { content: '\F285'; font-family: bootstrap-icons !important; font-size: inherit; }
@media(max-width:1600px) {
 :is(.swiper-button-prev, .swiper-button-next) { width: 3.1rem; height: 2.7rem; }
 }
@media(max-width:767px) {
 :is(.swiper-button-prev, .swiper-button-next) { width: 3.1rem; height: 3.1rem; }

 }
@media (max-width: 350px) {
 :is(.swiper-button-prev, .swiper-button-next) { width: 3.1rem; height: 2.7rem; }
 }
.shine { position: relative; overflow: hidden; }
.shine::before { background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%); content: ""; display: block; height: 100%; left: -100%; position: absolute; top: 0; transform: skewX(-25deg); width: 50%; z-index: 2; }
.shine:hover::before, .shine:focus::before { -webkit-animation: shine 0.85s; animation: shine 0.85s; }
@-webkit-keyframes shine { 100% { left: 125%; }
 }
@keyframes shine {
 100% { left: 125%; }
 }

 .full-width{max-width: 1920px;margin-inline: auto;}
/* FormStyle */
select {font-size: var(--font-14);width: 100%; font-weight: 200; color: var(--color-00); appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url(../images/chevron-down.svg); background-repeat: no-repeat;background-size: 1.5rem 1.5rem; background-position:right .89rem center;padding: 1rem 1.5rem; padding-right: 3rem; }
select:focus { outline: none; box-shadow: none; }
.form-control {width: 100%;padding: 0.8rem 1.5rem;padding-left: 0;margin-bottom: 1.5rem;background-color: var(--color-ff);font-weight: 400;font-size: var(--font-16);line-height: normal;font-family: var(--font-Karla);color: var(--color-00);border: none;border-bottom: .1rem solid #E3E3E3; }
.form-control:focus { outline: none; box-shadow: none; border-color: var(--color-23); }
.form-control::placeholder { font-weight: 300; font-size: var(--font-16); color: var(--color-00); font-style: italic; }

select{width: 100%;padding: 0.8rem 1.5rem;padding-left: 0;margin-bottom: 1.5rem;background-color: var(--color-ff);font-weight: 400;font-size: var(--font-16);line-height: normal;font-family: var(--font-Karla);color: var(--color-00);border: none;border-bottom: .1rem solid #E3E3E3;font-weight: 300;
    font-style: italic;    background-size: 1rem 1rem; }

@media(max-width:1600px) {
 .form-control { width: 100%; padding: 0.5rem 1rem;padding-left: 0; margin-bottom: 1rem; }
 }
.form-check { display: flex; align-items: center; gap: 10px; padding-left: 0; }
.form-check p, .form-check-label { color: var(--color-00);  font-size: var(--font-16); line-height: var(--line-height-21); margin-bottom: 0; }
.form-check input[type=checkbox] { width: 17px; height: 17px; background-color: transparent; border: 1px solid #ccc; border-radius: 2px; }
.form-check input[type=checkbox] { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent; margin: 0; font: inherit; color: currentColor; width: 1.2em; height: 1.2em; flex-shrink: 0; border: 1px solid #ccc; border-radius: 1px; transform: translateY(-0.075em); display: grid; place-content: center; }
.form-check input[type=checkbox]::before { content: ""; width: 0.85em; height: 0.85em; -webkit-clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); transform: scale(0); transform-origin: bottom left; transition: 120ms transform ease-in-out; box-shadow: none; background-color: #37B418; }
.form-check input[type=checkbox]:checked::before { transform: scale(1) }
.form-check input[type=checkbox]:focus { outline: none; outline-offset: 0 }
.form-check input[type=checkbox]:disabled { color: var(--color-d4); cursor: not-allowed }
.form-check-input:checked { background-color: transparent; }

/* Custom Tab */
.tabs { list-style: none; padding: 0; margin: 0; display: flex; }
.custom_tabs>li{font-size: var(--font-21);line-height: var(--line-height-26);background-color: var(--color-ff);padding: 0.6rem 1.6rem;color: var(--color-23);font-weight: 400;font-family: var(--font-Karla);letter-spacing: -0.88px;margin-right: 1rem;transition: all .5s ease;}
.custom_tabs>li:last-child{margin-right: 0;}
.custom_tabs>li.active, .custom_tabs>li:hover{color: var(--color-ff);background-color: var(--color-77);}
.tab {margin-right: 5px;  }
.tab.disabled { background-color: #ccc; color: #888; cursor: not-allowed; }
.fade {opacity: 0;animation: fade 1s forwards;}

  @keyframes fade {
    to {opacity: 1;}
  }
.tab-content {position: relative;  }
.tab-pane { display: none;}
.tab-pane.active { display: block; }

.accordion-tabs {display: none;}
.accordion-tabs :focus {outline: none;}
.accordiontab-item {margin-bottom: 1rem;}
.accordion-item__label {display: flex;justify-content: space-between;gap: 1rem;position: relative;font-size: var(--font-18);line-height: var(--line-height-26);background-color: var(--color-77);cursor: pointer;padding: 1rem 1.5rem;color: var(--color-ff);font-weight: 400;font-family: var(--font-Karla);transition: all .5s ease;border: none;}
.accordion-item__label:after {content: '\F282';font-family: bootstrap-icons !important;font-size: var(--font-15);font-weight: 600;}
.accordion-item__label.active:after {content: '\F286';}
.accordion-item__container { height: 0;overflow: hidden;transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;opacity: 0;}
.accordion-item__container.active {padding-top: 1.5rem;height: auto; opacity: 1;}

@media (max-width: 767px) {
  .accordiontab-item {animation: none;opacity: 1;}
}
@media (min-width: 767px) {
  .accordion-tabs {display: inline-flex;margin-bottom: 3rem;}
  .accordion-tabs .accordion-tab {display: inline-block;width: auto;font-size: var(--font-22);line-height: 1;letter-spacing: -0.88px;background-color: var(--color-ff);padding: 0.7rem 1.6rem;color: var(--color-1f);font-weight: 400;border-radius: 0.4rem;font-family: var(--font-Karla);margin-right: 1rem;transition: all .5s ease;border: none;}
  .accordion-tabs .accordion-tab:hover { color: var(--color-1f);background-color: var(--color-f0);}
  .accordion-tabs .accordion-tab.active {color: var(--color-1f);background-color: var(--color-f0);}
  .accordiontab-item {display: none;border: none;background: transparent;margin-bottom: 0;}
  .accordiontab-item .accordion-item__label{display: none;}
  .accordion-item__label, .accordion-item__container {padding: 0;transition: inherit;}
  .accordion-item__label {margin-bottom: 1.5rem;}
  .accordiontab-item.accordion-active {display: block;}
  .accordion-item__container.active {padding: 0;}
  .accordiontab-item.accordion-active>.accordion-item__container {padding-top: 1.5rem;height: auto; opacity: 1;}
}

/* Accordian Css Start */

.accordion-item {background-color: transparent; margin-bottom: 2rem;}
.accordion-item-header {padding: 1.6rem 5.7rem 1.6rem 2.5rem;display: flex;align-items: center;position: relative;cursor: pointer;background: #F8F8F8;font-size: var(--font-16);line-height: 1.4;font-weight: bold;color: var(--color-28);letter-spacing: -0.1px;}
.accordion-item-header::after {content: '\F64D';font-family: bootstrap-icons !important;font-size: var(--font-20);position: absolute;font-weight: 200;right: 2.5rem;color: var(--color-f0);}
.accordion-item-header.active::after {content: "\F63B";padding-top: 2px;}
.accordion-item-body {display: none; overflow: hidden;background-color: rgb(255 255 255 / 86%);transition: max-height 0.5s ease-out;}
.accordion-item-body-content {padding: 1rem;line-height: 1.5rem;padding: 2rem 4.7rem 5.1rem 2.5rem; font-size: var(--font-16);line-height: 24px;color:#232323;}
.accordion-item-body-content .accordion-item-body-content{padding: 2.5rem ;}
.accordion-item-body-content p:last-child{margin-bottom: 0;}
.accordion-item-header.active{background: #F0F2F7;}
/* responsive start  */
@media(max-width:1399px){
 .accordion-item-header::after{padding-top: 0;}
 .accordion-item-header{padding: 1.6rem 4.7rem 1.6rem 2.5rem;}
}
@media(max-width:991px){
    .accordion-item-header {padding: 1.4rem 3.7rem 1.4rem 1.5rem;}
    .accordion-item-header::after{right: 1.5rem;}
    .accordion-item-body-content {padding: 2rem 2.7rem 3.1rem 1.5rem;}
}
@media(max-width:767px){
    .accordion-item-body-content {padding: 1.2rem; line-height: 1.5rem;}
    .accordion-item{margin-bottom: 1rem;}
    .accordion-item-body-content p{margin-bottom: 2rem;}
}
/*  UIAM - 02031998 End*/


/* Modal Css */
.modal {display: none;position: fixed;z-index: 1090;left: 0;top: 0;width: 100%;height: 100%;background-color: rgb(0 0 0 / 70%);backdrop-filter: blur(1px);align-items: center;justify-content: center;opacity: 0;visibility: hidden;transition: display 0.3 sease, opacity 0.3s ease, visibility 0.3s ease;}
.modal.show {opacity: 1;visibility: visible;display: flex;}
.inner_main:has(.modal.show) {z-index: 1090;}
body:has(.modal.show) .innerpage_banner{z-index: 0;}
body:has(.modal.show) {overflow: hidden;}
.modal-content {background: var(--color-ff);max-width: 70rem;width: 100%;position: relative;animation: ModalfadeIn 0.3s ease-in-out; display: flex;flex-direction: column; max-height: calc(100% - 3rem* 2);}
.closeModal {position: absolute;top: 0.5rem;right: 0.5rem;height: 3rem;width: 3rem;font-size: var(--font-21);line-height: normal;cursor: pointer;display: flex;align-items: center;justify-content: center;background-color: var(--color-17);color: var(--color-ff);opacity: 0.8;}
.closeModal:hover {opacity: 1;}
.modal-title{padding: 2rem;border-bottom: 0.1rem solid rgb(37 51 111 / 10%);padding-right: 6rem;}
.modal-body{position: relative;  flex: 1 1 auto;  padding: 2rem; overflow-y: auto;}
@keyframes ModalfadeIn {from { opacity: 0; transform: scale(0.9); }to { opacity: 1; transform: scale(1); }}

/* livewire pagination */


.pagination-wrapper { text-align: center; margin-top: 20px; }
.pagination { display: inline-flex; list-style: none; padding: 0; border-radius: 4px; gap: 5px; }
.pagination li { display: inline; }
.pagination li a,
.pagination li span {display: inline-block;padding: 6px 12px;border: 1px solid #ddd;color: var(--color-28);text-decoration: none;border-radius: 4px;cursor: pointer;transition: background 0.3s;font-size: var(--font-14);}
.pagination li a:hover { background-color: #f0f0f0; }
.pagination li.active span {background-color: var(--color-23);color: var(--color-ff);border-color: var(--color-23);}
.pagination li.disabled span { color: #ccc; border-color: #ddd; cursor: not-allowed; }


/*  Modal Form */
.modal-body .form-group .form-control{padding: 0.8rem 1.5rem;border: .1rem solid #E3E3E3;}
.modal-body .form-group label{margin-bottom: 0.5rem;display: block;font-size: var(--font-14);letter-spacing: -0.5px;color: var(--color-17);font-weight: 500;}
.modal-body form .submit-btn {display: inline-flex;align-items: center;justify-content: center;color: var(--color-17);background-color: var(--color-f0);font-weight: 600;border: none;font-size: var(--font-14);padding: 0.9rem 2.7rem;background: linear-gradient(to right, var(--color-23) 49%, var(--color-f0) 49%);background-size: 210% 110%;background-position: right bottom;transition: all 0.5s ease-out;}
.modal-body form .submit-btn:hover {background-position: left bottom;color: var(--color-ff);}

/* Reveal Animations */
.image, .image2{opacity: 0;}
.reveal-image,
.reveal-image:after {position: absolute;animation-delay: 0s;animation-iteration-count: 1;animation-duration: 1600ms;animation-fill-mode: both;animation-timing-function: ease-in-out;}
.reveal-image2,
.reveal-image2:after {position: absolute;animation-delay: .1s;animation-iteration-count: 1;animation-duration: 1800ms;animation-fill-mode: both;animation-timing-function: ease-in-out;}
.reveal-image {opacity: 1;position: relative;animation-name: reveal-image;}
.reveal-image2 {opacity: 1;position: relative;animation-name: reveal-image2;}
.reveal-image3 {opacity: 1;position: relative;animation-name: fadeInline1;animation-delay: .1s;animation-iteration-count: 1;animation-duration: 1800ms;animation-fill-mode: both;animation-timing-function: ease-in-out; transform-origin: top;}

@keyframes reveal-image {
    from { clip-path: inset(0 100% 0 0);}
    to { clip-path: inset(0 0 0 0);}
}

@keyframes reveal-image2 {
    from {
      clip-path: inset(0 0% 100% 0);
    }
    to {
      clip-path: inset(0 0 0 0);
    }
}
.image-container {position: relative;overflow: hidden;padding-bottom: calc(50% / (var(--ratio)));}


body:has(.search_sec) .main_section.about_us_section{padding-bottom: 5rem;}
@media(max-width:1700px){
    body:has(.search_sec) .main_section.about_us_section{padding-bottom: 4rem;}
}
@media(max-width:1500px){
    body:has(.search_sec) .main_section.about_us_section{padding-bottom: 3rem;}
}
.link{
 position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 99;
        font-size: 0;
}
ul{
    list-style-type: none;
    text-decoration: none;
    padding: 0px;
}
.main_section{
    padding: 8rem 0;

}
.main_section.about_us_section{
    padding: 15rem 0 0;
}
.main_section.about_us_section.programs-detail {
    padding: 15rem 0 5rem;
}

.img-baner {
    width: 100%;
    object-fit: cover;
        background-size: cover !important;
    background-position: bottom !important;
}
.line{
    position: relative;
}
.line:before{
        content: '';
    background: #2638684a;
    width: 75%;
    height: 1px;
    position: absolute;
    left: 0;
    top: -8rem;
}

.line:after{
    content: '';
    background: #2638684a;
    height: 20%;
    width: 1px;
    position: absolute;
    left: 0rem;
    top: -8rem;
}
.pt-0{ padding-top: 0!important;}

.line1{
    position: relative;
}
.line1:before{
      content: '';
    background: #2638684a;
    width: 30%;
    height: 1px;
    position: absolute;
    right: -6rem;
    top: 2rem;
}

.line1:after{
     content: '';
    background: #2638684a;
    height: 39%;
    width: 1px;
    position: absolute;
    right: -6rem;
    top: 2rem;
}


.message-btn {
    background: var( --color-23);
    padding: 10px 30px;
    margin: 0 7px;
    color: #fff;
    font-size: var(--font-15);
    position: relative;
    transition: 1s;
    -webkit-transition: 1s;
    z-index: 1;
}

.message-btn:before{
    content: '';
    background: var(--color-17);
    width: 0%;
    position: absolute;
    height: 100%;
    left: 0;
    transition: 1s;
    -webkit-transition: 1s;
    top: 0;
}

.message-btn:hover:before{
    width: 100%;
}

.message-btn:hover {
    color: #fff;

}
.message-btn span{
    z-index: 9;
    position: relative;
}
.message-box .message-btn:before{
    height: 45px;
}


/* about css */
.technology-line{
    position: relative;
        margin-bottom: 2rem;
}
.technology-line:before{
   content: '';
    border: 1px solid #26386880;
    position: absolute;
   width: 82%;
    left: 13rem;
    height: 91%;
    top: 1rem;
    z-index: 0;
    right: -4rem;
}
.student-box{
    position: relative;
    gap: 7rem !important;
}

.left-student-box{
    position: relative;
}
.student-img{
    position: relative;
}
.cus-student-text {
    position: absolute;
    right: 0;
    bottom: 4rem;
    background-color: var(--color-ff);
    padding: 1.5rem 3rem;
        display: flex;
    align-items: center;
    justify-content: center;
}
.cus-student-text::after{
    content: '';
    background-color: var(--color-15);
    left: 0;
    position: absolute;
    bottom: 0;
    height: .2rem;
    width: 100%;
}
.student-heding{
    margin-right: 2rem;
}
.student-heding h2{
    font-size: var(--font-60);
    color: var(--color-17);
    font-family: var(--font-Barlow);
    letter-spacing: -1.44px;
        font-weight: 600;
}
.student-content p{
    margin-bottom: 0;
    font-size: var(--font-18);
    letter-spacing: -0.63px;
     color: var(--color-00);

}
.right-student-box {
    width: 75%;
    position: relative;
}
.right-student-box::before{
    content: '';
    background-color: var(--color-f5);
    position: absolute;
    left: -7rem;
    height: 100%;
    width: 12%;
}
.right-student-box p{
       font-size: var(--font-14);
    color: var(--color-00);
       letter-spacing: -0.21px;
}
.student-including {
       border-top: 1px solid #6666661f;
      padding: 3rem 0 0 0;
    margin-top: 3rem;
}
.student-including-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-bottom: 2rem;
}
.student-including-box{
     background-color: var(--color-ff);
     text-align: center;
     padding: 1rem;
}
.student-including-box span{
font-family: var(--font-Geist);
font-size: var(--font-16);
color: var(--color-23);
}
.excellence{
    padding-bottom: 0;
}
.housed{
    padding: 0;
}
.housed p{
    margin-bottom: 0;
}
.cus-highlight{

}
.cus-highlight .highlight-text {
    margin: 0rem 0 4rem;
}
.disciplines-line::before{
        height: 43%;
            width: 81%;
}
.cus-disciplines-text{
    position: relative;
    z-index: 1;
}

.cus-disciplines-text::before {
    content: '';
    background-color: var(--color-f5);
    position: absolute;
    left: -7rem;
    height: 100%;
    width: 119.8%;
    z-index: -1;
}
.discipline-img {
    margin-right: -7.5rem;
}
.provide-list{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 7rem;
}
.provide-img {
    margin: -6rem 0 0 7rem;
}
.title_bar28 h3{ font-size: var(--font-28); font-weight: 700; letter-spacing: -1.68px; font-family: var(--font-Karla);margin-bottom: 1.5rem;}
.font_21{
    font-size: var(--font-21); letter-spacing: -0.53px;
}

@media screen and (max-width:991px){
    .main_section{
        padding: 5rem 0;
    }
}
   .best-practice2 .achievment_content {
    padding: 0 0 0 5rem;
}
.best-practice3 blockquote{
    margin-bottom: 3rem;
}
.best-practice3 ul li{
    margin-bottom: 2rem;
}
.best-practice3 ul li::marker{
    color: var(--color-f0);
    font-size: 18px;
}
.about-cell-sec.best-practice4 {
    padding: 5rem 0 6rem;
}
.best-practice4 .life-jku-text {
    margin-top: 0;
    padding-left: 5rem;
}
.best-practice4  .campus-living-in{
    padding-left: 0rem;


}
.best-practice6 .campus-living-in {
    padding-right: 7rem;
    padding-left: 0;
}
.about-cell-sec.best-practice6 {
padding-top: 0;
}
.best-practice7 .sport-reac-in p{
padding-right: 3rem;
}
.best-practice7  .sport-reac-grid{
    gap:4rem;
}
.pdb_1{
    padding-bottom: 1rem;
}
.sports-reaction.best-practice7 {
    background: #fff;
padding-bottom: 0rem;
}
.best-practice7 .career-bg {
    background-color: transparent;
}
.best-practice7  .sport-reac-in h4{
    font-size: var(--font-28);
    font-weight: 600;
color: var(--color-17);
}

.best-practice7 .sport-reac-in p{
    color:var(--color-28)
}
.practice7.about-cell-sec.best-practice6{
    padding-top: 10rem;
    padding-bottom: 10rem;
}

.mission-in-list{
grid-template-columns: repeat(1, 1fr);
}
.mission-in-list li::after{display: none;}
.mission-in-list li{padding: 0;}

.hum-fac1 .facilities-slide-2ndsection_Cnt{
    padding-top: 2rem;
}
.facilites-section.hum-fac1{
    padding-bottom: 3rem;
}
.hum-fac3.fingertips h2{
line-height: 1.3;
}
.main_section.resource-gen.hum-fac2{
    padding-top: 1rem;
}
.hum-fac4 .pdt_5 {
    padding-top: 6rem;
}
.key-points{
    padding-top: 2rem;
}
.key-points ul li span{
    color: var(--color-28);
    font-size: var(--font-21);
    font-weight: 600;
}
.key-points ul.custom_bullet li:before{
    top:13px;
}
.college-section.hum-abt2{
    padding-bottom: 0;
}

.table-responsive{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}