/****** ATRACCIONES ******/

/* COLUMNAS */

#main{
    border-radius:10px;
    padding:65px 70px 50px 70px;
    background:#fff url(../../images/hoteles_decoration.png) no-repeat center top;
}
#main h1{
    font-size:4.2em;
    text-align:center;
    font-weight:600;
    color:#b4b11b;
    margin-bottom:15px;
}
#main h1 + p{
    text-align:center;
    margin-bottom:50px;
}

#hoteles #listado_hoteles .hotel{
    padding:41px 0 40px;
    background:url(../../images/punteado_horizontal.gif) repeat-x top;
}
#hoteles #listado_hoteles .hotel:first-child{
    padding:0 0 40px;
    background:none;
}
#hoteles #listado_hoteles .hotel h2{
    font-size:3.2em;
    color:#f58220;
    font-weight:600;
    margin-bottom:20px;
}
#hoteles #listado_hoteles .hotel .fotoTitulo{
    max-height:120px;
    display:block;
    margin-bottom:20px;
}
#hoteles #listado_hoteles .hotel .columna-left{
    width:550px;
    float:left;
}

#hoteles #listado_hoteles .hotel .columna-left .styledFoto{
    height:257px;
    margin-bottom:25px;
}
#hoteles #listado_hoteles .hotel .columna-left .styledFoto .mapa{
    height:243px;
    background:#fafafa;
}
#hoteles #listado_hoteles .hotel .columna-left ul{
    padding-top:10px;
}
#hoteles #listado_hoteles .hotel .columna-left ul li{
    margin-top:5px;
    font-size:1.5em;
    line-height:1.5;
    color:#3fafd5;
}

#hoteles #listado_hoteles .hotel .columna-right{
    width:237px;
    float:right;
}
#hoteles #listado_hoteles .hotel .columna-right li{
    float:left;
    width:66px;
    height:66px;
    margin: 0  0 12px 12px;
}
#hoteles #listado_hoteles .hotel .columna-right li a{
    width:66px;
    height:66px;
    display:block;
    background:no-repeat center;
    background-size:cover;
}
#hoteles #listado_hoteles .hotel .columna-right li a:hover{
    opacity:0.5;
}


/* TABLET */

@media only screen and (max-width:979px){    

    #hoteles #listado_hoteles .hotel .fotoTitulo{
        display:block;
        margin:0 auto 20px;
    }
/*    
    #hoteles #listado_hoteles .hotel .columna-left{
        width:550px;
        float:none;
        margin:0 auto;
    }
    #hoteles #listado_hoteles .hotel .columna-right{
        width:574px;
        float:none;
        margin:30px auto 0;
        padding-right:12px;

        box-sizing:border-box;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
    }
    */
    #hoteles #listado_hoteles .hotel .columna-left{
        width:calc(100% - 176px);
    }
    #hoteles #listado_hoteles .hotel .columna-right{
        width:156px;
    }

}

@media only screen and (min-width:342px) and (max-width:979px){
    #hoteles #listado_hoteles .hotel .columna-right li:nth-child(odd):last-child{
        display:none;
    }
}


/* MOBILE */

@media only screen and (max-width:767px){    
    
    #main{
        padding:50px 15px 5px 15px;
    }
    #main h1{
        font-size:3.4em;
        line-height: 1;
    }
    #main h1 + p{
        margin-bottom:35px;
    }
    
    
    #hoteles #listado_hoteles .hotel{
        text-align:center;
    }
    #hoteles #listado_hoteles .hotel .fotoTitulo{
        max-width:100%;
    }

    #hoteles #listado_hoteles .hotel .columna-left{
        width:100%;
        float:none;
        margin:0 auto;
    }
    #hoteles #listado_hoteles .hotel .columna-right{
        width:auto;
        float:none;
        margin:20px -15px 0;
        padding:0;

        box-sizing:border-box;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
    }
    #hoteles #listado_hoteles .hotel .columna-right li{
        display:inline-block;
        vertical-align: top;
        float:none;
        margin:0;
        padding:6px;
    }
    #hoteles #listado_hoteles .hotel .columna-right li:nth-child(even):last-child{
        margin-right:78px;
    }

}