@font-face {
    font-family: goldmanBold;
    src: url(./assets/fonts/Goldman-Bold.ttf);
}
@font-face {
    font-family: goldman;
    src: url(./assets/fonts/Goldman-Regular.ttf);
}
@font-face {
    font-family: mont;
    src: url(./assets/fonts/Montserrat-Regular.ttf);
}
@font-face {
    font-family: montSemi;
    src: url(./assets/fonts/Montserrat-SemiBold.ttf);
}
@font-face {
    font-family: montBold;
    src: url(./assets/fonts/Montserrat-Bold.ttf);
}
@font-face {
    font-family: montMid;
    src: url(./assets/fonts/Montserrat-Medium.ttf);
}
@font-face {
    font-family: montXBold;
    src: url(./assets/fonts/Montserrat-ExtraBold.ttf);
}
@font-face {
    font-family: ralewayBlack;
    src: url(./assets/fonts/Raleway-Black.ttf);
}
@font-face {
    font-family: ralewayMid;
    src: url(./assets/fonts/Raleway-Medium.ttf);
}
@font-face {
    font-family: raleway;
    src: url(./assets/fonts/Raleway-Regular.ttf);
}
@font-face {
    font-family: ralewayBold;
    src: url(./assets/fonts/Raleway-Bold.ttf);
}

:root{
    --primary: #1A5AFF;
    --page: #545454;
    --black: #000;
    --text: #424141;
}

*{
    margin: 0;
    padding: 0;
    appearance: none;
    outline: 0;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;
}

body::-webkit-scrollbar {
    display: none;
}

a{
    text-decoration: none;
    color: #1e1e1e;
}

.container{
    background: url(./assets/images/background4.png);
    background-position: center;
    background-size: cover;
    background-repeat: repeat;
    background-attachment: fixed;
    min-height: 100vh;
    width: 100vw;
    display: flex;
    flex-direction: column;
    gap: 50px;
    align-items: center;
}

