@font-face {
    font-family: 'CrystalNU4-Regular';
    src: url('../Fonts/CrystalNU4-Regular.otf');
  }

  @font-face {
    font-family: 'Intro-Black-Regular';
    src: url('../Fonts/Intro-Black-Regular.otf');
  }

.help-slider {
    background-color: rgba(0, 0, 0, 0);

}

.help-slider {
    transform-style: preserve-3d;
}

.slick-dots{
    /* top: 772px !important; */
    position: absolute; 
    bottom: 30px;
}

.section-1,
.section-2,
.section-3,
.section-4,
.section-5,
.section-6,
.section-7{
    width: 1180px;
    overflow-y: scroll;
    height: 521px !important;
    scrollbar-width: none;
    margin-top: 80px;
    padding: 0 20px !important;
}
::-webkit-scrollbar {
    display: none;
}


li.slick-active{
    background-color: rgb(168, 173, 177);   
}


.slick-prev, .slick-next {
    z-index: 5;
}

.draggable{
    height: auto !important;
}

.slick-list {
    width: 100%;
    margin: 0 auto;
    
}

.slick-initialized .slick-slide:focus {
    outline: none;
}

.slick-slide {
    height: auto;
}

.help-slider {
    height: 655px;
    width: 1220px;
}
.slick-dots li button {
    border: 1px solid rgb(112, 113, 124);; 
}

/* border help */

.help-border {
    background-image: url('../Images/RollX/help-desktop.png');
    background-size: 100% 100%;
    padding: 0 4px !important;
}

.help-border::-webkit-scrollbar {
    display: none;
}

/* prev background */

.slick-prev {
    background-image: url(../Images/RollX/left.png);
    height: 33px;
    width: 24px;
    margin-left: 75px;
    bottom: 10px;
}
.slick-prev:hover{
    background-image: url(../Images/RollX/leftHover.png);
    height: 33px;
    width: 24px;
    margin-left: 75px;
    bottom: 10px;
}

/* prev arrow */

.slick-prev:before {
    content: '';
}


/* next background */

.slick-next {
    background-image: url(../Images/RollX/right.png);
    height: 33px;
    width: 24px;
    margin-right: 75px;
    bottom: 10px;
}
.slick-next:hover {
    background-image: url(../Images/RollX/rightHover.png);
    height: 33px;
    width: 24px;
    margin-right: 75px;
    bottom: 10px;
}

/* next arrow */

.slick-next:before {
    content: '';
}


.close-help {
    background-image: url(../Images/RollX/X.png);
    top: 3px !important;
    right: -17px !important;
    height: 28px !important;
    width: 31px !important;
}


.close-help:hover::after {
    content: url(../Images/RollX/hover.png);
    background-repeat: no-repeat;
    position: relative;
    width: 48px;
    height: 48px;
    z-index: 10;
    left: -90px;
    top: -96px;
    display: block;
}


.headerRectangle{
    /* background-color: rgba(35, 111, 255, 0.149); */
    width: 1212px;
    height: 42px;
    top: 40px;
    position: fixed;
    z-index: 9;
}
.pageTitle{
    font-size: 24px;
    font-family: "Intro-Black-Regular";
    color: rgb(255, 255, 255) !important;
    text-transform: uppercase;
    line-height: 1.3;
    text-align: left;
    margin-top: 3px;
}

.headerNum{
    font-size: 30px;
    font-family: "Intro-Black-Regular";
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 1.2;
    text-align: right;
    margin-top: -37px;
    width: 33px;
    margin-left: 1127px;
    letter-spacing: 2px;
}

.pageText{
    font-size: 20px;
    font-family: "Intro-Book";
    color: #dcdcff !important;
    line-height: 1.7;
    width: auto;
    height: auto;
    text-align: left;
    word-break: break-word;
    padding-top: 20px;
    letter-spacing: 1.5px;
}
.pageText1 {
    font-size: 20px;
    font-family: "Intro-Book";
    color: rgb(255, 255, 255);
    line-height: 1.7;
    width: auto;
    height: auto;
    text-align: left;
    word-break: break-word;
    letter-spacing: 1.5px;

}
.section-1 {
    position: relative !important;
}
.section-1 .pageText1 {
    margin-top: 275px;
}
.section-1 p {
    font-family: "Intro-Black-Regular";
    font-size: 24px;
    color: #dcdcff !important;
    text-align: left;
    text-transform: uppercase;
    margin-top: 15px;
}
.firstPage-item1 {
    position: absolute;
    background-image: url(../Images/RollX/wheel.png);
    background-repeat: no-repeat;
    width: 675px;
    height: 695px;
    top: 84%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}
