/*-------------<font-size>----------- */
.f35 {
    font-size: 35px;
}

.f30 {
    font-size: 30px;
}

.f25 {
    font-size: 25px;
}

.f20 {
    font-size: 20px;
}

.f18 {
    font-size: 18px;
}

.f16 {
    font-size: 16px;
}

.f14 {
    font-size: 14px;
}

.f13 {
    font-size: 13px;
}

.f12 {
    font-size: 12px;
}

.f10 {
    font-size: 10px !important;
}

.f9 {
    font-size: 9px !important;
}

.f8 {
    font-size: 8px !important;
}

/*-------------<width>----------- */
.w100 {
    width: 100% !important;
}

.w90 {
    width: 90%;
}

.w80 {
    width: 80%;
}

.w70 {
    width: 70% !important;
}

.w60 {
    width: 60%;
}

.w50 {
    width: 50% !important;
}

.w45 {
    width: 45%;
}

.w40 {
    width: 40%;
}

.w35 {
    width: 35% !important;
}

.w30 {
    width: 30% !important;
}

.w25 {
    width: 25% !important;
}

.w20 {
    width: 20% !important;
}

.w15 {
    width: 15%;
}

.w10 {
    width: 10%;
}

.w550 {
    width: 550px !important;
}

.w96 {
    width: 96%;
}

.min_w80 {
    min-width: 80px;
}

.h100 {
    height: 100% !important;
}

.h60 {
    height: 60%;
}

.h50 {
    height: 50%;
}

.h40 {
    height: 40%;
}

.h30 {
    height: 30%;
}

.h20 {
    height: 20%;
}

.h90 {
    height: 90%;
}

.h94 {
    height: 94%;
}

.h96 {
    height: 96%;
}

.h330 {
    height: 330px !important;
}

.h_35 {
    height: 35px !important;
}

.w_f {
    width: fit-content;
}

.h_f {
    height: fit-content;
}

/*-------------<text_align>----------- */
.text_align-c {
    text-align: center;
}

.text_align-s {
    text-align: start !important;
}

.text_align-e {
    text-align: end;
}

/*-------------<position>----------- */
.pos {
    position: absolute;
}

.pos_r {
    position: relative;
}

.z_index {
    z-index: 100;
}

.L_10 {
    left: 10px;
}

.L_5 {
    left: 5px;
}

/*-------------<display__Box>----------- */
.flexbox {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.display {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.align-item-s {
    align-items: flex-start;
}

.align-content-s {
    align-content: flex-start;
}

.align-content-between {
    align-content: space-between;
}

.align-content-c {
    align-content: center;
}

.align-item-s {
    align-items: flex-start !important;
}

.align-item-e {
    align-items: flex-end;
}

.justify-content-around {
    justify-content: space-around;
}

.justify-content-between {
    justify-content: space-between;
}

.justify-content-evenly {
    justify-content: space-evenly;
}

.justify-flex-start {
    justify-content: flex-start;
}

.justify-flex-end {
    justify-content: flex-end;
}

.fl_d {
    display: flex;
}

.fl_w {
    flex-wrap: wrap;
}

.fl_gr {
    flex-grow: 1;
}

.B {
    font-weight: bolder;
}

/*-------------<rotate>----------- */

.rotate_90 {
    transform: rotate(90deg);
}

.rotate_180 {
    transform: rotate(180deg);
}

.rotate_270 {
    transform: rotate(270deg);
}

/*-------------<margin>----------- */

.mar_0 {
    margin: 0px !important;
}

.mar_10 {
    margin: 10px !important;
}

.marT_B5 {
    margin: 5px 0;
}

.marT_B10 {
    margin: 10px 0;
}

.marR_L10 {
    margin: 0 10px;
}

.marR_L5 {
    margin: 0 5px;
}

.mar_t50 {
    margin-top: 50px !important;
}

.mar_t20 {
    margin-top: 20px !important;
}

.mar_t10 {
    margin-top: 10px !important;
}

.mar_r10 {
    margin-right: 10px;
}

.mar_r15 {
    margin: 15px;
}

.mar_b50 {
    margin-bottom: 50px;
}

.mar_b20 {
    margin-bottom: 20px;
}

.mar_b10 {
    margin-bottom: 10px;
}

.mar_l {
    margin-left: 5px;
}

.mar_l20 {
    margin-left: 20px;
}

.marR_Lauto {
    margin: 0 auto;
}

/*-------------<padding>----------- */
.p_5 {
    padding: 5px;
}

.p_10 {
    padding: 10px;
}

/*-------------<border-radius>----------- */
.B_r100 {
    border-radius: 100%;
}

.B_r5 {
    border-radius: 5px;
}

.border_red {
    border: 1px solid var(--Col-Red);
}

.border_Owhite {
    border: 1px solid var(--Col-Opacity_White);
}

.border__orange {
    border: 1px solid var(--Col-Orange) !important;
}


/*-------------<box-shadow>----------- */

.Shadow_blue {
    box-shadow: 0px 0px 1px 1px #38cfff;
}

.Shadow_red {
    box-shadow: 0px 0px 1px 1px #df3d5a;
}

/*-------------<color>----------- */
.Col__Tem {
    color: var(--Tem-Btn) !important;
}

.Col__Orange {
    color: var(--Col-Orange) !important;
}

.Col__Wh {
    color: var(--Col-White);
}

.Col__Owhite {
    color: var(--Col-Opacity_White);
}

.Col_White_b {
    color: #e0fbfc;
}

.Col__Red {
    color: #D93200;
}

.Col__Blue {
    color: var(--Col-Blue);
}

.Col__Green {
    color: #7AC323;
}

.bg_border {
    background: var(--Border);
}

/*-------------<background>----------- */
.BG__Owhite {
    background: var(--Col-Opacity_White);
}

/*-------------<hover>----------- */
.hover {
    cursor: pointer;
    opacity: 0.8;
    transition: all ease-in-out 0.05s;
}

.hover:hover {
    opacity: 1;
}

/*-------------<opacity>----------- */
.op6 {
    opacity: 0.6;
}

.opMax {
    opacity: 1 !important;
}

/*------------------------------- */
/*------------------------------- */
/*---------------0  0------------ */
/*-------------<root>------------ */
:root {
    --BG_Body: #f8f8f8;
    --BG_header: #FFFFFF;
    --Color_Theme: #fe4d00;
    --Header_inp_Color: #8b8b8b;
    --Col-Yellow: #FFA800;
    --Color_Theme2: #fef0ea;
    --Col-Black: black;
    --Box_shadow: rgba(0, 0, 0, 0.03);
    --Black-op: #1A1A1A;
    --Col-Orange: #FF6000;
    --Col-Footer: #F3F3F3;
    --Col-Footer_top: #F3F3F3;
    --Col-Yellow_op: rgba(255, 198, 52, 0.50);
    --Border_inp_Login: #EBEBEB;
    --BG_inp_Login: #FBFBFB;
}