/*
Theme Name: Okab Child Theme
Theme URI:  https://themeforest.net/item/okab-responsive-multipurpose-wordpress-theme/16958600
Author: PixelDima
Author URI:   https://pixeldima.com/
Template: okab
Description: This is a blank child theme for Okab theme
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags: responsive-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-colors, flexible-header, full-width-template, post-formats, theme-options, featured-images,rtl-language-support,threaded-comments, translation-ready
Text Domain:  okab
*/

/*************
* VARIABLES *
***********/
:root {
  --fuenteTextos: 'Lato', Helvetica, Arial, sans-serif !important;
  --colorPrincipal: #ffc700 !important;
  /* Amarillo Facilsure */
  --colorTexto: #6f6e7d !important;
  /* Gris claro Facilsure */
  --colorTextoDestacadoFondoOscuro: #ffffff !important;
  --colorEnlace: #009ea5 !important;
  /* Verde turquesa del logo de Helvetia */
}

/********************
* ESTILOS GLOBALES *
******************/
html {
  scroll-behavior: smooth;
}

a {
  transition: all 1s;
}

ul.list-style li {
  margin-bottom: 2rem;
  line-height: 32px;
}

.flex-column {
  flex-direction: column;
}

.flex-justify-center {
  justify-content: center;
}

.flex-space-around {
  justify-content: space-around;
}

.widget .button,
[type='submit'],
.dima-button {
  font-family: var(--fuenteTextos) !important;
  letter-spacing: 1px;
}

/* Oculta reCAPTHA badge de Google */
.grecaptcha-badge {
  visibility: hidden;
}

/**************************************
* ESPACIADO VERTICAL ENTRE ELEMENTOS *
************************************/

/* 
 * Desplazamiento hacia abajo del contenido principal para tablet y móvil para
 * salvar la altura del header que está en position fixed (fuera del flujo)
 */
@media (max-width: 989px) {
  .dima-main {
    margin-top: 90px;
  }
}

/* Padding sup, inf y laterales para todas las secciones */
.page-section-content {
  padding: 60px 15px;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.ok-row .ok-row {
  margin-bottom: 0;
}

.no-padding-row .ok-row {
  margin-bottom: 0 !important;
}

@media only screen and (max-width: 768px) {
  div .ok-row {
    margin-bottom: 0 !important;
  }

  .ok-row .ok-row {
    margin-bottom: 40px;
  }

  .mobile-last-element {
    margin-bottom: 75px !important;
  }
}

/*********
* TEXTO *
*******/
html {
  font-size: 62.5% !important;
  /* 1rem = 10px */
}

body,
p {
  font-family: 'Lato', Helvetica, Arial, sans-serif !important;
  color: var(--colorTexto) !important;
  font-size: 2rem !important;
  line-height: 32px;
}

h2,
h3 {
  font-family: 'Lato', Helvetica, Arial, sans-serif !important;
  font-weight: 700;
  margin-bottom: 40px;
}

/* body.home h1,
body.home h2,
body.home h3 {
  line-height: 1;
  text-align: right;
} */

/* @media (min-width: 768px) {
  body.home h1,
  body.home h2,
  body.home h3 {
    position: relative;
    top: -10px;
  }
} */

@media (max-width: 768px) {
  body.home h1,
  body.home h2 {
    font-size: 3.5rem;
  }

  /* body.home h1,
  body.home h2,
  body.home h3 {
	text-align: center;
  } */

  body.home h3 {
    font-size: 2.7rem;
  }
}

/* @media (min-width: 768px) and (max-width: 989px) {
  body.home h1,
  body.home h2,
  body.home h3 {
	text-align: left;
  }
} */

h2,
h3,
strong {
  color: var(--colorTexto) !important;
}

strong {
  font-weight: 700;
}

strong.dark-bg {
  color: var(--colorTextoDestacadoFondoOscuro) !important;
}

small {
  font-size: 1.2rem;
}

a {
  font-weight: 700;
  color: var(--colorEnlace);
  transition: all 1s;
}

.dark-bg {
  color: #ffffffcc !important;
}

.palabra__colorDestacado {
  color: var(--colorPrincipal);
}

.post-content p {
  text-align: justify;
}

/* @media (min-width: 768px) {
  .text-left {
    text-align: left !important;
  }
} */

/* .text-end {
  text-align: center;
} */

/**********
* HEADER *
*********/
/* Menú de hamburguesa a la derecha */
#header .dima-btn-nav {
  float: right;
  border: 0;
  margin-top: 21px;
  padding-right: 0;
  color: var(--colorPrimario);
}

