:root {
    --primcolor: #2b2b2b;
    --secocolor: #18151a;
    --white: #fff;
}
h2{
    font-size: 1.7rem;
}
h3{
    font-size: 1.5rem;
}
h4{
    font-size: 1.3rem;
}
.color-white{
    color:white !important;
}
.bg-color-footer-ex {
    background-color: #18151a;
}
.color-primary{
    color: var(--primcolor) !important;
}
.color-black{
    color:black !important;
}
.color-secondary {
    background-color: #1a1a1a;
}
.background-color-white{
    background-color: white;
}
.text-color-secondary {
    color: #1a1a1a !important;
}
.border-right-gray {
    border-right: 1px solid gray;
}
.pad-15 {
    padding: 15px !important;
}
.pad-left-30{
    padding-left: 30px;
}
.border-left-right-radius-none {
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}
.p-lr-45{
    padding-left: 45px !important;
    padding-right: 45px !important;
}
.mr-auto {
    margin-left: auto !important;
}
.pagination-button {
    background-color: #281e32;
    border-radius: 10px;
    color: white;
    padding: .775rem .75rem;

}
.pagination-button:hover{
    color: white;
}
.bread-active-color {
    color: #a8a8a8 !important;
}
/* Font size classes */
.font-size-10pt {
    font-size: 10pt;
}

.font-size-11pt {
    font-size: 11pt;
}

.font-size-12pt {
    font-size: 12pt;
}
.text-one-row {
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}
.font-size-13pt {
    font-size: 13pt;
}

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

.font-size-15pt {
    font-size: 15pt;
}

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

.font-size-17pt {
    font-size: 17pt;
}

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

.font-size-19pt {
    font-size: 19pt;
}

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

.font-size-21pt {
    font-size: 21pt;
}

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

.font-size-23pt {
    font-size: 23pt;
}

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

.font-size-25pt {
    font-size: 25pt;
}

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

.font-size-27pt {
    font-size: 27pt;
}

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

.font-size-29pt {
    font-size: 29pt;
}

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

.font-size-31pt {
    font-size: 31pt;
}

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

.font-size-33pt {
    font-size: 33pt;
}

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

.font-size-35pt {
    font-size: 35pt;
}

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

.font-size-37pt {
    font-size: 37pt;
}

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

.font-size-39pt {
    font-size: 39pt;
}

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

.font-size-41pt {
    font-size: 41pt;
}

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

.font-size-43pt {
    font-size: 43pt;
}

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

.font-size-45pt {
    font-size: 45pt;
}

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

.font-size-47pt {
    font-size: 47pt;
}

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

.font-size-49pt {
    font-size: 49pt;
}

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

.font-size-51pt {
    font-size: 51pt;
}

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

.font-size-53pt {
    font-size: 53pt;
}

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

.font-size-55pt {
    font-size: 55pt;
}

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

.font-size-57pt {
    font-size: 57pt;
}

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

.font-size-59pt {
    font-size: 59pt;
}

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

.font-size-61pt {
    font-size: 61pt;
}

.font-size-62pt {
    font-size: 62pt;
}

.font-size-63pt {
    font-size: 63pt;
}

.font-size-64pt {
    font-size: 64pt;
}

.font-size-65pt {
    font-size: 65pt;
}

.font-size-66pt {
    font-size: 66pt;
}

.font-size-67pt {
    font-size: 67pt;
}

.font-size-68pt {
    font-size: 68pt;
}

.font-size-69pt {
    font-size: 69pt;
}

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

.font-size-71pt {
    font-size: 71pt;
}

