html,
body {
    height: 100%;
    font-size:12px;
}

.navbar{
    min-height: 100px;
}
.navbar-inverse{
    background-color: transparent;
    background-image: url('../images/nav-bg.png');
    background-repeat: repeat-x;
}
.navbar-brand{
    height: 100px;
}
.navbar-inverse .navbar-nav > li > a{
    color:#fff;
}
.navbar-nav li a {
    line-height: 70px;
}

.parallax-window {
    min-height: 500px;
    background: transparent;
    background-position: center
}

.boton-spa,
.boton-gym{
    height:100%;
    width:50%;
    position: absolute;
}
.boton-gym{
    left:50%;
}

.carousel-caption {
    left: 20%;
    padding-bottom: 30px;
    right: 10%;
    text-align: right;
}
.carousel-caption-home {
    left: 0;
    padding-bottom: 30px;
    right: 0;
    text-align: center;
    top:50%;
    margin-top:-62px;
}
h1{
    font-size: 24px;
}
h2{
    font-size: 18px;
    color:#009fe3;
}
h3{
    font-size: 16px;
}
span.titulo-1{
    color:#bdbdbc;
}
span.titulo-3{
    font-size: 18px;
}
#mapa{
    height: 300px;
}
.color-0{
    color:#fff;
}
.color-1{
    color:#b2b2b2;
}
.color-2{
    color:#a9ab11;
}
.color-3{
    color:#c8d400;
}
.color-4{
    color:#00a099;
}
.color-5{
    color:#008bab;
}
.color-6{
    color:#eb6ea3;
}
.color-7{
    color:#009fe3;
}
.color-8{
    color:#00a19a;
}
.color-9{
    color:#f39200;
}
.color-10{
    color:#ff5fd0;
}
.color-11{
    color:#d460d7;
}
.color-12{
    color:#ffd500;
}
.color-13{
    color:#e30613;
}
.color-14{
    color:#f9b233;
}
.bg-color-7{
    background-color:#009fe3;
}
.border-color-7{
    border-color:#009fe3;
}
.form-group{
    margin-bottom: 8px;
}
.input-group-addon{
    width: 60px;
}
.clear{
    clear:both;
}
hr{
    margin:10px 0;
}
.sin-margen{
    margin:0 !important;
}
.img-maquina{
    margin:2px 0 2px 12px;
}
.titulo-equipo{
    background-color: #f39200;
    font-size: 22px;
    display: block;
    padding: 12px 20px;
}
.titulo-instructores{
    background-color: #36a9e1;
    font-size: 22px;
    display: block;
    padding: 12px 20px;
}

.form-horizontal .control-label {
    text-align: right;
}
.paralelogramo {
     width: 50px; 
     height: 24px; 
     -webkit-transform: skew(-45deg);
     -moz-transform: skew(-45deg);
     -ms-transform: skew(-45deg);
     -o-transform: skew(-45deg);
     transform: skew(-45deg);
     z-index: 1;
}
.paralelogramo:hover + .p-o{
    display: table-cell;
}
.bg-paralelogramo{
    background-image: url('../images/bg-boton-spa.png');
    background-position: left center;
    background-repeat: no-repeat;
    cursor: pointer;
}
.bg-paralelogramo:hover {
    background-image: url('../images/bg-boton-spa-hover.png');
}
.bg-paralelogramo:hover > .p-o{
    display: table-cell;
}
.bg-p1{
    margin-left: -16px;
    padding-left: 16px;    
}
.bg-p2{
    margin-left: -40px;
    padding-left: 40px;    
}
.bg-p3{
    margin-left: -64px;
    padding-left: 64px;    
}
.bg-p4{
    margin-left: -88px;
    padding-left: 88px;    
}
.bg-p5{
    margin-left: -112px;
    padding-left: 112px;    
}
.bg-p6{
    margin-left: -136px;
    padding-left: 136px;    
}
.bg-p7{
    margin-left: -160px;
    padding-left: 160px;    
}
.bg-p8{
    margin-left: -184px;
    padding-left: 184px;    
}
.bg-p9{
    margin-left: -208px;
    padding-left: 208px;    
}
.bg-p10{
    margin-left: -232px;
    padding-left: 232px;    
}
.bg-p11{
    margin-left: -256px;
    padding-left: 256px;    
}
.bg-p12{
    margin-left: -280px;
    padding-left: 280px;    
}
.bg-p13{
    margin-left: -304px;
    padding-left: 304px;    
}

