@media only screen and (max-width: 1000px){
        .navbar {
                background-color: #FFFF;
        
        } 
        
        .navbar .socialmedia {
                display: none;
        }   

        .footer {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
                background-color: #e4a947;
        }


        .footer .row{
                width: 90%;
                margin-left: 15px;
                color: #fff;
                line-height: 40px;
                font-size: 0.8em;
                text-align: justify;
        }

        .footer .row3{
                width: 90%;
                margin: auto;
                color: #fff;
                line-height: 25px;
                font-size: 0.8em;
                text-align: justify;
                padding-bottom: 1em;
        }

        .box1 input{ 
                width: 100%;
                padding-left: 2%;
                padding-top: 2%;
                padding-bottom: 2%;
                margin-bottom: 10px;
                font-family: 'Avenir Medium';
        
        }
        
        .box2 input{ 
                width: 100%;
                padding-left: 2%;
                padding-top: 2%;
                padding-bottom: 2%;
                font-family: 'Avenir Medium';
        
        }
        
        .box3 textarea{ 
                width: 100%;
                resize: vertical;
                margin-top: 10px;
                padding-left: 2%;
                padding-top: 2%;
                font-family: 'Avenir Medium';
        
        }


        .footer .logo-abajo{
                margin-left: 10%;
                width: 250px;
        }

        .footer .row2 h3{
                color: #fff;
                text-align: center;
                font-family:'Avenir Black';
                margin-bottom: 15px;
        }

        .footer .row3 h3{
                color: #fff;
                text-align: center;
                font-family:'Avenir Black';
                margin-bottom: 15px;
                font-size: 2.5em;
        }

        .totop-btn {
                position: fixed;
                width: 35px;
                height: 35px;
                background-color: #e4a947;
                bottom: 40px;
                right: 10px;
                text-decoration: none;
                text-align: center;
                line-height: 35px;
                border-radius: 8px;
                color: #fff;
                font-size: 18px;
        }


}


@media only screen and (max-width: 900px){
        
        .navbar {
                position: relative;
        }

        .navbar .logo {
        margin-right: 0;
        margin-left: 0;
        margin-bottom: 0;
        margin-top: 0;
        }


        .navbar .menubar {
                color: #00526c;
                display: block;
                grid-column: 4 / 6;
                grid-row: 2 / 2;
                text-align: right;
                font-size: 2em;
                cursor: pointer;
                padding-left: 210%;
                margin-top: -2em;
        }

        .navbar .menu a {
                text-decoration: none;
                color: #00526c;
                cursor: pointer;
                font-size: 1.2em;
        }

        .navbar .menu {
                position: absolute;
                width: 50%;
                height: 50vh;
                display: grid;
                align-items: center;
                background-color: #fff;
                margin-top: 25em;
                transform: translateX(-240%);
                transition: all 1s;
        }

        .navbar .menu-toggle {
                transform: translateX(180%);
        }

        .hero .info-content {
                grid-column: 2/7;
                grid-row: 4 / 6;
                color: #fff;
        }
        
        .hero h3 {
                font-family: 'Avenir Medium';
                font-size: 1.5em;
        }
        
        .hero h1 {
                font-size: 2em;
                color: #87ccd4;
                font-weight: 600;
        }
        
        .hero .btn {
                font-size: 1em;
                background: none;
                color: #fff;
                padding: 2px 2px;
                border: 1px solid;
                border-radius: 5px;
                margin-top: 10px;
        }

        .modal-contenido, .modal-contenido2{
                background-color:#fff;
                width:70vw;
                padding: 10px 10px;
                margin: 50% auto;
                position: relative;
        }

        .modal-btn, .modal-btn2{
                display: flex;
                background-color: #fff;
                border-radius: 25px;
                align-items: center;
                justify-content: center;
                text-decoration: none;
                padding: 2% 2%;
                margin-top: 10%;
                margin-left: 6%;
                margin-right: 6%;
                color: #00526c;
        }

        .aboutuno {
                height: 13vh;
        }

        .aboutuno1{
                grid-column: 2/5;
                text-align: center;
        }

        .aboutuno2{
                grid-column: 5/8;
                text-align: center;
        }

        .servicios{
                grid-template-columns: repeat(1,1fr);
        }

        .modalito {
                display: grid;
                grid-template-columns: 1fr;
        }

      

}

@media only screen and (max-width: 800px){
        .coso-img2 {
                margin: auto;
                max-width: 70%;
                display: block;
        }

        .coso-img3 {
                padding-top: 4em;
                margin: auto;
                max-width: 40%;
                display: block;
        }

        .the-logo .logo {
                margin: auto;
                height: 15em;
                width: 100%;
                padding: 10px;
        }

        .noti h1{
                padding: 25px;
        }
        
        .noti p{
                padding-left: 25px;
                padding-right: 25px;
        }

        .about h1{
                padding: 25px;
        }
        
        .about h3{
                padding-right: 25px;
                padding-left: 25px;
        }
        
        .about p{
                padding-right: 25px;
                padding-left: 25px;
        }

        .servicios-item{
                padding: 10px;
        }

        .servicios-item p{
                word-spacing: -3em;
        }

        .notis p{
                padding: 25px;
        }

        .servicios{
                padding-bottom: 45px;
        }
        
        .modals3, .modals4, .modals5{
                background-color: rgba(0,0,0,.8);
                position:fixed;
                top:0;
                left:0;
                right: 0;
                bottom: 0;
                opacity:0;
                margin-top: 0;
                pointer-events:none;
                transition: all 1s;
        }

}

