:root {
    --primaryColor: rgba(0, 126, 148, 1);
    --white: #ffffff;
  }
  /* common desing */
  .primary_bg{
    background-color: rgba(0, 126, 148, 1);
    color: white;
  }
  .primary_bg:hover{    
    background-color: rgb(41, 183, 208);
    color: white;
  }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}
.font_14{
    font-size: 14px;
}
.font_10{
    font-size: 10px;
}
body {
    position: relative;
    padding: 0 !important;
    overflow-x: hidden;
}
fieldset{
    border: 1px solid !important;
    border-color: #cacaca !important;
    padding-left: 20px !important;
    padding-right: 20px;
    margin-bottom: 25px;
    padding-top: 10px;
}
p.invalid-feedback{
    font-size: 12px;
    margin: 0;
    display: block;
}
/* login */
.add_more_login_tab{
    width: 88px;
}
.clickable_login_area{
    width: 92%;
}
.login_user_name{
    font-size: 11px;
    font-weight: 500px;
    padding: 2px 0;
    font-weight: 500 !important;
}
.login_user_img{
    width: 88px;
    height: 78px;
}
.user_name_area{
    padding: 1px 0;
}
.redfox_logo_for_login{
    width: 170px;
    height: auto;
}
.clr_div{
    /* background-color: var(--primaryColor); */
     background-color: rgb(78 154 167);
    min-height: calc(100vh);
    display: flex;
    align-items: center;
    justify-content: end;
}
.login_part_one{
    border: 10px solid rgb(112, 172, 183);
    border-radius: 34px !important;
    border-right: unset;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    box-shadow: 13px 5px 8px 5px #393636;
    clip-path: inset(0px 0px -12px 0px);
    width: 60%;
    /*  */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.login_part_two{
    width: 60%;
    border: 10px solid rgb(253, 255, 255);
    border-radius: 34px !important;
    border-left: unset;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    box-shadow: 5px 8px 6px 3px #9d9d90;
}
.login_part_two label{
    font-size: 14px;
}
/* .pridesys_logo{
    width: 150px;
    height: auto;
} */
.pridesys_logo_signup{
    width: auto;
    height: 3rem;
}
.pridesys_logo_for_login{
    width: 120px;
    height: auto;
}
.login_btn{
    background-color: var(--primaryColor);
    color: white;
    padding: 4px 15px;
    font-size: 0.88rem;
}
.login_btn:hover{
    background-color: rgb(47, 153, 171);
    color: white;
}
.signup_link{
    font-size: 0.85rem;
}
.login .div_height{
    height: auto;
}
.login_pridesupport_logo{
    width: 218px;
    height: auto;
}
.pride_support_logo_div img{
    width: 132px;
}
/* signup new design */

.signup_warp_area .form-control {
    font-size: 0.78rem;
 } 
.signup_warp_area .form-control:focus {
    box-shadow: unset;
}
.signup_warp_area .form-select:focus {
    box-shadow: unset;
}
.redfox_logo_signup img{
    width: 10rem;
}
/* signup */
.register_warp .form-select:focus {
    box-shadow: unset;
}
.register_area_warp .div_height{
    height: auto;
}
.register_warp label{
    margin-bottom:4px;
    position:relative;
    border-bottom:1px solid #ddd;
}
.register_warp input, .register_warp select{
    width:100%;
    padding:10px 0px;
    margin-top:12px;
    border:none;
    outline:none;
}
.register_warp select{
    width: 200px;
    -moz-appearance: none;
    /* for Chrome */
    -webkit-appearance: none;
}
.register_warp input::placeholder{
    opacity:0;
}
.register_warp  span{
    position:absolute;
    top:0;
    left:0;
    transform:translateY(30px);
    font-size:14px;
    font-weight: 600;
    transition-duration:300ms;
    color: #848481;
}
.register_warp  label:focus-within > span,
input:not(:placeholder-shown) + span{
    color:var(--primaryColor);
    transform:translateY(0px);
}

.register_warp  label:focus-within > span,
select:not(:placeholder-shown) + span{
    /*color:var(--primaryColor);*/
}

.pridesupport_logo{
    width: 140px;
    margin: 0 auto;
    display: block;
}