/* ==========================================
   HEADER
========================================== */

.casino-slots-header{
    position:relative;
    margin:60px 0 80px;
    min-height:80px;
}

.casino-slots-header h1{
    margin:0;
    text-align:center;
    font-size:52px;
    line-height:60px;
    color:#021A80;
    font-family:'Neutraface-Text-Greek-Bold',sans-serif;
}

.casino-slots-filter-wrap{
  
   

    margin:0;
}

/* ==========================================
   FILTER
========================================== */

.casino-slots-filter{
    width:350px;
    padding:25px 35px;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#021A80;
    cursor:pointer;
    position:relative;
}

.casino-slots-filter-text{
    color:#fff;
    font-size:20px;
    line-height:26px;
    font-family:'Neutraface-Text-Greek-Bold',sans-serif;
}

.casino-slots-filter-dropdown{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:#fff;
    overflow:hidden;
    max-height:0;
    z-index:999;
    transition:max-height .3s ease;
}

.casino-slots-filter:hover .casino-slots-filter-dropdown{
    max-height:250px;
}

.casino-slots-filter-dropdown-inner{
    border:1px solid #000;
    padding:10px 20px;
}

.casino-slots-filter-item{
    display:flex;
    justify-content:space-between;
    text-decoration:none;
    color:#000;
    font-size:25px;
    line-height:45px;
    letter-spacing:1.25px;
    font-family:'Neutraface-Text-Greek-Book',sans-serif;
}

/* ==========================================
   GRID
========================================== */

.casino-slots-grid-wrapper{
    max-width:1200px;
    margin:0 auto;
    padding-bottom:60px;
}

.casino-slots-grid{
    display:grid !important;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
    margin-top:50px;
}

/* ==========================================
   CARD
========================================== */

.casino-slots-card{
    width:100%;
}

.casino-slots-card-image{
    height:180px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.casino-slots-card-image img{
    max-width:100%;
    max-height:160px;
    object-fit:contain;
}

.casino-slots-card-info{
    display:flex;
    flex-direction:column;
    align-items:center;
}

.casino-slots-card-title{
    display:inline-block;
    padding:0 30px;
    background:#000;
    color:#fff;
    font-size:17px;
    line-height:35px;
    letter-spacing:.17px;
    font-family:'Neutraface-Text-Greek-Bold',sans-serif;
    text-align:center;
}

.casino-slots-card-amount{
    display:inline-block;
    margin-top:5px;
    background:#fff;
    color:#9A9A9A;
    border:1px solid #6A6A6A;
    font-size:30px;
    line-height:35px;
    padding:3px 20px;
    font-family:'Neutraface-Text-Greek-Bold',sans-serif;
}

/* ==========================================
   RESPONSIVE
========================================== */
/* ==========================================
   RESPONSIVE
========================================== */

@media screen and (max-width:1120px){

    .casino-slots-grid{
        grid-template-columns:repeat(3,1fr);
        gap:1.96vw;
    }
}

@media screen and (max-width:1060px){

    .casino-slots-grid-wrapper{
        width:100%;
        max-width:100%;
    }
}

@media screen and (max-width:920px){

    .casino-slots-card-amount{
        font-size:25px;
        line-height:30px;
        padding:3px 13px;
    }

    .casino-slots-card-title{
        padding:0 25px;
        font-size:15px;
        line-height:30px;
    }
}

@media screen and (max-width:660px){

    .casino-slots-grid{
        grid-template-columns:repeat(2,1fr);
        gap:14px;
    }
}

@media screen and (max-width:520px){

    .casino-slots-grid{
        grid-template-columns:1fr;
        gap:0;
    }

    .casino-slots-card-title{
        padding:5px 35px;
        font-size:25px;
        line-height:35px;
    }

    .casino-slots-card-amount{
        font-size:30px;
        line-height:35px;
        padding:5px 15px;
    }

    .casino-slots-filter{
        width:65%;
    }
}
.casino-slots-grid-wrapper{
    max-width:1200px;
    margin:0 auto;
    padding-bottom:60px;
    position:relative;
    overflow:visible;
}

.casino-slots-filter{
    z-index:9999;
}

.casino-slots-filter-dropdown{
    z-index:99999;
}

@media screen and (max-width:490px){

    .casino-slots-card-title{
        padding:0 30px;
        font-size:20px;
        line-height:30px;
    }

    .casino-slots-card-amount{
        font-size:25px;
        line-height:30px;
        padding:0 10px;
    }
}
.casino-slots-filter{
    z-index:100;
}

.casino-slots-grid-wrapper{
    position:relative;
}

.chevron-wrapper{
    display:flex;
    align-items:center;
    justify-content:center;
    margin-left:15px;
    flex-shrink:0;
}

.casino-slots-filter:hover .chevron{
    transform:rotate(180deg);
}
@media screen and (max-width: 460px) {
    .chevron.up.lg::after { left: 1.75vw; }
    .chevron.up.lg::before { right: 1.75vw; }
    }


.chevron-wrapper.disabled {
    opacity: 0;
}

.chevron::after, .chevron::before {
    content: "";
    bottom: 0;
    width: 50%;
    height: 2px;
    position: absolute;
    top: 50%;
}

.chevron.black::after, .chevron.black::before {
    background-color: #000;
}

.chevron.white::after, .chevron.white::before {
    background-color: #fff;
}

.chevron {
    position: relative;
    opacity: 1;
    transition: all .7s ease-in-out;
}

.chevron.sm {
    width: 18px;
    height: 18px;
}

.chevron .line {
    position: absolute;
    top: 50%;
    left: 0;
    transform: rotate(90deg) translateX(-50%);
    width: 100%;
    height: 2px;
}

.chevron.icon-line.up::after,
.chevron.icon-line.up::before {
    top: calc(-50% + 2px);
}

.chevron.black .line {
    background-color: #000;
}

.chevron.md {
    width: 22px;
    height: 22px;
}

.chevron.disabled {
    opacity: 0;
}

.chevron::before {
    right: 2px;
    -webkit-transform: translate(0, -50%) rotate(-45deg);
    -ms-transform: translate(0, -50%) rotate(-45deg);
    transform: translate(0, -50%) rotate(-45deg);
    transition: all 0.4s  ease-in-out;
}

.chevron::after {
    left: 2px;
    -webkit-transform: translate(0, -50%) rotate(45deg);
    -ms-transform: translate(0, -50%) rotate(45deg);
    transform: translate(0, -50%) rotate(45deg);
    transition: all 0.4s ease-in-out;
}

.chevron:not(.up):not(.right):not(.left)::after { left: 2px; }
.chevron:not(.up):not(.right):not(.left)::before { right: 2px; }

.chevron.up:not(.sm):not(.md):not(.lg)::after { left: 12px; }
.chevron.up:not(.sm):not(.md):not(.lg)::before { right: 12px; }

.chevron.up.md::after { left: 9.2px; }
.chevron.up.md::before { right: 9.2px; }
.chevron.up.sm::after { left: 7.5px; }
.chevron.up.sm::before { right: 7.5px; }
.chevron.up.lg::after { left: 9px; }
.chevron.up.lg::before { right: 9px; }

.chevron.right { transform: scale(1) rotate(-90deg); }
.chevron.left { transform: scale(1) rotate(90deg); }

.chevron.right.disabled { transform: scale(0) rotate(-90deg); }
.chevron.left.disabled { transform: scale(0) rotate(90deg); }

/**
 ** Chervon Css
 */