.dima-navbar-wrap.desk-nav.fixed nav .dima-nav > li {
  line-height: 65px;
}

/* Enlaces alineados a la derecha en móvil */
.mobile-nav.dima-navbar-wrap .dima-navbar nav .dima-nav > li > a {
  text-align: right;
  font-size: 1.8rem;
}

/**********
* SLIDER *
*********/

/* Overlay con filtros */
.inkwell {
  filter: sepia(0.3) contrast(1.1) brightness(0.8) grayscale(1);
}

/***************************
* SECCIÓN - QUIÉNES SOMOS *
*************************/

/*
 * ENCABEZADO
 *************/
/* @media (max-width: 989px) and (min-width: 768px) {
  #inicio h2.dima-custom-heading {
      text-align: right;
  }
} */

/*
 * TEXTO PRESENTACIÓN
 *********************/
/* Overlay imagen Helvetia */
#inicio .overlay:hover:before {
  background: transparent;
  opacity: 0;
}

/*
 * CONTADORES 
 *************/

/* ESTRUCTURA */

.countUp.with-icon.no-border {
  display: flex;
  flex-direction: column;
  text-align: center;
}

/* Columna contenedora */
/* #columna-contadores {
  align-items: center;
} */

/* @media (min-width: 768px) {
  #columna-contadores {
    align-items: flex-end;
  }
} */

/* Row icono + texto con contador */
/* .countUp.with-icon.no-border {
  width: 85%;
  max-width: 32.5rem;
  min-width: 27.7rem;
  display: flex;
  justify-content: space-between;
} */

/*  ICONOS */
/* Márgenes iconos */
.countUp .icon-count {
  margin-right: 0;
  margin-bottom: 20px;
}

/* NÚMEROS */
/* Padding lateral números contadores para poder añadir texto antes y después */
span.number-count {
  padding: 0 0.8rem;
}

/* TEXTO */
/* Texto alineado al centro en móviles */
/* #inicio .number {
  text-align: center;
} */

/* Texto alineado al la derecha a partir de tablet */
/* @media (min-width: 768px) {
  #inicio .number {
    text-align: right;
  }	
} */

/*
 * VIDEO
 ********/
#quienesSomos-video {
  border-radius: 10px;
}

#quienesSomos-video .dima-video-wrapper {
  border-radius: 10px;
  /* box-shadow: 2px 2px 10px black; */
}

#quienesSomos-video .dima-video {
  border-radius: 10px;
}

/*************************
* SECCIÓN - METODOLOGÍA *
***********************/
/*
 * IMAGEN FONDO
 ***************/
/* Overlay filtro oscuro */
#metodo .dima-section-cover {
  background-color: rgb(37 37 37 / 55%);
}

/*
 * Fastalent
 ************/
#fastalent .ok-row {
  margin-bottom: 0;
}

/*
 * Sliders iconos
 *****************/

/* Título iconboxes
.features-title {
  font-size: 2.2rem;
} */

/* Descripción iconboxes */
.features-title + span {
  font-size: 1.8rem;
}

/* Iconos slider */
header.icon-box-header {
  padding: 10px 0;
  margin-bottom: 10px;
}

/* Tamaño iconos en dispositivos móviles */
@media (max-width: 480px) {
  i.box-circle.icon-box-medium {
    width: 125px !important;
    height: 125px !important;
    line-height: 125px !important;
    font-size: 48px !important;
  }
}

/* Puntos slider */
.owl-theme.owl-darck .owl-dots .owl-dot span {
  border-color: #ffffffcc;
}

.owl-theme.owl-darck .owl-dots .owl-dot:hover span,
.owl-theme.owl-darck .owl-dots .owl-dot.active span {
  background-color: #ffffffcc;
}

/* Controles slider */
/* .owl-theme.owl-darck .owl-nav .owl-prev, .owl-theme.owl-darck .owl-nav .owl-next {
  color: var(--colorPrincipal);
}

.owl-theme.owl-darck .owl-nav .owl-prev:hover, .owl-theme.owl-darck .owl-nav .owl-next:hover {
  color: #ffffffcc;
} */

