@font-face {
    font-family: "Futura";
    src: url("../fonts/futura/futura-light-bt.ttf") format("truetype");
    font-weight: 300;
    font-display: swap;
    font-style: light;
}
/* 
@font-face {
    font-family: "Superior";
    src: url("../fonts/superior/SuperiorTitleTRIAL-Light-BF642f8c4baa568.otf") format("truetype");
    font-weight: 300;
    font-display: swap;
    font-style: light;
} */

@font-face {
    font-family: "Futura";
    src: url("../fonts/futura/Futura-Book-font.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
    font-style: normal;
}
/* 
@font-face {
    font-family: "Superior";
    src: url("../fonts/superior/SuperiorTitleTRIAL-Regular-BF642f8c4ba8c96.otf") format("truetype");
    font-weight: 400;
    font-display: swap;
    font-style: normal;
} */

@font-face {
    font-family: "Futura";
    src: url("../fonts/futura/futura-medium-bt.ttf") format("truetype");
    font-weight: 500;
    font-display: swap;
    font-style: medium;
}
/* 
@font-face {
    font-family: "Superior";
    src: url("../fonts/superior/SuperiorTitleTRIAL-Medium-BF642f8c4abbf2d.otf") format("truetype");
    font-weight: 500;
    font-display: swap;
    font-style: medium;
} */

@font-face {
    font-family: "Futura";
    src: url("../fonts/futura/Futura-Heavy-font.ttf") format("truetype");
    font-weight: 600;
    font-display: swap;
    font-style: semibold;
}

/* @font-face {
    font-family: "Superior";
    src: url("../fonts/superior/SuperiorTitleTRIAL-Bold-BF642f8c4bdeb39.otf") format("truetype");
    font-weight: 600;
    font-display: swap;
    font-style: semibold;
} */

@font-face {
    font-family: "Futura";
    src: url("../fonts/futura/futur.ttf") format("truetype");
    font-weight: 700;
    font-display: swap;
    font-style: bold;
}
/* 
@font-face {
    font-family: "Superior";
    src: url("../fonts/superior/SuperiorTitleTRIAL-Black-BF642f8c4bb6dce.otf") format("truetype");
    font-weight: 800;
    font-display: swap;
    font-style: bold;
} */

@font-face {
    font-family: "Futura";
    src: url("../fonts/futura/Futura-Extra-Black-font.ttf") format("truetype");
    font-weight: 800;
    font-display: swap;
    font-style: extrabold;
}

@font-face {
    font-family: "Futura";
    src: url("../fonts/futura/Futura-XBlk-BT.ttf") format("truetype");
    font-weight: 900;
    font-display: swap;
    font-style: heavy;
}

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&display=swap');
  
.futura {
    font-family: "Futura" !important;
} 
.Superior {
    font-family: "Lato", sans-serif !important;
}

p {
    font-family: Futura; 
    font-size: 20px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Lato", sans-serif;
}

nav {
    align-items: center;
}

nav ul li {
    display: inline-block;
}

nav ul li a {
    padding: 8px 20px;
}

.jack {
    backdrop-filter: blur(5px);
}

#icon {
    padding: 5px 7px 3px 7px;
    border-radius: 4px;
    cursor: pointer;
    transition: all .3s ease;
}

#icon svg {
    color: #FFF;
    height: 28px;
    transition: all .3s ease;
}

#icon:hover svg {
    color: #0075FF;
}

#checkbox,
#icon {
    display: none;
}

@media screen and (max-width: 1000px) {
    /* nav {
        border-bottom: 1px solid #455468;
    } */

    nav .oggy {
        z-index: 10;
        position: absolute;
        width: 100%;
        backdrop-filter: blur(5px);
        background-color: #bcd7dc96;
        left: 0;
        top: 88px;
        overflow: hidden;
        max-height: 0;
        transition: max-height 0.3s ease;
    }

    nav .oggy li {
        display: block;
        padding: 10px 15px;
    }

    nav .oggy li a {
        display: block;
        padding: 0px 0;
    }

    .jack li a {
        padding: 0px 0px !important;
    }

    .jack {
        backdrop-filter: blur(5px);
    }

    #icon {
        display: block;
    }

    #checkbox:checked~ul {
        max-height: 900px;
        /* Adjust max height to show the menu */
    }

    #checkbox:checked~#icon #menuIcon {
        d: path("M6 18L18 6M6 6l12 12");
    }

}

.hero-banner{
    background-image: linear-gradient(45deg, #B3C8CF, transparent), url();
}