.win-lose-container-help {
    align-items: center;
    position: absolute;
    z-index: 1;
    top: 44%;
    left: 3%;
    color: #e8e7e9;
    display: flex;
    flex-flow: column;
    font-size: 29.2px;
    height: 116px;
    font-family: 'Montserrat-ExtraBold';
    width: 100%;
}
.section-2 {
    position: relative !important;
}
.pageText2{
    font-size: 20px;
    font-family: "Intro-Book";
    color: #dcdcff !important;
    margin-top: 30px;
    letter-spacing: 1px;
    text-align: left;
}
.secondPage-item-1 {
    position: absolute;
    background-image: url(../Images/RollX/second-pg-item1.png);
    background-repeat: no-repeat;
    width: 531px;
    height: 197px;
    top: 36%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}
.pageText2 div {
    font-size: 20px;
    font-family: "Intro-Book";
    color: #dcdcff !important;
    margin-top: 230px;
    letter-spacing: 1px;
    text-align: left;
}
.secondPage-item-2 {
    position: absolute;
    background-image: url(../Images/RollX/wheel.png);
    background-repeat: no-repeat;
    width: 675px;
    height: 695px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 6%);
    -webkit-transform: translate(-50%, 6%);
    -moz-transform: translate(-50%, 6%);
    -ms-transform: translate(-50%, 6%);
    -o-transform: translate(-50%, 6%);
}
.help-coefficients-div {
    margin-top: -12px;
    background-image: linear-gradient(to bottom, #43ab78, #45b070, #4bb565, #54ba59, #5fbe4b);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    font-size: 19.66px;
    font-family: 'Montserrat-ExtraBold';
}
.help-coefficients-text {
    margin-top: 60px;
    font-family: "Montserrat";
    font-size: 14px;
    color: #53545c !important;
}
.secondPage-item-1 .help-currency {
    margin-top: 11px;
    background-image: linear-gradient(to bottom, #43ab78, #45b070, #4bb565, #54ba59, #5fbe4b);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    font-size: 19.66px;
    font-family: 'Montserrat-ExtraBold';
}
.help-bet-text {
    margin-top: 45px;
    font-family: "Montserrat";
    font-size: 14px;
    color: #53545c !important;
}

.section-3 {
    position: relative !important;
}
.pageText3{
    font-size: 20px;
    font-family: "Intro-Book";
    color: #dcdcff !important;
    margin-top: 30px;
    letter-spacing: 1px;
    text-align: left;
    line-height: 2;
}
.pageText4 {
    font-size: 20px;
    font-family: "Intro";
    color: rgb(255, 255, 255);
    line-height: 1.7;
    width: auto;
    height: auto;
    text-align: left;
    word-break: break-word;
    padding-top: 20px; 
}
.section-4 {
    position: relative !important;
    /* overflow: unset !important; */
}
.pageText4{
    font-size: 20px;
    font-family: "Intro";
    color: rgb(255, 255, 255);
    line-height: 1.7;
    width: auto;
    height: auto;
    text-align: left;
    word-break: break-word;
    padding-top: 20px;
}

.fourthPage-item {
    position: relative;
    background-image: url(../Images/SmashX/help-fourthPage-item.png);
    background-repeat: no-repeat;
    width: 360px;
    height: 409px;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}

.section-5 {
    position: relative !important;
}
.fifthPg-items {
   width: 100%;
   display: flex; 
}
.pageImage{
    background-image: url('../Images/FootballX/Help/BetChanger.png');
    background-repeat: no-repeat;
    width: 291px;
    height: 87px;
    margin: auto;
    margin-top: 15px;
}

/* 5th pg  */
.game-features {
    display: flex;
    /* margin-top: 40px; */
}

.image {
    width: 400px;
    display: flex;
    justify-content: left;
    margin-left: -30px;
}

.fourthPg-item1{
    background-image: url('../Images/RollX/help-fourthpg-item1.png');
    background-repeat: no-repeat;
    width: 245px;
    height: 125px;
    background-position: center;
}

.right-text {
    font-size: 20px;
    font-family: "Intro-Book" !important;
    color: rgb(255, 255, 255);
    display: flex;
    align-items: center;
    margin-left: 20px;
}
.section-4 .item-1,
.section-4 .item-2{
    margin-left: -157px;
}
.section-4 .item-3 {
    margin-left: -50px;
}
.section-4 .item-4 {
    margin-top: -5px;
}
.section-4 .item-5 {
    margin-top: -5px;
}
.section-4 .item-6{
    margin-left: -37px;
    margin-top: -27px;
}
.section-4 .item-8 {
    margin-left: -209px;
    margin-top: 284px; 
} 
.section-4 .item-7 {
    margin-top: -77px;
}
.section-4 .item-7 span{
    margin-left: 20px;
}
.section-4 .item-9 {
    margin-left: -121px;
    margin-top: -8px;
}
.section-4 .item-7::before {
    content: '';
    position: relative;
    background-color: #ffffff;
    width: 50px;
    height: 1px;
    margin-left: 3px;
}
.fourthPg-item6 span {
    font-size: 42.52px;
    font-family: 'Montserrat-Medium';
    text-align: center;
    text-transform: uppercase;
    top: 70px;
    left: 10px;
    position: relative;
}
.help-current-balance {
    font-family: 'Montserrat-Medium';
    font-size: 17.58px;
    text-transform: uppercase;
    color: #7a7c88 !important;
    font-weight: bold;
    margin-left: 45px;
    margin-bottom: 56px;
    margin-top: -20px;
}

.fourthPg-item2 {
    background-image: url('../Images/RollX/help-fourthpg-item2.png');
    background-repeat: no-repeat;
    width: 317px;
    height: 125px;
    background-position: center;
    margin-left: -40px;
}
.fourthPg-item3 {
    background-image: url('../Images/RollX/help-fourthpg-item3.png');
    background-repeat: no-repeat;
    width: 317px;
    height: 125px;
    background-position: center;
    margin-left: 14px;
}
.fourthPg-item4 {
    background-image: url('../Images/RollX/help-fourthpg-item4.png');
    background-repeat: no-repeat;
    width: 417px;
    height: 74px;
    background-size: contain;
    background-position: center;
    margin-left: 9px;
}
.fourthPg-item4 .help-coefficients-div {
    margin-left: -162px;
}
.fourthPg-item4 .help-coefficients-text {
    margin-top: 37px;
    font-size: 12px;
    font-family: 'Montserrat-Medium';
}
.fourthPg-item5 {
    background-image: url('../Images/RollX/help-fourthpg-item5.png');
    background-repeat: no-repeat;
    width: 417px;
    height: 74px;
    background-size: contain;
    background-position: center;
    margin-left: 9px;
}
.fourthPg-item5 .help-currency {
    margin-left: -116px;
    margin-top: -4px;
    background-image: linear-gradient(to bottom, #43ab78, #45b070, #4bb565, #54ba59, #5fbe4b);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    font-size: 19.66px;
    font-family: 'Montserrat-ExtraBold';
}
.fourthPg-item5 .help-bet-text {
    margin-top: 28px;
}
.fourthPg-item6 {
    background-image: url('../Images/RollX/help-fourthpg-item6.png');
    background-repeat: no-repeat;
    width: 509px;
    height: 216px;
    background-position: center;
    margin-left: -116px;
}
.fourthPg-item8 {
    background-image: url('../Images/RollX/help-fourthpg-item8.png');
    background-repeat: no-repeat;
    width: 113px;
    height: 336px;
    margin-left: 47px;
}
.fourthPg-item9 {
    background-image: url('../Images/RollX/help-fourthpg-item10.png');
    background-repeat: no-repeat;
    width: 245px;
    height: 147px;
    margin-left: -10px;
}


/* .fourthPg-item6 {
    display: flex;
    background-image: url('../Images/SmashX/help-fifthPage-item6.png');
    background-repeat: no-repeat;
    width: 317px;
    height: 52px;
}
.fourthPg-item7 {
    background-image: url('../Images/SmashX/help-fifthPage-item7.png');
    background-repeat: no-repeat;
    width: 195px;
    height: 35px;
}
.fourthPg-item8 {
    background-image: url('../Images/SmashX/help-fifthPage-item8.png');
    background-repeat: no-repeat;
    width: 195px;
    height: 35px;
} */

/* #help p::after {
    content: attr(data-currency);
    font-size: 20px;
} */

.section-5 p{
    font-size: 20px;
    font-family: "Intro-Book";
    color: #dcdcff !important;
    margin-top: 30px;
    text-align: left;
}
.pageText5 {
    font-size: 20px;
    font-family: "Intro-Book";
    color: #dcdcff !important;
    margin-top: 30px;
    letter-spacing: 1px;
    text-align: left;
}

.fifthPg-item6-span2 {
   color: #bbacb1 !important;
}
.fifthPg-collect-amount {
    width: 227px;
    height: 20px;
    text-align: center;
    text-transform: uppercase;
    font-family: "Intro-Bold";
    position: absolute;
    bottom: 98px;
    left: 108px;
}
/* end 5th pg */

.pageText6{
    font-size: 20px;
    font-family: "Intro";
    color: rgb(255, 255, 255);
    line-height: 1.7;
    width: auto;
    height: auto;
    text-align: left;
    word-break: break-word;
    padding-top: 20px;
}
.betTableHelp{
    background-image: url(../Images/FootballX/Help/choosebet.png);
    width: 176px;
    height: 180px;
    background-repeat: no-repeat;
    margin: auto;
    margin-top: 50px;
}

.pageText6,
.pageText7,
.pageText8{
    font-size: 20px;
    font-family: "Intro-Book";
    color: #dcdcff !important;
    margin-top: 30px;
    letter-spacing: 1px;
    text-align: left;
}




@media screen and (max-width: 780px) and (orientation: portrait) {
    .close-help {
        top: 3px !important;
        right: -17px !important;
        height: 37px !important;
        width: 36px !important;
    }
    .pageText, .pageText2, .pageText3, .pageText4, .pageText5, .pageText6, .pageText7{
        margin-top: 20px;
        word-break: break-word;
        padding-top: unset !important;
    }
    .pageTitle{
        margin-left: 15px;
    }
    .slick-next{
        display: none !important;
        /* bottom: 30px; */
    }
    .slick-prev{
        display: none !important;
        /* bottom: 30px; */
    }
    .slick-next:hover {
        /* bottom: 30px; */
    }
    .slick-prev:hover {
        /* bottom: 30px; */
    }
    .slick-dots  {
        bottom: 50px;
    }
    .headerRectangle{
        width: 682px;
        margin-left: -17px;
        top: 30px;
    }
    .help-slider {
        overflow-x: hidden !important;
    }
    .section-1, .section-2, .section-3, .section-4, .section-5, .section-6, .section-7{
        height: 1125px !important;
        width: 100%;
        overflow-y: scroll;
    }
    .help-outer {
        position: relative;
        top: 50px;
        height: 100%;
        width: 100%;
        background-image: url('../Images/RollX/help-mob.png');
        background-size: 100% 100% !important;
    }
    .container {
        width: 697px;
        height: 1233px;
        margin: 0 auto;
    }
    .help-border {
        width: 695px;
        height: 1247px;
        background-image: none;
        margin-top: 38px;
        margin-left: 1px;
    }

    .firstPage-item1 {
        top: 55% !important;
    }
    .secondPage-item-1 {
        top: 19% !important;
    }
    .secondPage-item-2 {
        top: 34%;
    }
    .fourthPg-item1 {
        height: 122px !important;
    }
    .fourthPg-item2{
        height: 116px;
    }
    .fourthPg-item6 {
        height: 181px; 
    }
    .fourthPg-item6 span {
        top: 53px; 
    }
    .section-3 {
        overflow-y: unset !important;
    }
    .close-help {
        top: 33px !important;
        right: -13px !important;
        z-index: 10;
    }
    .close-help:hover {
        /* background-image: url(../Images/SmashX/XHover.png);
        top: 12px !important;
        right: -33px !important;
        height: 82px !important;
        width: 82px !important; */
    }
    .headerNum{
        text-align: right;
        margin-top: -37px;
        width: 30px;
        margin-left: 615px;
    }
    .sectionOne-pageText  {
        width: 95%;
    }

    .betika .help-outer {
        background-image: url('../Images/RollX/Reskin/Betika/help-mob.png');
    }
   
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) { 
    .game-features {
        width: 100% !important;
        padding-left: 50px;
    }
    .image {
        width: unset !important;
    }
    .fifthPg-collect-amount { 
        left: 83px !important;
    }
    .fifthPg-collectCurrency { 
        left: 88px !important;
    }
  
}
@supports (-webkit-touch-callout: none) {
    /* CSS specific to iOS devices */
   /* #help .betTable p:nth-child(1){
        margin-top: 28px;
    }
        #help .betTable p:nth-child(2){
            margin-top: 41px;
    }
        #help .betTable p:nth-child(3){
            margin-top: 37px;
    }
    #help .betTable p:nth-child(4){
        margin-top: 34px;
    }
    #help .betTable p:nth-child(5){
        margin-top: 36px;
} */
}

body.el .fourthPg-item6 span {
    font-size: 33px !important;
}
body.ru .fourthPg-item6 span,
body.fr .fourthPg-item6 span {
    font-size: 38px !important;
}


/* here start Reskin for Betika */
.betika li.slick-active {
    background-color: #2a3482;
}
.betika .slick-dots li button {
    background: transparent !important;  
} 
.betika .close-help:hover::after {
    content: url('../Images/RollX/Reskin/Betika/hover.png');
    left: -68px;
    top: -69px;
}
.betika .help-coefficients-div,
.betika .secondPage-item-1 .help-currency {
    background-image: linear-gradient(to top, #2a3482, #343f94, #3f49a6, #4955b8, #5460cb);
}
.betika .help-border {
    background-image: url('../Images/RollX/Reskin/Betika/help-desktop.png');
}
.betika div.close-help {
    background-image: url('../Images/RollX/Reskin/Betika/X.png');
}
.betika .firstPage-item1,
.betika .secondPage-item-2 {
    background-image: url('../Images/RollX/Reskin/Betika/wheel.png');
}
.betika .pageTitle,
.betika .headerNum,
.betika .pageText,
.betika .pageText1,
.betika .pageText2,
.betika .pageText3,
.betika .section-1 p,
.betika .help-slider div,
.betika .section-5 p {
    color: #2a3482 !important;
    font-weight: bold;
}
.betika .fourthPg-item6 span {
    color: #fff;
}
.betika .secondPage-item-1 {
    background-image: url('../Images/RollX/Reskin/Betika/second-pg-item1.png');
}
.betika .win-lose-container-help{
    top: 40%;
}
.betika .win-lose-container-help span:nth-child(1),
.betika .win-lose-container-help span:nth-child(3) {
    color: #7cbb35;
}
.betika .win-lose-container-help span:nth-child(2) {
    color: #ffd800;
    text-shadow: 0px 8px 0px #002682;
}
.betika .fourthPg-item1 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item1.png');
}
.betika .fourthPg-item2 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item2.png');
}
.betika .fourthPg-item3 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item3.png');
}
.betika .fourthPg-item9 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item10.png');
}
.betika .fourthPg-item4 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item4.png');
}
.betika .fourthPg-item5 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item5.png');
}
.betika .fourthPg-item6 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item6.png');
}
.betika .fourthPg-item8 {
    background-image: url('../Images/RollX/Reskin/Betika/help-fourthpg-item8.png');
}
.betika .section-4 .item-8 {
    margin-top: 242px;
}
.betika .section-4 .item-7::before {
    content: '';
    position: relative;
    background-color: #2a3482;
    width: 50px;
    height: 1px;
    margin-left: 3px;
}