/* Estilos website El Sabino */

h1, h2, h3 {
	    font-family: 'Staatliches';
	    letter-spacing: 1px;
}

h1 {
	font-size: 55px;
	line-height: 55px;
}

h4, h5 {
	font-family: 'Montserrat Medium', sans-serif;
	letter-spacing: 2px;
}

p, form, label {
	line-height: 18px;
	font-size: 16px;
	font-family: 'Montserrat', sans-serif;
	letter-spacing: 0px;
}

body {
	font-family: 'Montserrat', sans-serif;
}

a {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	letter-spacing: 1px;
	text-decoration: none;
}

button {
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	text-decoration: none;
}

.form-box {
	min-height: 400px;
	height: auto;
	background-color: white;
	width: 100%;
	padding: 20px;
}

.texto-naranja {
	color: #ea560d;
}

.texto-gris {
	color: #706f6f;
}

.texto-mayusculas {
	text-transform: uppercase;
}

.texto-mayusculas-servicios {
	text-transform: uppercase;
	font-size: 16px !important;
}

.texto-12-sm {
	font-size: 12px;
}

.bg-gris-1-sabino {
	background-color: #706f6f;
}

.bg-gris-2-sabino {
	background-color: #464646;
}

.bg-naranja-sabino {
	background-color: #ea560d;
}

.bg-crema-sabino {
	background-color: #f7f5e9;
}

.mapa {
	min-height: 450px;
}

.area-encabezado {
	min-height: 450px;
}

.bg-ferreteria-home {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/img-seccion-ferreteria.png);
	background-size: cover;
	background-position: center;
}

.bg-herrajes-home {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/herrajes-bg.png);
	background-size: cover;
	background-position: center;
}

.bg-optimizador-home {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/bg-optimizador-home.png);
	background-size: cover;
	background-position: center;
}

.bg-productos-amenidades {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/bg-productos-amenidades.png);
	background-size: cover;
	background-position: center;
}

.bg-contacto-tel {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/contacto-tel.jpg);
	background-size: cover;
	background-position: center;
}

.bg-talleres-amenidades {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/bg-talleres-amenidades.png);
	background-size: cover;
	background-position: center;
}

.bg-wc-amenidades {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/bg-wc-amenidades.png);
	background-size: cover;
	background-position: center;
}

.bg-dimensionado-1 {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/slide-dimensionado-1.png);
	background-size: cover;
	background-position: center;
}

.bg-dimensionado-2 {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/slide-dimensionado-2.png);
	background-size: cover;
	background-position: center;
}

.bg-enchapado-cantos {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/enchapado-serv.png);
	background-size: cover;
	background-position: center;
}

.bg-bisagras-serv {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/p-bisagras.png);
	background-size: cover;
	background-position: center;
}

.bg-corte {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/corte.png);
	background-size: cover;
	background-position: center;
}

.bg-cepillado {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/cepillado.png);
	background-size: cover;
	background-position: center;
}

.bg-laminado {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/laminado.png);
	background-size: cover;
	background-position: center;
}

.bg-corte-45 {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/corte-45.png);
	background-size: cover;
	background-position: center;
}

.bg-domicilio-serv {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/domiicilio.png);
	background-size: cover;
	background-position: center;
}

.bg-cubrecantos-ferreteria {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/cubrecantos-ferreteria.png);
	background-size: cover;
	background-position: center;
}

.bg-hettich-ferreteria {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/herrajes-hettich.png);
	background-size: cover;
	background-position: center;
}

.bg-pasos-optimizador {
	width: auto;
	height: auto;
	min-height: 850px;
	background-image: url(../images/pasos-optimizador.png);
	background-size: cover;
	background-position: center;
}

.bg-seccion-optimizador {
	width: auto;
	height: auto;
	min-height: 450px;
	background-image: url(../images/bg-seccion-optimizador.jpg);
	background-size: cover;
	background-position: center;
}

.bg-showroom-card {
	width: auto;
	height: auto;
	min-height: 500px;
	background-image: url(../images/bg-showroom-home.png);
	background-size: cover;
	background-position: center;
}
.bg-wifi-card {
	width: auto;
	height: auto;
	min-height: 500px;
	background-image: url(../images/bg-wifi-home.png);
	background-size: cover;
	background-position: center;
}

.bg-productos-card {
	width: auto;
	height: auto;
	min-height: 500px;
	background-image: url(../images/bg-productos-home.png);
	background-size: cover;
	background-position: center;
}

.bg-talleres-card {
	width: auto;
	height: auto;
	min-height: 500px;
	background-image: url(../images/bg-talleres-home.png);
	background-size: cover;
	background-position: center;
}