.font-size-72pt {
    font-size: 72pt;
}
.casino-games-badge {
    /*background: var(--primcolor);*/
    color: #000;
    padding: 5px 12px;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 600;
    display: inline-block;
    border: 1px solid #e3e3e3; border-radius: 10px
    /*box-shadow: 0 4px 10px rgba(254, 80, 1, 0.46);*/
}
.game-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 0px 9px rgb(254, 80, 1);
    border: 1px solid #2b2b2b;
}
.game-card {
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    box-shadow: 0 0px 9px rgba(40, 30, 50, 0.18);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.game-provider-heading {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.color-head-game-provider {
    color: #281e32;
    text-decoration: none;
    transition: 0.3s;
}
    .color-head-game-provider:hover {
        color: #2b2b2b;
        text-decoration: none;
        transition: 0.3s;
    }
.games-icon-check {
    position: absolute;
    width: 15px;
    right: 5px;
    top: 5px;
    color: #33874a
}
.games-icon-check-xmark {
    position: absolute;
    width: 15px;
    right: 5px;
    top: 5px;
    color: #e24c4b
}
.color-gray {
    color: #B3B3B3;
}
.p-tb-20{
    padding-top: 20px;
    padding-bottom: 20px;
}
.p-tb-22 {
    padding-top: 22px;
    padding-bottom: 22px;
}
.border-right {
    border-right: 1px solid #281e3229;
}
.font-size-heading{
    font-size: 1.75em;
}
.border-bottom-custom {
    border-bottom: 1px solid #281e3229;
}
.list-item-casino-cc {
    border-radius: 0px !important;
    box-shadow: none !important;
}
.sub-img-st {
    background-color: white;
    padding: 15px;
    border-radius: 50%;
}
.casino-list-head-bg {
    background-image: url('/img/casino-chip3.svg');
    background-repeat: no-repeat;
    background-position: right;

}
.bonus-list-head-bg {
    background-image: url('/img/money-bag-blur.svg');
    background-repeat: no-repeat;
    background-position: right;
}
.opc-95 {
    opacity: 0.95;
}
.home-page-head-dv {
    background: linear-gradient(0deg, #2f2b23 0%, #2f2b23 100%);
    color: white;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.home-cat-buttons {
    background-color: #281e32;
    color: white;
    border-color: #281e32;
}
.p-rl-10{
    padding-left: 10px;
    padding-right: 10px;
}
@font-face {
    font-family: 'Cera Pro Black Italic';
    src: url('../font/Cera Pro Black Italic.ttf')format("truetype");
}

    @font-face {
        font-family: 'Cera Pro Black';
        src: url('../font/Cera Pro Black.ttf')format('truetype');
    }

    @font-face {
        font-family: 'Cera Pro Bold';
        src: url('../font/Cera Pro Bold.ttf')format('truetype');
    }

    @font-face {
        font-family: 'Cera Pro Light';
        src: url('../font/Cera Pro Light.ttf')format('truetype');
    }

    @font-face {
        font-family: 'Cera Pro Medium';
        src: url('../font/Cera Pro Medium.ttf')format('truetype');
    }

    @font-face {
        font-family: 'Cera Pro Regular Italic';
        src: url('../font/Cera Pro Regular Italic.ttf')format('truetype');
    }

    .bg-shadow {
    box-shadow: 0 1px 1px 0 rgba(66, 66, 66, 0.08), 0 1px 3px 1px rgba(66, 66, 66, 0.16);
}

.checked {
    color: orange;
}
.font-size-20{
    font-size: 20px !important;
}
.casino-rating-icon {
    color: orange;
    font-size: 18px;
}
.casino-rating-detail-top {
    /*//font-family: Cera Pro Black;*/
    font-weight: 800;
    font-size: 18px;
    color: #ffa500;
}
.vpn-casino-text {
    margin: 0px;
    font-size: 12px;
    padding-top: 10px
}
.color-red {
    color: #dc3545 !important;
}
.bonus-casino-detail {
    font-size: 16px;
    color: white
}
.btn:focus {
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(253, 81, 13, 0.25) !important;
}
    /*.ribbon {
    width: 100px;
    height: 150px;
    background-color: $ribbonColor;
    position: absolute;
    right: 100px;
    top: -350px;
    animation: drop forwards .8s 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}
    &:before

{
    content: '';
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: -50px;
    border-left: 50px solid $ribbonColor;
    border-right: 50px solid $ribbonColor;
    border-bottom: 50px solid transparent;
}

&:after {
    content: '';
    width: 200px;
    height: 270px;
    position: absolute;
    z-index: -1;
    left: 0;
    bottom: -120px;
    background-color: $shadow;
    transform: skewY(35deg) skewX(0);
}

}*/
    @keyframes drop {
        0% {
            top: -350px;
        }

        100% {
            top: 0;
        }
    }

    a .navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

.text-upper-promo {
    font-family: Cera Pro Bold;
    font-size: 12px;
    color: #888888
}



/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    font-family: "Inter", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    line-height: 1.625em;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
}

.checked {
    color: orange;
}


.border-radius-15 {
    border-radius: 15px;
}

.rPostBorder {
    border: 1px solid lightskyblue;
    border-radius: 15px;
    background-color: lightskyblue;
}

.font-size-15 {
    font-size: 15px !important;
}

.recent-posts-h {
    font-size: 30px;
    font-family: Cera Pro Bold;
}

.fon-size-11 {
    font-size: 11px;
}

.cera-light {
    font-family: 'Cera Pro Light';
}

.cera-black {
    font-family: 'Cera Pro Black';
}

.table-of-content-border {
    border: 1px solid #f9fbff;
    border-radius: 20px;
    background-color: #f9fbff;
}

.hr-table {
    width: 50%;
}

.h4-lines {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid lightgray;
    line-height: 0.1em;
    margin: 10px 0 20px;
}

.h4-Lines,
.span-lines {
    background: #fff;
    padding: 0 10px;
    color: gray;
}

.show-more-less {
    font-size: 15px;
    color: gray;
}

.show_hide:hover {
    color: gray;
    text-decoration: none;
}

.top-left-right-radius {
    border-top-left-radius: 60px;
    border-top-right-radius: 60px;
}

.footer-background {
    background-color: lightgray;
}

.button-color {
    background-color: #014cfd
}

.table-head {
    background-color: #2d445c;
    color: white;
    font-weight: normal;
    border-radius: 20px;
}

th {
    font-weight: normal;
}

.thead-first-element {
    border-top-left-radius: 20px;
}

.thead-last-element {
    border-top-right-radius: 20px;
}

.table th {
    border: 0px;
}

.online-casino {
    background-color: #eff5f9;
    font-family: Cera Pro Light;
}

.online-casino-border {
    border: 1px solid gray;
    border-radius: 15px;
}


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

.online-casino-link,
.online-casino-link:hover {
    color: gray;
}

.parag-text-online-casino {
    font-size: 12px;
    color: #7f7f80;
}

.online-casino-white-part {
    background-color: white;
}

.font-style {
    font-family: Cera Pro Bold;
    padding: 10px 15px 10px 15px;
    border: 0px;
    border-radius: 15px;
    background-color: white
}

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

.star-color {
    color: orange;
}

.progress-bar-container {
    position: relative;
    width: 200px;
    height: 200px;
    margin: auto;
    width: 130px;
    height: 130px;
    /* border-top-left-radius: 60px;
    border-top-right-radius: 60px;*/
}

.progress-link {
    text-align: center;
    background-color: #f8f9fa;
    border-top-right-radius: 25px;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 14px;
    font-family: 'Cera Pro Bold';
}

.casino-bonus-font {
    font-size: 13px;
    color: gray;
}

.casino-bonus-font-right {
    color: black;
    font-size: 13px;
}

.casino-bonus-button {
    background-color: orange;
    border-radius: 20px;
    color: white;
    font-family: Cera Pro Bold;
    line-height: 2.1;
}

.game-manufacturer-font > a {
    color: gray;
    text-decoration: underline;
}

    .game-manufacturer-font > a:hover {
        text-decoration: none;
        color: blue;
    }

.view-betting-sites-text > a {
    color: gray;
}

    .view-betting-sites-text > a:hover {
        text-decoration: none;
        color: gray;
    }

.chevron-color:hover {
    color: blue;
}

.horizontal-margins > hr {
    margin: 5px 0 5px 0;
    width: 100%;
}

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

.badge-cat-news {
    background-color: #9FCC37;
    color: white;
    border-radius: 10px;
    padding: 3px 20px 3px 20px;
    font-size: 10px;
}

.news-right > a, .news-right > a:hover {
    color: black;
    text-decoration: none;
}

.bonus-right-news > a:hover, .bonus-right-news > a {
    text-decoration: none;
    color: black;
}

.header-border-bonus {
    background-color: #2d445c;
    color: white;
    border: 15px;
    padding: 3px 20px 3px 20px;
    border-radius: 15px;
}


.related-posts-text > a:hover {
    text-decoration: none;
    color: orange;
}

/*NAVIGATION BAR SEARCH*/

.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
}


.btn-search {
    color: #7f7f80;
    background-color: white;
    border-color: lightgray;
}

/*END NAVIGATION BAR SEARCH*/


/*NAVBAR LOGO*/

.logo-image {
    width: 70px;
    height: 70px;
    overflow: hidden;
    margin-top: -5px;
}

/*NAVBAR LOGO END*/


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

.casino-bonus-badge {
    background-color: #7f7f80;
    border-radius: 15px;
    padding-top: 2px;
    padding-left: 5px;
    padding-bottom: 2px;
    padding-right: 5px;
    font-size: 12px;
    color: #eff5f9;
}

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


 .text-decoration-none{
    text-decoration: none;
 }

/* News properties */
.image-tranform {
    border: 1px solid #fff;
    overflow: hidden;
    transition: all .3s linear;
    border-radius: 0.5rem;
}

.image-tranform:hover img {
    transform: scale(1.05);
    transition: all .3s linear;
    border-radius: 15px;
}
/*HOME PAGE CASINO CARDS*/
.casino-card {
    background-color: white;
    border: none;
    border-radius: 20px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}
.inner-card-description {
    padding: 0.5rem 1.25rem 1.25rem 1.25rem;
    background-color: white;
    border-radius: 20px;
    text-align: center;
}
.casino-card-image {
    border-top-left-radius: calc(1.25rem - 1px);
    border-top-right-radius: calc(1.25rem - 1px);
    width: 100%
}

.color-gold{
    color:gold;
}
.color-orange {
    color: orange;
}
.inner-card-bonus-desc {
    color: #b10e29;
    font-weight: bold
}

.latest-bonuses {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    background-color: white;
    border-radius: 10px;
}

.casino-list-item {
    position: relative;
    padding: 10px;
    border-radius: 15px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    background-color: white;
}

.casino-list-item-badge {
    left: -10px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    max-width: 50px;
    border-radius: 50%;
    position: absolute;
    top: -12px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    text-align: right;
}

.badge-article-news{
  background-color: #1861ac;
  color: white;
  border-radius: 10px;
  font-size: 10px;
  padding: 0.5em;
}

.font-cera-pro-black{
    font-family: 'Cera Pro Black';
}

.ribbonn {
    position: absolute;
    right: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

    .ribbonn span {
        font-size: 10px;
        font-weight: bold;
        color: #FFF;
        text-transform: uppercase;
        text-align: center;
        line-height: 20px;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        width: 100px;
        display: block;
        background: var(--primcolor);
        background: linear-gradient(#2b2b2b 0%, #2b2b2b 100%);
        box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
        position: absolute;
        top: 19px;
        right: -21px;
    }

        .ribbonn span::before {
            content: "";
            position: absolute;
            left: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid var(--primcolor);
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid var(--primcolor);
        }

        .ribbonn span::after {
            content: "";
            position: absolute;
            right: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid transparent;
            border-right: 3px solid var(--primcolor);
            border-bottom: 3px solid transparent;
            border-top: 3px solid var(--primcolor);
        }
/* news page */
/* News Single
================================================== */
.tags-area {
    margin: 20px 0;
  }
  
  .post-tags a {
    border: 1px solid #dadada;
    color: #7c7c7c;
    display: inline-block;
    font-size: 12px;
    padding: 3px 10px;
    margin-left: 3px;
  }
  
  .post-tags a:hover {
    background: #ffb600;
    color: #fff;
    border: 1px solid transparent;
  }
  
  /* Post social */
  .post-social-icons > li {
    display: inline-block;
  }
  
  .post-social-icons a i {
    margin-left: 5px;
    font-size: 12px;
    width: 28px;
    height: 26px;
    line-height: 26px;
    color: #fff;
    text-align: center;
  }
  
  .post-social-icons a i.fa-facebook-f {
    background: #41578a;
  }
  
  .post-social-icons a i.fa-twitter {
    background: #64bae2;
  }
  
  .post-social-icons a i.fa-google-plus {
    background: #c0343d;
  }
  
  .post-social-icons a i.fa-linkedin {
    background: #3397b6;
  }
  
  /* Author box */
  .author-box {
    border: 1px solid #dadada;
    padding: 20px 20px 15px;
    margin: 20px 0;
  }
  
  .author-img img {
    width: 110px;
    height: 110px;
    margin-right: 30px;
  }
  
  .author-info h3 {
    margin-top: 0;
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: 600;
  }
  
  .author-info h3 span {
    font-size: 12px;
    color: #999;
    border-left: 1px solid #AFAFAF;
    padding-left: 10px;
    margin-left: 10px;
    font-weight: 500;
  }
  
  
  /* Sidebar
  ================================================== */
  .sidebar .widget-title {
    font-size: 16px;
    font-weight: 700;
    position: relative;
    margin: 0 0 30px;
    padding-left: 15px;
    text-transform: uppercase;
    border-left: 3px solid #ffb600;
  }
  
  /* Widget common */
  .sidebar .widget {
    margin-bottom: 40px;
  }
  
  .sidebar-left .widget {
    margin-right: 20px;
  }
  
  .sidebar-right .widget {
    margin-left: 20px;
  }
  
  .sidebar .widget.box {
    padding: 25px;
  }
  
  .widget.box.solid {
    background: #f2f2f2;
  }
  
  .widget.box.red {
    background: #ec483b;
    color: #fff;
  }
  
  .widget.box.red .widget-title {
    color: #fff;
  }
  
  .widget ul li {
    line-height: 30px;
  }
  
  .sidebar .widget ul li a {
    color: #303030;
  }
  
  .sidebar .widget ul li a:hover {
    color: #ffb600;
  }
  
  .sidebar .widget ul li i {
    margin-right: 5px;
  }
  
  .sidebar .btn {
    font-weight: 700;
    font-size: 12px;
    margin-top: 15px;
    padding: 10px 25px;
  }
  
  /* Sidebar nav */
  .sidebar ul.nav-tabs {
    border: 0;
  }
  
  .sidebar ul.nav-tabs li {
    width: 100%;
  }
  .sidebar ul.nav-tabs li a {
    color: #303030;
    border-radius: 0;
    padding: 15px 0;
    padding-left: 0;
    font-weight: 400;
    border-bottom: 1px solid #ddd;
    display: block;
    transition: 400ms;
  }
  
  .sidebar ul.nav-tabs li.active a,
  .sidebar ul.nav-tabs li:hover a {
    color: #ffb600;
  }
  
  .sidebar ul.nav-tabs li {
    color: #303030;
    line-height: normal;
  }
  
  .sidebar ul.nav-tabs li:last-child a {
    border-bottom: 0;
  }
  
  /* Service menu */
  .sidebar ul.service-menu li {
    width: 100%;
  }
    .sidebar ul.service-menu li a {
        background-color: #f4f4f4;
        padding: 15px 20px;
        border: 0;
        margin-bottom: 8px;
    }
.sidebar-articles{
  background-color: #f4f4f1;
  border-radius: 20px;
  overflow: hidden;
  padding: 16px 8px 8px;
}

.sidebar-articles-title{
  align-items: center;
  color: #a1a490;
  display: flex;
}

.sidebar-articles-bell{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  width: 40px;
  height: 40px;
}

.side-bar-articles-bell-inside{
  position: relative;
  display: block;
  max-width: 100%;
  overflow: hidden;
  background-color: inherit;
}

.sidebar-articles-bell-img{
  width: 100%;
  vertical-align: middle;
}

.margin-right-1-em{
  margin-right: 1em;
}

.sidebar-articles-u-list{
  position: relative;
  z-index: 1;
  margin-bottom: 16px;
  margin-top: 0.5em;
  padding: 0;
}

.sidebar-articles-list-li{
  margin-bottom: 2px;
  overflow: hidden;
  background-color: #fff;
}

.sidebar-articles-list-li:first-of-type{
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.sidebar-articles-li-a{
  position: relative;
  display: block;
  padding: 16px 18px 16px 48px;
  font-weight: 600;
  word-break: break-word;
  color: #474b2f;
  text-decoration: none;
}

.sidebar-articles-li-a:hover{
  color: #474b2f8c;
}

.sidebar-articles-list-li:last-of-type{
  margin-bottom: 0;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
}

.sidebar-btn-main{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  height: 44px;
  padding: 6px 20px;
  border: 0;
  border-color: #eceee3;
  border-radius: 20px;
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  color: #afb599;
  background-color: transparent;
  transition: color .35s;
}

.sidebar-btn-second{
  padding: 0;
  width: 100%;
  margin: 0;
  height: auto;
}

.sidebar-articles-subscribe-button-span{
  width: 100%;
  position: relative;
  justify-content: center;
  z-index: 1;
}

.sidebar-articles-subscribe-button-span:hover{
  color: #000;
}


/* Sidebar best bonuses */
.sidebar-best-bonuses{
  border-radius: 10px;
  overflow: hidden;
  padding: 16px 8px 8px;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.sidebar-best-bonuses-title{
  align-items: center;
  color: #a1a490;
  display: flex;
}

.sidebar-best-bonuses-bell{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  width: 40px;
  height: 40px;
  margin-bottom: 1.3em;
}

.side-bar-best-bonuses-bell-inside{
  position: relative;
  display: block;
  max-width: 100%;
  overflow: hidden;
  background-color: inherit;
}

.sidebar-best-bonuses-bell-img{
  width: 100%;
  vertical-align: middle;
}

.margin-right-1-em{
  margin-right: 1em;
}

.sidebar-best-bonuses-u-list{
  position: relative;
  z-index: 1;
  margin-bottom: 16px;
  margin-top: 0.5em;
  padding: 0;
}

.sidebar-best-bonuses-list-li{
  margin-bottom: 2px;
  overflow: hidden;
  background-color: #fff;
}

.sidebar-best-bonuses-list-li:first-of-type{
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.sidebar-best-bonuses-li-a{
  position: relative;
  display: block;
  padding: 0.3em;
  font-weight: 600;
  word-break: break-word;
  color: #474b2f;
  text-decoration: none;
}

.sidebar-best-bonuses-li-a:hover{
  color: #474b2f8c;
}

.sidebar-best-bonuses-list-li:last-of-type{
  margin-bottom: 0;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
}

.sidebar-best-bonuses-font-12{
  font-size: 12px;
}


.sidebar-article-details-box-shadow{
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.sidebar-article-author-name{
  white-space: nowrap; 
  overflow: hidden;
  text-overflow: ellipsis; 
}

.article-text{
  color: #474b2f;
}

/* You might also like section */
.badge-ymal-news{
  display: inline-block;
  margin-right: 8px;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: inherit;
  font-weight: 600;
  line-height: 20px;
  white-space: nowrap;
  cursor: pointer;
  color: #a1a490;
  box-shadow: inset 0 0 0 2px #eceee3;
}

.badge-ymal-news:hover{
  color: #474b2f;
  transition: color .35s,background-color .35s;
  background-color: #eceee3;
}
/* News properties end */


/* Bonus properties start*/
.bonus-box-shadow{
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.bonus-attributes .col-6:nth-child(even){
  text-align: right;
}

/* Bonus properties end*/


.border-radius-108{
    border-radius: 108px;
}

.container-fluid-bookmaker-top {
    position: relative;
}

    .container-fluid-bookmaker-top::before {
        content: "";
        /*background: url('/img/240_F_625577885_pitmYHZcPOk6rL4HksgZ8JuimZo6Risx.jpg');*/
        opacity: 0.9;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        position: absolute;
        z-index: -1;
        padding-top: 100px;
        padding-bottom: 100px;
        background-color: #281e32;
    }

.vh-40{
    height: 40vh !important;
}

.main-box-widgets {
    background-color: #f6f6f8;
  }

  .table-of-content-top-wrapper {
    /* border-bottom: 1px solid #ffb80c; */
    background-color: #e9eaeb;
  }

  .container-1250 {
    max-width: 1250px;
    margin: 0 auto;
  }

  .table-of-content-top {
    width: 100%;
    padding: 16px 0;
    display: flex;
    align-items: center;
  }

  .toc-content-all-wrapper {
    display: flex;
  }

  .toc-content {
    margin: 0 26px 0 0;
  }

  .table-of-content-top a {
    color: #111;
    text-decoration: none;
    font-size: 15px;
    line-height: 21px;
    margin-right: 16px;
  }

  .table-of-content-top a:hover {
    color: #725000;
  }

  .visibility-none{
    visibility: hidden;
  }

@media screen and (max-width: 992px) {
    .toc-content {
        display: none; /* Hide text on small screens */
    }

    .toc-content-mobile{
        visibility: visible;
    }

    .toc-content-mobile a{
        padding-left: 0.5em;
        font-size: 28px;
    }

    .toc-content-mobile a:first-of-type{
        padding-left: 0.30em;
        font-size: 28px;
    }

    /* .toc-content::before {
        content: url('icon.png'); 
        display: block; 
    } */
}
.hero-waves {
    display: block;
    width: 100%;
    height: 60px;
    position: relative;
}

.wave1 use {
    -webkit-animation: move-forever1 10s linear infinite;
    animation: move-forever1 10s linear infinite;
    -webkit-animation-delay: -2s;
    animation-delay: -2s;
}

.wave2 use {
    -webkit-animation: move-forever2 8s linear infinite;
    animation: move-forever2 8s linear infinite;
    -webkit-animation-delay: -2s;
    animation-delay: -2s;
}

.wave3 use {
    -webkit-animation: move-forever3 6s linear infinite;
    animation: move-forever3 6s linear infinite;
    -webkit-animation-delay: -2s;
    animation-delay: -2s;
}

@-webkit-keyframes move-forever1 {
    0% {
        transform: translate(85px, 0%);
    }

    100% {
        transform: translate(-90px, 0%);
    }
}

@keyframes move-forever1 {
    0% {
        transform: translate(85px, 0%);
    }

    100% {
        transform: translate(-90px, 0%);
    }
}

@-webkit-keyframes move-forever2 {
    0% {
        transform: translate(-90px, 0%);
    }

    100% {
        transform: translate(85px, 0%);
    }
}

@keyframes move-forever2 {
    0% {
        transform: translate(-90px, 0%);
    }

    100% {
        transform: translate(85px, 0%);
    }
}

@-webkit-keyframes move-forever3 {
    0% {
        transform: translate(-90px, 0%);
    }

    100% {
        transform: translate(85px, 0%);
    }
}

@keyframes move-forever3 {
    0% {
        transform: translate(-90px, 0%);
    }

    100% {
        transform: translate(85px, 0%);
    }
}

.custom-shadow {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}
.custom-border-radius{
    border-radius: 15px !important;
}

/* HTML: <div class="ribbon">Your text content</div> */
.ribbon1 {
    font-weight: bold;
    color: #fff;
    z-index:10;
}

.ribbon1 {
    --f: .5em; /* control the folded part*/
    --r: .8em; /* control the ribbon shape */

    position: absolute;
    top: 20px;
    right: calc(-1*var(--f));
    padding-inline: 1em;
    line-height: 2.2;
    background: linear-gradient(#2b2b2b 0%, #2b2b2b 100%);
    border-bottom: var(--f) solid #0005;
    border-left: var(--r) solid #0000;
    clip-path: polygon(var(--r) 0,100% 0,100% calc(100% - var(--f)),calc(100% - var(--f)) 100%, calc(100% - var(--f)) calc(100% - var(--f)),var(--r) calc(100% - var(--f)), 0 calc(50% - var(--f)/2));
}


/* HTML: <div class="ribbon">Your text content</div> */
.ribbon2 {
    font-size: 14px;
    font-weight: bold;
    color: #fff;
}

.ribbon2 {
    --r: .4em; /* control the ribbon shape (the radius) */

    position: absolute;
    bottom: 0px;
    inset-inline: calc(-1*var(--r));
    text-align: center;
    line-height: 1.5;
    padding: calc(2*var(--r)) .5em 0;
    border-radius: var(--r);
    --_g: 0/var(--r) calc(2*var(--r)) no-repeat;
    background: radial-gradient(100% 50% at right,#0005 98%,#0000 101%) 0 var(--_g), radial-gradient(100% 50% at left,#0005 98%,#0000 101%) 100% var(--_g), conic-gradient(at var(--r) calc(2*var(--r)),#0000 25%,#8FBE00 0) 0 0/calc(100% - var(--r)) 100%;
}


.casino-detail-card {
    position: relative;
    /*display: flex;*/
    flex-direction: row;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
  /*  user-select: none;*/
    margin: 1rem auto;
    background-color: #282c34;
    background: linear-gradient(0deg, rgba(17, 0, 32, 0.1) 0%, rgba(17,0,32,.1) 100%);
    box-shadow: 0 7px 20px 5px #00000088;
    border-radius: .7rem;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    overflow: hidden;
    transition: .5s all;
}

/* HTML: <div class="ribbon">Your text content</div> */
.ribbon-detail-casino {
    font-size: 28px;
    font-weight: bold;
    color: #fff;
}

.ribbo-detail-casino {
    --f: .4em; /* control the folded part */
    --r: .8em; /* control the cutout */

    position: absolute;
    right: 20px;
    top: calc(-1*var(--f));
    padding: .2em;
    border: solid #0000;
    border-width: 0 calc(2*var(--f)) var(--r) 0;
    background: radial-gradient(50% 100% at bottom,#0005 98%,#0000 101%) 100% 0/calc(2*var(--f)) var(--f) no-repeat border-box;
    background-color: #C8CF02;
    border-radius: var(--f) var(--f) 0 0;
    clip-path: polygon(100% 0,0 0,0 calc(100% - var(--r)),calc(50% - var(--f)) 100%,calc(100% - 2*var(--f)) calc(100% - var(--r)),calc(100% - 2*var(--f)) var(--f),100% var(--f));
}



/* HTML: <div class="ribbon">Your text content</div> */
.ribbon3 {
    font-size: 28px;
    font-weight: bold;
    color: #fff;
}

.ribbon3 {
    --f: .5em; /* control the folded part*/
    --r: .8em; /* control the ribbon shape */

    position: absolute;
    left: 20px;
    top: calc(-1*var(--f));
    padding: .2em;
    background: #BF4D28;
    border-left: var(--f) solid #0005;
    border-bottom: var(--r) solid #0000;
    clip-path: polygon(var(--f) 0,100% 0,100% calc(100% - var(--r)),calc(50% + var(--f)/2) 100%, var(--f) calc(100% - var(--r)),var(--f) var(--f),0 var(--f));
}


/*MAIN NAV START*/

.nav-item{
    line-height: 33px;
}


#main-nav-top {
    background-color: #18151a;
    color: white;
    /*border-bottom: 4px solid var(--primcolor);*/
}
.nav-item-custom:hover {
    transition: 0.3s;
    background: var(--primcolor);
}

.nav-item-custom:hover .angle-icon svg {
    transition: 0.3s;
    transform: rotate(0.5turn);

}

.nav-item-custom .angle-icon svg {
    transition: 0.3s;
    transform: rotate(0.0turn);
}

.dropdown-btn:hover .dropdown-inner-content {
    display: block;
    transition: 0.3s;
}
.dropdown-inner-content a:hover {
    background-color: #272528;
    color: white;
    padding-left: 25px !important;
    /*border-left: 10px solid var(--secocolor);*/
    transition: 0.3s;
}
.dropdown-inner-content a {
    transition: 0.3s;
}

.dropdown-inner-content a {
    color: white;
    padding: 12px 16px;
}

.dropdown-inner-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 250px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    text-align: left;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: var(--primcolor);
}

.dropdown-btn {
    position: relative;
    display: inline-block;
}


.offcanvas{
    width: 260px !important;
    background-color: var(--secocolor);
}
.mobile-nav-item {
    border-bottom: 1px solid #33263f;
}

.mob-nav-pad {
    padding: 15px 15px !important;
}
.scroll-nav-mobile{
    overflow-x: scroll !important;
}
.mobile-sub-nav-item {
    padding: 15px 0px 15px 25px;
    text-decoration: none !important;
    color: white;
    transition: 0.3s;
}
.mobile-sub-nav-item:hover{
    color: white;
    background-color: var(--primcolor);
    transition: 0.3s;
}
/*.mobile-nav-item{
    background-color: var(--primcolor);
}*/

.rotateIcon .angle-icon svg {
    transition: 0.3s;
    transform: rotate(0.5turn);
}

.angle-icon svg {
    transition: 0.3s;
}

#nav-icon-burger{
    width: 30px;
    height: 20px;
    position: relative;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}

#nav-icon-burger span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: #9e8048;
    border-radius: 15px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}


#nav-icon-burger span:nth-child(1) {
    top: 0px;
}

#nav-icon-burger span:nth-child(2), #nav-icon-burger span:nth-child(3) {
    top: 8px;
}

#nav-icon-burger span:nth-child(4) {
    top: 16px;
}

#nav-icon-burger.open span:nth-child(1) {
    top: 18px;
    width: 0%;
    left: 50%;
}

#nav-icon-burger.open span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

#nav-icon-burger.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

#nav-icon-burger.open span:nth-child(4) {
    top: 18px;
    width: 0%;
    left: 50%;
}

/*MAIN NAV END*/
.rating-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row-reverse;
    padding: 2em 2em 2em 5em;
    gap: 10px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    border: none;
    position: relative;
    background: #281e32;
    /*  box-shadow: 0 1px 1px #000, 0 2px 2px #000, 0 4px 4px #000, 0 8px 8px #000, 0 16px 16px #000;*/
}

    .rating-container .rating-value {
        position: absolute;
        top: 18px;
        left: 5px;
        border-radius: 50%;
        height: 75px;
        width: 75px;
        background: #fb0;
       /* box-shadow: 0 1px 1px #000, 0 2px 2px #000, 0 4px 4px #000, 0 8px 8px #000, 0 16px 16px #000, inset 0 0 10px #f7db5e, 0 0 10px #f7db5e;*/
    }

        .rating-container .rating-value:before {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
            text-align: center;
            line-height: 70px;
            font-size: 2.5em;
            color: #281e32;
            content: "0";
            transform-origin: "center";
            transition: all 0.25s ease 0s;
        }

        .rating-container .rating-value:after {
            content: "";
            position: absolute;
            height: 75px;
            width: 75px;
            top: -1px;
            left: -1px;
            margin: auto;
            border: 1px solid #fb0;
            border-radius: 50%;
            transition: all 0.4s ease-in;
        }

    .rating-container input {
        display: none;
    }

    .rating-container label {
        height: 50px;
        width: 50px;
        transform-origin: "center center";
    }

        .rating-container label svg {
            transition: transform 0.4s ease-in-out;
            opacity: 0.5;
        }

        .rating-container label:hover svg {
            transform: scale(1.25) rotate(10deg);
        }

input:checked ~ label svg {
    opacity: 1;
    transform: scale(1.25) rotate(10deg);
}

label:hover svg, label:hover ~ label svg {
    opacity: 1;
    transform: scale(1.25) rotate(10deg);
}

input:checked + label:hover svg {
    opacity: 1;
}

input:checked ~ label:hover svg, input:checked ~ label:hover ~ label svg {
    opacity: 1;
}

label:hover ~ input:checked ~ label svg {
    opacity: 1;
}

#rate1:checked ~ .rating-value:before {
    content: "1";
    font-size: 2.75em;
}

label[for="rate1"]:hover ~ .rating-value:before {
    content: "1" !important;
    font-size: 2.75em !important;
}

#rate2:checked ~ .rating-value:before {
    content: "2";
    font-size: 3em;
}

