﻿

/*ALIGN*/
.align-center {
    display: flex;
    justify-content: center;
    align-items: center;
}
.align-start {
    display: flex;
    justify-content: start;
    align-items: center;
}
.align-end {
    display: flex;
    justify-content: end;
    align-items: center;
}

.text-align-center {
    text-align: center;
}
.text-align-left {
    text-align: left;
}
.text-align-right {
    text-align: right;
}


/*HEIGHT*/
.height-1vh {
    height: 1vh;
}

.height-2vh {
    height: 2vh;
}

.height-3vh {
    height: 3vh;
}

.height-4vh {
    height: 4vh;
}

.height-5vh {
    height: 5vh;
}

.height-6vh {
    height: 6vh;
}

.height-7vh {
    height: 7vh;
}

.height-8vh {
    height: 8vh;
}

.height-9vh {
    height: 9vh;
}

.height-10vh {
    height: 10vh;
}

.height-12vh {
    height: 12vh;
}
.height-13vh {
    height: 13vh;
}

.height-14vh {
    height: 14vh;
}

.height-15vh {
    height: 15vh;
}

.height-16vh {
    height: 16vh;
}

.height-18vh {
    height: 18vh;
}

.height-19vh {
    height: 19vh;
}

.height-20vh {
    height: 20vh;
}

.height-21vh {
    height: 21vh;
}

.height-22vh {
    height: 22vh;
}

.height-23vh {
    height: 23vh;
}

.height-24vh {
    height: 24vh;
}

.height-25vh {
    height: 25vh;
}

.height-26vh {
    height: 26vh;
}

.height-27vh {
    height: 27vh;
}

.height-28vh {
    height: 28vh;
}

.height-30vh {
    height: 30vh;
}

.height-32vh {
    height: 32vh;
}

.height-34vh {
    height: 34vh;
}

.height-35vh {
    height: 35vh;
}

.height-36vh {
    height: 36vh;
}

.height-37vh {
    height: 37vh;
}

.height-38vh {
    height: 38vh;
}

.height-40vh {
    height: 40vh;
}

.height-42vh {
    height: 42vh;
}

.height-44vh {
    height: 44vh;
}

.height-45vh {
    height: 45vh;
}

.height-50vh {
    height: 50vh;
}

.height-60vh {
    height: 60vh;
}

.height-68vh {
    height: 68vh;
}

.height-70vh {
    height: 70vh;
}

.height-80vh {
    height: 80vh;
}

.height-90vh {
    height: 90vh;
}

.height-92vh {
    height: 92vh;
}

.height-93vh {
    height: 93vh;
}

.height-95vh {
    height: 95vh;
}

.height-100vh {
    height: 100vh;
}


/*WIDTH*/
.width-1vh {
    width: 1vh;
}

.width-2vh {
    width: 2vh;
}

.width-3vh {
    width: 3vh;
}

.width-4vh {
    width: 4vh;
}

.width-5vh {
    width: 5vh;
}

.width-6vh {
    width: 6vh;
}

.width-7vh {
    width: 7vh;
}

.width-8vh {
    width: 8vh;
}

.width-9vh {
    width: 9vh;
}

.width-10vh {
    width: 10vh;
}

.width-13vh {
    width: 13vh;
}

.width-12vh {
    width: 12vh;
}

.width-15vh {
    width: 15vh;
}

.width-16vh {
    width: 16vh;
}

.width-18vh {
    width: 18vh;
}

.width-19vh {
    width: 19vh;
}

.width-20vh {
    width: 20vh;
}

.width-21vh {
    width: 21vh;
}

.width-22vh {
    width: 22vh;
}

.width-23vh {
    width: 23vh;
}

.width-24vh {
    width: 24vh;
}

.width-25vh {
    width: 25vh;
}

.width-26vh {
    width: 26vh;
}

.width-27vh {
    width: 27vh;
}

.width-28vh {
    width: 28vh;
}

.width-30vh {
    width: 30vh;
}

.width-32vh {
    width: 32vh;
}

.width-34vh {
    width: 34vh;
}

.width-35vh {
    width: 35vh;
}

.width-37vh {
    width: 37vh;
}

.width-38vh {
    width: 38vh;
}

.width-40vh {
    width: 40vh;
}

.width-42vh {
    width: 42vh;
}

.width-44vh {
    width: 44vh;
}

.width-45vh {
    width: 45vh;
}

.width-50vh {
    width: 50vh;
}

.width-60vh {
    width: 60vh;
}

.width-68vh {
    width: 68vh;
}

