/*--------------------------------------------------------------------- File Name: responsive.css ---------------------------------------------------------------------*/


/*------------------------------------------------------------------- 991px x 768px ---------------------------------------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 991px) {
    
}


/*------------------------------------------------------------------- 767px x 599px ---------------------------------------------------------------------*/

@media only screen and (min-width: 599px) and (max-width: 767px) {
    
}


/*------------------------------------------------------------------- 599px x 280px ---------------------------------------------------------------------*/

@media only screen and (min-width: 280px) and (max-width: 599px) {
    
}

@media (min-width: 1400px){
    .section1homeright-text.except {
        padding: 20% 0% !important;
    }
    
    .arrow {
        position: fixed;
        right: 3.5%;
        bottom: 108px;
    }
    .carousel-cert {
        height: fit-content;
    }
    .carousel-item img {
        width: 41%;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .element-img img{
    width: 170% !important;
    margin-top: -79%;
    margin-left: 10%;
    }
    .backgroundcontact svg {
        width: 15% !important;
    }
    .backgroundcontact svg {
        width: 15% !important;
    }
    .backgroundcontact #red-button button{
        width: 90% !important;
    }
    .arrow {
        position: fixed;
        right: 4%;
        bottom: 12.9%;
        z-index: 3;
        /*padding-top: 0% !important; 
        padding-right: 0% !important; 
        padding-bottom: 0% !important; 
        padding-left: 0% !important; */
    }
    
    .carousel-cert {
        height: 350px;
    }
    .carousel-clients {
        height: 200px;
    }
    .icon-social img{
        width: 70%;
        padding: 5% 2%;
    }
    .csa img{
        width:60%;
    }
    /*--------------LANDING---------------*/
    .section1landing .carousel-caption {
        padding: 0% 4%;
    }
    .section1landing .carousel-caption .span1{
        font-size: 2rem;
    }
    .section1landing .carousel-caption .span2{
        font-size: 3rem;
    }
    .section1landing .carousel-caption p{
        font-size: 1rem;
    }
    .navbarfirst-right.navbar-landing {
        display: flex !important;
        width: 50%;
        justify-content: flex-end !important;
    }
    .navbar-first.navbar-first-landing{
        padding-right: 0%;
        align-items: flex-end;
        justify-content: center;
        flex-wrap: nowrap;
    }
    .navbarfirst-right .navicono{
        /* border-left: 2px solid white; */
        width: 10%;
        background: white;
        padding: 1.5%;
        margin-left: 1%;
        padding: 1% 1% !important;
    }
    .navbar-first-landing .navicono img {
        width: 65%;
    }  
    .navbar-first.navbar-first-landing .navbarfirst-left {
        width:50%;
    }
    .container5-right.question1 h6, .container5-right.question3 h6 {
        width: 75%;
    }
    .section5landing .container5-right {
        padding: 3% 7%;
    }.containerleft h2 .span2, .containerleft h2 .span3 {
        font-weight: 700;
        font-size: 4.2rem;
        text-transform: uppercase;
    }
    .section6landing .contact-form-right p.text-up {
        font-size: 1rem;
    }
    .section6landing .contact-form-right h5 {
        font-size: 1.4rem;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .navbar-second {
        justify-content: space-between;
    }   
    .q1-section2home h6 {
        font-size: 1.5rem;
    }
    #title-contact {
        font-size: 4.5rem !important;
    }
    .info-contact {
        padding: 0% 5% !important;
    }
    .aboutm-img img{
        width: 90%;
    }
    .aboutus {
        padding: 2% 2% !important;
    }
    .element-img img {
        margin-left: 4%;
    }
    #red-button button, .red-button button {
        padding: 2% 5% !important;
    }
    .navbar-brand {
        width: 45%;
    }
    .info-contact #red-button {
        display: inline;
        justify-content: flex-start;
        
    }
    .backgroundcontact svg {
        width: 15%;
    }
    .backgroundcontact #red-button button{
        width: 100% !important;
    }
    .arrow {
        position: fixed;
        right: 4%;
        bottom: 80px;
        z-index: 200;
    }
    .carousel-cert {
        height: 300px;
    }
    .carousel-clients {
        padding: 5% 0%;
        height: 128px;
    }
    .icon-social img{
        width: 90%;
        padding: 0% 5%;
    }
    .navbar-first{
        padding-left: 5%;
    }
    
    .navbarfirst-left .navicono {
        width: 25%;
    }
    .csa img{
        width:50%;
    }
    /*--------------LANDING---------------*/
    .section1landing .carousel-caption {
        padding: 0% 5%;
    }
    .section1landing .carousel-caption .span1{
        font-size: 2.5rem;
    }
    .section1landing .carousel-caption .span2{
        font-size: 3rem;
    }
    .section1landing .carousel-caption p{
        font-size: 0.9rem;
    }
    .navbarfirst-right.navbar-landing {
        display: flex !important;
        width: 50%;
        justify-content: flex-end !important;
    }
    .navbar-first.navbar-first-landing{
        padding-right: 0%;
        align-items: flex-end;
        justify-content: center;
        flex-wrap: nowrap;
    }
    .navbarfirst-right .navicono{
        /* border-left: 2px solid white; */
        width: 10%;
        background: white;
        padding: 1.5%;
        margin-left: 1%;
        padding: 1% 1% !important;
    }
    .navbar-first-landing .navicono img {
        width: 86%;
    }  
    .navbar-first.navbar-first-landing .navbarfirst-left {
        width:50%;
    }
    .section3landing img {
        width: 30%;
    }
    .containerleft.except h2 .span2, .containerleft.except h2 .span3 {
        font-size: 3.5rem;
    }
    .section5landing .container5-right h6 {
        font-size: 1.4rem;
    }
    .section3landing h2 {
        font-size: 4rem;
    }
    .container5-right.question1 h6, .container5-right.question3 h6 {
        width: 67%;
    }
    .section6landing .containerleft h2 .span2, .containerleft h2 .span3 {
        font-weight: 700;
        font-size: 3rem;
        text-transform: uppercase;
    }
    .section6landing .contact-form-right h5 {
        text-transform: uppercase;
        font-size: 1.1rem;
    }
    .section6landing .contact-form-right p.text-up {
        font-size: 0.8rem;
    }
}

