body {
    font-family: 'Public Sans';
    font-style: normal;
}


.p-64 {
    padding: 64px;
}

.containerIcons {
    height: 32px;
    width: 32px;
}

.containerTitle {
    font-size: 32px;
}




#topNavbar {
    background-color: #D9FBFBE5;
    border-radius: 16px;
    top: 16px;
    left: 64px;
    right: 64px;
    padding: 0px 32px;
    min-height: 84px;
    color: #161616;
}

.topNavbarIcons {
    width: 16px;
    height: 16px;
}

.nav-link {
    color: #161616;
}





#topContainer {
    background-color: #007D79;
    padding-left: 64px;
    padding-right: 64px;
    height: 842px;
}

#logoContainer {
    padding-top: 385px;
}

#downloadButton {
    border: none;
    color: #007D79;
}

#downloadButton span {
    filter: invert(22%) sepia(81%) saturate(2633%) hue-rotate(163deg) brightness(96%) contrast(102%);
}

#fundHeader {
    font-size: 64px;
}

#shareClassButton {
    background-color: #007D79;
    color: #FFFFFF;
    width: auto;
    background-image: url(/shared/icons/downarrowwhite.svg);
    background-size: 16px;
}

#shareClassButton option {
    background-color: #FFFFFF;
    color: #161616;
}


#cumulativeDropdown {
    width: auto;
    background-image: url(/shared/icons/downarrow.svg);
    background-size: 16px;
}

#fundInvestDropdown {
    width: auto;
    background-image: url(/shared/icons/downarrow.svg);
    background-size: 16px;
}







#overviewContainer {
    background-color: #022B30;
    padding-left: 64px;
    padding-right: 64px;
    max-height: 1000px;
    min-height: 800px;
}

#fundStatusBar {
    border-radius: 12px;
    margin: 0;
    top: -100px;
    background-color: #FFFFFF;
}

.sharePrice {
    height: 214px;
}

.priceCol {
    border-right: 1px solid #004144;
}

.priceSubtitle {
    font-size: 12px;
}

.priceSubtitleRed {
    color: #DA1E28;
}

.questionMark {
    background-color: #525252;
    color: #FFFFFF;
}

#ratingCol {
    background-color: #D9FBFB;
}

#medalCol {
    background-color: #9EF0F0;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}


#overviewDescription {
    color: #3DDBD9;
}







#fundDetailsContainer {
    padding-left: 64px;
    padding-right: 64px;
}



#fundCostDetails {
    background-color: #F4F4F4;
    border-radius: 0px 0px 12px 12px;
    padding: 64px;
}

#fundCostTitle {
    color: #161616;
}

.classCostDetails {
    color: #161616;
    border-bottom: 3px solid #161616;
}

.classCostValue {
    font-size: 32px;
    color: #161616;
}

.classCostDescriprion {
    font-size: 14px;
    color: #8D8D8D;
}


#performanceTitle {
    color: #121619;
}



#cumulativePerformanceContainer {
    background-color: #004144;
}



#annualPerformanceContainer {
    background-color: #022B30;
}

.annualDescription {
    font-size: 14px;
    color: #C6C6C6;
}




#fundStatisticsContainer {
    background-color: #F4F4F4;
}

.statisticsDescription {
    font-size: 14px;
    color: #6F6F6F;
}

#statisticsDropdown {
    background-color: #393939;
    color: #FFFFFF;
    width: auto;
    background-image: url(/shared/icons/downarrowwhite.svg);
    background-size: 16px;
}

#statisticsDropdown option {
    background-color: #FFFFFF;
    color: #161616;
}

.fundStatisticstable {
    font-size: 26px;
}




#fundInvestContainer {
    background-color: #004144;
}




#sectorContainer {
    background-color: #022B30;
}




.resourcelink,
.insightLinks {
    color: #007D79;
}





@media (max-width: 1399.98px) {}




@media (max-width: 1199.98px) {
    #topNavbar {
        left: 20px;
        right: 20px;
        padding: 0px 22px;
    }



    #fundHeader {
        font-size: 54px;
    }


    #fundStatusBar {
        top: -90px;
    }

    .sharePrice {
        height: 180px;
    }
}





@media (max-width: 991.98px) {
    #topNavbar {
        left: 64px;
        right: 64px;
        padding: 22px 32px;
    }



    #logoContainer {
        padding-top: 300px;
    }



    #fundStatusBar {
        top: -130px;
    }

    .sharePrice {
        height: 130px;
    }

    #ratingCol {
        width: 50%;
        border-bottom-left-radius: 12px;
    }

    #medalCol {
        width: 50%;
        border-bottom-right-radius: 12px;
        border-top-right-radius: 0px;
    }

    #overviewDescription {
        font-size: 20px;
    }

    #footerInvest,
    #footerLoop {
        border-radius: 1rem !important;
        margin: 0px;
        margin-top: 20px;
    }

    #footerContainer {
        padding: 10px !important;
    }
}




@media (max-width: 767.98px) {
    #topContainer {
        height: 1000px;
    }

    #logoContainer {
        padding-top: 280px;
    }

    #fundHeader {
        font-size: 45px;
    }



    #fundStatusBar {
        top: -165px;
    }

    .sharePrice {
        height: 165px;
    }

}




@media (max-width: 575.98px) {
    .containerIcons {
        height: 20px;
        width: 20px;
    }

    .containerTitle {
        font-size: 25px;
    }






    #topNavbar {
        left: 0px;
        right: 0px;
        top: 0px;
        border-radius: 0px;
        padding: 22px 0px;

    }



    #topContainer {
        height: 1100px;
        padding-left: 44px;
        padding-right: 44px;
    }

    #logoContainer {
        padding-top: 170px;
    }

    #hextoneLogo {
        padding-bottom: 15px;
    }

    #fundHeader {
        font-size: 35px;
    }





    #overviewContainer {
        padding-left: 44px;
        padding-right: 44px;
    }

    #fundStatusBar {
        top: -240px;
    }

    .sharePrice {
        border-bottom: 1px solid #004144;
        height: 120px;
    }

    .priceCol {
        border-right: none;
    }

    #overviewRow {
        margin-top: -200px;
    }


    #fundDetailsContainer {
        padding-left: 44px;
        padding-right: 44px;
    }

    #fundCostDetails {
        padding: 44px;
    }

    #fundCostDetails {
        padding: 44px;
    }






    #cumulativePerformanceContainer {
        padding: 44px;
    }



    #annualPerformanceContainer {
        padding: 44px;
    }



    #fundStatisticsContainer {
        padding: 44px;
    }

    .fundStatisticstable {
        font-size: 16px;
    }



    #fundInvestContainer {
        padding: 44px;
    }


    #sectorContainer {
        padding: 44px;
    }


    #footer {
        border-radius: 0 !important;
    }

}