body{padding: 0;margin: 0;
    font-family: 'Playfair Display', serif;
    background-color: #ffffff !important;
    }
.form-container{display: flex;}
.form-banner{position: relative; flex-basis: 40%;height: 100vh;}
.form-banner img{position: relative; width: 100%;height: 100vh;object-fit: cover;display:block;}
.event-info{position: absolute;top:0;display: flex;background: linear-gradient(180deg, rgba(255, 255, 255, 0.71) 68.38%, rgba(255, 255, 255, 0.00) 98.71%);
    right: 0;
    left: 0;
    height: 197px;
    align-items: flex-start;
    justify-content: center;}
.event-info .logo img{width: 120px;height: 120px;display: block;}
.event-details{text-align: center;color: #25284B;}
.event-details h1{font-weight: 700;margin-bottom: 0;font-size: 30px;}
.event-details h3{font-family: 'Quando', serif;font-weight: 400;font-size: 20px;margin:3px auto 8px;}
.event-details h6{font-family: 'Quando', serif;font-size: 14px;font-weight: 400;margin:3px auto 8px;}
/* .form-banner::after{position: absolute;
    content: '';
    left: 0;
    background-image: url(../images/job-fair-banner.png);
    width: 100%;
    height: 100vh;
    background-size: cover;} */
.form-content{flex-basis: 60%;background-image: url(../images/right-bg.png);background-size: cover;
background-repeat: no-repeat;}
.form-content h2{text-align: center;font-size: 28px;font-weight: 700;}
.form-block{font-family: 'Roboto', sans-serif;padding-right: 46px;height:calc(90vh - 100px);overflow-y:scroll;}

.form-block h3{font-size: 24px;color: #25284B;font-weight:700;}
.form-row{display: flex;width: 100%;}
.col-half{position: relative;display: flex;flex-direction: column;flex-basis: 50%;margin-right: 44px;margin-bottom: 20px;}
.col-half:last-child{margin-right: unset;}
.col-full{position: relative;display: flex;flex-direction: column;flex-basis: 100%;margin-bottom: 15px;}
.col-half input,.col-full input{height: 36px;border: unset;border-bottom: 1px solid #616161;}
.col-half select{height: 38px;border: unset;border-bottom: 1px solid #616161;cursor: pointer;}
.col-half input:focus,.col-full input:focus,.col-half select:focus{outline: unset;}
label span{color:red;}
.col-half input + label,.col-full input + label,.work-location input + label,.vacancies input + label{
    position: absolute;
    left: 0px;
    top: 13px;
    transition: 0.5s;
    font-size: 14px;
    font-weight: 400;
    background-color: #fff;color:#616161;}

.err{font-size: 12px;color:red;margin-top: 2px;}

.col-half input:focus + label,
.col-half input:not(:placeholder-shown) + label,
.col-full input:focus + label,
.col-full input:not(:placeholder-shown) + label{
  top: -8px !important;
  font-size: 12px;
  left: 0px;
  background: white;
  padding: 1px;
}

.col-half input,.col-half select{width: 100%;}
.floating-select ~ .floating-select-label {
    position: absolute;
    left: 0px;
    top: 13px;
    transition: 0.5s;
    font-size: 14px;
    font-weight: 400;
    background-color: #fff;color:#616161;
  }

  .floating-select[value=""]:focus ~ .floating-select-label {
    position: absolute;
    top: 1px!important;

  }

  .floating-select:not([value=""]):valid ~ .floating-select-label{
    position: absolute;
    top: -10px!important;
    font-size: 12px;
    background: white;
    padding: 1px;
    }

    .iti input, .iti input[type=text], .iti input[type=tel]{width: 100%;}
    .iti--separate-dial-code .iti__selected-flag{background-color: unset!important;padding: 0 6px 0 1px!important;}
    .iti--allow-dropdown + label {
        position: absolute;
        left: -1px;
        top: -8px;
      transition: 0.5s;
    font-size: 14px;
    font-weight: 400;
    background-color: #fff;color:#616161;
      }

    .action-button{display: flex;justify-content: flex-end;margin-top: 30px;}
    .action-button button{padding: 10px 35px;border:1px solid #25284B;border-radius: 3px;cursor: pointer;}
    .action-button button:nth-child(1){background-color:white;color:#25284B;margin-right: 37px;}
    .action-button button:nth-child(2){background-color:#25284B;color: white;}

    .work-location, .vacancies{position: relative;}
    .work-location{flex-basis: 40%;margin-right: 25px;}
    .work-location input, .vacancies input{width: 100%;}

    .vacancies{flex-basis: 30%;margin-right: 25px;}
    .repeater-action{flex-basis: 20%;display: flex;}
    .repeater-action .add{margin-right: 12px;}
    .repeater-action .add,.repeater-action .remove{background-color: #25284B;
        color: white;
        border-radius: 50%;
        width: 15px;
        height: 15px;
        padding: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 12px;
        cursor: pointer;}
    

 .snack-bar-container{position:fixed;left: 0;right:0;bottom: 0;top:0;}
 .snack-bar-message{position: absolute;
    z-index: 4080;
    color: white;
    padding: 2px 18px 3px 20px;
    top: 110px;
    right: 42px;
    border-radius: 3px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    align-items: center;
    display: flex;
    background-color: #28a745;}
.close-bar{margin-left: 12px;color:black;cursor: pointer;}
  

/* media query */
@media only screen and (max-width: 768px) {
    .form-container{flex-direction: column;}
    .form-banner{display: none;}
    .form-block{padding-left: 46px;}
    .form-row{flex-direction: column;}
    .col-half,.work-location,.vacancies{flex-basis: 100%;margin-right: unset;margin-bottom: 22px;}
    .form-content{background-image:unset!important;}
}