:root {
   --darkblue: #0284d0;
   --lightblue: #2596be;
   --darkgrey: #484b59;
   --lightgrey: #808080;
   --darkpurple: #8a378c;
   --poppins: 'Poppins', sans-serif;

}



body {
   background-color: #b6f5ff;
}

.main-form {
   width: 92%;
   margin: auto;
   font-family: var(--poppins);
   background-color: white;
   min-height: 450px;
   border-radius: 8px;
   box-shadow: 0px 10px 20px 1px var(--darkblue);
   margin-top: 20px;

}

.form-sub-heading {
   text-align: center;
   padding: 20px;
   font-size: 18px;
}

.bg-info {
   background-color: rgb(38, 171, 192) !important;
}


input:checked {
   background-color: rgb(28, 129, 144) !important;
}

.field {
   padding: 12px 0 !important;
}

.field-heading {
   /* color:  rgb(28, 129, 144); */
   color: var(--lightgrey);
   font-size: calc(14px + 0.3vw);
   font-weight: 500;
   padding: 0;
}

.field-imp {
   color: rgb(211, 54, 15)
}

#add-edu-details {
   width: 100%;
   height: 150px;
   background-color: rgba(249, 239, 252, 0.733);
   padding: 10px 8px;

}

#edu-details-button {
   width: 40%;
   height: 130px;
}

.modal-field-inp {
   width: 100%;
   /* background-color:  rgb(227, 238, 249);
    border-radius: 20px; */
   height: 50px;
}

.compulsary {
   color: var(--darkblue);
}


input[type='checkbox'] {
   accent-color: rgb(246, 114, 151);
   outline: 1px solid purple;
}

input[type='checkbox']:checked {
   accent-color: rgb(246, 114, 151);
   outline: 0;
}

.field-info {
   color: var(--lightblue);
   font-size: 14px;
}

.inp-field {
   padding-left: 50px;
}


.dtr-data {
   appearance: auto;
   -webkit-writing-mod: horizontal-tb;
   width: 10%;
}

#country-code-inp {
   padding: 5px;

}

.captcha-img {
   width: 90%;
}


.captcha-img img {
   height: 40px;
}

.captcha {
   margin-top: 10px;
}

#password-visible {
   position: relative;
   bottom: 43px;
   left: 86%;
   background-color: white;
   padding: 2% 2.5%;
}

.page-user-title {
   text-align: center;
   font-size: 22px;
}

.table-top-btn {
   border: 1px solid rgb(185, 185, 185);
   background-color: white;
   border-radius: 3px;
   margin-top: 8px;

}

#table-bottom-row-1 {
   text-align: left;
}

#table-bottom-row {
   text-align: right;
}

#table-top-row {
   text-align: right;
}

/* purple theme css start */
body {
   background-color: #D3CCE3;
}

.main-form {
   box-shadow: 0px 10px 20px 1px var(--darkpurple);
}

.compulsary {
   color: var(--darkpurple);
}

.main-form .container .row {
   justify-content: center;
}

/* .row>* {
   width: 50%;
   ;
} */

#registration-title {
   background-color: #8a378c !important;
}

#fb-reg-btns-div {
   display: flex;
   flex-direction: column;
   align-items: center;
}

#send-otp-button,
#fb-reg-sub-btn1,
#fb-reg-sub-btn2 {
   background-color: #8a378c;
   border: 1px solid #8a378c;
   color: white;
}

#send-otp-button:hover,
#fb-reg-sub-btn1:hover,
#fb-reg-sub-btn2:hover {
   background-color: #a743a8;
   border: 1px solid #a743a8;
   color: white;
}

#fb-reg-login-btn {
   border: 1px solid #8a378c;
   color: #8a378c;
}

#fb-reg-login-btn:hover {
   border: 1px solid #8a378c;
   color: white;
   background-color: #8a378c;
}

.progress-bar {
   background-color: #8a378c !important;
}

.progress-bar-circle {
   background-color: #8a378c !important;
}


/* purple theme css end */

/* #fb-reg-inst-div .row,
#fb-reg-participant-div .row,
#fb-reg-course-div .row,
#fb-reg-sem-div .row,
#fb-reg-disc-div .row,
#fb-reg-roll-div .row,
#fb-reg-dob-div .row,
#fb-reg-mob-div .row,
#fb-reg-email-div .row,
#fb-reg-fname-div .row,
#fb-reg-lname-div .row,
#fb-reg-gender-div .row {
   padding: 0 !important;
} */

@media screen and (max-width: 800px) {
   .main-form {
      width: 80%;
   }

   #table-bottom-row {
      text-align: center;
   }

   #table-bottom-row-1 {
      text-align: center;
   }

   #table-top-row {
      text-align: center;
   }

}

@media screen and (max-width: 600px) {
   .main-form {
      width: 90%;
   }

   #r1-table {
      font-size: 12px !important;
   }
}