#puforms-form {
    padding: 1rem;
}

#puforms-form  .form-group {
    margin-bottom:2rem;
}

#puforms-form  .btn-block {
    display: block;
    width: 100%;
}

#puforms-form  .hidden {
    display: none;
}

#puforms-form  .filtered {
    display: none;
}

#puforms-form  fieldset {
    margin-bottom: 2rem;
    border-bottom: 1px solid #ddd
}

#puforms-form  fieldset legend {
    margin-bottom: 1rem;
}

#puforms-form input[type=checkbox] {
    width: 1rem;
    height: 1rem;
}


.loading {
    position: relative
}

.loading:after {
    content: " ";
    height: 100%;
    width: 100%;
    z-index: 40;
    background: rgba(0,0,0,.2);
    position: absolute;
    top: 0;
    left: 0;
    display: block
}


option[disabled] {
    background-color: #fff;
    color: #333;
}

#puforms-admission .opt-group {
    text-transform: uppercase;
    font-weight: bold;
    background: whitesmoke;
    colo: #666;
}

/* Customize */ 

body {
    background-color: #3C3C3B;
}

body:before {
    content: "";
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    --background-overlay: '';
    background-image: url("../../public/img/pattern.svg");
    background-repeat: repeat;
    background-size: 33% auto;
    opacity: 0.05;
}

.container {
    position: relative;
    z-index: 100;
}

.logo {
    width: 100%;
    min-width: 300px;
    max-width: 500px;
    display: block;
    margin: 0 auto;
    padding-bottom: 50px;
}

.me-4 {
    margin-right: 0rem !important;
}

#puforms-form {
    padding: 50px;
    margin-bottom: 30px;
    min-width: 300px;
    background: #F2F3F5;
    color: #3C3C3B;
    font-family: "Roboto", Sans-serif;
}

#puforms-form #puforms-invitation {
    text-align: justify;
}

#puforms-form legend {
    font-size: 40px;
    font-weight: 800;
    font-family: "Roboto Condensed",Sans-serif;
    line-height: 35px;
    margin-top: 20px;
    text-transform: uppercase;
}

#puforms-form input {   
    border: 0;
    border-radius: 0;
}

#puforms-form input:focus:not(.is-valid):not(.is-invalid) {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0 rgba(13,110,253,.25);
}

#puforms-form select {   
    border: 0;
    border-radius: 0;
}

#puforms-form .form-select:focus:not(.is-valid):not(.is-invalid) {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0 rgba(13,110,253,.25);
}

#puforms-form  .form-check-input {
    background-color: #FFFFFF;
    border-radius: 50% !important;
}
#puforms-form  .form-check-input:checked {
    background-color: #3C3C3B;
}

#puforms-form label {
    color: #687C9D;
    
}

#puforms-form .btn-success {
    background-color: #FFCC00;
    color: #000000;
    font-weight: 600;
    font-family: "Roboto Condensed", Sans-serif;
    padding: 25px;
    border: 0;
    border-radius: 0;
    transition: all .5s;
    display: flex;
    justify-content: center;
    text-transform: uppercase;
}

#puforms-form .btn-success:hover {
    color: #FFFFFF;
    transform: translateY(-8px);
}

#puforms-form .btn-success:after {
    content: "";
    width: 28px;
    height: 28px;
    margin-left: 15px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="Vrstva_1" x="0px" y="0px" viewBox="0 0 34 34" style="enable-background:new 0 0 34 34;" xml:space="preserve"><style type="text/css">.st0{fill:%23FFFFFF;}</style><g id="Group_13"><path id="Path_2" class="st0" d="M17,1.5C8.4,1.5,1.5,8.4,1.5,17S8.4,32.5,17,32.5S32.5,25.6,32.5,17S25.6,1.5,17,1.5z M25.3,18.1 L25.3,18.1c-0.1,0.1,0.3-0.3-5.8,5.8c-0.7,0.7-1.7,0.7-2.4,0s-0.7-1.7,0-2.4l2.8-2.8H10c-0.9,0-1.7-0.8-1.7-1.7 c0-0.9,0.8-1.7,1.7-1.7h9.9l-2.8-2.8c-0.7-0.7-0.7-1.7,0-2.4c0.7-0.7,1.7-0.7,2.4,0c6.1,6.1,5.7,5.7,5.8,5.8 C25.8,16.6,25.8,17.5,25.3,18.1z"></path></g></svg>');
    background-repeat: no-repeat;
}

#puforms-form .puforms-consents {
    margin-top: 60px;
}

#puforms-form .puforms-consents label {
    color: #03245B;
}

#puforms-form .alert {
    border: 0;
}

@media only screen 
  and (max-device-width: 736px) {

  body:before {
      background-size: 70% auto;
  }

  .logo {
      padding: 0 40px 40px;
  }
  
  #puforms-form legend {
      font-size: 34px;
  }

}

@media only screen 
  and (max-device-width: 480px) {
  
  body:before {
      background-size: 150% auto;
  }
  
  .logo {
      padding: 0 30px 30px;
  }
  
  #puforms-form {
      padding: 30px;
  }
  
  #puforms-form legend {
    font-size: 28px;
  }

  #puforms-form .btn-success {
     white-space: nowrap;
     font-size: 17px;
     padding: 20px;
  }

}