@import url('https://fonts.googleapis.com/css2?family=Anton&family=Bebas+Neue&family=Figtree:ital,wght@0,300..900;1,300..900&family=Kalam:wght@300;400;700&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playwrite+IN:wght@100..400&family=Poppins: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=Roboto:ital,wght@0,100..900;1,100..900&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&family=Tangerine:wght@400;700&display=swap');





@font-face {

    font-family: 'aether';

    src: url("../fonts/Aether_Sans.ttf");

}



@font-face {

    font-family: 'resonateEl';

    src: url("../fonts/Resonate-ExtraLight.ttf");

}



@font-face {

    font-family: 'resonateEb';

    src: url("../fonts/Resonate-ExtraBold.ttf");

}



html,

body {



    background-color: black;

    overflow-x: hidden;

    margin: 0;

    padding: 0;

}



p,

h1,

h2,

h3,

h4 {

    padding: 0;

    margin: 0;

}



.mob_nav_logo_date {

    display: none;

}



nav {

    display: flex;

    align-items: center;

    justify-content: space-between;

    height: 6vw;

    position: fixed;

    top: 0;

    width: 100%;

    padding-top: 20px;

    z-index: 10;

    transition: all 0.3s ease;

}



.navScroll {

    padding-top: 0;

    background-color: #000000;

}



.navFirst {

    display: flex;

    align-items: center;

    justify-content: center;

    width: fit-content;

    margin-left: 60px;

    gap: 40px;

}



.nav_logo_date {

    display: flex;

    align-items: center;

    gap: 1vw;

}



.dateWrapper {

    color: white;

    border-left: 1px solid rgba(255, 255, 255, 0.523);

    padding-left: 1vw;

}



.nav_date {

    font-family: "figtree";

    font-weight: 600;

    font-size: 1.3vw;

    position: relative;

    line-height: 1vw;

}



.nav_date sup {

    font-size: 0.6vw;

    position: absolute;

    top: -0.5vw;

    font-weight: 400;

}



.nav_month {

    font-family: "figtree";

    font-size: 0.8vw;

}



.nav_year {

    font-family: "figtree";

    font-weight: 600;

    color: #ffffff;

}



.navFirst img {

    width: 250px;

}



.navFirst ul {

    list-style: none;

    display: flex;

    align-items: center;

    gap: 30px;

}



.navFirst ul li a {

    font-family: "figtree";

    font-size: 14px;

    font-weight: 600;

    color: white;

    cursor: pointer;

    text-decoration: none;

}



.navSecond {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 30px;

    margin-right: 50px;

}



.navSecond svg {

    stroke: white;

    width: 30px;

}



.search-box {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 15px;

}



#navSearch {

    background: none;

    border: none;

    background-color: #ffffff2c;

    padding: 10px;

    border-radius: 10px;

}



.search-box button {

    background: none;

    border: none;

}



.apps svg {

    stroke: white;

    width: 40px;

}



.appsactive svg {

    stroke: #C40C0C;

}



.nav-button {

    width: 120px;

    padding: 13px;

    font-size: 14px;

    background: linear-gradient(45deg, #FF6500, #9f4000);

    color: white;

    display: flex;

    align-items: center;

    justify-content: center;

    font-family: "figtree";

    font-weight: 600;

    cursor: pointer;

}



/* nav_social */

.nav_social {

    width: 15%;

    height: 100vh;

    position: fixed;

    background-color: #9f9f9f47;

    z-index: 9;

    right: -15%;

    backdrop-filter: blur(10px);

    display: flex;

    align-items: center;

    justify-content: center;

    transition: all 0.3s ease;

}



.nav_social_boxes {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 1.5vw;

}



.nav_socialBox {

    font-size: 2vw;

}



.nav_socialBox a {

    color: white;

}



.activeSocial {

    right: 0;

}



@media screen and (max-width : 1400px) {

    .navFirst img {

    width: 200px;

}



.navFirst ul li a {

    font-size: 13px;

}



.nav-button {

    width: 110px;

    padding: 11px;

    font-size: 13px;

}



.navSecond {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 30px;

    margin-right: 50px;

}



.navSecond svg {

    stroke: white;

    width: 25px;

}



.search-box {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 15px;

}



#navSearch {

    background: none;

    border: none;

    background-color: #ffffff2c;

    padding: 10px;

    border-radius: 10px;

    width: 40%;

}







.apps svg {

    width: 30px;

}



}



/* cover */

.cover {

    width: 100%;

    height: 100vh;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

}



.coverVideo {

    width: 100%;

    height: 100vh;

    object-fit: cover;

    position: absolute;

}



.coverOverlay {

    width: 100%;

    height: 100vh;

    position: absolute;

    z-index: 2;

    background-color: rgba(0, 0, 0, 0.549);

}



@keyframes popAndMove {

    0% {

        transform: scale(1.4);

        left: 28vw;

    }



    20% {

        transform: scale(1);

        left: 28vw;

    }



    50% {

        left: 32vw;

        transform: rotate(90deg);

    }



    100% {

        left: 28vw;

    }

}



.banner_vector {

    width: 30px;

    position: absolute;

    z-index: 5;

    left: 22vw;

    top: 30vh;

    animation: popAndMove 4s ease-in-out infinite forwards;

}



.cover_glow {

    width: 30vw;

    height: 40vw;

    position: absolute;

    z-index: 5;

    background-color: #FF6500;

    border-radius: 50%;

    filter: blur(150px);

    right: -20vw;

}



.coverOverlay2 {

    width: 100%;

    height: 100vh;

    background: linear-gradient(transparent, transparent, #000000);

    position: absolute;

}



.white_logo {

    width: 50vw;

    position: absolute;

    z-index: 8;

    bottom: -3vw;

    right: 2vw;

    opacity: 0.1;

}



.coverContent {

    width: 80%;

    height: 100%;

    position: relative;

    z-index: 4;

    display: flex;

    flex-direction: column;

    justify-content: center;

}



.date-place {

    color: white;

    font-family: "figtree";

    font-weight: 600;

    font-size: 1.1vw;

    margin-top: 7vw;

}



.tagLine {

    font-size: 5vw;

    color: white;

    font-family: "resonateEb";

    letter-spacing: 2px;

    width: 70%;

    line-height: 5vw;

    text-transform: uppercase;

    position: relative;

    padding-bottom: 1vw;

    margin-top: 1vw;

}



.color {

    color: #FF6500;

}



.style {

    font-family: "resonateEl";

}



.stroke {

    color: transparent;

    -webkit-text-stroke: 0.1vw white;

}



.tagLine::after {

    content: "";

    width: 30%;

    height: 1px;

    background-color: #C40C0C;

    position: absolute;

    bottom: 0;

    left: 0;

}



.covButtons {

    margin-top: 2vw;

    display: flex;

    gap: 1vw;

}



.covButton {

    width: 9vw;

    height: 2.5vw;

    font-family: "figtree";

    font-weight: 500;

    border-radius: 0;

    border: none;

    color: white;

    font-size: 0.8vw;

    font-weight: 600;

    background: linear-gradient(45deg, #FF6500, #9e3f00);

    cursor: pointer;

}



.covButton:nth-child(2) {

    border: 2px solid #FF6500;

    background: #FF650028;

    backdrop-filter: blur(10px);

    position: relative;

    overflow: hidden;

}



.covButton .glow {

    width: 2vw;

    height: 2vw;

    border-radius: 50%;

    background-color: #FF6500;

    position: absolute;

    filter: blur(20px);

    top: 0

}



.covButton .text {

    position: relative;

    z-index: 2;

}



/* past_sponsors */

.past_sponsors {

    width: 100%;

    height: 100vh;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    position: relative;

}



.past_sponsors h2 {

    font-size: 3vw;

    color: white;

    font-family: "resonateEb";

    text-transform: uppercase;

    position: relative;

    z-index: 2;

}



.past_sponsors h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    font-size: 1vw;

    gap: 0.4vw;

    position: relative;

    z-index: 2;

}



.past_sponsors h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.past_sponsors h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}



.ps_content {

    width: 100%;

    min-height: 38vh;

    margin-top: 2vw;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 10px;

    position: relative;

    background-color: #000000;

    z-index: 2;

}



.pscr_design .item {

    height: 7vw;

    display: flex;

    align-items: center;

    justify-content: center;

    /* border: 1px solid rgba(255, 255, 255, 0.207); */

}



.pscr_design .item .ps_sponImg {

    width: 60%;

    opacity: 0.8;

    filter: brightness(0) invert(1);

}



.ps_glow {

    width: 80%;

    height: 36vh;

    position: absolute;

    background: linear-gradient(45deg, #C40C0C, #FF6500);

    margin-top: 20vh;

    border-radius: 50%;

    filter: blur(100px);

}







/* cs25 */

.cs25_leaders {

    width: 100%;

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;



}



.cs25-content {

    width: 80%;

    height: 80%;

}



.cs25-heading {

    width: fit-content;

}



.cs25-heading h2 {

    font-size: 2vw;

    color: white;

    font-family: "resonateEb";

    text-transform: uppercase;

    position: relative;

    z-index: 2;

}



.cs25-heading h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    font-size: 1vw;

    gap: 0.4vw;

    position: relative;

    z-index: 2;

}



.cs25-heading h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.cs25-heading h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}



.leaders-carousel {

    width: 90%;

    margin: 0 auto;

}



.leaders-carousel .item {

    height: 22vw;

}



.cs25_leaders_boxes {

    margin-top: 4vw;

}



.leaders-carousel .item .leader-box {

    width: 100%;

    height: 100%;

}



.leader-bg1 {

    width: 80%;

    height: 100%;

    background-color: #262626;

    position: absolute;

    right: 0;

    border-radius: 1vw;

}



.leader-bg2 {

    width: 30%;

    height: 55%;

    border-radius: 1vw;

    background-color: #262626;

    bottom: 0;

    position: absolute;

}



.leader-bg3 {

    width: 20%;

    height: 45%;

    background-color: rgb(0, 0, 0);

    border-radius: 1vw;

}



.leader-bg4 {

    width: 25%;

    height: 60%;

    border-radius: 1vw;

    background-color: #262626;

    position: absolute;

    left: 3vw;

    top: 3vw;

    z-index: -1;

}



.leader-bg5 {

    width: 100%;

    height: 100%;

    display: flex;

    align-items: end;

    justify-content: center;

    z-index: 3;

    position: absolute;

    top: 0;

    overflow: hidden;

    border-radius: 1vw;

}



.leaders-carousel .item .leader_img {

    width: 100%;

    transform: translateY(5vw);

    margin-left: 1vw;

}



.leader-content {

    width: 80%;

    margin: 0 auto;

    position: absolute;

    display: flex;

    flex-direction: column;

    align-items: center;

    z-index: 3;

    transition: all 0.3s ease;

    transform: translateY(15vw);

    padding-bottom: 1vw;

}



.leader-content .leader-name {

    color: white;

    font-family: "resonateEb";

    text-transform: uppercase;

    font-size: 1.1vw;

    line-height: 1.1vw;

    text-align: center;

}



.leader-job {

    font-family: "figtree";

    color: white;

    font-weight: 500;

    text-align: center;

    padding: 0.3vw 0;

}



.leader-comp {

    font-family: "figtree";

    color: white;

    font-weight: 800;

    text-align: center;

    padding: 0.3vw 0;

}



