html,
body{
    margin:0;
    padding:0;
    background:#000;
    color:#fff;
    font-size:20px;
    font-family: 'Roboto', sans-serif, arial, helvetica;
}

a,
a:hover,
a:focus{
    text-decoration: none;
}

h1 p{
    opacity:0;
    height:0;
    margin:0;
}

.contact{
    text-align:center;
}

.contact a,
a.mobile-contact{
    color:#fff;
    font-weight: bold;
    -webkit-transition:300ms;
            transition:300ms;
}

.contact a:hover,
a.mobile-contact:hover{
    color:#E09004;
}




.main-wrapper{
    height: 96vh;
    padding:2vh;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
        -ms-flex-pack:justify;
            justify-content:space-between;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
}

.flex-section{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
        -ms-flex-pack:justify;
            justify-content:space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    max-height: 20vh;
    height: 20vh;
}


.flex-section article a img{
    width:auto;
    height:auto;
    max-height: 20vh;
    max-width: 100%;
    padding:0;
    margin:0;
}

.flex-section.middle-section{
    -webkit-box-pack:center;
    -webkit-justify-content:center;
        -ms-flex-pack:center;
            justify-content:center;
    max-height: 46vh;

}


.flex-section.middle-section a img{
    max-height: 46vh;

}
    
a.mobile-contact{
    display:none;
}

@media (max-width: 767px) {
  .main-wrapper{
    min-height: 100vh;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    padding:0 10px;
    -webkit-justify-content:space-around;
        -ms-flex-pack:distribute;
            justify-content:space-around;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
}

.flex-section{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
        -ms-flex-pack:justify;
            justify-content:space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    max-height: auto;
    height: auto;
}


.flex-section article a img{
    width:auto;
    height:auto;
    max-height: auto;
    max-width: 40vw;
    padding:0;
    margin:0;
}

.flex-section.middle-section{
    -webkit-box-pack:center;
    -webkit-justify-content:center;
        -ms-flex-pack:center;
            justify-content:center;
    max-height: 100%;  

}
    
.flex-section.middle-section article{
    text-align: center;
}    
    
    


.flex-section.middle-section a img{
    max-height: auto;
    max-width: 75vw;
    float:none;

}
    
    
    a.mobile-contact{
        display:block;
        font-size:16px;
}
    
    .flex-section article.not-mobile{
        display:none;
    }
    
}