/*
Nombre Tema: Expoinclusion
Tema URI: www.expoinclusion.cl
Descripción: Feria virtual inclusiva
Version: 1
Author: Jota A Diseño y Desarrollo SpA.
Author URI: https://www.jotaa.cl
*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;400;500;600;700;800;900&display=swap');

:root {

  --blanco:#fff;
  --azul:#0066ff;
  --celeste:#4384d7;
  --violeta: #9533ad;
  --verde:#1AC602;
  --verdeWhatsapp:#2db640;
  --rojoBoton: #ed1c24;
  --negroClaro: #3D3D3D;


  --titulos: 'Montserrat', sans-serif;



  --font30: 30px;
  --font25: 25px;
  --font18: 18px;
  --font16: 16px;
  --font14: 14px;
  --font12: 12px;

}



/*===========  ESTILOS MODALES  ===========*/

.btn-close {
  background: none !important;
}



.modal-header {
  border: none !important;
  display: block !important;
  padding-bottom: 0px;
}

.icono-modal-correo {
  font-size: var(--font30);
  color: var(--azul);
  background-color: unset;
}

.texto-modal {
  font-family: var(--titulos);
  font-size: var(--font18);
  font-weight: 400;
  color: var(--negroClaro);
}

.modal-body {
  padding-top: 0px;
}

.modal-footer {
  border: none !important;
  justify-content: center !important;
}

.btn-modal-azul {
  background-color: var(--blanco);
  border-right: 20px solid var(--azul);
  border-top: none;
  border-bottom: none;
  border-left: none;
  border-radius: 200px;
  /* border-radius: 2px; */
  color: var(--azul);
  font-family: var(--titulos);
  font-size: var(--font16);
  box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.397);
  padding: 10px 20px 10px 20px;
}

.btn-modal-azul:hover {
  background-color: var(--azul) !important;
  border-right: 20px solid var(--azul);
  color: var(--blanco);
}

.btn-modal-azul:active {
  background-color: var(--azul) !important;
  border-right: 20px solid var(--azul);
  color: var(--blanco);
}

.icono-btn-modal-a {
  color: var(--blanco);
  background-color: var(--azul);
  padding: 4px 7px 4px 6px;
  font-size: var(--font12);
  border-radius: 100px;
}

.icono-modal-cv {
  font-size: var(--font30);
  color: var(--violeta);
}

.btn-modal-rojo {
  background-color: var(--blanco);
  border-right: 20px solid var(--rojoBoton);
  border-top: none;
  border-bottom: none;
  border-left: none;
  border-radius: 200px;
  /* border-radius: 2px; */
  color: var(--rojoBoton);
  font-family: var(--titulos);
  font-size: var(--font16);
  box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.397);
  padding: 10px 20px 10px 20px;
}

.btn-modal-rojo:hover {
  background-color: var(--rojoBoton) !important;
  border-right: 20px solid var(--rojoBoton);
  color: var(--blanco);
}

.btn-modal-rojo:active {
  background-color: var(--rojoBoton) !important;
  border-right: 20px solid var(--rojoBoton);
  color: var(--blanco);
}

.icono-btn-modal-r {
  color: var(--blanco);
  background-color: var(--rojoBoton);
  padding: 4px 7px 4px 6px;
  font-size: var(--font12);
  border-radius: 100px;
}

.texto-guardar-cv {
  font-family: var(--titulos);
  font-size: var(--font16);
  font-weight: 400;
  background-color: var(--blanco);
  border-radius: 2px;
  box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.377);
  color: var(--azul);
  border-right: 20px solid var(--azul);
  padding: 15px 15px 15px 15px;
}


.texto-guardar-cv:hover {
  color: var(--blanco);
  border-right: 20px solid var(--azul);
  background-color: var(--azul);
  box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.377);
}

.icono-guardar-cv {
  font-size: var(--font14);
  font-weight: 400;
  color: var(--blanco) !important;
  background-color: var(--azul);
  padding: 6px 8px 6px 9px;
  border-radius: 100px;
}

.icono-guardar-cv:hover {
  color: var(--azul) !important;
  background-color: var(--blanco);
}

.icono-modal-exito {
  font-size: var(--font30);
  color: var(--verdeWhatsapp);
}

.icono-modal-error {
  font-size: var(--font30);
  color: var(--rojoBoton);
}
/* 
.btn-close {
  font-size: var(--font25);
} */

/*===========  ESTILOS MODALES  ===========*/