@font-face {
    font-family: 'PrimaryFont';
    src: url('../fonts/Fredoka.ttf') format('truetype');
}

@font-face {
    font-family: 'Arial Ronded MT Bold';
    src: url('../fonts/arialroundedmtbold.ttf') format('truetype');
}

@font-face {
    font-family: 'Poiret One';
    src: url('../fonts/PoiretOne-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'LogoControlus';
    src: url('../fonts/BankGothicMediumBT.ttf') format('truetype');
}

@font-face {
    font-family: 'icon';
    src: url('../fonts/icon.ttf') format('truetype');
}

@media only screen and (max-width: 600px) {
    .font-size-screen {
        font-size: 14px;
    }
}

@media only screen and (min-width: 601px) {
    .font-size-screen {
        font-size: 18px;
    }
}


.primary-font-ligth{
    font-family: 'PrimaryFont';
    font-weight: lighter;
}

.primary-font-normal{
    font-family: 'PrimaryFont';
    font-weight:normal;
}

.primary-font-bold{
    font-family: 'PrimaryFont';
    font-weight:bold;
}

.font-text-center{
    text-align: center;
}

.font-text-left{
    text-align: left;
}

.font-text-right{
    text-align: right;
}

.color-theme {
    color: var(--cl-text);
}

.color-app {
    color: rgb(200, 0, 50);
}

.color-white {
    color: white;
}

.color-red {
    color: red;
}

.color-crimson {
    color:crimson;
}

.color-maroon {
    color: maroon;
}

.color-orange {
    color: rgb(255, 102, 0);
}

.color-green {
    color: green;
}

.color-green-light {
    color: rgb(0, 173, 0);
}

.color-yellow {
    color: yellow;
}

.color-blue {
    color: blue;
}

.color-purple {
    color: purple;
}

.color-gray {
    color: gray;
}

.color-black {
    color: black;
}

.font-bold{
    font-weight: bold;
}

.font-normal{
    font-weight: normal;
}

.font-italic{
    font-style: italic;
}

.font-lighter{
    font-weight: lighter;
}

.font-size-8 {
    font-size: 8px;
}

.font-size-10 {
    font-size: 10px;
}

.font-size-12 {
    font-size: 12px;
}

.font-size-14 {
    font-size: 14px;
}

.font-size-16 {
    font-size: 16px;
}

.font-size-18 {
    font-size: 18px;
}

.font-size-20 {
    font-size: 20px;
}

.font-size-22 {
    font-size: 22px;
}

.font-size-24 {
    font-size: 24px;
}

.font-size-26 {
    font-size: 26px;
}

.font-size-28 {
    font-size: 28px;
}

.font-size-30 {
    font-size: 30px;
}

.font-size-32 {
    font-size: 32px;
}

.font-size-34 {
    font-size: 34px;
}

.font-size-36 {
    font-size: 36px;
}

.font-size-38 {
    font-size: 38px;
}

.font-size-40 {
    font-size: 40px;
}

.font-size-42 {
    font-size: 42px;
}

.font-size-44 {
    font-size: 44px;
}

.font-size-46 {
    font-size: 46px;
}

.font-size-48 {
    font-size: 48px;
}

.font-size-50 {
    font-size: 50px;
}

.font-size-52 {
    font-size: 52px;
}

.font-size-54 {
    font-size: 54px;
}

.font-size-56 {
    font-size: 56px;
}

.font-size-58 {
    font-size: 58px;
}

.font-size-60 {
    font-size: 60px;
}

.font-size-70 {
    font-size: 70px;
}

.font-size-80 {
    font-size: 80px;
}

.font-size-90 {
    font-size: 90px;
}

.font-size-100 {
    font-size: 100px;
}

.font-size-110 {
    font-size: 110px;
}

.font-size-120 {
    font-size: 120px;
}