@media (min-width: 576px) and (max-width: 767px) { 
    .navbar-first{
        flex-direction: column !important;
    }
    .info-contact {
        padding: 0% 5% !important;
    }
    .backgroundcontact img {
        margin-left: 0%; 
        margin-bottom: 0%; 
        margin-top: 6%;
    }
    .section1homeright-text {
        /* padding: 16% 0% !important; */
        padding-bottom: 16% !important;
        padding-top: 5% !important;
    }
    .aboutm-text {
        margin-top: -24%;
        height: fit-content !important;
        padding: 20% 10% !important;
    }
    .aboutm-img img{
        width: 34%;
    }
    .backgroundcontact {
        margin-bottom: 5%;
    }
    .q1aboutus {
        /* padding-left: 5% !important; */
        padding: 7% 5% !important;
    }
    .element-img img {
        width: 183% !important;
        margin-top: -79%;
        margin-left: -32%;
    }
    .carousel-item img {
        width: 100%;
    }
    .carousel-clients {
        padding: 5% 0%;
        height: 300px;
    }
    #red-button button, .red-button button {
        padding: 2% 5% !important;
    }
    .navbarfirst-right{
        display: none;
    }
    .navbar-brand {
        width: 60% !important;
    }
    .navbarfirst-left{
        width: 90% !important;
    }
    svg {
        width: 100% !important;
    }
    .navicono {
        padding: 2% 5% !important;
    }
    .csa img{
        width: 95% !important;
    }
    #backgound-secction2home p {
        font-size: 1.9rem;
       
    }
    .q1aboutus-background {
        background-size: 120% 50% !important;
    }
    .footertittle{
        font-size: 1.5rem !important;
    }
    .info-contact #red-button{
        display: inline;
        justify-content: flex-start;
        padding: 3% 0%;
    }
    .info-contact #red-button button{
        display: inline;
        justify-content: flex-start;
        padding: 3% 0%;
    }
    .navbar-brand img {
        width: 75%;
    }
    .element-q {
        padding: 8% 3% !important;
    }
    .backgroundcontact svg {
        width: 15% !important;
    }
    .backgroundcontact #red-button button{
        width: 100% !important;
    }
    .arrow {
        position: fixed;
        right: 5%;
        bottom: 80px;
        z-index: 200;
    }
    .carousel-cert {
        height: fit-content;
    }
    .icon-social img{
        width: 60%;
        padding: 0% 5%;
    }
    .navbar-first{
        padding-left: 0%;
        padding-right: 45%;
    }
    
    .navbarfirst-left .navicono {
        width: 20%;
    }
    .navicono img {
        width: 100%;
    }
    /*--------------LANDING---------------*/
    .section1landing .carousel-caption {
        padding: 0% 5%;
    }
    .section1landing .carousel-caption .span1{
        font-size: 2.5rem;
    }
    .section1landing .carousel-caption .span2{
        font-size: 3rem;
    }
    .section1landing .carousel-caption p{
        font-size: 0.9rem;
    }
    .navbarfirst-right.navbar-landing {
        display: flex !important;
        width: 300px;
        justify-content: flex-end !important;
    }
    .navbar-first.navbar-first-landing{
        padding-right: 0%;
        align-items: flex-end;
        justify-content: center;
        flex-wrap: nowrap;
    }
    .navbarfirst-right .navicono{
        /* border-left: 2px solid white; */
        width: 15%;
        background: white;
        padding: 1.5%;
        margin-left: 1%;
        padding: 1% 1% !important;
    }
    .navbar-first-landing .navicono img {
        width: 86%;
    }    
    /*.containerleft h2 .span2, .containerleft h2 .span3 {
        font-size: 4rem;
    }*/
    .section3landing h2 {
        font-size: 3rem;
    }
    .containerline-yellow .line-yellow {
        bottom: 40px;
    }
    .section3landing p, .section3landing .esr p {
        text-align: left;
        font-size: 1.3rem;
    }
    .section3landing .row.landing-row1 {
        align-content: center !important;
        align-items: center !important;
    }
    .section3landing img {
        width: 43%;
        padding: 10% 0%;
    }
    .section3landing .landing-row2 {
        padding-top: 0%;
    }
    .containerleft.except h2 .span2, .containerleft.except h2 .span3 {
        font-size: 2.5rem;
    }
    .containerleft.except .container-line .line {
        bottom: 21px;
    }
    .section5landing .container5-right h6 {
        font-size: 0.8rem;
    }
    .container5-right.question1 h6, .container5-right.question3 h6 {
        width: 85%;
    }
}


