/*========================================================
Notch iOS device
 ========================================================*/


 .iOS .footer-component {
    padding-bottom: 20px;
    padding-top: 3%;
}

.iOS .header-component {
    padding-top: 13% !important;
    padding-bottom: 3%;
    height: auto;
}

/*========================================================
Non notch rules iOS Header
 ========================================================*/

@media only screen and (device-aspect-ratio: 375/667){
    .iOS .header-component{
        padding-top:7% !important;
        padding-bottom: 0%;
    }
}

@media only screen and (device-aspect-ratio: 9/16){
    .iOS .header-component{
        padding-top:7% !important;
        padding-bottom: 0%;
    }
}

@media only screen and (device-aspect-ratio: 40/71){
    .iOS .header-component{
        padding-top:7% !important;
        padding-bottom: 0%;
    }
}

/*========================================================
Footer non notch iOS
 ========================================================*/


@media only screen and (device-aspect-ratio: 375/667){
    .iOS .footer-component{
        /*padding-top: 1%;*/
        padding-bottom: 1%;
    }
}

@media only screen and (device-aspect-ratio: 9/16){
    .iOS .footer-component{
        /*padding-top: 2%;*/
        padding-bottom: 2%;
    }
}

@media only screen and (device-aspect-ratio: 40/71){
    .iOS .footer-component{
        /*padding-top: 1%;*/
        padding-bottom: 1%;
    }
}