#app-error{
  display: block;
  margin-left: auto;
  margin-right:auto;
  font-size:35px;
  color:rgba(55, 61, 100, 0.45);
  text-align: center;
  margin-top: -15px;
}
#app-error-code {
  display: block;
  margin-top:0px;
  margin-left: auto;
  margin-right:auto;
  font-size:75px;
  color:rgba(55, 61, 100, 0.45);
  text-align: center;
}
#app-error-container {
  margin-left: auto;
  margin-right:auto;
  text-align: center;
  display: none;
}

#app-loading {
  width: 99%;
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 100%;
}


:root {
  /* */
  --main-font-family: Roboto, sans-serif;
  --main-background-colour: white;
  --main-text-color: #333333;
  --main-content-size: 100%;
  --text-content-size: 1280px;
  --primary-button-background-color: #0C1832;
  --primary-button-text-color: #ffffff;
  --primary-button-overlay-multiplier: 2;
  --secondary-button-background-color: #004ddd;
  --secondary-button-text-color: #FFFFFF;
  --secondary-button-overlay-multiplier: 1;
  --button-radius: 12px;

  --ve-loading-spinner-color1: var(--primary-button-background-color);
  --ve-loading-spinner-color2: var(--primary-button-background-color);
  --ve-loading-spinner-color3: var(--primary-button-background-color);
  --ve-loading-spinner-color4: var(--primary-button-background-color);
  --ve-loading-spinner-color5: var(--primary-button-background-color);
  --ve-loading-spinner-color6: var(--primary-button-background-color);
  
  /*vuetify theme*/
  --v-theme-background: 255,255,255;
  --v-theme-background-overlay-multiplier: 1;
  --v-theme-surface: 255,255,255;
  --v-theme-surface-overlay-multiplier: 1;
  --v-theme-surface-bright: 255,255,255;
  --v-theme-surface-bright-overlay-multiplier: 1;
  --v-theme-surface-light: 238,238,238;
  --v-theme-surface-light-overlay-multiplier: 1;
  --v-theme-surface-variant: 66,66,66;
  --v-theme-surface-variant-overlay-multiplier: 2;
  --v-theme-on-surface-variant: 238,238,238;
  --v-theme-primary: var(--primary-button-background-color); 
  --v-theme-primary-overlay-multiplier: var(--primary-button-overlay-multiplier);
  --v-theme-primary-darken-1: 31,85,146;
  --v-theme-primary-darken-1-overlay-multiplier: 2;
  --v-theme-secondary: var(--secondary-button-background-color); 
  --v-theme-secondary-overlay-multiplier: var(--secondary-button-overlay-multiplier);
  --v-theme-secondary-darken-1: 1,135,134;
  --v-theme-secondary-darken-1-overlay-multiplier: 1;
  --v-theme-error: 176,0,32;
  --v-theme-error-overlay-multiplier: 2;
  --v-theme-info: 33,150,243;
  --v-theme-info-overlay-multiplier: 1;
  --v-theme-success: 76,175,80;
  --v-theme-success-overlay-multiplier: 1;
  --v-theme-warning: 251,140,0;
  --v-theme-warning-overlay-multiplier: 1;
  --v-theme-on-background: var(--main-text-color);
  --v-theme-on-surface: 0,0,0;
  --v-theme-on-surface-bright: 0,0,0;
  --v-theme-on-surface-light: 0,0,0;
  --v-theme-on-primary: var(--primary-button-text-color);
  --v-theme-on-primary-darken-1: 255,255,255;
  --v-theme-on-secondary: var(--secondary-button-text-color);
  --v-theme-on-secondary-darken-1: 255,255,255;
  --v-theme-on-error: 255,255,255;
  --v-theme-on-info: 255,255,255;
  --v-theme-on-success: 255,255,255;
  --v-theme-on-warning: 255,255,255;
  --v-border-color: 0, 0, 0;
  --v-border-opacity: 0.12;
  --v-high-emphasis-opacity: 0.87;
  --v-medium-emphasis-opacity: 0.6;
  --v-disabled-opacity: 0.38;
  --v-idle-opacity: 0.04;
  --v-hover-opacity: 0.04;
  --v-focus-opacity: 0.12;
  --v-selected-opacity: 0.08;
  --v-activated-opacity: 0.12;
  --v-pressed-opacity: 0.12;
  --v-dragged-opacity: 0.08;
  --v-theme-kbd: 33, 37, 41;
  --v-theme-on-kbd: 255, 255, 255;
  --v-theme-code: 245, 245, 245;
  --v-theme-on-code: 0, 0, 0;
}


body {
  font-family: var(--main-font-family);
  color: var(--main-text-color);
}

