/* ----------- iPhone X ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
    .hero-logo{
      width: 100%!important;
    }
    .bottom-logo-2{
      width: 60%;
      height: auto;
    }
    .text-center-vertical{
      margin-top: 30px;
      text-align: center;
    }
    .bg-teal{
      background-image: unset!important;
      background-color: #5A8C98;
    }

    .bottom-20px{
      position: unset;
      bottom: unset;
    }

    .bottom-0px{
      position: unset;
      bottom:unset;
    }
    .px-custom{
      padding: 0 10px!important;
    }

    .slider {
      height: 300px;
      position: relative;
      margin: unset!important;
    }

    .bg-teal-2{
        background-image: linear-gradient(#5A8C98 60%,white 40%);/*,#5A8C98 76.66%, white 76.66%*/
        background-size: 100% 100%;
         background-repeat: no-repeat;
      }


}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

}


/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
        .hero-logo{
      width: 100%!important;
    }
    .bottom-logo-2{
      width: 60%;
      height: auto;
    }
    .text-center-vertical{
      margin-top: 30px;
      text-align: center;
    }
    .bg-teal{
      background-image: unset!important;
      background-color: #5A8C98;
    }

    .bottom-20px{
      position: unset;
      bottom: unset;
    }

    .bottom-0px{
      position: unset;
      bottom:unset;
    }
    .px-custom{
      padding: 0 10px!important;
    }
    .slider {
      height: 300px;
      position: relative;
      margin: unset!important;
    }

    .bg-teal-2{
        background-image: linear-gradient(#5A8C98 60%,white 40%);/*,#5A8C98 76.66%, white 76.66%*/
        background-size: 100% 100%;
         background-repeat: no-repeat;
      }
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
        .hero-logo{
      width: 100%!important;
    }
    .bottom-logo-2{
      width: 60%;
      height: auto;
    }
    .text-center-vertical{
      margin-top: 30px;
      text-align: center;
    }
    .bg-teal{
      background-image: unset!important;
      background-color: #5A8C98;
    }

    .bottom-20px{
      position: unset;
      bottom: unset;
    }

    .bottom-0px{
      position: unset;
      bottom:unset;
    }
    .px-custom{
      padding: 0 10px!important;
    }
    .slider {
      height: 300px;
      position: relative;
      margin: unset!important;
    }

    .bg-teal-2{
        background-image: linear-gradient(#5A8C98 60%,white 40%);/*,#5A8C98 76.66%, white 76.66%*/
        background-size: 100% 100%;
         background-repeat: no-repeat;
      }
}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

}

/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
           .hero-logo{
      width: 100%!important;
    }
    .bottom-logo-2{
      width: 60%;
      height: auto;
    }
    .text-center-vertical{
      margin-top: 30px;
      text-align: center;
    }
    .bg-teal{
      background-image: unset!important;
      background-color: #5A8C98;
    }

    .bottom-20px{
      position: unset;
      bottom: unset;
    }

    .bottom-0px{
      position: unset;
      bottom:unset;
    }
    .px-custom{
      padding: 0 10px!important;
    }
    .slider {
      height: 300px;
      position: relative;
      margin: unset!important;
    }

    .bg-teal-2{
        background-image: linear-gradient(#5A8C98 60%,white 40%);/*,#5A8C98 76.66%, white 76.66%*/
        background-size: 100% 100%;
         background-repeat: no-repeat;
      }
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
  
}