.silder-home-1 {
	width: auto;
	height: auto;
	min-height: 500px;
	background-image: url(../images/anebidades-showroom-01-home.png);
	background-size: cover;
	background-position: center;
}

.banner-amenidades {
	width: auto;
	height: auto;
	min-height: 300px;
	background-image: url(../images/bg-amenidades-page.png);
	background-attachment: fixed;
  	background-position: top;
  	background-repeat: no-repeat;
  	background-size: cover;
}

.banner-servicios {
	width: auto;
	height: auto;
	min-height: 300px;
	background-image: url(../images/bg-servicios-page.png);
	background-attachment: fixed;
  	background-position: top;
  	background-repeat: no-repeat;
  	background-size: cover;
}

.banner-ferreteria {
	width: auto;
	height: auto;
	min-height: 300px;
	background-image: url(../images/bg-ferreteria-page.png);
	background-attachment: fixed;
  	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
}

.banner-optimizador {
	width: auto;
	height: auto;
	min-height: 300px;
	background-image: url(../images/bg-banner-optimizador.jpg);
	background-attachment: fixed;
  	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
}

.banner-contacto {
	width: auto;
	height: auto;
	min-height: 300px;
	background-image: url(../images/bg-banner-contacto.png);
	background-attachment: fixed;
  	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
}

.silder-home-2 {
	width: auto;
	height: auto;
	min-height: 500px;
	background-image: url(../images/anebidades-showroom-02-home.png);
	background-size: cover;
	background-position: center;
}

.boton-redondeado {
	border-radius: 50px;
	padding-left: 20px !important;
	padding-right: 20px !important;
	padding-top: 8px !important;
	font-family: 'Montserrat';
	font-weight: 600;
}

.nav-gris {
	min-height: 20px !important;
	height: auto;
}

.carousel-control-prev-icon, .carousel-control-next-icon {
  filter: invert(100%);
}

.carousel-indicators button {
    height: 10px !important;
    width: 10px !important;
    margin: 0 10px !important;
    border-radius: 100%;
    background-color: white !important;
}

.i4ewOd-pzNkMb-haAclf .i4ewOd-pzNkMb-tJHJj {
	display: none;
	background-color: transparent;
}



/* Flip card style */

.flip-card {
  width: 100%;
  height: auto;
  min-height: 500px;
  perspective: 1000px;
  margin: auto;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 500px;
  text-align: center;
  margin: auto;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: auto;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-card-front {
  color: black;
  margin: auto;

  padding-left: 15px;
  padding-right: 15px;
}


.flip-card-back {
  transform: rotateY(180deg);
  margin: auto;
}

@media only screen and (max-width: 720px) {
  .banner-amenidades {
  	width: auto;
  	height: auto;
  	min-height: 300px;
  	background-image: url(../images/bg-amenidades-page.png);
  	background-attachment: scroll !important;
    	background-position: top;
    	background-repeat: no-repeat;
    	background-size: cover;
  }

  .banner-servicios {
  	width: auto;
  	height: auto;
  	min-height: 300px;
  	background-image: url(../images/bg-servicios-page.png);
  	background-attachment: scroll !important;
    	background-position: top;
    	background-repeat: no-repeat;
    	background-size: cover;
  }

  .banner-ferreteria {
  	width: auto;
  	height: auto;
  	min-height: 300px;
  	background-image: url(../images/bg-ferreteria-page.png);
  	background-attachment: scroll !important;
    	background-position: center;
    	background-repeat: no-repeat;
    	background-size: cover;
  }

  .banner-optimizador {
  	width: auto;
  	height: auto;
  	min-height: 300px;
  	background-image: url(../images/bg-banner-optimizador.jpg);
  	background-attachment: scroll !important;
    	background-position: center;
    	background-repeat: no-repeat;
    	background-size: cover;
  }

  .banner-contacto {
  	width: auto;
  	height: auto;
  	min-height: 300px;
  	background-image: url(../images/bg-banner-contacto.png);
  	background-attachment: scroll !important;
    	background-position: center;
    	background-repeat: no-repeat;
    	background-size: cover;
  }

  .bg-pasos-optimizador {
	width: auto;
	height: auto;
	min-height: 400px;
	background-image: url(../images/pasos-optimizador.png);
	background-size: cover;
	background-position: center;
}
}

@media only screen and (max-width: 540px) {
  h1 {
  	font-size: 34px;
  	line-height: 34px;
  }

  p, form, label {
  	line-height: 16px;
  	font-size: 14px;
  	font-family: 'Montserrat';
  	letter-spacing: 0px;
  }

  .nav-gris-text {
  	text-align: center !important!;
  }
}