* {
  margin: 0;
  padding: 0;
  outline: 0;
  box-sizing: border-box;
  text-decoration: none;
}

:root {
  --facebook: #3b5999;
  --whatsapp: #25d366;
  --azul: #150e56;
  --titulo-b: #262058;
  --guindo: #7b113a;
  --celeste: #1597bb;
  --aqua: #a8d3f7;
  --txt-b: #1e272e;
  --txt-p: #444974;
  --txt-w: #ffffff;
  --txt-g: #d08e39;
}

h1 {
  font-family: 'Merriweather Sans', sans-serif;
  font-size: 2.4rem;
  color: var(--titulo-b);
  letter-spacing: 2px;
}

h2 {
  font-family: 'Merriweather Sans', sans-serif;
  font-size: 2.2rem;
  color: var(--titulo-b);
  letter-spacing: 1px;
}

h3 {
  font-family: 'Merriweather Sans', sans-serif;
  font-size: 1.3rem;
  color: var(--titulo-b);
  letter-spacing: 1px;
}

h4 {
  font-family: 'Merriweather Sans', sans-serif;
  font-size: 1rem;
}

p {
  font-family: 'Lato', sans-serif;
  font-size: 1.1rem;
  color: var(--txt-p);
  letter-spacing: 1px;
}

span {
  font-family: 'Merriweather Sans', sans-serif;
  font-size: 1.3rem;
  color: var(--titulo-b);
}

.slider__link {
  width: 15vw;
  height: 8vh;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--celeste);
  color: var(--azul);
  transition: .3s all ease-out;
  font-family: 'Lato', sans-serif;
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
}

.slider__link:hover {
  color: var(--celeste);
  background-color: var(--guindo);
}

.linea {
  width: 100%;
  height: 1px;
  border: none;
  background-color: var(--aqua);
}

/***** Header - Renovacion de pagina *****************/
.cabecera {
  width: 100%;
  height: 100vh;
  position: relative;
}
.cabecera2 {
  width: 100%;
  height: 18vh;
  position: relative;
}


/************* Carrusel ****************************/

      .capa__head {
        width: 100%;
        height: 82vh;
        background:#000000;
        opacity: 58%;
        position: absolute;
        top: 18vh;
        z-index: 500;
      }

      .portada__slider {
        width: 100%;
        height: 82vh;
        overflow: hidden;
        position: relative;
        top: 18vh;
      }



            /**** Lineas de SLIDER que se omitio en ultimo cambio (150 a) */
            .slider {
              width: 300%;
              display: flex;
              height: 100%;
              margin-left: -100%;
            }

            .slider__cabecera {
              width: 100%;
              height: auto;
              position: relative;
            }

            .slider__img {
              display: block;
              width: 100%;
              height: 100%;
              object-fit: cover;
            }

            .conten__slider {
              display: none;
              /* width: 50%;
                          height: 45vh;
                          display: flex;
                          flex-direction: column;
                          justify-content: space-between;
                          color: rgb(252, 252, 252);
                          font-size: 20px;
                          position: absolute;
                          top: 32%;
                          left: 8%;
                          z-index: 750; */
            }

            .conten__slider h2 {
              font-size: 3rem;
              color: var(--txt-w);
            }

            .conten__slider p {
              color: var(--txt-w);
              text-align: left;
            }

            /**** Lineas de SLIDER que se omitio en ultimo cambio (151 a 191)*/
            .slider__btn {
              position: absolute;
              width: 40px;
              height: 40px;
              border-radius: 50%;
              background: rgba(219, 228, 231, 0.6);
              top: 50%;
              transform: translateY(-50%);
              font-size: 35px;
              font-weight: bold;
              display: flex;
              justify-content: center;
              align-items: center;
              cursor: pointer;
              z-index: 1000;
              color: var(--txt-p);
            }

            .slider__btn:hover {
              background: #fff;
            }

            .slider__btn__left {
              left: 10px;
            }

            .slider__btn__right {
              right: 10px;
            }





.contenido__cabecera{
  width: 100%;
  height: 18vh;
  padding: 0 10vw;
  position:absolute;
  top: 0px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-wrap: wrap;
  z-index: 750;
  transition: .3s all ease-out;
}




      .checkbtn{
        display: none;
      }
      #check{
        display: none;
      }
      .menu_mobile{
        display: none;
      }

      .logo {
        width: 38%;
        height: 16vh;
        padding-left: 3%;
        display: flex;
        justify-content: flex-start;
        align-items: center;
      }
            .logo img{
              height: 95%;
              width: 100%;
              object-fit: contain;
            }