label[for="rate2"]:hover ~ .rating-value:before {
    content: "2" !important;
    font-size: 3em !important;
}

#rate3:checked ~ .rating-value:before {
    content: "3";
    font-size: 3.25em;
}

label[for="rate3"]:hover ~ .rating-value:before {
    content: "3" !important;
    font-size: 3.25em !important;
}

#rate4:checked ~ .rating-value:before {
    content: "4";
    font-size: 3.5em;
}

label[for="rate4"]:hover ~ .rating-value:before {
    content: "4" !important;
    font-size: 3.5em !important;
}

#rate5:checked ~ .rating-value:before {
    content: "5";
    font-size: 3.5em;
}

label[for="rate5"]:hover ~ .rating-value:before {
    content: "5" !important;
    font-size: 3.5em !important;
}

#rate6:checked ~ .rating-value:before {
    content: "6";
    font-size: 3.5em;
}

label[for="rate6"]:hover ~ .rating-value:before {
    content: "6" !important;
    font-size: 3.5em !important;
}

#rate7:checked ~ .rating-value:before {
    content: "7";
    font-size: 3.5em;
}

label[for="rate7"]:hover ~ .rating-value:before {
    content: "7" !important;
    font-size: 3.5em !important;
}

#rate8:checked ~ .rating-value:before {
    content: "8";
    font-size: 3.5em;
}

