/*
Theme Name: EL_GLOWLAB_1
Theme URI: https://evalunaglowlab.com/
Author: luca monaco
Author URI: https://olmo900.com
Description: 
Version: 1.0
Requires at least: 1.0
Tested up to: 1.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: EL_GLOWLAB_1
*/

/* ! Reset */
/* ----------------------------------------------------------------------------------- */
body,
html {
  font-size: 16px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
    "Helvetica Neue", Arial, sans-serif;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
*,
*:before,
*:after {
  box-sizing: border-box;
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
ol,
ul {
  margin: 0;
  padding: 0;
}
ol,
ul {
  list-style-position: inside;
  font-size: 1.1rem;
}
img {
  height: auto;
}
a {
  text-decoration: none;
}
hr {
  border: none;
  border-bottom: 1px solid #ddd;
}
a {
  text-decoration: none;
  color: coral;
}
p {
  line-height: 1.3;
}

.spacer {
  height: 170px;
}
.spacer-2 {
  height: 100px;
}
.spacer-3 {
  height: 50px;
}

/* ! Title System */
/* ----------------------------------------------------------------------------------- */
.text-0 {
  font-size: 5rem;
  line-height: 1;
}
h1,
.text-1 {
  font-size: 3.4rem;
}
h2,
.text-2 {
  font-size: 2.2rem;
}
h3,
.text-3 {
  font-size: 1.5rem;
}
h4,
p,
.text-4 {
  font-size: 1rem;
}

h1,
h2,
h3,
h4,
p,
ol,
ul {
  margin-bottom: 1rem;
}

@media (max-width: 768px) {
  .text-0 {
    font-size: 4rem;
  }
}

/* ! Button system */
/* ----------------------------------------------------------------------------------- */
.button,
.wp-block-button__link {
  font-size: 1.2rem;
  text-transform: uppercase;
  /* font-weight: bold; */
  background: #40eb07;
  color: #fff;
  padding: 14px 25px;
  display: inline-block;
  border-radius: 4px;
}
.button:hover,
.wp-block-button__link:hover {
  background: #000;
}

/* .button--small{  padding: 10px 20px;font-size: 1rem;}
.button--round{background: #fff; color:#000; padding: 15px 30px; border-radius: 100px; font-weight: bold;}
.button--round:hover{background: #000; color:#fff;}
.button--round-outline{background: transparent; color:#fff; padding: 15px 30px; border-radius: 100px; font-weight: bold;border: 1px solid #fff}
.button--round-outline:hover{background: #fff; color:#000;} */

/* ! Grid System */
/*----------------------------------------------------------------------------------- */

.grid {
  display: flex;
  flex-wrap: wrap;
  max-width: 1250px;
  margin: 0 auto;
}
.grid--small {
  max-width: 900px;
}
.grid--center {
  justify-content: center;
}
.grid--full {
  max-width: 100%;
}

.col-20 {
  width: 20%;
}
.col-25 {
  width: 25%;
}
.col-30 {
  width: 30%;
}
.col-33 {
  width: 33.33%;
}
.col-40 {
  width: 40%;
}
.col-50 {
  width: 50%;
}
.col-60 {
  width: 60%;
}
.col-70 {
  width: 70%;
}
.col-80 {
  width: 80%;
}
.col-90 {
  width: 90%;
}
.col-100 {
  width: 100%;
}

[class*="col-"] {
  padding: 10px;
}

.grid--full [class*="col-"],
.grid .grid [class*="col-"] {
  padding: 0;
}

@media (max-width: 768px) {
  [class*="col-"] {
    width: 100%;
  }
  .sma-33 {
    width: 33.33%;
  }
  .sma-50 {
    width: 50%;
  }
  .sma-25 {
    width: 25%;
  }
}

/* ! Helpers */
/*----------------------------------------------------------------------------------- */

.br {
  border: 1px solid red;
}
.img-res {
  width: 100%;
}
.video-res {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.video-res video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.overflow {
  overflow: hidden;
}

.mt-0 {
  margin-top: 0;
}
.mt-1 {
  margin-top: 1rem;
}
.mt-2 {
  margin-top: 2rem;
}
.mt-3 {
  margin-top: 3rem;
}
.mt-4 {
  margin-top: 4rem;
}

.mb-0 {
  margin-bottom: 0;
}
.mb-1 {
  margin-bottom: 1rem;
}
.mb-2 {
  margin-bottom: 2rem;
}
.mb-3 {
  margin-bottom: 3rem;
}
.mb-4 {
  margin-bottom: 4rem;
}

.text-center {
  text-align: center;
}
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}

.p-0 {
  padding: 0;
}
.p-1 {
  padding: 1rem;
}
.p-2 {
  padding: 2rem;
}
.p-3 {
  padding: 3rem;
}
.p-4 {
  padding: 4rem;
}

.pt-0 {
  padding-top: 0;
}
.pt-1 {
  padding-top: 1rem;
}
.pt-2 {
  padding-top: 2rem;
}
.pt-3 {
  padding-top: 3rem;
}
.pt-4 {
  padding-top: 4rem;
}

.pb-0 {
  padding-bottom: 0;
}
.pb-1 {
  padding-bottom: 1rem;
}
.pb-2 {
  padding-bottom: 2rem;
}
.pb-3 {
  padding-bottom: 3rem;
}
.pb-4 {
  padding-bottom: 4rem;
}

.icon-small {
  width: 40px;
  padding: 8px;
}
.icon-white {
  filter: invert(1);
}
.bg-dark {
  background: #000;
}
.text-white {
  color: #fff;
}
.text-dark {
  color: #4b0082;
}
.text-link {
  color: #a07ff5;
}
.text-link-light {
  color: #e9e9ff;
}
.v-center {
  display: flex;
  justify-content: center;
  flex-flow: column;
  align-items: flex-start;
}

.font-normal {
  font-weight: 400;
}

.none {
  display: none;
}
@media (max-width: 768px) {
  .sma-none {
    display: none;
  }
}

@media (min-width: 768px) {
  .desktop-none {
    display: none;
  }
}

/* ! Wordpress Styles */
/*----------------------------------------------------------------------------------- */

input,
textarea {
  border: 3px solid #ddd;
  border-radius: 3px;
  padding: 10px;
}
input[type="submit"],
button {
  border: 3px solid #ddd;
  background: #e5dad4;
  border-radius: 3px;
  padding: 10px;
}

.form-search {
  width: 100%;
  border: 1px solid #ddd;
  border-radius: 100px;
  padding-left: 15px;
}
.form-search input {
  width: calc(100% - 40px);
  border: none;
  background: #f5f3fc;
  color: oklch(0.75 0.14 291.8785);
}
.form-search button {
  padding: 0;
  background: transparent;
  border: none;
}
.form-search img {
  width: 26px;
  margin-bottom: -10px;
}

input:focus,
textarea:focus {
  outline-color: oklch(0.75 0.14 291.8785);
  outline-style: solid;
  outline-width: 2px;
  outline-offset: 2px;
}

input::placeholder,
textarea::placeholder {
  color: oklch(0.75 0.14 291.8785);
  opacity: 1; /* ensure full opacity */
}

.alignfull {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}
.alignwide {
  width: 90vw;
  margin-left: calc(50% - 45vw);
}
