@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@300;400;500;600;700;900&display=swap');

body{
    font-family: 'Chakra Petch', sans-serif;
    background: #ececec;
}
.container{
    --bs-gutter-x: 1.5rem;
    padding-right: var(--bs-gutter-x, 1rem);
    padding-left: var(--bs-gutter-x, 1rem);
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.left-box {
    background: url(../images/auth/register_bg_img.png) no-repeat;
    background-size: cover;
}
.content-header h2 {
    font-size: 24px;
    color: #5c5768;
}
.content-header span {
    color: #5c5768;
}
/*------------ Login container ------------*/
.box-area{
    width: 1100px;
}

/*------------ Right box ------------*/
.right-box{
    padding: 40px 30px 40px 40px;
}
.featured-image .logo img {
    width: 25%;
    margin: 20px;
    cursor: pointer;
}
.featured-image .logo img:hover {
    transform: scale(1.1);
    transition: transform .3s;
}
.form-label {
    color: #6e697a;
   
}
.form-check-label {
    color: #6e697a;
    
}
.form-control:focus  {
    box-shadow: 0px 0px 10px #B08FF8;
    border: 1px solid #8654eb;
}
.form-select {
    color: #6e697a !important;
}
img,
svg {
  width: 15px;
}

label {
 font-size: 14px;
}
form span.error {
width: 100%;
font-size: 12px; }

form label.error {
    width: 100%;
    font-size: 12px; }

form .error:not(input) {
color: #ea5455; }

form input.error,
form input.error:focus {
border-color: #ea5455 !important; }

form textarea.error {
border-color: #ea5455 !important; }

form .select2.error + .select2-container--classic .select2-selection--single,
form .select2.error + .select2-container--default .select2-selection--single,
form .select2.error + .select2-container--classic .select2-selection--multiple,
form .select2.error + .select2-container--default .select2-selection--multiple {
border-color: #ea5455 !important; }

.was-validated .form-select:invalid:not([multiple]):not([size]),
.was-validated .form-select:invalid:not([multiple])[size='1'],
.form-select.is-invalid:not([multiple]):not([size]),
.form-select.is-invalid:not([multiple])[size='1'] {
background-position: right 1rem center, center right 2.5rem; }

/*------------ Custom Placeholder ------------*/
::placeholder{
    font-size: 16px;
}
.rounded-4{
    border-radius: 20px;
}
.rounded-5{
    border-radius: 30px;
}
/*------------ For small screens------------*/
@media only screen and (max-width: 991px){
     .box-area{
        margin: 0 10px;
     }
     .left-box{
        height: 90px;
        overflow: hidden;
     }
    
     .right-box{
        padding: 20px;
     }
     .featured-image .logo img {
        width: 15%;
    }

}
@media only screen and (max-width: 768px){
    .featured-image .logo img {
        width: 20%;
    }
   
}

@media only screen and (max-width: 430px){
    .container {
        --bs-gutter-x: 1rem;
        padding-right: var(--bs-gutter-x, 1rem);
        padding-left: var(--bs-gutter-x, 1rem);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .left-box {
        height: 70px;
        overflow: hidden;
     }
     .b_text {
        margin-right: 5px;
     }
}