:root{

  

  --main-light-color: #FFFFFF;

  --main-dark-color: #001039; 

  --main-mid-color: linear-gradient(180deg, #FDDDA9 0%, #E0BE7D 100%);

  --cta-casino-color: #0071e7;

  --cta-sport-color: #f78d23;

  --cta-poker-color: #21bc8b;

  --text-light-color: #f4f6fc; 

  --text-lighter-color: #FFFFFF; 

  --text-dark-color: #001039; 

  --border-light-color: #44ddfd; 

  --sticky-bg-color: #2fbc53; 

  --light-section-color: #f4f6fc; 

  

  --nav-font-size: 14px;

  

  --rating-star: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg width='100%25' height='100%25' viewBox='0 0 75 72' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath id='Star_grey' d='M42.175,3.396l6.104,15.15c0.774,1.925 2.589,3.243 4.658,3.383l16.296,1.125c2.838,0.179 5.077,2.563 5.077,5.406c0,1.616 -0.723,3.149 -1.968,4.178l-12.521,10.487c-1.592,1.331 -2.285,3.463 -1.779,5.475l3.966,15.833c0.11,0.435 0.166,0.881 0.166,1.329c-0,2.972 -2.445,5.417 -5.417,5.417c-1.021,-0 -2.022,-0.289 -2.886,-0.833l-13.846,-8.667c-1.757,-1.101 -3.998,-1.101 -5.754,0l-13.846,8.667c-0.864,0.544 -1.865,0.833 -2.886,0.833c-2.972,-0 -5.417,-2.445 -5.417,-5.417c-0,-0.448 0.056,-0.894 0.166,-1.329l3.966,-15.833c0.505,-2.012 -0.188,-4.144 -1.779,-5.475l-12.521,-10.487c-1.246,-1.029 -1.968,-2.562 -1.968,-4.178c-0,-2.843 2.239,-5.227 5.077,-5.406l16.295,-1.125c2.07,-0.14 3.885,-1.458 4.659,-3.383l6.104,-15.15c0.822,-2.049 2.819,-3.4 5.027,-3.4c2.208,0 4.205,1.351 5.027,3.4Z' style='fill-rule:nonzero;'/%3E%3C/svg%3E");

  --rating-stars-size: 100px;

  --rating-stars-num: 5;

  

  --main-border-radius: 12px;

  --second-border-radius: 10px;

  --third-border-radius: 8px;

  --button-border-radius: 24px;

  --img-border-radius: 7px;

  --input-border-radius: 6px;

  

  --transition: all .5s ease-in-out;

}



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

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



.text-light {color: var(--text-light-color) !important;}

.text-lighter {color: var(--text-lighter-color) !important;}

.text-dark {color: var(--text-dark-color) !important;}



.main-border-radius {border-radius: var(--main-border-radius);}

.second-border-radius {border-radius: var(--second-border-radius);}

.third-border-radius {border-radius: var(--third-border-radius);}

.button-border-radius {border-radius: var(--button-border-radius);}



.text-start {text-align: start;}

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

.text-end {text-align: end;}

@media screen and (min-width: 576px) {

.text-sm-start {text-align: start;}

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

.text-sm-end {text-align: end;}

}

@media screen and (min-width: 768px) {

.text-md-start {text-align: start;}

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

.text-md-end {text-align: end;}

}

@media screen and (min-width: 992px) {

.text-lg-start {text-align: start;}

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

.text-lg-end {text-align: end;}

}

@media screen and (min-width: 1200px) {

.text-xl-start {text-align: start;}

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

.text-xl-end {text-align: end;}

}



.fw-light {font-weight: light;}

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

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

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

.fw-bolder {font-weight: bolder;}



.position-static {position: static;}

.position-relative {position: relative;}

.position-absolute {position: absolute;}

.position-fixed {position: fixed;}

.position-sticky {position: -webkit-sticky;position: sticky;}