﻿/* BetDSI */

/* ---- SHARED ---- */

@media only screen and (max-width:600px) {
  .HideWhenMobile {
    display: none;
  }
}

/* SwiperTabs */
@media only screen and (max-width:600px) {
  .swiper-tabs .swiper-slide a {
    padding: 20px 0px;
  }
}

@media only screen and (min-width:1200px) {
  /* margin-left size = calc(50% + (width of Site__Left Panel)/2 - (width of Loader)/2 */
  #GlobalLoader {
    left: 0%;
  }

    #GlobalLoader.Loader--image.Loader--small {
      margin-left: calc(50% + 125px - 20px) !important;
    }

    #GlobalLoader.Loader--image.Loader--medium {
      margin-left: calc(50% + 125px - 25px) !important;
    }

    #GlobalLoader.Loader--image.Loader--large {
      margin-left: calc(50% + 125px - 35px) !important;
    }

    #GlobalLoader.Loader--css.Loader--medium {
      margin-left: calc(50% + 125px - 35px) !important;
    }
}

/* Main Footer */
@media only screen and (max-width:1200px) {
  .MainFooter .Inner {
    padding: 0px 40px;
  }

  .MainFooterPublic .FooterTop .FooterColumn {
    width: 25%;
  }

  .MainFooterPublic .FooterTop .FooterColumn_01 {
    display: none;
  }
}

@media only screen and (max-width:768px) {
    .MainFooter .Inner {
        padding: 0px 30px;
    }

    .MainFooterPlayer .FooterTop .FooterColumn {
        width: 50%;
    }

    .MainFooterPublic .FooterTop .FooterColumn {
        width: 50%;
    }

    .Contests__Content .col03 .ImageButton {
        margin: 0 auto;
    }

    .ContestList {
        align-items: center
    }
}

  @media only screen and (max-width:480px) {
    .MainFooter .Inner {
      padding: 0px 20px;
    }

      .MainFooter .Inner .FooterTop {
        justify-content: center;
      }
  }

  /* Box Page */
  @media only screen and (max-width:600px) {
    .BoxPage {
      display: block;
      height: inherit !important;
      background-image: none;
    }

      .BoxPage .Inner {
        display: block;
      }
        .BoxPage .Inner .MiddleBox.MiddleBoxDynamicWidth {
            min-width: unset;
            width: unset;
            max-width: unset;
        }

        .BoxPage .Inner .MiddleBox {
          width: 100%;
          margin: 0px;
        }

        .BoxPage .Inner .MiddleBox.MiddleBoxDynamicWidth {
            min-width: unset;
            width: 100%;
            max-width: unset;
        }

        .BoxPage .Inner .BtnMobileBack {
          display: block;
        }

        .BoxPage .Inner .MiddleBox .MiddleBoxContent .Denotes {
          position: relative;
          bottom: inherit;
          color: #555;
          margin: 20px 0px 0px 0px;
        }

        .BoxPage .Inner .MiddleBox .MiddleBoxContent {
          margin-top: 0px;
        }

  }

  @media only screen and (max-width:400px) {
    .BoxPage .Inner .BtnMobileBack {
      width: 50px;
    }
  }

  /* Standard */
  @media only screen and (max-width:1200px) {
    .Standard .Content {
      padding: 40px;
    }

    .Standard .Top .Cell {
      padding-top: 0px;
      padding-bottom: 20px;
    }
  }

  @media only screen and (max-width:1024px) {
    .Standard .Top {
      height: 280px;
      background-position-y: center;
    }

      .Standard .Top .Cell h1.Title {
        font-size: 50px;
        line-height: 50px;
      }
  }

  @media only screen and (max-width:480px) {
    .Standard .Top {
      height: 200px;
    }

      .Standard .Top .Cell h1.Title {
        font-size: 40px !important;
        line-height: 40px !important;
      }

    .Standard .Content {
      padding: 20px;
    }
  }

  /* Faq */
  @media only screen and (max-width:1024px) {
    .ListFaq .ItemFaq {
      width: 50%;
    }
  }

  @media only screen and (max-width:600px) {
    .ListFaq .ItemFaq {
      width: 100%;
    }
  }

  /* Rules */
  @media only screen and (max-width:1024px) {
    .RulesSection .RuleItem {
      width: 50%;
    }
  }

  @media only screen and (max-width:600px) {
    .RulesSection .RuleItem {
      width: 100%;
    }
  }

  /* FlexTable */
  @media only screen and (max-width:1000px) {
    .FlexTable__MobileSort__DropDown {
      display: block;
    }

    .FlexTable__Headers {
      display: none;
    }

    .FlexTable__Row {
      flex-direction: column;
    }

    .FlexTable__Item {
      display: flex;
      flex: 1 0 auto !important;
      max-width: 100% !important;
    }

    .FlexTable__MobileLabel {
      display: block;
    }

    .FlexTable__Item {
      border: none;
    }

    .FlexTable--borderInner .FlexTable__Item {
      border-right: none;
    }

    .FlexTable--borderInner .FlexTable__Row.Highlighted .FlexTable__Item {
      border-right: none;
    }


    .Table_AvailableBonuses .FlexTable__ItemValue {
      flex: 1 0 0;
      text-align: right
    }

    .Table_AvailableBonuses .FlexTable__MobileLabel {
      font-weight: bold;
    }

    .Table_AvailableBonuses .FlexTable__ItemValue p {
      margin: 0
    }

    .Table_AvailableBonuses .FlexTable__Item {
      max-width: 600px !important;
      margin-left: auto;
      margin-right: auto;
      width: 100%;
      border-bottom: 1px solid rgba(0,0,0,0.03);
      align-items: center;
      justify-content: center;
    }

    .Table_AvailableBonuses .FlexTable__Row .FlexTable__Item:nth-last-child(2),
    .Table_AvailableBonuses .FlexTable__Row .FlexTable__Item:last-child {
      border-bottom: none;
    }

      .Table_AvailableBonuses .FlexTable__Row .FlexTable__Item:nth-last-child(2) .FlexTable__MobileLabel,
      .Table_AvailableBonuses .FlexTable__Row .FlexTable__Item:last-child .FlexTable__MobileLabel {
        flex: 0 0 0;
      }

    .Table_AvailableBonuses .FlexTable__Row .FlexTable__Item.RequiredPlaythrough p {
      text-align: left;
    }
  }

  @media(max-width: 768px) {
    .FlexTable--borderInner .FlexTable__Row .FlexTable__Item,
    .FlexTable__ExpandableRow.AlternateRowColour .FlexTable_Title .FlexTable__Item {
      border-top: 0;
    }

    .FlexTable .FlexTable_Title .FlexTable__Item {
      padding: 0
    }

      .FlexTable .FlexTable_Title .FlexTable__Item:first-child {
        border-top: 2px solid #d8d7d3;
      }

      .FlexTable .FlexTable_Title .FlexTable__Item:nth-child(2) {
        padding: 15px 5px;
      }
  }

  @media only screen and (max-width:480px) {
    .FlexTable__Dropdowns {
      flex-direction: column;
    }

      .FlexTable__Dropdowns > div {
        flex: 1 0 auto;
      }
  }

  /* Expandable */
  @media only screen and (max-width:1024px) {
    .FlexTable__ItemValue {
      padding-left: 20px;
      box-sizing: border-box;
    }
  }

  /* My Bets */
  @media only screen and (max-width:1600px) {
    #BetHistory .FlexTable {
      font-size: 12px;
    }
  }

  @media only screen and (max-width:1000px) {
    #BetHistory .FlexTable {
      font-size: 14px;
    }

    .MyBets {
      font-size: 14px;
    }

    .MyBets .FlexTable__Item {
      padding: 5px;
    }

    .MyBets .FlexTable .Description {
      position: unset;
    }
    .MyBets .Parlay__Row__Outcome .FlexTable__ItemValue .SpacerSmall {
      display: block
    }

    .TotalsAndSearchContainer {
      flex-direction: column;
    }

    .MyBetsTotals {
      flex: 1 0 auto;
    }

    .MyBetsSearchBar {
      flex: 1 0 auto;
    }

      .MyBetsSearchBar .FlexTable__Search {
        flex: 1 0 0%;
      }

        .MyBetsSearchBar .FlexTable__Search input {
          width: 100%;
        }
  }

  @media only screen and (max-width: 480px) {
    .MyBetsSearchBar .FlexTable__Search {
      flex: 1 0 0%;
    }
  }
  /* ---- SHARED END ---- */



  /* ---- PLAYER ---- */

