.pointerEventNull {pointer-events: none}

a:hover {text-decoration: none}

.font60 {font-size: 60px;}
.font56 {font-size: 56px;}
.font54 {font-size: 54px;}
.font52 {font-size: 50px;}
.font48 {font-size: 48px;}
.font44 {font-size: 44px;}
.font42 {font-size: 42px;}
.font40 {font-size: 40px;}
.font36 {font-size: 36px;}
.font32 {font-size: 32px;}
.font30 {font-size: 30px;}
.font24 {font-size: 24px;}
.font22 {font-size: 22px;}
.font20 {font-size: 20px;}
.font18 {font-size: 18px;}
.font16 {font-size: 16px;}
.font14 {font-size: 14px;}
.font13 {font-size: 13px;}
.font12 {font-size: 12px;}
.font11 {font-size: 11px;}
.font10 {font-size: 10px;}

.fontlight {font-weight: 500;}
.fontlighter {font-weight: 300;}

.font10\@s {font-size: 10px}
.font11\@s {font-size: 11px}
.font12\@s {font-size: 12px}
.font13\@s {font-size: 13px}
.font14\@s {font-size: 14px}
.font16\@s {font-size: 16px}
.font18\@s {font-size: 18px}
.font20\@s {font-size: 20px}
.font22\@s {font-size: 22px}
.font24\@s {font-size: 24px}
.font30\@s {font-size: 30px}
.font32\@s {font-size: 32px}
.font36\@s {font-size: 36px}
.font40\@s {font-size: 40px}
.font42\@s {font-size: 42px}
.font44\@s {font-size: 44px}
.font48\@s {font-size: 48px}
.font52\@s {font-size: 52px}
.font54\@s {font-size: 54px}
.font60\@s {font-size: 60px}
@media (max-width: 640px) {
    .font10\@s {font-size: initial}
    .font11\@s {font-size: initial}
    .font12\@s {font-size: initial}
    .font13\@s {font-size: initial}
    .font14\@s {font-size: initial}
    .font16\@s {font-size: initial}
    .font18\@s {font-size: initial}
    .font20\@s {font-size: initial}
    .font22\@s {font-size: initial}
    .font24\@s {font-size: initial}
    .font30\@s {font-size: initial}
    .font32\@s {font-size: initial}
    .font36\@s {font-size: initial}
    .font40\@s {font-size: initial}
    .font42\@s {font-size: initial}
    .font44\@s {font-size: initial}
    .font48\@s {font-size: initial}
    .font52\@s {font-size: initial}
    .font54\@s {font-size: initial}
    .font60\@s {font-size: initial}
}

.font10\@m {font-size: 10px}
.font11\@m {font-size: 11px}
.font12\@m {font-size: 12px}
.font13\@m {font-size: 13px}
.font14\@m {font-size: 14px}
.font16\@m {font-size: 16px}
.font18\@m {font-size: 18px}
.font20\@m {font-size: 20px}
.font22\@m {font-size: 22px}
.font24\@m {font-size: 24px}
.font30\@m {font-size: 30px}
.font32\@m {font-size: 32px}
.font36\@m {font-size: 36px}
.font40\@m {font-size: 40px}
.font42\@m {font-size: 42px}
.font44\@m {font-size: 44px}
.font48\@m {font-size: 48px}
.font52\@m {font-size: 52px}
.font54\@m {font-size: 54px}
.font60\@m {font-size: 60px}
@media (max-width: 960px) {
    .font10\@m {font-size: initial}
    .font11\@m {font-size: initial}
    .font12\@m {font-size: initial}
    .font13\@m {font-size: initial}
    .font14\@m {font-size: initial}
    .font16\@m {font-size: initial}
    .font18\@m {font-size: initial}
    .font20\@m {font-size: initial}
    .font22\@m {font-size: initial}
    .font24\@m {font-size: initial}
    .font30\@m {font-size: initial}
    .font32\@m {font-size: initial}
    .font36\@m {font-size: initial}
    .font40\@m {font-size: initial}
    .font42\@m {font-size: initial}
    .font44\@m {font-size: initial}
    .font48\@m {font-size: initial}
    .font52\@m {font-size: initial}
    .font54\@m {font-size: initial}
    .font60\@m {font-size: initial}
}

