html{
    overflow-x:hidden;
}

body{
    background: black;
}

@supports(padding:max(0px)) {
    body, header, footer {
        padding-left: min(0vmin, env(safe-area-inset-left));
        padding-right: min(0vmin, env(safe-area-inset-right));
    }
}

#videoBG {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translate(-50%, -50%);
}

.socials{
    display:none!important;
    margin-top:10px;
    width: 100%;
    bottom: 0;
    position: absolute;
    margin-bottom: 25px;
}

.socials i{
    display:inline-block;
    font-size:2em;
    background: white;
    color: black;
}

.socials span{
    text-align: center;
    padding-top:15px;
    padding-right:30px;
    padding-left:30px;
}

.fab {
    text-shadow: none;
    text-align: center;
    text-decoration: none;
    padding-left: 10px;
    padding-right:10px;
    padding-top:8px;
    padding-bottom:8px;
    border-radius: 100%;
}

.landing-contact span{
    font-size: 1.5em; /* 21 / 18 = 1.1667 */
    letter-spacing: 2px;
    padding-left:5px;
    padding-right:5px;
}

.landing-contact-container{
    color:white;
    font-family: 'Raleway', sans;
    margin-top:10px;
    display:none!important;
    bottom: 0;
    position: fixed;
}

#contact-number{
    margin-bottom:85px;
}

#contact-email{
    margin-bottom:110px;
}

@media (min-aspect-ratio: 16/9) {
    #videoBG {
        width:100%;
        height: auto;
    }
}
@media (max-aspect-ratio: 16/9) {
    #videoBG {
        width:auto;
        height: 100%;
    }
}
@media (max-width: 896px) {
    #videoBG {
        display: none;
    }
    body {
        background: url('../Assets/poster.png') no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    }
}

@media only screen and (max-width: 610px) {
    .socials{
        display:flex!important;
    }
    .landing-contact-container{
        display:block!important;
    }
}

@media only screen
and (max-device-width: 896px)
and (orientation: landscape)

and (-webkit-min-device-pixel-ratio: 2) {
    .socials{
        display:flex!important;
        margin-bottom:18px!important;
    }
    .socials i{
        font-size:1.2em;
    }
    .landing-contact-container{
        display:block!important;
        font-size:0.8em;
    }

    #contact-number{
        margin-bottom:55px;
    }

    #contact-email{
        margin-bottom:78px;
    }
}

/* Landscape ipad*/
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {
    .socials{
        display:flex!important;
    }
    .landing-contact-container{
        display:block!important;
        font-size: 1.2em;
    }
    #videoBG {
        display: none;
    }
    body {
        background: url('../Assets/poster.png') no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    .socials i {
        font-size: 2.3em;
    }
    #contact-email{
        margin-bottom:110px;
    }
    #contact-number{
        margin-bottom:80px;
    }
}

/* Portrait ipad */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
    .socials{
        display:flex!important;
    }
    .landing-contact-container{
        display:block!important;
        font-size: 1.3em;
    }
    #videoBG {
        display: none;
    }
    body {
        background: url('../Assets/poster.png') no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    .socials i {
        font-size: 2.5em;
    }
    #contact-email{
        margin-bottom:120px;
    }
    #contact-number{
        margin-bottom:90px;
    }
}

/* ----------- iPad Pro 10.5" -----------

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 834px)
and (max-device-width: 834px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
    .socials{
        display:flex!important;
    }
}

/* Ipad 10.5 Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 1112px)
and (max-device-width: 1112px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {
    .socials{
        display:flex!important;
    }
    .landing-contact-container{
        display:block!important;
        font-size: 1.2em;
    }
    #videoBG {
        display: none;
    }
    body {
        background: url('../Assets/poster.png') no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    #contact-email{
        margin-bottom:105px;
    }
    #contact-number{
        margin-bottom:75px;
    }
}

/* Landscape ipad pro 12.9"*/
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 1366px)
and (max-device-width: 1366px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {
    .socials{
        display:flex!important;
    }
    .landing-contact-container{
        display:block!important;
        font-size: 1.7em;
    }
    #videoBG {
        display: none;
    }
    body {
        background: url('../Assets/poster.png') no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    .socials i {
        font-size: 3em;
    }
    #contact-email{
        margin-bottom:140px;
    }
    #contact-number{
        margin-bottom:95px;
    }
}