@font-face {
    font-family: 'blosta'; /*a name to be used later*/
    src: url('/fonts/BLOSTA.otf'); /*URL to font*/
}
@font-face {
    font-family: 'CormorantGaramond'; /*a name to be used later*/
    src: url('/fonts/CormorantGaramond-Light.ttf'); /*URL to font*/
}

body{
    font: 300 14px/25px CormorantGaramond, Arial,sans-serif;
    background-color: #F0F0E6 !important;
}

.gla_middle_titles h2{
    font: 400 45px / 80px blosta, Dosis;
}

h3{
    font: 400 30px/40px CormorantGaramond, Arial;
}

.gla_logo{
    font: 900 24px/18px CormorantGaramond, Arial;
}
.gla_logo_und{
    font: italic 400 14px/24px CormorantGaramond, Arial
}

img{
    max-width: 100%;
}

h4{
    font:400 22px/30px CormorantGaramond, Arial;
}

.text-center .countdown-section {
    margin: 0 12px;
}

.gla_animated_flower {
    max-width: 100px;
    max-height: 100px;
    margin: 0 40px;
}

.timeline{
    max-width:45vw;
    max-height:100%;
    padding-top: 25px;
}

.giftImage{
    margin: 20px 0;
    max-height:  90px;
    max-width: 500px;
}

@media (max-width: 768px) {
    .gla_middle_titles h2 {
        font: 400 35px / 80px blosta, Dosis;
        height: 150px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 0;
    }

    .container.text-center h2{
        max-width: 100%;
    }

    img.map{
        max-width: 100vw;
    }
}

@media (max-width: 515px) {
    .giftImage{
        max-width: 88vw;
    }
    .timeline{
        max-width:100vw;
        max-height:100%;
        padding-top: 25px;
    }
    h3{
       font: 400 20px/40px CormorantGaramond, Arial;
            padding-left: 6vw;
            padding-right: 6vw;
            margin: 5vw 0;
    }
    .gla_middle_titles h2 {
        font-size: 6vw; margin: 0;
        height: 80px;
        font-family: blosta, Dosis;
    }

    .container.text-center h2{
        max-width: 100%;
    }

    img.map{
        max-width: 100vw;
    }
}