label[for="rate8"]:hover ~ .rating-value:before {
    content: "8" !important;
    font-size: 3.5em !important;
}

#rate8:checked ~ .rating-value:before {
    content: "8";
    font-size: 3.5em;
}

label[for="rate8"]:hover ~ .rating-value:before {
    content: "8" !important;
    font-size: 3.5em !important;
}

#rate9:checked ~ .rating-value:before {
    content: "9";
    font-size: 3.5em;
}

label[for="rate9"]:hover ~ .rating-value:before {
    content: "9" !important;
    font-size: 3.5em !important;
}

#rate10:checked ~ .rating-value:before {
    content: "10";
    font-size: 3.75em;
}

@keyframes pulse {
    0% {
        height: 75px;
        width: 75px;
        top: -1px;
        left: -1px;
        opacity: 1;
    }

    100% {
        height: 170px;
        width: 170px;
        top: -16px;
        left: -16px;
        opacity: 0;
    }
}

#rate10:checked ~ .rating-value:after {
    animation: pulse 0.4s ease-out 1;
}

label[for="rate10"]:hover ~ .rating-value:before {
    content: "10" !important;
    font-size: 3.75em !important;
}

/* BONUS PAGE START*/
.bonus-cat-tabs {
    border-radius: 10px;
    background-color: var(--secocolor);
    display: inline-block;
    transition: 0.3s;
}
.bonus-cat-tabs:hover {
        background-color: var(--primcolor);
        transition: 0.3s;
}
/* BONUS PAGE END*/