.menu {
  width: 55%;
  height: 100%;
  display: flex;
}

.menu .menu__horizontal li ul li a{
  color: var(--titulo-b);
}

.menu .menu__horizontal li .menu__vertical li a{
  color: var(--titulo-b);
}


.menu__horizontal {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  list-style: none;
}

.menu ul li {
  width: auto;
  font-family: 'Lato', sans-serif;
  font-size: 1rem;
  font-weight: bold;
}

.menu__horizontal li a {
  list-style: none;
  display: block;
  text-decoration: none;
  font-family: 'Lato', sans-serif;
  font-size: 1rem;
  font-weight: bold;
  color: var(--titulo-b);
}

.menu__vertical {
  position: absolute;
  display: none;
  list-style: none;
  color: var(--titulo-b);
}

.menu__vertical li a {
  list-style: none;
  text-decoration: none;
  margin-left: 1em;
  font-size: .9rem;
  color: var(--titulo-b)
}

.menu__horizontal li:hover .menu__vertical {
  display: block;
}

.menu__vertical li a:hover {
  color: rgb(208, 142, 57);
  font-weight: bold;
}

.menu ul li a.selected, a:active {
  color: rgb(208, 142, 57);
  transition: 0.6s;
}



/**************************** Cintilla ***************************/
.cintilla {
  width: 100%;
  height: auto;
  margin: 15vh 0;
  display: flex;
  justify-content: center;
}

.texto__presentacion {
  width: auto;
  height: auto;
}

.texto__presentacion span {
  text-align: center;
  font-size: 2.5rem;
}

.texto__presentacion span em {
  font-size: 3.2rem;
}

/************************* SERVICIOS ************************/



.inicio__down {
  width: 100%;
  height: auto;
}

.capa__down {
  width: 100%;
  height: 160vh;
  background: rgba(30, 39, 46, 0.55);
  position: absolute;
  z-index: 500;
}

.down__img {
  width: 100%;
  height: 160vh;
}

.down__img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}




footer {
  width: 100%;
  height: auto;
  background-color: rgb(0, 0, 0);
}

.contenido__footer {
  width: 100%;
  height: auto;
  padding: 2em 6em;
  display: flex;
  justify-content: space-between;
}

.contenido__footer div h2 {
  font-family: 'Lato', sans-serif;
  font-size: 1rem;
  color: var(--txt-w);
  margin-top: 1em;
}

.contenido__footer div pre {
  font-family: 'Lato', sans-serif;
  font-size: 1rem;
  font-weight: bold;
  color: var(--txt-w);
  letter-spacing: 1px;
  margin-top: 1em;
}

.footer__informacion {
  width: 50%;
  height: 100%;
}