@media (max-width: 575px) {
    .navbar-first{
        flex-direction: column !important;
    }
    .q1-section2service {
        padding: 7% 6%;
    }
    .section1homeright-text {
        padding: 0% 0% !important;
        padding-bottom: 23% !important;
        padding-top: 7% !important;
    }
    .navbarfirst-right{
        justify-content: center !important;
    }
    .q1-section2home h6 {
        font-size: 1.2rem;
    }
    #background-service {
        background-size: 100% 70%;
    }
    .navbarfirst-right a {
        font-size: 0.7rem;
        padding: 0% 5% !important;
    }
    .navbarfirst-right .navbar a{
        font-size: 1rem !important;
    }
    #title-contact {
        color: var(--second-red);
        font-weight: 800;
        font-size: 2rem !important;
    }
    .backgroundcontact img {
        margin-left: 0%; 
        margin-bottom: 0%; 
        margin-top: 6%;
    }
    #red-button button{
        font-size: 0.8rem;
    }
    .aboutm-img img{
        width: 50%;
    }
    .aboutm-text {
        margin-top: -24%;
        height: fit-content;
        padding: 0% 10% ;
        padding-top: 25% !important;
        padding-bottom: 10% !important;
        text-align: justify;
    }
    .section4-aboutus {
        margin-top: 0%;
        padding: 10% 0%;
    }
    .q1aboutus {
        /* padding-left: 5% !important; */
        padding: 7% 5% !important;
    }
    .q1aboutus span{
        font-size: 1.3rem !important;
    }
    .aboutus-text {
        width: 75%;
    }
    .q1aboutus-background {
        width: 100%;
        height: fit-content;
        background-image: url('../img/Nosotros_Somos/figurasomos.png');
        background-repeat: no-repeat;
        background-position: bottom;
        background-size: 105% 50%;
    }
    .element-img img {
        width: 129% !important;
        margin-top: -45%;
        margin-left: 15%;
    }
    .titlefirst-element h2 {
        font-size: 3rem;
    }
    .element-q {
        padding: 10% 4% !important;
    }
    .carousel-item img {
        width: 100%;
    }
    .carousel-clients {
        height: fit-content;
    }
    #red-button button, .red-button button {
        padding: 2% 5% !important;
        font-size: 95%;
    }
    .navbarfirst-right{
        display: none;
    }
    .navbar-brand {
        width: 80% !important;
    }
    .navbarfirst-left{
        width: fit-content;
    }
    svg {
        width: 100% !important;
    }
    .navicono {
        padding: 2% 9% !important;
    }
    .csa img{
        width: 65% !important;
    }
    #backgound-secction2home p {
        font-size: 1.5rem;
       
    }
    .q1aboutus-background {
        background-size: 120% 50% !important;
    }
    .footertittle{
        font-size: 1.5rem !important;
    }
    .navbar-brand img {
        width: 75%;
    }
    .q1aboutus-background .aboutus-title {
        font-size: 2.5rem;
    }
    .info-contact #red-button {
        display: inline;
        justify-content: flex-start;
        padding: 3% 0%;
    }
    .backgroundcontact svg {
        width: 15% !important;
    }
    .backgroundcontact svg {
        width: 15% !important;
    }
    .backgroundcontact #red-button button{
        width: 100% !important;
    }
    .arrow {
        position: fixed;
        right: 6%;
        bottom: 13%;
        z-index: 200;
    }
    .icon-social img{
        width: 70%;
        padding: 0% 5%;
    }
    .icon-social img{
        width: 60%;
        padding: 0% 5%;
    }
    .navbar-first{
        padding-left: 10%;
        padding-right: 40%;
    }
    
    .navbarfirst-left .navicono {
        width: fit-content;
    }
    .navicono img {
        width: 100%;
    }
    /*--------------LANDING---------------*/
    .section1landing .carousel-caption {
        padding: 5% 5%;
    }
    .section1landing .carousel-caption .span1{
        font-size: 1rem;
    }
    .section1landing .carousel-caption .span2{
        font-size: 1.8rem;
    }
    .section1landing .carousel-caption p{
        font-size: 0.5rem;
    }
    .navbarfirst-right.navbar-landing {
        display: flex !important;
        width: 90%;
        justify-content: flex-end !important;
    }
    .navbar-first.navbar-first-landing{
        padding-right: 0%;
        align-items: flex-end;
        justify-content: center;
        flex-wrap: nowrap;
    }
    .navbarfirst-right .navicono{
        /* border-left: 2px solid white; */
        width: 15%;
        background: white;
        padding: 1.5%;
        margin-left: 1%;
        padding: 1% 1% !important;
    }
    .navbar-first-landing .navicono img{
        width: 86%;
    }
    .containerleft h2 .span2, .containerleft h2 .span3 {
        font-size: 4rem;
    }
    .section3landing h2 {
        font-size: 3rem;
    }
    .containerline-yellow .line-yellow {
        bottom: 40px;
    }
    .section3landing p, .section3landing .esr p {
        text-align: left;
        font-size: 1.3rem;
    }
    .section3landing .row.landing-row1 {
        align-content: center !important;
        align-items: center !important;
    }
    .section3landing img {
        width: 70%;
        padding: 17% 0%;
    }
    .section3landing .landing-row2 {
        padding-top: 0%;
    }
    .section3landing .title-row {
        display: flex;
        justify-content: center;
        flex-direction: column;
        /* align-content: center; */
        align-items: flex-start;
    }
    .section3landing .esr img {
        width: 60% !important;
        padding:0%;
    }
    .containerleft.except h2 .span2, .containerleft.except h2 .span3 {
        font-size: 1.5rem;
    }
    .containerleft.except .container-line .line {
        bottom: 15px;
        height: 8px;
    }
    .section5landing .container5-right {
        padding: 7% 7%;
    }
    .row.container-mid{
        flex-direction: column-reverse!important;
    }
    .section5landing .container5-right h6 {
        font-size: 1.2rem;
    }
    .section6landing .containerleft h2 .span2, .containerleft h2 .span3 {
        font-size: 2.5rem;
    }
    .section6landing .contact-form-right h5 {
        text-transform: uppercase;
        font-size: 1.1rem;
    }
}