.active-dark {
    display: none;
}

a {
    color: var(--color-heading);
    text-decoration: none;
    outline: none;
}

.signin_form {
    height: 80%;
}

.btn_sign {
    width: 80%;
    border-radius: 25px;
    height: 52px;
}

.btns_sign {
    width: 80%;
    border: 1px solid black;
    border-radius: 25px;
    height: 52px;
}

.forget_password {
    color: #1A73E8;

}

.or-container {
    display: flex;
    align-items: center;
    margin-left: -121px;
    padding-top: 23px;
}

.or-container .or {
    position: relative;
    padding: 0 10px;
    font-weight: bold;
}

.or-container .or::before,
.or-container .or::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 230px;
    border-bottom: 1px solid rgb(184, 184, 184);
}

.or-container .or::before {
    left: 34px;
}

.or-container .or::after {
    right: 34px;
}

.st0 {
    fill: #1A73E8;
}

.st1 {
    fill: #cc35ea;
}

.st2 {
    fill: #4285F4;
}

.st3 {
    fill: #FBBC04;
}

.st4 {
    fill: #34A853;
}

.st5 {
    fill: #4CAF50;
}

.st6 {
    fill: #1E88E5;
}

.st7 {
    fill: #E53935;
}

.st8 {
    fill: #C62828;
}

.st9 {
    fill: #FBC02D;
}

.st10 {
    fill: #1565C0;
}

.st11 {
    fill: #2E7D32;
}

.st12 {
    fill: #F6B704;
}

.st13 {
    fill: #E54335;
}

.st14 {
    fill: #4280EF;
}

.st15 {
    fill: #34A353;
}

