:root {

    --dark-red: rgb(234, 0, 48);

    --magenta: rgb(239, 0, 122);

    --dark-blue: rgb(30, 30, 44);

    --gray: rgb(46, 46, 55);

}



@font-face {

    font-family: "SpaceGrotesk";

    src: url('/../fonts/SpaceGrotesk-Regular.ttf') format('truetype');

}



* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



html, body {

    font-family: "SpaceGrotesk";

    scroll-behavior: smooth;
#
    height: 100%;

}



html.no-scroll,

body.no-scroll {

  overflow: hidden !important;

  height: 100vh;

}



/* HEADER NAV */

#main-header {

    position: relative;

    width: 100%;

    min-height: 100vh;

    display: flex;

}



video {

    position: absolute;

    width: 100%;

    height: 100%;

    z-index: -1;

    object-fit: cover;

}



.overlay {

    position: absolute;

    width: 100%;

    height: 100%;

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

    z-index: 0;

}



#header-subpage .navbar {

    background-color: #000;

}



header .btn, header .btn:hover {

    color: #fff;

}

header .navbar-toggler {
    border: none;
}

header .navbar-toggler:focus {
    box-shadow: none;
    outline: none;
}


header .nav-link, .nav-link:hover{

    font-weight: bold;

    color: #fff;

}

header .navbar-text .btn:nth-child(1) {

    background-color: var(--dark-red);

}



header .navbar-text .btn:nth-child(2) {

    background-color: var(--magenta);

}



.lang {

    right: 15px;

    bottom: -45px;

    z-index: 999;

}



.lang img {

    cursor: pointer;

}



header .nav-item > a:hover {

    color: var(--dark-red);

}



header .nav-item > a:focus {

    color: #fff;

}



header .dropdown-menu {

    border-radius: 0;

    background-color: var(--dark-red);

}



header .dropdown-menu li > a {

    font-weight: bold;

    color: #fff;

}



header .dropdown-menu li:not(:last-child) .dropdown-item {

    padding-bottom: 10px !important;

}



header .dropdown-menu .dropdown-item {

    background-color: transparent;

}



/* HEADER CONTENT */

#main-header .content > h3{

    color: var(--dark-red);

}



#main-header .content > h1 {

    font-size: 6rem;

    line-height: 85px;

}



#main-header .content .btn {

    font-size: 1.7rem;

    font-weight: bold;

    padding: 10px 25px;

}



#main-header .content .btn:nth-child(1) {

    background-color: var(--dark-red);

}



#main-header .content .btn:nth-child(2) {

    background-color: var(--magenta);

}



#main-header .content .btn:nth-child(3) {

    border: 1px solid var(--magenta);

}



/* SLIDER */

#slider h1 {

    font-size: 5rem;

    font-weight: bold;

}



#slider p {

    font-size: 1.3rem;

}



#slider .btn {

    font-size: 1.7rem;

    padding: 10px 50px;

    font-weight: bold;

    background-color: var(--dark-red);

    color: #fff;

}



/* GALLERY */

#gallery {

    background-color: var(--gray);

}



.parent > div > img {

    object-fit: cover;

}



.parent > div,

.parent > div > img {

    border-radius: 15px;

}



.parent {

    padding: 15px;

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(300px, 0.1fr));

    gap: 10px;

    justify-content: center;

}

    

.div1 {

    grid-row: span 2 / span 2;

    grid-column-start: 1;

    grid-row-start: 2;

}



.div2 {

    background-color: var(--dark-red);

    grid-row: span 2 / span 2;

    grid-column-start: 2;

    grid-row-start: 1;

}



.div3 {

    grid-row: span 2 / span 2;

    grid-column-start: 3;

    grid-row-start: 2;

}



.div4 {

    grid-row: span 2 / span 2;

    grid-column-start: 4;

    grid-row-start: 3;

}



.div5 {

    grid-row: span 3 / span 3;

    grid-column-start: 1;

    grid-row-start: 4;

}



.div6 {

    grid-row: span 2 / span 2;

    grid-column-start: 2;

    grid-row-start: 3;

}



.div7 {

    background-color: var(--magenta);

    grid-row: span 2 / span 2;

    grid-column-start: 3;

    grid-row-start: 4;

}



.div8 {

    grid-row: span 2 / span 2;

    grid-column-start: 4;

    grid-row-start: 5;

}



.div9 {

    grid-column-start: 3;

    grid-row-start: 6;

}



.div10 {

    grid-row: span 4 / span 4;

    grid-column-start: 2;

    grid-row-start: 5;

}



.div11 {



    background-color: var(--magenta);

    grid-row: span 2 / span 2;

    grid-column-start: 1;

    grid-row-start: 7;

}



.div12 {

    grid-row: span 3 / span 3;

    grid-column-start: 3;

    grid-row-start: 7;

}



.div13 {

    width: 75%;

    background-color: var(--dark-red);

    grid-row: span 2 / span 2;

    grid-column-start: 4;

    grid-row-start: 7;

}



.swiper {

    width: 85%;

    padding: 50px;

}



