:root {
  --brandColor: hsl(166, 67%, 51%);
  --background: rgb(247, 247, 247);
  --textDark: hsla(0, 0%, 0%, 0.66);
  --textLight: hsla(0, 0%, 0%, 0.33);
}

html, body {
    font-family: Exo2,-apple-system,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 16px;
    color: #000;
    background: var(--background);
    height: 100vh;
}

@font-face {
  font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  /* For IE6-8 */
  src: url(/assets/material-icons/iconfont/MaterialIcons-Regular.eot);
  src: local("Material Icons"), local("MaterialIcons-Regular"),
    url(/assets/material-icons/iconfont/MaterialIcons-Regular.woff2) format("woff2"),
    url(/assets/material-icons/iconfont/MaterialIcons-Regular.woff) format("woff"),
    url(/assets/material-icons/iconfont/MaterialIcons-Regular.ttf) format("truetype");
}

a {
    color: #197d78;
}

.material-icons {
  font-family: "Material Icons";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
}

.dropzone {
  background-color: var(--background);
  border: 1px dashed var(--brandColor);
  border-radius: 5px;
  color: var(--brandColor);
  cursor: pointer;
  max-width: 300px;
  padding: 5px;
  text-align: center;
}

.validation {
   margin-top: 5px;
}

.validation,
.has-text-danger{
    color: #e71313;

}

.register {
  margin-top: 3rem;
  background: white;
  border-radius: 10px;
}

a {
    color: #197D78;
}


.right,
.left {
    border: 2px solid #197D78;
}


.right {
    padding: 4.5rem;
}

.left {
    padding: 1.5rem;
    margin-right: 1rem;
    border-right: 5px solid var(--background);
    text-align: center;
    border: 2px solid #197D78;
}

.left img {
    width: 25%;
    margin-top: 3rem;
}
    
.right .title {
  font-weight: 800;
  letter-spacing: -1px;
}

input:focus {
  border-color: var(--brandColor) !important;
  box-shadow: 0 0 0 1px var(--brandColor) !important;
}

.toplogo {
    text-align: center;
    margin-bottom: 3ex;
}

.toplogo img {
  width: 300px;
}

.alreadyregistered {
    margin-top: 6rem;
    padding: 1ex;
}


.alreadyregistered > div:first-child {
    background-color: #207D90 !important;
    padding: 15px;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    color: #fff;
}

.alreadyregistered div:nth-child(2) {
    background-color: #207d908f;
    padding: 25px 30px;
    font-size: 16px;
    color: #000;
}

.alreadyregistered .rc-hyperlink-href-wrapper {
    width: 100%;
}

.alreadyregistered .rc-hyperlink-href-wrapper a {
    margin-top: 2ex;
    margin-bottom: 1ex;
    padding: 0.5ex 1ex 0.5ex 1ex;
    text-decoration: none;
    text-align: center;
    color: 207d90 !important;
    background-color: #fff;
    width: 100%;
    display: block;
    font-weight: bold;
    font-size: 16px;
}

.required {
    color: red;
    margin-right: 1ex;
}

.required::before {
    content: "*";
}

.langselect {
    margin-top: 2ex;
    text-align: right;
    font-size: 16px;
}

.langselect > span {
    margin-left: 0.5em;
    margin-right: 0.5em; 
}

h1 {
    text-align: center;
}

li {
    padding-left: 1em;
}

.pwvisible {
    margin-left: 0.5em;
}

.input, .select select, .textarea{
    border-color: #9b9292;
}

.chosen-container-single .chosen-single {
  border: 1px solid #9b9292;
}

.alreadyregistered > div:first-child {
    background-color: #f9b122;
}

.alreadyregistered .rc-hyperlink-href-wrapper a {
    border-radius: 10px;
}

.tac {
    font-style: italic;
    color: black;
}

.button.is-primary {
    background-color: #00b050;
    border-color: transparent;
    color: #fff;
}

.button.is-primary[disabled], fieldset[disabled] .button.is-primary {
    background-color: #00b050;
    border-color: transparent;
    box-shadow: none;
}
