/*
Theme Name: Olurean
Theme URI: https://olurean.com/
Description: Theme premium exclusive for Olurean
Version: 1.0
Author: Raúl Anampa
Author URI: http://alayers.com/
Tags: blue, custom header, fixed width, two columns, widgets
*/

@import url("css/branding.css");
@import url("css/header.css");
@import url("css/footer.css");
@import url("css/forms.css");
@import url("css/msgs.css");
@import url("css/index.css");
@import url("css/camara.css");
@import url("css/empresa.css");
@import url("css/preguntas.css");
@import url("css/contacto.css");
@import url("css/grpd.css");
@import url("css/tienda.css");
@import url("css/custom.css");

* {
  box-sizing: border-box;
  margin-block-end: 0;
  margin-block-start: 0;
  margin-inline-end: 0;
  margin-inline-start: 0;
  margin: 0;
  padding-block-end: 0;
  padding-block-start: 0;
  padding-inline-end: 0;
  padding-inline-start: 0;
  padding: 0;
  text-decoration: none;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

body,
option,
input,
textarea {
  font-family: var(--font-book);
}

body img {
  display: block;
}

svg {
  transition: all 0.5s ease;
}

.contenedor {
  width: 100%;
  position: relative;
}

/* BOTON */
.btn-standard {
  width: 140px;
  text-align: center;
}
@media (min-width: 600px) {
  .btn-standard {
    width: 170px;
  }
}

/* CAMARA OLUREAN */
/* generales */
.banner-info {
  width: 90%;
  height: auto;
  position: absolute;
  display: flex;
  flex-wrap: wrap;
}

/* info */
.banner-info-titulo {
  width: 100%;
  text-align: center;
}
.banner-info-titulo h1 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: baseline;
}
.banner-info-titulo h1 svg {
  height: 24px;
  margin: 0px 0px 0px 12px;
}

/* items */
.banner-info-items {
  width: 100%;
  text-align: center;
  margin: 30px 0px;
}
.banner-info-items ul li {
  display: inline-block;
}
.bola-margin {
  margin: 0px 8px;
}

/* botones */
.banner-info-botones {
  width: 100%;
  display: flex;
  justify-content: center;
}
.banner-info-botones a {
  margin: 0px 8px;
}

@media (min-width: 600px) {
  .banner-info-titulo h1 svg {
    height: 34px;
    margin: 0px 0px 0px 16px;
  }
  .banner-info-items {
    margin: 40px 0px;
  }
  .bola-margin {
    margin: 0px 24px;
  }
}
@media (min-width: 1450px) {
  .banner-info {
    width: 1300px;
  }
}

/* DESPLEGABLES */

#acordeon {
  width: 100%;
}
#acordeon .activar #acordeon-titulo .des-mas {
  display: none;
}
#acordeon .activar #acordeon-titulo .des-menos {
  display: flex;
}
.des-mas {
  display: flex;
}
.des-menos {
  display: none;
}
.icono-desplegar {
  position: absolute;
  right: 8px;
  transition: all 0.5s ease;
}

#acordeon-item {
  width: 100%;
  margin-bottom: 2px;
  display: flex;
  flex-wrap: wrap;
  padding: 12px 0px;
  border-bottom: 1px solid var(--color-border-black);
  cursor: pointer;
}
#acordeon-titulo {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
#item-titulo {
  padding-right: 30px;
}

#acordeon-item ul {
  display: none;
}
#acordeon-item ul li {
  list-style: none;
}
#texto-desplegado {
  width: 100%;
}
#texto-desplegado p {
  padding: 8px 0px;
}

@media (min-width: 950px) {
  #acordeon {
    display: none;
  }
}

/* SOCIAL */

.contact-social {
  width: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.social {
  width: 35px;
  height: 35px;
  margin: 0px 16px;
  border-radius: 50%;
  background-color: var(--color-white);
  display: flex;
  justify-content: center;
  align-items: center;
}
.social2 {
  width: 35px;
  height: 35px;
  margin: 0px 16px;
  border-radius: 50%;
  background-color: var(--color-dark-white);
  display: flex;
  justify-content: center;
  align-items: center;
}
.social a,
.social2 a {
  display: flex;
}
.social a svg,
.social2 a svg {
  width: 20px;
  min-width: 20px;
  height: 20px;
  fill: var(--color-dark-gray);
}
.social a:hover svg,
.social2 a:hover svg {
  fill: var(--color-black);
}