.leader-content-glow {

    width: 100%;

    height: 100%;

    position: absolute;

    z-index: 2;

    top: 0;

    border-radius: 1vw;

    background: linear-gradient(transparent, transparent, #FF6500);

    opacity: 0;

    transition: all 0.3s ease;

}



.leader-patch {

    width: 15%;

    height: 42%;

    border-radius: 2vw;

    background-color: #313131d2;

    position: absolute;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    font-family: "resonateEb";

    font-size: 0.8vw;

    color: rgba(255, 255, 255, 0.418);

}



.leaders-carousel .item:hover .leader-content {

    transform: translateY(0);

}



.leaders-carousel .item:hover .leader-content-glow {

    opacity: 1;

}



.owl-carousel .owl-nav button.owl-next,

.owl-carousel .owl-nav button.owl-prev,

.owl-carousel button.owl-dot {

    color: white;

    font-size: 2vw;

    position: absolute;

    top: -15vh;

    right: 0;

    width: 3vw;

    height: 3vw;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    border: 2px solid rgba(255, 255, 255, 0.512);

    z-index: 10;

}



.owl-carousel .owl-nav button.owl-prev {

    right: 4vw;

}



.owl-carousel .owl-nav button.owl-prev span {

    transform: translate(-0.1vw, -0.2vw);

}



.owl-carousel .owl-nav button.owl-next span {

    transform: translate(0.1vw, -0.2vw);

}



.owl-carousel .owl-nav button.owl-next:hover,

.owl-carousel .owl-nav button.owl-prev:hover {

    background: #645a00;

    border: 2px solid #645a00;

}



/* overview */

.overview {

    width: 100%;

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    background-image: url("../images/over-bg.jpg");

    background-size: cover;

    position: relative;

}



.o-circles {

    position: absolute;

    width: 20vw;

    height: 20vw;

    right: -4vw;

    top: -3vw;

    z-index: 5;

    overflow: hidden;

}



.o-circle {

    width: 10vw;

    height: 10vw;

    border-radius: 50%;

    border: 1px solid rgba(255, 255, 255, 0.685);

    position: absolute;

    top: 40%;

    left: 45%;

    animation: oscillate 4s ease-in-out infinite;

}



/* Create slight differences using nth-child */

.o-circle:nth-child(2) {

    animation-delay: 0.5s;

    transform: scale(1.05);

}



.o-circle:nth-child(3) {

    animation-delay: 1s;

    transform: scale(1.1);

}



/* Keyframe for oscillating motion (circular path) */

@keyframes oscillate {

    0% {

        transform: translate(0, 0);

    }



    25% {

        transform: translate(10px, -10px);

    }



    50% {

        transform: translate(0px, -20px);

    }



    75% {

        transform: translate(-10px, -10px);

    }



    100% {

        transform: translate(0, 0);

    }

}



.over-glow {

    width: 30vw;

    height: 30vw;

background: linear-gradient(45deg,#FF6500,#C40C0C);

    position: absolute;

    border-radius: 50%;

    filter: blur(150px);

    left: -20vw;

}



.overContent {

    width: 80%;

    height: 80vh;

    margin-top: 10vh;

    display: flex;

    justify-content: center;

    position: relative;

}



.overContentBox {

    width: 30%;

    height: 100%;

    padding: 1.2vw;

}



.overContentBox h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    font-size: 1vw;

    gap: 0.4vw;

    position: relative;

    z-index: 2;

}



.overContentBox h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.overContentBox h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}



.overContentBox h2 {

    color: white;

    font-family: "resonateEb";

    font-size: 2vw;

    margin-top: 0.5vw;

    position: relative;

    letter-spacing: 0.1vw;

    line-height: 2.2vw;

}



.overContentBox h2::after {

    content: "";

    width: 30%;

    height: 1px;

    background-color: #FF6500;

    position: absolute;

    bottom: -0.2vw;

    left: 0;

}



.overContentBox p {

    color: rgb(255, 255, 255);

    font-family: "figtree";

    font-size: 1.05vw;

    line-height: 1.7;

    margin-top: 1.6vw;

    font-weight: 400;

}



.overNumbers {

    width: 30%;

    height: 80%;

    padding: 1vw;

    margin-left: 2%;

    margin-right: 2%;

}



.overNumbers h2 {

    color: white;

    font-family: "figtree";

    font-weight: 300;

    text-transform: uppercase;

    font-size: 1.5vw;

}



.numBoxes {

    width: 90%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 0.7vw;

    margin-top: 1vw;



}



.numBox {

    width: 100%;

    height: 6.3vw;

    background-color: rgba(108, 108, 108, 0.225);

    border-radius: 1vw;

    display: flex;

    align-items: center;

    gap: 1vw;

    backdrop-filter: blur(1px);

    overflow: hidden;

}



.num-dig {

    margin-left: 1vw;

    display: flex;

    align-items: center;

    font-size: 4vw;

    gap: 0.3vw;

    width: 35%;

}



.numBox-patch {

    width: 5vw;

    height: 5vw;

    background-color: #C40C0C;

    position: absolute;

    border-radius: 50%;

    filter: blur(60px);

    right: 30%;

    bottom: -3vw;

}



.num-dig .odometer {

    font-family: "bebas neue";

    color: #FF6500;

}



.num-dig .num-plus {

    font-size: 2vw;

    font-weight: 900;

    font-family: "figtree";

    color: #ffffff;

    transform: translateY(-0.4vw);

}



.num-des {

    font-family: "figtree";

    color: white;

    font-size: 1vw;

    font-weight: 500;

    padding-left: 0.5vw;

    border-left: 1px solid rgba(255, 255, 255, 0.195);

}



.overImage {

    width: 34%;

    height: 100%;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

}



.over-img-box2 {

    width: 30vw;

    height: 30vw;

    position: absolute;

    right: -15%;

}



.over-img-circle {

    width: 100%;

    height: 100%;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

}



.over-img-circle img {

    width: 100%;

}



.over-cirpatch {

    width: 50%;

    height: 100%;

    position: absolute;

    right: 0;

    background-color: rgb(0, 0, 0);

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: center;

}



.over-cir-patch-circle {

    width: 18vw;

    height: 18vw;

    position: absolute;

    border: 3.5vw solid #FF6500;

    border-radius: 50%;

    left: -11.5vw;

    display: flex;

    align-items: center;

    justify-content: center;

    animation: rotate 10s linear infinite;

}



.over-circle-patch {

    width: 20vw;

    height: 20vw;

    position: absolute;

    border-radius: 50%;

    top: 0vw;

    right: -19vw;

    z-index: 3;

    border: 1px solid rgba(0, 0, 0, 0.147);

}



.over-circle {

    width: 24vw;

    height: 24vw;

    border-radius: 50%;

    display: flex;

    justify-content: center;

    align-items: center;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 2;

    position: absolute;

}



@keyframes rotate {

    0% {

        transform: rotate(0deg);

    }



    100% {

        transform: rotate(360deg);

    }

}



.over-circle-text {

    position: absolute;

    width: 100%;

    height: 100%;

}



.over-circle-text span {

    position: absolute;

    left: 50%;

    transform-origin: 0vw 11.8vw;

    font-size: 1.2vw;

    font-weight: bold;

    font-family: "figtree";

    color: white;

    font-weight: 800;

}



.over-dots {

    display: flex;

    position: absolute;

    z-index: 2;

    gap: 0.4vw;

    max-width: 190px;

    flex-wrap: wrap;

    top: 3vw;

    left: 0;

}



.over-dots .dot {

    width: 2px;

    height: 2px;

    border-radius: 50%;

    background-color: rgb(237, 236, 242);

}



.triange-right {

    display: flex;

    height: fit-content;

    position: absolute;

    right: 0;

    bottom: 0;

}



.over-t {

    width: 1vw;

}



.gap-line {

    width: 80%;

    height: 3px;

    background-color: rgba(255, 255, 255, 0.462);

    margin: 4vw auto;

    border-radius: 10px;

}



/* countdown */

.countdown {

    width: 100%;

    height: auto;

    background-size: cover;

    display: flex;

    align-items: center;

    justify-content: center;

    position: relative;

}



.countdownCont {

    width: 80%;

    height: 700px;

    /* background: linear-gradient(135deg, rgb(39, 39, 40), #371f40, #231320); */

    border-radius: 2vw;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 40px;

    overflow: hidden;

    position: relative;

    background-image: url("../images/countdown_bg.jpg");

    background-size: cover;

    border: 2px solid rgb(65, 65, 65);

}



.countdown-wrapper {

    display: flex;

    gap: 40px;

    width: 60%;

    position: relative;

    overflow: hidden;

    height: 100%;

    align-items: center;

}



.time-units {

    display: flex;

    color: transparent;

    gap: 50px;

    font-size: 80px;

    font-family: "resonateEb";

    -webkit-text-stroke: 2px #FF6500;

}



.unit {

    display: flex;

    align-items: baseline;

    gap: 8px;

    position: relative;

    z-index: 3;

}



.unit::after {

    content: "";

    width: 1px;

    height: 100px;

    background-color: #C40C0C;

    position: absolute;

    right: -25px;

}



.unit:first-child::after {

    height: 200px;

    transform: translateY(-45px);

}



.unit:nth-child(2):after {

    height: 150px;

    transform: translateY(-20px);

}



.unit label {

    font-size: 18px;

    font-weight: 800;

    color: #d5d5d5;

    -webkit-text-stroke: 0px;

    font-family: "resonateEl";

}



.seconds-circle-container {

    width: 1200px;

    height: 1200px;

    position: absolute;

    transform: translate(-620px, -20px);

}



.numbers-container {

    width: 100%;

    height: 100%;

    position: relative;

    transition: transform 0.5s ease-in-out;

}



.number {

    position: absolute;

    width: 30px;

    height: 30px;

    text-align: center;

    line-height: 60px;

    font-size: 50px;

    color: rgba(255, 255, 255, 0.2);

    transform-origin: center;

    pointer-events: none;

    transition: all 0.3s ease;

    font-family: "resonateEb";

}



.number.active {

    color: transparent;

    -webkit-text-stroke: 1px #FF6500;

    font-size: 60px;

    line-height: 50px;

    font-weight: bold;

    z-index: 10;

}



.countDownHeading {

    color: #bebebe;

    width: 40%;

    padding-left: 5%;

    position: relative;

    z-index: 3;

    display: flex;

    align-items: center;

    font-family: "resonateEb";

    font-size: 60px;

    height: 100%;

    text-transform: uppercase;

    line-height: 65px;

}



.countdown-circle {

    width: 2vw;

    z-index: 8;

    height: 2vw;

    position: absolute;

    right: 20px;

    bottom: 20px;

    border: 1.5vw solid rgba(255, 255, 255, 0.096);

    border-radius: 50%;

}



.countdownCont .triange-right {

    z-index: 5;

    top: 3vw;

    left: 6%;

}



.countDownOverlay {

    width: 100%;

    position: absolute;

    height: 100%;

    background: #000000;

}



.seconds-circle-container label {

    font-size: 18px;

    font-weight: 800;

    color: #888;

    z-index: 3;

    font-family: "resonateEl";

    position: absolute;

    transform: translate(660px, -143px);

}



