/*ANDI*/
.container-andi {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    /* transform: scale(0.5) !important; */
}

/*BACKGROUNDS*/

.main-content {
    width: 100%;
    height: 100%;
    border: 3px solid #C1CFF2;
    background-color: rgba(55, 70, 104, .9) !important;
    border-radius: 50px;
}

.main-content-inner {
    width: 100%;
    height: 100%;
    background-color: #D3E1EA;
    border: 2px solid #C1CFF2;
    border-radius: 20px;
}

.main-content-inner-nob {
    width: 100%;
    height: 100%;
    /* background-color: #D3E1EA; */
    border-radius: 20px;
}

.button-container {
    width: 100%;
    height: 100%;
    border: 3px solid rgb(55, 70, 104);
    border-radius: 20px;
}

.black-overlay {
    background-color: rgba(0, 0, 0, 0.5);
}

.opaque {
    opacity: 1 !important;
}

.modal-bg {
    pointer-events: none;
    background-color: rgba(0, 0, 0, 0.75);
}

.make-white {
    filter: invert(99%) sepia(10%) saturate(346%) hue-rotate(296deg) brightness(118%) contrast(100%);
}

.make-black {
    filter: invert(0%) sepia(96%) saturate(16%) hue-rotate(354deg) brightness(96%) contrast(100%);
}

.make-grey {
    filter: invert(90%) sepia(5%) saturate(17%) hue-rotate(33deg) brightness(71%) contrast(11%);
}

/*TEXT*/
.title-text,
.default-text,
.small-text {
    margin: 0;
    font-family: Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
}

.title-text,
.title-text2 {
    font-size: 31pt;
}

.white-text {
    color: white;
}

.title-text2 {
    font-weight: bold;
}

.default-text {
    font-size: 23pt;
}

.small-text {
    font-size: 18pt;
}

.black-text {
    color: black;
}

.white-text {
    color: white;
}


/*LAYOUT*/

.center-element {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.center-element-horizontal {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.center-element-vertical {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

/*STYLE*/

.add-pad {
    padding: 20px;
}

.add-marg {
    margin: 20px;
}

.modal-disable-select {
    user-select: none; /* supported by Chrome and Opera */
   -webkit-user-select: none; /* Safari */
   -khtml-user-select: none; /* Konqueror HTML */
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* Internet Explorer/Edge */
  }


  @-webkit-keyframes spinner /* Safari and Chrome */ {
    from {
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }

  @keyframes spinner {
    from {
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -ms-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }

  .spinner {
    -webkit-animation: spinner 1s linear infinite;
    -moz-animation: spinner 1s linear infinite;
    -ms-animation: spinner 1s linear infinite;
    -o-animation: spinner 1s linear infinite;
    animation: spinner 1s linear infinite;
  }