/* Línea que une los iconos */
@media (min-width: 1198px) {
  ul.owl-carousel.owl-theme.owl-loaded.owl-drag::before {
    content: '';
    position: absolute;
    display: block;
    top: 75px;
    width: 75%;
    height: 0;
    border-top: 1px solid #e1e1e1;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

/****************************
* SECCIÓN - TU OPORTUNIDAD *
**************************/

/*
 * TE AYUDAMOS A EMPEZAR
 *----------------------*/

/*
 * Acordeón
 *----------------------*/

/* Disposición de contenidos dentro cada item del acordeón */
.dima-accordion-inner .ok-row {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* A partir 768px contenidos item del acordeón dispuestos en línea */
@media (min-width: 768px) {
  .dima-accordion-inner .ok-row {
    flex-direction: row;
  }
}

@media (max-width: 768px) {
  /* Título de dentro del acordeón */
  h4.dima-custom-heading {
    padding-top: 10px;
  }
}

/* Fuente de texto header acordeón */
ul.dima-accordion
  .dima-accordion-group
  .dima-accordion-header
  .dima-accordion-toggle {
  font-family: var(--fuenteTextos);
  font-size: 2rem;
  color: var(--colorTexto);
}

/* Color signo +/- acordeón */
ul.dima-accordion
  .dima-accordion-group
  .dima-accordion-header
  .dima-accordion-toggle:before {
  color: var(--colorTexto) !important;
  font-size: 1.2rem;
}

/*
 * TU PERFIL PROFESIONAL
 ************************/

#perfil-profesional .ok-row {
  margin-bottom: 0;
}

/* Espaciado entre cualidades del perfil profesional (barra + textos) */
.dima-progressbar + p {
  margin-bottom: 35px;
}

/* Último cualidad del perfil profesional sin borde */
.dima-progressbar + p:last-of-type {
  margin-bottom: 0;
}

.dima-progressbar p.h-skill {
  margin-bottom: 0;
  font-weight: bold;
  color: inherit;
}

.progress,
.progress-bar {
  border-radius: 10px;
}

/*
 * BANNER - POTENCIAMOS TUS HABILIDADES
 ***************************************/

/** TÍTULO BANNER **/
@media (max-width: 767px) {
  #banner-oportunidad h2 {
    text-align: center;
  }
}

/** IMAGEN DE FONDO **/
/* Imagen chica oculta para móviles */
@media (max-width: 768px) {
  #banner-oportunidad .background-image-hide {
    background-position: right !important;
  }
}

/* Imagen chica mostrada parcialmente de 768px a 989px */
@media (min-width: 768px) and (max-width: 989px) {
  #banner-oportunidad .background-image-hide {
    background-position: 38% center !important;
  }
}

/* Imagen mostrada completamente a partir de 989px */
@media (min-width: 989px) {
  #banner-oportunidad .background-image-hide {
    background-position: center center !important;
  }
}

/** TEXTO DINÁMICO **/
.auto-type h3 {
  text-align: center !important;
  line-height: 1 !important;
}

.lab-autotype-text-entry {
  color: var(--colorPrincipal);
}

/** CITA **/
.dima-testimonial blockquote.without-icon:before {
  margin: 0;
}

/**************************
* FORMULARIO DE CONTACTO *
*************************/

#responsive-form {
  max-width: 900px
    /*-- cambiar esto para conseguir el ancho de la forma deseada --*/;
  margin: 0 auto;
  width: 100%;
}

.form-row {
  width: 100%;
}