.btn-primary-vis {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: white;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: var(--primcolor);
    /* border: 1px solid transparent;*/
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.btn-primary-vis:hover{
    background: var(--secocolor);
    color: white;
    transition: 0.3s;
}


.news-list-card {
    overflow: hidden;
    border-radius: 15px;
    position: relative;
    color: white;

}
.news-list-card:hover > a > img {
    transform: scale(1.1);
    overflow: hidden;
    transition: 0.3s;
}
.news-list-card > a > img {
     transition: 0.3s;

}

.news-card-block {
    position: absolute;
    background: linear-gradient(180deg,transparent,rgba(0,0,0,.70));
    bottom: 0px;
    left: 0;
    right: 0;
    height: 100%
}
.news-card-block-inner {
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    padding: 20px;
}
.news-card-block-inner-title {
    color: white;
    font-size: 18px;
    text-align: left;
}

.article-tags a::after {
    background: #fff;
    border-bottom: 13px solid transparent;
    border-left: 10px solid var(--secocolor);
    border-top: 13px solid transparent;
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    transition: 0.3s;
}
.article-tags a::before {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
    content: '';
    height: 6px;
    right: 13px;
    position: absolute;
    width: 6px;
    top: 10px;
}

.article-tags a {
    background: var(--secocolor);
    border-radius: 3px 0 0 3px;
    color: #fff !important;
    display: inline-block !important;
    height: 26px;
    float: left;
    line-height: 26px;
    padding: 0 30px 0 10px;
    position: relative;
    margin: 0 3px 3px 0;
    text-decoration: none;
    -webkit-transition: color 0.2s;
    transition: 0.3s;
}
.article-tags a:hover::after {
    border-left-color: var(--primcolor);
    transition: 0.3s;
}
.article-tags a:hover {
    background-color: var(--primcolor);
    color: white;
    transition: 0.3s;
}

.general-header {
    font-size: 18px;
    color: white;
    background-color: #281e32;
    padding: 15px;
    border-left: 10px solid #2b2b2b
}
.bg-color-primary{
    background-color: var(--primcolor) !important;
}
.general-header-t-one {
    font-size: 18px;
    color: white;
    background-color: #281e32;
    padding: 15px;
}
.rating-tables-brands-absolute::after {
    content: "";
    position: absolute;
    top: -8px;
    left: -30px;
    display: inline-block;
    border-top: 70px solid rgba(0,0,0,0);
    border-bottom: 58px solid rgba(0,0,0,0);
    border-right: 34px solid #281e32;
}

.limit-one-row-text {
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}
.hover-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

    /* Image styling */
    .hover-container img {
        display: block;
        width: 100%;
        height: auto;
    }

/* Dot container */
.hover-dot {
    position: absolute;
    top: 10px; /* Adjust position as needed */
    right: 10%;
    transform: translateX(-50%);
    width: 10px;
    height: 10px;
    background-color: #2b2b2b;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    animation: pulse 1.5s infinite;
    transition: background-color 0.3s;
}

/* Change dot color on hover */
.hover-container:hover .hover-dot {
    background-color: #2b2b2b;
}

/* Pulse animation */
@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgb(220, 53, 69);
    }

    70% {
        transform: scale(1.2);
        box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
    }

    100% {
        transform: scale(1.5);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}

