/* * {
      /* font-family: "Montserrat"; 
} */
*,
*::before,
*::after {
      font-family: "Raleway";
      box-sizing: border-box; /* Esto afecta todos los elementos, no solo el body */
      /* font-size: 20px; */
}

html,
body,
.body {
      /* width: 100%; */
      min-width: 350px;
      overflow-x: hidden;
      background-color: #e3e3e3;
      overflow-x: hidden;
      box-sizing: border-box;
      /* font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu,
            Cantarell, "Helvetica Neue", sans-serif; */
}
@media (max-width: 350px) {
      body {
            width: 350px; /* Asegúrate de que no se reduzca por debajo de 350px */
      }
}

:root {
      --primario: #f39c12;
      --secundario: #da801b;
      --principal: #183e62;
      --principal2: #1b466e;
      --blanco: #ffffff;
      --rojo: #e63534;
      --violeta: #7f56da;
      --violet: #7f56da;
      --rojo2: #c41230;
      --naranja: #f39c12;
      --amarillo: #f1c40f;
      --gris: #ecf0f1;
      --grey: #ecf0f1;
      --gris2: #dedde1;
      --grey2: #dedde1;
      --verde: #1abc9c;
      --verde1: #055646;
      --verde2: #06846c;
      --verde3: #1daf92;
      --verde4: #c2ebe3;
      --azul: #0a3d62;
      --celeste: #3eaefe;
      --pastel: #f6e58d;
      --gris-osc: #3e3d3d;
      --azul-osc: #042e3a;
}
h1,
h2,
h3 {
      font-family: "Raleway";
      font-weight: semi-bold;
      font-size: 16px;
}
h4,
h5,
h6 {
      font-family: "Raleway";
      font-size: 14px;
}
p {
      font-family: "Raleway";
      font-size: 14px;
}
a {
      color: rgb(0, 100, 200);
      text-decoration: none;
}

a:hover {
      text-decoration: underline;
}

a:visited {
      color: rgb(0, 80, 160);
}

label {
      display: block;
}

input,
button,
select,
textarea {
      font-family: inherit;
      font-size: inherit;
      -webkit-padding: 0.4em 0;
      padding: 0.4em;
      margin: 0 0 0.5em 0;
      box-sizing: border-box;
      border: 1px solid #ccc;
      border-radius: 2px;
}

input:disabled {
      color: #ccc;
}

button {
      color: #333;
      background-color: #f4f4f4;
      outline: none;
}

button:disabled {
      color: #999;
}

button:not(:disabled):active {
      background-color: #ddd;
}

button:focus {
      border-color: #666;
}

/* GLOBALS NICO: */
.sin-padding {
      padding-left: 0px;
      padding-right: 0px;
      margin-left: 0px;
      margin-right: 0px;
}
.sin-padding-right {
      padding-right: 0px;
      margin-right: 0px;
}
.sin-padding-left {
      padding-left: 0px;
      margin-left: 0px;
}

.pointer {
      cursor: pointer;
}

.flex {
      display: flex;
}
.flex-wrap {
      display: flex;
      flex-wrap: wrap;
}
.flex-center {
      display: flex;
      justify-content: center;
      align-items: center;
}
.flex-center-h {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
}
.flex-h {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
}
.flex-center-v {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
}
.flex-v {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
}
.flex-start {
      display: flex;
      justify-content: start;
      align-items: center;
}
.flex-end {
      display: flex;
      justify-content: end;
      align-items: center;
}
.flex-justify {
      display: flex;
      justify-content: space-around;
      align-items: center;
}
.flex-between {
      display: flex;
      justify-content: space-between;
      align-items: center;
}
.flex-row {
      display: flex;
      flex-direction: row;
}
.center {
      text-align: center;
}
.img-bg {
      background-size: cover;
      background-repeat: no-repeat;
      background-repeat: no-repeat;
}
.divImg {
      background-size: cover;
      background-repeat: no-repeat;
}
.divImgContain {
      background-size: contain;
      background-repeat: no-repeat;
}
.divImgCenter {
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center;
}
.bsr {
      border: solid 1px red;
}
.bsb {
      border: solid 1px blue;
}
.bsy {
      border: solid 1px yellow;
}
.bsg {
      border: solid 1px green;
}
.bsgrey {
      border: solid 1px lightgrey;
}
.bold {
      font-weight: bold;
}
.white {
      color: white;
}
.black {
      color: black;
}
.grey,
.gris {
      color: #84889b;
}
.black {
      color: black;
}
.violet {
      color: #7f56da;
}
.no-overflow {
      overflow: hidden;
}
.bsgreen {
      border: solid 1px #1abc9c;
}
.bsg,
.bsgrey,
.bsgris {
      border: solid 1px lightgrey;
}
.bs4grey,
.bs4g,
.br4g,
.brs4g {
      border: solid 2px lightgrey;
}
.bslg {
      border: solid 1px lightgrey;
}
.bsv {
      border: solid 1px #7f56da;
}
.bsv-bold {
      border: solid 3px #7f56da;
}
.bcv {
      background-color: #7f56da;
      color: white;
}
.bold {
      font-weight: bold;
}
.semi-bold,
.semibold {
      font-weight: 500;
}
.thin {
      font-weight: 200;
}
.semi-thin,
.semithin {
      font-weight: 400;
}

.pl-1 {
      padding-left: 4px;
}
.pl-2 {
      padding-left: 6px;
}
.pl-3 {
      padding-left: 8px;
}
.br-5 {
      border-radius: 5px;
}
.br-10 {
      border-radius: 10px;
}
.br-15 {
      border-radius: 15px;
}
.br-20 {
      border-radius: 20px;
}
.br-25 {
      border-radius: 25px;
}
.br-50 {
      border-radius: 50px;
}
.brt-5 {
      border-radius: 5px 5px 0px 0px;
}
.brt-10 {
      border-radius: 10px 10px 0px 0px;
}
.brt-15 {
      border-radius: 15px 15px 0px 0px;
}
.brt-20 {
      border-radius: 20px 20px 0px 0px;
}
.brt-25 {
      border-radius: 25px 25px 0px 0px;
}
.brt-50 {
      border-radius: 50px 50px 0px 0px;
}