.font10\@l {font-size: 10px}
.font11\@l {font-size: 11px}
.font12\@l {font-size: 12px}
.font13\@l {font-size: 13px}
.font14\@l {font-size: 14px}
.font16\@l {font-size: 16px}
.font18\@l {font-size: 18px}
.font20\@l {font-size: 20px}
.font22\@l {font-size: 22px}
.font24\@l {font-size: 24px}
.font30\@l {font-size: 30px}
.font32\@l {font-size: 32px}
.font36\@l {font-size: 36px}
.font40\@l {font-size: 40px}
.font42\@l {font-size: 42px}
.font44\@l {font-size: 44px}
.font48\@l {font-size: 48px}
.font52\@l {font-size: 52px}
.font54\@l {font-size: 54px}
.font60\@l {font-size: 60px}
@media (max-width: 1200px) {
    .font10\@l {font-size: initial}
    .font11\@l {font-size: initial}
    .font12\@l {font-size: initial}
    .font13\@l {font-size: initial}
    .font14\@l {font-size: initial}
    .font16\@l {font-size: initial}
    .font18\@l {font-size: initial}
    .font20\@l {font-size: initial}
    .font22\@l {font-size: initial}
    .font24\@l {font-size: initial}
    .font30\@l {font-size: initial}
    .font32\@l {font-size: initial}
    .font36\@l {font-size: initial}
    .font40\@l {font-size: initial}
    .font42\@l {font-size: initial}
    .font44\@l {font-size: initial}
    .font48\@l {font-size: initial}
    .font52\@l {font-size: initial}
    .font54\@l {font-size: initial}
    .font60\@l {font-size: initial}
}