#t1, #t2, #t3, #t4{
    display: table-cell;
    height: 300px;
    vertical-align: bottom;
    width: 300px;
    position: absolute;
    right: 0;
}
#p-s{
    position: absolute;
    bottom:50px;
    right: 150px;
    width: 200px;
}
.p1{
    left:0;
    position: relative;
    background: #aaad00;
    cursor: pointer;
}
.p2{
    left:-24px;
    position: relative;
    background: #9dab1e;
    cursor:pointer;
}
.p3{
    left:-48px;
    position: relative;
    background: #90a523;
    cursor:pointer;
}
.p4{
    left:-72px;
    position: relative;
    background: #8fa023;
    cursor:pointer;
}
.p5{
    left:-96px;
    position: relative;
    background: #809726;
    cursor:pointer;
}
.p6{
    left:-120px;
    position: relative;
    background: #76942b;
    cursor:pointer;
}
.p7{
    left:-144px;
    position: relative;
    background: #668e2d;
    cursor:pointer;
}
.p8{
    left:-168px;
    position: relative;
    background: #608c2b;
    cursor:pointer;
}
.p9{
    left:-192px;
    position: relative;
    background: #55842e;
    cursor:pointer;
}
.p10{
    left:-216px;
    position: relative;
    background: #487a2f;
    cursor:pointer;
}
.p11{
    left:-240px;
    position: relative;
    background: #37742f;
    cursor:pointer;
}
.p12{
    left:-264px;
    position: relative;
    background: #236c2e;
    cursor:pointer;
}
.p13{
    left:-288px;
    position: relative;
    cursor:pointer;
}
.p-o{
    float: left;
    margin-top: -24px;
    position: absolute;
    height: 24px;
    display: table-cell;
    background-color: #2a2a2a;
    padding: 4px 8px 4px 36px;
    display: none;
    white-space:nowrap;
}
.p-o-1{
    margin-left: 24px;
}
.p-o-2{
    margin-left: 0;
}
.p-o-3{
    margin-left: -24px;
}
.p-o-4{
    margin-left: -48px;
}
.p-o-5{
    margin-left: -72px;
}
.p-o-6{
    margin-left: -96px;
}
.p-o-7{
    margin-left: -120px;
}
.p-o-8{
    margin-left: -144px;
}
.p-o-9{
    margin-left: -168px;
}
.p-o-10{
    margin-left: -192px;
}
.p-o-11{
    margin-left: -216px;
}
.p-o-12{
    margin-left: -240px;
}
.p-o-13{
    margin-left: -264px;
}

#p-s1{
    position: absolute;
    bottom:220px;
    right: 150px;
    width: 200px;
}
#p-s2{
    position: absolute;
    bottom:26px;
    right: 150px;
    width: 200px;
}
#p-s3{
    position: absolute;
    bottom:170px;
    right: 150px;
    width: 200px;
}
.bg01{
    background: #cbbba0;
}
.bg02{
    background: #bfb197;
}
.bg03{
    background: #b3a68e;
}
.bg04{
    background: #a59983;
}
.bg05{
    background: #968b77;
}

.bg11{
    background: #bfe0d7;
}
.bg12{
    background: #b4cabb;
}
.bg13{
    background: #8ebba7;
}
.bg14{
    background: #6fb19c;
}
.bg15{
    background: #48a89b;
}
.bg16{
    background: #2aa49a;
}
.bg17{
    background: #aabbb4;
}
.bg18{
    background: #a8b491;
}
.bg19{
    background: #87a28b;
}
.bg20{
    background: #699086;
}
.bg21{
    background: #5e8582;
}
.bg22{
    background: #4e8181;
}
.bg23{
    background: #007c81;
}

.bg31{
    background: #fef6f3;
}
.bg32{
    background: #fce4e9;
}
.bg33{
    background: #f8c8d8;
}
.bg34{
    background: #f4b4cc;
}
.bg35{
    background: #ee87b1;
}
.bg36{
    background: #e95294;
}
.bg37{
    background: #e6007e;
}
.wrapper-membresia{
    height: 160px;
    display:table;
}
.contenedor-membresia{
    display:table-cell;
    vertical-align:middle;
}
#footer{
    background-color:#495462;
    padding: 100px 5% 100px 5%;
    color:#fff;
}
#footer h1{
    font-size: 14px;
    font-weight: bold;
}
#footer a {
    color:#fff;    
    transition: color 0.5s ease;
}
#footer a:hover{
    color: #243543;
    text-decoration: none;
}
#footer ul{
    list-style-type: none;
    padding: 0;
    margin: 0;
}
#footer span.footer-1{
    font-size: 11px;
    text-align: right;
}
#footer .borde-izquierdo,
.borde-izquierdo{
    border-left: 1px solid #243543;
}
.imagen-footer{
    margin-bottom: 20px;
}
.tabla-footer{
    margin-bottom: 16px;   
}
/*#footer .row {
  display: table;
}
#footer [class*="col-"] {
  float: none;
  display: table-cell;
  vertical-align: top;
}*/

