/*
Theme Name: Jesús del Cerro
Author: SBdsigner
Author URI: https://sbdsigner.com/
Version: 1.0
Text Domain: jesusdelcerro
*/

/* main template */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* Prevent iOS text size adjust after orientation change, without disabling user zoom. */
html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  scroll-behavior: smooth;
  /*scroll-padding-top: 100px;*/
  scroll-padding-top: var(--scroll-padding, 100px); }

/* make sure to set some focus styles for accessibility 
   Improve readability when focused and also mouse hovered in all browsers. */
:focus, a:active, a:hover, a:focus { outline: 0; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-results-button, input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  -moz-appearance: none; }

input[type=search] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box; }

/* Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */
audio, canvas, video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  max-width: 100%; }

/* Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) {
  display: none;
  height: 0; }

/* Address styling not present in IE 7/8/9, Firefox 3, and Safari 4. Known issue: no IE 6 support. */
[hidden] { display: none; }

/* 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
   2. Improve image quality when scaled in IE 7. */
img {
  width: 100%;
  height: auto;
  vertical-align: middle;
  border: 0; /* 1 */
  -ms-interpolation-mode: bicubic; /* 2 */ }

/* 1. Correct text not wrapping in Firefox 3.
   2. Correct alignment displayed oddly in IE 6/7. */
legend {
  white-space: normal; /* 1 */
  *margin-left: -7px; /* 2 */ }

/* 1. Correct font size not being inherited in all browsers.
   2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5 and Chrome.
   3. Improve appearance and consistency in all browsers. */
button, input, select, textarea {
  font-size: 100%; /* 1 */
  margin: 0; /* 2 */
  vertical-align: baseline; /* 3 */
  *vertical-align: middle; /* 3 */ }

/* Address Firefox 3+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
button, input { line-height: normal; }

/* Address inconsistent `text-transform` inheritance for `button` and `select`.
   All other form control elements do not inherit `text-transform` values.
   Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
   Correct `select` style inheritance in Firefox 4+ and Opera. */
button, select { text-transform: none; }

/* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.
   2. Correct inability to style clickable `input` types in iOS.
   3. Improve usability and consistency of cursor style between image-type `input` and others.
   4. Remove inner spacing in IE 7 without affecting normal text inputs. Known issue: inner spacing remains in IE 6. */
button, html input[type="button"], input[type="reset"], input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
  *overflow: visible; /* 4 */ }

/* Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/* 1. Address box sizing set to content-box in IE 8/9.
   2. Remove excess padding in IE 8/9.
   3. Remove excess padding in IE 7. Known issue: excess padding remains in IE 6. */
input[type="checkbox"], input[type="radio"] {
  margin-right: 5px;
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
  *height: 13px; /* 3 */
  *width: 13px; /* 3 */ }

/* 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
   2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome (include `-moz` to future-proof). */
input[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; /* 2 */
  box-sizing: content-box; }

/* Remove inner padding and search cancel button in Safari 5 and Chrome on OS X. */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/* Remove inner padding and border in Firefox 3+. */
button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/* 1. Remove default vertical scrollbar in IE 6/7/8/9.
   2. Improve readability and alignment in all browsers. */
textarea {
  overflow: auto; /* 1 */
  vertical-align: top; /* 2 */
  resize: vertical; }

fieldset {
  border: 0;
  margin: 0;
  padding: 0; }

em, i { font-style: italic; }



/*------------------EDIT------------------*/

/* FONTS */
@font-face {
  font-family: 'DM-Mono';
  src: url('./assets/fonts/DMMono-Light.ttf') format('truetype');
  font-weight: 200;
  font-style: normal; }