.content {
    width: 100%;
    height: 55px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    border-radius: 60px;
    overflow: hidden;
}

.subscription {
    position: relative;
    width: 100%;
    height: 100%;
}

    .subscription .add-email {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: none;
        outline: none;
        padding: 0 20px;
    }

    .subscription .submit-email {
        position: absolute;
        top: 0;
        right: 0;
        height: calc(100% - 2px);
        width: 120px;
        border: none;
        border-radius: 60px;
        outline: none;
        margin: 1px;
        padding: 0 20px;
        cursor: pointer;
        background: linear-gradient(#2b2b2b 0%, #2b2b2b 100%);
        color: #FFFFFF;
        transition: width .35s ease-in-out, background .35s ease-in-out;
    }

    .subscription.done .submit-email {
        width: calc(100% - 2px);
        background: linear-gradient(#2b2b2b 0%, #2b2b2b 100%);
    }

    .subscription .submit-email .before-submit,
    .subscription .submit-email .after-submit {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        text-align: center;
        line-height: 52px;
        transition: visibility .35s ease-in-out, opacity .35s ease-in-out;
    }

    .subscription.done .submit-email .before-submit,
    .subscription:not(.done) .submit-email .after-submit {
        visibility: hidden;
        opacity: 0;
    }

    .subscription .submit-email .after-submit {
        transition-delay: .35s;
    }

    .subscription:not(.done) .submit-email .before-submit,
    .subscription.done .submit-email .after-submit {
        visibility: visible;
        opacity: 1;
    }


/* success modal */
.modal#statusSuccessModal .modal-content, 
.modal#statusErrorsModal .modal-content {
	border-radius: 30px;
}
.modal#statusSuccessModal .modal-content svg, 
.modal#statusErrorsModal .modal-content svg {
	width: 100px; 
	display: block; 
	margin: 0 auto;
}
.modal#statusSuccessModal .modal-content .path, 
.modal#statusErrorsModal .modal-content .path {
	stroke-dasharray: 1000; 
	stroke-dashoffset: 0;
}
.modal#statusSuccessModal .modal-content .path.circle, 
.modal#statusErrorsModal .modal-content .path.circle {
	-webkit-animation: dash 0.9s ease-in-out; 
	animation: dash 0.9s ease-in-out;
}
.modal#statusSuccessModal .modal-content .path.line, 
.modal#statusErrorsModal .modal-content .path.line {
	stroke-dashoffset: 1000; 
	-webkit-animation: dash 0.95s 0.35s ease-in-out forwards; 
	animation: dash 0.95s 0.35s ease-in-out forwards;
}
.modal#statusSuccessModal .modal-content .path.check, 
.modal#statusErrorsModal .modal-content .path.check {
	stroke-dashoffset: -100; 
	-webkit-animation: dash-check 0.95s 0.35s ease-in-out forwards; 
	animation: dash-check 0.95s 0.35s ease-in-out forwards;
}

