/*Importa la fuente corporativa y le aplico el estilo a toda la web*/

@import url(fonts/fuentes.css);

body {
  font-family: 'helveticaregular';
}

.enlace {
  text-decoration: none;
  color: black;
  font-weight: bold;
  letter-spacing: 0.5px;
}

.fs-7 {
  font-size: 13px;
}
.negrita {
  font-family: 'helveticabold';
}


:root {
  --dorado:#CCBB90;
  --celeste:#3AB0B6;
  --gris:#D9D9D9;
  --blanco: white;
  --negrolavado: rgb(63, 63, 63);
}

.dorado {
  color:#CCBB90 ;
}

.bg-dorado {
  background-color:#CCBB90 ;
}

.celeste {
  color:#3AB0B6 ;
}
.bg-celeste {
  background-color:#3AB0B6 ;
}

.gris {
  color:#D9D9D9;
}
.bg-gris {
  background-color:#D9D9D9 ;
}

.blanco {
  color: var(--blanco)
}

.h1-section {
  font-size: 30px;
  letter-spacing: 1px;
}

.h2-section {
  font-family: 'helveticabold';
  font-size: 22px;
  letter-spacing: 1px;
}

.h3-section {
  font-family: 'helveticabold';
  font-size: 18px;
  letter-spacing: 0.6px;
}

.p-section {
  font-size: 21px;
  text-align: center;
  letter-spacing: 1px;
}


/*WIDGETS*/

.btn-irarriba {
  position: fixed;
  right: 20px;
  bottom: 20px;
  cursor: pointer;
  background: white;
  border-radius: 20px;
}

.btn-irarriba:hover {
  border: 1px solid #;
  box-shadow: 1px 1px 10px rgba(236, 219, 175, 1);
  transition: box-shadow 200ms linear;
}


/*SECTION PORTADA*/
.navbar .btn-contactar {
  text-decoration: none;
  color: black;
}

.portada > .row > .datos-portada >.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.portada > .row > .datos-portada >.container > .datos1 .comollegar{
background-color: var(--gris);
padding: 7px 10px;
color: #272727;
}

.portada > .row > .datos-portada >.container > .datos1 .comollegar:hover{
  background-color: var(--celeste);
  transition: ease-in-out 200ms;
  color: white;
}

.portada {
}

.datos-portada {
  height: 100vh;
}
.fondo-portada {
  background-image: url('../img/piscinaspunta-imagen-portada.jpg');
  background-size: cover;
  background-position: center center;
  height: 100vh;
}

.fondo-portada2 {
  background-image: url('../img/piscinaspunta-imagen-portada-mensajeenviado.jpg');
  background-size: cover;
  background-position: center center;
  height: 100vh;
}

.portada ul, .portada a {
  list-style:none;
  padding: 0;
  margin:0;
  text-decoration: none;
  color: var(--bs-body-color);
}

.portada .tt1 {
  font-size: 1.8rem;
  letter-spacing: 5px;
}

.datos1, .datos2, .datos3 {
  letter-spacing: 2px;
}


/*3 ACERCA DE*/
.acercade {
  padding-top: 100px;
}
.acercade a {
  text-decoration: none;
  color: black;
}
.item {
  margin-bottom: 30px;
  padding: 20px 15px;
}

.acercade h4 {
  letter-spacing: 0.5px;
}

.acerca-row2 {
  flex-direction: row;
  justify-content: space-around;
}

/*CATALOGO*/

.catalogo {
  margin-top: 150px;
}

.catalogo ul {
  list-style-type: none;
}

.catalogo .bullet {
  color: var(--dorado);
}

.catalogo-r1 {
  background-image: url('../img/piscinaspunta-imagen-catalogo.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 50vh;
}

.bg-catalogo {
  background-image: url('../img/piscinaspunta-catalogo-imagen.jpg');
  background-size:contain;
  background-position:center;
  background-repeat: no-repeat;
}

.catalogo-r2 {

}

.catalogo a {
  color: white;
  text-decoration: none;
  font-size: 13px;
  background-color: var(--celeste);
  padding: 6px 15px;
}

.catalogo a:hover {
  background-color: var(--dorado);
}

.helpbaby {
  background-color: black;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 800px;
}
.hb-info {
  background-color:#F9F9F9;
  min-height: 400px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  
}
.hb-img {
  background-image: url('../img/piscinaspunta-imagen-helpbaby.jpg');
  min-height: 200px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.helpbaby a {
  text-decoration: none;
  background-color: var(--gris);
  padding: 7px 10px;
  color: #272727;
}

.helpbaby a:hover {
  background-color: var(--dorado);
  transition: ease-in-out 200ms;
  color: white;
}

/*5 MAS SOLUCIONES*/

.massoluciones {

}

.contacto {
  background-color: black;
  margin-top: 150px;
  padding: 100px 0;
}

.contacto > .h1-section {
  margin-bottom: 50px;
}

.contacto-item {
  margin-bottom: 25px;
  padding: 20px 20px 0 20px;
  display: flex;
  flex-direction: column;
  justify-content: start;
}

.contacto-item img {
  margin-bottom: 60px;
}

.btn-negro {
  display: block;
  background-color: black;
  color: white;
  text-decoration: none;
  text-align: left;
  font-size: 15px;
  margin-top: 10px;
  padding: 5px;
}

.btn-negro:hover {
  background-color: var(--dorado);
  color: black;
}

.formulario {
  padding: 50px 0;
}

#form1 input {
  background-color: black;
  font-size: 16px;
  color: var(--gris);
  padding: 10px 10px;
  border: 0.5px solid rgb(29, 29, 29);
}

#form1 input:focus {
  background-color: var(--dorado);
  color: black;
  padding: 10px 10px;
  border: 0.5px solid var(--dorado);
  outline: none;
}

#form1 [value^="Enviar"]{
  background-color: var(--celeste);
}

#form1 [value^="Enviar"]:hover {
  background-color: white;
  color: var(--dorado);
}

.f-inputs {
  text-align: right;
}

.h3-blanco, .p-blanco {
  color: white;
}

.divisor {
  border-top: 0.5px solid var(--gris);
  border-bottom: 0.5px solid var(--gris);;
}

.divisor ul{
list-style-type: none;
padding-left: 1rem;
}

.divisor a {
  text-decoration: none;
  color: rgb(93, 93, 93);
}

.sello {
  color: var(--gris);
  font-size: 14px;
  
}
.sello span > a {
  text-decoration: none;
  color: rgb(185, 185, 185);
}



/*Estilo para el ancho de 576 en adelante*/
@media (max-width:576px) {
.datos-portada {
  height: 650px;
  margin-top: 30px;
  }
}
   


/*Estilo para el ancho de 992 en adelante col-lg*/
@media (min-width:992px) {
  .portada {
    height: 100vh;
  }

  .acercade {
    padding-top: 150px;
    height: 80vh;
  }
  .acerca-row2 {
    flex-direction: row;
    justify-content: space-around;
  }
  .catalogo {
    height: 100vh;
  }
  .catalogo-r1, .catalogo-r2 {
    height: 100vh;
  }
  .c-r2-info {
    height: 50%;
    display: flex;
    flex-direction: column;
    justify-content:space-between;
  }


  .contacto-item {
    border-right: 1px solid black;
    justify-content: space-between;
  }

  .f1-colizq {
    padding: 20px 0;
  }
    
}

@media (min-width: 1100px) {

}