@font-face {
    font-family: "Roboto-Regular";
    src: url("../fonts/Roboto/Roboto-Regular/fonts/Roboto-Regular.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: "Roboto-Light";
    src: url("../fonts/Roboto/Roboto-Light/fonts/Roboto-Light.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: "Myriad-Regular";
    src: url("../fonts/myriad-pro/MyriadPro-Regular/fonts/MYRIADPRO-REGULAR.woff") format("woff");
    font-display: swap;
}

.main-content-chart .chart-fdi-cls {
    background-color: #fff !important;
    border: 1px solid #f95808;
    color: black !important;
    width: 80%;
}

.main-content-chart .chart-fdi-cls.active {
    background-color: #f95808 !important;
    color: #fff !important;
    border: 1px solid #f95808;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.main-content-chart .chart-fdi-cls.active .icon-change-chart {
    background-color: #fff;
    color: #f95808;
    padding: 5px 12px;
    border-radius: 10px;
}

@media (max-width: 768px) {
    .main-content-chart .chart-fdi-cls.active .icon-change-chart {
        padding: 3px 6px;
    }
}

.main-content-chart .icon-change-chart {
    background-color: #f95808;
    color: #fff;
    padding: 5px 12px;
    border-radius: 10px;
}

@media (max-width: 768px) {
    .main-content-chart .icon-change-chart {
        padding: 3px 6px;
    }
}

.chart-fdi-op {
    background-color: #fff !important;
    border: 1px solid #22d294;
    color: black !important;
    width: 80%;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

.chart-fdi-op.active {
    background-color: #22d294 !important;
    color: #fff !important;
}

.chart-fdi-op.active .icon-change-chart {
    background-color: #fff;
    color: #22d294;
    padding: 5px 12px;
    border-radius: 10px;
}

@media (max-width: 768px) {
    .chart-fdi-op.active .icon-change-chart {
        padding: 3px 6px;
    }
}

.chart-fdi-op .icon-change-chart {
    background-color: #22d294;
    color: #fff;
    padding: 5px 12px;
    border-radius: 10px;
}

@media (max-width: 768px) {
    .chart-fdi-op .icon-change-chart {
        padding: 3px 6px;
    }
}

#v-pills-tabContent .title {
    font-size: 16px;
    font-family: "Roboto-Bold";
    color: #1f4e79;
}

@media (max-width: 768px) {
    #v-pills-tabContent .chart-mt {
        padding-top: 10px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
}