.swiper-slide {

    background-position: center;

    background-size: cover;     

    width: 500px;

    height: 250px;

}



.swiper-pagination-bullet-active {

    background-color: var(--dark-red) !important;

}



.swiper-button-next,

.swiper-button-prev {

    color: var(--dark-red);

}



.parent i::before {

    font-size: 75px;

}

           



/* MEET OURS SPEAKER */

.meet-out-speakers .btn {

    font-size: 1.7rem;

    padding: 10px 50px;

    font-weight: bold;

}

.meet-out-speakers .btn-outline  {

    border: 2px solid var(--dark-blue);

    color: var(--dark-blue)

}



.meet-out-speakers .btn-filled {

    background-color: var(--dark-red);

    color: #fff;

}



.meet-out-speakers .btn-join-brands-filled {

    background-color: var(--dark-red);

    color: #fff;

}



.previous-events {

    background-color: #000;

}



.previous-events .video {

    padding: 0 150px;

}



.previous-events .video h2{

    font-weight: bold;

}



.packet-top {

    width: 85%;

    background-color: var(--dark-blue);

    color: #fff;

    border-top-left-radius: 15px;

    border-top-right-radius: 15px;

}



.packet-middle {

    width: 100%;

    font-size: 1em;

    padding: 45px 15px 0 15px;

    border: 3px solid #000;

    border-radius: 15px;

    min-height: 425px;

}



.packet-bottom {

    width: 85%;

    background-color: var(--dark-blue);

    color: #fff;

    border-bottom-left-radius: 15px;

    border-bottom-right-radius: 15px;

}



.packet-middle ul li::marker {

    color: var(--dark-red);

}

#general .btn {
	background: var(--dark-red);
}



#startup h1 {

    color: var(--dark-red);

}



#startup .packet-middle {

    border: 3px solid var(--dark-red);

}



#startup .btn {

    /*border: 1px solid var(--dark-red);*/
	background: var(--dark-red);

}



#investor h1 {

    color: var(--magenta);

}



#investor .packet-middle {

    border: 3px solid var(--magenta);

}



#investor .btn {

    /*border: 1px solid var(--magenta);*/
	background: var(--dark-red);


}



#vip h1 {

    color: red;

}



#vip .packet-middle {

    border: 3px solid red;

}



#vip .btn {

    /*border: 1px solid red;*/
background: var(--dark-red);

}





/* FOOTER */

footer {

    background-color: var(--gray);

}



footer h5 {

    font-weight: bold;

    text-transform: uppercase;

    color: var(--dark-red);

}



footer ul {

    padding: 0;

}



footer ul li {

    padding-bottom: 15px;

    list-style-type: none;

}



footer ul li > a {

    padding-left: 30px;

    text-transform: capitalize;

    text-decoration: none;

    color: #fff;

}



footer .btn, footer .btn:hover {

    background-color: var(--dark-red);

}



footer li {

    position: relative;

}



footer li a::before {

    content: "";

    position: absolute;

    top: 0.6em;

    height: 0.5em;

    width: 0.5em;

    background-color: #fff;

    left: 0;

    clip-path: polygon(0 0, 0% 100%, 100% 0);

    transition: inherit;

}



footer li a:hover {

    color: var(--dark-red);

}





/* SUBPAGE */

#subpage-title {

    padding: 0 15%;

    color: #fff;

    background-color: #000;

}



#subpage-title span {

    color: red;

}



#subpage-title h1,
.desc h1,

.grab-investor-tickets h1, #who-attending h1, #book-tickets h1, #why-attend h1, #part-of-the-journey h1, #film h1, #community-partners h1{

    font-size: 60px;

    color: #000;

}



.gam,

#book-tickets h3,

#subpage-title h3 {

    font-size: 29px;

    color: #C2C2C2;

    word-spacing: 6px;

}



.desc {

    padding: 150px;

}



.desc span {

    color: red;

}



.desc p,

#why-attend p {

    line-height: 1.56;

    letter-spacing: 0.19px;

    white-space: pre-line;

}



.desc p > strong {

    color: #000;

} 





.desc a:not(.submit):not(.terms):not(.not-styled),

.grab-investor-tickets a, .vip-tickets a,

.border-btn, .join {

    display: flex;

    justify-content: center;

    align-items: center;

    text-decoration: none;

    color: #fff;

    background-color: var(--dark-red);

    font-weight: 600;

    height: 4em !important;

    width: 15em !important;

    border: 1px solid transparent;

    font-size: 0.8em;

    max-width: 100%;

    clip-path: polygon(0 0, 100% 0, 100% 100%, 1em 100%, 0 calc(100% - 1em));

    transition: .3s;

    position: relative;

    z-index: 1;

}



.desc a:not(.submit):not(.terms):not(.not-styled):hover,

.grab-investor-tickets a:hover, .vip-tickets a:hover, .join:hover {

    background: #06172c;

    color: var(--dark-red);

}



#book-tickets {

    padding: 70px 0;

    background-color: #000;

}



