/* GLOBAL STYLES
-------------------------------------------------- */


/* CSS */

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNova-Light.eot');
    src: url('../fonts/ProximaNova-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ProximaNova-Light.woff2') format('woff2'),
        url('../fonts/ProximaNova-Light.woff') format('woff'),
        url('../fonts/ProximaNova-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNova-Regular.eot');
    src: url('../fonts/ProximaNova-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ProximaNova-Regular.woff2') format('woff2'),
        url('../fonts/ProximaNova-Regular.woff') format('woff'),
        url('../fonts/ProximaNova-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaT-Thin.eot');
    src: url('../fonts/ProximaNovaT-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ProximaNovaT-Thin.woff2') format('woff2'),
        url('../fonts/ProximaNovaT-Thin.woff') format('woff'),
        url('../fonts/ProximaNovaT-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNova-Bold.eot');
    src: url('../fonts/ProximaNova-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ProximaNova-Bold.woff2') format('woff2'),
        url('../fonts/ProximaNova-Bold.woff') format('woff'),
        url('../fonts/ProximaNova-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


/* Padding below the footer and lighter body text */

body {
  padding-top: 0;
  padding-bottom: 0;
  font-family: 'Proxima Nova';
  line-height: 1.2;
}

b, strong {
  font-weight: 700;
}

h2, h3 {
	margin-bottom: 0;
}

hr {
	width: 142px;
	margin: 1px 0 5px;
}

main p, main li {
	font-weight: 300;
}

.w1 {
	width: 292px;
	margin: 0 auto;
}


.btn-primary {
	color: #fff;
}

header .bg-light {
	background-color: #fff !important;
}

.navbar-nav .nav-link {
	font-family: Arial;
	text-transform: uppercase;
	color: #646464;

}
.navbar-nav .nav-link:hover {
	color: #323232;

}


@media (min-width: 768px) {

.navbar-expand-md .navbar-nav .nav-link {
    padding-right: 0;
    padding-left: 30px;
}
	
}

/* Carousel base class */

/* Since positioning the image, we need to help out the caption */
.carousel-caption {

top: 50%;
transform: translateY(-50%);	
	padding: 0;
  z-index: 10;
  right: inherit;
  left: inherit;
  color: #646464;
	width: 400px;bottom: inherit;
}

.carousel-white {
	color: #fff;
	width: auto;
  right: 0;
  left: 0;
}


.carousel-caption .btn-light {
	background-color: transparent;
	border-color: #646464;
	color: #646464;
}
.carousel-white .btn-light {
	background-color: transparent;
	border-color: #fff;
	color: #fff;
}
.carousel-caption .btn-dark2 {
	background-color: #ece7ab;
	border-color: #ece7ab;
	color: #646464;
}
.carousel-caption .btn-light:hover, .carousel-caption .btn-dark2:hover {
	background-color: #555555;
	border-color: #555555;
	color: #fff;
}


.carousel-caption h1 {
  color: #7f7665;
  font-weight: 700;
  margin: 0;
}

.carousel-caption.text-white h1 {
  color: #ece7ab;
}
.carousel-white h1 {
  color: #fff;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 590px;
}

.slider1 {
  background-color: #dadbdd;
}
.slider2 {
  background-color: #a57a64;
}
.slider3 {
  background-color: #e9e7e5;
}

.slider4 {
  background-color: #202020;
}


.carousel-item > img {
  position: absolute;
  bottom: 0px;
  /*left:0;*/
  right:0;
  margin:0 auto;
  height: 590px;
}
.slider2 > img, .slider4 > img {
  left:0;
}


#opinionesCarousel .carousel-item {
  height: 270px;
	padding-top: 20px;
}


#opinionesCarousel .carousel-inner .carousel-item.active,
#opinionesCarousel .carousel-inner .carousel-item-next,
#opinionesCarousel .carousel-inner .carousel-item-prev {
    display: flex;
}
/* medium and up screens */
@media (min-width: 768px) {
    
    #opinionesCarousel .carousel-inner .carousel-item-end.active,
    #opinionesCarousel .carousel-inner .carousel-item-next {
      transform: translateX(33.3%);
    }
    
    #opinionesCarousel .carousel-inner .carousel-item-start.active, 
    #opinionesCarousel .carousel-inner .carousel-item-prev {
      transform: translateX(-33.3%);
    }
}

/* medium and up screens */
@media (max-width: 768px) {
    
	
	#opinionesCarousel .carousel-item {
      height: auto;
	}
	#opinionesCarousel .carousel-item .col-4 {
	  width: 100%;
	}
}

#opinionesCarousel .carousel-inner .carousel-item-end,
#opinionesCarousel .carousel-inner .carousel-item-start { 
  transform: translateX(0);
}


.box-relative {
  position: relative;
	display: block;
/*	height: 400px;
	width: 686px;*/
}

.box-relative > img {
/*  position: absolute;*/
  height: 400px;
}

.box-facial {
	top: 20px;
	left: 20px;
	position: absolute;
	width: 292px;
	padding: 20px;
	background-color: #fff;
}

.box-facial p:last-child {
	margin-bottom: 0;
}


.tratamientos .col-md-auto {
	position: relative;
}

.tratamientos div.h3 {
	color: #fff;
	position: absolute;
	bottom: 0;
	font-weight: 700;
	font-size: 18px;
	text-align: center;
	height: 40px;
	width: 90%;
	padding: 0 auto;
}

#laser img {
	display: block;
}
.instagram img {
	border: 2px solid #b04c9c;
	padding: 5px;
	width: 103px;
}

.instagram p {
	font-weight: 400;
}

.opinion .comilla {
	font-size: 80px;
	color: #fff;
	left: 90% !important;
	top: 10% !important;
	line-height: 1;
	height: 53px;
}

.btn-white {
	padding: 2px 10px;
	color: #646464;
	background-color: #fff;
	border-color: #646464;
}

.btn-white:hover {
	color: #fff;
	background-color: #646464;
	border-color: #646464;
}


.form-label {
	margin: 5px 0;
}

.form-control {
	border-radius: 0;
	padding: 2px 5px;
	margin-bottom: 5px;
	border: 2px solid #323232;
}
.form-check-label {
	font-size: 14px;
}


input.error{
	border:2px solid #99182c;
}

label.error{

	color:#99182c;
	padding:1px 0;
	font-size:small;
}

@media (max-width: 768px) {
	
}
@media (max-width: 460px) {
	.box-relative > img {
	/*  position: absolute;*/
	  height: auto;
	}
}
@media (max-width: 360px) {
}

.btn-sm, .btn-group-sm > .btn {
  line-height: 1.2;
  margin-top: -5px;
}


footer {
	margin-top: 20px;
	border-top: 1px solid #a59983;
	background-color: #fff;
	padding: 35px 0 40px;
}

footer a {
	color: #323232;
}

footer a:hover {
	color: #a59983;
}


.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.ir-arriba {
	display:none;
	padding:13px 15px;
	background:#a59983;
	font-size:20px;
	color:#fff;
	cursor:pointer;
	position: fixed;
	bottom:20px;
	right:20px;
	z-index: 100000;
}

.ir-arriba:hover {
	background:#d1d1d0;
}