.st16 {
    clip-path: url(#SVGID_2_);
}

.st17 {
    fill: #188038;
}

.st18 {
    opacity: 0.2;
    fill: #FFFFFF;
    enable-background: new;
}

.st19 {
    opacity: 0.3;
    fill: #0D652D;
    enable-background: new;
}

.st20 {
    clip-path: url(#SVGID_4_);
}

.st21 {
    opacity: 0.3;
    fill: url(#_45_shadow_1_);
    enable-background: new;
}

.st22 {
    clip-path: url(#SVGID_6_);
}

.st23 {
    fill: #FA7B17;
}

.st24 {
    opacity: 0.3;
    fill: #174EA6;
    enable-background: new;
}

.st25 {
    opacity: 0.3;
    fill: #A50E0E;
    enable-background: new;
}

.st26 {
    opacity: 0.3;
    fill: #E37400;
    enable-background: new;
}

.st27 {
    fill: url(#Finish_mask_1_);
}

.st28 {
    fill: #FFFFFF;
}

.st29 {
    fill: #0C9D58;
}

.st30 {
    opacity: 0.2;
    fill: #004D40;
    enable-background: new;
}

.st31 {
    opacity: 0.2;
    fill: #3E2723;
    enable-background: new;
}

.st32 {
    fill: #FFC107;
}

.st33 {
    opacity: 0.2;
    fill: #1A237E;
    enable-background: new;
}

.st34 {
    opacity: 0.2;
}

.st35 {
    fill: #1A237E;
}

.st36 {
    fill: url(#SVGID_7_);
}

.st37 {
    fill: #FBBC05;
}

.st38 {
    clip-path: url(#SVGID_9_);
    fill: #E53935;
}

.st39 {
    clip-path: url(#SVGID_11_);
    fill: #FBC02D;
}

.st40 {
    clip-path: url(#SVGID_13_);
    fill: #E53935;
}

.st41 {
    clip-path: url(#SVGID_15_);
    fill: #FBC02D;
}

.eye-icon {
    position: absolute;
    margin-left: -30px;
    cursor: pointer;
    margin-top: 13px;
}

.signin {
    width: 80%;
}

.freesign {
    margin-top: -16px;
    margin-left: 104px;
    
}

.account {
    padding-top: 100px;
    margin-left: 68px;
}

/* / ------------------------Media Query-------------------- / */
/* / ********************************************************************************************************************* */
/* / --------------Desktop & Laptop------------------ / */
@media(min-width:992px )and (max-width:1394px) {
    .btn_sign {
        width: 97% !important;
        border-radius: 25px;
        height: 52px;
    }
}
@media(min-width:1399px )and (max-width:992px) {
    .btn_sign {
        width: 104% !important;
        border-radius: 25px;
        height: 52px;
    }
}
@media(min-width:1000px )and (max-width:1755px) {
    .freesign {
        margin-top: -16px;
        margin-left: 186px;
    }
    .postform{
    margin-top:44px;
 margin-left:75px;
}
    .account {
        padding-top: 100px;
        margin-left: 149px;
    }
    .btn_sign {
        /* width: 100%; */
        border-radius: 25px;
        height: 52px;
    }
    .btns_sign {
        /* width: 100%; */
        border: 1px solid black;
        border-radius: 25px;
        height: 52px;
    }
    .Trouble{
        margin-top:-75px;
        padding-bottom:22px;
        margin-left:248px;
    }
   

}
@media(min-width:992px) and (max-width:1399px) {
    .postform{
        margin-left: 8px !important;
    }
    .account {
        padding-top: 100px;
        margin-left: 54px !important;
}
.Trouble {
    margin-top: -75px;
    padding-bottom: 22px;
    margin-left: 206px !important;
}
.btn_sign {
    width: 100% !important;
    border-radius: 25px;
    height: 52px;
}
.signfree {
    margin-left: 181px !important;
    padding-top: 10px;
}
.btn_sign {
    width: 91% !important;
    border-radius: 25px;
    height: 52px;
}
.btns_sign {
    /* width: 100%; */
    border: 1px solid black;
    border-radius: 25px;
    height: 52px;
}
}

@media(min-width:1024px) {
    .freesign {
        margin-top: -16px;
        margin-left: 235px;
    }
    .activeli{
        margin-left: 793px
    }
    .postform{
    margin-top:44px;
     margin-left:75px;
}
    .account {
        padding-top: 100px;
        margin-left: 149px;
    }
    .btn_sign {
        width: 79% !important;
        border-radius: 25px;
        height: 52px;
    }
    .btns_sign {
        /* width: 100%; */
        border: 1px solid rgb(201, 194, 194);
        border-radius: 25px;
        height: 52px;
    }
    .logoimge{
        margin-left:63%;
        padding-top:10px;
    }
    /* .Trouble{
        margin-top:-75px;
        padding-bottom:22px;
        margin-left:230px;
    } */
    .signfree{
        margin-left: 230px;
        padding-top: 10px;
    }
    .imagrs{
        margin-top: -58px;
    }
   
}
/* / ********************************************************************************************************************* */
/* / -------------- Tablet------------------ / */
@media(min-width:992px) and (max-width:1023px) {
    .or-container .or::before,
    .or-container .or::after {
        content: '';
        position: absolute;
        top: 50%;
        width: 256px;
        border-bottom: 1px solid rgb(184, 184, 184);
    }
    .postform{
    margin-top:44px;
     margin-left:75px;
}
    .freesign {
        margin-top: -16px;
        margin-left: 104px;
    }

    .account {
        padding-top: 100px;
        margin-left: 68px;
    }

    .signin {
        width: 100%;
    }

    .btn_sign {
        width: 100%;
        border-radius: 25px;
        height: 52px;
    }

    .btns_sign {
        width: 100%;
        border: 1px solid black;
        border-radius: 25px;
        height: 52px;
    }
    .or-container {
        display: flex;
        align-items: center;
        margin-left: 15px;
        padding-top: 23px;
    }

}

@media(min-width:769px) and (max-width:991px) {
    .or-container .or::before,
    .or-container .or::after {
        content: '';
        position: absolute;
        top: 50%;
        width: 319px;
        border-bottom: 1px solid rgb(184, 184, 184);
    }

    .or-container {
        display: flex;
        align-items: center;
        margin-left: 15px;
        padding-top: 23px;
    }
    .postform{
    margin-top:44px;
     margin-left:75px;
}

    .freesign {
        margin-top: -16px;
        margin-left: 219px;
    }

    .account {
        padding-top: 100px;
        margin-left: 195px;
    }
    .signin {
        width: 100%;
    }
    .btn_sign {
        width: 73%;
        border-radius: 25px;
        height: 52px;
    }
    .btns_sign {
        width: 100%;
        border: 1px solid black;
        border-radius: 25px;
        height: 52px;
    }
    .logoimge{
        margin-left:5px;
    }
}
/* / ********************************************************************************************************************* */
/* / --------------Mobile------------------ / */
@media(max-width:768px) {
    .btn_sign {
        width: 100%;
        border-radius: 25px;
        height: 52px;
    }
    .btns_sign {
        width: 100%;
        border: 1px solid black;
        border-radius: 25px;
        height: 52px;
    }

    .or-container {
        display: flex;
        align-items: center;
        margin-left: -10px;
        padding-top: 23px;
    }
    .signin {
        width: 100%;
    }
    .or-container .or::before,
    .or-container .or::after {
        content: '';
        position: absolute;
        top: 50%;
        width: 229px;
        border-bottom: 1px solid rgb(184, 184, 184);
    }
    .postform{
    margin-top:44px;
     margin-left:-1px;
}
.logoimge{
    margin-left:5px;
}
}
@media(max-width:495px) {
    .btn_sign {
        width: 100%;
        border-radius: 25px;
        height: 52px;
    }
    .btns_sign {
        width: 100%;
        border: 1px solid black;
        border-radius: 25px;
        height: 52px;
    }
    .or-container {
        display: flex;
        align-items: center;
        margin-left: 14px;
        padding-top: 23px;
    }
    .signin {
        width: 100%;
    }
    .or-container .or::before,
    .or-container .or::after {
        content: '';
        position: absolute;
        top: 50%;
        width: 126px;
        border-bottom: 1px solid rgb(184, 184, 184);
    }
    .freesign {
        margin-top: -16px;
        margin-left: 14px;
    }
    .account {
        padding-top: 100px;
        margin-left: 49px;
    }
    .postform{
    margin-top:44px;
     margin-left:-1px;
}
.logoimge{
    margin-left:5px;
}
.Trouble{
    margin-top:-75px;
    padding-bottom:22px;
    margin-left:6px;
}
.signfree{
    margin-left: 6px;
    padding-top: 10px;
}
.activeli{
    margin-left: -6px
}
.imagrs{
    margin-top: 13px;
}
}

.input-containerr {
    position: relative;
    margin-bottom: 10px;
}
.input-containerr input {
    border: 1px solid rgb(207, 206, 206);
    border-radius: 9px;
    height: 44px;
    padding-left: 40px;
}
.input-containerr .fa {
    position: absolute;
    left: 10px;
    top: 17px;
    color: #aaa;
}
.form-control {
    display: inline !important;
}
.eye-icon {
    cursor: pointer;
}
.password-input {
    position: relative;
    display: flex;
    align-items: center;
}
.password-input input {
    padding-right: 30px; /* To make space for the icon */
}
.password-input .eye-icon {
    position: absolute;
    right: 10px;
}