.v-btn {
  border-radius: var(--button-radius) !important;
}


.bg-background {
  --v-theme-overlay-multiplier: var(--v-theme-background-overlay-multiplier);
  background-color: rgb(var(--v-theme-background)) !important;
  color: var(--v-theme-on-background) !important;
}
.bg-surface {
  --v-theme-overlay-multiplier: var(--v-theme-surface-overlay-multiplier);
  background-color: rgb(var(--v-theme-surface)) !important;
  color: rgb(var(--v-theme-on-surface)) !important;
}
.bg-surface-bright {
  --v-theme-overlay-multiplier: var(--v-theme-surface-bright-overlay-multiplier);
  background-color: rgb(var(--v-theme-surface-bright)) !important;
  color: rgb(var(--v-theme-on-surface-bright)) !important;
}
.bg-surface-light {
  --v-theme-overlay-multiplier: var(--v-theme-surface-light-overlay-multiplier);
  background-color: rgb(var(--v-theme-surface-light)) !important;
  color: rgb(var(--v-theme-on-surface-light)) !important;
}
.bg-surface-variant {
  --v-theme-overlay-multiplier: var(--v-theme-surface-variant-overlay-multiplier);
  background-color: rgb(var(--v-theme-surface-variant)) !important;
  color: rgb(var(--v-theme-on-surface-variant)) !important;
}
.bg-primary {
  --v-theme-overlay-multiplier: var(--v-theme-primary-overlay-multiplier);
  background: var(--v-theme-primary) !important;
  color: var(--v-theme-on-primary) !important;
}
.bg-primary-darken-1 {
  --v-theme-overlay-multiplier: var(--v-theme-primary-darken-1-overlay-multiplier);
  background-color: rgb(var(--v-theme-primary-darken-1)) !important;
  color: rgb(var(--v-theme-on-primary-darken-1)) !important;
}
.bg-secondary {
  --v-theme-overlay-multiplier: var(--v-theme-secondary-overlay-multiplier);
  background: var(--v-theme-secondary) !important;
  color: var(--v-theme-on-secondary) !important;
}
.bg-secondary-darken-1 {
  --v-theme-overlay-multiplier: var(--v-theme-secondary-darken-1-overlay-multiplier);
  background-color: rgb(var(--v-theme-secondary-darken-1)) !important;
  color: rgb(var(--v-theme-on-secondary-darken-1)) !important;
}
.bg-error {
  --v-theme-overlay-multiplier: var(--v-theme-error-overlay-multiplier);
  background-color: rgb(var(--v-theme-error)) !important;
  color: rgb(var(--v-theme-on-error)) !important;
}
.bg-info {
  --v-theme-overlay-multiplier: var(--v-theme-info-overlay-multiplier);
  background-color: rgb(var(--v-theme-info)) !important;
  color: rgb(var(--v-theme-on-info)) !important;
}
.bg-success {
  --v-theme-overlay-multiplier: var(--v-theme-success-overlay-multiplier);
  background-color: rgb(var(--v-theme-success)) !important;
  color: rgb(var(--v-theme-on-success)) !important;
}
.bg-warning {
  --v-theme-overlay-multiplier: var(--v-theme-warning-overlay-multiplier);
  background-color: rgb(var(--v-theme-warning)) !important;
  color: rgb(var(--v-theme-on-warning)) !important;
}
.text-background {
  color: rgb(var(--v-theme-background)) !important;
}
.border-background {
  --v-border-color: var(--v-theme-background);
}
.text-surface {
  color: rgb(var(--v-theme-surface)) !important;
}
.border-surface {
  --v-border-color: var(--v-theme-surface);
}
.text-surface-bright {
  color: rgb(var(--v-theme-surface-bright)) !important;
}
.border-surface-bright {
  --v-border-color: var(--v-theme-surface-bright);
}
.text-surface-light {
  color: rgb(var(--v-theme-surface-light)) !important;
}
.border-surface-light {
  --v-border-color: var(--v-theme-surface-light);
}
.text-surface-variant {
  color: rgb(var(--v-theme-surface-variant)) !important;
}
.border-surface-variant {
  --v-border-color: var(--v-theme-surface-variant);
}
.on-surface-variant {
  color: rgb(var(--v-theme-on-surface-variant)) !important;
}
.text-primary {
  color: rgb(var(--v-theme-primary)) !important;
}
.border-primary {
  --v-border-color: var(--v-theme-primary);
}
.text-primary-darken-1 {
  color: rgb(var(--v-theme-primary-darken-1)) !important;
}
.border-primary-darken-1 {
  --v-border-color: var(--v-theme-primary-darken-1);
}
.text-secondary {
  color: rgb(var(--v-theme-secondary)) !important;
}
.border-secondary {
  --v-border-color: var(--v-theme-secondary);
}
.text-secondary-darken-1 {
  color: rgb(var(--v-theme-secondary-darken-1)) !important;
}
.border-secondary-darken-1 {
  --v-border-color: var(--v-theme-secondary-darken-1);
}
.text-error {
  color: rgb(var(--v-theme-error)) !important;
}
.border-error {
  --v-border-color: var(--v-theme-error);
}
.text-info {
  color: rgb(var(--v-theme-info)) !important;
}
.border-info {
  --v-border-color: var(--v-theme-info);
}
.text-success {
  color: rgb(var(--v-theme-success)) !important;
}
.border-success {
  --v-border-color: var(--v-theme-success);
}
.text-warning {
  color: rgb(var(--v-theme-warning)) !important;
}
.border-warning {
  --v-border-color: var(--v-theme-warning);
}
.on-background {
  color: var(--v-theme-on-background) !important;
}
.on-surface {
  color: rgb(var(--v-theme-on-surface)) !important;
}
.on-surface-bright {
  color: rgb(var(--v-theme-on-surface-bright)) !important;
}
.on-surface-light {
  color: rgb(var(--v-theme-on-surface-light)) !important;
}
.on-primary {
  color: rgb(var(--v-theme-on-primary)) !important;
}
.on-primary-darken-1 {
  color: rgb(var(--v-theme-on-primary-darken-1)) !important;
}
.on-secondary {
  color: rgb(var(--v-theme-on-secondary)) !important;
}
.on-secondary-darken-1 {
  color: rgb(var(--v-theme-on-secondary-darken-1)) !important;
}
.on-error {
  color: rgb(var(--v-theme-on-error)) !important;
}
.on-info {
  color: rgb(var(--v-theme-on-info)) !important;
}
.on-success {
  color: rgb(var(--v-theme-on-success)) !important;
}
.on-warning {
  color: rgb(var(--v-theme-on-warning)) !important;
}