.column-half,
.column-full {
  float: left;
  position: relative;
  padding: 0.65rem;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.clearfix:after {
  content: '';
  display: table;
  clear: both;
}

@media only screen and (min-width: 48em) {
  .column-half {
    width: 50%;
  }

  .column-half:first-child {
    padding-right: 20px;
  }
}

span.wpcf7-list-item {
  margin: 0;
}

form a {
  font-weight: initial;
}

/* Texto de tratamiento de datos
 *-------------------------------*/

div.column-half.datos-adicionales {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.tratamiento-datos p {
  font-size: 12px !important;
  line-height: 1.4;
  margin: 5px;
}

.tratamiento-datos p span {
  font-weight: 800;
}

/*------------------------
  Botón envío de archivos
 -------------------------*/

/* Ocultamos el input */
span.adjuntos > input {
  opacity: 0;
}

/* Le damos posicionamiento relativo */
span.adjuntos {
  position: relative;
}

span.adjuntos input.wpcf7-file {
  cursor: pointer;
  width: 200px;
  height: 48px;
}

/* Damos estilos al before que será el botón que se vea realmente */
span.adjuntos::before {
  content: 'Elige un archivo';
  position: absolute;
  left: 0;
  padding: 15px;
  background: var(--colorPrincipal);
  color: var(--colorTexto);
  width: 170px;
  text-align: center;
  font-size: 1.5rem;
  cursor: pointer;
  line-height: 18px;
}

/* Estilos hover sobre el botón */
span.adjuntos:hover::before {
  background-color: var(--colorTexto);
  color: var(--colorPrincipal);
  transition-duration: 0.3s;
}

/* Margen inferior para separar de mensaje cuando archivo no válido */
.wpcf7-form-control.wpcf7-file.wpcf7-not-valid {
  margin-bottom: 20px;
}

/*--------------------------
  Botón envío de formulario
 -------------------------*/

/* Estilos botón envío */
[type='submit'].wpcf7-submit {
  width: 200px;
  color: var(--colorTexto);
  font-size: 1.5rem;
  font-weight: 400;
}

@media only screen and (max-width: 768px) {
  .wpcf7-submit {
    margin-top: 0;
  }
}

/* Estilos hover botón envío */
[type='submit'].wpcf7-submit:hover {
  background-color: var(--colorTexto);
  color: var(--colorPrincipal);
  transition-duration: 0.3s;
}

/*---------------------------------
  Mensajes de información de envío
 ----------------------------------*/
.wpcf7 form .wpcf7-response-output {
  margin: 2em 0.5em 1em;
  padding: 0.2em 1em;
  border: 2px solid #00a0d2 !important;
  /* Blue */
  color: var(--colorTexto);
}

.wpcf7-response-output a,
.dima-alert a {
  color: var(--colorEnlace);
}

.wpcf7-response-output a:hover,
.dima-alert a:hover {
  color: var(--colorTexto);
}

.wpcf7 form.init .wpcf7-response-output {
  display: none;
}

.wpcf7 form.sent .wpcf7-response-output {
  border-color: #46b450 !important;
  /* Green */
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
  border-color: #dc3232 !important;
  /* Red */
}

.wpcf7 form.spam .wpcf7-response-output {
  border-color: #f56e28 !important;
  /* Orange */
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  border-color: #ffb900 !important;
  /* Yellow */
}

/**********
* FOOTER *
*********/
footer.dima-footer .copyright a,
footer.dima-footer a,
.top-footer a {
  color: #a1a1a1 !important;
  font-weight: 400;
}

footer.dima-footer .copyright a:hover,
footer.dima-footer a:hover,
.top-footer a:hover {
  color: var(--colorEnlace) !important;
}

/******************
* BOTÓN FLOTANTE *
*****************/
.scroll-to-top {
  font-size: 25px;
  background: var(--colorPrincipal);
  color: var(--colorTexto);
}

.scroll-to-top i {
  line-height: 62px;
}

.scroll-to-top:hover {
  background: var(--colorTexto);
  color: var(--colorPrincipal) !important;
}

/*******************
* BARRA DE COOKIES *
********************/

#cookie-law-info-bar {
  background-color: rgba(10, 10, 10, 0.8) !important;
}

.cli-style-v2 .cli-plugin-main-link:not(.cli-plugin-button),
.cli-style-v2 .cli_settings_button:not(.cli-plugin-button),
.cli-style-v2 .cli_action_button:not(.cli-plugin-button) {
  text-decoration: none;
}

.cli-modal-content {
  background-color: #6b6c7c !important;
}

#cookie_action_close_header,
.cli_settings_button {
  color: #fcc312;
}

.cli-tab-section .cli-tab-content {
  padding: 10px 20px;
}

.cli-tab-container p,
.cli-privacy-content-text {
  color: #fff;
}

.cli-tab-container h4,
.cli-tab-container h1 {
  color: #fff;
}

a.cli-privacy-readmore {
  color: #fff;
}

.cli-modal-close svg {
  fill: #fff;
}

.cli-tab-header {
  border-radius: 0;
  background-color: #6b6c7c;
  border: 1px solid white;
}

.cli-tab-header a.cli-nav-link {
  color: #fff;
}

span.cli-necessary-caption {
  color: #fff;
}

.cli-tab-header a::before {
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}

.cli-tab-content p {
  font-size: 14px !important;
}

.cli-switch .cli-slider::after {
  color: #fff;
}