/* Main to mobile navigation switch */
@media only screen and (max-width: 1200px) {
    .MainHeaderPlayer {
      display: none;
    }

    .MainTablePlayer .SLeft {
      display: none;
    }

    .MobileHeaderPlayer {
      display: flex;
      justify-content: space-between;
    }

    .MainContentPlayer {
        margin-top: 60px;
    }

    .BalanceSelector+.PostSelectBalanceSpacer   {
        display: none;
    }

    /* Show App-like bottom nav bar */
    .SRight {
      margin-bottom: 60px;
    }

    .BottomNav.MobileBottomNav {
      display: flex;
    }

}

/* Reduce text size for small devices */
@media only screen and (max-width: 768px) {
    .BottomNav.MobileBottomNav .BtnMobileMenu Item {
        font-size: 14px;
    }
}


@media only screen and (max-width: 568px) {
  .HighlightedLink.Large:after {
    font-size: 12px;
    right: 4px;
  }

  .NavArrow.NavArrowDynamic {
    margin: 0;
    height: 7px;
    width: 11px;
  }
}

/* Mobile Header Player */
@media only screen and (max-width: 568px) {
    .MobileHeaderPlayer {
      height: 50px;
    }

    .MainContentPlayer {
      margin-top: 50px;
    }

    .MobileHeaderPlayer .BtnMobileMenu {
      width: 50px;
    }

    .MobileHeaderPlayer .BtnMobileSetting {
      width: 50px;
    }

    .MobileHeaderPlayer .MobileHeaderCentreItem {
        gap: 5px;
        overflow: hidden;
    }
    .BalanceSelector .BSInner {
        padding: 3px 3px;
    }
    .BalanceSelector .BalanceNumber {
        padding: 5px 5px;
    }

    .MobileHeaderPlayer .BalanceSelector.NavigationContainer .ContentContainer {
        position: fixed;
        top: 42px;
        left: 5vw;
        max-width: 90vw;
        min-width: unset;
        max-height: 75vh;
        box-shadow: 0 max(100vw, 100vh) 0 max(100vw, 100vh) #000000aa;
    }

    .HighlightedLink.Large:after {
        top: 0;
    }
    .MNETDepositExitButton {
        top: 2px;
        right: 2px;
        width: 45px;
        height: 45px;
        background-size: 45px;
    }
}
@media only screen and (max-width: 468px) {
    .MobileHeaderPlayer .Logo {
        height: 22px;
    }

    .MobileHeaderPlayer .BtnMobileMenu {
        width: 40px;
        margin: auto;
    }
    .MobileHeaderPlayer .BtnMobileMenu img {
        width: 50px;
        margin-left: -5px
    }
    .MobileHeaderPlayer .BtnMobileSetting {
        width: 40px;
        margin: auto;
    }
    .MobileHeaderPlayer .BtnMobileSetting img {
        width: 50px;
        margin-left: -5px
    }
    .BalanceSelector .BSInner {
        padding: 1px 1px;
        line-height: 12px;
        font-size: 12px;
    }

    .BalanceSelector .BalanceNumber {
        padding: 3px 2px;
        overflow: hidden;
    }

    /* This is only done so that the button doesn't move after logging in */
    .MobileHeaderPublic .BtnMobileMenu img {
        margin-left: -5px;
    }
}
@media only screen and (max-width: 400px) {
    .MobileHeaderPlayer .Logo {
        height: 18px;
    }
}

  /* Main Content Player */
  @media only screen and (max-width: 1200px) {
    .MainContentPlayer .MainContentPlayerMargin {
      margin: 20px;
    }
  }

  @media only screen and (max-width:1024px) {
    .MainContentPlayer .MainContentPlayerMargin {
      margin: 10px;
    }

    .MainContentPlayer .ContentPadding {
      padding: 20px;
    }
  }

  @media only screen and (max-width:480px) {
    .MainContentPlayer .MainContentPlayerMargin {
      margin: 5px;
    }
  }

  /* Dashboard */
  @media (max-width: 1400px) {
    .referFriend .referDesktop {
      display: none;
    }

    .referFriend .referLaptopXL {
      display: block;
    }
  }

  @media (max-width: 1250px) {
    .MainHeaderPlayer .NavigationContainer .Title,
    .MobileHeaderPlayerReduced .NavigationContainer .Title {
        padding: 0 10px;
    }
  }

  @media (max-width: 1200px) {
    .referFriend .referLaptopXL {
      display: none;
    }

    .referFriend .referLaptopXS {
      display: block;
    }
  }

  @media (max-width: 991px) {
    .referFriend .referDesktop {
      display: none;
    }
    /** .referDesktop change to .referLaptopXS after uncommenting out code above **/
    .referFriend .referLaptopXL {
      display: none;
    }

    .referFriend .referLaptopXS {
      display: none;
    }

    .referFriend .referTablet,
    .howToEarnByReferring .steps {
      display: block;
    }
  }

  @media (max-width: 500px) {
    .referFriend .referTablet {
      display: none;
    }

    .referFriend .referMobile {
      display: block;
    }
  }

  @media only screen and (max-width:700px) {
    .Dashboard .Section {
      padding: 15px;
    }

    .Dashboard .Title {
      font-size: 16px;
    }

    .BonusTable .Items .Item {
      display: flex;
      flex-direction: column;
      height: auto;
      padding: 10px 0px;
    }

      .BonusTable .Items .Item > div {
        flex: 1 0 auto;
        display: block;
      }

      .BonusTable .Items .Item .Amount {
        text-align: left;
      }

      .BonusTable .Items .Item .ConvertButton {
        position: absolute;
        bottom: 0px;
        right: 0px;
      }
  }

  @media only screen and (max-width: 480px) {
    .Dashboard .Section {
      padding: 10px;
    }

    .Dashboard .Title {
      flex-direction: column;
      align-items: flex-start;
    }
  }


  /* Dashboard V2 */





  /* Personal Details */
  @media only screen and (max-width:768px) {
    .PersonalDetails .BigColumn_01 {
      float: none;
      width: 100%;
    }

    .PersonalDetails .BigColumn_02 {
      float: none;
      width: 100%;
    }

    .PersonalDetails .BigSpacer {
      display: none;
    }

    .PersonalDetails .SocialDetails .ColumnSMA {
      width: 30.66%;
    }

    .PersonalDetails .SocialDetails .ColumnSMASpacer {
      width: 4%;
    }

    .ImageEditorSection .SubColLeft {
      float: left;
      width: 43%;
    }

    .ImageEditorSection .SubColRight {
      float: right;
      width: 52%;
    }

    .PersonalDetails {
      margin-bottom: 0px;
    }

      .PersonalDetails .Column {
        width: 100%;
        float: none;
        margin-bottom: 30px;
      }
  }

  @media only screen and (max-width:600px) {
    .PersonalDetails .SocialDetails .ColumnSMA {
      float: none;
      width: 100%;
    }

    .PersonalDetails .SocialDetails .ColumnSMASpacer {
      display: none;
    }
  }

  @media only screen and (max-width:480px) {
    .PersonalDetails .FormColumn_FirstName {
      float: none;
      width: 100%;
    }

    .PersonalDetails .FormColumn_LastName {
      float: none;
      width: 100%;
    }

    .PersonalDetails .FormSpacer_01 {
      display: none;
    }

    .PersonalDetails .FormColumn_02 {
      float: none;
      width: 100%;
    }

    .PersonalDetails .FormSpacer_02 {
      display: none;
    }

    .PersonalDetails .FormColumn_03 {
      float: none;
      width: 100%;
    }

    .PersonalDetails .FormSpacer_03 {
      display: none;
    }

    .PersonalDetails .IncompleteMessage .TextIncomplete {
      padding: 20px 20px;
    }

    .ImageEditorSection .SubColLeft {
      float: none;
      width: 100%;
    }

    .ImageEditorSection .SubColRight {
      float: none;
      width: 100%;
    }
  }

  /* Cover Layer Popup */
  @media only screen and (max-width:600px) {
    /* make Play Card full screen */
    .LightBoxAddCard {
      width: 100%;
    }

      .LightBoxAddCard .HeaderBlock {
        display: block;
      }

      .LightBoxAddCard .HeaderBlockSpacer {
        display: block;
      }

      .LightBoxAddCard .AddCardForm {
        padding-top: 0px;
      }
  }

  @media only screen and (max-width:550px) {
    .CoverLayerPopup .Positioning {
      position: fixed;
      top: 0px !important;
      left: 0px;
      width: 100%;
      height: 100%;
      box-sizing: border-box;
    }

      .CoverLayerPopup .Positioning .Centering {
        width: 100%;
        height: 100%;
      }

        .CoverLayerPopup .Positioning .Centering .ActualContent {
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0px;
          left: 0px;
          overflow: auto;
          -webkit-overflow-scrolling: touch;
        }

        .CoverLayerPopup .Positioning .Centering .EmptyLine {
          display: none;
        }

    .CoverLayerPopup .CloseForm {
      display: none;
    }
  }

  /* Payment Cards */
  @media only screen and (max-width:1500px) {
    .WrapperPaymentCards .PaymentCard {
      width: 31.33%;
    }
  }

  @media only screen and (max-width:1024px) {
    .WrapperPaymentCards .PaymentCard {
      width: 48%;
    }
  }

  @media only screen and (max-width:600px) {
    .WrapperPaymentCards {
      width: 100%;
    }

      .WrapperPaymentCards .PaymentCard {
        width: 100%;
        margin-right: 0px;
      }

        .WrapperPaymentCards .PaymentCard .Link_01 {
          display: none;
        }

        .WrapperPaymentCards .PaymentCard .Link_02 {
          display: block;
        }

        .WrapperPaymentCards .PaymentCard .PaddingBorder .AddImg {
          margin: 0px;
        }

        .WrapperPaymentCards .PaymentCard.WithoutCard .PaddingBorder {
          padding-top: 30px;
          padding-bottom: 30px;
        }
  }

  @media only screen and (max-width:480px) {
    .AddCardForm {
      margin: -5px;
    }
  }

  /* Settings */
  @media only screen and (max-width:768px) {
    .Settings .ExclusionBox .ExclusionLabel {
      float: none;
    }

    .Settings .PlayLimits .TableLimits {
      display: block;
    }

      .Settings .PlayLimits .TableLimits .TopRowLimits {
        display: none !important;
      }

      .Settings .PlayLimits .TableLimits .RowLimits {
        display: block;
      }

        .Settings .PlayLimits .TableLimits .RowLimits .CellLimits {
          display: block;
          width: 100%;
        }

        .Settings .PlayLimits .TableLimits .RowLimits .CellLimits_Spacer {
          display: none !important;
        }

    .Settings .PlayLimits .FormLabel {
      display: block;
      float: left;
      width: 80px;
      line-height: 45px;
    }

    .Settings .PlayLimits .FormField {
      float: left;
      width: 190px;
    }
  }

  @media only screen and (max-width:480px) {
    .Settings .ExclusionBox {
      width: 85%;
    }

      .Settings .ExclusionBox .ExclusionField {
        float: none;
        width: 100%;
        margin-right: 0px;
      }

      .Settings .ExclusionBox .BtnExclusion {
        float: none;
        margin-top: 15px;
      }

        .Settings .ExclusionBox .BtnExclusion a {
          padding: 16px 0px;
          width: 100%;
        }
  }

  /* Table Wrapper */
  @media only screen and (max-width:768px) {
    .Wrapper {
      text-align: left;
    }

      .Wrapper .ItemTop {
        display: none;
      }

      .Wrapper .Item {
        display: block;
        border-bottom: 1px solid #d8d7d3;
        padding: 20px 20px;
        position: relative;
      }

        .Wrapper .Item.Highlighted .Block {
          border: none;
        }

        .Wrapper .Item .Block {
          display: block;
          border: none;
          padding: 0px;
        }

          .Wrapper .Item .Block .Column {
            padding: 1px;
          }
  }

  /* Cashier History */
  @media only screen and (max-width:768px) {
    .Table_CashierHistory .Item .Block_03 {
      position: absolute;
      top: 20px;
      right: 20px;
    }

    .Table_CashierHistory .Item .Block_07 {
      line-height: 0px;
      position: absolute;
      bottom: 20px;
      right: 20px;
    }

    .Table_TransactionsHistory .Item .Block_02 {
      display: block;
      position: absolute;
      top: 20px;
      right: 20px;
    }

    .Table_TransactionsHistory .Item .Block_04 {
      display: inline-block;
      margin-right: 10px;
    }

    .Table_TransactionsHistory .Item .Block_05 {
      display: inline-block;
    }

    .Table_TransactionsHistory.Wrapper .Item .Block .Column .FreeText {
      display: block;
      position: absolute;
      top: 48px;
      right: 20px;
    }

    .Table_BetDSIPointsHistory .Item .Block_02 {
      display: block;
      position: absolute;
      top: 20px;
      right: 20px;
    }
  }

  /* Withdrawable Balance */
  @media only screen and (max-width:768px) {
    .WithdrawableBalance {
      flex-direction: column;
    }
  }

  /* Deposit */
  @media only screen and (max-width:768px) {
    .Deposit .PaymentMethod .Img_Deposit {
      margin: 0px 10px 10px 0px;
    }
  }

  @media only screen and (max-width:550px) {
    .Deposit .AmountCurrency.FullWidthOnMobile .FormColumn_Amount {
      float: none;
      width: 100%;
    }

    .Deposit .AmountCurrency.FullWidthOnMobile .FormSpacer_00 {
      display: none;
    }
  }

  @media only screen and (max-width:400px) {
    .Deposit .AmountCurrency {
      float: none;
    }

      .Deposit .AmountCurrency .FormColumn_Amount {
        width: 170px;
      }

      .Deposit .AmountCurrency .FormColumn_CVC {
        width: 90px;
      }

      .Deposit .AmountCurrency .FormColumn_Currency {
        width: 120px;
      }
  }

  /* Bonus */
  @media only screen and (max-width:1024px) {
    .Bonus .PanelBlock {
      display: block;
    }

      .Bonus .PanelBlock .PanelLeft {
        display: block;
        padding: 0px 0px 30px 0px;
      }

      .Bonus .PanelBlock .PanelMiddle {
        display: block;
        width: 100%;
        height: 1px;
      }

      .Bonus .PanelBlock .PanelRight {
        display: block;
        padding: 30px 0px 0px 0px;
      }
  }

  @media only screen and (max-width:768px) {
    .Bonus .AlternateRowColour:nth-child(odd) {
      background: #f4f4f4;
    }

    .Bonus .Visible__SM {
      display: block;
      margin-left: 5px;
    }

    .Bonus .Hidden_SM {
      display: none !important;
    }

    .Bonus .MobileExpand {
      display: flex;
      flex: 1;
      flex-direction: column;
      max-height: 0px;
      overflow: hidden;
      transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
    }

      .Bonus .MobileExpand.Expanded {
        max-height: 9999px;
        transition: max-height 1s ease-in-out;
      }

    .Bonus .Expanded .FlexTable__Item {
      opacity: 0;
      transform: translateX(-30px);
      animation-name: slideIn;
      animation-duration: 0.3s;
      animation-fill-mode: forwards;
    }

    .Bonus .Highlighted .FlexTable__Item {
      background: none !important;
      border-bottom: none;
    }

    .Bonus .Highlighted {
      background: #75ccf3 !important;
      border-bottom: 4px solid #25aae1;
    }

    .Bonus .BonusCode {
      justify-content: space-between;
      width: 100%;
      align-items: center;
    }

      .Bonus .BonusCode .FlexTable__ItemValue {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-left: 5px;
      }

    .Bonus .FlexTable--borderInner .FlexTable__Row .FlexTable__Item:first-child {
      border-top: none;
    }

    @keyframes slideIn {
      from {
        opacity: 0;
        transform: translateX(-30px)
      }

      to {
        opacity: 1;
        transform: translateX(0)
      }
    }
  }

  @media only screen and (max-width:480px) {
    .Bonus .FlexTable__ItemValue {
      flex-wrap: wrap;
    }

    .Bonus.Deposit .AmountCurrency .FormColumn_Amount {
      width: 100%;
      margin-bottom: 20px;
    }

    .Bonus .BonusCode {
      align-items: flex-start
    }

      .Bonus .BonusCode .FlexTable__ItemValue {
        justify-content: flex-end;
        align-items: flex-end;
        flex-direction: column
      }

    .Bonus .FlexTable__Row {
      padding: 0;
    }
  }

  /* Message */
  @media only screen and (max-width:1024px) {
    .MContent .MLeft {
      width: 310px;
    }

    .MContent .MSpacer {
      width: 1%;
    }

    .InboxPanel .InboxSwitch .Col a span {
      display: none;
    }
  }

  @media only screen and (max-width:700px) {
    .MContent {
      display: block;
    }

      .MContent .MLeft {
        display: block;
        width: 100%;
        height: auto;
        margin-bottom: 10px;
      }

      .MContent .MMiddle {
        display: none;
      }

      .MContent .MSpacer {
        display: none;
      }

    .NoMessagesOnList {
      padding-top: 80px;
      padding-bottom: 80px
    }

      .NoMessagesOnList img {
        display: inline;
      }

    .SmallScreenIndicator {
      width: 1px;
    }

    .ReadMessage .Cross {
      display: block;
    }
  }

  @media only screen and (max-width:480px) {
    .MContent .MLeft {
      margin-bottom: 5px;
    }

    .WriteMessage .Content {
      padding: 20px;
    }

    .ReadMessage {
      padding: 20px;
    }

    .ReplyOriginalMessage {
      padding: 0px 20px 20px 20px;
    }
  }

  /* Play Mode */
  @media only screen and (max-width:1200px) {
    .PlayMode .TextMode {
      padding: 20px 20px;
    }
  }

  @media only screen and (max-width:330px) {
    .TFAPageLeft {
      width: 280px;
      margin-right: 0px;
    }

    .TFAPageRight {
      width: 280px;
    }
  }

  /* Get Verified */
  @media only screen and (max-width:768px) {
    .WrapperGV .ItemGV {
      float: none;
      width: 100%;
    }

    .WrapperGV .SpacerGV {
      display: none;
    }
  }

  /* Referrals */
  @media only screen and (max-width:1200px) {
    .Referrals .MakeReferral .Top .Inner {
      padding: 20px 20px 0px 20px;
    }

    .Referrals .MakeReferral .Content {
      padding: 20px;
    }

    .Referrals .Chart .Inner {
      padding: 20px;
    }

    .Referrals .Module {
      margin-top: 20px;
    }

      .Referrals .Module .Inner {
        padding: 20px;
      }

    .MakeReferral .swiper-slide a {
      padding: 10px 20px;
    }
  }

  @media only screen and (max-width:1024px) {
    .Referrals .DashtTable {
      display: block;
    }

      .Referrals .DashtTable .DashtCell_01 {
        display: block;
      }

      .Referrals .DashtTable .DashtCell_02 {
        display: none;
      }

      .Referrals .DashtTable .DashtCell_03 {
        display: block;
        width: 100%;
        margin-top: 10px;
      }

    .Referrals .Module {
      margin-top: 10px;
    }
  }

  @media only screen and (max-width:768px) {
    .Referrals .MakeReferral .Top .CampaignBox {
      clear: both;
      margin: 0px;
      padding-top: 20px;
      width: 100%;
    }

    .Referrals .Module .Top .CampaignBox {
      clear: both;
      margin: 0px;
      padding-top: 20px;
      width: 100%;
      text-align: left;
    }
  }

  @media only screen and (max-width:480px) {
    .Referrals .MakeReferral .Top .Title {
      float: none;
    }

    .Referrals .Module .Top .Title {
      float: none;
      text-align: left;
    }

    .Referrals .Module .Top .Switch {
      width: 100%;
      margin-top: 20px;
    }

    .Referrals .DashtTable .DashtCell_03 {
      margin-top: 5px;
    }

    .Referrals .Module {
      margin-top: 5px;
    }
  }

  /* Casino */
  @media only screen and (max-width:1500px) {
    .CasinoContainer .Game {
      width: 25%;
    }
  }

  @media only screen and (max-width:1024px) {
    .CasinoContainer {
      padding: 20px 10px 20px 20px;
    }

      .CasinoContainer .Game {
        width: 33.33%;
      }
  }

  @media only screen and (max-width:768px) {
    .CasinoContainer .Game {
      padding-right: 10px;
      padding-bottom: 10px;
      width: 50%;
    }

    .CasinoContainer .Game.MediumMobileIcon {
        padding-right: 10px;
        padding-bottom: 10px;
        width: 16.66%;
    }

    .CasinoContainer .Game.LargeMobileIcon {
        padding-right: 10px;
        padding-bottom: 10px;
        width: 25%;
    }

    .CasinoContainer .Game .visibleImage {
      position: relative;
    }

    .CasinoContainer .Game .placeholderImage {
      display: none;
    }
  }
  
  @media only screen and (max-width:480px) {
    .CasinoContainer .Game.MediumMobileIcon {
        padding-right: 10px;
        padding-bottom: 10px;
        width: 20%;
    }

    .CasinoContainer .Game.LargeMobileIcon {
        padding-right: 10px;
        padding-bottom: 10px;
        width: 33.33%;
    }
  }


  /* Security Details */
  @media only screen and (max-width:768px) {
    .SecurityDetails .Group .Column {
      width: 100%;
    }
  }

  /* WeekOverview */
  @media only screen and (max-width: 768px) {
    .WeekOverview__Days {
      flex-direction: column;
    }

    .WeekOverview__DayContainer {
      flex: 1 0 auto;
      flex-direction: row;
    }

    .WeekOverview__Item {
      border-right: 1px solid #efeeea;
    }

      .WeekOverview__Item:last-child {
        border-right: none;
      }

    .WeekOverview--noMobile {
      display: none;
    }

    .WeekOverview__TitleContainer {
      font-size: 16px;
    }

    .WeekOverview__Total {
      font-size: 10px;
    }

    .WeekOverview__DateSelection__Button {
      font-size: 10px;
    }

    .WeekOverview__Arrow {
      width: 6px;
      height: 12px;
    }
  }

  @media only screen and (min-width: 768px) {
    .WeekOverview--mobile {
      display: none;
    }
  }

  @media only screen and (min-width: 768px) {
    .Accordion--mobile {
    }

      .Accordion--mobile .Accordion__Section {
        display: none;
      }

      .Accordion--mobile .Accordion__Panel {
        max-height: none;
      }
  }

  /* MyBetsTotals */
  @media only screen and (max-width: 600px) {
    .MyBetsTotals__Progress__Item {
      flex-direction: column;
    }

    .MyBetsTotals__Progress__BarContainer {
      padding-left: 0px;
    }

    .MyBetsTotals__Progress__Item__Left {
      flex: 1 0 auto;
    }

    .MyBetsTotals__Progress__Item__Right {
      flex: 1 0 auto;
    }
  }

