/* Big tablets to 1200px (widths smaller than the 1140px row) */
@media only screen and (max-width: 1200px) {
    .hero-text-box {
        width: 100%;
        padding: 1px 2%;
    }
    
    .row {padding: 0 2%;}
    
    .clases-hoy,
    #horario-de-clases,
    #precios-clases-yoga,
    .clasesheader,
    .section-yogaparamanejodelestres,
    .section-terapeutico,
    .section-rekargate,
    .section-hathayoga,
    .section-vinyasa,
    .profesoresheader,
    .especialesheader,
    .blogheader {

        -webkit-background-size:cover;
        -moz-background-size:cover;
        -o-background-size:cover;
        background-size: cover;
        background-attachment: scroll;
        background-position: center;

    }
    
    #contacto-clases-yoga,
    .indexheader,
    .impar,
    .par {
        
        background-size: auto 1000px;
        background-attachment: scroll;
        background-repeat: repeat;

    }
}

/* Small tablets to big tablets: from 768px to 1023px */
@media only screen and (max-width: 1023px) {
    body {font-size: 18px;}
    section {padding: 60px 0;}
    
    .long-copy {
        width:80%;
        margin-left:10%;
    }
    
    .clase-dia:first-child {width: 100%;}
    
}

/* Para la tabla del horario */

@media only screen and (max-width: 930px) {
    
    .amplio table {
        font-size:83%;
    }
    
    .amplio table h3,
    .amplio table p {
        margin-right:0;
        margin-left:0;
    }
    
    
    .indexheader,
    .impar,
    .par {
        
        background-size: auto 700px;
        background-attachment: scroll;
        background-repeat: repeat;

    }
    
}
    

/* Small phones to small tablets: from 481px to 767px */
@media only screen and (max-width: 767px) {
    body {font-size: 16px;}
    section {padding: 30px 0;}
    
    header .row {
        text-align:center;
    }
    .logo {
        float:none;
    }
    
    .logo-small {
        float:none;
        margin:auto;
    }
    
    .logo-menu {text-align:center;}
    
    .row,
    .hero-text-box {padding:1px 4%;}
    
    .col {
        width:100%;
        margin:0 0 5% 0;
    
    }
    
    .main-nav {display:none;}
    
    .mobile-nav-icon {display:inline-block;}
    
    .main-nav {
        float:none;
        margin-top:5px;
        margin-left:60px;
    }
    
    .main-nav li {
        display:block;
        margin-left:0;
    }
    
    .main-nav li a:link,
    .main-nav li a:visited {
        display:block;
        border:0;
        padding: 5px 0;
        font-size: 100%;
    }
    
    .sticky .main-nav{margin-top: 10px;}

    .sticky li a:link,
    .sticky li a:visited {padding: 10px 0;}
    .sticky .mobile-nav-icon {margin-top: 0;}
    .sticky .mobile-nav-icon i {color: #fff;}
    
    h1 {font-size: 180%;}
    h2 {font-size: 150%;}
    
    .long-copy {
        width:100%;
        margin-left:0%;
    }
    
    .clases-box {padding: 0 0 15px 0;}
    .clase-dia:first-child {padding-top:0;}
    
    footer{padding:25px;}
    
    footer p,
    footer a,
    .social-links {
        margin: 15px 0;
        font-size: 120%;
    }
    
    .footer-nav,
    .social-links {
        float:none;
        text-align: center;
    }
    
    .amplio {display:none;}
    .movil {display:block;}
    
    
    
    .indexheader,
    .impar,
    .par {
        
        background-size: 370% auto;
        background-attachment: scroll;
        background-repeat: repeat;

    }
    
    .map-box {
        width:100%;
        height:auto;
        position: relative;
    }

    .map {
        width:100%;
        height:560px;
        position: relative;
        z-index: 0;
    }

    .form-box {
        position:relative;
        width:100%;
        height:auto;
        padding-top:30px;

    }
    
    .mobile {
        display: block;
    }

    .header__menu--contact p
    {
        display: none;
    }
    .mobile-menu-symbol
    {
        display: block;
    }
}

/* Small phones: from 0 to 480px */
@media only screen and (max-width: 480px) {
    
    section {padding:25px 0;}
    
    .btn {
        font-family: 'Lato', 'Arial', sans-serif;
        margin:3px auto;
    }
    
    .texto-inicio h1 {
        font-size:150%;
        margin-top: 20px;
        margin-bottom:8px;
    }
    
    footer .col {
        margin: 25px 0;
    }

    .img-equipo-impar,
    .img-equipo-par {
        display:block;
        width:100%;
        height:auto;
        float:none;
        margin:0;
    }
    
    .imagenblog {
        width:  100%;
        float:none;
        margin:auto;
        padding:0;
        
    }

    .impar .clase-dia {
        padding:15px;
        width:165px;
    }

    .clase-dia {
        padding:15px;
        width:165px;
    }
    
    
}