@font-face {
  font-family: 'Montserrat';
  src: url('font/Montserrat-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('font/Montserrat-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('font/Montserrat-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('font/Montserrat-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('font/Montserrat-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('font/Montserrat-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}


@font-face {
  font-family: 'Lora';
  src: url('font/Lora-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lora';
  src: url('font/Lora-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lora';
  src: url('font/Lora-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lora';
  src: url('font/Lora-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}



html,
body {
  letter-spacing: -0.15pt;
  font-size: 18px;
  font-family: 'Montserrat', Arial, sans-serif !important;
  height: 100%;
  max-width: 100%;
  font-weight: 400 !important;
}

body {
  background: #fff;
  color: #141414;
  width: 100%;
}

hr {
  border-top: 1px solid #DDDDDD;
  margin: 30px 0;
}

.fw-thin     { font-weight: 100 !important; }
.fw-light    { font-weight: 300 !important; }
.fw-normal   { font-weight: 400 !important; }
.fw-medium   { font-weight: 500 !important; }
.fw-semibold { font-weight: 600 !important; }
.fw-bold     { font-weight: 700 !important; }
.fw-black    { font-weight: 900 !important; }

strong {
  font-weight: 600;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Lora', serif !important;
  font-style: normal !important;
}


/* se agrega el estilo para la infomación de capacitaciones_curso_view donde el CKEditor trae código con basura de cuando se copia y pega en el formulario de carga */
.contenido-ckeditor [style] {
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: inherit !important;
  background-color: transparent !important;
}

h1 .light, 
h2 .light, 
h3 .light,
h4 .light,
h5 .light,
h6 .light {
  font-weight: 400 !important;
}

p,
ul,
ol,
table,
fieldset {
  font-weight: 400 !important;
}

ul li {
  margin-bottom: 6px;
  line-height: 1.5;
}


.thin {
  font-family: inherit !important;
  font-weight: 100 !important;
}

.light {
  font-family: inherit !important;
  font-weight: 300 !important;
}

.medium {
  font-family: inherit !important;
  font-weight: 500 !important;
}

.bold {
  font-family: inherit !important;
  font-weight: 700 !important;
}

.black {
  font-family: inherit !important;
  font-weight: 900 !important;
}

.min-h-50  { min-height: 50px; }
.min-h-80  { min-height: 80px; }
.min-h-100 { min-height: 100px; }
.min-h-120 { min-height: 120px; }
.min-h-150 { min-height: 150px; }

.min-vh-50  { min-height: 50vh; }
.min-vh-60  { min-height: 60vh; }
.min-vh-70  { min-height: 70vh; }
.min-vh-80  { min-height: 80vh; }
.min-vh-90  { min-height: 90vh; }


.margin-05 {
    margin: 0.5rem !important;
}

.margin-bottom-05 {
    margin-bottom: 0.5rem !important;
}

.margin-top-05 {
    margin-top: 0.5rem !important;
}

.margin-left-05 {
    margin-left: 0.5rem !important;
}

.margin-right-05 {
    margin-right: 0.5rem !important;
}


.padding-05 {
    padding: 0.5rem !important;
}

.padding-bottom-05 {
    padding-bottom: 0.5rem !important;
}

.padding-top-05 {
    padding-top: 0.5rem !important;
}

.padding-left-05 {
    padding-left: 0.5rem !important;
}

.padding-right-05 {
    padding-right: 0.5rem !important;
}

.bg-amarillo {
  background-color: #E7BA61 !important;
}
.bg-amarillo-50 {
  background-color: #f7f5ea !important;
}

.bg-amarillo-info {
  background-color: #fff9d842 !important;
}

.bg-azul{
  background-color: #232D4F !important;
}

.bg-azul-info{
  background-color: #bedcff2d !important;
}

.alert-info {
    background: rgb(245.2153846154, 246.8461538462, 248.8846153846);
    border-color: #5A7290;
}

.border-1 { border: 1px solid !important; }
.border-2 { border: 2px solid !important; }
.border-3 { border: 3.5px solid !important; }

.border-t-1 { border-top: 1px solid; }
.border-t-2 { border-top: 2px solid; }
.border-t-3 { border-top: 3.5px solid; }

.border-b-1 { border-bottom: 1px solid; }
.border-b-2 { border-bottom: 2px solid; }
.border-b-3 { border-bottom: 3.5px solid; }

.border-amarillo {
  border-color: #E7BA61 !important;
}

.border-gris {
  border-color: #dcdbdb !important;
}

.border-azul{
  border-color: #2d5d9c !important;
}

.text-cielo {
  /* color: #039BE5; */
  color: #32447f !important; }

  .bg-cielo-1 {
  background-color: #02abff4f !important; }

.text-azul{
  color: #232D4F !important;
}


/* rounded */
.rounded      { border-radius: 8px !important; }
.rounded-sm   { border-radius: 6px !important; }
.rounded-lg   { border-radius: 12px !important; }
.rounded-full { border-radius: 999px !important; }

.rounded-left {
  border-top-left-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
}

.rounded-right {
  border-top-right-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}

.rounded-top {
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
}

.rounded-bottom {
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}
.rounded-left-sm {
  border-top-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}

.rounded-right-sm {
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

.rounded-top-sm {
  border-top-left-radius: 6px !important;
  border-top-right-radius: 6px !important;
}

.rounded-bottom-sm {
  border-bottom-left-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

.rounded-left-lg {
  border-top-left-radius: 12px !important;
  border-bottom-left-radius: 12px !important;
}

.rounded-right-lg {
  border-top-right-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
}

.rounded-top-lg {
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
}

.rounded-bottom-lg {
  border-bottom-left-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
}

.rounded-left-full {
  border-top-left-radius: 999px !important;
  border-bottom-left-radius: 999px !important;
}

.rounded-right-full {
  border-top-right-radius: 999px !important;
  border-bottom-right-radius: 999px !important;
}

.rounded-top-full {
  border-top-left-radius: 999px !important;
  border-top-right-radius: 999px !important;
}

.rounded-bottom-full {
  border-bottom-left-radius: 999px !important;
  border-bottom-right-radius: 999px !important;
}

.rounded-top-start {
  border-top-left-radius: 8px !important;
}

.rounded-top-end {
  border-top-right-radius: 8px !important;
}

.rounded-bottom-start {
  border-bottom-left-radius: 8px !important;
}

.rounded-bottom-end {
  border-bottom-right-radius: 8px !important;
}

.rounded-top-start-sm {
  border-top-left-radius: 6px !important;
}

.rounded-top-end-sm {
  border-top-right-radius: 6px !important;
}

.rounded-bottom-start-sm {
  border-bottom-left-radius: 6px !important;
}

.rounded-bottom-end-sm {
  border-bottom-right-radius: 6px !important;
}

.rounded-top-start-lg {
  border-top-left-radius: 12px !important;
}

.rounded-top-end-lg {
  border-top-right-radius: 12px !important;
}

.rounded-bottom-start-lg {
  border-bottom-left-radius: 12px !important;
}

.rounded-bottom-end-lg {
  border-bottom-right-radius: 12px !important;
}

.rounded-top-start-full {
  border-top-left-radius: 999px !important;
}

.rounded-top-end-full {
  border-top-right-radius: 999px !important;
}

.rounded-bottom-start-full {
  border-bottom-left-radius: 999px !important;
}

.rounded-bottom-end-full {
  border-bottom-right-radius: 999px !important;
}
/* fin reounded */



.button.button-outline-gris {
  background-color: transparent;
  color: #232D4F;
  border: 2px solid #C9C9C9;
  border-radius: 999px;
  transition: all 0.25s ease-out;
  display: inline-block; 
  vertical-align: middle; 
  margin: 0 0 1rem 0; 
  font-family: inherit; 
  padding: 0.6em 0.7em;
  font-size: 0.9rem; 
  line-height: 1; 
  text-align: center; 
  cursor: pointer;
}

.button.button-outline-gris:hover {
  background-color: #f5f5f5;
  color: #232D4F;
}

.button.button-outline-azul {
  background-color: transparent;
  color: #003e74;
  border: 2px solid #003e74;
  border-radius: 999px;
  transition: all 0.25s ease-out;
  display: inline-block; 
  vertical-align: middle; 
  margin: 0 0 1rem 0; 
  font-family: inherit; 
  padding: 0.6em 0.7em;
  font-size: 0.9rem; 
  line-height: 1; 
  text-align: center; 
  cursor: pointer;
}

.button.button-outline-azul:hover {
  background-color: #003e74;
  color: #fff;
}



.panel-gris {
  margin-bottom: 30px; }
a.panel-gris {
  transition: background 0.15s; }
  a.panel-gris h1,
  a.panel-gris h2,
  a.panel-gris h3,
  a.panel-gris h4,
  a.panel-gris h5,
  a.panel-gris h6,
  a.panel-gris small,
  a.panel-gris p,
  a.panel-gris span {
    transition: color 0.15s; }
  a.panel-gris .panel-heading {
    transition: opacity 0.15s; }
  a.panel-gris:hover, a.panel-gris:focus {
   background: #d2d2d2e3 !important;
    color: #333333 !important; }
    a.panel-gris:hover small, a.panel-gris:focus small {
      color: #fff; }
    a.panel-gris:hover .text-muted,
    a.panel-gris:hover .text-primary,
    a.panel-gris:hover .text-secondary,
    a.panel-gris:hover .text-success,
    a.panel-gris:hover .text-warning,
    a.panel-gris:hover .text-danger,
    a.panel-gris:hover .text-cielo, a.panel-gris:focus .text-muted,
    a.panel-gris:focus .text-primary,
    a.panel-gris:focus .text-secondary,
    a.panel-gris:focus .text-success,
    a.panel-gris:focus .text-warning,
    a.panel-gris:focus .text-danger,
    a.panel-gris:focus .text-cielo {
      color: #fff !important; }
    a.panel-gris:hover .panel-heading, a.panel-gris:focus .panel-heading {
      opacity: .8; }