@charset "utf-8";
/* CSS Document */

/* ==========================================================================
  Personalizados
========================================================================== */

body {font-family: sans-serif; color: #a4a3a3; font-size: 16px; font-weight: 300; font-family: 'Montserrat', sans-serif;}
b, strong {font-weight: 900;}
p {margin-bottom: 15px; line-height: 25px;}
.wow { visibility:hidden;}/*hack por problemas en firefox con wow animation*/

.title-page {text-align: left;  margin: 40px auto; }
.title-page .title {font-weight: 300; font-size: 37px; color:#454545; text-transform: uppercase; margin:0; position: relative;}
.title-page .title b {font-weight: 900;}

.title-page .title-description {color:#5dae87; font-weight: 400; font-size: 14px; text-transform: uppercase; text-align: left; margin-top: 20px;}

.section {	width: 100%; position: relative; overflow: hidden;}
.offset-body {/*padding-top: 130px;*/}
.bg {background-image: url("../imagenes/bg.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover;}

/* ------------------------------------------------------------------------------
   Preloader styles
-------------------------------------------------------------------------------*/

#preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #fefefe; z-index: 9999; height: 100%; height: 100%;}
#status { width: 200px; height: 200px; position: absolute; left: 50%; top: 50%; background: url(ajax-loader.gif) no-repeat center center; margin: -170px 0 0 -100px;}


/* ==========================================================================
  Herramientas
========================================================================== */

.boxshadow {-webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);-moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);}
.zoom img { transform: scale(1); transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s; }
.zoom:hover img { transform: scale(1.1); opacity:0.9; }
.overflow { overflow: hidden; }
.no-padding { padding: 0; }
.blancoynegro img {/*Se ven en Blanco y Negro*/
	filter: grayscale(100%); 	-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -o-filter: grayscale(100%); -ms-filter: grayscale(100%);}
.blancoynegro img:hover {/*Se ven en Color*/
	filter: grayscale(0%); 	-webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -o-filter: grayscale(0%); -ms-filter: grayscale(0%);}

/* ==========================================================================
  Menu
========================================================================== */

#menu.navbar-default .navbar-nav > li > a {color:#fff; font-size: 16px; padding:20px 10px;}
#menu.navbar {min-height:50px;}
#menu .navbar-nav { float: none; margin: 0 auto; width: 100%; text-align: center;}
#menu.navbar-default {background-color: rgba(69, 69, 69, 0);}
#menu.visible {background-color: rgba(69, 69, 69, 1); transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -webkit-transition: all .25s }
#menu.oculto {background-color: rgba(69, 69, 69, 0);transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -webkit-transition: all .25s }
#menu .navbar-header { width: 100%; margin: 0 auto; text-align: center; float: none;}
#menu.navbar-default .navbar-nav > .current > a { color: #fff; background-color: #5dae87; transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -webkit-transition: all .25s }
#menu .redes {text-align: right; padding-top: 25px; padding-right: 0;}
#menu .brand {width: 15%; float: left;}
#menu .redes .iconos {display: inline-block; margin-bottom: 10px;}
#menu .redes .iconos:hover {filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -o-filter: grayscale(100%); -ms-filter: grayscale(100%);}
#menu .redes .address {float: right;}
#menu .redes .address p {color:#6ea3c3; font-weight:300; font-size: 12px; line-height: 1.42857143;}
#menu .navbar-nav > li {display: inline-block; float: none;}
#menu.navbar-default .navbar-nav > li > a:hover, #menu.navbar-default .navbar-nav > li > a:focus .navbar-default .navbar-nav > .open > a, 
#menu.navbar-default .navbar-nav > .open > a:hover, #menu.navbar-default .navbar-nav > .open > a:focus {
 color: #fff; background-color: #5dae87; transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; -webkit-transition: all .25s }
#menu .nav > li > a {padding:5px 8px; border-top: 2px solid transparent;}
#menu .container {width: 100%;}
#menu.navbar-default .navbar-brand { padding: 0; margin: 5px 0px 0px 0px; width: 100%;}
#menu.navbar-default .navbar-nav .open .dropdown-menu > li > a {font-size: 12px; color:#707070;}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {border-color: transparent;}
#myNavbar {float: right;}
.navbar-nav > li > .dropdown-menu {
  padding: 20px; background-color: rgba(255, 255, 255, 0.75); min-width: 273px;
}
.navbar-fixed-top {
  border-width: 0 0 0px;
}

/* ==========================================================================
  Hamburguesa
========================================================================== */
#menu.navbar-default .navbar-toggle {background-color: #5dae87; border-radius:0; border:0; padding:12px 10px; top:0px; margin-right: 0;}
#menu.navbar-default .navbar-toggle .icon-bar {background-color:#fff;}
#menu.navbar-default .navbar-toggle:hover, #menu.navbar-default .navbar-toggle:focus {background-color:#5dae87;}

/* ==========================================================================
  Pasador Uno
========================================================================== */

#slider { position: relative; width: 100%;}

.pasadoruno {position: relative;}
.pasadoruno #eldivpasadoruno{width:100%; min-width:100px; height:100%; float:left; overflow:hidden; position: relative;}
.pasadoruno .flech {width: 34px; height: auto; margin-left: 15px; margin-right: 15px; position: absolute; z-index: 999; text-align: center; cursor: pointer; overflow:hidden; margin-top: 15%}
.pasadoruno .flech {opacity: 0.5}
.pasadoruno .flech:hover, .pasadoruno .flech:focus {opacity: 1}
.pasadoruno .flech.left {left: 9px;}
.pasadoruno .flech.right {right: 9px;}
.pasadoruno .flech img {width: 34px; height: auto; top:30%; position: relative;}
.pasadoruno .fotopasadoruno {width: calc(100% / 3); height:100%; float:left;}
.pasadoruno .fotopasadoruno img {width: 100%; float: left}
.pasadoruno #carretepasadoruno{height:100%;}
.pasadoruno .textos {position: absolute; width: 100%; height:100%; background-color: rgba(0, 0, 0, 0.2);}
.pasadoruno .textos .title {text-align: center;	position: absolute;	left: 5%; top: 25%;	font-family: 'Montserrat', sans-serif;	width: 90%;}

.pasadoruno .textos .title h2 {color:#fff; font-weight: 900; font-size: 61px; margin-bottom: 0; margin-top: 0;}
.pasadoruno .textos .title h3 {color:#fff; font-weight: 300; font-size: 42px; margin-top: 0;}
.pasadoruno .textos .title h3 b {font-weight: 700;}
.pasadoruno .textos .title p {font-weight: 400; font-size: 24px; color:#fff;}
.pasadoruno .textos .title p.light {font-weight: 300; font-size: 12px; color:#fff; margin-top: 60px;}

.pasadoruno .textos .title .vermas {background-color: #7fbce1; color:#fff; font-size: 16px; font-weight: 400; letter-spacing: 2px; padding: 10px 25px; border-radius: 10px; text-transform: uppercase;
display: inline-block; margin-top: 15px; border: solid 1px #fff;}
.pasadoruno .textos .title .vermas:hover, .pasadoruno .textos .title .vermas:focus {background-color: #707070; color:#fff; }
.pasadoruno .textos .title img {
  width: auto;
  display: inline-block;
  float: none;
}

/* ==========================================================================
  Quienes somos
========================================================================== */

.text p {  color: #a4a3a3;  font-weight: 300;  font-size: 14px;  text-align: left;  margin: 0 0 20px;  line-height: 21px;}
.text p a {color: #5dae87;}
/* ==========================================================================
  Tratamientos
========================================================================== */

.tratamientos {padding:20px 0px 60px 0px!important;}
.service { padding: 58px 61px 98px;  text-align: center; cursor: pointer; min-height: 470px;}
.service.blue {background-color: #7fbce1;}
.service.orange {background-color: #ffb469;}
.service.green {background-color: #42d4d6;}
.service.white {background-color: #fff;}
.service .separator {  width: 30px;  height: 2px;  background-color: #fff;  margin: 5px auto 0;}
.service h5 { margin-top: 20px;  color: #fff;  text-transform: uppercase;  font-weight: 700;  font-size: 14px;  letter-spacing: 2px;}
.service p { margin-top: 51px;  color:#fff;  font-size: 14px;  font-weight: 300;}
.service a {color:#fff; font-size: 12px; font-weight: 400; letter-spacing: 2px; padding: 10px 25px; border-radius: 10px; text-transform: uppercase;
display: inline-block; margin-top: 15px; border: solid 1px #fff;}
.service a:hover, .service a:focus {color:#fff; background-color: rgba(255, 255, 255, 0.25);}

/* ==========================================================================
  Tratamientos Internos
========================================================================== */

.service.white {cursor:inherit; text-align: left; min-height: 470px;}
.service.white h5 { margin-top: 20px;  color: #231f20;  text-transform: uppercase;  font-weight: 700;  font-size: 14px;  letter-spacing: 2px;}
.service.white p { margin-top: 51px;  color:#637988;  font-size: 14px;  font-weight: 300; text-align: left;}
.service.white p a {color: #637988; text-align: left; line-height: 16px; margin: 0; padding: 0; border:0;}
.service.white p a:hover, .service.white p a:focus {color: #231f20; background-color: #fff}
.service.white a {color:#637988; font-size: 12px; font-weight: 400; letter-spacing: 2px; padding: 10px 25px; border-radius: 10px; text-transform: uppercase;
display: inline-block; margin-top: 15px; border: solid 1px #637988;}
.service.white a:hover, .service.white a:focus {color:#637988; background-color: #f3f3f3}

/* ==========================================================================
  Tratamientos Carousel
========================================================================== */

#carousel1 .carousel-inner > .item {  width: 100%;}
#carousel1 .carousel-inner > .item div img {width: 100%;}
#carousel1 .carouseles {margin-bottom: 60px; padding:20px 0px 60px 0px!important;}
#carousel1 .carousel-indicators {  left: 0%;  width: 50%;  padding-left: 0;  margin-left: 0%;}
#carousel1.blue {background-color: #7fbce1;}
#carousel1.orange {background-color: #ffb469;}
#carousel1.green {background-color: #42d4d6;}
#carousel1 .carousel-inner .item .content {padding:20px 40px;}
#carousel1 .carousel-inner .item .content h3 {color: #fff; font-weight: 300; font-size: 38px; letter-spacing: 2px; margin-bottom: 20px;}
#carousel1 .carousel-inner .item .content p {color: #fff; font-weight: 300; font-size: 14px; margin-bottom: 20px;}
#carousel1 .carousel-inner .item .content a {color:#fff; font-size: 12px; font-weight: 400; letter-spacing: 2px; padding: 10px 25px; border-radius: 10px; text-transform: uppercase;
display: inline-block; margin-top: 15px; border: solid 1px #fff;}
#carousel1 .carousel-inner .item .content a:hover, #carousel1 .carousel-inner .item .content a:focus {color:#fff; background-color: rgba(255, 255, 255, 0.25);}

/* ==========================================================================
  Promociones
========================================================================== */

#promociones {padding-bottom: 0;}
.section.promos {padding-top: 0; overflow: hidden; height: 100%; width: 100%; position: relative;}

#promos .carousel-inner > .item {  width: 100%;}
#promos .carousel-inner > .item div img {width: 100%;}
#promos .carouseles {margin-bottom: 60px; padding:20px 0px 60px 0px!important;}
#promos .carousel-indicators {  left: 0%;  width: 50%;  padding-left: 0;  margin-left: 0%;}
#promos.blue {background-color: #7fbce1;}
#promos.orange {background-color: #ffb469;}
#promos.green {background-color: #42d4d6;}
#promos .carousel-inner .item .content {padding:20px 40px; text-align: center;}
#promos .carousel-inner .item .content .icono img {width: 40px; margin:0 auto;}
#promos .carousel-inner .item .content h3 {color:#fff; font-weight: 900; font-size: 46px; margin-bottom: 20px; margin-top: 0}
#promos .carousel-inner .item .content h4 {color:#ffb469; font-weight: 300; font-size: 22px; margin-top: 0; padding:5px; background-color: #fff; display: inline-block; margin-bottom: 20px;}
#promos .carousel-inner .item .content h4 b {font-weight: 700;}
#promos .carousel-inner .item .content p {color: #fff; font-weight: 300; font-size: 14px; margin-bottom: 20px;}
#promos .carousel-inner .item .content a {color:#fff; font-size: 12px; font-weight: 400; letter-spacing: 2px; padding: 10px 25px; border-radius: 10px; text-transform: uppercase;
display: inline-block; margin-top: 15px; border: solid 1px #fff;}
#promos .carousel-inner .item .content a:hover, #promos .carousel-inner .item .content a:focus {color:#fff; background-color: rgba(255, 255, 255, 0.25);}
#promos .carousel-inner .item .content p.light {color: #fff; font-weight: 300; font-size: 11px; margin-bottom: 10px; line-height: 13px; margin-top: 20px;}

.carousel-control.left, .carousel-control.right {
  background-image: none!important;
}
.carousel-control .arrow img {width: 20px;}
.carousel-control .arrow {width: 20px; position: absolute; top:45%;}
.carousel-control.left .arrow {left:10px;}
.carousel-control.right .arrow {right:10px;}

/* ==========================================================================
  Contacto
========================================================================== */

.section.contacto {background-color: #f4f4f4;}
.section.contacto.singris {background-color: #fff;}
.section.contacto .title-page {width: 100%; text-align: center;}
.section.contacto .title-page h2.title {font-weight: 900; font-size: 47px;}
.section.contacto .title-page .atencion {padding:5px; color:#454545; font-size: 14px; font-weight: 300; margin:15px 0; text-align: center;}
.section.contacto .ico {text-align: center;}
#formi .form-control {  color: #727272;  background-color: #f4f4f4;  background-image: none;  border: 1px solid #847f81;  border-radius: 0px;  
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.0);  box-shadow: inset 0 1px 1px rgba(0,0,0,.0); height: 50px;}
#formi { position: relative; padding: 40px 20px;}
#formi #contact-message {border: 1px solid #727272; min-height: 100px;}
#formi .btn.green {  float: right;  background: #f4f4f4; height: 50px; color: #727272;  border: 1px solid #847f81;  border-radius: 0; padding:5px 20px;}
#formi .btn.green:hover, #formi .btn.green:focus {color:#fff; background: #454545;}
.map-container iframe {min-height: 320px;}
.form-bottom.contact-form {margin-bottom: 60px;}

/* ==========================================================================
  Parallax
========================================================================== */

.parallax-text {  margin: 6% auto;  width: 70%;  float: right;  color: #fff;}
.parallax-text  h3 {font-weight: 600;}
.features {padding: 5px; margin: 10px 0;}
.features {border-left: 4px solid rgba(255,255,255,0.75);}
.inline {width: 100%}
.inline img {display: inline-block;}
.inline h3 {  display: inline-table;  width: 80%;  padding-left: 5%;}


/* ==========================================================================
  Footer
========================================================================== */

footer {background-color: #454545; width: 100%; position: relative; padding:20px 0;}
footer .container {width: 100%;}
footer .log p {font-size: 12px; color:#fff; margin:0;}
footer .co {padding-left: 14%;}
footer .redes {padding-right: 0; text-align: center;}
footer .redes p {  font-size: 12px;  color: #fff;  line-height: 18px;  margin-top: 15px;}
footer .redes a {font-size: 12px; color:#fff;}
footer .redes .iconos {display: inline-block; margin-bottom: 10px;}
footer .redes .iconos:hover {opacity: 0.7;}
footer .redes .address {float: right;}
footer .redes .address p {color:#fff; font-weight:300; font-size: 12px; line-height: 1.42857143;}
footer .upper-foot {padding-bottom: 10px;}
footer .lower-foot {padding-top: 10px;}


.copyright {width: 100%; background-color: #5dae87; padding:10px 0;}
.copyright p {font-size: 12px; font-weight: 300; color:#fff; text-align: center;}
.copyright p a {color:#fff;}
.copyright p a:hover, .copyright p a:focus {color:#454545; text-decoration: underline;}