.font10\@xl {font-size: 10px}
.font11\@xl {font-size: 11px}
.font12\@xl {font-size: 12px}
.font13\@xl {font-size: 13px}
.font14\@xl {font-size: 14px}
.font16\@xl {font-size: 16px}
.font18\@xl {font-size: 18px}
.font20\@xl {font-size: 20px}
.font22\@xl {font-size: 22px}
.font24\@xl {font-size: 24px}
.font30\@xl {font-size: 30px}
.font32\@xl {font-size: 32px}
.font36\@xl {font-size: 36px}
.font40\@xl {font-size: 40px}
.font42\@xl {font-size: 42px}
.font44\@xl {font-size: 44px}
.font48\@xl {font-size: 48px}
.font52\@xl {font-size: 52px}
.font54\@xl {font-size: 54px}
.font60\@xl {font-size: 60px}
@media (max-width: 1600px) {
    .font10\@xl {font-size: initial}
    .font11\@xl {font-size: initial}
    .font12\@xl {font-size: initial}
    .font13\@xl {font-size: initial}
    .font14\@xl {font-size: initial}
    .font16\@xl {font-size: initial}
    .font18\@xl {font-size: initial}
    .font20\@xl {font-size: initial}
    .font22\@xl {font-size: initial}
    .font24\@xl {font-size: initial}
    .font30\@xl {font-size: initial}
    .font32\@xl {font-size: initial}
    .font36\@xl {font-size: initial}
    .font40\@xl {font-size: initial}
    .font42\@xl {font-size: initial}
    .font44\@xl {font-size: initial}
    .font48\@xl {font-size: initial}
    .font52\@xl {font-size: initial}
    .font54\@xl {font-size: initial}
    .font60\@xl {font-size: initial}
}
/* TODO lineclamp */
.lineClamp7 {display: -webkit-box !important; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp6 {display: -webkit-box !important; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp5 {display: -webkit-box !important; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp4 {display: -webkit-box !important; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp3 {display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp2 {display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp1 {display: -webkit-box !important; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
/* TODO end lineclamp */

/* todo for bradius */
.xh-bradius-s {border-radius: 5px}
.xh-bradius-m {border-radius: 10px}
.xh-bradius-l {border-radius: 20px}
@media (max-width: 640px){
    .xh-bradius-s\@s {border-radius: unset;}
    .xh-bradius-m\@s {border-radius: unset;}
    .xh-bradius-l\@s {border-radius: unset;}
}
@media (max-width: 960px){
    .xh-bradius-s\@m {border-radius: unset;}
    .xh-bradius-m\@m {border-radius: unset;}
    .xh-bradius-l\@m {border-radius: unset;}
}
@media (max-width: 1200px){
    .xh-bradius-s\@l {border-radius: unset;}
    .xh-bradius-m\@l {border-radius: unset;}
    .xh-bradius-l\@l {border-radius: unset;}
}
@media (max-width: 1600px){
    .xh-bradius-s\@xl {border-radius: unset;}
    .xh-bradius-m\@xl {border-radius: unset;}
    .xh-bradius-l\@xl {border-radius: unset;}
}

/* todo end of bradius */

/* TODO margin */
.xh-m-1 {margin: 10px}
.xh-m-2 {margin: 20px}
.xh-m-3 {margin: 30px}
.xh-m-4 {margin: 40px}

.xh-mt-1 {margin-top: 10px;}
.xh-mr-1 {margin-right: 10px;}
 .xh-mb-1 {margin-bottom: 10px;}
.xh-ml-1 {margin-left: 10px;}

.xh-mt-2 {margin-top: 20px;}
.xh-mr-2 {margin-right: 20px;}
.xh-mb-2 {margin-bottom: 20px;}
.xh-ml-2 {margin-left: 20px;}

.xh-mt-3 {margin-top: 30px;}
.xh-mr-3 {margin-right: 30px;}
.xh-mb-3 {margin-bottom: 30px;}
.xh-ml-3 {margin-left: 30px;}

.xh-m-1 {margin: 10px}
.xh-m-2 {margin: 20px}
.xh-m-3 {margin: 30px}

.xh-mt-1 {margin-top: 10px;}
.xh-mr-1 {margin-right: 10px;}
.xh-mb-1 {margin-bottom: 10px;}
.xh-ml-1 {margin-left: 10px;}

.xh-mt-2 {margin-top: 20px;}
.xh-mr-2 {margin-right: 20px;}
.xh-mb-2 {margin-bottom: 20px;}
.xh-ml-2 {margin-left: 20px;}

.xh-mt-3 {margin-top: 30px;}
.xh-mr-3 {margin-right: 30px;}
.xh-mb-3 {margin-bottom: 30px;}
.xh-ml-3 {margin-left: 30px;}

.xh-m-1\@s {margin: 10px}
.xh-m-2\@s {margin: 20px}
.xh-m-3\@s {margin: 30px}

.xh-mt-1\@s {margin-top: 10px;}
.xh-mr-1\@s {margin-right: 10px;}
.xh-mb-1\@s {margin-bottom: 10px;}
.xh-ml-1\@s {margin-left: 10px;}

.xh-mt-2\@s {margin-top: 20px;}
.xh-mr-2\@s {margin-right: 20px;}
.xh-mb-2\@s {margin-bottom: 20px;}
.xh-ml-2\@s {margin-left: 20px;}

.xh-mt-3\@s {margin-top: 30px;}
.xh-mr-3\@s {margin-right: 30px;}
.xh-mb-3\@s {margin-bottom: 30px;}
.xh-ml-3\@s {margin-left: 30px;}
@media (max-width: 640px) {
    .xh-m-1\@s {margin: unset}
    .xh-m-2\@s {margin: unset}
    .xh-m-3\@s {margin: unset}

    .xh-mt-1\@s {margin-top: unset;}
    .xh-mr-1\@s {margin-right: unset;}
    .xh-mb-1\@s {margin-bottom: unset;}
    .xh-ml-1\@s {margin-left: unset;}

    .xh-mt-2\@s {margin-top: unset;}
    .xh-mr-2\@s {margin-right: unset;}
    .xh-mb-2\@s {margin-bottom: unset;}
    .xh-ml-2\@s {margin-left: unset;}

    .xh-mt-3\@s {margin-top: unset;}
    .xh-mr-3\@s {margin-right: unset;}
    .xh-mb-3\@s {margin-bottom: unset;}
    .xh-ml-3\@s {margin-left: unset;}
}

.xh-m-1\@m {margin: 10px}
.xh-m-2\@m {margin: 20px}
.xh-m-3\@m {margin: 30px}

.xh-mt-1\@m {margin-top: 10px;}
.xh-mr-1\@m {margin-right: 10px;}
.xh-mb-1\@m {margin-bottom: 10px;}
.xh-ml-1\@m {margin-left: 10px;}

.xh-mt-2\@m {margin-top: 20px;}
.xh-mr-2\@m {margin-right: 20px;}
.xh-mb-2\@m {margin-bottom: 20px;}
.xh-ml-2\@m {margin-left: 20px;}

.xh-mt-3\@m {margin-top: 30px;}
.xh-mr-3\@m {margin-right: 30px;}
.xh-mb-3\@m {margin-bottom: 30px;}
.xh-ml-3\@m {margin-left: 30px;}

@media (max-width: 960px) {
    .xh-m-1\@m {margin: unset;}
    .xh-m-2\@m {margin: unset;}
    .xh-m-3\@m {margin: unset;}

    .xh-mt-1\@m {margin-top: unset;}
    .xh-mr-1\@m {margin-right: unset;}
    .xh-mb-1\@m {margin-bottom: unset;}
    .xh-ml-1\@m {margin-left: unset;}

    .xh-mt-2\@m {margin-top: unset;}
    .xh-mr-2\@m {margin-right: unset;}
    .xh-mb-2\@m {margin-bottom: unset;}
    .xh-ml-2\@m {margin-left: unset;}

    .xh-mt-3\@m {margin-top: unset;}
    .xh-mr-3\@m {margin-right: unset;}
    .xh-mb-3\@m {margin-bottom: unset;}
    .xh-ml-3\@m {margin-left: unset;}
}

.xh-m-1\@l {margin: 10px}
.xh-m-2\@l {margin: 20px}
.xh-m-3\@l {margin: 30px}

.xh-mt-1\@l {margin-top: 10px;}
.xh-mr-1\@l {margin-right: 10px;}
.xh-mb-1\@l {margin-bottom: 10px;}
.xh-ml-1\@l {margin-left: 10px;}

.xh-mt-2\@l {margin-top: 20px;}
.xh-mr-2\@l {margin-right: 20px;}
.xh-mb-2\@l {margin-bottom: 20px;}
.xh-ml-2\@l {margin-left: 20px;}

.xh-mt-3\@l {margin-top: 30px;}
.xh-mr-3\@l {margin-right: 30px;}
.xh-mb-3\@l {margin-bottom: 30px;}
.xh-ml-3\@l {margin-left: 30px;}
@media (max-width: 1200px) {
    .xh-m-1\@l {margin: unset;}
    .xh-m-2\@l {margin: unset;}
    .xh-m-3\@l {margin: unset;}

    .xh-mt-1\@l {margin-top: unset;}
    .xh-mr-1\@l {margin-right: unset;}
    .xh-mb-1\@l {margin-bottom: unset;}
    .xh-ml-1\@l {margin-left: unset;}

    .xh-mt-2\@l {margin-top: unset;}
    .xh-mr-2\@l {margin-right: unset;}
    .xh-mb-2\@l {margin-bottom: unset;}
    .xh-ml-2\@l {margin-left: unset;}

    .xh-mt-3\@l {margin-top: unset;}
    .xh-mr-3\@l {margin-right: unset;}
    .xh-mb-3\@l {margin-bottom: unset;}
    .xh-ml-3\@l {margin-left: unset;}
}

.xh-m-1\@xl {margin: 10px}
.xh-m-2\@xl {margin: 20px}
.xh-m-3\@xl {margin: 30px}

.xh-mt-1\@xl {margin-top: 10px;}
.xh-mr-1\@xl {margin-right: 10px;}
.xh-mb-1\@xl {margin-bottom: 10px;}
.xh-ml-1\@xl {margin-left: 10px;}

.xh-mt-2\@xl {margin-top: 20px;}
.xh-mr-2\@xl {margin-right: 20px;}
.xh-mb-2\@xl {margin-bottom: 20px;}
.xh-ml-2\@xl {margin-left: 20px;}

.xh-mt-3\@xl {margin-top: 30px;}
.xh-mr-3\@xl {margin-right: 30px;}
.xh-mb-3\@xl {margin-bottom: 30px;}
.xh-ml-3\@xl {margin-left: 30px;}
@media (max-width: 1600px){
    .xh-p-1\@xl {margin: unset;}
    .xh-p-2\@xl {margin: unset;}
    .xh-p-3\@xl {margin: unset;}

    .xh-mt-1\@xl {margin-top: unset;}
    .xh-mr-1\@xl {margin-right: unset;}
    .xh-mb-1\@xl {margin-bottom: unset;}
    .xh-ml-1\@xl {margin-left: unset;}

    .xh-mt-2\@xl {margin-top: unset;}
    .xh-mr-2\@xl {margin-right: unset;}
    .xh-mb-2\@xl {margin-bottom: unset;}
    .xh-ml-2\@xl {margin-left: unset;}

    .xh-mt-3\@xl {margin-top: unset;}
    .xh-mr-3\@xl {margin-right: unset;}
    .xh-mb-3\@xl {margin-bottom: unset;}
    .xh-ml-3\@xl {margin-left: unset;}
}
/* TODO end of margin */

/* TODO for padding */
.xh-p-1 {padding: 10px}
.xh-p-2 {padding: 20px}
.xh-p-3 {padding: 30px}

.xh-pt-1 {padding-top: 10px;}
.xh-pr-1 {padding-right: 10px;}
.xh-pb-1 {padding-bottom: 10px;}
.xh-pl-1 {padding-left: 10px;}

.xh-pt-2 {padding-top: 20px;}
.xh-pr-2 {padding-right: 20px;}
.xh-pb-2 {padding-bottom: 20px;}
.xh-pl-2 {padding-left: 20px;}

.xh-pt-3 {padding-top: 30px;}
.xh-pr-3 {padding-right: 30px;}
.xh-pb-3 {padding-bottom: 30px;}
.xh-pl-3 {padding-left: 30px;}

.xh-p-1\@s {padding: 10px}
.xh-p-2\@s {padding: 20px}
.xh-p-3\@s {padding: 30px}

.xh-pt-1\@s {padding-top: 10px;}
.xh-pr-1\@s {padding-right: 10px;}
.xh-pb-1\@s {padding-bottom: 10px;}
.xh-pl-1\@s {padding-left: 10px;}

.xh-pt-2\@s {padding-top: 20px;}
.xh-pr-2\@s {padding-right: 20px;}
.xh-pb-2\@s {padding-bottom: 20px;}
.xh-pl-2\@s {padding-left: 20px;}

.xh-pt-3\@s {padding-top: 30px;}
.xh-pr-3\@s {padding-right: 30px;}
.xh-pb-3\@s {padding-bottom: 30px;}
.xh-pl-3\@s {padding-left: 30px;}

.xh-bradius-s\@s {border-radius: 5px}
.xh-bradius-m\@s {border-radius: 10px}
.xh-bradius-l\@s {border-radius: 20px}
@media (max-width: 640px) {
    .xh-p-1\@s {padding: unset}
    .xh-p-2\@s {padding: unset}
    .xh-p-3\@s {padding: unset}

    .xh-pt-1\@s {padding-top: unset;}
    .xh-pr-1\@s {padding-right: unset;}
    .xh-pb-1\@s {padding-bottom: unset;}
    .xh-pl-1\@s {padding-left: unset;}

    .xh-pt-2\@s {padding-top: unset;}
    .xh-pr-2\@s {padding-right: unset;}
    .xh-pb-2\@s {padding-bottom: unset;}
    .xh-pl-2\@s {padding-left: unset;}

    .xh-pt-3\@s {padding-top: unset;}
    .xh-pr-3\@s {padding-right: unset;}
    .xh-pb-3\@s {padding-bottom: unset;}
    .xh-pl-3\@s {padding-left: unset;}
}

.xh-p-1\@m {padding: 10px}
.xh-p-2\@m {padding: 20px}
.xh-p-3\@m {padding: 30px}

.xh-pt-1\@m {padding-top: 10px;}
.xh-pr-1\@m {padding-right: 10px;}
.xh-pb-1\@m {padding-bottom: 10px;}
.xh-pl-1\@m {padding-left: 10px;}

.xh-pt-2\@m {padding-top: 20px;}
.xh-pr-2\@m {padding-right: 20px;}
.xh-pb-2\@m {padding-bottom: 20px;}
.xh-pl-2\@m {padding-left: 20px;}

.xh-pt-3\@m {padding-top: 30px;}
.xh-pr-3\@m {padding-right: 30px;}
.xh-pb-3\@m {padding-bottom: 30px;}
.xh-pl-3\@m {padding-left: 30px;}

.xh-bradius-s\@m {border-radius: 5px}
.xh-bradius-m\@m {border-radius: 10px}
.xh-bradius-l\@m {border-radius: 20px}

@media (max-width: 960px) {
    .xh-p-1\@m {padding: unset;}
    .xh-p-2\@m {padding: unset;}
    .xh-p-3\@m {padding: unset;}

    .xh-pt-1\@m {padding-top: unset;}
    .xh-pr-1\@m {padding-right: unset;}
    .xh-pb-1\@m {padding-bottom: unset;}
    .xh-pl-1\@m {padding-left: unset;}

    .xh-pt-2\@m {padding-top: unset;}
    .xh-pr-2\@m {padding-right: unset;}
    .xh-pb-2\@m {padding-bottom: unset;}
    .xh-pl-2\@m {padding-left: unset;}

    .xh-pt-3\@m {padding-top: unset;}
    .xh-pr-3\@m {padding-right: unset;}
    .xh-pb-3\@m {padding-bottom: unset;}
    .xh-pl-3\@m {padding-left: unset;}
}

.xh-p-1\@l {padding: 10px}
.xh-p-2\@l {padding: 20px}
.xh-p-3\@l {padding: 30px}

.xh-pt-1\@l {padding-top: 10px;}
.xh-pr-1\@l {padding-right: 10px;}
.xh-pb-1\@l {padding-bottom: 10px;}
.xh-pl-1\@l {padding-left: 10px;}

.xh-pt-2\@l {padding-top: 20px;}
.xh-pr-2\@l {padding-right: 20px;}
.xh-pb-2\@l {padding-bottom: 20px;}
.xh-pl-2\@l {padding-left: 20px;}

.xh-pt-3\@l {padding-top: 30px;}
.xh-pr-3\@l {padding-right: 30px;}
.xh-pb-3\@l {padding-bottom: 30px;}
.xh-pl-3\@l {padding-left: 30px;}

.xh-bradius-s\@l {border-radius: 5px}
.xh-bradius-m\@l {border-radius: 10px}
.xh-bradius-l\@l {border-radius: 20px}
@media (max-width: 1200px) {
    .xh-p-1\@l {padding: unset;}
    .xh-p-2\@l {padding: unset;}
    .xh-p-3\@l {padding: unset;}

    .xh-pt-1\@l {padding-top: unset;}
    .xh-pr-1\@l {padding-right: unset;}
    .xh-pb-1\@l {padding-bottom: unset;}
    .xh-pl-1\@l {padding-left: unset;}

    .xh-pt-2\@l {padding-top: unset;}
    .xh-pr-2\@l {padding-right: unset;}
    .xh-pb-2\@l {padding-bottom: unset;}
    .xh-pl-2\@l {padding-left: unset;}

    .xh-pt-3\@l {padding-top: unset;}
    .xh-pr-3\@l {padding-right: unset;}
    .xh-pb-3\@l {padding-bottom: unset;}
    .xh-pl-3\@l {padding-left: unset;}
}

.xh-p-1\@xl {padding: 10px}
.xh-p-2\@xl {padding: 20px}
.xh-p-3\@xl {padding: 30px}

.xh-pt-1\@xl {padding-top: 10px;}
.xh-pr-1\@xl {padding-right: 10px;}
.xh-pb-1\@xl {padding-bottom: 10px;}
.xh-pl-1\@xl {padding-left: 10px;}

.xh-pt-2\@xl {padding-top: 20px;}
.xh-pr-2\@xl {padding-right: 20px;}
.xh-pb-2\@xl {padding-bottom: 20px;}
.xh-pl-2\@xl {padding-left: 20px;}

.xh-pt-3\@xl {padding-top: 30px;}
.xh-pr-3\@xl {padding-right: 30px;}
.xh-pb-3\@xl {padding-bottom: 30px;}
.xh-pl-3\@xl {padding-left: 30px;}

.xh-bradius-s\@xl {border-radius: 5px}
.xh-bradius-m\@xl {border-radius: 10px}
.xh-bradius-l\@xl {border-radius: 20px}
@media (max-width: 1600px){
    .xh-p-1\@xl {padding: unset;}
    .xh-p-2\@xl {padding: unset;}
    .xh-p-3\@xl {padding: unset;}

    .xh-pt-1\@xl {padding-top: unset;}
    .xh-pr-1\@xl {padding-right: unset;}
    .xh-pb-1\@xl {padding-bottom: unset;}
    .xh-pl-1\@xl {padding-left: unset;}

    .xh-pt-2\@xl {padding-top: unset;}
    .xh-pr-2\@xl {padding-right: unset;}
    .xh-pb-2\@xl {padding-bottom: unset;}
    .xh-pl-2\@xl {padding-left: unset;}

    .xh-pt-3\@xl {padding-top: unset;}
    .xh-pr-3\@xl {padding-right: unset;}
    .xh-pb-3\@xl {padding-bottom: unset;}
    .xh-pl-3\@xl {padding-left: unset;}

}
/* TODO end of padding */

.over-mask {position: absolute; bottom: 0; z-index: 1; width: 100%; height: 100%; background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.85));}
.over-mask-light {position: absolute; bottom: 0; z-index: 1; width: 100%; height: 100%; background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.80));}

@media (max-width: 640px) {.uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle {min-height: 50px}}

.colorff {color: #fff !important;}
.color36 {color: #363636 !important;}
.color99 {color: #999 !important;}
.color66 {color: #666 !important;}
.color33 {color: #333 !important;}
.color11 {color: #111 !important;}
.colorb3 {color: #0066B3 !important;}
.colorbl {color: #204270 !important;}
.colorfa {color: #3B5998 !important;}
.colortw {color: #55ACEE !important;}
.coloryt {color: #DD4B39 !important;}
.color00 {color: #000 !important;}
.colorRedrum {color: #EE1F52 !important;}
.colored3237 {color: #ED3237 !important;}

.bgwhite {background-color: #fff}

.uk-width-1-7 { width: 14.28% !important; }
.uk-width-2-7 { width: 28.57%; }
.uk-width-3-7 { width: 42.85%; }
.uk-width-4-7 { width: 57.14%; }body{
    background-color: #F5F6FA;
}

a:hover {text-decoration: none}


.font60 {font-size: 60px;}
.font56 {font-size: 56px;}
.font54 {font-size: 54px;}
.font52 {font-size: 50px;}
.font48 {font-size: 48px;}
.font44 {font-size: 44px;}
.font42 {font-size: 42px;}
.font40 {font-size: 40px;}
.font36 {font-size: 36px;}
.font32 {font-size: 32px;}
.font30 {font-size: 30px;}
.font24 {font-size: 24px;}
.font22 {font-size: 22px;}
.font20 {font-size: 20px;}
.font18 {font-size: 18px;}
.font16 {font-size: 16px;}
.font14 {font-size: 14px;}
.font13 {font-size: 13px;}
.font12 {font-size: 12px;}
.font11 {font-size: 11px;}
.font10 {font-size: 10px;}
.fontlight {font-weight: 500;}
.fontlighter {font-weight: 300;}


.font10\@s {font-size: 10px}
.font11\@s {font-size: 11px}
.font12\@s {font-size: 12px}
.font13\@s {font-size: 13px}
.font14\@s {font-size: 14px}
.font16\@s {font-size: 16px}
.font18\@s {font-size: 18px}
.font20\@s {font-size: 20px}
.font22\@s {font-size: 22px}
.font24\@s {font-size: 24px}
.font30\@s {font-size: 30px}
.font32\@s {font-size: 32px}
.font36\@s {font-size: 36px}
.font40\@s {font-size: 40px}
.font42\@s {font-size: 42px}
.font44\@s {font-size: 44px}
.font48\@s {font-size: 48px}
.font52\@s {font-size: 52px}
.font54\@s {font-size: 54px}
.font60\@s {font-size: 60px}
@media (max-width: 640px) {
    .font10\@s {font-size: initial}
    .font11\@s {font-size: initial}
    .font12\@s {font-size: initial}
    .font13\@s {font-size: initial}
    .font14\@s {font-size: initial}
    .font16\@s {font-size: initial}
    .font18\@s {font-size: initial}
    .font20\@s {font-size: initial}
    .font22\@s {font-size: initial}
    .font24\@s {font-size: initial}
    .font30\@s {font-size: initial}
    .font32\@s {font-size: initial}
    .font36\@s {font-size: initial}
    .font40\@s {font-size: initial}
    .font42\@s {font-size: initial}
    .font44\@s {font-size: initial}
    .font48\@s {font-size: initial}
    .font52\@s {font-size: initial}
    .font54\@s {font-size: initial}
    .font60\@s {font-size: initial}
}

.font10\@m {font-size: 10px}
.font11\@m {font-size: 11px}
.font12\@m {font-size: 12px}
.font13\@m {font-size: 13px}
.font14\@m {font-size: 14px}
.font16\@m {font-size: 16px}
.font18\@m {font-size: 18px}
.font20\@m {font-size: 20px}
.font22\@m {font-size: 22px}
.font24\@m {font-size: 24px}
.font30\@m {font-size: 30px}
.font32\@m {font-size: 32px}
.font36\@m {font-size: 36px}
.font40\@m {font-size: 40px}
.font42\@m {font-size: 42px}
.font44\@m {font-size: 44px}
.font48\@m {font-size: 48px}
.font52\@m {font-size: 52px}
.font54\@m {font-size: 54px}
.font60\@m {font-size: 60px}
@media (max-width: 960px) {
    .font10\@m {font-size: initial}
    .font11\@m {font-size: initial}
    .font12\@m {font-size: initial}
    .font13\@m {font-size: initial}
    .font14\@m {font-size: initial}
    .font16\@m {font-size: initial}
    .font18\@m {font-size: initial}
    .font20\@m {font-size: initial}
    .font22\@m {font-size: initial}
    .font24\@m {font-size: initial}
    .font30\@m {font-size: initial}
    .font32\@m {font-size: initial}
    .font36\@m {font-size: initial}
    .font40\@m {font-size: initial}
    .font42\@m {font-size: initial}
    .font44\@m {font-size: initial}
    .font48\@m {font-size: initial}
    .font52\@m {font-size: initial}
    .font54\@m {font-size: initial}
    .font60\@m {font-size: initial}
}

.font10\@l {font-size: 10px}
.font11\@l {font-size: 11px}
.font12\@l {font-size: 12px}
.font13\@l {font-size: 13px}
.font14\@l {font-size: 14px}
.font16\@l {font-size: 16px}
.font18\@l {font-size: 18px}
.font20\@l {font-size: 20px}
.font22\@l {font-size: 22px}
.font24\@l {font-size: 24px}
.font30\@l {font-size: 30px}
.font32\@l {font-size: 32px}
.font36\@l {font-size: 36px}
.font40\@l {font-size: 40px}
.font42\@l {font-size: 42px}
.font44\@l {font-size: 44px}
.font48\@l {font-size: 48px}
.font52\@l {font-size: 52px}
.font54\@l {font-size: 54px}
.font60\@l {font-size: 60px}
@media (max-width: 1200px) {
    .font10\@l {font-size: initial}
    .font11\@l {font-size: initial}
    .font12\@l {font-size: initial}
    .font13\@l {font-size: initial}
    .font14\@l {font-size: initial}
    .font16\@l {font-size: initial}
    .font18\@l {font-size: initial}
    .font20\@l {font-size: initial}
    .font22\@l {font-size: initial}
    .font24\@l {font-size: initial}
    .font30\@l {font-size: initial}
    .font32\@l {font-size: initial}
    .font36\@l {font-size: initial}
    .font40\@l {font-size: initial}
    .font42\@l {font-size: initial}
    .font44\@l {font-size: initial}
    .font48\@l {font-size: initial}
    .font52\@l {font-size: initial}
    .font54\@l {font-size: initial}
    .font60\@l {font-size: initial}
}

.font10\@xl {font-size: 10px}
.font11\@xl {font-size: 11px}
.font12\@xl {font-size: 12px}
.font13\@xl {font-size: 13px}
.font14\@xl {font-size: 14px}
.font16\@xl {font-size: 16px}
.font18\@xl {font-size: 18px}
.font20\@xl {font-size: 20px}
.font22\@xl {font-size: 22px}
.font24\@xl {font-size: 24px}
.font30\@xl {font-size: 30px}
.font32\@xl {font-size: 32px}
.font36\@xl {font-size: 36px}
.font40\@xl {font-size: 40px}
.font42\@xl {font-size: 42px}
.font44\@xl {font-size: 44px}
.font48\@xl {font-size: 48px}
.font52\@xl {font-size: 52px}
.font54\@xl {font-size: 54px}
.font60\@xl {font-size: 60px}
@media (max-width: 1600px) {
    .font10\@xl {font-size: initial}
    .font11\@xl {font-size: initial}
    .font12\@xl {font-size: initial}
    .font13\@xl {font-size: initial}
    .font14\@xl {font-size: initial}
    .font16\@xl {font-size: initial}
    .font18\@xl {font-size: initial}
    .font20\@xl {font-size: initial}
    .font22\@xl {font-size: initial}
    .font24\@xl {font-size: initial}
    .font30\@xl {font-size: initial}
    .font32\@xl {font-size: initial}
    .font36\@xl {font-size: initial}
    .font40\@xl {font-size: initial}
    .font42\@xl {font-size: initial}
    .font44\@xl {font-size: initial}
    .font48\@xl {font-size: initial}
    .font52\@xl {font-size: initial}
    .font54\@xl {font-size: initial}
    .font60\@xl {font-size: initial}
}

.lineClamp7 {display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp6 {display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp5 {display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp4 {display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp3 {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp2 {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.lineClamp1 {display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}

.xh-p-1 {padding: 10px}
.xh-p-2 {padding: 20px}
.xh-p-3 {padding: 30px}

.xh-pt-1 {padding-top: 10px;}
.xh-pr-1 {padding-right: 10px;}
.xh-pb-1 {padding-bottom: 10px;}
.xh-pl-1 {padding-left: 10px;}

.xh-pt-2 {padding-top: 20px;}
.xh-pr-2 {padding-right: 20px;}
.xh-pb-2 {padding-bottom: 20px;}
.xh-pl-2 {padding-left: 20px;}

.xh-pt-3 {padding-top: 30px;}
.xh-pr-3 {padding-right: 30px;}
.xh-pb-3 {padding-bottom: 30px;}
.xh-pl-3 {padding-left: 30px;}

.xh-bradius-s {border-radius: 5px}
.xh-bradius-m {border-radius: 10px}
.xh-bradius-l {border-radius: 20px}

.over-mask {position: absolute; bottom: 0; z-index: 1; width: 100%; height: 100%; background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.85));}
.over-mask-light {position: absolute; bottom: 0; z-index: 1; width: 100%; height: 100%; background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.80));}

@media (max-width: 640px) {.uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle {min-height: 50px}}

.colorff {color: #fff}
.color36 {color: #363636}
.color99 {color: #999}
.color33 {color: #333}
.color11 {color: #111}
.colorb3 {color: #0066B3}
.colorfa {color: #3B5998}
.colortw {color: #55ACEE}
.coloryt {color: #DD4B39}
.color00 {color: #000}

.bgwhite {background-color: #fff}

.uk-width-1-7 { width: 14.28% !important; }
.uk-width-2-7 { width: 28.57%; }
.uk-width-3-7 { width: 42.85%; }
.uk-width-4-7 { width: 57.14%; }
.uk-width-5-7 { width: 71.42%; }
.uk-width-6-7 { width: 85.71%; }
.uk-width-5-7 { width: 71.42%; }
.uk-width-6-7 { width: 85.71%; }