/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
    .carousel-caption h1 {
        font-size: 2.5rem;
        font-weight: 700;
        padding-bottom: 1rem;
    }
    .w-100 {
        width: auto !important;
    }
    .nav-pills div.nav-link {
        display: grid;
        padding: 1rem 10px;
        border: 3px solid #ccc;
        width: 130px;
        height: 160px;
    }
    .nav-pills div.nav-link p {
        font-size: 16px;
    }
    li.nav-item {
        margin: 5px auto;
    }
}


/* 
    ##Device = Tablets, Ipads (landscape)
    ##Screen = B/w 768px to 1024px
  */

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {}


/* 
    ##Device = Low Resolution Tablets, Mobiles (Landscape)
    ##Screen = B/w 481px to 767px
  */

@media (min-width: 481px) and (max-width: 767px) {}


/* 
    ##Device = Most of the Smartphones Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
  */

@media (min-width: 320px) and (max-width: 480px) {
    a.navbar-brand {
        margin: 0 auto;
    }
    .w-100 {
        width: auto !important;
    }
    .carousel-caption h1 {
        font-size: 1.6rem;
        font-weight: 700;
        padding-bottom: 1rem;
    }
    section#nosotros .iconos .col-md-6 {
        padding: 1rem;
        text-align: center;
    }
    .row {
        --bs-gutter-x: 0;
    }
    .nav-pills div.nav-link {
        display: grid;
        padding: 2rem 2rem;
        border: 3px solid #ccc;
        width: auto;
    }
    .nav-pills div.nav-link p {
        text-align: center;
    }
    section#clientes .nav-pills div.nav-link {
        width: auto;
    }
    #clientes .flex-column {
        flex-direction: row !important;
    }
    section#clientes .nav-pills div.nav-link {
        max-width: 190px;
        margin: auto;
    }
    li.nav-item {
        margin: 5px;
    }
    section#contacto .glass {
        padding: 2rem 2rem;
    }
    section#contacto h2 {
        font-size: 2rem;
    }
    section#contacto a {
        font-size: 16px;
    }
    section#contacto .form {
        padding: 2rem 2rem;
    }
    .navbar li.nav-item.idioma a {
        padding: 10px;
    }
    .fa-2x {
        font-size: 1em;
    }
    section#contacto ul li i {
        margin-right: 5px;
    }
}