.navbar{
    width: 100vw;
    height: 70px;
    padding: 20px 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo{
    display: flex;
    align-items: center;
    gap: 10px;

}

.logo img{
    width: 40px;
    animation: move 10s infinite ease alternate;
}

@keyframes move {
    from{
        transform: rotate(0deg);
    }
    from{
        transform: rotate(3600deg);
    }
}

.logo-name{
    font-family: goldman;
    font-size: 30px;
    color: var(--primary);
}

.links-list{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 30vw;
}

.links-list li a{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.link{
    font-family: montSemi;
    color: var(--page);
    font-size: 15px;
    text-transform: capitalize;
}

.active_link{
    font-family: montBold;
    color: var(--page);
    font-size: 15px;
    text-transform: capitalize;
}

.links-list li a img{
    display: none;
}

.links-list li a .active_page{
    display: flex;
}

.links-list li .page_link p{
    font-family: montBold;
}

.account{
    display: flex;
    align-items: center;
    gap: 15px;
}

.account a{
    font-family: montSemi;
    color: var(--page);
    font-size: 15px;
    text-transform: capitalize;
}

.account a button{
    padding: 10px;
    border: 2px solid var(--primary);
    width: 150px;
    font-family: montSemi;
    color: var(--page);
    font-size: 15px;
    text-transform: capitalize;
    background-color: white;
    border-radius: 5px;
}

.navbar .menu-icon{
    display: none;
}

.mobile-menu{
    display: none;
}

.hero{
    width: 100vw;
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    gap: 30px;
}

.hero-text{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 15px;
}

.max{
    font-size: 80px;
    text-align: center;
    font-family: montSemi;
    color: var(--black);
    text-transform: capitalize;
}

.min{
    font-family: montMid;
    font-size: 18px;
    text-align: center;
    width: 60%;
    color: var(--text);
}

.hero-text button{
    padding: 10px;
    border: 2px solid var(--primary);
    width: 150px;
    font-family: montSemi;
    color: white;
    font-size: 15px;
    text-transform: capitalize;
    background-color: var(--primary);
    border-radius: 5px;
    margin-top: 20px;
}

.hero-text button a{
    color: white;
}

.hero-image{
    width: 100vw;
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
}

.hero-image img{
    width: 85vw;
}

.facts{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.fact{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center; 
    gap: 1px;  
}

.fact .number{
    font-family: ralewayBlack;
    color: var(--primary);
    font-size: 50px;
}

.fact .text{
    font-family: mont;
    font-size: 16px;
    color: #5B5B5B;
    text-transform: capitalize;
}

.sponsors{
    background-color: white;
    width: 100vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sponsors-box{
    display: flex;
    align-items: center;
    gap: 50px;
}

.sponsors-box img{
    width: 100px;
    height: 100px;
}

.offers{
    background-color: #F4F3F8;
    width: 100vw;
    padding: 50px 90px;
    display: flex;
    align-items: top;
    justify-content: space-between;
}

.offer{
    width: 25%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.offer img{
    width: 50px;
}

.offer-head{
    font-family: montSemi;
    font-size: 18px;
    color: black;
    text-transform: capitalize;
}

.offer-content{
    font-family: mont;
    color: 424141;
    font-size: 16px;
}

.about{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100vw;
    gap: 50px;
    padding: 10px 90px;
}

.section-top{
    width: 100%;
}

.section-top .heading{
    font-family: montBold;
    color: var(--primary);
    font-size: 16px;
    text-transform: capitalize;
}

.section-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.about-left{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;

}
.left-top{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.left-heading{
    font-family: montSemi;
    font-size: 45px;
    color: black;
}

.left-sub{
    font-family: mont;
    font-size: 14px;
    color: #424141;
    width: 85%;
    text-align: center;
}

.left-content{
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 85%;
}

.opporunity{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.opporunity img{
    width: 40px;
}

.opp-head{
    font-family: montSemi;
    font-size: 18px;
    color: #000;
}

.opp-content{
    font-family: mont;
    font-size: 14px;
    color: #424141;
}

.about-left button{
    padding: 10px;
    border: 2px solid var(--primary);
    width: 150px;
    font-family: montSemi;
    color: white;
    font-size: 15px;
    text-transform: capitalize;
    background-color: var(--primary);
    border-radius: 5px;
}

.about-left button a{
    color: white;
}

.about-right img{
    width: 44vw;
}

.join{
    display: flex;
    flex-direction: column;
    width: 100vw;
    align-items: center;
    text-align: center;
    background: #1A5AFF;
    padding-top: 60px;
    padding-bottom: 40px;
}

.join-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.join-main{
    color: white;
    font-family: montXBold;
    font-size: 50px;
    width: 60%;
}

.join-sub{
    width: 55%;
    font-family: mont;
    font-size: 13px;
    color: white;
}

.join-facts{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 60%;
}

.join-facts > div{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center; 
    gap: 1px;
    color: white;
    padding: 50px 50px;
}


.j-number{
    font-family: ralewayBlack;
    color: white;
    font-size: 50px;
}

.j-text{
    font-family: mont;
    font-size: 14px;
    color: white;
    text-transform: capitalize;
}

.investments{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100vw;
    gap: 50px;
    padding: 10px 90px;
}

.investment-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    text-align: center;
}

.invest-left{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.invest-left .left-top{
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.invest-left .left-sub{
    text-align: center;
}

.invest-right{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100vw;
    padding: 30px;
    flex-wrap: wrap;
}

.invest-right > div{
    padding: 20px 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 22%;
    height: 500px;
    border-radius: 10px;
}

.invest-right > div img{
    width: 40px;
}

.invest-right > div button{
    width: 150px;
    padding: 15px;
    background-color: white;
    outline: none;
    border: none;
    border-radius: 5px;
    font-size: 18px;
    font-family: montSemi;
}

.invest-right > div .box-heading{
    font-family: montSemi;
    font-size: 20px;
}

.invest-right > div .box-content{
    font-family: mont;
    font-size: 16px;
    width: 90%;
    text-transform: capitalize;
}

.box-1{
    background: #FF7575;
    color: white;
}

.box-1 button a{
    color: #FF7575;
}

.box-2{
    background: #EEF07B;
    color: black;
}

.box-2 button a{
    color: #EEF07B;
}

.box-3{
    background: #1A5AFF;
    color: white;
}

.box-3 button a{
    color: #1A5AFF;
}

.box-4{
    background: #95D259;
    color: white;
}

.box-4 button a{
    color: #95D259;
}

.vault{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100vw;
    gap: 50px;
    padding: 10px 90px;
}
.vault .section-content{
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    gap: 70px; 
    align-items: flex-start;
    width: 100%;
}

.vault .section-content .left-top{
    gap: 20px;
}

.vault .about-right img{
    width: 44vw;
}

.featured{
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 20px;
    padding: 10px 90px;
}

.section-section-heading{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.section-section-heading .section-heading{
    font-family: montSemi;
    font-size: 45px;
}

.section-section-heading .section-heading-sub{
    font-family: mont;
    font-size: 16px;
    color: #424141;
    width: 60%;
}

.features{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.feature{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.feature-name{
    font-size: 17px;
    font-family: montSemi;
}

.feature-content{
    font-size: 14px;
    font-family: mont;
    color: #424141;
    width: 70%;
}

.feature img{
    width: 20vw;
}

.testimonials{
    display: flex;
    padding: 50px 90px;
    background: #F4F3F8;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

.test-left img{
    width: 40vw;
}

.test-right{
    width: 41vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.test-top-right{
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}

.test-top-right .heading{
    color: #1A5AFF;
    font-family: montBold;
    font-size: 18px;
    text-transform: capitalize;
}

.test-top-right .section-heading{
    font-family: montSemi;
    font-size: 45px;
    text-transform: capitalize;
    width: 80%;
}

.person-test{
    gap: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}

.person-test .comment{
    font-family: mont;
    color: #424141;
    font-size: 16px;
    width: 80%;
}

.person{
    display: flex;
    align-items: center;
    gap: 20px;
}

.person img{
    width: 80px;
}

.details{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.details .name{
    font-family: montBold;
    font-size: 20px;
    text-transform: capitalize;
}

.details .position{
    font-family: montSemi;
    font-size: 18px;
    text-transform: capitalize;
    color: #ADACAC;
}

.blog-section{
    text-align: center;
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 50px;
    gap: 20px;
}

.blogs{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;
}

.blog{
    width: 20%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.blog-heading{
    font-family: montSemi;
    font-size: 16px;
    text-align: left;
}

.blog-date{
    font-family: mont;
    color: #c9c9c9;
    font-size: 10px;
}

.blog-content{
    font-family: mont;
    color: #aaaaaa;
    font-size: 14px;
    text-align: left;
}

.blog-link{
    text-transform: capitalize;
    color: #1A5AFF;
    font-family: mont;
    font-size: 12px;
}

.blog img{
    width: 245px;
    border-radius: 10px;
}

.blog-page a button{
    width: 150px;
    height: 45px;
    border: 2px solid #1A5AFF;
    color: #545454;
    font-family: montSemi;
    font-size: 16px;
    background: white;
    outline: none;
    border-radius: 5px;
    text-transform: capitalize;
}

.bold{
    width: 100vw;
    background: #F4F3F8;
    display: flex;
    padding: 50px 90px;
    justify-content: space-between;
    align-items: center;
}

.bold-left img{
    width: 30vw;
}

.bold-right{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    width: 45vw;
}

.bold-right .section-head{
    font-family: montSemi;
    font-size: 50px;
    text-transform: capitalize;
    color: black;
    width: 80%;
}

.bold-right .section-sub{
    font-family: mont;
    font-size: 16px;
    color: #424141;
    width: 85%;
}

.bold-right a button{
    padding: 10px;
    border: 2px solid var(--primary);
    width: 150px;
    font-family: montSemi;
    color: white;
    font-size: 15px;
    text-transform: capitalize;
    background-color: #1A5AFF;
    border-radius: 5px;
}

.footer{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    padding: 10px 90px;
}

.footer .top{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10vw;
}

.footer .top .top-left{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 25px;
}

.footer .top .top-left .logo{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
}

.footer .top .top-left img{
    width: 90px;
}

.footer .top .top-left .logo .footer-name{
    font-family: goldman;
    font-size: 50px;
    color: #1A5AFF;
    text-transform: uppercase;
}

.footer .top .top-left .links{
    display: flex;
    align-items: center;
    gap: 20px;
}
.footer .top .top-left .links img{
    width: 30px;
}

.footer .top .top-left .copyright{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}

.footer .top .top-left .copyright .copyright-year{
    font-family: ralewayMid;
    font-size: 16px;
}

.footer .top .top-left .copyright .copyright-name{
    font-family: ralewayMid;
    font-size: 17px;
}

.footer .top .top-left .copyright .copyright-text{
    font-family: raleway;
    font-size: 16px;
}

.footer .top .top-right{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

.footer .top .top-right .link-group{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    width: 100%;
}

.footer .top .top-right .link-group .link-top{
    font-family: ralewayBold;
    font-size: 20px;
    color: black;
    text-transform: capitalize;
}

.footer .top .top-right .link-group .links{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    text-transform: capitalize;
    font-family: raleway;
    font-size: 17px;
}

.footer .top .top-right .link-group .links .subscribe-text{
    width: 84%;
}


.footer .top .top-right .link-group .links form{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.footer .top .top-right .link-group .links form input[type=email]{
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    padding: 10px;
    width: 216px;
    height: 30px;
    color: #1e1e1e;
    font-size: 14px;
    font-family: raleway;
    outline: none;
}

.footer .top .top-right .link-group .links form input[type=email]::placeholder{
    font-family: raleway;
    color: #BEBEBE;
    font-size: 13px;
}

.footer .top .top-right .link-group .links form input[type=button]{
    width: 80px;
    height: 30px;
    background-color: #1A5AFF;
    color: white;
    font-family: montBold;
    font-size: 10px;
    text-transform: capitalize;
    outline: none;
    border: none;
    border-radius: 3px;
}

.footer .bottom{
    width: 100vw;
    text-align: center;
    display: flex;
    align-items: center;
}

.footer .bottom .aegis{
    font-family: ralewayBlack;
    font-size: 200px;
    width: 100vw;
    text-align: center;
    color: rgba(132, 131, 172, 0.19);
}

@media screen and (max-width: 1200px){
    .links-list{
        width: 40vw;
    }
    .link{
        font-size: 12px;
    }
    .navbar{
        padding: 20px 30px;
    }
    .active_link{
        font-size: 12px;
    }
    .account a{
        font-size: 12px;
    }
    
    .account a button{
        padding: 7px;
        border: 2px solid var(--primary);
        width: 120px;
        font-family: montSemi;
        color: var(--page);
        font-size: 12px;
        text-transform: capitalize;
        background-color: white;
        border-radius: 5px;
    }
    .max{
        font-size: 60px;
    }
    
    .min{
        font-size: 16px;
    }
    .sponsors-box img{
        width: 10vw;
    }
    .offers{
        flex-direction: column;
        align-items: center;
    }
    .offer{
        width: 80%;
        align-items: center;
        text-align: center;
    }
    .about-right{
        display: none;
    }
    .join-facts > div{
        padding: 20px 20px;
    }
    .invest-right{
        align-items: center;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .invest-right > div{
        align-items: center;
        width: 80vw;
        text-align: center;
    }
    .investment-content{
        display: flex;
        flex-direction: column;
        align-items:center;
    }
    .features{
        flex-direction: column;
        gap: 20px;
    }
    .feature img{
        width: 60vw;
    }
    .blogs{
        flex-direction: column;
        text-align: center;
        align-items: center;
        gap: 20px;
    }
    .blog{
        width: 80%;
        align-items: center;
        text-align: center;
    }
    .blog-content{
        font-family: mont;
        color: #aaaaaa;
        text-align: center;
        width: 80%;
    }
    .blog img{
        width: 50vw;
        border-radius: 10px;
    }
    .bold{
        width: 100vw;
        background: #F4F3F8;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
    }
    .bold-left{
        display: none;
    }
    .bold-right{
        align-items: center;
        gap: 20px;
        width: 80vw;
        text-align: center;
    }
    .bold-right .section-head{
        width: 90%;
    }
    
    .bold-right .section-sub{
        width: 85%;
    }
    .footer .top{
        flex-direction: column;
        align-items: center;
    }
    .footer .top .top-left{
        align-items: center;
    }
    .footer .top .top-left .logo{
        align-items: center;
    }
    .footer .top .top-left img{
        width: 70px;
    }
    .footer .top .top-left .logo .footer-name{
        font-size: 55px;
    }
    .footer .top .top-left .links img{
        width: 20px;
    }
    .footer .top .top-left .copyright{
        align-items: center;
    }
    .footer .top .top-right{
        align-items: center;
        flex-direction: column;
        text-align: center;
        gap: 30px;
    }
    .footer .top .top-right .link-group{
        align-items: center;
        text-align: center;
    }
    .footer .top .top-right .link-group .link-top{
        font-size: 18px;
    }
    .footer .top .top-right .link-group .links{
        align-items: center;
    }
    .footer .top .top-right .link-group .links .subscribe-text{
        width: 90%;
    }
    .footer .top .top-right .link-group .links form{
        align-items: center;
    }
}

@media screen and (max-width: 768px){
    .container{
        gap: 20px;
    }
    .navbar{
        padding: 20px 20px;
    }
    .navbar .nav-links, .navbar .account{
        display: none;
    }
    .navbar .menu-icon{
        display: flex;
        cursor: pointer;
    }
    .max{
        font-size: 40px;
    }
    .min{
        font-size: 14px;
    }
    .fact .number{
        font-size: 30px;
    }
    
    .fact .text{
        font-family: mont;
        font-size: 14px;
        color: #5B5B5B;
        text-transform: capitalize;
    }
    .sponsors-box{
        display: flex;
        align-items: center;
        gap: 15px;
    }
    
    .sponsors-box img{
        width: 10vw;
    }
    .offers{
        background-color: #F4F3F8;
        width: 100vw;
        padding: 20px 20px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
        gap: 20px;
    }
    
    .offer{
        width: 90%;
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }
    
    .offer img{
        width: 40px;
    }
    
    .offer-head{
        font-family: montSemi;
        font-size: 16px;
        color: black;
        text-transform: capitalize;
        text-align: center;
    }
    
    .offer-content{
        font-family: mont;
        color: 424141;
        font-size: 14px;
        text-align: center;
    }
    .about{
        padding: 10px 20px;
    }
    .section-top .heading{
        font-size: 14px;
        text-align: center;
        
    }
    .section-content{
        flex-direction: column;
    }
    .about-left{
        align-items: center;
    }
    .left-top{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }
    .left-heading{
        font-size: 35px;
        text-align: center;
    }
    
    .left-sub{
        font-size: 12px;
        width: 85%;
        text-align: center;
    }
    
    .left-content{
        display: flex;
        flex-direction: column;
        gap: 20px;
        width: 85%;
    }
    .opporunity{
        align-items: center;
    }
    .opporunity img{
        width: 30px;
    }
    .opp-head{
        font-size: 16px;
        text-align: center;
    }
    
    .opp-content{
        font-size: 12px;
        text-align: center;
    }
    .about-right{
        display: none;
    }
    .join{
        padding: 60px 20px;
    }
    .join-main{
        color: white;
        font-family: montXBold;
        font-size: 35px;
        width: 80%;
    }
    .join-facts{
        width: 80%;
    }
    
    .join-sub{
        width: 55%;
        font-size: 11px;
    }
    .join-facts> div{
        padding: 0;
    }
    .j-number{
        font-size: 35px;
    }
    
    .j-text{
        font-size: 12px;
    }
    .investments{
        padding: 10px 20px;
        flex-direction: column;
        align-content: center;
    }
    .investment-content{
        flex-direction: column;
        align-items: center;
    }
    .invest-right{
        align-items: center;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .invest-right > div{
        align-items: center;
        width: 80vw;
        text-align: center;
        gap: 20px;
    }
    .invest-right > div img{
        width: 30px;
    }
    .invest-right > div .box-heading{
        font-size: 18px;
    }
    
    .invest-right > div .box-content{
        font-size: 14px;
    }
    .vault{
        gap: 30px;
        padding: 10px 20px;
        text-align: center;
    }
    .vault .section-content{
        display: flex;
        justify-content: space-between;
        flex-direction: row-reverse;
        gap: 70px; 
        align-items: center;
        width: 100%;
    }
    .vault .about-right{
        display: none;
    }
    .featured{
        padding: 10px 20px;
    }
    .section-section-heading .section-heading{
        font-size: 38px;
    }
    
    .section-section-heading .section-heading-sub{
        font-size: 14px;
        width: 75%;
    }
    .features{
        flex-direction: column;
        gap: 20px;
    }
    .feature{
        gap: 10px;
    }
    
    .feature-name{
        font-size: 15px;
    }
    
    .feature-content{
        font-size: 13px;
        font-family: mont;
        color: #424141;
        width: 85%;
    }
    
    .feature img{
        width: 60vw;
    }
    .testimonials{
        padding: 40px 20px;
        align-items: center;
        flex-direction: column;
        text-align: center;
    }
    .test-left{
        display: none;
    }
    .test-right{
        width: 90vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
    .test-top-right{
        align-items: center;
        text-align: center;
    }
    .test-top-right .section-heading{
        font-size: 38px;
        width: 90%;
    }
    .person-test{
        align-items: center;
    }
    .person{
        display: flex;
        flex-direction: column;
    }
    .person-test .comment{
        font-size: 14px;
        width: 90%;
    }
    .person img{
        width: 60px;
    }
    .details .name{
        font-size: 16px;
    }
    
    .details .position{
        font-size: 14px;
    }
    .blog-section{
        padding: 10px 20px;
    }
    .blogs{
        flex-direction: column;
        text-align: center;
        align-items: center;
        gap: 20px;
    }
    .blog{
        width: 100%;
        align-items: center;
    }
    .blog-heading{
        font-size: 14px;
        text-align: center;
    }
    
    .blog-content{
        font-family: mont;
        color: #aaaaaa;
        font-size: 12px;
        text-align: center;
        width: 80%;
    }
    .blog img{
        width: 50vw;
        border-radius: 10px;
    }
    .bold{
        width: 100vw;
        background: #F4F3F8;
        display: flex;
        padding: 30px 20px;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
    }
    .bold-left{
        display: none;
    }
    .bold-right{
        align-items: center;
        gap: 20px;
        width: 80vw;
        text-align: center;
    }
    .bold-right .section-head{
        font-size: 35px;
        width: 90%;
    }
    
    .bold-right .section-sub{
        font-size: 14px;
        width: 85%;
    }
    .footer{
        padding: 10px 20px;
    }
    .footer .top{
        flex-direction: column;
        align-items: center;
    }
    .footer .top .top-left{
        align-items: center;
    }
    .footer .top .top-left .logo{
        align-items: center;
    }
    .footer .top .top-left img{
        width: 70px;
    }
    .footer .top .top-left .logo .footer-name{
        font-size: 55px;
    }
    .footer .top .top-left .links img{
        width: 20px;
    }
    .footer .top .top-left .copyright{
        align-items: center;
    }
    .footer .top .top-left .copyright .copyright-year{
        font-size: 15px;
    }
    
    .footer .top .top-left .copyright .copyright-name{
        font-size: 16px;
    }
    
    .footer .top .top-left .copyright .copyright-text{
        font-size: 15px;
    }
    .footer .top .top-right{
        align-items: center;
        flex-direction: column;
        text-align: center;
        gap: 30px;
    }
    .footer .top .top-right .link-group{
        align-items: center;
        text-align: center;
    }
    .footer .top .top-right .link-group .link-top{
        font-size: 18px;
    }
    .footer .top .top-right .link-group .links{
        align-items: center;
    }
    .footer .top .top-right .link-group .links .subscribe-text{
        width: 90%;
    }
    .footer .top .top-right .link-group .links form{
        align-items: center;
    }
    .footer .bottom .aegis{
        font-size: 100px;
        width: 100vw;
    }
    .mobile-menu{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 30px;
        justify-content: space-between;
        width: 100vw;
        height: 100vh;
        position: absolute;
        z-index: 5;
        background: var(--primary-color);
        background: url(./assets/images/phone_background.png);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: fixed;
        padding: 80px 30px;
        color: var(--white-color);
        display: none;
        position: fixed;
    }
    .close-btn{
        width: 20px;
        position: absolute;
        top: 2%;
        right: 5%;
        cursor: pointer;
    }
    .close-btn img{
        width: 30px;
    }
    .mobile-menu-items{
        flex-direction: column;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: white;
        height: 50vw;
    }
    .mobile-menu-items a{
        color: #fff;
        font-family: montSemi;
        font-size: 18px;
        text-transform: capitalize;
    }
    .active-mobile-menu::after {
        content: "";
        display: flex;
        align-self: center;
        width: 25px;
        padding-top: 1px;
        border-bottom: 2px solid white;
    }
    .mobile-account{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
    .mobile-account a{
        color: #fff;
        font-family: montSemi;
        font-size: 18px;
        text-transform: capitalize;
    }
    .mobile-account .mobile-register{
        width: 150px;
        height: 50px;
        color: #1A5AFF;
        background: white;
        border-radius: 5px;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        font-family: montBold;
    }
    .mobile-logo{
        display: flex;
        gap: 10px;
        align-items: center;
    }
    .mobile-logo .mobile-name{
        font-family: goldman;
        font-size: 27px;
        text-transform: uppercase;
        color: white;
    }
}