:root {
  --basefontsize: 15px;
  --font-header: 'Museo', serif;
  --font-header-light: 300;
  --font-header-regular: 500;
  --font-header-bold: 700;
  --font: 'Ubuntu', sans-serif;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;
  --color-light: #44BAEC;
  --color-main: #00345F;
  --color-emphasis: #FF521B;
  --color-lightGrey: #f2f4f7;
  --color-text: #7d7f7b;
  --color-contrast: #C6D32C;
  --color-contrast-dark: #248332;
  --font-size-button-lg: clamp(10px, 1.3vw, 20px);
  --font-size-button-sm: clamp(10px, 1.1vw, 18px);
  --font-size-header: clamp(20px, 5.5vw, 6.5rem);
  --font-size-header-medium: clamp(18px, 3.25vw, 5rem);
  --font-size-header-small: clamp(18px, 2vw, 3rem);
  --border-radius: 25px; }

html {
  min-height: 100vh; }

html, body {
  overflow-x: hidden; }

.loginPortal {
  min-height: 100vh;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center; }
  .loginPortal .container {
    height: 100%; }
  .loginPortal .row {
    display: flex;
    flex-wrap: wrap; }
    .loginPortal .row .col-left {
      width: 60%;
      min-height: 40vh;
      position: relative;
      z-index: 0;
      display: flex;
      align-items: center; }
      .loginPortal .row .col-left::before {
        content: "";
        inset: -2rem -10vw -2rem -2rem;
        border-radius: 2rem;
        background-color: var(--color-lightGrey);
        position: absolute;
        z-index: -1; }
      .loginPortal .row .col-left .back {
        background-color: var(--color-contrast);
        padding: 0.5rem;
        font-family: museofont;
        border-radius: .5rem;
        text-decoration: none; }
    .loginPortal .row .col-right {
      position: relative;
      z-index: 2;
      width: 40%;
      background-color: #fff;
      padding: 2rem;
      box-shadow: 10px 10px 25px rgba(0, 0, 0, 0.05);
      border-radius: 2rem; }
      .loginPortal .row .col-right h2 {
        color: var(--color-main);
        margin-bottom: 2rem; }
      .loginPortal .row .col-right form#moreSpecific.loginpagina_2 label {
        margin-bottom: 1.5rem;
        display: flex;
        flex-direction: column; }
        .loginPortal .row .col-right form#moreSpecific.loginpagina_2 label span {
          font-weight: bold;
          color: var(--color-main); }
        .loginPortal .row .col-right form#moreSpecific.loginpagina_2 label input, .loginPortal .row .col-right form#moreSpecific.loginpagina_2 label select {
          height: unset;
          width: 100%;
          padding: .8rem;
          border-radius: .5rem;
          border: 1px solid rgba(0, 52, 95, 0.1);
          margin-top: 0.5rem;
          font-size: 1rem;
          font-family: var(--font) !important;
          -webkit-appearance: none;
          color: var(--color-main) !important; }
          .loginPortal .row .col-right form#moreSpecific.loginpagina_2 label input::placeholder, .loginPortal .row .col-right form#moreSpecific.loginpagina_2 label select::placeholder {
            color: var(--color-main); }
      .loginPortal .row .col-right form#moreSpecific.loginpagina_2 .btn {
        border-radius: .5rem; }
    @media screen and (max-width: 1000px) {
      .loginPortal .row .col-left, .loginPortal .row .col-right {
        width: 100%; }
      .loginPortal .row .col-left:before {
        bottom: -10rem; }
      .loginPortal .row .col-right {
        margin-top: 5rem; } }