.countdownCont-glow {

    width: 20vw;

    height: 20vw;

    position: absolute;

  background: linear-gradient(45deg,#FF6500,#C40C0C);

    z-index: 2;

    border-radius: 50%;

    filter: blur(100px);

    top: -10vw;

}



.countdown_glow {

    position: absolute;

    width: 15vw;

    height: 15vw;

    background-color: white;

    border-radius: 50%;

    filter: blur(100px);

    right: -13vw;

    top: -8vw;

}



@media screen and (max-width : 1600px) {

    .countDownHeading {

        width: 40%;

        font-size: 43px;

        line-height: 43px;

    }



    .time-units {

        gap: 50px;

        font-size: 60px;

    }



    .unit {

        gap: 8px;

    }



    .unit label {

        font-size: 16px;

    }





    .number {

        position: absolute;

        width: 30px;

        height: 30px;

        text-align: center;

        line-height: 40px;

        font-size: 40px;

    }



    .number.active {

        font-size: 40px;

        font-weight: bold;

        transform: scale(1.5);

        z-index: 10;

    }



    .countdownCont {

        width: 80%;

        height: 400px;

    }



    .seconds-circle-container {

        transform: translate(-620px, -10px);

    }



    .unit::after {

        content: "";

        width: 1px;

        height: 80px;

        background-color: rgba(255, 255, 255, 0.196);

        position: absolute;

        right: -15px;

    }



    .unit:first-child::after {

        height: 150px;

        transform: translateY(-45px);

    }



    .unit:nth-child(2):after {

        height: 100px;

        transform: translateY(-20px);

    }



}



.simple_para_wrapper {

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 5vw 0;

    position: relative;

}



.simple_glow {

background: linear-gradient(45deg,#FF6500,#C40C0C);

    width: 80%;

    position: absolute;

    height: 16vw;

    border-radius: 50%;

    filter: blur(100px);

}



.simple_pic {

    position: absolute;

    width: 40vw;

    top: -12vw;

    left: 10vw;

    z-index: 2;

}



.simple_para {

    width: 100%;

    color: white;

    padding: 3vw 0vw;

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 7vw 0vw;

    background-color: #000000;

    z-index: 5;

    flex-direction: column;

}



.simple_para h3 {

    font-family: "kalam";

    color: #C40C0C;

    font-size: 1.2vw;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

}



.simple_para h3::before {

    content: "";

    width: 60%;

    height: 1px;

    background-color: #f5f5f5;

    position: absolute;

    bottom: 0;

}



.simple_para h3::after {

    content: "";

    width: 40%;

    height: 1px;

    background-color: #ffffff;

    position: absolute;

    bottom: -0.5vw;

}



.simple_para p {

    width: 70%;

    font-size: 2vw;

    font-family: "figtree";

    font-weight: 300;

    margin-top: 2vw;

}



/* market */

.market {

    width: 100%;

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    position: relative;

}



.market .o-circles {

    right: auto;

    left: -12vw;

}



.squares {

    position: absolute;

    left: 2vw;

    margin-top: 20vw;

}



.d-square {

    width: 5vw;

    height: 5vw;

    border: 1px solid rgb(73, 73, 73);

}



.d-square:nth-child(1) {

    transform: rotate(45deg) translate(1.5vw, 1.5vw);

}



.d-square:nth-child(2) {

    transform: rotate(45deg);

}



.d-square:nth-child(3) {

    transform: rotate(45deg) translate(-1.5vw, -1.5vw);

}



.market_glow {

    width: 30vw;

    height: 30vw;

    border-radius: 50%;

    filter: blur(150px);

    position: absolute;

    background: linear-gradient(45deg, #FF6500, #C40C0C);

    right: -15vw;

}



.marketContent {

    width: 80%;

    height: auto;

    min-height: 90vh;

    position: relative;

}



.marketContent h2 {

    color: white;

    font-family: "resonateEb";

    font-size: 2.5vw;

}



.marketContent h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    font-size: 1vw;

    gap: 0.4vw;

    position: relative;

    z-index: 2;

}



.marketContent h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.marketContent h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}



.marketContentBoxes {

    width: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.marketLeft {

    width: 50%;

    height: 34vw;

    margin-top: 2vw;

}



.marketRight {

    width: 50%;

    height: 34vw;

    margin-top: 2vw;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

}



.marketRight .over-dots {

    bottom: -2vw;

    top: auto;

    margin-left: -6vw;

}



.marketRight .over-dots .dot {

    background-color: #FF6500;

}



.marketCircle {

    position: absolute;

    width: 9vw;

    height: 9vw;

    background-color: #000000;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.marketInCircle {

    width: 6vw;

    height: 6vw;

    background: linear-gradient(#bebebe, #f5f5f5);

    border: 5px solid #C40C0C;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    font-family: "resonateEb";

    font-weight: 600;

}



.marketImageBoxes {

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    align-items: center;

    flex-wrap: wrap;

    gap: 1vw;

}



.marketImgBox {

    width: 47%;

    height: 16.5vw;

    border-radius: 1vw;

    overflow: hidden;

    border: 2px solid #C40C0C;

}



.marketImgBox img {

    width: 100%;

}



.marketImgBox:nth-child(1) {

    width: 35%;

    height: 14vw;

    margin-left: 12%;

    margin-top: 2.5vw;

}



.marketImgBox:nth-child(4) {

    width: 35%;

    height: 14vw;

    margin-right: 12%;

    margin-bottom: 2.5vw;

}



.marketLeft p {

    font-family: "figtree";

    color: white;

    font-size: 1vw;

    line-height: 1.7;

    max-width: 80%;

}



.marketBoxes {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    width: 95%;

    gap: 1vw;

    margin-top: 3vw;

}



.marketBox {

    width: 48%;

    height: 7vw;

    display: flex;

    justify-content: center;

    flex-direction: column;

    border-bottom: 1px solid rgba(255, 255, 255, 0.653);

    position: relative;

}



.marketBox::after {

    content: "";

    width: 35%;

    height: 1px;

    background-color: rgba(255, 255, 255, 0.653);

    position: absolute;

    bottom: 0.3vw;

}



.marketBox h4 {

    color: white;

    font-family: "kalam";

    font-size: 1vw;

    margin-left: 1vw;

}



.marketBox span {

    font-size: 2vw;

    line-height: 2vw;

    font-family: "resonateEb";

}



.marketBox p {

    margin-left: 1vw;

    line-height: normal;

}



/* themes */

.themes {

    width: 100%;

    height: auto;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 4vw 0vw;

    margin-top: 4vw;

    position: relative;

}



.themes-cont {

    width: 80%;

    height: auto;

    position: relative;

}



.themes-cont h2 {

    font-family: "resonateEb";

    color: white;

    text-transform: uppercase;

    font-size: 3vw;

}



.theme-carousel {

    width: 100%;

    height: auto;

    display: flex;

    align-items: center;

    justify-content: space-between;

    flex-wrap: wrap;

    row-gap: 0.8vw;

    margin-top: 0.5vw;

    margin-top: 3vw;

}



.theme-carousel .item,

.theme-carousel2 .item {

    height: 18vw;

}



.themes-cont .theme-carousel .item img,

.themes-cont .theme-carousel2 .item img {

    width: 0%;

    position: absolute;

    z-index: -1;

    left: 0;

    height: auto;

    min-height: 18vw;

    transition: all 0.5s ease;

}



.theme-box {

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    position: relative;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 2;

}



.theme-box:hover .theme-box-overlay {

    background: linear-gradient(#1105057d, #110505);

}



.theme-box-overlay {

    position: absolute;

    width: 0%;

    height: 100%;

    background: linear-gradient(#12030900, #120309b5);

    z-index: -1;

    left: 0;

    transition: all 0.5s ease;

}





.theme-box:hover .theme-icon svg {

    fill: #120309;

    transform: translateY(-0.5vw);

}



.theme-box:hover .theme-des {

    color: #FF6500;

}



.theme-icon {

    width: 70%;

    height: auto;

    display: flex;

    align-items: center;

    justify-content: center;

}



.theme-icon svg {

    fill: white;

    width: 40%;

    transition: all 0.3s ease;

}



.theme-des {

    text-align: center;

    padding: 0.5vw 0.5vw;

    color: white;

    font-family: "kalam";

    font-size: 0.9vw;

    font-weight: 600;

    border: 2px solid #FF6500;

    line-height: 1vw;

    text-align: center;

    background-color: #120309a2;

}



/* who */

.who {

    width: 100%;

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

}



.whoContent {

    width: 80%;

    height: 90vh;

    margin-top: 10vh;

    position: relative;

}





.whoContent h2 {

    color: white;

    font-family: "resonateEb";

    font-size: 2.5vw;

}



.whoContent h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    gap: 0.4vw;

    position: relative;

    font-size: 1vw;

}



.whoContent h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.whoContent h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}



.whoBoxes {

    width: 100%;

    height: 34vw;

    margin-top: 3vw;

    position: relative;

}



.whoCircle {

    background-color: #2b2b2b;

    border-radius: 50%;

    position: absolute;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 5px 5px 20px black;

}



.whoCircle:first-child {

    width: 20vw;

    height: 20vw;

    margin-left: 3vw;

    margin-top: 3vw;

    z-index: 3;

}



.whoCircle:nth-child(2) {

    top: 16vw;

    left: 17vw;

    width: 17vw;

    height: 17vw;

}



.whoCircle:nth-child(3) {

    top: 16vw;

    left: 33vw;

    width: 15vw;

    height: 15vw;

}



.progressFill {

    width: 100%;

    height: 0%;

    /* start empty */

    position: absolute;

    background-color: #3c74d4;

    bottom: 0;

    transition: height 1.5s ease-out;

    /* smooth water rise */

}



.whoCircle:first-child .progressFill {

    background: linear-gradient(45deg, #C40C0C, #ec3636);

}



.whoCircle:nth-child(2) .progressFill {

    background: linear-gradient(45deg,#C40C0C,#FF6500);

}



.whoCircle:nth-child(3) .progressFill {

    background: linear-gradient(45deg, #FF6500, #8a3f0c);

}



.whoPara {

    color: white;

    position: absolute;

    width: 60%;

    right: 1vw;

    top: 8vw;

    padding: 2vw;

    border: 2px solid rgb(114, 114, 114);

    border-radius: 1vw;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

}



.whoGlow {

    width: 30vw;

    height: 10vw;

    position: absolute;

    background: linear-gradient(45deg, #C40C0C, #FF6500);

    border-radius: 50%;

    filter: blur(80px);

    top: -5vw;

}



.whoPara p {

    font-family: "figtree";

    font-size: 1vw;

    text-align: center;

    line-height: 1.7;

    font-weight: 300;

    position: relative;

}



.whoCircleIn {

    width: 60%;

    height: 60%;

    border-radius: 50%;

    background-color: rgb(0, 0, 0);

    position: relative;

    z-index: 3;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

}



.whoCircleIn .des::after,

.whoCircleIn .des::before {

    display: none;

}



.whoSquares {

    position: absolute;

    display: flex;

    right: 0;

    bottom: 5vw;

}



.whoSquare {

    width: 7vw;

    height: 7vw;

    transform: rotate(-45deg);

    border: 1px solid;

    border-image: linear-gradient(45deg, #ffffff30, #ffffff) 1;

}



.whoSquare:first-child {

    transform: rotate(-45deg) translate(2vw, 2vw);

}



.whoSquare:last-child {

    transform: rotate(-45deg) translate(-2vw, -2vw);

}



/* job title */

.job-titles {

    width: 80%;

    height: 100vh;

    margin: 0 10%;

    display: flex;

    flex-direction: column;

    justify-content: center;

    position: relative;

}



.job_glow {

    width: 20vw;

    height: 20vw;

    border-radius: 50%;

    position: absolute;

     background: linear-gradient(45deg, #C40C0C, #FF6500);

    filter: blur(100px);

    right: -20vw;

    top: -3vw;

}



.job-titles h2 {

    font-size: 1.5vw;

    width: fit-content;

    border-bottom: 1px solid #FF6500;

    padding-bottom: 0.5vw;

    font-family: "figtree";

    color: white;

    text-transform: uppercase;

}



.jobtitles-cont {

    width: 100%;

    height: 70vh;

    margin-top: 2vw;

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.jobboxes {

    width: 50%;

    height: 100%;

    display: flex;

    flex-direction: column;

    gap: 1vw;

}



.job-box {

    padding: 1vw 0vw;

    width: 100%;

    height: 3vw;

    display: flex;

    align-items: center;

    justify-content: space-between;

    color: rgb(255, 255, 255);

    border-bottom: 1px solid white;

}



.job-des {

    font-family: "figtree";

    font-size: 1vw;

    max-width: 80%;

    font-weight: 600;

}



.job-percentage {

    font-family: "resonateEb";

    font-size: 2vw;

}



.jobChart {

    width: 25vw;

    margin-right: 2vw;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.chart-container {

    font-family: "figtree";

    margin: 100px auto;

}



.chart_circle {

    position: absolute;

    width: 10vw;

    height: 10vw;

    opacity: 0;

    border-radius: 50%;

    background: linear-gradient(45deg, #373737, #131313);

}



/* sectors */



.sectors {

    width: 80%;

    margin: 3vw auto;

    height: auto;

    position: relative;

    overflow: hidden;

}



.sector_glow {

    width: 30vw;

    height: 10vw;

 background: linear-gradient(45deg, #C40C0C, #FF6500);

    border-radius: 50%;

    position: absolute;

    margin-left: 25vw;

    top: -9vw;

    filter: blur(50px);

}



.sectors h2 {

    font-size: 1.5vw;

    width: fit-content;

    border-bottom: 1px solid #C40C0C;

    padding-bottom: 0.5vw;

    font-family: "figtree";

    color: white;

    text-transform: uppercase;

}



.w-des{

    font-size: 1vw;

}



.who-boxes {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    justify-content: center;

    gap: 1vw;

    margin-top: 3vw;

}



.who-box {

    border: 1px solid rgba(255, 255, 255, 0.152);

    width: 20%;

    height: 4vw;

    color: white;

    display: flex;

    align-items: center;

    font-family: "figtree";

    text-align: center;

    position: relative;

    z-index: 3;

    justify-content: center;

    overflow: hidden;

}



.who-box::after {

    content: "";

    position: absolute;

    width: 7vw;

    height: 4vw;

   background: linear-gradient(45deg, #C40C0C, #FF6500);

    filter: blur(50px);

    opacity: 0;

}



.who-box:hover::after {

    opacity: 1;

}



/* summit_highlights */

.summit_highlights {

    width: 100%;

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

}



.summit_content {

    width: 80%;

    height: auto;

}



.summit_content h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    font-size: 1vw;

    gap: 0.4vw;

    position: relative;

    z-index: 2;

}



.summit_content h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.summit_content h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}





.summit_content h2 {

    color: white;

    font-family: "resonateEb";

    font-size: 2.5vw;

}





.summitBoxes {

    width: 100%;

    height: auto;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 2vw;

    margin-top: 3vw;

}



.summitBox {

    width: 20vw;

    height: 20vw;

    background-color: #1c1c1c;

    border-radius: 2vw;

    position: relative;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

}



.summitBox:hover {

   background: linear-gradient(45deg, #C40C0C, #FF6500);

}



.summit_icon_cir {

    width: 9vw;

    height: 9vw;

    border-radius: 50%;

    background-color: #000000;

    position: absolute;

    right: -1vw;

    top: -1vw;

    display: flex;

    align-items: center;

    justify-content: center;

}



.summit-icon {

    width: 6vw;

    height: 6vw;

 background: linear-gradient(45deg, #C40C0C, #FF6500);

    border-radius: 10vw 2vw 10vw 10vw;

    display: flex;

    align-items: center;

    justify-content: center;

}



.summit-icon svg {

    width: 3vw;

    fill: white;

}



.summit-h {

    color: white;

    text-align: center;

    font-family: "resonateEb";

    font-size: 1.1vw;

    max-width: 80%;

    text-transform: uppercase;

    margin-top: 8vw;

}



.summit-des {

    width: 80%;

    text-align: center;

    color: white;

    font-family: "figtree";

    line-height: 1.4;

    margin-top: 1vw;

    font-weight: 300;

    font-size: 1vw;

}



/* why */

.why {

    width: 100%;

    min-height: 100vh;

    height: auto;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

}



.why-h {

    display: flex;

    flex-direction: column;

    align-items: center;

}



.why_content {

    width: 80%;

    height: 80vh;

}



.why h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    font-size: 1vw;

    gap: 0.4vw;

    position: relative;

    z-index: 2;

}



.why h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.why h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}





.why h2 {

    color: white;

    font-family: "resonateEb";

    font-size: 2.5vw;

}



.why p {

    color: white;

    width: 60%;

    margin-top: 1vw;

    text-align: center;

    font-family: "figtree";

    font-size: 1vw;

    line-height: 1.7;

}



.why_topBoxes {

    width: 80%;

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 3vw;

}



.ex-head {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 1vw;

}



.ex-h-i {

    width: 4vw;

    height: 4vw;

    border: 2px solid #fff7ab;

    fill: white;

    border-radius: 1vw;

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 2px 2px 8px #C40C0C, -2px -2px 8px #C40C0C, inset 2px 2px 8px #C40C0C, inset -2px -2px 8px #C40C0C;

}



.ex-h-i svg {

    width: 50%;

}



.ex-heading {

    color: white;

    font-family: "figtree";

}



.why_content {

    margin-top: 4vw;

    width: 80%;

    height: auto;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: space-between;

    padding-bottom: 3vw;



}



.whyBox:first-child {

    width: 55%;

    height: 20vw;

    border-radius: 1vw;

    background-image: url("../images/why1.jpg");

    background-size: cover;

    overflow: hidden;

    position: relative;

    display: flex;

    flex-direction: column;

    justify-content: end;

}



.whyBox h2 {

    font-size: 1.4vw;

    margin-left: 1vw;

    position: relative;

    z-index: 2;

}



.whyBox p {

    font-size: 1vw;

    position: relative;

    z-index: 2;

    text-align: left;

    margin-left: 1vw;

    line-height: 1.5;

    padding-bottom: 1vw;

    margin-top: 0.5vw;

    width: 70%;

}



.whyBoxOverlay {

    width: 100%;

    position: absolute;

    height: 100%;

    background: linear-gradient(#00000062, #000000b0);

}



.whyBox:nth-child(2) {

    width: 43%;

    height: 20vw;

    border-radius: 1vw;

    background: linear-gradient(45deg, #1e1e1e, #373333);

    display: flex;

    flex-direction: column;

    justify-content: end;

}



.whyBox:nth-child(3) {

    width: 30%;

    height: 20vw;

    border: 2px solid rgba(255, 255, 255, 0.23);

    border-radius: 1vw;

    margin-top: 1.2vw;

    display: flex;

    flex-direction: column;

    justify-content: end;

}



.whyBox:nth-child(4) {

    height: 20vw;

    border-radius: 1vw;

    width: 26%;

    margin-top: 1.2vw;

    display: flex;

    flex-direction: column;

    justify-content: end;

    background: linear-gradient(45deg, #2b2b2b, #373333);

}



.whyBox:nth-child(5) {

    width: 40%;

    height: 20vw;

    border-radius: 1vw;

    margin-top: 1.2vw;

    display: flex;

    flex-direction: column;

    justify-content: end;

    position: relative;

    overflow: hidden;

    background: linear-gradient(45deg, #C40C0C, #FF6500);

}



.why-png {

    width: 15vw;

    position: absolute;

    right: -3vw;

    top: 1vw;

}

/* AGENDA */
.title{
    font-size: 3.5vw;
    color: white;
    padding-top: 1vw;
    margin-left: 7vw;
    font-family: "resonateEb";
}
.ag-blur{
  width: 100%;
  height: 23vw;
  background: linear-gradient(transparent, #000, #000000);
  position: absolute;
  bottom: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ag-blur-box{
  width: 100%;
  height: 6vw;
}
.agbtop{
  backdrop-filter: blur(1px);
}
.agbmid{
  backdrop-filter: blur(3px);
}
.agbdown{
  backdrop-filter: blur(7px);
}

.get-agenda{
  width: 13vw;
  height: 3vw;
  border-radius: 5vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #FF6500;
  position: absolute;
  z-index: 2;
  color: white;
  font-family: "montserrat";
  margin-top: 10vw;
  cursor: pointer;
  font-size: 1vw;
}

.get-agenda:hover{
  background: #FF6500;
  color: #fff;
}

.agenda{
    width: 100%;
    height: 55vw;
    padding: 4vw 0;
    position: relative;
}
.agenda-cont{
  margin-top: 1vw;
    width: 100%;
    height: 44vw;
    display: flex;
    align-items: center;
    justify-content: center;
}
.agenda-container{
    width: 80%;
    height: 100%;
}
.ag-carousel .item{
height: 44vw;
color: white;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.agenda-box{
    width: 95%;
    height: 100%;
}
.ag-cont-box{
    width: 100%;
    height: 4vw;
    border-bottom: 0.1vw solid rgba(255, 255, 255, 0.545);
    display: flex;
    gap: 0.5vw;
    align-items: center;
}
.ag-time{
    width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-family: "source sans 3";
    font-size: 1vw;
}
.ag-time::after{
    content: "";
    width: 0.2vw;
    height: 1vw;
    background-color: rgba(255, 255, 255, 0.458);
    display: block;
    position: absolute;
    right: 0;
    border-radius: 1vw;
}
.ag-des{
    display: flex;
    align-items: center;
    width: fit-content;
    font-family: "Source Sans 3";
    font-size: 1vw;
    width: 73%;
    font-weight: 300;
}
.ag-br{
  background-color: #FF6500;
    padding: 0vw 0.5vw;
    padding-bottom: 0.1vw;
    color: #fff;
    font-weight: 400;
    width: fit-content;
}
.agenda .title{
    display: flex;
    gap: 0.5vw;
}
.ag-head-line{
    width: 10vw;
    height: 2vw;
    border-bottom: 0.1vw solid #c824ff;
}
.ag-date{
    font-family: "michroma";
    font-weight: 400;
    font-size: 1vw;
    margin-top: 1.2vw;
    color: #FF6500;
    font-weight: 900;
    width: 90%;
}

.panel .pl{
   color: #FF6500;
   font-weight: 600;
   text-transform: uppercase;
}

/* gallery */

.gallery {

    width: 80%;

    height: 80vh;

    margin: 2vw auto;

    margin-top: 15vw;

    border-radius: 2vw;

    border: 2px solid rgb(89, 89, 89);

    position: relative;

}



.gallery h3 {

    font-family: "kalam";

    color: #C40C0C;

    display: flex;

    font-size: 1vw;

    gap: 0.4vw;

    position: relative;

    z-index: 2;

}



.gallery h3::before {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

}



.gallery h3::after {

    content: "";

    width: 2vw;

    height: 1px;

    background-color: #C40C0C;

    display: block;

    transform: translateY(0.4vw);

    position: absolute;

    left: 0;

    bottom: 1vw;

}



.gallery-h {

    margin-left: 2vw;

    margin-top: 1vw;

}



.gallery h2 {

    color: white;

    font-family: "resonateEb";

    font-size: 1.4vw;

    text-transform: uppercase;

}



.container-gal {

    width: 95%;

    margin: 0 auto;

    margin-top: 2vw;

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    grid-template-rows: repeat(2, 1fr);

    grid-column-gap: 1vw;

    grid-row-gap: 1vw;

}



.box {

    background: #292929;

    border-radius: 1vw;

    min-height: 14vw;

    display: flex;

    align-items: center;

    justify-content: center;

    position: relative;

    overflow: hidden;

}





.box1 {

    grid-area: 1 / 1 / 2 / 2;

}



.box2 {

    grid-area: 1 / 4 / 3 / 5;

}



.box3 {

    grid-area: 1 / 2 / 2 / 4;

}



.box4 {

    grid-area: 2 / 1 / 3 / 2;

}



.box5 {

    grid-area: 2 / 2 / 3 / 3;

}



.box6 {

    grid-area: 2 / 3 / 3 / 4;

}



.box img {

    position: absolute;

    width: 100%;

    height: 100%;

    object-fit: cover;

    top: 0;

    left: 0;

    opacity: 0;

    transition: opacity 2s ease-in-out;

}



.box img.active {

    opacity: 1;

}



.gal_main {

    position: absolute;

    width: 10vw;

    height: 10vw;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 1vw;

    right: -0vw;

    top: -9vw;

    transform: rotate(-20deg);

}



.gal_main_patch {

    width: 10vw;

    height: 10vw;

    position: absolute;

    border-radius: 1vw;

    background-color: white;

    right: -8vw;

    top: -11vw;

    transform: rotate(10deg);

    display: flex;

    align-items: center;

    justify-content: center;

}



.gal_main_patch p {

    text-align: center;

    max-width: 70%;

    font-family: "kalam";

    font-size: 1vw;

}



.gal_main img {

    width: 100%;

}



.gallery .whoSquares {

    top: -12vw;

    left: 5vw;

}



/* footer */

#footer {

    background-color: #111;

    color: #fff;

    padding: 40px 20px;

    font-family: 'Segoe UI', sans-serif;

}



.footerContainer {

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    width: 80%;

    margin: auto;



}



/* Left Section */

.fmid {

    width: 60%;

    display: flex;

    flex-direction: column;

    gap: 1vw;

}



.mail_boxes {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 2vw;

}



.mail-box {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 15px 20px;

    border-radius: 12px;

    transition: 0.3s;

}



.mail-box:hover {

    background-color: #ffffff;

}



.mail-heading {

    font-weight: 600;

    font-size: 14px;

    margin-bottom: 5px;

    color: #FF6500;

}



.mail {

    color: #fff;

    font-size: 14px;

    text-decoration: none;

}



.mail-box:hover .mail {

    color: #111;

}



/* Right Section */

.fRight {

    flex: 1;

    display: flex;

    flex-direction: column;

    align-items: center;

}



.fRight h5 {

    font-family: "resonateEb";

    text-transform: uppercase;

    font-size: 1.2vw;

}



.fUp {

    display: flex;

    gap: 12px;

    flex-wrap: wrap;

}



.fLinks {

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background-color: #1a1a1a;

    color: #fff;

    font-size: 16px;

    transition: all 0.3s;

}



.fLinks:hover {

    background-color: #FF6500;

    color: #111;

    transform: scale(1.15);

}



.fCopy {

    font-size: 13px;

    color: #aaa;

    text-align: center;

}



.fCopy a {

    color: #C40C0C;

    text-decoration: none;

}



.org {

    display: flex;

    align-items: center;

    gap: 8px;

    width: 20%;

    font-size: 14px;

    color: #fff;

}



.org img {

    height: 3vw;

}



  /* forms */

.modal {

  visibility: hidden;

  opacity: 0;

  position: fixed;

  z-index: 5;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  transition: .4s;

  z-index: 10000;

  }

  

  

  .modalContents {

  display: flex;

  align-items: center;

  justify-content: center;

  background: linear-gradient(45deg,rgb(28, 28, 28),black);

  width: 90%;

  /* backdrop-filter: blur(3px); */

  border-top: none;

  border: 1px solid rgb(141, 141, 141);

  border-top: none;

  }

  .form-img-box{

    width: 30%;

    overflow: hidden;

    height: 26vw;

  }

  .form-img{

    width: 110%

  }

  

  .form-heading {

  font-family: "resonateEb";

  color: rgb(255, 255, 255);

  font-size: 1vw;

  border-bottom: none;

  padding: 0.5vw 0vw;

  display: flex;

  align-items: center;

  justify-content: center;

  background:linear-gradient(45deg,#C40C0C,#FF6500);

  width: 90%;

  border: 1px solid rgb(141, 141, 141);

  border-bottom: none;

  }

  

  .modalWrapper {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  width: 50%;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  padding-bottom: 1.3vw;

  }

  

  .modalBg {

  width: 100%;

  height: 100%;

  background: linear-gradient(43deg,rgba(0, 0, 0, 0.938),rgba(28, 27, 27, 0.814),rgba(0, 0, 0, 0.786));    

  }

  form{

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  width: 80%;

  }

  .del-amount-box{

    color: white;

    display: flex;

    flex-direction: column;

    justify-content: center;

    width: 93%;

    padding: 0.5vw;

    margin-top: 0.5vw;

    background-color: #313131;

  }

  .del-price-input-box{

    display: flex;

    align-items: center;

    gap: 0.3vw;

  }

  .del-list{

    padding: 0;

    margin: 0;

    margin-left: 2vw;

    margin-top: 0.5vw;

  }

   li{

    font-size: 0.55vw;

    font-family: "Poppins";

    font-weight: 300;

  

  }

  .del-price-input-box label{

    color: white;

    font-family: "Poppins";

    font-size: 0.6vw;

    display: flex;

    align-items: center;

    gap: 0.3vw;

  }

  .del-price-input-box label sup{

    color: red;

    font-size: 0.5vw;

  }



  .inputs{

  width: 100%;

  height: auto;

  display: flex;

  flex-wrap: wrap;

  justify-content: space-around;

  }

  

  .inputs input{

  border-radius: 0px;

  margin: 1vw 0vw;

  background-color: transparent;

  border: none;

  border-bottom:1px solid #ffffff37;

  display: flex;

  align-items: center;

  width: 45%;

  height: 1.7vw;

  font-size: 0.7vw;

  color: #ffffff;

  }

  .inputs input:focus{

  outline: none;

  background-color: none;

  }



  .inputs input::placeholder{

  font-family: "Poppins";

  color: #ffffff;

  font-size: 0.55vw;

  transform: translate(0.1vw,0vw);

  font-weight: 300;

  }

  .check-box{

  width: 93%;

  height: auto;

  }

  .checks{

  padding: 0.4vw 0vw;

  }

  .checks label{

  display: flex;

  }

  .f-btn{

  background: none;

  border: none;

  font-family: "Poppins";

  font-size: 1vw;

  font-weight: 600;

  color: #ffffff;

  padding: 0.2vw 1vw;

  margin: 1vw 0vw;

  cursor: pointer;

  background-color: #FF6500;

  }

  

  .f-btn:hover{

  color: #ffffff;

  background-color: #641655;

}

  

  

  /* Hide the default checkbox */

  input[type="checkbox"] {

  display: none;

  }

  

  /* Create a custom checkbox style */

  .custom-checkbox {

  width: 0.5vw;

  height: 0.5vw;

  border: 0.5px solid #ffffff;

  cursor: pointer;

  transform: translateY(0.1vw);

  }

  /* Style for when the checkbox is checked */

  input[type="checkbox"]:checked + .custom-checkbox::after {

  position: absolute;

  content: '\2714';

  font-size: 0.8vw;

  top: -80%;

  color: #00dece;

  }

  

  

  .is-show {

  visibility: visible;

  opacity: 1;

  scale: 1.45;

  }

  

  .lt {

  width: 96%;

  margin-left: 1%;

  font-size: 0.55vw;

  font-family: "Poppins";

  font-weight: 300;

  color: #ffffff;

  text-transform: uppercase;

  }

  .in-box .lt{

    font-weight: 500;

  }

  .clModal{

  position: absolute;

  font-family: "Montserrat";

  font-weight: 800;

  font-size: 0.8vw;

  top: 0.6vw;

  right: 3vw;

  background-color: #000000;

  width: 1vw;

  height: 1vw;

  display: flex;

  align-items: center;

  justify-content: center;

  color:  #ffffff;

  cursor: pointer;

  opacity: 1;

  }



/* Style for invalid text fields */

input.invalid {

  border: 1px solid rgb(255, 0, 0);

}



/* Style for invalid custom checkbox */

label.invalid .custom-checkbox,

.del-price-input-box.invalid .custom-checkbox {

  border: 1px solid rgb(255, 0, 0);

}



.form-message{

  margin-top: 0.5vw;

  font-family: "poppins";

  text-transform: uppercase;

  color: rgb(255, 0, 0);

  font-size: 0.55vw;

  display: none;

}

.mshow{

  display: block;

}

.form-interest{

  width: 93%;

  background-color: #393939;

  padding: 0.5vw;

}

.in-h{

  color: white;

  font-family: "Poppins";

  font-size: 0.55vw;

  color: #FF6500;

}

.in-box{

  margin-top: 0.5vw;

  display: flex;

  flex-direction: column;

  gap: 0.3vw;

}

.in-box label{

display: flex;

gap: 0.5vw;

}







/* Responsive */

@media(max-width:767px) {

    nav {

        flex-direction: column;

        justify-content: center;

        align-items: center;

        width: 100%;

        height: 100vh;

        gap: 4vw;

        background-color: black;

        right: -100vw;

        transition: all 1s ease;

    }



    .nav_logo_date {

        display: none;

    }



    .mob_nav_logo_date {

        display: flex;

        align-items: center;

        gap: 1vw;

        z-index: 14;

        position: fixed;

        top: 20px;

        left: 20px;

    }



    .mob_nav_logo_date .dateWrapper {

        color: white;

        border-left: 1px solid rgba(255, 255, 255, 0.523);

        padding-left: 1vw;

    }



    .mob_nav_logo_date .nav_date {

        font-family: "figtree";

        font-weight: 600;

        font-size: 3.3vw;

        position: relative;

        line-height: 3vw;

    }



    .mob_nav_logo_date .nav_date sup {

        font-size: 1.6vw;

        position: absolute;

        top: -1.5vw;

        font-weight: 400;

    }



    .mob_nav_logo_date .nav_month {

        font-family: "figtree";

        font-size: 2.8vw;

    }



    .mob_nav_logo_date .nav_year {

        font-family: "figtree";

        font-weight: 600;

        color: #ffffff;

    }



    .mob_nav_logo_date img {

        width: 180px;

    }



    .navFirst {

        flex-direction: column;

        align-items: flex-start;

        margin-left: 0;

        gap: 10px;

    }



    .navFirst ul {

        flex-direction: column;

        gap: 10px;

        padding: 0;

        margin: 0;

    }



    .navSecond {

        width: 90%;

        justify-content: space-between;

        margin: 10px auto;

    }



    .search-box {

        flex: 1;

        justify-content: flex-start;

    }



    .search-box input {

        width: 100%;

        max-width: 250px;

        font-size: 14px;

    }



    .nav-button {

        width: auto;

        padding: 10px 15px;

        font-size: 13px;

    }



    .container,

    .menu-icon,

    .frame {

        display: flex;

        justify-content: center;

        align-items: center;

        width: 20vw;

        height: 20vw;

        position: fixed;

        z-index: 10000;

        right: 0;

        top: 0;

    }



    .frame {



        width: 20vw;

        height: 20vw;

    }



    .nav-logo-box {

        display: none;

    }



    .menu-icon {

        width: 9vw;

        height: 11vw;

        position: relative;

        cursor: pointer;

    }



    .line-1 {

        background: #fff;

        width: 100%;

        height: 1vw;

        border-radius: 5px;

        position: absolute;

        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);

    }



    .line-2 {

        background: #fff;

        width: 100%;

        height: 1vw;

        border-radius: 5px;

        position: absolute;

        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);

    }



    .line-3 {

        background: #fff;

        width: 100%;

        height: 1vw;

        border-radius: 5px;

        position: absolute;

        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);

    }



    .line-1 {

        transition: 500ms;

        transform: translateY(-3vw);

        animation: animateReverse 600ms ease-in-out;

    }



    .line-2 {

        transition: 500ms;

        transform: scale(1);

        opacity: 1;

    }



    .line-3 {

        transition: 500ms;

        transform: translateY(3vw);

        animation: animate2Reverse 600ms ease-in-out;

    }



    .menu-icon.active {

        animation: rotateIcon 600ms ease-in-out forwards;

    }



    .line-1.active {

        animation: animate 600ms ease-in-out forwards;

    }



    .line-2.active {

        transform: scale(0);

        opacity: 0;

    }



    .line-3.active {

        animation: animate2 600ms linear forwards;

    }



    @keyframes animate {

        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(0px) rotate(-45deg);

        }

    }



    @keyframes animateReverse {

        0% {

            transform: translateY(0px) rotate(45deg);

        }



        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(-3vw) rotate(0deg);

        }

    }



    @keyframes animate2 {

        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(0px) rotate(45deg);

        }

    }



    @keyframes animate2Reverse {

        0% {

            transform: translateY(0px) rotate(-45deg);

        }



        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(3vw) rotate(0deg);

        }

    }



    @keyframes rotateIcon {

        100% {

            transform: rotate(90deg);

        }

    }



    .navactive {

        right: 0;

    }



    .coverContent {

        width: 90%;

    }



    .tagLine {

        font-size: 9vw;

        width: 100%;

        line-height: 9vw;

    }



    .date-place {

        font-size: 3.5vw;

    }



    .covButton {

        width: 31vw;

        height: 7.5vw;

        font-size: 2.8vw;

    }



    .white_logo {

        width: 91vw;

    }



    /* past sponsors */

    .past_sponsors h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .past_sponsors h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .past_sponsors h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .past_sponsors h2 {

        font-size: 6vw;

    }



    .pscr_design .item {

        height: 22vw;

    }



    /* cs25 leaders  */

    .cs25_leaders {

        width: 100%;

        height: auto;

        padding: 7vw 0;

    }



    .cs25-content {

        width: 90%;

        height: auto;

    }



    .cs25-heading h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .cs25-heading h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .cs25-heading h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .cs25-heading h2 {

        font-size: 5vw;

    }



    .leaders-carousel .item {

        height: 40vw;

    }



    .leader-patch {

        width: 15%;

        height: 42%;

        border-radius: 3vw;

        font-size: 1.7vw;

    }



    .leader-bg1,

    .leader-bg2,

    .leader-bg3 {

        border-radius: 3vw;

    }



    .leader-content-glow {

        opacity: 1;

    }



    .leader-content {

        width: 90%;

        transform: translateY(0);

    }



    .leader-content .leader-name {

        font-size: 2vw;

        line-height: 2vw;

    }



    .leader-job {

        font-size: 2vw;

    }



    .leader-comp {

        font-size: 2vw;

    }



    .owl-carousel .owl-nav button.owl-next,

    .owl-carousel .owl-nav button.owl-prev,

    .owl-carousel button.owl-dot {

        width: 8vw;

        height: 8vw;

    }



    .owl-carousel .owl-nav button.owl-prev {

        right: 10vw;

    }



    .owl-carousel .owl-nav button.owl-next,

    .owl-carousel .owl-nav button.owl-prev,

    .owl-carousel button.owl-dot {

        color: white;

        font-size: 4vw;

    }



    /* overview */

    .overview {

        height: auto;

    }



    .overContent {

        flex-direction: column;

        width: 90%;

        height: auto;

    }



    .overContentBox {

        width: 100%;

    }



    .overContentBox h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .overContentBox h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .overContentBox h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .overContentBox h2 {

        font-size: 4vw;

        line-height: 4vw;

    }



    .overContentBox p {

        font-size: 3.45vw;

        margin-top: 3.6vw;

    }



    .overNumbers {

        width: 60%;

        margin-top: 6vw;

        height: auto;

    }



    .overNumbers h2 {

        font-size: 4.5vw;

    }



    .numBoxes {

        gap: 2vw;

    }



    .numBox {

        height: 16.3vw;

        border-radius: 3vw;

        align-items: center;

        gap: 1vw;

    }



    .num-dig {

        font-size: 9vw;

        margin-left: 3vw;

    }



    .num-des {

        font-size: 3vw;

    }



    .num-plus {

        font-size: 4vw;

    }



    .overImage {

        width: 100%;

        height: 130vw;



    }



    .over-img-box2 {

        width: 70vw;

        height: 70vw;

        position: absolute;

        right: auto;

    }



    .over-cir-patch-circle {

        width: 45vw;

        height: 45vw;

        left: -31.5vw;

    }



    .over-circle-patch {

        width: 60vw;

        height: 60vw;

    }



    .over-circle-text span {

        font-size: 3vw;

    }



    .over-circle-text span {

        position: absolute;

        left: 50%;

        transform-origin: 0 22vw;

        /* always half the circle */

    }



    .over-circle {

        position: static;

    }



    .over-dots {

        gap: 1.4vw;

    }



    .over-t {

        width: 3vw;

    }



    /* countdown */

    .countdownCont {

        flex-direction: column;

        padding-top: 50px;

    }



    .countdown-wrapper {

        height: 400px;

    }



    .countDownHeading {

        width: 80%;

        font-size: 27px;

        line-height: 29px;

    }



    .time-units {

        gap: 50px;

        font-size: 27px;

    }



    .unit {

        flex-direction: column;

        gap: 0;

    }



    .countdown-wrapper {

        width: 90%;

    }



    .countdownCont {

        width: 90%;

        height: 290px;

    }



    .unit label {

        font-size: 13px;

    }



    .seconds-circle-container {

        transform: translate(-928px, 3.2px);

    }



    .number {

        position: absolute;

        width: 30px;

        height: 30px;

        text-align: center;

        line-height: 30px;

        font-size: 30px;

        color: rgba(255, 255, 255, 0.2);

        transform-origin: center;

        pointer-events: none;

        transition: all 0.3s ease;

        font-family: "resonateEb";

    }



    .number.active {

        font-size: 25px;

        line-height: 30px;

    }



    .simple_para_wrapper {

        padding: 20vw 0;

    }



    .simple_pic {

        position: absolute;

        width: 59vw;

    }



    .simple_para h3 {

        font-size: 3.2vw;

    }



    .simple_para p {

        font-size: 4vw;

    }



    /* market */



    .market {

        height: auto;

    }



    .marketContent {

        width: 90%;

        flex-direction: column;

    }



    .marketContentBoxes {

        flex-direction: column;

    }





    .marketContent h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .marketContent h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .marketContent h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .marketContent h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



    .marketLeft {

        width: 100%;

        height: auto;

        margin-top: 3vw;

    }



    .marketLeft p {

        font-size: 3vw;

    }



    .marketBox {

        height: 26vw;

    }



    .marketBox h4 {

        font-size: 3vw;

    }



    .marketBox h4 span {

        font-size: 5vw;

    }



    .marketRight {

        width: 100%;

        height: 70vw;

        margin-top: 9vw;

    }



    .marketImgBox:nth-child(1) {

        width: 35%;

        height: 26vw;

        margin-top: 6vw;

    }



    .marketImgBox {

        width: 47%;

        height: 31.5vw;

    }



    .marketCircle {

        width: 18vw;

        height: 18vw;

    }



    .marketImgBox:nth-child(4) {

        width: 35%;

        height: 25vw;

        margin-right: 12%;

        margin-bottom: 7.5vw;

    }



    .marketInCircle {

        width: 11vw;

        height: 11vw;

        font-size: 2vw;

    }



    /* themes */

    .themes {

        margin-top: 20vw;

    }



    .themes-cont h2 {

        font-size: 6vw;

    }



    .theme-des {

        font-size: 3vw;

        padding: 2vw 1vw;

        line-height: 3vw;

    }



    .theme-carousel .item,

    .theme-carousel2 .item {

        height: 40vw;

    }



    /* who */

    .who {

        height: auto;

    }



    .whoContent {

        width: 90%;

        height: auto;

    }



    .whoBoxes {

        width: 100%;

        height: 100vw;

    }



    .whoCircle:first-child {

        width: 40vw;

        height: 40vw;

    }



    .whoCircle:nth-child(2) {

        top: 38vw;

        left: 13vw;

        width: 30vw;

        height: 30vw;

    }



    .whoCircle:nth-child(3) {

        top: 65vw;

        left: 9vw;

        width: 30vw;

        height: 30vw;

    }



    .whoPara {

        width: 43%;

        border-radius: 2vw;

        top: 15vw;

    }



    .whoPara p {

        font-size: 3vw;

        line-height: 1.7;

    }



    .whoContent h2 {

        font-size: 4.5vw;

    }



    .whoContent h3 {

        font-size: 2vw;

    }



    .whoGlow {

        height: 49vw;

    }



    .whoSquares {

        bottom: -8vw;

    }



    /* job-titles */

    .job-titles {

        flex-direction: column;

        height: auto;

        margin-top: 10vw;

    }



    .job_glow {

        width: 50vw;

        height: 34vw;

        right: -39vw;

        top: -3vw;

    }



    .job-titles h2 {

        font-size: 4.5vw;

    }



    .jobtitles-cont {

        height: auto;

        flex-direction: column;

        justify-content: center;

    }



    .jobboxes {

        width: 100%;

        gap: 6vw;

    }



    .job-box {

        padding: 1vw 0vw;

        height: 11vw;

    }



    .job-des {

        font-size: 3.2vw;

    }



    .job-percentage {

        font-size: 5vw;

    }



    .jobChart {

        width: 85vw;

        height: 100vw;

    }



    /* sectors */

    .sectors {

        width: 90%;

    }



    .sectors h2 {

        font-size: 5.5vw;

    }



    .who-box {

        width: 47%;

        height: 14vw;

    }



    /* summit */



    .summit_highlights {

        height: auto;

        margin-top: 20vw;

    }



    .summit_content h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .summit_content h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .summit_content h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .summit_content h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



    .summitBoxes {

        flex-wrap: wrap;

        gap: 5vw;

    }



    .summitBox {

        width: 79vw;

        height: 70vw;

        border-radius: 3vw;

    }



    .summit_icon_cir {

        width: 25vw;

        height: 25vw;

        right: -4vw;

        top: -4vw;

    }



    .summit-icon {

        width: 16vw;

        height: 16vw;

    }



    .summit-icon svg {

        width: 7vw;

    }



    .summit-h {

        font-size: 4.1vw;

        max-width: 80%;

        text-transform: uppercase;

        margin-top: 11vw;

    }



    /* why */



    .why-h h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .why-h h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .why-h h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



     .why-h h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



        .why p {

    color: white;

    width: 80%;

    margin-top: 1vw;

    text-align: center;

    font-family: "figtree";

    font-size: 3vw;

    line-height: 1.7;

}



.why_content{

    gap: 3vw;

}



.why_topBoxes{

    flex-wrap: wrap;

    gap: 5vw;

}

.ex-head{

    width: 100%;

    display: flex;

    justify-content: start;

    gap: 4vw;

}

.ex-h-i {

    width: 16vw;

    height: 16vw;

}

.ex-heading{

    font-size: 3vw;

}



.whyBox:nth-child(1),.whyBox:nth-child(2),.whyBox:nth-child(3),.whyBox:nth-child(4),.whyBox:nth-child(5){

    width: 100%;

    height: 50vw;

}

.whyBox p{

    text-align: left;

    padding: 3vw;

}

.whyBox h2{

    font-size: 4vw;

    max-width: 80%;

    margin-left: 3vw;

}

.why-png {

    width: 22vw;

    position: absolute;

    right: -3vw;

    top: 15vw;

}


      /* agenda */
.agenda{
    height: auto;
  }
  .agenda-cont{
    height: auto;
  }
  .agenda-container{
    width: 95%;
  }
  .ag-carousel .item {
    height: auto;
  }
  .get-agenda {
    width: 44vw;
    height: 9vw;
    font-size: 3.5vw;
    margin-top: 40vw;
    }
    .ag-blur{
      height: 100vw;
    }

.ag-blur-box {
  width: 100%;
  height: 30vw;
}

  .ag-cont-box {
    width: 100%;
    height: 20vw;
    gap: 2.5vw;
  }
  .ag-time{
    width: 30%;
    font-size: 2.5vw;
  }
  .ag-des{
    width: 65%;
    font-size: 3.8vw;
  }
  /* .ag-br{
    width: auto;
  } */
  .ag-time::after {
    width: 0.6vw;
    height: 5vw;
  }
  .ag-head-line {
    height: 3.5vw;
  }
  .ag-date{
    font-size: 3vw;
  }
  .owl-carousel .owl-nav button.owl-next {
    display: none;
  }

/* gallery */

.gallery {

    width: 80%;

    height: 149vw;

    margin-top: 40vw;

}

   .gallery h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



 .gallery h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



.gallery h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



  .gallery h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



    

.container-gal {

display: grid;

grid-template-columns: repeat(2, 1fr);

grid-template-rows: repeat(4, 1fr);

grid-column-gap: 10px;

grid-row-gap: 10px;

margin-top: 30px;



}



.box{

    min-height: 30vw;

}



.box1 { grid-area: 1 / 2 / 2 / 3; }

.box2 { grid-area: 1 / 1 / 3 / 2; }

.box3 { grid-area: 3 / 1 / 4 / 3; }

.box4 { grid-area: 2 / 2 / 3 / 3; }

.box5 { grid-area: 4 / 1 / 5 / 2; }

.box6 { grid-area: 4 / 2 / 5 / 3; }





.gal_main {

    width: 20vw;

    height: 20vw;

    border-radius: 2vw;

    right: 6vw;

    top: -20vw;

    transform: rotate(-20deg);

}

.gal_main_patch {

    width: 20vw;

    height: 20vw;

    border-radius: 2vw;

    right: -8vw;

    top: -18vw;

}

    .gal_main_patch p{

        font-size: 2vw;

    }





    /* footer */

    .footerContainer{

        display: flex;

        flex-direction: column;

    }

    .fmid {

        width: 100%;

display: flex;

flex-direction: column;

align-items: center;

    }

    .mail_boxes{

        flex-direction: column;

        margin-top: 10vw;

    }



    .fRight h5 {

    font-family: "resonateEb";

    text-transform: uppercase;

    font-size: 3.2vw;

}

.org {

    width: 100%;

    font-size: 14px;

    color: #fff;

}

.org img {

    height: 11vw;

}



/* form */

.modalWrapper {

  width: 70%;

}



.inputs input {

  width: 85%;

  height: 4.7vw;

  font-size: 1.5vw;

}



.modalContents {

  width: 80%;

}



.inputs input::placeholder {

  font-family: "Poppins";

  font-size: 1.5vw;

  transform: translate(0.3vw, 0vw);

}

form{

  width: 100%;

}

.form-heading {

  font-size: 3vw;

  font-weight: 800;

  margin: 0vw 0vw;

  margin-top: 4.5vw;

  text-align: center;

  line-height: 4vw;

  width: 80%;

}



.check-box {

  width: 85%;

}



.custom-checkbox {

  width: 0.9vw;

  height: 0.9vw;

}



.lt {

  font-size: 1vw;

}



input[type="checkbox"]:checked+.custom-checkbox::after {

  left: -0.2vw;

  font-size: 1.5vw;

}



.f-btn {



  font-size: 2vw;

  border-radius: 5px;

  padding: 0.5vw 3vw;

  margin: 2vw 0vw;

}



.clModal {

  font-size: 1.8vw;

  width: 3vw;

  height: 3vw;

}

.form-img-box{

  display: none;

}



}



@media(min-width:768px) and (max-width:1024px){

      nav {

        flex-direction: column;

        justify-content: center;

        align-items: center;

        width: 100%;

        height: 100vh;

        gap: 4vw;

        background-color: black;

        right: -100vw;

        transition: all 1s ease;

    }



    .nav_logo_date {

        display: none;

    }



    .mob_nav_logo_date {

        display: flex;

        align-items: center;

        gap: 1vw;

        z-index: 14;

        position: fixed;

        top: 20px;

        left: 20px;

    }



    .mob_nav_logo_date .dateWrapper {

        color: white;

        border-left: 1px solid rgba(255, 255, 255, 0.523);

        padding-left: 1vw;

    }



    .mob_nav_logo_date .nav_date {

        font-family: "figtree";

        font-weight: 600;

        font-size: 3.3vw;

        position: relative;

        line-height: 3vw;

    }



    .mob_nav_logo_date .nav_date sup {

        font-size: 1.6vw;

        position: absolute;

        top: -1.5vw;

        font-weight: 400;

    }



    .mob_nav_logo_date .nav_month {

        font-family: "figtree";

        font-size: 2.8vw;

    }



    .mob_nav_logo_date .nav_year {

        font-family: "figtree";

        font-weight: 600;

        color: #ffffff;

    }



    .mob_nav_logo_date img {

        width: 180px;

    }



    .navFirst {

        flex-direction: column;

        align-items: flex-start;

        margin-left: 0;

        gap: 10px;

    }



    .navFirst ul {

        flex-direction: column;

        gap: 10px;

        padding: 0;

        margin: 0;

    }



    .navSecond {

        width: 90%;

        justify-content: space-between;

        margin: 10px auto;

    }



    .search-box {

        flex: 1;

        justify-content: flex-start;

    }



    .search-box input {

        width: 100%;

        max-width: 250px;

        font-size: 14px;

    }



    .nav-button {

        width: auto;

        padding: 10px 15px;

        font-size: 13px;

    }



    .container,

    .menu-icon,

    .frame {

        display: flex;

        justify-content: center;

        align-items: center;

        width: 20vw;

        height: 20vw;

        position: fixed;

        z-index: 10000;

        right: 0;

        top: 0;

    }



    .frame {



        width: 20vw;

        height: 20vw;

    }



    .nav-logo-box {

        display: none;

    }



    .menu-icon {

        width: 9vw;

        height: 11vw;

        position: relative;

        cursor: pointer;

    }



    .line-1 {

        background: #fff;

        width: 100%;

        height: 1vw;

        border-radius: 5px;

        position: absolute;

        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);

    }



    .line-2 {

        background: #fff;

        width: 100%;

        height: 1vw;

        border-radius: 5px;

        position: absolute;

        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);

    }



    .line-3 {

        background: #fff;

        width: 100%;

        height: 1vw;

        border-radius: 5px;

        position: absolute;

        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);

    }



    .line-1 {

        transition: 500ms;

        transform: translateY(-3vw);

        animation: animateReverse 600ms ease-in-out;

    }



    .line-2 {

        transition: 500ms;

        transform: scale(1);

        opacity: 1;

    }



    .line-3 {

        transition: 500ms;

        transform: translateY(3vw);

        animation: animate2Reverse 600ms ease-in-out;

    }



    .menu-icon.active {

        animation: rotateIcon 600ms ease-in-out forwards;

    }



    .line-1.active {

        animation: animate 600ms ease-in-out forwards;

    }



    .line-2.active {

        transform: scale(0);

        opacity: 0;

    }



    .line-3.active {

        animation: animate2 600ms linear forwards;

    }



    @keyframes animate {

        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(0px) rotate(-45deg);

        }

    }



    @keyframes animateReverse {

        0% {

            transform: translateY(0px) rotate(45deg);

        }



        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(-3vw) rotate(0deg);

        }

    }



    @keyframes animate2 {

        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(0px) rotate(45deg);

        }

    }



    @keyframes animate2Reverse {

        0% {

            transform: translateY(0px) rotate(-45deg);

        }



        50% {

            transform: translateY(0px) rotate(0deg);

        }



        100% {

            transform: translateY(3vw) rotate(0deg);

        }

    }



    @keyframes rotateIcon {

        100% {

            transform: rotate(90deg);

        }

    }



    .navactive {

        right: 0;

    }



    .coverContent {

        width: 90%;

    }



    .tagLine {

        font-size: 9vw;

        width: 100%;

        line-height: 9vw;

    }



    .date-place {

        font-size: 3.5vw;

    }



    .covButton {

        width: 31vw;

        height: 7.5vw;

        font-size: 2.8vw;

    }



    .white_logo {

        width: 91vw;

    }



    /* past sponsors */

    .past_sponsors h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .past_sponsors h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .past_sponsors h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .past_sponsors h2 {

        font-size: 6vw;

    }



    .pscr_design .item {

        height: 22vw;

    }



    /* cs25 leaders  */

    .cs25_leaders {

        width: 100%;

        height: auto;

        padding: 7vw 0;

    }



    .cs25-content {

        width: 90%;

        height: auto;

    }



    .cs25-heading h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .cs25-heading h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .cs25-heading h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .cs25-heading h2 {

        font-size: 5vw;

    }



    .leaders-carousel .item {

        height: 40vw;

    }



    .leader-patch {

        width: 15%;

        height: 42%;

        border-radius: 3vw;

        font-size: 1.7vw;

    }



    .leader-bg1,

    .leader-bg2,

    .leader-bg3 {

        border-radius: 3vw;

    }



    .leader-content-glow {

        opacity: 1;

    }



    .leader-content {

        width: 90%;

        transform: translateY(0);

    }



    .leader-content .leader-name {

        font-size: 2vw;

        line-height: 2vw;

    }



    .leader-job {

        font-size: 2vw;

    }



    .leader-comp {

        font-size: 2vw;

    }



    .owl-carousel .owl-nav button.owl-next,

    .owl-carousel .owl-nav button.owl-prev,

    .owl-carousel button.owl-dot {

        width: 8vw;

        height: 8vw;

        top: -30vh;

    }



    .owl-carousel .owl-nav button.owl-prev {

        right: 10vw;

    }



    .owl-carousel .owl-nav button.owl-next,

    .owl-carousel .owl-nav button.owl-prev,

    .owl-carousel button.owl-dot {

        color: white;

        font-size: 4vw;

    }



    /* overview */

    .overview {

        height: auto;

    }



    .overContent {

        flex-direction: column;

        width: 90%;

        height: auto;

    }



    .overContentBox {

        width: 100%;

    }



    .overContentBox h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .overContentBox h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .overContentBox h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .overContentBox h2 {

        font-size: 4vw;

        line-height: 4vw;

    }



    .overContentBox p {

        font-size: 2.7vw;

        margin-top: 3.6vw;

    }



    .overNumbers {

        width: 60%;

        margin-top: 6vw;

        height: auto;

    }



    .overNumbers h2 {

        font-size: 4.5vw;

    }



    .numBoxes {

        gap: 2vw;

    }



    .numBox {

        height: 16.3vw;

        border-radius: 3vw;

        align-items: center;

        gap: 1vw;

    }



    .num-dig {

        font-size: 9vw;

        margin-left: 3vw;

    }



    .num-des {

        font-size: 2.5vw;

    }



    .num-plus {

        font-size: 4vw;

    }



    .overImage {

        width: 100%;

        height: 130vw;



    }



    .over-img-box2 {

        width: 70vw;

        height: 70vw;

        position: absolute;

        right: auto;

    }



    .over-cir-patch-circle {

        width: 45vw;

        height: 45vw;

        left: -31.5vw;

    }



    .over-circle-patch {

        width: 60vw;

        height: 60vw;

    }



    .over-circle-text span {

        font-size: 3vw;

    }



    .over-circle-text span {

        position: absolute;

        left: 50%;

        transform-origin: 0 22vw;

        /* always half the circle */

    }



    .over-circle {

        position: static;

    }



    .over-dots {

        gap: 1.4vw;

    }



    .over-t {

        width: 3vw;

    }



    /* countdown */

    .countdownCont {

        flex-direction: column;

        padding-top: 50px;

    }



    .countdown-wrapper {

        height: 400px;

    }



    .countDownHeading {

        width: 80%;

        font-size: 27px;

        line-height: 29px;

    }



    .time-units {

        gap: 50px;

        font-size: 27px;

    }



    .unit {

        flex-direction: column;

        gap: 0;

    }



    .countdown-wrapper {

        width: 90%;

    }



    .countdownCont {

        width: 90%;

        height: 290px;

    }



    .unit label {

        font-size: 13px;

    }



    .seconds-circle-container {

        transform: translate(-928px, 3.2px);

    }



    .number {

        position: absolute;

        width: 30px;

        height: 30px;

        text-align: center;

        line-height: 30px;

        font-size: 30px;

        color: rgba(255, 255, 255, 0.2);

        transform-origin: center;

        pointer-events: none;

        transition: all 0.3s ease;

        font-family: "resonateEb";

    }



    .number.active {

        font-size: 25px;

        line-height: 30px;

    }



    .simple_para_wrapper {

        padding: 20vw 0;

    }



    .simple_pic {

        position: absolute;

        width: 59vw;

    }



    .simple_para h3 {

        font-size: 3.2vw;

    }



    .simple_para p {

        font-size: 4vw;

    }



    /* market */



    .market {

        height: auto;

    }



    .marketContent {

        width: 90%;

        flex-direction: column;

    }



    .marketContentBoxes {

        flex-direction: column;

    }





    .marketContent h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .marketContent h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .marketContent h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .marketContent h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



    .marketLeft {

        width: 100%;

        height: auto;

        margin-top: 3vw;

    }



    .marketLeft p {

        font-size: 3vw;

    }



    .marketBox {

        height: 26vw;

    }



    .marketBox h4 {

        font-size: 3vw;

    }



    .marketBox h4 span {

        font-size: 5vw;

    }



    .marketRight {

        width: 100%;

        height: 70vw;

        margin-top: 9vw;

    }



    .marketImgBox:nth-child(1) {

        width: 35%;

        height: 26vw;

        margin-top: 6vw;

    }



    .marketImgBox {

        width: 47%;

        height: 31.5vw;

    }



    .marketCircle {

        width: 18vw;

        height: 18vw;

    }



    .marketImgBox:nth-child(4) {

        width: 35%;

        height: 25vw;

        margin-right: 12%;

        margin-bottom: 7.5vw;

    }



    .marketInCircle {

        width: 11vw;

        height: 11vw;

        font-size: 2vw;

    }



    /* themes */

    .themes {

        margin-top: 20vw;

    }



    .themes-cont h2 {

        font-size: 6vw;

    }



    .theme-des {

        font-size: 3vw;

        padding: 2vw 1vw;

        line-height: 3vw;

    }



    .theme-carousel .item,

    .theme-carousel2 .item {

        height: 40vw;

    }



    /* who */

    .who {

        height: auto;

    }



    .whoContent {

        width: 90%;

        height: auto;

    }



    .whoBoxes {

        width: 100%;

        height: 100vw;

    }



    .whoCircle:first-child {

        width: 40vw;

        height: 40vw;

    }



    .whoCircle:nth-child(2) {

        top: 38vw;

        left: 13vw;

        width: 30vw;

        height: 30vw;

    }



    .whoCircle:nth-child(3) {

        top: 65vw;

        left: 9vw;

        width: 30vw;

        height: 30vw;

    }



    .whoPara {

        width: 43%;

        border-radius: 2vw;

        top: 15vw;

    }



    .whoPara p {

        font-size: 2.7vw;

        line-height: 1.7;

    }



    .whoContent h2 {

        font-size: 4.5vw;

    }



    .whoContent h3 {

        font-size: 2vw;

    }



    .whoGlow {

        height: 49vw;

    }



    .whoSquares {

        bottom: -8vw;

    }



    /* job-titles */

    .job-titles {

        flex-direction: column;

        height: auto;

        margin-top: 10vw;

    }



    .job_glow {

        width: 50vw;

        height: 34vw;

        right: -39vw;

        top: -3vw;

    }



    .job-titles h2 {

        font-size: 4.5vw;

    }



    .jobtitles-cont {

        height: auto;

        flex-direction: column;

        justify-content: center;

    }



    .jobboxes {

        width: 100%;

        gap: 6vw;

    }



    .job-box {

        padding: 1vw 0vw;

        height: 11vw;

    }



    .job-des {

        font-size: 2.7vw;

    }



    .job-percentage {

        font-size: 4vw;

    }



    .jobChart {

        width: 85vw;

        height: 100vw;

    }



    /* sectors */

    .sectors {

        width: 90%;

    }



    .sectors h2 {

        font-size: 5.5vw;

    }



    .who-box {

        width: 47%;

        height: 14vw;

    }

    .w-des{

        font-size: 2.4vw;

    }



    /* summit */



    .summit_highlights {

        height: auto;

        margin-top: 20vw;

    }



    .summit_content h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .summit_content h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .summit_content h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



    .summit_content h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



    .summitBoxes {

        flex-wrap: wrap;

        gap: 5vw;

    }



    .summitBox {

        width: 60vw;

        height: 60vw;

        border-radius: 3vw;

    }



    .summit_icon_cir {

        width: 25vw;

        height: 25vw;

        right: -4vw;

        top: -4vw;

    }



    .summit-icon {

        width: 16vw;

        height: 16vw;

    }



    .summit-icon svg {

        width: 7vw;

    }



    .summit-h {

        font-size: 3.5vw;

        max-width: 80%;

        text-transform: uppercase;

        margin-top: 11vw;

    }

.summit-des{

    font-size: 2.6vw;

}

    /* why */

.why{

    margin-top: 10vw;

}

    .why-h h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



    .why-h h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



    .why-h h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



     .why-h h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



        .why p {

    color: white;

    width: 80%;

    margin-top: 1vw;

    text-align: center;

    font-family: "figtree";

    font-size: 2.5vw;

    line-height: 1.7;

}



.why_content{

    gap: 3vw;

}



.why_topBoxes{

    flex-wrap: wrap;

    gap: 5vw;

}

.ex-head{

    width: 100%;

    display: flex;

    justify-content: start;

    gap: 4vw;

}

.ex-h-i {

    width: 12vw;

    height: 12vw;

}

.ex-heading{

    font-size: 2.6vw;

}



.whyBox:nth-child(1),.whyBox:nth-child(2),.whyBox:nth-child(3),.whyBox:nth-child(4),.whyBox:nth-child(5){

    width: 100%;

    height: 50vw;

}

.whyBox p{

    text-align: left;

    padding: 3vw;

}

.whyBox h2{

    font-size: 4vw;

    max-width: 80%;

    margin-left: 3vw;

}

.why-png {

    width: 22vw;

    position: absolute;

    right: -3vw;

    top: 15vw;

}



/* gallery */

.gallery {

    width: 80%;

    height: 149vw;

    margin-top: 40vw;

}

   .gallery h3 {

        font-family: "kalam";

        display: flex;

        font-size: 2.5vw;

    }



 .gallery h3::before {

        width: 6vw;

        transform: translateY(1.4vw);

    }



.gallery h3::after {

        width: 6vw;

        transform: translateY(-1vw);

    }



  .gallery h2 {

        font-size: 5vw;

        line-height: 5vw;

    }



    

.container-gal {

display: grid;

grid-template-columns: repeat(2, 1fr);

grid-template-rows: repeat(4, 1fr);

grid-column-gap: 10px;

grid-row-gap: 10px;

margin-top: 30px;



}



.box{

    min-height: 30vw;

}



.box1 { grid-area: 1 / 2 / 2 / 3; }

.box2 { grid-area: 1 / 1 / 3 / 2; }

.box3 { grid-area: 3 / 1 / 4 / 3; }

.box4 { grid-area: 2 / 2 / 3 / 3; }

.box5 { grid-area: 4 / 1 / 5 / 2; }

.box6 { grid-area: 4 / 2 / 5 / 3; }





.gal_main {

    width: 20vw;

    height: 20vw;

    border-radius: 2vw;

    right: 6vw;

    top: -20vw;

    transform: rotate(-20deg);

}

.gal_main_patch {

    width: 20vw;

    height: 20vw;

    border-radius: 2vw;

    right: -8vw;

    top: -18vw;

}

    .gal_main_patch p{

        font-size: 2vw;

    }





    /* footer */

    .footerContainer{

        display: flex;

        flex-direction: column;

    }

    .fmid {

        width: 100%;

display: flex;

flex-direction: column;

align-items: center;

    }

    .mail_boxes{

        flex-direction: column;

        margin-top: 10vw;

    }



    .fRight h5 {

    font-family: "resonateEb";

    text-transform: uppercase;

    font-size: 3.2vw;

}

.org {

    width: 100%;

    font-size: 14px;

    color: #fff;

}

.org img {

    height: 11vw;

}

/* form */

.modalWrapper {

  width: 70%;

}



.inputs input {

  width: 85%;

  height: 4.7vw;

  font-size: 1.5vw;

}



.modalContents {

  width: 80%;

}



.inputs input::placeholder {

  font-family: "Poppins";

  font-size: 1.5vw;

  transform: translate(0.3vw, 0vw);

}

form{

  width: 100%;

}

.form-heading {

  font-size: 3vw;

  font-weight: 800;

  margin: 0vw 0vw;

  margin-top: 4.5vw;

  text-align: center;

  line-height: 4vw;

  width: 80%;

}



.check-box {

  width: 85%;

}



.custom-checkbox {

  width: 0.9vw;

  height: 0.9vw;

}



.lt {

  font-size: 1vw;

}



input[type="checkbox"]:checked+.custom-checkbox::after {

  left: -0.2vw;

  font-size: 1.5vw;

}



.f-btn {



  font-size: 2vw;

  border-radius: 5px;

  padding: 0.5vw 3vw;

  margin: 2vw 0vw;

}



.clModal {

  font-size: 1.8vw;

  width: 3vw;

  height: 3vw;

}

.form-img-box{

  display: none;

}

}