﻿.MenuResponsivo {
    display: none;
}

/*Menu Responsivo*/
div.MenuResponsivo {
    width: 100%;
    text-align: right;
    cursor: pointer;
}

    div.MenuResponsivo a.Link {
        color: white;
        font-size: 20px;
    }
     .ListaResponsiva{
        display:none;
    }
     .ListaNormal{
         display:block;
     }
    div.MenuResponsivo img {
        margin-right: 20px;
    }

ul#MenuR {
    display: none;
    text-align: center;
    padding: 20px 0px;
    background-color: rgba(61, 104, 157, 0.9);
    border-radius: 5px;
    position: absolute;
    width: 100%;
    margin: 0 auto;
    float: none;
    overflow: hidden;
    z-index: 99999;
}

    ul#MenuR li {
        margin-bottom: 10px;
    }

        ul#MenuR li a {
            color: white;
            font-size: 18px;
        }

            ul#MenuR li a b {
                font-size: 20px;
            }

            ul#MenuR li a i {
                font-size: 15px;
            }

.MenuResponsivo div.Fondo {
    background-position: bottom;
    padding: 4px 0px;    
    background-color: #3d689d;
}

/*Fin de Menú responsivo*/

/*Tabla Responsiva*/
.tbl-responsive{
    width:100%;
}

@media(max-width:1000px) {

    header {
        background-image: url(../Images/Fondogris.png);        
        text-align: center;
    }
    
   
    div.TexboxFechas{
            max-width: 100%;
    clear: both;
    text-align: center;
    float: none !important;
    margin: 0 auto;
    margin-bottom: 26px;
    }
    div.TexboxFechas span{
         clear:both;
         float:none;
         
    }
    div.ProgressIndicator{
        padding: 30px;
        text-align: center;
        width: 170px;
        height: 160px;
        left: 50%;
        margin-left: -85px;
        top: 50%;
        margin-top: -80px;
    }
    div.TextoSuperior{
        font-size:25px;
        height:auto;
        margin:30px 0;
    }
    #MenuSuperior, .MenuSuperior {
        display: none;
    }

    .MenuResponsivo {
        display: block;
    }

    #logoHeader {
        display: block;
        margin: 10px auto;
        width: 98%;
        float:none !important;
    }

    header .float-right {
        float: none;
    }

    footer .float-left {
        float: none;
        max-width: 720px;
        width: 100%;
        margin: 10px auto;
    }

    #Firmasites {
        float: none;
        width: 100%;
        text-align: center;
    }

    .TextoSuperior {
        text-align: center;
    }

    #FiltrosBusqueda span{
        max-width:100%;

    }
     #FiltrosBusqueda input[type="text"]{
        max-width:95%;
    }
     .Informativo{
         width:80%;
     }
     
     .Error{
         width:80%;
     }
    .ContenidoPrincipal {
        max-width: 700px;
        width: 100%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        
        margin: 0 auto;
    }

    .ColumnaIzquierdaVacia {
        display: none;
    }

    .Banners {
        float: none;
        margin: 0 auto;
        overflow: hidden;
        width:100%;
    }
    div#UsuarioControl{
        background-color:#3d689d;
        width: 100%;
        /* border-top: solid 1px white; */
        margin: 0;
        padding: 10px 0;
    }

        .Banners .theme-default {
            overflow: hidden;
        }

    /*SLIDER*/
    .theme-default #slider {
        max-width: 601px; /* Make sure your images are the same size */
        height: 200px; /* Make sure your images are the same size */
        float: right;
        margin-bottom: 10px;
        width: 100% !important;
    }

    .theme-default #slider2 {
        max-width: 601px; /* Make sure your images are the same size */
        height: 200px; /* Make sure your images are the same size */
        float: right;
        margin-bottom: 10px;
        width: 100% !important;
    }

    .theme-default #slider3 {
        max-width: 601px; /* Make sure your images are the same size */
        height: 200px; /* Make sure your images are the same size */
        float: right;
        width: 100% !important;
    }

    .nivo-slice {
        display: block;
        position: absolute;
        height: 100%;
        width: 100% !important;
        opacity: 1;
        background-size: 100% 100% !important;
    }

    .theme-default #slider img {
        max-width: 100%;
        max-height: 100%;
    }

    /*END SLIDERS*/


    .div1Formulario {
        float: none;
        margin-right: auto;
        margin: 0 auto;
    }

    .div2Formulario {
        float: none;
        margin: 0 auto;
    }

    .pContacto {
        text-align: center;
    }

    #LoginSistema {
        max-width: 430px;
        padding: 10px 2%;
        background-color: #F9F9F5;
        border: thin solid #E2E2E2;
        border-radius: 5px;
        margin: 0 auto;
        margin-top: 20px;
        font-size: 16px;
        min-height: 245px;
        width: 96%;
    }
    div#MenuLogin a{
        width:100%;
        margin:0;
        float:left;
        margin-bottom:10px;
        border:none;
    }
    #LoginSistema fieldset{
        max-width:100%;
    }

        #LoginSistema input[type=text], #LoginSistema input[type=password] {
            width: 98%;
        }

        #LoginSistema #divLog1 {
            max-width: 300px;
            margin: 0 auto;
        }

    #MenuLogin {
        max-width: 390px;
        margin: 0 auto;
        text-align: center;
        margin-top: 20px;
        margin-bottom: 57px;
        width: 100%;
    }

        #MenuLogin a {
            float: none;
            padding-right: 0;
        }

            #MenuLogin a:first-child {
                margin-left: 0;
            }

    .ColumnaIzquierda {
    float: none;
    margin: 0 auto 20px;
    min-height: 625px;
    max-width: 94%;
    padding: 0 3%;
    }
    #Logindiv1{
        max-width: 312px;
        margin: 0 auto;
    }
    #UsuarioControl {
        width: 300px;
        float: none;
        color: #fff;
        text-align: center;
        margin-top: 3px;
        margin: 20px auto;
    }

    .centrado {
        text-align: center;
    }

    .DetallesUsuario p {
        width: 135px;
        margin-left: 0;
        padding-right: 0;
    }

    .DetallesUsuario {
        max-width: 680px;
        width: 100%;
        margin: 0 auto;
    }

        .DetallesUsuario p.Linea {
            max-width: 700px;
            width: 100%;
        }

    .elementoCetrado table {
        margin: 0 auto;
        float: none;
        width:100%;
    }

    .GuardarCancelar {
        float: left;
        margin-top: 0 !important;
    }
}

