/* Font */

@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');

@font-face{
    font-family: "Delight Script";
    src: url('fonts/Delighter.otf');
}

body{
    background-color: white;
    font-family: 'Roboto', sans-serif;
}

/* Navegador - Nav */

nav{
    background-color: #191919 !important;
}

#navLinks{
    margin-right: 11%;
}

#logo{
    padding-left: 58%;
    text-align: center;
    font-family: "Delight Script";
    font-size: 40px;
    display: block;
}

#nombreLogo{
    display: block;
    padding-left: 12em;
    margin-top: -1em;
}

/* Introduccion - Seccion Principal */

#video_principal{
    padding-top: 7em;
}

.video_principal_ajuste{
    object-fit: fill;
}

.introduccion{
    background-color: #343434;
    padding: 2em;
}

.logoimagen{
    display: block;
    margin: auto;
}

.titulo{
    font-size: 5em;
    color: #eabe3f;
    text-align: center;
}

.subtitulo{
    font-size: 60px;
    color: white;
    text-align: center;
}

.ptitulo{
    font-size: 40px;
    color: white;
    text-align: center;
}

.ptitulo2{
    font-size: 30px;
    color: white;
    text-align: center;
}

.ptitulo3{
    font-size: 30px;
    color: white;
    text-align: center;
  
}

.texto{
    font-size: 18px;
    color: white;
    text-align: center;   
    padding-left: 4em;
    padding-right: 4em;
}

/* Zapatos/Slippers - Seccion Zapatos/Slippers */

#tituloshoesIngles{
    text-decoration-line: overline underline; 
    font-size: 50px; 
    padding-top: 1em;
}

#tituloshoesEspanol{
    text-decoration-line: overline underline; 
    font-size: 50px;
}

.titulo_zapatos{
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
}

.imagen_zapatos{
    display: block;
    margin: auto;
    padding-bottom: 2em;
}

.video_zapatos{
    object-fit: fill; 
    display: block; 
    margin: auto;
}

/* Artistas - Seccion Artistas */

#artista{
    text-decoration-line: overline underline; 
    font-size: 50px;
    padding-top: 1em; 
    padding-bottom: 1em;
}

.artistas{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #cfcfcf;
    padding-bottom: 5em;
}

.titulo_artistas{
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
}

.imagen_artistas{
    display: block;
    margin: auto;
    padding-bottom: 2em;
}

.video_artistas{
    object-fit: fill; 
    display: block; 
    margin: auto;
    margin-bottom: 7em;
}

#boton_vermas_artistas{
    border-radius: 0;
    border-color: transparent; 
    padding-top: 1em; 
    padding-bottom: 1em; 
    margin-top: 1em;
}

/* Galeria personalizada artistas */

.container.gallery-container {
    color: #35373a;
    min-height: 100vh;
}

.tz-gallery .row > div {
    padding-left: 0px;
    padding-right: 0px;
}

.tz-gallery .lightbox img {
    width: 100%;
    border-radius: 0;
    position: relative;
}

/* Carrousel de imagenes */

#imagen_carrousel{
    width= 1440px; 
    height: 780px;
}

/* Galeria */

.galeria{
    padding-left: 10%;
    padding-right: 10%;
    padding-bottom: 1em;
}

.titulogaleria{
    font-size: 60px;
    font-weight: bold;
}

.subtitulogaleria{
    font-size: 40px;
    font-weight: lighter;
}

.textogaleria{
    padding-top: 1em;
    padding-bottom: 1em;
}

.paises{
    list-style: none; 
    padding: 0;
}

.imgGaleriaDiv{
    padding-bottom: 5em; 
    padding-left: 10%; 
    padding-right: 10%;
}

#imgGaleria{
    width: 500px;
    height: 300px;
}

#boton_vermas_galeria{
    border-radius: 0; 
    border-color: transparent; 
    padding-top: 1em; 
    padding-bottom: 1em; 
    margin-left: 0.7em;
}

/* Footer */

footer{
    background-color: #191919 !important;
    padding-bottom: 1em;
}

@media only screen and (min-width: 600px max-width: 1600px) {
    
    /* Navegador - Nav */
    
    #logo{
        padding-left: 50%;
    }
    
    #nombreLogo{
        padding-left: 9em;
    }
    
    #navLinks{
        margin-right: 11%;
    }
    
    /* Galeria */
    
    #imgGaleria{
        width: 600px;
        height: 300px;
    }
    
}

@media (max-width: 600px) {
    
    /* General imagenes y videos, h2, etc. */
    
    img {
        width: 100% !important;
        height: auto !important;
    }
    
    video {
        width: 100% !important;
        height: auto !important;
    }
    
    h1 {
        font-size: 2em !important;
    }
    
    h2 {
        font-size: 2em !important;
        text-decoration: underline !important;
    }
    
    h3 {
        font-size: 1em !important;
    }
    
    /* Navegador - Nav */
    
    #logo{
        text-align: center;
        font-family: "Delight Script";
        font-size: 40px;
        display: block;
        padding-left: 63% !important;
    }

    #nombreLogo{
        white-space: nowrap;
        margin-top: -1em;
        display: block;
        padding-left: 70% !important;
    }
    
    /* Welcome */
    
    .video_principal_ajuste{
        padding-top: 5em;
    }

    .titulo{
        font-size: 4em; 
        line-height: 1.2em;
    }

    .subtitulo{
        font-size: 3em;
        line-height: 1.2em;
    }

    .ptitulo{
        font-size: 1.3em;
    }

    .ptitulo2{
        font-size: 1.3em;
    }

    .ptitulo3{
        font-size: 1.3em;
  
    }

    .texto{
        font-size: 1em;
        padding-left: 0.5em;
        padding-right: 0.5em;
    }
    
    
    /* Artistas */
    
    .artistas {
        padding-bottom: 1em !important;
    }
    
    #galeria_artistas img {
        width: 200px !important;
        height: 200px !important;
    }
    
    /* Galeria */
    
    .carrousel {
        padding-bottom: 1em !important; 
    }
    
    .titulogaleria {
        font-size: 1.5em;
    }
    
    .subtitulogaleria {
        font-size: 1.4em;
    }
    
    .galeria {
        padding-left: 5%;
        padding-right: 5%;
    }
    
    .textogaleria {
        font-size: 1em;
    }
    
    .paises {
        font-size: 1.2em;
    }
    
    .paises img {
        width: 30px !important;
        height: 30px !important;
    }
    
    .imgGaleriaDiv {
        padding-bottom: 2em !important;
        padding-left: 5%;
        padding-right: 5%;
    }
    
    .imgGaleriaDiv img {
        width: 200px !important;
        height: 150px !important;
    }
    
    #boton_vermas_galeria {
        margin-left: 0em !important;
    }
    
    #galeria_galeria img {
        width: 200px !important;
        height: 150px !important;
    }
  
    /* Footer */
    
    footer {
        font-size: 0.9em;
    }
}