/* === Opening message and photo === */
article:nth-child(1){
    background-color: #F0F0F0;
    height: 65vw;
    position: relative;
}

article:nth-child(1) h1{
    color: #0F1425;
    font-size: 4vw;
    font-weight: 350;
    left: 5vw;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: absolute;
    top: 8vw;
}

article:nth-child(1) div.paragraph-separator{
    background-color: #0F1425;
    left: 5vw;
    position: absolute;
    top: 21vw;
}

article:nth-child(1) p{
    color: #0F1425;
    font-size: 1.5vw;
    font-weight: 350;
    left: 5vw;
    line-height: 2.5vw;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: absolute;
    width: 40vw;
}

article:nth-child(1) p:nth-child(3){
    top: 23vw;
}

article:nth-child(1) p:nth-child(4){
    top: 27vw;
}

article:nth-child(1) img{
    height: 65vw;
    mask-image: linear-gradient(to left, rgba(0,0,0,1), rgba(0,0,0,0));
    -webkit-mask-image: -webkit-gradient(linear, right bottom, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
    position: absolute;
    right: 0;
    top: 0;
}

@media only screen and (max-device-width: 480px){
    article:nth-child(1){
        height: 240.312vw;
    }

    article:nth-child(1) h1{
        font-size: 9vw;
        top: 10vw;
    }

    article:nth-child(1) div.paragraph-separator{
        top: 32vw;
    }

    article:nth-child(1) p{
        font-size: 3.9vw;
        line-height: 6.5vw;
        width: 90vw;
    }

    article:nth-child(1) p:nth-child(3){
        top: 36vw;
    }

    article:nth-child(1) p:nth-child(4){
        top: 43vw;
    }

    article:nth-child(1) img{
        height: auto;
        left: 0;
        mask-image: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0));
        -webkit-mask-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
        top: 120vw;
        width: 100vw;
    }
}

/* === Contact Form === */
fieldset#contact-form{
    left: 5vw;
    position: absolute;
    top: 38vw;
}

fieldset#contact-form form ul#contact-form-ul span:nth-child(1) li{
    margin: 0 4vw 0 0;
}

fieldset#contact-form form ul#contact-form-ul div.content-separator{
    background-color: #ACBBC6;
    height: 0.1vw;
    margin: 2.5vw 9.8vw 2.5vw 9.8vw;
    width: 40vw
}

fieldset#contact-form form ul#contact-form-ul span:nth-child(3){
    height: 9.5vw;
    margin: 0 4.8vw 2.5vw 4.8vw;
}

fieldset#contact-form form ul#contact-form-ul span li textarea{
    height: 7.5vw;
    padding: 1vw 2vw 1vw 2vw;
    resize: none;
    width: 45.8vw;
}

fieldset#contact-form form ul#contact-form-ul span.form-submit{
    margin: 0 21.1vw 0 21.1vw;
}

@media only screen and (max-device-width: 480px){
    fieldset#contact-form{
        left: 0;
        top: 70vw;
    }

    fieldset#contact-form form ul#contact-form-ul span:nth-child(1) li{
        height: 9.13vw;
        margin: 2.5vw 14.185vw 2.5vw 14.185vw;
    }

    fieldset#contact-form form ul#contact-form-ul div.content-separator{
        height: 0.415vw;
        margin: 4vw 20vw 4vw 20vw;
        position: relative;
        width: 60vw;
        z-index: 2;
    }

    fieldset#contact-form form ul#contact-form-ul span:nth-child(3){
        height: 20vw;
        margin: 6.5vw 5vw 6.5vw 5vw;
        width: 90vw;
    }

    fieldset#contact-form form ul#contact-form-ul span:nth-child(3) li{
        height: 20vw;
    }

    fieldset#contact-form form ul#contact-form-ul span li textarea{
        height: 16vw;
        padding: 2vw 3vw 2vw 3vw;
        width: 83.17vw;
    }

    fieldset#contact-form form ul#contact-form-ul span.form-submit{
        margin: 6.5vw 0 6.5vw 13.75vw;
        position: relative;
        width: 72.5vw;
        z-index: 2;
    }
}