:root {
    --main-color: rgb(15, 11, 231);
    --secondary-color: rgb(90, 87, 249);
    --accent-color: rgb(214, 15, 15);
}

.display-lg {display: block;}
.display-md {display: none;}
.display-sm {display: none;}
.display-md-lg {display: block;}
.display-sm-md {display: none;}

.fw-200 {font-weight: 200 !important;}
.fw-400 {font-weight: 400 !important;}
.fw-600 {font-weight: 600 !important;}
.fw-800 {font-weight: 800 !important;}

.mw-150 {max-width: 150px;}
.mw-200 {max-width: 200px;}
.mw-400 {max-width: 400px;}
.mw-600 {max-width: 600px;}
.mw-800 {max-width: 800px;}
.mw-1000 {max-width: 1000px;}
.mw-1200 {max-width: 1200px;}

.mh-400 {max-height: 400px;}
.mh-600 {max-height: 600px;}
.mh-800 {max-height: 800px;}
.mh-1000 {max-height: 1000px;}
.mh-1200 {max-height: 1200px;}

.bg-blue {background-color: var(--main-color);}
.text-blue {color: var(--main-color);}

@media only screen and (max-width: 991px) {
    .display-lg {display: none;}
    .display-md {display: block;}
    .display-sm {display: none;}
    .display-md-lg {display: block;}
    .display-sm-md {display: block;}
}

@media only screen and (max-width: 767px) {
    .display-lg {display: none;}
    .display-md {display: none;}
    .display-sm {display: block;}
    .display-md-lg {display: none;}
    .display-sm-md {display: block;}
}