.primary {
  color: var(--primary-button-background-color)
}
/* APP LOADER */
.app-loading-wrapper {
  height: 100%;
  width: 100%;
  align-items: center;
  position: relative;
}

.app-loading-text {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  color: var(--ve-loading-spinner-text-color, #999);
  width: 100px;
  height: 30px;
  margin-left: -50px;
  margin-top: 70px;
  text-align: center;
  font-family: 'PT Sans Narrow', sans-serif;
  font-size: 20px;
}

.app-loading-content {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 170px;
  height: 170px;
  margin: -85px 0 0 -85px;
  border: 3px solid #F00;
}

.app-loading-content:after {
  content: "";
  position: absolute;
  border: 3px solid #0F0;
  left: 15px;
  right: 15px;
  top: 15px;
  bottom: 15px;
}

.app-loading-content:before {
  content: "";
  position: absolute;
  border: 3px solid #00F;
  left: 5px;
  right: 5px;
  top: 5px;
  bottom: 5px;
}

.app-loading-content {
  border: 3px solid transparent;
  border-top-color: var(--ve-loading-spinner-color1,#800000);
  border-bottom-color: var(--ve-loading-spinner-color2,#4D658D);
  border-radius: 50%;
  -webkit-animation: loader 2s linear infinite;
  -moz-animation: loader 2s linear infinite;
  -o-animation: loader 2s linear infinite;
  animation: loader 2s linear infinite;
}

.app-loading-content:before {
  border: 3px solid transparent;
  border-top-color: var(--ve-loading-spinner-color3,#336600);
  border-bottom-color: var(--ve-loading-spinner-color4,#D4CC6A);
  border-radius: 50%;
  -webkit-animation: loader 3s linear infinite;
    -moz-animation: loader 2s linear infinite;
  -o-animation: loader 2s linear infinite;
  animation: loader 3s linear infinite;
}

.app-loading-content:after {
  border: 3px solid transparent;
  border-top-color: var(--ve-loading-spinner-color5,#4d0099);
  border-bottom-color: var(--ve-loading-spinner-color6,#84417C);
  border-radius: 50%;
  -webkit-animation: loader 1.5s linear infinite;
  animation: loader 1.5s linear infinite;
    -moz-animation: loader 2s linear infinite;
  -o-animation: loader 2s linear infinite;
}

@-webkit-keyframes loaders {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes loader {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

h1 {
  font-size: 45px;
  color: var(--main-text-color);
}

@media only screen and (max-width: 600px) {
  h1 {
    font-size: 35px;
  }
}

.v-input__details {
  padding-top: 2px !important;
  min-height: 12px !important;
}