#book-tickets #btn-3 {

    width: 25em !important;

}



#book-tickets a#btn-3 {

    width: 25em !important;

}



#book-tickets .border-btn {

    background: none;

    border-color: #fff;

}



.border-btn::after {

    position: absolute;

    bottom: 0;

    left: 0;

    height: 1em;

    width: 1em;

    background: #fff;

    content: "";

    transition: inherit;

    clip-path: polygon(0 0, 0% 100%, 100% 100%);

    z-index: -1;

}



#join-these-brands a {

    color: var(--dark-red);

    background: #fff;

    border: 1px solid var(--dark-red);

}



#join-these-brands .border-btn::after {

    position: absolute;

    bottom: 0;

    left: 0;

    height: 1em;

    width: 1em;

    background: var(--dark-red);

    content: "";

    transition: inherit;

    clip-path: polygon(0 0, 0% 100%, 100% 100%);

    z-index: -1;

}



#join-these-brands .border-btn:hover {

    background-color: var(--dark-red);

    color: #fff;

}



#book-tickets .border-btn:hover {

    background: #fff;

    color: var(--dark-red);

}



#for_investor #prelegent,

#general-attended #prelegent {

    padding: 100px 0;

    background-color: var(--dark-red);

}



#for_investor #prelegent .shape,

#general-attended #prelegent .shape {

    position: absolute;

    z-index: 3;

    top: 0;

    right: 0;

    transform: translate(33%);

}



#for_investor #prelegent p,

#general-attended #prelegent p {

    background-color: #fff;

}



.grab-investor-tickets {

    background-image: url('img/other/nbxtoppic-high-scaled.png');

    background-repeat: no-repeat;

    background-size: cover;

}



.vip-tickets {

    background-image: url('img/other/vip-tickets.png');

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center;

}



#who-attending ul {

    padding: 0;

    list-style-type: none;

}



#who-attending ul li {

    color: #445566;

    padding-bottom: 15px;

}



#film {

    background: #000;

}



.col-2-4 {

    flex: 0 0 20%;

    max-width: 20%;

}

@media screen and (max-width: 576px) {
    .sponsor {
        bottom: 5px !important;
        right: 5px !important;
    }

    .btn-baner {
        margin-bottom: 75px;
    }

    #stats img {
        max-height: 45px !important;
    }

    #stats h1 {
        font-size: 20px;
    }

    /* #stats span {
        font-size: 17px !important;
    } */
}



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

    #subpage-title h1 {

        font-size: 34px !important;

    }



    #subpage-title h3 {

        font-size: 20px;

        color: #C2C2C2;

    }



    .desc {

        padding: 10px;

    }



    .desc h1,

    #community-partners h1 {

        font-size: 42px;

    }



    .desc {

        display: flex;

        flex-direction: column;

        justify-content: center;

        align-items: center;

        text-align: center;

    }



    #for_investor #prelegent img,

    #general-attended #prelegent img {

        width: 160px;

    }



    #for_investor #prelegent .shape,

    #general-attended #prelegent .shape {

        position: absolute;

        z-index: 3;

        top: 0;

        right: none !important;

        transform: translate(33%);

    }



    .col-2-4 {

        flex: 0 0 50%;

        max-width: 50%;

    }

}



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

    #main-header .content .btn,
    #slider .btn,
    .meet-out-speakers .btn {
        font-size: 1.3rem;
    }

    #subpage-title {

        padding: 0;

        color: #fff;

        background-color: #000;

    }



    #subpage-title h1 {

        font-size: 45px;

    }



    .previous-events .video {

        padding: 0px !important;

    }



    .parent {

        grid-template-columns: 1fr !important;

        grid-auto-flow: row;

    }



    .parent > div {

        grid-column: auto !important;

        grid-row: auto !important;

        width: 100% !important;

        position: static !important;

    }



    .parent img {

        position: static !important;

        width: 100% !important;

        height: auto !important;

    }



    #offcanvasMenu.offcanvas {
        background-color: #000
    }

    .navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
        color: #fff;
    }


    #slider h1 {
        font-size: 2.5rem;
    }

    #slider p {
        font-size: 1rem;
    }
	
	
	.clock-timer{
		font-size:20px !important;
	}
	
	.clock-timer span{
		font-size:14px !important;
	}

    .payment-method img{
        width: 65px;
    }

}

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

    .desc {

        padding: 20px;

    }

}



.swal2-title{

		margin-bottom:20px;

		line-height:30px;

	   }

	   

	   .swal2-timer-progress-bar{

			height:7px;

			border-radius:3px;

			background: rgb(234,0,48);

background: linear-gradient(90deg, rgba(234,0,48,1) 0%, rgba(239,0,122,1) 100%);

	   }

	   

	   .swal2-timer-progress-bar-container{

		background-color:#d6d6d6;

	   }

	   

	   .swal2-title{

		color:#333;

	   }


       @media(min-width: 992px) {
        header .dropdown:hover .dropdown-menu {
        display: block;
        margin-top: 0;
    }
	   

