/*
Theme Name: Mirai Theme Child
Theme URI: http://www.miraiespana.com
Description: Tema hijo desarrollado por Mirai Espana para hoteles.
Template: mirai
Author: Mirai Espana
*/



/*-------------------------------- MEDIA QUERYS --------------------------------*/

/* iphone portrait & landscape - galaxy portrait & lanscape */
@media (max-device-width: 767px) {

    .container {
        padding-left: 10px;
        padding-right: 10px;
        overflow: hidden;
    }
    .modal.fade.in {
        top: 0px;
        bottom: 0px;
        left: 0px;
        right: 0px;
        border-radius: 0;
    }
    .modal-body {
        max-height: none;
    }
    body .menu li.booking-button, body #menu_web li.menu-item.booking-button, html body.home #menu_web li.booking-button, #logo a span.visible-phone {
        display: none !important;
    }
    
    .ph0-xs {padding-left: 10px;padding-right: 10px;}
    .fx-column-md, .fx-column-xs {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    /**/
    #back-top, .meeting-room-info i{
        display:none!important;
    }
    /*-------- HEADER --------*/
    
    /* preheader */
    
    #pre-header {
        display: none;
    }
    
    /* mainheader */
    #header .affix-wrapper, #header #navigationweb, #header .container {
        padding: 0;
        padding-left: 10px;
    }
    #header #logo {
        max-width: 40%;
        float: left;
    }
    #header #logo a img {
        max-height: 45px;
        display: inline;
    }
    #logo a {
        background-image: none;
        width: auto;
        height: auto;
    }
    #header .modal-engine-wrapper {
        vertical-align: top;
        margin: 0!important;
        text-align: center;
        overflow: hidden;
        width: auto;
    }
    #header .affix.modal-engine-wrapper {
        display: block;
    }
    #header .booking-modal-btn, .booking-link {
        padding: 20px 21px;
        font-size: 16px;
        letter-spacing: normal;
    }
    .cat-room-detail #header #navigationweb, .cat-offer-detail #header #navigationweb, .bookingstep1 #header #navigationweb{
        height: auto;
    }
    /* menu */
    ul#menu_web > li > ul.sub-menu {
        height: 100%;
    }
    ul#menu_web > li > ul.sub-menu li > a{
        color: #fff;
        font-weight: normal;
        line-height: 15px;
    }
    ul#menu_web > li.current-menu-ancestor > a{
        color:#fff!important;
    }
    ul#menu_web > li > ul.sub-menu{
        background: none;
    }
    ul#menu_web>li.current-menu-item a {
        color: #86bb85!important;
    }
    ul#menu_web > li ul.sub-menu li > a:hover, ul#menu_web > li ul.sub-menu li.current-menu-item > a {
        font-weight: bold;
    }
    /* booking link for mobile */
    #header .booking-modal-btn {height: 30px;line-height: 30px;}
	.booking-link {display: block!important;}
        
    /*-------- MAIN --------*/
    .home section#main {display: block;}
    
    /*-------- FOOTER --------*/
    #footer {height: auto;}
    #footer .content {
        display: block!important;
    }
    .home #footer .content > * {
        display: inherit;
    }
    #footer, #footer .align-right, #footer .align-left {
        text-align: center;
    }
    .logo-footer {
        display: none;
    }
    .postfooter .menu li.booking-button {
        display: none!important;
    }
    #footer .socialmedia li:last-child a {
        margin-right: 0;
    }
    .mainfooter .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        text-align: center;
    }
    .hotelschema .tel, .hotelschema .mail{
        text-align: center;
        padding-left: 0;
    }
    .postfooter .menu li a{
        padding: 0 ; 
    }
    #developed-wrapper{
        padding:20x 0;
    }
    .vertical-menu-footer{
        display: block;
        text-align: center;
        color: #fff;
        padding: 0 0 35px 0;
    }
     .vertical-menu-footer .container{
        border-top:1px solid #ccc;
        border-bottom:1px solid #ccc;
        padding: 15px 0;
    }
    .vertical-menu-footer #menu_aux2 li{
        padding: 10px 0;
        width: 100%;
        text-align: center;
    }
    .vertical-menu-footer #menu_aux2 li a{
        font-size: 14px;
        font-weight: bold;
        letter-spacing: 1.44px;
        line-height: 18px;
        padding: 0 25px;
        text-transform: uppercase;
    }
    /* newsletter */
    .newsletter > div {
        padding: 0 0 20px;
        max-width: 100%;
    }
    /* carousel controls */
    .carousel-control {
        font-size: 20px;
        width: 20px;
        margin-top: -25px;
    }
    /* widget qtranslate */
    .home #footer .widget_qtranslate {
        margin: 0;
        padding: 20px 0;
    }
    .home #footer .widget_qtranslate:after {
        position: static;
        display: inline-block;
    }
    #header .widget_qtranslate:before{
        left:20px;
    }
    .widget_qtranslate{
        border:none;
    }
    /* icons-list */
    .icons-list {
        float: none;
        display: inline-block!important;
        width: 74%;
    }
    .icons-list > li {
        text-align: left;
        margin-bottom: 20px;
        width: auto;
        float: none;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 0;
    }
    .icons-list > li:last-child {
        margin-bottom: 0;
    }
    .icons-list i {
        font-size: 33px;
        margin-right: 15px;
    }
    /* main title */
    .main-title {
        font-size: 35px;
    }
    .picbox {
        min-height: 150px;
    }
    /* REVIEWS */
    #cuadroOpiniones div.hssurveys_full > div.hssurveys_full > div, div.hssurveys_full ul.questions {
        padding: 15px;
    }
    #cuadroOpiniones div.hssurveys_full .comments p.commentsPerson span.date {
        float: none;
        display: block;
    }
    #cuadroOpiniones div.hssurveys_full p.more {
        text-align: center;
    }
    /* Advantages row */
    .advantages-row .row {
        display: -webkit-box!important;
        display: -ms-flexbox!important;
        display: flex!important;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: center;
        -ms-flex-pack: center;
        -webkit-align-items: center;
        -webkit-box-align: center;
        -webkit-box-pack: center;
        align-items: center;
    }
    .advantages-row ul, .advantages-row li {
        display: block;
        width: auto;
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .advantages-row .mi-title i {
        display: none;
    }
    .advantages-row .mi-title {
        padding-right: 0;
    }
    /**/
    .go-to-page-list-wrapper, .engine-wrapper{
        display:none;
    }
    .engine-wrapper .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        padding: 15px 0;
    }
    .advantages-link i {
        color: #fff;
    }
    .title-wrapper{
        overflow: inherit;
    }
    .main-title{
        top: auto;
        left: 25px;
        bottom: 75px;
        transform: none;
        font-size: 25px!important;
        line-height: 40px!important;
    }
    .mi-title2, #cookies-wrapper-content h1, #cookies-wrapper-content h2, .rooms-listing-wrapper h2, .rooms-detail-wrapper h2, .offers-listing-wrapper h2, .offers-detail-wrapper h2, .blog-wrapper h2, .blog-wrapper h1, .blog-wrapper #posts_con_categoria, .mi-iata-content h2, .starter-offers .offers-mashup dl dt{
        font-size: 1.3em;
        line-height: 32px;
    }
    .mi-title5 {
        font-size: 15px;
        line-height: 25px;
    }
    .text-img img{
        max-height:300px;
    }
    .text-img p {
        font-size: 16px;
        line-height: 26px;
    }
    .xs-container, .small-container{
        max-width:100%;
    }
    .phs{
        padding: 40px 15px;
    }
    .ptl{
        padding-top:50px;
    }
    .pvl{
        padding-top:50px;
        padding-bottom:50px;
    }
    .info-text {
        padding: 55px 0;
    }
    /* modal */
    .mirai-modal .mi-modal-content{
        overflow:scroll;
    }
    #advantages-modal i {
        font-size: 35px;
    }
    #advantages-modal i.close01-micon {
        font-size: 20px;
    }
    .mirai-modal .mi-title2{
        font-size: 25px;
        line-height: 35px;
        padding-bottom: 25px;
    }
    .mirai-modal p{
        font-size:15px;
    }
    #get-direction-modal.mirai-modal .mi-modal-content > div {
        max-height: 100%;
        overflow: scroll;
        padding: 40px 0 0 0;
    }
    /* home */
    #rooms .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    #offers p{
        padding:20px 0;
    }
    #services .row > div {
        padding:20px;
    }
    #services img{
        max-height:200px;
    }
    #location img{
        min-height:300px;
    }
    /* habitaciones y detalle habitacion | offers y detalle oferta*/
    .room-image, .room-name, .room-intro{
        width:100%;
    }
    .rooms-listing-wrapper h3{
        padding-bottom: 20px;
        padding-top: 30px;
        font-size: 23px;
    }
    .rooms-listing-5 .price-box{
        bottom:25px;
        padding: 15px 0;
    }
    .rooms-detail-wrapper {
         padding: 0 !important;
    }
    .detail-description{
        padding:15px;
    }
    .rooms-detail-wrapper .room-box-offers .go-to-offers-page{
        text-align:left;
    }
    .detail-description, .rooms-detail-wrapper .room-offer {
        padding: 30px!important;
    }
    .offers-detail-wrapper a.booking_mobile {
        margin: 0!important;
        padding: 0;
        width: 100%!important;
    }
    /* storytelling */
    #history .row .white-text p:before{
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1;
    }
    #history .row .white-text img {
        -webkit-filter: brightness(0.85);
        filter: brightness(0.85);
    }
    /* restaurantes */
    #restaurants .flex, .gastro-list .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    #restaurants img{
        max-height:300px;
    }
    #restaurants .phs{
        padding:20px;
    }
    #restaurants p.small-container{
        max-width:100%;
    }
    .file-box .data-wrapper i, #restaurants.text-img i, .meeting-room-info i {
        font-size: 25px;
        padding-right: 5px;
        vertical-align: middle;
    }
    .gastro-list .row, #castells .row{
        border-top:0;
        padding:0;
    }
    .gastro-list .row > div, #castells .row > div{

        padding: 20px 0;
    }
    #castells .row > div:first-of-type{
            border-top: 1px solid #ccc;
    }
    #marmalade .pvl{
        padding:50px;
    }
    /* services */
    .quote-wrapper{
        padding-bottom:35px;
    }
    .remarked{
        font-size: 15px!important;
        line-height: 25px!important;
        max-width: 80%!important;
    }
    #services-wrapper .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    #services-wrapper .pam{
        padding:30px 20px;
    }
    #services-wrapper .data-wrapper{
        padding: 20px 5px;
    }
    #services-wrapper .data-wrapper .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        float:left;
        padding:5px;
    }
    #services-wrapper .file-box{
        padding-top:0;
    }
    #services-wrapper .file-box img{
        height: 350px;
        -o-object-position: bottom;
        object-position: bottom;
    }
    .file-box .data-wrapper i{
        font-size: 20px;
    }
    .file-box .data-wrapper p {
        font-size: 12px;
        display: inline-block;
    }
    .cat-services div.mainfooter:before{
        border-top:50px solid #fff;
    }
    /* ofertas */
    .offers-listing-wrapper, #citocode {
        padding: 30px 20px;
    }
    /* situacion */
    #citocode .flex, #indications-boxes .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        text-align: center;
    }
    .cat-location #intro {
        padding-bottom: 80px;
    }
    #citocode img{
        display:none;
    }
    #indications-boxes h3{
        text-align:center;
        padding: 20px 0;
    }
    /* contacto */
    .contact-form-wrapper textarea{
        width: 85%;
    }
    .contact-form-wrapper .wpcf7{
        padding-top:20px;
    }
    /* legal */
    div#cookies-wrapper-content {
        padding: 15px 0;
    }
    /* visit bcn - mice - tourism-groups - responsable-tourism */
    #montjuic-font .flex, #castells .flex, #shops .flex, #another-way-bcn .flex, #gastro-bcn .flex, #mobility .flex, #meeting-rooms .flex, #groups-restaurant .flex, .responsible-tourism.text-img .flex{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    #montjuic-font .pas, #gastro-bcn .pas{
        padding: 20px 5px;
    }
    #gastro img, #meeting-rooms img, #groups-restaurant img, .responsible-tourism.text-img img{
        max-height:350px;
    }
    #meeting-rooms .pas, #groups-restaurant .pas, .responsible-tourism.text-img .pas, #shops .white .pas{
        padding:35px 10px;
    }
    #mobility .row > div{
        padding-bottom:35px;
    }
    #mobility .row > div:last-of-type{
        text-align:left;
    }
    #mobility .row > div h4{
        padding-bottom:10px;
    }
    /* galeria */
    #gallery a{
        pointer-events:none;
    }
    /**/
    /* load */ 
    #hotel-barcelona-1882.load #content-header img,  #hotel-barcelona-1882.load #content-header .main-title{
        -webkit-transition:  0s ease-out;
        transition:  0s ease-out;
    }
    #engine-modal, #engine-modal .mi-modal-content {
        overflow: auto;
        max-height: none;
        width: 100% !important;
        box-sizing: border-box;
        max-width: 100%;
        height: auto;
    }
    #engine-modal, .mi-modal-header img{
        display: none;
    }
}

/*------------------------------------------------------------------------------*/