.width-70vh {
    width: 70vh;
}

.width-80vh {
    width: 80vh;
}

.width-90vh {
    width: 90vh;
}

.width-93vh {
    width: 93vh;
}

.width-100vh {
    width: 100vh;
}

.media-middle {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.media-middle-start {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
}

.media-middle-end {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    flex-direction: column;
}


.line-height-10 {
    line-height: 10px
}
.line-height-12 {
    line-height: 12px
}
.line-height-13 {
    line-height: 13px
}

.line-height-15 {
    line-height: 15px
}

.line-height-20 {
    line-height: 20px
}

.line-height-26 {
    line-height: 26px
}

.line-height-30 {
    line-height: 30px
}

.line-height-40 {
    line-height: 40px
}



/*ROUND CIRCLE*/
.round-20 {
    width: 20px;
    height: 20px;
    border-radius: 50%;
}

.round-30 {
    width: 30px;
    height: 30px;
    border-radius: 50%;
}

.round-32 {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}

.round-40 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.round-50 {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.round-60 {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.round-80 {
    width: 80px;
    height: 80px;
    border-radius: 50%;
}


/*MARGIN*/
.margin-top-2 {
    margin-top: 2px
}
.margin-top-5 {
    margin-top: 5px
}

.margin-top-10 {
    margin-top: 10px
}

.margin-top-12 {
    margin-top: 12px
}

.margin-top-15 {
    margin-top: 15px
}

.margin-top-20 {
    margin-top: 20px
}

.margin-top-30 {
    margin-top: 30px
}

.margin-top-50 {
    margin-top: 50px
}

.margin-top-70 {
    margin-top: 70px
}

.margin-top-100 {
    margin-top: 100px
}

.margin-top-150 {
    margin-top: 150px
}

.margin-top-200 {
    margin-top: 200px
}

.margin-top-240 {
    margin-top: 240px
}

.margin-top-260 {
    margin-top: 260px
}

.margin-top-300 {
    margin-top: 300px
}

.margin-left-2 {
    margin-left: 2px
}

.margin-left-3 {
    margin-left: 3px
}

.margin-left-5 {
    margin-left: 5px
}

.margin-left-10 {
    margin-left: 10px
}

.margin-left-15 {
    margin-left: 15px
}



.margin-right-2 {
    margin-right: 2px
}

.margin-right-3 {
    margin-right: 3px
}

.margin-right-5 {
    margin-right: 5px
}

.margin-right-10 {
    margin-right: 10px
}

.margin-right-15 {
    margin-right: 15px
}

.margin-right-20 {
    margin-right: 20px
}

.margin-right-30 {
    margin-right: 30px
}



.margin-bottom-5 {
    margin-bottom: 5px
}

.margin-bottom-10 {
    margin-bottom: 10px
}

.margin-bottom-15 {
    margin-bottom: 15px
}

.margin-bottom-20 {
    margin-bottom: 20px
}

.margin-bottom-30 {
    margin-bottom: 30px
}


/*PADDING*/
.padding-top-2 {
    padding-top: 2px;
}

.padding-top-3 {
    padding-top: 3px;
}

.padding-top-5 {
    padding-top: 5px;
}

.padding-top-10 {
    padding-top: 10px;
}


.padding-right-2 {
    padding-right: 2px;
}

.padding-right-5 {
    padding-right: 5px;
}

.padding-right-10 {
    padding-right: 10px;
}

.padding-right-15 {
    padding-right: 15px;
}

.padding-right-20 {
    padding-right: 20px;
}

.padding-right-30 {
    padding-right: 30px;
}



.padding-left-2 {
    padding-left: 2px;
}

.padding-left-5 {
    padding-left: 5px;
}

.padding-left-10 {
    padding-left: 10px;
}

.padding-left-15 {
    padding-left: 15px;
}

.padding-bottom-3 {
    padding-bottom: 3px;
}

.padding-bottom-5 {
    padding-bottom: 5px;
}

.padding-bottom-10 {
    padding-bottom: 10px;
}


.padding-5 {
    padding: 5px;
}



/*FONT SIZE*/
.text-7 {
    font-size: 7px;
}

.text-8 {
    font-size: 8px;
}

.text-9 {
    font-size: 9px;
}

.text-10 {
    font-size: 10px;
}

.text-11 {
    font-size: 11px;
}

.text-12 {
    font-size: 12px;
}

.text-13 {
    font-size: 13px;
}

.text-14 {
    font-size: 14px;
}

.text-15 {
    font-size: 15px;
}

.text-16 {
    font-size: 16px;
}

.text-18 {
    font-size: 18px;
}

.text-20 {
    font-size: 20px;
}

.text-22 {
    font-size: 22px;
}

.text-24 {
    font-size: 24px;
}

.text-26 {
    font-size: 26px;
}

.text-28 {
    font-size: 28px;
}

.text-30 {
    font-size: 30px;
}

.text-36 {
    font-size: 36px;
}
.text-40 {
    font-size: 40px;
}

.text-44 {
    font-size: 44px;
}

.text-50 {
    font-size: 50px;
}

.text-54 {
    font-size: 54px;
}

.text-60 {
    font-size: 60px;
}

.text-70 {
    font-size: 70px;
}

/*FONT WEIGHT*/
.weight-500 {
    font-weight: 500;
}

.weight-600 {
    font-weight: 600;
}

.weight-700 {
    font-weight: 700;
}

.weight-800 {
    font-weight: 800;
}



/*FONT COLOR*/
.color-black {
    color: black
}

.color-white {
    color: white
}

.color-whitesmoke {
    color: whitesmoke
}

.color-red {
    color: #ff1111
}

.color-yellow {
    color: #ffd800
}

.color-lightgrey {
    color: #d5d5d5
}

.color-darkgrey {
    color: #484848
}

.color-grey {
    color: #9c9c9c
}

.color-green {
    color: #27c24c
}

.color-blue {
    color: #343398
}

.color-orange {
    color: #ffc200
}


/*WIDTH*/
.width-100 {
    width: 100px
}

.width-200 {
    width: 200px
}

.width-250 {
    width: 250px
}

.width-300 {
    width: 300px
}

.width-400 {
    width: 400px
}

.width-500 {
    width: 500px
}

.width-65-p {
    width: 65%;
}
.width-70-p {
    width: 70%;
}
.width-100-p {
    width: 100%;
}


/*BACKGROUND COLOR*/
.bg-black {
    background: black;
}

.bg-white {
    background: white;
}

.bg-whitegrey {
    background: #f8f8f8;
}

.bg-lightgrey {
    background: #cbcbcb;
}

.bg-darkgrey {
    background: #484848;
}

.bg-green {
    background: #27c24c;
}

.bg-red {
    background: #f30909;
}

.bg-darkblue {
    background: #06485c;
}

.bg-blue {
    background: #3986fe;
}

.bg-lightblue {
    background: #5394fe;
}


.bg-red-transparent {
    background: #ff000039;
}

.bg-green-transparent {
    background: #eafff4
}

.bg-blue-transparent {
    background: #c7e0f6
}

.bg-yellow-transparent {
    background: #fff9d4
}

.bg-grey-transparent {
    background: #d5d5d5
}

.bg-orange-transparent {
    background: #fef4df
}

.bg-darkred-transparent {
    background: #ff1111
}

.bg-darkyellow-transparent {
    background: #ffd800
}

.bg-darkgreen-transparent {
    background: #27c24c
}

.border-bottom {
    border-bottom: 1px solid #efefef;
}

.border-bottom_Dark {
    border-bottom: 1px solid #a3a3a3;
}

.border-bottom_light {
    border-bottom: 1px solid #e5e5e5;
}

.border-top {
    border-top: 1px solid #dcdcdc;
}

.table-border-right-light {
    border-right: 1px solid #d5d5d5
}

.table-border-left-light {
    border-left: 1px solid #d5d5d5
}

.table-border-bottom-light {
    border-bottom: 1px solid #d5d5d5
}

.table-border-top-light {
    border-top: 1px solid #d5d5d5
}

.table-border-right-dark {
    border-right: 1px solid #3e3e3e
}

.table-border-left-dark {
    border-left: 1px solid #3e3e3e
}

.table-border-bottom-dark {
    border-bottom: 1px solid #3e3e3e
}

.table-border-top-dark {
    border-top: 1px solid #3e3e3e
}

.table-border-dark {
    border: 1px solid #3e3e3e
}


.textlimit_130 {
    white-space: nowrap;
    width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.textlimit_170 {
    white-space: nowrap;
    width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.textlimit_250 {
    white-space: nowrap;
    width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.textlimit_270 {
    white-space: nowrap;
    width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.textlimit_300 {
    white-space: nowrap;
    width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
}


/*Border Radius*/
.border-radius-10{
    border-radius:10px;
}
.border-radius-20 {
    border-radius: 20px;
}
.border-radius-25 {
    border-radius: 25px;
}