/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.otp-input {
    /* width: 2em; */
    text-align: center;
    /* margin: 0 5px; */
}

.img-slect img {
    height: 5vmax;
}




.reg-icon label {
    position: relative;
    display: block;
    position: relative;
}

#myTabContent label {
    font-weight: 400;
    color: black;
}

#myTabContent i {
    font-size: 14px;
}


.reg-icon input[type="radio"] {
    appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
}


.reg-icon input[type="radio"]+span {
    display: block;
    background-color: transparent;
    border: 1px solid rgba(0, 0, 0, 0.311);
    transition: background-color 0.4s linear;
    padding: .4vmax 1vmax .1vmax 1vmax;
    border-radius: 5px;
}

.reg-icon input[type="radio"]+span h5 {
    color: rgba(0, 0, 0, 0.523);
    font-weight: 400;
    font-size: 16px;

}

.reg-icon input[type="radio"]:focus+span {
    box-shadow: 0 0 8px rgba(81, 203, 238, 1);
    border-color: rgba(81, 203, 238, 1);
}

.reg-icon input[type="radio"]:checked+span {
    border: 1px solid green;
    /* background-color: rgba(128, 128, 128, 0.144); */
}
.reg-icon input[type="radio"]:checked+span h5{
    color: green;
}
.reg-icon input[type="radio"]:checked+span i{
    color: green;
}

.reg-icon span i {
    color: rgba(0, 0, 0, 0.555);
    margin-top: -.4vmax;
}






.reg-icon input[type="checkbox"] {
    appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
}


.reg-icon input[type="checkbox"]+span {
    display: block;
    background-color: transparent;
    border: 1px solid rgba(0, 0, 0, 0.311);
    transition: background-color 0.4s linear;
    padding: .4vmax 1vmax .1vmax 1vmax;
    border-radius: 5px;
}

.reg-icon input[type="checkbox"]+span h5 {
    color: rgba(0, 0, 0, 0.523);
    font-weight: 400;

}

.reg-icon input[type="checkbox"]:focus+span {
    box-shadow: 0 0 8px rgba(81, 203, 238, 1);
    border-color: rgba(81, 203, 238, 1);
}

.reg-icon input[type="checkbox"]:checked+span {
    border: 1px solid green;
    /* background-color: rgba(128, 128, 128, 0.144); */
}
.reg-icon input[type="checkbox"]:checked+span h5{
    color: green;
}
.reg-icon input[type="checkbox"]:checked+span i{
    color: green;
}

.reg-icon span i {
    color: rgba(0, 0, 0, 0.555);
    margin-top: -.4vmax;
}





/* * Input form Style */



.input_wrap input,
.input_wrap select {
    border: 2px solid #afbdcf3e;
    border-radius: 5px;
    height: 47px;
    width: 300px;
    color: #000000;
    font-size: 14px;
    padding-left: 20px;
    box-shadow: none;
    width: 100%;
}

.input_wrap select {
    color: black;
    font-weight: 600;
}

/* Label style after Input feild is in focus. Can also use input:focus ~ label to select sibling. */

.input_wrap input:focus+label,
.input_wrap input:valid+label {
    font-size: 12px;
    color: #afbdcf;
    top: -10px;
    left: 10px;
    background: #ffffff;
    padding: 0px 5px 0px 5px;
}

.input_wrap {
    width: auto;
    height: auto;
    position: relative;
}




.input_wrap label {
    font-family: arial;
    font-size: 14px;
    color: black;
    padding: 14px;
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
    pointer-events: none;

}

.input_wrap input:focus {
    outline: none;
    border: 2px solid #afbdcf;
}

.resume-uplode input {
    display: none;
}