@media(max-width:750px) {
    .Filtros #div1 {
            float: none;
    text-align: center;
    margin: 20px auto;
    }
    .FichaHabitacion{
        min-width:0;
        width:100%;
        padding:10px 0;
    }
    .FichaHabitacion h3{
        width:100%;
        text-align:center;
    }
    .Caracteristicas{
        min-width:0;
    }
    .CaracteristicasLinks{
        min-width:0;
    }
    div.DivFotos{
        min-width:0;
        width:100%;
    }
    hr{
        max-width:100%;
    }
    .FichaHabitacion .Precio{
            width: 100%;
    clear: both;
    margin: 0 auto;
    text-align: center;
    height: auto;
    }
    .FichaHabitacion .Precio p{
        width:100%; text-align:center;
        clear:both;
    }
    .FichaHabitacion .Precio div{
        width:100% !important; text-align:center;
        clear:both;
    }
    .FichaHabitacion .Precio div input[tye="submit"]{
        float:none !important;
    }
    .FichaHabitacion .Detalles{
        width:100%;
    }
    .FichaHabitacion .TarifasDias{
        width:100%;
        text-align:center;
    }
    .Filtros #div2 {
        float: none;
        margin-left: 0;
        text-align: center;
        margin: 5px 0;
    }

    .Filtros #div3 {
        float: none;
        text-align: center;
        margin: 20px 0;
    }
    
    div.TexboxFechas h6{
        margin-bottom:20px;
        text-align:center;
        font-size:15px;
        float:left;
        width:100%;
    }

    .tbl-responsive tr td{
        display:block;
    }
}


@media(max-width:720px) {
    ul#MenuInferior {
        text-align: center;
        padding-left: 0;
    }

        ul#MenuInferior li {
            display: block;
            padding-left: 0;
            margin: 10px auto;
        }
    .pnRecomendado div.FichaResultadoBusqueda{
        width: 97%;
        padding: 10px 0;
        float: left;
        min-width: 0;
        margin-left: 2%;
    }
    .pnEstandar div.FichaResultadoBusqueda{
        width: 97%;
        padding: 10px 0;
        float: left;
        min-width: 0;
        margin-left: 2%;
    }
}

@media(max-width:680px) {

    .TexboxFechas {
        margin-top: 7px;
        margin-left: auto;
        float: none !important;
        margin: 10px auto;
    }

    .BusquedaReservacion .TexboxFechas:first-child {
        width: 300px;
    }

    .BusquedaReservacion .TexboxFechas:last-child {
        width: 300px;
    }

    .MarginLeft {
        margin-left: 9px;
    }
}

