@charset "UTF-8";
/* CSS Document */

/* portada */

.portada {
    position: relative;
    
    display: block;
    
    width: 100%;
    height: 100%;
    
    overflow: hidden;
}
    @media only screen and (max-width: 768px) {
        .portada {
            height: 50%;
        }
    }


/* no portada (encabezados) */


.no-portada {
    position: relative;
    
    display: block;
    
    width: 100%;
    height: 300px;
    
    overflow: hidden;
}

.no-portada h1 {
    z-index: 1;
    position: absolute; right: 0; bottom: 20px; left: 0;
    
    margin: 0;
    padding: 30px 0;
    
    line-height: 100%;
    font-weight: 300;
    letter-spacing: -.5px;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 0 0 6px #000;
    color: #fff;
}

    @media only screen and (max-width: 768px) {
        .no-portada {
            height: 250px;
        }
        
        .no-portada h1 { padding: 0; }
    }


/* nosotros */


.portada-nosotros {
    width: 100%;
}

.portada-nosotros .sombra { border-top: 1px solid #fff; }

.portada-nosotros ul {
    margin: auto;
    padding: 50px 0;
    
    width: 90%; max-width: 1500px;
}

.portada-nosotros li {
    margin: 0;
    padding: 0;
    
    list-style: none;
}

.portada-nosotros li:nth-child(1) {
    width: 40%;
    
    text-align: left;
}

    @media only screen and (max-width: 768px) {
        .portada-nosotros li:nth-child(1) {
            width: 100%;
        }
    }

.portada-nosotros li:nth-child(2) {
    text-align: center;
}

.portada-nosotros h1 {
    margin: 120px 0 20px 0;
    padding: 0;
    
    font-size: 40px;
    line-height: 40px;
    font-weight: 700;
    letter-spacing: -.5px;
    color: #333;
}

.portada-nosotros h2 {
    margin: 0 0 12px 0;
    padding: 0;
    
    font-size: 30px;
    line-height: 30px;
    font-weight: 300;
    font-style: italic;
    letter-spacing: -.5px;
    text-align: center;
    color: inherit;
}


/* servicios */


.portada-servicios {
    margin: auto;
    padding: 75px 0 0 0;
    
    width: 100%;
    
    background: #fff;
}

.portada-servicios > div {
    margin: auto;
    
    width: 90%; max-width: 1500px;
}

.portada-servicios ul {
    margin: auto;
    padding: 0;
    
    float: left;
}

.portada-servicios li {
    padding: 0;
    
    list-style: none;

    float: left;
}

    @media only screen and (max-width: 768px) {
        .portada-servicios ul > li { margin: 0 10% 25px 0; width: 45%; }
        .portada-servicios ul > li:last-child { margin: 0 0 25px 0; width: 100%; }
        .portada-servicios ul > li:nth-child(2n+0) { margin:0 0 25px 0; }
        .portada-servicios ul > li:nth-child(2n+1) { clear: both; }
    }

    @media only screen and (min-width: 769px) and (max-width: 1023px) {
        .portada-servicios ul > li { margin: 0 3.333333333333333% 25px 0; width: 31.111111111111111%; }
        .portada-servicios ul > li:nth-child(4), .portada-servicios ul > li:nth-child(5) { width: 48.333333333333334%; }
        .portada-servicios ul > li:nth-child(3n+0), .portada-servicios ul > li:nth-child(5) { margin:0 0 25px 0; }
        .portada-servicios ul > li:nth-child(3n+1) { clear: both; }
    }

    @media only screen and (min-width: 1024px) {
        .portada-servicios ul > li { margin: 0 2.5% 25px 0; width: 18%; }
        .portada-servicios ul > li:nth-child(5n+0) { margin:0 0 25px 0; }
        .portada-servicios ul > li:nth-child(5n+1) { clear: both; }
    }

.portada-servicios a {
    display: block;
    
    background: #f3f3f3;
    
    color: #333;
}

.portada-servicios a:hover { color: #fff; text-shadow: 0 0 2px #666, 0 0 4px #666, 0 0 6px #666; background: #666; }

.portada-servicios a > div:nth-child(1) {
    width: 100%;
    
    overflow: hidden;
}

    @media only screen and (max-width: 768px) {
        .portada-servicios a > div:nth-child(1) { height: 320px; }
    }

    @media only screen and (min-width: 769px) and (max-width: 1023px) {
        .portada-servicios a > div:nth-child(1) { height: 450px; }
    }

    @media only screen and (min-width: 1024px) {
        .portada-servicios a > div:nth-child(1) { height: 640px; }
    }

.portada-servicios img {
    width: 100%;
    height: 100%;

    -o-object-fit: cover;
    object-fit: cover;
}

.portada-servicios a:hover img { top: -5%; left: -5%; width: 110%; height: 110%; }

.portada-servicios a > div:nth-child(2) {
    display: table;

    width: 100%;
    height: 85px;
    
    background: url(../img/portada/servicios/sombra.png) 100% 0 no-repeat;
    -o-background-size: 100% 50%;
    -moz-background-size: 100% 50%;
    -webkit-background-size: 100% 50%;
    background-size: 100% 50%;
    
    font-size: 20px;
    line-height: 22px;
    text-transform: uppercase;
    text-align: center;
}

    @media only screen and (max-width: 768px) {
        .portada-servicios a > div:nth-child(2) { font-size: 16px; line-height: 16px; }
    }

.portada-servicios font {
    display: table-cell;
    vertical-align: middle;
}