.font10{
    font-size: 10px;
}
.font15{
    font-size: 15px;
}
.font20{
    font-size: 20px;
}
.font25{
    font-size: 25px;
}
.font30{
    font-size: 30px;
}
.font35{
    font-size: 35px;
}
.font30{
    font-size: 30px;
}
.font35{
    font-size: 35px;
}
.font40{
    font-size: 40px;
}
.font45{
    font-size: 45px;
}
.font40{
    font-size: 40px;
}
.font45{
    font-size: 45px;
}
.font50{
    font-size: 50px;
}
.font55{
    font-size: 55px;
}
.font60{
    font-size: 60px;
}
.font65{
    font-size: 65px;
}
.font70{
    font-size: 70px;
}
.font75{
    font-size: 75px;
}
.font80{
    font-size: 80px;
}
.font85{
    font-size: 85px;
}
.font90{
    font-size: 90px;
}
.font95{
    font-size: 95px;
}
.font100{
    font-size: 100px;
}
.roboto{
    font-family: 'roboto';
}
.plusJakarta{
    font-family: 'plus jakarta sans';
}
.inter{
    font-family: 'inter';
}
.nunito{
    font-family: 'nunito';
}
.sono{
    font-family: 'sono';
}
.extra-light{
    font-weight: 200;
}
.light{
    font-weight: 300;
}
.bold{
    font-weight: 500;
}
.extra-bold{
    font-weight: 600;
}
.super-bold{
    font-weight: 700;
}
.heavy{
    font-weight: 800;
}
.dark{
    font-weight: 900;
}
.dark{
    font-weight: 900;
}
.blue{
    color: blue;
}
.bgblue{
    background-color: blue;
}
.red{
    color: red;
}
.bgred{
    background-color: red;
}
.yellow{
    color: yellow;
}
.bgyellow{
    background-color: yellow;
}
.green{
    color: green;
}
.bggreen{
    background-color: green;
}
.white{
    color: white;
}
.bgwhite{
    background-color: white;
}
.purple{
    color: purple;
}
.bgpurple{
    background-color: purple;
}
.bgblack{
    background-color: black;
}
.br3{
    border-radius: 3px;
}
.br5{
    border-radius: 5px;
}
.br10{
    border-radius: 10px;
}
.br15{
    border-radius: 15px;
}
.br20{
    border-radius: 20px;
}
.br25{
    border-radius: 25px;
}
.br30{
    border-radius: 30px;
}
.br35{
    border-radius: 35px;
}
.br40{
    border-radius: 40px;
}
.br45{
    border-radius: 45px;
}
.br50{
    border-radius: 50px;
}
.noOutline{
    outline: none;
}
.noBorder{
    border: none;
}
.trans1{
    transition: .1s;
}
.trans2{
    transition: .2s;
}
.trans3{
    transition: .3s;
}
.trans4{
    transition: .4s;
}
.trans5{
    transition: .5s;
}
.disabled{
    cursor: not-allowed;
}
.pointer{
    cursor: pointer;
}
.link{
    text-decoration: none;
}
.flex{
    display: flex;
}
.flexWrap{
    flex-wrap: wrap;
}
.spaceBtw{
     justify-content: space-between;
}
.spaceEven{
    justify-content: space-evenly;
}
.spaceAround{
    justify-content: space-around;
}
.flexColumn{
    display: flex;
    flex-direction: column;
}
.justifyContent{
    justify-content: center;
}
.alignCenter{
    align-items: center;
}
.alignFlexStart{
    align-items: flex-start;
}
.flexStart{
    justify-content: flex-start;
}
.flexEnd{
    justify-content: flex-end;
}
#app{
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
.uppercase{
    text-transform: uppercase;
}
.talignleft{
    text-align: left;
}
.pad5{
    padding: 5px;
}
.pad10{
    padding: 10px;
}
.pad15{
    padding: 15px;
}
.pad20{
    padding: 20px;
}
.pad25{
    padding: 25px;
}
.pad30{
    padding: 30px;
}
.pad35{
    padding: 35px;
}
.pad40{
    padding: 40px;
}
.pad45{
    padding: 45px;
}
.pad50{
    padding: 50px;
}
.pad55{
    padding: 55px;
}
.pad60{
    padding: 60px;
}
.gap5{
 gap: 5px;
}
.gap10{
 gap: 10px;
}
.gap15{
 gap: 15px;
}
.gap20{
 gap: 20px;
}
.gap25{
    gap: 25px;
}
.gap30{
    gap: 30px;
}
.gap35{
    gap: 35px;
}
.gap40{
    gap: 40px;
}
.gap45{
    gap: 45px;
}
.gap50{
    gap: 50px;
}
.gap55{
    gap: 55px;
}
.gap60{
    gap: 60px;
}
.gap65{
    gap: 65px;
}