﻿@font-face {
  font-family: "password";
  font-style: normal;
  font-weight: 400;
  src: url(https://jsbin-user-assets.s3.amazonaws.com/rafaelcastrocouto/password.ttf);
}
/** {
    box-sizing: border-box;
    font-family: Verdana, sans-serif;

    &::-webkit-scrollbar {
        width: 6px;
        background-color: transparent;
        padding-right: 9px;
    }

    &::-webkit-scrollbar:horizontal {
        height: 5px;
    }

    &::-webkit-scrollbar-track {
        -webkit-box-shadow: none;
        background-color: transparent;
        border-radius: 4px;
    }

    &::-webkit-scrollbar-thumb {
        background-color: $primary1;
        background-clip: padding-box;
        border-radius: 4px;
        width: 4px;
        //border-right: 3px solid transparent;
    }

    ::-webkit-scrollbar-button {
        width: 0;
        height: 5px;
        //display: none;
    }

    ::-webkit-scrollbar-corner {
        background-color: transparent;
    }

    .scroller {
        overflow-y: scroll;
        scrollbar-width: thin;
    }
}

html {
    height: 100%;
    width: 100%;
    box-sizing: border-box;
}

body {
    background-color: $white;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}*/
.empty-main {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.empty-logo-container {
  height: 20%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.empty-logo-container img {
  height: 60%;
  min-height: 40px;
}

.empty-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #002A75;
  color: #ffffff;
  height: 80%;
  width: 100%;
  position: relative;
  overflow: scroll;
  justify-self: flex-end;
  padding: 16px 24px;
}
.empty-inner p {
  text-align: center;
}
.empty-inner .top-border-colors {
  background-image: linear-gradient(to right, #c8c900 0%, #c8c900 12.5%, #cb0133 12.5%, #cb0133 25%, #0098d4 25%, #0098d4 37.5%, #a02383 37.5%, #a02383 50%, #006461 50%, #006461 62.5%, #fd0 62.5%, #fd0 75%, #f18e00 75%, #f18e00 87.5%, #0054a4 87.5%, #0054a4 100%);
  height: 8px;
  width: 100%;
  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 0;
  right: 0;
}
.empty-inner form {
  display: flex;
  flex-direction: column;
  width: 90%;
  max-width: 400px;
}
.empty-inner .empty-title {
  text-align: center;
  margin-top: 40px;
}
.empty-inner .empty-button {
  border: none;
  text-decoration: none;
  background-color: #ffffff;
  color: #002A75;
  padding: 8px 24px 8px 24px;
  margin: 0;
  width: fit-content;
  align-self: center;
}
.empty-inner .empty-button:hover {
  opacity: 0.5;
  transition-duration: 300ms;
}
.empty-inner .empty-button.text-blue {
  color: #002A75;
}
.empty-inner .empty-button.large {
  padding: 0;
  min-width: 350px;
  margin-bottom: 8px;
}
.empty-inner .empty-button.large input[type=radio] {
  display: none !important;
}
.empty-inner .empty-button.large input[type=radio]:checked + label {
  background-color: #002A75;
  filter: saturate(2);
  box-shadow: 0px 0px 10px rgba(0, 0, 15, 0.3);
}
.empty-inner .empty-button.large input[type=radio]:checked + label p {
  color: #ffffff;
}
.empty-inner .empty-button.large label {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 10px 16px;
}
.empty-inner .empty-button.large label p {
  margin: 0;
  text-align: start;
}
.empty-inner .empty-checkox-container {
  display: flex;
  align-items: center;
}
.empty-inner .empty-checkox-container input[type=checkbox] {
  height: 16px;
  width: 16px;
  border: none;
  margin: 0px 8px 0px 0px;
}
.empty-inner .empty-checkox-container label {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  .empty-inner {
    padding: 40px 64px;
  }
}
@media only screen and (min-width: 1024px) {
  .empty-inner {
    padding: 40px 200px;
  }
}
@media only screen and (min-width: 1200px) {
  .empty-inner .empty-title {
    margin-bottom: 24px;
  }
}