@-webkit-keyframes dash { 
	0% {
		stroke-dashoffset: 1000;
	}
	100% {
		stroke-dashoffset: 0;
	}
}
@keyframes dash { 
	0% {
		stroke-dashoffset: 1000;
	}
	100%{
		stroke-dashoffset: 0;
	}
}
@-webkit-keyframes dash { 
	0% {
		stroke-dashoffset: 1000;
	}
	100% {
		stroke-dashoffset: 0;
	}
}
@keyframes dash { 
	0% {
		stroke-dashoffset: 1000;}
	100% {
		stroke-dashoffset: 0;
	}
}
@-webkit-keyframes dash-check { 
	0% {
		stroke-dashoffset: -100;
	}
	100% {
		stroke-dashoffset: 900;
	}
}
@keyframes dash-check {
	0% {
		stroke-dashoffset: -100;
	}
	100% {
		stroke-dashoffset: 900;
	}
}
.box00{
	width: 100px;
	height: 100px;
	border-radius: 50%;
}

/* end of success modal */

.accordion-button {
    background: linear-gradient(0deg, rgba(215,68,1,1) 0%, rgba(254,80,1,1) 100%) !important;
    color: white !important;
}
.accordion-item{
    border: none !important;
}
.accordion-button:focus {
    box-shadow: 0 0 0 .25rem rgba(251, 79, 1, 0.18) !important;
}
.casino-detail-top-cards {
    background: rgb(224,70,0);
    background: linear-gradient(90deg, rgba(224,70,0,1) 0%, rgba(254,80,1,1) 100%);
    /*max-width: 306px;*/
    height: 112px;
}
.casino-detail-cards-text {
    color: white;
    font-family: Cera Pro Black;
    font-size: 25px;
}
.casino-detail-cards-text-inner {
    color: white;
    font-family: Cera Pro Black;
    font-size: 15px;
}
/*rating casino stars start*/
.wrapper {
    padding: 0.3rem 0.6rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    border-radius: 0.25rem;
    background-color: rgba(255, 255, 255, 0.5);
    z-index: 1;
}
.rate-box {
    display: flex;
    flex-direction: row-reverse;
    gap: 0.1rem;
    justify-content: center;
}

    .rate-box input {
        display: none;
    }

        .rate-box input:hover ~ .star:before {
            color: rgba(255, 204, 51, 0.5);
        }

        .rate-box input:active + .star:before {
            transform: scale(0.9);
        }

        .rate-box input:checked ~ .star:before {
            color: #ffcc33;
            text-shadow: rgba(0, 0, 0, 0.13) 3px 3px 8px, rgba(255, 255, 255, 0.8) -3px -3px 8px;
        }

    .rate-box .star:before {
        content: "\2605";
        display: inline-block;
        font-size: 2.4rem;
        cursor: pointer;
        color: #0000;
        text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.5);
        background-color: #c7c7c7;
        background-clip: text;
        -webkit-background-clip: text;
        transition: all 0.3s;
    }