@font-face {
  font-family: 'DM-Mono';
  src: url('./assets/fonts/DMMono-LightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic; }
@font-face {
  font-family: 'DM-Mono';
  src: url('./assets/fonts/DMMono-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'DM-Mono';
  src: url('./assets/fonts/DMMono-Italic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic; }
@font-face {
  font-family: 'DM-Mono';
  src: url('./assets/fonts/DMMono-Medium.ttf') format('truetype');
  font-weight: bold;
  font-style: normal; }
  @font-face {
  font-family: 'DM-Mono';
  src: url('./assets/fonts/DMMono-MediumItalic.ttf') format('truetype');
  font-weight: bold;
  font-style: italic; }


/*///////EDIT COLOURS & FONTS///////*/
:root {
  --color-blanco: #ffffff;
  --color-negro: #1C1C22;
  --color-secundario: #3583fb;
  --color-secundario-claro: #3583fb3d;
  --color-gris: #f1f2f8;
  --color-gris2: #E2E0DB;
  --color-verde: #15baa7;
  --color-verde-claro: #15baa721;
  --color-rojo: #E3343F;
  --color-rojo-claro: #fee0e2;
  --tipo-texto: 'DM-Mono';
  --transition-all: all 0.6s ease !important; }

html, button, input, select, textarea {
  font-family: var(--tipo-texto);
  color: var(--color-azul); }

option, select * { font-family: var(--tipo-texto); }

::-moz-selection, ::selection {
  text-shadow: none;
  background: white; }

.chromeframe {
  margin: 0.2em 0;
  padding: 0.2em 0;
  background: white;
  color: var(--color-azul); }


/*///////EDIT MEDIAS///////*/
body {
  font-size: 16px;
  line-height: 160%;
  font-weight: 100; }

strong, b { font-weight: bold; }

p { margin-bottom: 20px; }
p:last-child { margin-bottom: 0px; }

a, button, input[type="submit"] {
  display: inline-block;
  text-decoration: none;
  -webkit-transition: var(--transition-all);
  -moz-transition: var(--transition-all);
  -ms-transition: var(--transition-all);
  -o-transition: var(--transition-all);
  transition: var(--transition-all); }

input, select, textarea {
  border: none;
  padding: 0 0 5px;
  width: 100%; }
input, textarea {
  border-bottom: 1px solid var(--color-negro);
  background-color: transparent; }
input::placeholder, textarea::placeholder {
  font-family: var(--tipo-texto);
  color: var(--color-negro);
  opacity: 1; }

.overflow-hidden { overflow: hidden; }

.textAlign-left { text-align: left; }
.textAlign-center { text-align: center; }
.textAlign-right { text-align: right; }
.textAlign-justify { text-align: justify; }
.textDecoration-underline { text-decoration: underline; }
.textTransform-uppercase { text-transform: uppercase; }
.textTransform-capitalize { text-transform: capitalize; }
.verticalAlign-textTop {vertical-align: text-top; }

.margin { margin: 0; }
.padding { padding: 0; }

.clear { clear: both; }

.z-index { z-index: 9999; }
.z-index-1 { z-index: 1; }
.z-index--1 { z-index: -1; }

.position-relative { position: relative; }
.position-absolute { position: absolute; }
.position-fixed { position: fixed; }

.top { top: 0; }
.left { left: 0; }
.right { right: 0; }
.bottom { bottom: 0; }

.float-left { float: left; }
.float-right { float: right; }

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

.fontWeight-bold { font-weight: bold; }

.listStyle-none { list-style: none; }
.listStyle-lowerAlpha { list-style: lower-alpha; }
.listStyle-disc { list-style: disc; }

.background-none { background: none; }
.backgroundPosition-center { background-position: center; }
.backgroundRepeat-none { background-repeat: no-repeat; }
.backgroundSize-cover { background-size: cover; }
.backgroundSize-contain { background-size: contain; }

.borderRadius-3 { border-radius: 3px; }
.borderRadius-5 { border-radius: 5px; }
.borderRadius-10 { border-radius: 10px; }
.borderRadius-15 { border-radius: 15px; }
.borderRadius-40 { border-radius: 40px; }
.border-none { border: none; }
.borderWidth-05 { border-width: 0.5px; }
.borderWidth-1 { border-width: 1px; }
.borderStyle-solid { border-style: solid; }

.display-inlineBlock { display: inline-block; }
.display-inline { display: inline; }
.display-block { display: block; }
.display-flex { display: flex; }
.display-grid { display: grid; }
.display-none { display: none; }

.gridTemplateColumns-2-1 { grid-template-columns: repeat(2, 1fr); }
.gridTemplateColumns-2-auto { grid-template-columns: repeat(2, auto); }
.gridTemplateColumns-2-1_2 { grid-template-columns: 1fr 2fr; }
.gridTemplateColumns-2-1_5 { grid-template-columns: 1fr 5fr; }
.gridTemplateColumns-2-2_1 { grid-template-columns: 2fr 1fr; }
.gridTemplateColumns-2-3_1 { grid-template-columns: 3fr 1fr; }
.gridTemplateColumns-3-1_2_1 { grid-template-columns: 1fr 2fr 1fr; }
.gridTemplateColumns-3-1 { grid-template-columns: repeat(3, 1fr); }
.gridTemplateColumns-4-1 { grid-template-columns: repeat(4, 1fr); }
.gridTemplateColumns-4-auto { grid-template-columns: repeat(4, auto); }
.gridTemplateColumns-6-1 { grid-template-columns: repeat(6, 1fr); }
.gridTemplateColumns-6-auto { grid-template-columns: repeat(6, auto); }
.flex-1-0-0 { flex: 1 0 0; }
.flexDirection-column { flex-direction: column; }
.flexWrap-wrap { flex-wrap: wrap; }
.gridGap-5 { grid-gap: 5px; }
.gridGap-10 { grid-gap: 10px; }
.gridGap-15 { grid-gap: 15px; }
.gridGap-20 { grid-gap: 20px; }
.gridGap-30 { grid-gap: 30px; }
.gridGap-40 { grid-gap: 40px; }
.gridGap-60 { grid-gap: 60px; }
.gridGap-80 { grid-gap: 80px; }
.gridRowGap-60 { grid-row-gap: 60px; }
.justifyContent-stretch { justify-content: stretch; }
.justifyContent-center { justify-content: center; }
.justifyContent-end { justify-content: end; }
.justifyContent-spaceBetween { justify-content: space-between; }
.justifyContent-spaceAround { justify-content: space-around; }
.justifyContent-spaceEvenly { justify-content: space-evenly; }
.justifyItems-end { justify-items: end; }
.alignContent-center { align-content: center; }
.alignContent-baseline { align-content: baseline; }
.alignContent-stretch { align-content: stretch; }
.alignSelf-end { align-self: end; }
.alignSelf-center { align-self: center; }
.alignSelf-stretch { align-self: stretch; }
.alignItems-center { align-items: center; }
.alignItems-flexStart { align-items: flex-start; }
.alignItems-flexEnd { align-items: flex-end; }
.alignItems-end { align-items: end; }


  /*responsive*/
  @media (max-width: 991px) and (min-width: 783px) {
    .gridGap-20 { grid-gap: 10px; }
  }
  @media (max-width: 991px) and (min-width: 501px) {
    .gridGap-80 { grid-gap: 20px; }
    .gridRowGap-60 { grid-row-gap: 20px; }
  }
  @media (max-width: 540px) {
    p { margin-bottom: 15px; }
  }


.transition {
  -webkit-transition: var(--transition-all);
  -moz-transition: var(--transition-all);
  -ms-transition: var(--transition-all);
  -o-transition: var(--transition-all);
  transition: var(--transition-all); }
  
.fontFamily-text { font-family: var(--tipo-texto); }

.color-white { color: var(--color-blanco); }
.color-black { color: var(--color-negro); }
.color-secundary { color: var(--color-secundario); }
.color-green { color: var(--color-verde); }
.color-grey { color: var(--color-gris); }
.color-grey2 { color: var(--color-gris2); }
.color-red { color: var(--color-rojo); }

.backgroundColor-transparent { background-color: transparent; }
.backgroundColor-white { background-color: var(--color-blanco); }
.backgroundColor-black { background-color: var(--color-negro); }
.backgroundColor-secundary { background-color: var(--color-secundario); }
.backgroundColor-green { background-color: var(--color-verde); }
.backgroundColor-grey { background-color: var(--color-gris); }
.backgroundColor-grey2 { background-color: var(--color-gris2); }
.backgroundColor-red { background-color: var(--color-rojo); }