@media(max-width:650px) {
    .GridReservaciones tr.Normal, .GridUsuario tr.Normal {
        display: none;
    }
    .ListaResponsiva{
        display:block;
    }
    .ListaNormal{
         display:none;
     }
    div.DivImgDestino p{margin:0;}
    div.DivImgDestino{
        margin-bottom: 20px;
    }
    .DivImgDestinoRecomendado{
        clear: both;
       width: 100%;
       margin: 0 auto;
           margin-top: -105px;
    }
    .FichaResultadoBusqueda h2{
        width: 100%;
        clear: both;
    }
     .FormDetalleReservacion{
        margin-top:100px;
    }
      
      .FormDetalleReservacion tr{
        display: block;
            float: left;
    width: 100%;
    }
      div.DetalleServicios table tr:last-child td{
              float: left;
    width: 100%;
    text-align: left;
    padding: 20px 0;
    border: solid 1px;
      }
      div.PanelStatusReservacion textarea{
          max-width:100%;
      }
      table.WindowReservacion{
          
      }
      table.WindowReservacion tr td{
          padding:20px 0;
          float:left;width:100%;
      }
      .ElementoCentral{
        width: 39px;
        margin-right: -10px;
      }
      select{
          max-width:100%;
      }
      img.Logo{
          max-width:100%;
      }
      table.WindowReservacion tr td input[type="text"]{
          padding:10px 0;
          float:left;width:100%;
      }
    .GridReservaciones tr, .GridUsuario tr {
        display: block;
        float: right;
        width: 100%;
    }
    .GridReservaciones tr.Derecha {
        display: block;
        float: right;
        width: 50%;
    }
    .GridUsuario tr.Derecha {
        display: block;
        float: right;
        width: 50%;
        
    }
        .GridReservaciones tr.Responsivo, .GridUsuario tr.Responsivo {
            display: block;
            float: left;
            width: 50%;
            border-bottom:none !important;
        }

        .GridReservaciones tr th, .GridReservaciones tr td {
            min-height: 60px;
            display: block;
        }

        .GridUsuario tr th, .GridUsuario tr td {
            min-height: 60px;
            display: block;
            text-align: center;
        }

    .GridReservaciones .trCompleto, .GridUsuario .trCompleto {
        width: 100%;
    }

    .trCompleto td, .trCompleto td {
        min-height: 0 !important;
    }

    .GridUsuario tr td {
        min-height: 62px;
        height: auto;
        font-size: 15px;
        width: 100%;
        padding-left: 0;
        padding: 0;
    }

    .GridUsuario tr th {
        padding: 0;
    }
}

@media(max-width:550px) {
    .GridUsuarios tr td {
        display: block;
        padding-left: 0;
        width: 100%;
    }
    .Precio{
        width:100%;
        clear:both;
    }
    div.TarifasDias{
        width:100% !important;
    }
    #BuscadorTabla {
        float: left;
    }
}

@media(max-width:500px) {


    .TablaTours thead, .TablaTours tbody {
        float: left;
        width: 50%;
    }
    .TablaTours thead th:first-child{
        background-color:rgba(61, 104, 157, 0.9);
        color:white;
    }
    .TablaTours tr td:first-child{
        background-color:rgba(61, 104, 157, 0.9);
        color:white;
    }
    
    .TablaTours thead tr {
            display: block;
    }

    .TablaTours td h3{
        color:white;
        font-weight:normal;
    }

    .TablaTours tr {
        display: block;
        width: 99%;
    }

    .TablaTours tbody tr:first-child {
        visibility: hidden;
        display: none;
    }

    .TablaTours th, .TablaTours td {
        width: 100% !important;
        display: block;
        text-align: center;
        padding: 5px 0;
        min-height: 55px;
    }

    .TablaTours tr.section-div{
        display:none!important;
    }

    .DetallesUsuario p {
        display: block;
        float: none;
        margin-left: 0;
    }
}


@media(max-width:350px) {
    .DetallesUsuario input[type=text], .DetallesUsuario input[type=password] {
        width: 290px;
    }
    div.ProgressIndicator{
        padding: 30px;
        text-align: center;
        width: 170px;
        height: 160px;
        left: 0;
        margin-left: 15px;
        top: 50%;
        margin-top: -80px;
    }
    .DetallesUsuario {
        padding-left: 0;
    }
    #body{
        background-image:none;
    }
    .GuardarCancelar .float_right {
        margin-left: 0;
    }
    .theme-default{
        margin-bottom:25px;
    }
    .theme-default #slider {
        height:150px !important;
    }
    .theme-default #slider2 {
        height:150px !important;
    }
    .theme-default #slider3 {
        height:150px !important;
    }
    .FraseBusquedaReservacion > input[type=text] {
        width: 100%;
    }
     div.TexboxFechas{
         width:150px !important;
     }
    #BuscadorTabla input[type=text] {
        width: 290px;
    }
    div.FormDetalleReservacion{

    }
    div.PanelStatusReservacion textarea{
          max-width:90%;
      }
}