.footer__complementario {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.footer__complementario h2 {
  width: 45%;
  text-decoration: underline;
}

.firma {
  width: 100%;
  height: auto;
  padding: 1em;
  text-align: center;
  color: #fff;
}

.firma h4 {
  font-size: 80%;
  color: var(--txt-w);
}

/******************************** NOSOTROS *******************************/
/******************************** NOSOTROS *******************************/
/******************************** NOSOTROS *******************************/
/**************************** HISTORIA ****************************/
.historia {
  width: 100%;
  height: auto;
  margin: 15vh 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.historia p {
  width: 65%;
  height: auto;
  text-align: center;
  margin-top: 4vh;
  margin-bottom: 3vh;
}

.img__historia {
  width: 33%;
  height: auto;
  margin-top: 5vh;
}

.img__historia img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media screen and (width:1280px) and (height:800px) and (orientation:landscape) {
  .historia {}
}

/**************************** DEPARTMENT ****************************/
.mision {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  justify-content: center;
}

      .eq__departamento {
        width: 80%;
        height: auto;
        margin-bottom: 10vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
      }
            .mision__parrafo{
              width: 75%;
              margin-top: 10vh;
              text-align: justify;
            }

            .img__departamento {
              width: 80%;
              height: 60vh;
              margin: 10vh 0 7vh 0;
              border-radius: 8px;
            }

            .img__departamento img {
              width: 100%;
              height: 100%;
              object-fit:  cover;
              border-radius: 8px;
            }

      .box__eq {
        width: 80%;
        margin-top: 3vh;
      }

            .box__eq h3 {
              margin-bottom: 2vh;
              color: var(--titulo-b);
            }

            .box__eq p {
              text-align: left;
            }

            .box__eq ul {
              margin-left: 5%;
              color: var(--azul);
            }



/************************* filosofia ***************************/
.filosofia {
  width: 100%;
  height: auto;
  margin-top: 10vh;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.intro__filosofia {
  width: 100%;
  height: auto;
  margin-top: 3em;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.intro__filosofia span {
  width: 65%;
  font-family: 'Lato', sans-serif;
  font-size: 1.2rem;
  color: rgb(68, 73, 116);
  text-align: center;
}

.img__filosofia {
  margin-top: 3em;
  width: 45%;
  height: auto;
  border-radius: 8px;
}

.img__filosofia img {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  object-fit: cover;
}

.filosofia__txt {
  width: 70%;
  height: auto;
  margin: 10vh 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.box__filosofia {
  margin-bottom: 3vh;
  width:100%;
}

.box__filosofia h3 {
  color: rgb(208, 142, 57);
  font-size: 1.8rem;
}

.box__filosofia p {
  text-align: left;
  margin-top: 2vh;
}

.box__filosofia hr {
  margin-top: 2vh;
}

@media screen and (width:1280px) and (height:800px) and (orientation:landscape) {
  .razones {}
}

/**************************** SERVICIOS *****************************/
/**************************** SERVICIOS *****************************/


.negocio__rdcial, .negocio__industrial {
  width: 100%;
  height: auto;
  margin: 10vh 0 15vh 0;
  display: flex;
  justify-content: center;
}

.residencial {
  width: 85%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.residencial h2 {
  width: 60%;
  text-align: center;
}

.residencial p {
  width: 55%;
  margin-top: 5vh;
  text-align: justify;
}

.residencial__pic {
  width: 100%;
  height: auto;
  margin-top: 7vh;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.img__rdcial {
  width: 45%;
  height: auto;
}

.img__rdcial img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.residencia, span {
  font-family: 'Merriweather Sans', sans-serif;
  font-size: .9rem;
  margin-top: 3vh;
}

.negocio__industrial {}

@media screen and (width:1280px) and (height:800px) and (orientation:landscape) {
  /* .img__fondo{
    opacity: 1;
  }
  .texto__portafolio{
    background-color: rgba(30, 39, 46, 0.55);
    cursor: pointer;
    border-radius: 10px;
    transition: all 500ms ease-out;
  }
  .texto__portafolio h3{
    color: var(--txt-w);
    transition: all 500ms ease-out;
  }
  .texto__portafolio p{
    color: var(--txt-w);
    transition: all 500ms ease-out;
  }
  .texto__portafolio img{
    display: block;
  } */
}

/******************************* CONTACTO ********************************/
/******************************* CONTACTO ********************************/
.map__cont {
  width: 100%;
  height: auto;
  padding: 15vh 10vw 10vh 10vw;
  display: flex;
}

.contacto__informacion {
  width: 55%;
  height: auto;
  padding: 5%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.contacto__informacion h2, h3 {
  font-family: 'Lato', sans-serif;
  font-size: 1.2rem;
  margin-top: .8em;
}

iframe {
  border-radius: 10px;
  box-shadow: 0px 5px 5px 3px rgba(0, 0, 0, 0.5);
}

.contacto {
  width: 100%;
  height: auto;
  padding: 0 0 10vh 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

      .tit_contacto{
        width: 76%;
        font-size: 1.6rem;
      }
            .tit_contacto h3{
              font-size: 1.5rem;
              color: var(--txt-g);
            }

      .formContact {
        width: 85%;
        height: 60vh;
        margin-top: 3vh;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
      }

      .infoUsuario {
        width: 90%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
      }

      .infoUsuario p {
        width: 100%;
        height: 12%;
        margin-bottom: 4vh;
        display: flex;
        justify-content: center;
      }

      .infoUsuario textarea {
        width: 100%;
        height: 200%;
        resize: none;
        border-width: 2px;
        border-color: rgb(182, 163, 223);
        border-radius: 5px;
      }

      .infoUsuario input {
        width: 100%;
        height: 100%;
        border-width: 2px;
        border-top-style: solid;
        border-color: rgb(182, 163, 223);
        border-radius: 5px;
      }

      .infoUsuario p input {
        padding-left: 5%;
        font-size: 1rem;
      }

      .infoUsuario p textarea {
        padding-left: 5%;
        font-size: 1rem;
        padding-top: 1vh;
      }

      form.formContact button {
        font-weight: 600;
        font-size: 18px;
        margin-top: 6vh;
        color: rgb(157, 126, 222);
        width: 45%;
        height: 100%;
        border-color: rgb(182, 163, 223);
        border-radius: 5px;
        cursor: pointer;
        transition: all 300ms ease-out;
      }

      form.formContact button:hover {
        transform: scale(1.1);
      }

/* #2e3c46 */