﻿body {
    font-family: Arimo, sans-serif;
}

#topLogo {
    position: absolute;
    top: 0;
    left: 0vw;
    width: 100%;
    height: 10vw;
}

#topLogoHr {
    position: absolute;
    height: 5px;
    width: 100%;
    top: 75%;
}

#topLogoImg {
    padding: 0 10px;
    position: absolute;
    top: 3vw;
    left: 10vw;
    height: 100%;
}

.box-row {
    margin-top: 30vw;
}

.h1 {
    font-size: 6vw;
}

.h3 {
    font-size: 4vw;
}

.h4 {
    font-size: 4vw;
    color: gray;
}

@media screen and (min-width: 576px) and (max-width: 767px) {
    #topLogo {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 10vw;
    }

    #topLogoHr {
        position: absolute;
        height: 5px;
        width: 100%;
    }

    #topLogoImg {
        padding: 0 10px;
        position: absolute;
        top: 2vw;
        left: 10vw;
    }

    .box-row {
        margin-top: 15vw;
    }

    .h3 {
        font-size: 4vw;
    }

    .h4 {
        font-size: 3vw;
    }
}


@media screen and (min-width: 768px) and (max-width: 991px) {
    #topLogo {
        position: absolute;
        width: 100%;
        height: 8vw;
    }

    #topLogoHr {
        position: absolute;
        height: 5px;
        width: 100%;
    }

    #topLogoImg {
        padding: 0 10px;
        position: absolute;
        top: 2vw;
        left: 15vw;
        height: 100%;
    }

    .box-row {
        margin-top: 15vw;
    }

    .h3 {
        font-size: 2.5vw;
    }

    .h4 {
        font-size: 2vw;
    }
}


@media screen and (min-width: 992px) { 
    #topLogo {
        position: absolute;
        width: 100%;
        height: 7vw;
    }

    #topLogoHr {
        position: absolute;
        height: 5px;
        width: 100%;
    }

    #topLogoImg {
        padding: 0 10px;
        position: absolute;
        top: 2vw;
        left: 15vw;
        height: 100%;
    }

    .box-row {
        margin-top: 10vw;
    }

    .h1 {
        font-size: 2vw;
    }

    .h3 {
        font-size: 2vw;
    }

    .h4 {
        font-size: 1.6vw;
    }
}


@media screen and (min-width: 1440px) { 
    #topLogo {
        position: absolute;
        width: 100%;
        height: 5vw;
    }

    #topLogoHr {
        position: absolute;
        height: 5px;
        width: 100%;
    }

    #topLogoImg {
        padding: 0 10px;
        position: absolute;
        top: 1vw;
        left: 15vw;
        height: 100%;
    }

    .box-row {
        margin-top: 10vw;
    }

    .h1 {
        font-size: 1.5vw;
    }

    .h3 {
        font-size: 1vw;
    }

    .h4 {
        font-size: 0.7vw;
    }
}