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

/* base */

.base {
    width: 100%;
    height: 600px;

    background: #f6a30c;
    
    font-size: 18px;
    line-height: 20px;
    text-align: center;
    color: #999;
}

.base > ul {
    display: table;
    
    margin: 0 auto;
    padding: 0;
    
    width: 90%; max-width: 1500px;
    height: 100%;
}

.base > ul > li {
    display: table-cell;
    vertical-align: middle;

    height: 100%;
}

.base > ul > li:first-child {
    width: 30%;
    
    background: #fff;
}

.base > ul > li:last-child {
    width: 70%;
}

    @media only screen and (max-width: 1024px) {
        .base { height: auto; }

        .base > ul {
            display: flex;
            flex-direction: column;
            
            width: 100%;
        }
        
        .base > ul > li {
            padding: 50px 0;
        }

        .base > ul > li:first-child {
            order: 2;
            width: 100%;
        }
        
        .base > ul > li:last-child {
            order: 1;
            width: 100%;
        }

    }

.base .logo {
    display: block;
    
    margin: auto;
    
    width: 90%; max-width: 250px;
    height: auto;
}

.base .social-media img {
    margin: 30px 0 5px 0;

    width: 30px;
    height: auto;
}

.base .social-media > a:first-child { margin: 0 10px 0 0; }

.base nav {
    margin: auto;
    width: 95%;
    
    font-size: 18px;
    line-height: 20px;
    text-transform: uppercase;
    text-align: left;
    color: #fff;
}

.base nav > ul {
    margin: 0;
    padding: 40px 0 15px 0;

    width: 100%;
    
    float: left;
    
    border-top: 1px dashed#fff;
    border-bottom: 1px solid #fff;
}

.base nav > ul > li {
    margin: 0 5% 35px 0;

    float: left;
    
    list-style: none;
}

.base nav > ul > li:last-child { margin: 0; }

    @media only screen and (min-width: 1401px)  {
        .base nav > ul > li { margin: 0 2% 35px 0; }
        .base nav > ul > li:nth-child(1), .base nav > ul > li:nth-child(5), .base nav > ul > li:nth-child(6) { width: 13%; }
        .base nav > ul > li:nth-child(2), .base nav > ul > li:nth-child(3), .base nav > ul > li:nth-child(4) { width: 17%; }
        .base nav > ul > li:nth-child(6n+0) { margin: 0 0 35px 0; }
        .base nav > ul > li:nth-child(6n+1) { clear: both; }
    }

    @media only screen and (min-width: 1025px) and (max-width: 1400px) {
        .base nav > ul > li { width: 21.25%; }
        .base nav > ul > li:nth-child(4n+0) { margin: 0 0 35px 0; }
        .base nav > ul > li:nth-child(4n+1) { clear: both; }
    }

    @media only screen and (max-width: 1024px) {
        .base nav > ul > li { width: 30%; }
        .base nav > ul > li:nth-child(3n+0) { margin: 0 0 35px 0; }
        .base nav > ul > li:nth-child(3n+1) { clear: both; }
        
        .base nav > ul {
            margin: 0;
            padding: 0;
            
            border-top: none;
        }
    }

.base nav > ul > li > a {
    display: block;
    
    padding: 0 0 0 10px;
    
    border-left: 1px solid #fff;
}

.base nav > ul > li > ul {
    margin: 10px 0 0 11px;
    padding: 0;
    
    width: 100%;
    
    font-size: 15px;
    line-height: 16px;
    
    opacity: 0.8;
    filter: alpha(opacity=80);
}

.base nav > ul > li > ul > li {
    margin: 0 0 10px 0;
    padding: 0;
    
    list-style: none;
}

.base nav > ul > li > ul > li:last-child { margin: 0; }

.datos {
    width: 95%;
    
    margin: auto;
    
    border-bottom: 1px dashed #fff;

    font-size: 18px;
    line-height: 20px;
    text-align: center;
    color: #fff;
}

.datos > ul {
    margin: 0;
    padding: 40px 0;

    width: 100%;
    
    float: left;
}

.datos > ul > li {
    margin: 0;
    padding: 0;

    width: 50%;
    
    float: left;
    
    list-style: none;
}

.datos img {
    display: inline-block;
    vertical-align: text-top;
    
    margin: 3px 5px 0 0;
    
    width: auto;
    height: 18px;
    
    -webkit-filter: brightness(10000%); /* Safari */
    filter: brightness(10000%);
}

    @media only screen and (max-width: 1024px) {        
        .datos {
            border-bottom: none;
        }
        
        .datos > ul {
            padding: 25px 0 0 0;
        }
        
        .datos > ul > li {
            margin: 0 0 10px 0;
            width: 100%;
        }
        
        .datos > ul > li:last-child { margin: 0; }
    }
.aviso-privacidad { color: #f6a30c; }
.aviso-privacidad:hover { color: #333; }
