@import url('https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed&display=swap');
@import url(menu.css);
@import url(marcas.css);
@import url(funciones.css);

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    font-family: 'Roboto', sans-serif;
}

header{
    width: 100%;
    height: 50px;
    background: #333;
    color: #fff;
    
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}

.contenedor{
    width: 98%;
    margin: auto;
}

h1{
    float: left;
}

header .contenedor{
    display: table;
}


.slider{
    width: 100%;
    margin: auto;
    margin-top: 50px;
    overflow: hidden;
}

.slider ul{
    display: flex;
    padding: 0;
    width: 400%;
    
    animation: cambio 20s infinite alternate;
   
}

.slider li{
    width: 100%;
    list-style: none;
}

.slider img{
    width: 100%;
    height: 100%;
}

section{
    width: 100%;
    margin-bottom: 25px;
}

#inge {
    text-align: center;
    font-size: 20px;
    
}

footer .contenedor{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-bottom: 25px;
}

.copy{
    font-size: 20px;
}

.social{
    width: 100%;
    text-align: center;
    font-size: 28px;
}

.social a{
    text-decoration: none;
    color: #333;
}

.numero{
    width: 100%;
    text-align: center;
}

.numero .icon-phone-1{
    margin-right: 40px;
    font-size: 28px;
}

.numero .icon-whatsapp{
    font-size: 28px;
}

@keyframes cambio{
    0% {margin-left: 0;}
    20%{margin-left: 0;}
    
    25%{margin-left: -100%;}
    45%{margin-left: -100%;}
    
    50%{margin-left: -200%;}
    70%{margin-left: -200%;}
    
    75%{margin-left: -300%;}
    100%{margin-left: -300%;}
}


@media (min-width:1024px){
    .contenedor{
        width: 1000px;
    }
}

@media (min-width:768px){
    #banner {
        height: 300px;
        overflow: hidden;
    }
    
    #banner img {
        height: auto;
        margin-top: -100px;
    }
    
}

@media (min-width:1024px){
    #banner {
        height: 400px;
    }
    
    #banner img {
        height: auto;
        margin-top: -100px;
    }
}