@media screen and (max-width: 900px) {
#slide1:checked ~ #controls label:nth-child(2),
#slide2:checked ~ #controls label:nth-child(3),
#slide3:checked ~ #controls label:nth-child(4),
#slide4:checked ~ #controls label:nth-child(1),
#slide1:checked ~ #controls label:nth-last-child(2),
#slide2:checked ~ #controls label:nth-last-child(3),
#slide3:checked ~ #controls label:nth-last-child(4),
#slide4:checked ~ #controls label:nth-last-child(1), 

#xslide1:checked ~ #controls2 label:nth-child(2),
#xslide2:checked ~ #controls2 label:nth-child(3),
#xslide3:checked ~ #controls2 label:nth-child(4),
#xslide4:checked ~ #controls2 label:nth-child(1),
#xslide1:checked ~ #controls2 label:nth-last-child(2),
#xslide2:checked ~ #controls2 label:nth-last-child(3),
#xslide3:checked ~ #controls2 label:nth-last-child(4),
#xslide4:checked ~ #controls2 label:nth-last-child(1), 

#zslide1:checked ~ #controls3 label:nth-child(2),
#zslide2:checked ~ #controls3 label:nth-child(3),
#zslide3:checked ~ #controls3 label:nth-child(4),
#zslide4:checked ~ #controls3 label:nth-child(1),
#zslide1:checked ~ #controls3 label:nth-last-child(2),
#zslide2:checked ~ #controls3 label:nth-last-child(3),
#zslide3:checked ~ #controls3 label:nth-last-child(4),
#zslide4:checked ~ #controls3 label:nth-last-child(1)

{
        margin: 0;
}

#slides {
        width: 100%;
        margin: 0 auto;
}

#slide1:checked ~ #controls label:nth-child(2),
#slide2:checked ~ #controls label:nth-child(3),
#slide3:checked ~ #controls label:nth-child(4),
#slide4:checked ~ #controls label:nth-child(1), 

#xslide1:checked ~ #controls2 label:nth-child(2),
#xslide2:checked ~ #controls2 label:nth-child(3),
#xslide3:checked ~ #controls2 label:nth-child(4),
#xslide4:checked ~ #controls2 label:nth-child(1), 

#zslide1:checked ~ #controls3 label:nth-child(2),
#zslide2:checked ~ #controls3 label:nth-child(3),
#zslide3:checked ~ #controls3 label:nth-child(4),
#zslide4:checked ~ #controls3 label:nth-child(1)
{
        background: url(../img/130884.svg) no-repeat;
        float:right;
        margin: 50px -35px 0 0;
        display: block;
}

#slide1:checked ~ #controls label:nth-last-child(2),
#slide2:checked ~ #controls label:nth-last-child(3),
#slide3:checked ~ #controls label:nth-last-child(4),
#slide4:checked ~ #controls label:nth-last-child(1),

#xslide1:checked ~ #controls2 label:nth-last-child(2),
#xslide2:checked ~ #controls2 label:nth-last-child(3),
#xslide3:checked ~ #controls2 label:nth-last-child(4),
#xslide4:checked ~ #controls2 label:nth-last-child(1), 

#zslide1:checked ~ #controls3 label:nth-last-child(2),
#zslide2:checked ~ #controls3 label:nth-last-child(3),
#zslide3:checked ~ #controls3 label:nth-last-child(4),
#zslide4:checked ~ #controls3 label:nth-last-child(1)
{
        background: url(../img/130882.svg) no-repeat;
        float:left;
        margin: 50px 0 0 -35px;
        display: block;
}

.modal-contenido3, .modal-contenido4, .modal-contenido5{
        width:100vw;
        padding: 5px;
        margin: 50% auto;
        position: relative;
}

.modal-btn3, .modal-btn4, .modal-btn5{
        margin-top: 22%;
}


.fondillo, .fondillo2, .fondillo3 {
        width: 100%;
}

#slides .inner, #slides2 .inner, #slides3 .inner {
        transition: margin-left 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        width: 400%;
        line-height: 0;
        height: 200px;
}

.modal-contenido3 .equis3, .modal-contenido4 .equis4, .modal-contenido5 .equis5{
        color:#e4a947;
        font-size: 1.5em;
        margin-left: 50%;
}

#controls2 {
        margin: -180px 0 0 0;
}

#controls {
        margin: -180px 0 0 0;
}

#controls3 {
        margin: -180px 0 0 0
}

#controls label {
        display: none;
        width: 30px;
        height: 30px;
}

#controls2 label {
        display: none;
        width: 30px;
        height: 30px;
}

#controls3 label {
        display: none;
        width: 30px;
        height: 30px;
}

}