/* Typography CSS */
:root{
    --wp--preset--font-size--small: 0.8rem;
    --wp--preset--font-size--medium: 1.45rem;
    --wp--preset--font-size--large : 1.85rem;
    --wp--preset--font-size--x-large : 2.25rem
}

@font-face {
    font-family: 'Varela Round';
    src: url('fonts/VarelaRound-Regular.eot');
    src: url('fonts/VarelaRound-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/VarelaRound-Regular.woff2') format('woff2'),
        url('fonts/VarelaRound-Regular.woff') format('woff'),
        url('fonts/VarelaRound-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quicksand';
    src: url('fonts/Quicksand-Regular.eot');
    src: url('fonts/Quicksand-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Quicksand-Regular.woff2') format('woff2'),
        url('fonts/Quicksand-Regular.woff') format('woff'),
        url('fonts/Quicksand-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quicksand';
    src: url('fonts/Quicksand-Bold.eot');
    src: url('fonts/Quicksand-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/Quicksand-Bold.woff2') format('woff2'),
        url('fonts/Quicksand-Bold.woff') format('woff'),
        url('fonts/Quicksand-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quicksand';
    src: url('fonts/Quicksand-Medium.eot');
    src: url('fonts/Quicksand-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/Quicksand-Medium.woff2') format('woff2'),
        url('fonts/Quicksand-Medium.woff') format('woff'),
        url('fonts/Quicksand-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

.varela{
    font-family:'Varela Round';
}
h1, h2, h3, h4, h5, h6{
    font-family:'Varela Round';
    line-height: 1.05;
    margin:0.65em 0;
}
h1{
    font-size:2.5rem;
}
h2{
    font-size:2rem;
}
h3{
    font-size:1.5rem;
}
h4,h5,h6{
    font-size:1.35rem; 
}
@media screen and (min-width:768px){
    h1{
        font-size:3.25rem;
    }
    h2{
        font-size:2.5rem;
    }
}
.has-medium-font-size, .has-large-font-size, .has-x-large-font-size{
    line-height: 1.2
}