body {
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    background: #f1f2f6;
    color: #2c3e50;
    margin: 0;
    padding: 0;
}

.content {
    min-height: calc( 100vh - 122px );
}

header {
    background: #fff;
    padding: 5vh 10vw;
}

section {
    padding: 0 10vw;
    margin-top: 50px;
}

.logo {
    height: 50px;
}

h1 {
    color: #7653A1;
    font-size: 50px;
    font-weight: 300;
    margin-top: 0.83em;
    margin-bottom: 0.83em;
}

h2 {
    font-size: 36px;
    font-weight: 300;
    margin-top: 0.83em;
    margin-bottom: 0.83em;
}

footer {
    background: #2c3e50;
    color: #fff;
    padding: 50px 10vw;
}

    footer P {
        margin: 0;
        text-align: right;
    }

    footer a {
        color: #fff;
        text-decoration: none;
        font-weight: 600;
    }

        footer a img {
            margin-bottom: -6px;
        }

@media only screen and (orientation: portrait) {
    section {
        zoom: 1.5;
        top: 10vw;
        transform: translateY(0);
        margin-top: 10vw;
    }

    .logo {
        max-width: 100%;
        height: auto;
        ;
    }

    h1 {
        font-size: 24px;
    }

    h2 {
        font-size: 18px;
        margin-bottom: 5vh;
    }
}

@media only screen and (max-device-width: 823px) and (orientation: landscape) {
    section {
        position: relative;
        transform: translateY(0);
        margin-top: 10vh;
    }
}

@media only screen and (max-device-width: 720px) {
    footer p {
        line-height: 30px;
    }

        footer p span {
            display: block;
        }

        footer p .devider {
            display: none !important;
        }
}