/* ---------------------- Default ---------------------- */

* {
    list-style-type: none;
}

/* ---------------------- Import Font-Family ---------------------- */

@font-face {
    font-family: "Montserrat-Black";
    src: url("/Data/font/Montserrat/Montserrat-Black.ttf");
}
@font-face {
    font-family: "Montserrat-Light";
    src: url("/Data/font/Montserrat/Montserrat-Light.ttf");
}
@font-face {
    font-family: "Montserrat-Thin";
    src: url("/Data/font/Montserrat/Montserrat-Thin.ttf");
}
@font-face {
    font-family: "Montserrat-Medium";
    src: url("/Data/font/Montserrat/Montserrat-Medium.ttf");
}
@font-face {
    font-family: "Montserrat-SemiBold";
    src: url("/Data/font/Montserrat/Montserrat-SemiBold.ttf");
}

/* ---------------------- Font-Family ---------------------- */

.f-Montserrat-Black {
    font-family: Montserrat-Black,sans-serif;
}
.f-Montserrat-Light {
    font-family: Montserrat-Light,sans-serif;
}
.f-Montserrat-Thin {
    font-family: Montserrat-Thin,sans-serif;
}
.f-Montserrat-Medium {
    font-family: Montserrat-Medium,sans-serif;
}
.f-Montserrat-SemiBold {
    font-family: Montserrat-SemiBold,sans-serif;
}

/* ---------------------- Colors ---------------------- */
.f-white {
    color: white;
}
.f-red {
    color: red;
}
.f-red_2 {
    color: rgb(200, 0, 0);
}
.f-gray {
    color: #b1b1b1;
}
.f-gray_1 {
    color: #cecece;
}
.f-gray_2 {
    color: #838383;
}
.f-gray_3 {
    color: #646464;
}
.f-gray_4 {
    color: #36353B;
}
.f-gray_5 {
    color: #1d1c1f;
}
/* .f-brown {
    color: rgb(0, 0, 0);
} */

/* ---------------------- Size ---------------------- */

.f-1_3 {
    font-size: 1.3em;
}
.f-1_5 {
    font-size: 1.5em;
}
.f-2 {
    font-size: 2em;
}
.f-3 {
    font-size: 3em;
}


@media (min-width:1451px) {
    .f-4p {
        font-size: 2em;
    }
}
@media (max-width:1450px) and (min-width:1001px){
    .f-4p {
        font-size: 1.8em;
    }
}
@media (max-width:1000px) and (min-width:900px) {
    .f-4p {
        font-size: 1.6em;
    }
}
@media (min-width:715px) {
    .f-1p {
        font-size: 1em;
    }
    .f-1_3p {
        font-size: 1.3em;
    }
    .f-2p {
        font-size: 2em;
    }
}
@media (max-width:714px) and (min-width:531px){
    .f-1p {
        font-size: 0.9em;
    } 
    .f-1_3p {
        font-size: 1.1em;
    }   
    .f-2p {
        font-size: 1.7em;
    }
    
}
@media (max-width:530px) and (min-width:476px){
    .f-1p {
        font-size: 0.8em;
    } 
    .f-1_3p {
        font-size: 1em;
    }   
    .f-2p {
        font-size: 1.5em;
    }
}
@media (max-width:476px){
    .f-1p {
        font-size: 0.7em;
    } 
    .f-1_3p {
        font-size: 0.9em;
    }  
    .f-2p {
        font-size: 1.2em;
    } 
}

@media (min-width:501px) {
    .f-3p {
        font-size: 2em;
    }
}
@media (max-width:500px) and (min-width:441px){
    .f-3p {
        font-size: 1.7em;
    }
}
@media (max-width:440px) and (min-width:401px){
    .f-3p {
        font-size: 1.5em;
    }
}
@media (max-width:400px) {
    .f-3p {
        font-size: 1.3em;
    }
}

@media (min-width:1319px) {
    .f-5p {
        font-size: 1.5em;
    }
    .f-6p {
        font-size: 2em;
    }
}
@media (max-width:1320px) and (min-width:751px){
    .f-5p {
        font-size: 1em;
    }
        .f-6p {
        font-size: 1.5em;
    }
}
@media (max-width:750px){
    .f-5p {
        font-size: 0.8em;
    }
    .f-6p {
        font-size: 1.2em;
    }
}