/*rating casino stars end*/
.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: var(--primcolor);
    outline: 0;
    box-shadow: rgba(251, 79, 1, 0.18) 0px 0px 0px 0.25rem !important;
}
.font-size-18{
    font-size: 18px !important;
}
.bonus-code-wrapper {
    border-radius: 10px;
    width: fit-content;
    border: 1px dashed gray
}
.bonus-code-inner {
    background-color: #f2efe8;
    padding: 5px;
    border-radius: 5px 0px 0px 5px;
    font-size: 12px
}
.bonus-code-text {
    padding: 5px;
    border-radius: 0px 5px 5px 0px;
    font-size: 12px;
    color: white
}
.color-green {
    color: #26a269;
}
.highlights-card {
    border: 1px solid rgb(2, 188, 125);
    box-shadow: 0 1px 1px 0 rgb(2, 188, 125), 0 1px 3px 1px rgb(2, 188, 125);
}
.highlights-card-n {
    border: 1px solid rgb(226, 76, 75);
    box-shadow: 0 1px 1px 0 rgb(226, 76, 75), 0 1px 3px 1px rgb(226, 76, 75);
}
.highlights-card-header {
    background-color: var(--secocolor);
    color: white
}
.progressbar-text {
    position: absolute;
    left: 50%;
    top: 50%;
    padding: 0px;
    margin: 0px;
    transform: translate(-50%, -50%);
    color: white;
    font-family:Cera Pro Black;
    font-size: 1rem;
}
.providers-title {
    color: white;
    margin-top: auto;
    margin-bottom: auto;
    padding-left: 15px
}
.payment-option-box {
    border-radius: 10px;
    overflow: hidden;
    padding: 10px 10px;
    position: relative;
    text-align: center;
}
.payment-box-info {
    position: absolute;
    top: 2px;
    right: 3px
}
.faq-item {
    background: linear-gradient(0deg, rgba(215,68,1,1) 0%, rgba(254,80,1,1) 100%);
    color: white;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
    transform: rotate(-180deg);
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        visibility: visible;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        visibility: visible;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.popular-bonus-code-span {
    background-color: #f2efe8;
    padding: 5px;
    border-radius: 10px 0px 0px 10px;
    font-size: 12px
}
.popular-bonus-code-name {
    padding: 5px;
    border-radius: 0px 10px 10px 0px;
    font-size: 10px
}
.popular-bonus-code-wrapper {
    border-radius: 10px;
    width: fit-content;
    border: 1px dashed gray;
}
.MoreInfo:hover{
    cursor: pointer;
}
.close-more-circle:hover {
    cursor: pointer;
}
.popular-bonus-more-info-wrapper {
    max-height: 250px;
    overflow-x: hidden;
    overflow-y: scroll;
}
.bonus-card-min-height{
    min-height: 560px !important;
}
.more-info-wrapper {
    max-height: 300px;
    overflow:auto;

}
.scrollmenu {
    overflow: auto;
    white-space: nowrap;
    padding-bottom: 12px;
}
.scrollmenu-casino {
    overflow: auto;
    white-space: nowrap;
    padding-bottom: 12px;
}
.scrollmenu-casino div{
    display: inline-block;
    width: 245px !important;
    margin: auto;
    margin: 0px 4px 0px 4px;
}
.scrollmenu div {
    display: inline-block;
    width: 200px !important;
    margin: auto;
    margin: 0px 4px 0px 4px;
}
.p-show-more-btn{
    padding: 10px 35px 10px 35px;
}
.bonus-img-border-radius {
    border-top-left-radius: 15px !important;
    border-top-right-radius: 15px !important
}
.bonus-code-wrapper {
    border-radius: 10px;
    width: fit-content;
    border: 1px dashed gray
}
.bonus-code-span {
    background-color: #f2efe8;
    padding: 10px;
    border-radius: 10px 0px 0px 10px;
}
.bonus-code-span-name {
    padding: 10px;
    border-radius: 0px 10px 10px 0px;
}
.footer-links-line-height{
    line-height: 2rem;
}
.m-external-link{
    margin-bottom: 3px;
    margin-left: 3px;
}
.mr-3px{
    margin-right: 3px;
}
.footer-item:hover > a{
    color: #2b2b2b !important;
    transition: 0.3s;
    cursor: pointer;
}
.font-size-25{
    font-size: 25px !important;
}
.mb-10{
    margin-bottom: 10px;
}
.mr-8{
    margin-right: 8px;
}
.bonus-title-font-size{
    font-size: 1.25rem;
}
.content-end-bonus-card {
    height: 100%;
    justify-content: end;
    display: flex;
    flex-direction: column;
}
.font-size-9{
    font-size: 9px !important;
}
.article-casino-list-providers{
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}
.article-casino-row {
    border-bottom: 1px solid #e8e8e8;
    padding-top: 10px;
    padding-bottom: 10px
}
.plr-15 {
    padding-left: 15px !important;
    padding-right: 15px !important
}
.modal-popup-header {
    background-color: #281e32;
    color: white;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important
}
.modal-popul-body {
    height: 500px;
    overflow-y: scroll;
}
.modal-textarea-h200 {
    min-height: 200px !important;
}
@media (min-width: 10px) and (max-width: 333px) {
    .play-here-font-size-12{
        font-size: 12px !important;
    }
}

/* Pulse Animation */
@keyframes pulse {
    0%

{
    transform: scale(1);
    opacity: 1;
}

50% {
    transform: scale(1.1);
    opacity: 0.9;
}

100% {
    transform: scale(1);
    opacity: 1;
}

}

/* Apply animation to the button */
.btn-pulse {
    animation: pulse 1.5s infinite;
}
/* Wrapper for the anchor and image */
.hover-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

    /* Image styling */
    .hover-container img {
        display: block;
        width: 100%;
        height: auto;
        transition: opacity 0.3s ease-in-out;
    }

/* Overlay text container */
.hover-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.6); /* Dark semi-transparent background */
    color: white;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Show the text on hover */
.hover-container:hover .hover-text {
    opacity: 1;
}

/* Optional: Slight fade effect for the image */
.hover-container:hover img {
    opacity: 0.7;
}