/* TEXT*/

@font-face {
    font-family: 'Work Sans';
    src: url('../WorkSans-VariableFont_wght.ttf');
    font-weight: 100 900; /* Ensures all weights are covered */
}
@font-face {
    font-family: 'Work Sans';
    src: url('../WorkSans-Italic-VariableFont_wght.ttf');
    font-style: italic;
    font-weight: 100 900; /* Ensures all weights are covered */
}

body{
    font-family: 'Work Sans', Tahoma, Helvetica, Arial, sans-serif;
}

html { /* Prevents Chrome on Android from scaling up text in certain containers. */
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

h1{
    font-weight: 700;
    font-size: clamp(35px, 5vw, 55px);
    color: #590af2;
    margin-bottom: 0;
    margin-top: 0;
}

h2{
    font-weight: 700;
    font-size: clamp(25px, 4vw, 29px);
    font-size: 27px;
    color: #590af2;
    margin-bottom: 0;
    margin-top: 0;
}
.h2bigger{
    font-size: clamp(30px, 4vw, 35px);
}

h3{
    font-weight: 500;
    font-size: clamp(25px, 4vw, 29px);
    color: #590af2;
    margin-bottom: 0;
    margin-top: 0;
}
h2, h3 , h4, h5{
    line-height: 1.5;
}

h4{
    font-weight: 600;
    font-size: clamp(20px, 3vw, 23px);
    color: #590af2;
    margin: 0;
}

h5{
    font-weight: 400;
    font-size: clamp(18px, 2vw, 20px);
    color: black;
    margin: 0;
    flex-shrink: 0;
}
h6{
    font-weight: 400;
    font-size: clamp(12px, 1.5vw, 18px);
    color: black;
    margin: 0;
    flex-shrink: 0;
}

p{
    font-weight:400;
    color: black;
    font-size: clamp(18px, 2vw, 20px);
    padding:0;
    margin:0;
    line-height: 2;
}

.bold{
    font-weight: 700;
}

.white{
    color: white;
}
.purple{
    color: #590af2;
}
.hoverPurple{
    color: #2a0393;
}
hr{
    height: 2px;
    color: black;
    background-color: black;
    border: none;
}

/* The above set font sizes apply for:
/* Desktop & laptop 
@media (min-width: 1200px) {
    
}

/* Tablet horizontal 
@media only screen and (max-width: 1199px) { 
    
}

/* Tablet vertical, Old Mobile, Small Desktop window 
@media only screen and (max-width: 999px) {
    
} */

/* Mobile horizontal */
@media only screen and (max-width: 999px) and (max-height: 799px) and (min-resolution: 190dpi) {
    h1{
        font-size: clamp(50px, 6vw, 60px);
        font-weight: 700;
    }
    h2, h3{
        font-size: clamp(30px, 5vw, 34px);
    }
    .h2bigger{
        font-size: clamp(35px, 4vw, 42px);
    }
    h4{
        font-size: clamp(25px, 3.5vw, 29px);
        font-weight: 600;
    }
    h5, p{
        font-size: clamp(22px, 2vw, 25px);
    }
    h6{
        font-size: clamp(18px, 1.5vw, 20px);
    }
}

/* Mobile vertical */
@media only screen and (max-width: 1100px) and (min-height: 800px) and (min-resolution: 190dpi) {
    h1{
        font-size: clamp(100px, 7vw, 125px);
        font-weight: 700;
    }
    h2, h3{
        font-size: clamp(65px, 6vw, 70px);
    }
    .h2bigger{
        font-size: clamp(75px, 4vw, 82px);
    }
    h4{
        font-size: clamp(56px, 6vw, 58px);
        font-weight: 600;
    }
    h5, p{
        font-size: clamp(45px, 5vw, 48px);
        flex-shrink: 0;
    }
    hr{
        height: 4px;
    }  
    .bold{
        font-weight: 730;
    }
    .h5small, h6{
        font-size: clamp(40px, 4.5vw, 43px);
        flex-shrink: 0;
    }
}