.row.is-flex {
    display: flex;
    flex-wrap: wrap;
}
.row.is-flex > [class*='col-'] {
    display: flex;
    flex-direction: column;
}
/*
* And with max cross-browser enabled.
* Nobody should ever write this by hand. 
* Use a preprocesser with autoprefixing.
*/
.row.is-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.row.is-flex > [class*='col-'] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}


#contactanos{
    margin:40px 0;
}
#contactanos h1{
    color: #a9ab11;
    text-align: center;
    font-size: 30px;
    margin-bottom: 20px;
}
#contactanos h2{
    color: #a9ab11;
    margin-top:0;
    padding-top:0;
}
#contactanos .titulo-2{
    color:#a9ab11;
}
#contactanos .borde-derecho,
.borde-derecho{
    border-right: 1px solid #a9ab11;
}
.texto-contacto{
    text-align: right;
}
.borde-derecho-galeria{
    border-right: 1px solid #fff;
}
.categorias-gym{
    left:20%;
    right: 20%;
    text-align: center;
}
.categorias-spa{
    left:10%;
    right: 10%;
    text-align: center;
}
.titulo-galeria{
    color:#495462;
    background-color: #a9ab11;
    opacity: 0.85;
    width: 150px;
    height: 20px;
    overflow: hidden;
    display: inline-block;
    margin-left: -150px;
    margin-top: 130px;
    position: absolute;
}
#carousel-galeria .carousel-control{
    background: transparent;
    width: 4%;
}
#carousel-galeria .carousel-inner{
    margin-top: 80px;
    margin-bottom: 80px;
    height: 340px;
}
#carousel-galeria .carousel-indicators {
    bottom: -80px;
}
.video-youtube {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 60px; overflow: hidden;
}
.video-youtube iframe,
.video-youtube object,
.video-youtube embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.galeria-video{
    padding-left:40px;
    padding-right:40px;
}
a.texto-video:hover{
    color:#fff;
    text-decoration: none;
}
.titulo-spa-gym{
    font-size: 1.5em;
    margin-right: 20px;
}
.iconos-contacto{
    width: 28px;
    display: inline-block;
    text-align: left;
}
#banner-gym a,
#banner-spa a {
    color:#b2b2b2;    
    transition: color 0.5s ease;
}
#banner-gym a:hover,
#banner-spa a:hover{
    color: #fff;
    text-decoration: none;
}
#home{
    background: url(../images/00.jpg) no-repeat center center fixed; 
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    min-height: 592px;
    position: relative;
    text-align: center;
    padding-top: 234px;
}
#spa-gym{
    /*background: url(../images/02.jpg) no-repeat center center fixed; */
    background: no-repeat center center fixed; 
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    min-height: 490px;
}

a.enlace-1 {
    transition: color 0.5s ease;
}
a.enlace-1:hover{
    color: #fff;
    text-decoration: none;
}
.resultados{
    padding-right: 0;
}
.r2, .r3{
    padding-left: 4px;
}
#resultado1, #resultado2, #resultado3{
    padding: 6px;
    text-align: center;
    font-size: 85%;
}
.spa-pop{
    margin-left: -370px;
    margin-top: 8px;
    position: absolute;
    width: 370px;
    height: 100px;
    background-image: url(../images/pop.png);
    background-repeat: no-repeat;
    display: block;
    text-align: left;
    padding: 12px 100px;
    text-indent: -6px;
}
.cerrar{
    cursor: pointer;
}
/* Large desktops and laptops */
@media (min-width: 1200px) {
    .texto-contacto{
        text-align: right;
    }
    .tabla-contacto{
        float: right;   
    }
}

/* Landscape tablets and medium desktops */
@media (min-width: 992px) and (max-width: 1199px) {
    .texto-contacto{
        text-align: center;
    }
    .tabla-contacto{
        margin: 0 auto;   
    }
}

/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
    .texto-contacto{
        text-align: center;
    }
    .tabla-contacto{
        margin: 0 auto;   
    }
}

/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
    .texto-contacto{
        text-align: center;
    }
    .tabla-contacto{
        margin: 0 auto;   
    }
}

/* Portrait phones and smaller */
@media (max-width: 480px) {
    .texto-contacto{
        text-align: center;
    }
    .tabla-contacto{
        margin: 0 auto;   
    }    
    .parallax-window {
        min-height: 128px;
    }
    #home{
        min-height: 180px;
        padding-top: 28px;
    }
    #spa-gym{
        min-height: 126px;
    }

}