@media only screen and (max-width: 1200px) {
  .Contests {
    flex-direction: column;
  }

  .Contests__Panel {
    flex: 1 0 auto;
    margin-right: 0px;
    margin-bottom: 15px;
  }

  .Contests__Panel:last-child {
    margin-bottom: 0px;
  }
}
/* Contest special */
@media screen and (max-width: 768px) {
  .Contests__HowToPlay_Numbered ul {
    flex-direction: column;
    gap: 5px;
  }
  .Contests__HowToPlay_Numbered ul li {
    flex-direction: row;
    text-align: left;
  }
  .Contests__HowToPlay_Numbered ul li::before {
    margin: 0 10px 0 0;
    font-size: 40px;
  }
  .Contests__HowToPlay_Numbered ul:before {
    border-bottom: unset;
    border-right: 1px dotted black;
    content: "";
    position: absolute;
    /* half height of ::before +5px */
    top: 0;
    width: unset;
    height: 100%;
    left: 20px;
    }
}
  /* ---- PLAYER END ---- */



  /* ---- PUBLIC ---- */

  /* Mobile Header Public */
  @media only screen and (max-width: 1200px) {
    .MobileHeaderPublic {
      display: block;
    }

    .MainHeaderPublic {
      display: none;
    }

    .MainContentPublic {
      padding-top: 60px;
    }
  }

  @media only screen and (max-width: 768px) {
    .TooltipOrange {
      width: 68px;
      padding: 4px;
      font-size: 11px;
    }

    .TooltipOrange.Left {
    margin-left: 0px;
    }
  }

  @media only screen and (max-width: 568px) {
    .MobileHeaderPublic {
      height: 50px;
    }

    .MobileHeaderPublic .BtnMobileMenu {
        width: 50px;
    }

    .MobileHeaderPublic .Logo {
        margin-top: 9px;
    }

    .MobileHeaderPublic .BtnMobileMenu img {
        height: 50px;
    }

    .MainContentPublic {
        padding-top: 50px;
    }

    .TooltipOrange.HeaderBarTooltip {
        height: 15px;
        width: 15px;
        border-radius: 50%;
        overflow: hidden;
        color: transparent;
        top: 16px;
        left: calc(100% - 16px);
    }
  }

  /* Main Content Public */
  @media only screen and (max-width:1200px) {
    .MainContentPublic .ContentPadding {
      padding: 40px;
    }

    .MainContentPublic .BothStandard .TopHeight {
      height: 240px;
    }
  }

  @media only screen and (max-width:1024px) {
    .MainContentPublic .ContentPadding {
      padding: 20px;
    }

    .MainContentPublic .BothStandard .TopHeight {
      height: 200px;
    }
  }

  @media only screen and (max-width:400px) {
    .MainContentPublic {
      padding-top: 50px;
    }
  }


  /* Login Register */
  @media only screen and (max-width:768px) {
    .LoginRegisterBox {
      width: 470px;
    }

      .LoginRegisterBox .LoginRegisterContent .LoginRegisterTable {
        display: block;
      }

        .LoginRegisterBox .LoginRegisterContent .LoginRegisterTable .LoginRegisterCell_01 {
          display: block;
          width: 100%;
        }

      .LoginRegisterBox .LoginRegisterContent .CheckBoxLogin {
        float: none;
        width: 100%;
      }

      .LoginRegisterBox .LoginRegisterContent .BtnJoin {
        float: none;
        width: 100%;
        margin-top: 20px;
      }
  }

  @media only screen and (max-width:450px) {
    .LoginRegisterBox .LoginRegisterContent .CheckBoxLogin .icheckbox_square-grey {
      margin-bottom: 30px;
    }

    .LoginRegisterBox .LoginRegisterContent .CheckBoxRegister .icheckbox_square-grey {
      margin-bottom: 30px;
    }
  }

  /* HomePage */
  @media only screen and (max-width: 1200px) {
    .HomePanel01 .BlockText {
      display: block;
      padding: 120px 40px 80px 40px;
    }

    .HomePanel01 .BlockForm {
      display: block;
      padding: 60px 40px 40px 40px;
    }

    .HomePanel01 .BlockText .Title {
      font-size: 50px;
      line-height: 50px;
    }

    .HomePanel01 .BlockBanner {
      display: block;
      position: relative;
      bottom: auto;
      left: auto;
      padding: 20px 40px 20px 40px;
    }

      .HomePanel01 .BlockBanner .Container .Content .Number {
        height: 30px;
        width: 30px;
        line-height: 30px;
        font-size: 17px;
        border-radius: 19px;
      }

      .HomePanel01 .BlockBanner .Container .Content .Section .Label {
        margin-left: 10px;
        margin-right: 0px;
        font-size: 15px;
      }

      .HomePanel01 .BlockBanner .Container .Content .Icon {
        height: 50px;
        width: 50px;
      }

    .HomePanel01 .BlockSlider {
      padding: 0px 40px 0px 40px;
    }

      .HomePanel01 .BlockSlider .swiper-logos .swiper-wrapper .swiper-slide .Img {
        padding: 0px 20px;
      }

    .HomePanel02 .Inner {
      padding: 40px 50px;
    }

    .HomePanel03 .Inner {
      padding: 40px 40px 20px 40px;
    }

    .HomePanel04 .Inner {
      padding-left: 40px;
      padding-right: 40px;
    }

      .HomePanel04 .Inner .Section .Title {
        font-size: 22px;
      }

      .HomePanel04 .Inner .ColumnSpacer {
        width: 15px;
      }
  }

  @media only screen and (max-width:768px) {
    .HomePanel01 {
      text-align: center;
    }

      .HomePanel01 .BlockText {
        padding: 20px 30px 30px 30px;
      }

      .HomePanel01 .BlockForm {
        padding: 40px 30px 30px 30px;
      }

      .HomePanel01 .BlockText .Title {
        font-size: 40px;
        line-height: 40px;
        margin-top: 25px;
      }

      .HomePanel01 .BlockBanner {
        max-width: 300px;
        display: inline-block;
        border-radius: 4px;
        width: 100%;
        background-color: #0178c6;
        opacity: 0.86;
        padding: 20px 30px 20px 30px;
      }

        .HomePanel01 .BlockBanner .Container {
          height: auto;
        }

          .HomePanel01 .BlockBanner .Container .Content {
            display: block;
            width: 100%;
          }

            .HomePanel01 .BlockBanner .Container .Content .Section {
              background-image: none !important;
              width: 100% !important;
            }

              .HomePanel01 .BlockBanner .Container .Content .Section .Label {
                min-width: 100px;
                font-size: 20px;
              }

            .HomePanel01 .BlockBanner .Container .right,
            .HomePanel01 .BlockBanner .Container .left,
            .HomePanel01 .BlockBanner .Container .Content .Arrow {
              display: none;
            }

      .HomePanel01 .BlockSlider {
        padding: 0px 30px 0px 30px;
      }

    .HomePanel02 .Inner {
      display: block;
      padding: 40px 30px;
    }

      .HomePanel02 .Inner .Item {
        padding: 0px 0px;
      }

        .HomePanel02 .Inner .Item .Icon {
          width: 100px;
        }

        .HomePanel02 .Inner .Item .Title {
          height: auto;
        }

        .HomePanel02 .Inner .Item .Text {
          height: auto;
          margin-bottom: 30px;
        }

    .HomePanel03 .Inner {
      padding: 20px 30px 5px 30px;
    }

    .HomePanel04 .Inner {
      display: block;
      padding: 70px 30px 20px 30px;
    }
  }

  @media only screen and (max-width: 480px) {
    .HomePanel01 .BlockText {
      padding: 20px 20px 30px 20px;
    }

    .HomePanel01 .BlockForm {
      padding: 20px 20px 20px 20px;
    }

    .HomePanel01 .BlockText .Title {
      font-size: 35px;
      line-height: 40px;
    }

    .HomePanel01 .BlockBanner {
      padding: 20px 20px 20px 20px;
    }

    .HomePanel01 .BlockSlider {
      padding: 0px 20px 0px 20px;
    }

    .HomePanel02 .Inner {
      padding: 40px 20px;
    }

    .HomePanel03 .Inner {
      padding: 10px 20px 0px 20px;
    }

    .HomePanel04 .Inner {
      padding-left: 20px;
      padding-right: 20px;
    }
  }

  /* Site Map */
  @media only screen and (max-width:1024px) {
    .siteMapList {
      -webkit-column-gap: 50px;
      -moz-column-gap: 50px;
      column-gap: 50px;
    }
  }

  @media only screen and (max-width:1024px) {
    .siteMapList {
      -webkit-column-count: 2;
      -moz-column-count: 2;
      column-count: 2;
      -webkit-column-gap: 40px;
      -moz-column-gap: 40px;
      column-gap: 40px;
    }
  }

  @media only screen and (max-width:768px) {
    .siteMapList {
      -webkit-column-count: 1;
      -moz-column-count: 1;
      column-count: 1;
      -webkit-column-gap: 0px;
      -moz-column-gap: 0px;
      column-gap: 0px;
    }
  }

  /* Sportsbook */
  @media only screen and (max-width:1024px) {
    .SportsbookContainer .SportsbookTables {
      padding: 20px;
    }
  }

  @media only screen and (max-width:768px) {
    .SportsbookContainer .SportsbookTables {
      padding: 15px;
    }
  }

  @media only screen and (max-width:480px) {
    .SportsbookContainer .SportsbookTables {
      padding: 10px;
    }
  }
  /* ---- PUBLIC END ---- */



  /* ---- CMS ---- */
  @media only screen and (max-width:1200px) {
    .PublicPromotions .Promotion {
      padding-bottom: 40px;
      margin-bottom: 40px;
    }
  }

  @media only screen and (max-width:768px) {
    .RewardLevel .Image {
      display: none;
    }

    .Rewards .ColumnSpacer {
      display: none;
    }

    .PublicPromotions .Promotion {
      padding-bottom: 30px;
      margin-bottom: 30px;
    }

      .PublicPromotions .Promotion .Text {
        display: block;
        width: 100%;
        margin-bottom: -20px;
      }

      .PublicPromotions .Promotion .Image {
        display: none;
      }

    .PublicPromotions .ColumnSpacer {
      display: none;
    }
  }

  @media only screen and (max-width:768px) {
    .Accordian .Panel {
      padding: 1px 10px;
    }

    th, td {
      padding: 10px;
      min-width: 30px;
    }
  }

  @media only screen and (max-width:480px) {
    .Accordian .Panel {
      padding: 1px 1px;
    }

    th, td {
      padding: 5px;
      min-width: 0px;
    }

    .CahierTableImage {
      max-width: 40px;
      margin: 5px;
    }

    .CashierImageFlexContainer {
      display: block;
    }
  }
  /* ---- CMS END ---- */

  /* Live Chat */
  @media only screen and (max-width: 1200px) {
    #LiveChat {
      display: none;
    }
  }

  /* How it works */
  @media (max-width: 1024px) {
    .HowItWorks {
      flex-wrap: wrap;
    }

      .HowItWorks .Column {
        flex: 1 0 50%;
      }

    .HowItWorksTitle {
      text-align: center;
    }
  }

  @media (max-width: 500px) {
    .HowItWorks .Column {
      flex: 1 0 100%;
    }
  }

  @media screen and (max-width: 800px) {
    #GridStatisticsContainer table {
      border: 0;
      display: block;
    }

    #GridStatisticsContainer tbody {
      display: block;
    }

    #GridStatisticsContainer table caption {
      font-size: 1.3em;
    }

    #GridStatisticsContainer table thead {
      border: none;
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px;
    }

    #GridStatisticsContainer table tr {
      display: block;
    }

    #GridStatisticsContainer table td:first-child {
      border-top: 1px solid #ddd;
      border-top-width: 1px;
    }

    #GridStatisticsContainer table tr {
      margin-bottom: 30px;
    }

    #GridStatisticsContainer table td {
      border-left: 1px solid #ddd;
      border-top-width: 1px;
      border-bottom-width: 0;
      display: block;
      text-align: right;
    }

      #GridStatisticsContainer table td::before {
        font-weight: bold;
        float: left;
        content: attr(aria-label);
      }

      #GridStatisticsContainer table td:last-child {
        border-right: 1px solid #ddd;
        border-bottom-width: 1px;
      }
  }

  /* Form builder */

  @media (max-width: 768px) {
    .FormBuilder .lastName {
      width: 100%;
      float: none;
      position: static;
      right: auto;
      top: auto;
      padding-left: 0px;
    }

    .FormBuilder .firstName {
      width: 100%;
      float: none;
      padding-right: 0px;
    }
  }

  /* End Form builder*/

  @media only screen and (max-width:768px) {
    .Modal.SportstechModal .IframeContainer {
      padding-top: 35px;
      background-color: #213951;
    }

    .Modal.SportstechModal #SportstechIframe {
      border-top: none;
      background-color: #ffffff;
    }

    .Modal .Image {
      float: unset;
      margin-right: unset;
      margin-left: unset;
    }

    .Modal .NotImage {
      margin-right: unset;
      margin-left: unset;
    }
  }

  @media only screen and (max-width:768px) {
    .CoverLayerModal .Positioning {
      overflow-y: auto;
    }

    .CoverLayerModal .CloseForm {
      top: 3px;
      right: 3px;
    }
  }

  @media only screen and (max-width:500px) {
    .MessagePopUpModal .Header img.Large {
      max-width: 100%;
      height: auto;
      display: none;
    }

    .MessagePopUpModal .Header img.Small {
      max-width: 100%;
      height: auto;
      display: inline-block;
    }

    .PlayerFailedDepositOver300Modal .Header {
      display: flex;
      align-items: center;
      justify-items: center;
      flex-direction: column;
    }

    .PlayerFailedDeposit300OrLessModal .Header {
      display: flex;
      align-items: center;
      justify-items: center;
      flex-direction: column;
    }
  }


@media screen and (max-width: 568px) {
    .NewCashierOption {
        height: 3.5rem;
        padding: 0rem 0.25rem;
    }

    .NewCashierIcon {
        font-size: 1rem;
    }

    .NewCashierIcon img {
        max-width: 80px;
    }

    .NewCashierMinMax {
        display: flex;
        flex-direction: column;
        font-size: 0.85rem;
        flex: 1 1;
        text-align: end;
    }

    .MinMaxSpacer {
        display: none;
    }
}


/* WelcomePopup */
@media screen and (max-width: 768px) {
  .WelcomePopup               {border-radius: 10px; max-width: 95%; margin-left: 2.5%; margin-right: 2.5%; padding: 20px;}
}
@media screen and (max-width: 425px) {
  .WelcomePopup .Header img   {margin: auto; width: 175px;}
}