/*FONTS CSS*/
@import url('font-icons.css');

@font-face {
    font-family: 'TCCC-UnityText';
    src: url('../fonts/TCCC-UnityText-Regular.eot');
    src: url('../fonts/TCCC-UnityText-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TCCC-UnityText-Regular.woff2') format('woff2'),
        url('../fonts/TCCC-UnityText-Regular.woff') format('woff'),
        url('../fonts/TCCC-UnityText-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TCCC Unity';
    src: url('../fonts/TCCCUnity-Bold.eot');
    src: url('../fonts/TCCCUnity-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TCCCUnity-Bold.woff2') format('woff2'),
        url('../fonts/TCCCUnity-Bold.woff') format('woff'),
        url('../fonts/TCCCUnity-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
  font-family: 'icons';
  src: url('../fonts/icons.eot?id4w01');
  src: url('../fonts/icons.eot?id4w01#iefix') format('embedded-opentype'),
  url('../fonts/icons.ttf?id4w01') format('truetype'),
  url('../fonts/icons.woff?id4w01') format('woff'),
  url('../fonts/icons.svg?id4w01#icons') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

:root {
  --bg-black:#000000;
  --bg-base:#ffffff;
  --clr-theme:#e61d2b;
  --clr-red:#df1a23;

  --clr-base:#000000;
  --clr-white:#ffffff;
  --clr-primary:rgba(255,255,255,0.52);

  --brdr-primary:rgba(0,0,0,0.2);
  --brdr-secondary:rgba(0,0,0,1);
  
  /*Fonts*/
  --font-base:"TCCC-UnityText";
  --font-head:"TCCC Unity";

  /*Loader Color*/
  --bg-loader: rgba(0, 0, 0, 0.8);
  --clr-loader: var(--clr-theme);

  /* Background Image */
  --splash-bg:url("../images/splash-bg.jpg");
  --leaderboard-bg:url("../images/leaderboard-bg.jpg");
  --nickname-bg:url("../images/nickname-bg.jpg");
  --gift-vouchers-bg:url("../images/gift-vouchers-bg.jpg");
  --faq-bg:url("../images/faq-bg.jpg");
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-touch-callout: none;
  line-height: 1.3em;
}

:focus {
  outline: none;
}

html {
  height: 100%;
  -webkit-text-size-adjust: none;
}

body {
  height: 100%;
  font-size: 3.4vmin;
  overflow: hidden;
  font-family: var(--font-base);
  color: var(--clr-base);
  background: var(--bg-base);
  line-height: 1.3em;
  font-weight: normal;
  letter-spacing: normal;
}

a {
  text-decoration: none;
  outline: none;
  color: var(--clr-base);
  outline: none;
  cursor: pointer;
}

a:hover,
a:focus {
  text-decoration: none;
  outline: none;
}

img {
  padding: 0;
  margin: 0;
  max-width: 100%;
  border: none;
  height: auto;
}

p {
  line-height: 1.3em;
  margin: 0;
  padding: 0;
  font-size: 1.4vmin;
  color: var(--clr-base);
  font-weight: normal;
}

/*HEADING CSS*/
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
  margin: 0;
  padding: 0;
  color: var(--clr-base);
  font-family: var(--font-head);
}

/*LIST CSS*/
ul,
ul li,
ol,
ol li {
  padding: 0;
  margin: 0;
  list-style: none;
}

/*INPUT CSS*/
.form-group {
  float: left;
  width: 100%;
  margin-bottom: 1.6vmin;
  position: relative;
}

.input-group {
  float: left;
  width: 100%;
  position: relative;
}

select,
select option {
  width: 100%;
  box-sizing: border-box;
  -moz-appearance: none;
  -webkit-appearance: none;
  border-radius: 0;
}

.form-control {
  float: left;
  width: 100%;
  font-size: 4vmin;
  outline: medium none;
  height: 8vmin;
  color: var(--clr-base);
  border: 0;
  background: var(--bg-base);
  line-height: 1.3em;
  padding: 0;
  font-family: var(--font-base);
  font-weight: normal;
  border-radius: 0.5vmin;
  padding: 0 2vmin;
}

.form-control:focus {
  outline: none;
  transition: all 0.3s ease 0s;
}

.form-control:disabled {
  background: #f2f2f2;
  color: #C7C6C6;
}

input[type="submit"],
input[type="text"],
input[type="password"],
textarea {
  -webkit-appearance: none;
}

input[type="submit"],
button {
  cursor: pointer;
  border: 0;
}

textarea.form-control {
  resize: vertical;
  height: 10vmin;
}

/*NORMAL CSS*/
::selection {
  background: var(--clr-theme);
  color: #fff;
}

::-moz-selection {
  background: var(--clr-theme);
  color: #fff;
}

.containers {
  margin: 0 auto;
  width: 100%;
  max-width: 500px;
  padding: 0 10px;
}

.pull-left {
  float: left;
}

.pull-right {
  float: right;
}

.block {
  float: left;
  width: 100%;
}

.event-none {
  pointer-events: none;
}

.icon {
  display: inline-block;
  font-size: 2vmin;
  vertical-align: middle;
}

/*BUTTON CSS*/
.buttons-outer{
  float:left;
  width:100%;
}
.buttons-inner{
  float:left;
  width:100%;
}
.btn-col{
  float:left;
  width: 100%;
}
.btn{
  float:left;
  width: 100%;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  min-height:8vmin;
  border-radius:12vmin;
}

.btn-text {
  color: var(--clr-white);
  font-size: 3vmin;
  font-family: var(--font-head);
  text-transform: uppercase;
  border-radius: 0.5vmin;
  z-index:2;
  line-height:normal;
  padding-bottom:0.2vmin;
}
.btn:hover {
  transform: scale(0.96);
}

.primary-btn {
  background: #ffffff;
}

.primary-btn .btn-text {
  color: #f40009;
}

.secondary-btn {
  background: #ff0000;
}

.secondary-btn .btn-text {
  color: #ffffff;
}

.danger-btn{
  background: #000000;
}

.danger-btn .btn-text{
  color: #ffffff;
}

.reward-btn{
  background:#E98300;
}

.info-btn{
  background:#fbbd04;
}

.disabled {
  background: #bababa;
  pointer-events: none;
}

.disabled .btn-text {
  color: #555555;
}

/* Loader CSS */
.loading-wrapper {
  position: fixed;
  float: left;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  text-align: center;
}

.loader-overlay {
  background: var(--bg-loader);
}

.page-overlay {
  float: left;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.loading-wrapper.content-loader {
  position: absolute;
  height: 100%;
}

.loading-wrapper.content-relative {
  position: relative;
  height: 200px;
  background: none;
  z-index: 1;
}

.loading-wrapper.scroll-loader {
  position: relative;
  height: 80px;
}

.loader-ring {
  display: inline-block;
  position: relative;
  width: 42px;
  height: 42px;
  border: 4px solid var(--clr-loader);
  border-color: var(--clr-loader) transparent var(--clr-loader) var(--clr-loader);
  animation: lds-ring 650ms linear infinite;
  border-radius: 50%;
}

@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/*Page CSS Start*/
.main-section{float:left; width:100%; height:100dvh;}
.page-container{float:left; width:100%; height:100%;}
/*Page CSS End*/

/*Set Screens CSS Start*/
.screen-wrap{float:left; width:100%; height:100dvh; background:rgba(0, 0, 0, 0.7); position:relative; z-index:999; background-size:cover;}
.screen-wrap-inner{float:left; width:100%; height:100%; padding:2vmin 0; display:flex; align-items:center; justify-content:center; flex-direction:column; position:relative;}
.screen-widget{float:left; width:100%;}
.clear-bg{background:none!important;}
.add-overlay{background:rgba(0, 0, 0, 0.7) !important;}
.modal-item .screen-wrap-inner{animation:fadeInDown 0.3s;}
@keyframes fadeInDown{
  0% {
    opacity:0; -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0);
  }
  100%{opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  0%{
    opacity:0; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0);
  }
  100% {
    opacity:1; -webkit-transform: translateZ(0); transform:translateZ(0);
  }
}

*{
  ::-webkit-scrollbar {
    width: 0.6vmin;
    border-radius: 2vmin;
    height: 0.6vmin;
  }
  ::-webkit-scrollbar-thumb {
    background-color: var(--clr-theme);
    border-radius: 2vmin;
    width: 0.6vmin;
    height: 0.6vmin;
  }
  ::-webkit-scrollbar-track {
    background: transparent;
  }
}

.alert-info{float: left; width: 100%; padding-top: 0.4vmin; padding-left: 0.5vmin; font-size: 1.2vmin; font-family: var(--font-head); position: absolute; top: calc(100% - 0.15vmin); }
.danger-alert {color:#e61d2b;}

.hidden{display:none;}

/* Close btn CSS Start */
.back-to-bar{float:left;width:100%;text-align:center;display:flex;justify-content:center;align-items:center;margin-top:1.5vmin;}
.back-to-btn{float:left;width:100%;display:flex;justify-content:center;align-items:center;max-width:4.75vmin;gap:0.6vmin;font-size:2.2vmin;color:var(--clr-theme);text-transform:uppercase;}
.back-to-btn .icon{font-size:1.6vmin;}
.close-icon{float:left;width:100%;cursor:pointer;-webkit-transition:all 0.5s ease 0s;transition:all 0.5s ease 0s;display:flex;justify-content:center;align-items:center;}
.close-icon:hover{transform:scale(0.92);}
.close-icon img{float:left;width:100%;}
/* Close btn CSS End */

/*Set Screens CSS End*/

/* Splash Screen CSS Start */
.splash-wrap{float:left;width:100%;background:var(--splash-bg) no-repeat center; background-size:cover;}
.splash-widget{float:left;width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.splash-screen-block{float:left; width:100%; max-width:80vmin;}
.brand-logo-wrap{float:left;width:100%; display:flex; justify-content:center; align-items:center; margin-top:-4vmin;}
.brand-logo-figure{float:left;width:100%;display:flex; justify-content:center; align-items:center; max-width:24vmin;}
.brand-logo-figure img{float:left; width:100%;}
.splash-buttons-inner{float:left; width:100%; display:flex; flex-wrap:wrap; gap:2vmin; justify-content:center; align-items:center;}
.splash-buttons-inner .btn-col{max-width:38vmin;}
.splash-buttons-outer{margin-top:3vmin;}
.top-btn-outer{position:absolute; top:1vmin; right:1vmin; bottom:auto; left:auto; left:auto;}
.top-btn-inner{display:flex; justify-content:flex-end;}
.top-btn-inner .btn-col{max-width:10vmin;}
.top-btn-inner .btn{min-height:4vmin;}
.top-btn-inner .btn-text{font-size:2.4vmin;}
.coke-time-duration{float:left; width:100%;}
.coke-time-duration-remain{float:left; width:100%; padding-top:2vmin;}
.coke-time-duration-inner{float:left; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:1vmin;}
.coke-time-duration-title-head{float:left; width:100%;}
.coke-time-duration-title{float:left; width:100%; font-size:3.4vmin; font-family:var(--font-head); color:var(--clr-white); text-transform:uppercase; text-align:center;}
.coke-time-duration-title-pre{float:left; width:100%; font-size:2vmin; color:var(--clr-white); text-align:center;}
.coke-time-counter{float:left; width:100%; margin-top:2vmin;}
.coke-time-counter-inner{float:left; width:100%; display:flex; justify-content:center; align-items:center; margin-top:1vmin;}
.coke-time-row{float:left; width:100%; max-width:max-content; display:flex; justify-content:center; align-items:center; gap:0 0.6vmin;}
.coke-time-col{float:left; width:100%; border-radius:0.4vmin; overflow:hidden;}
.coke-time-col-inner{float:left; width:100%; text-align:center;}
.coke-col-top{float:left; width:100%; background:#ff0000; min-height:4vmin; min-width:4vmin; display:flex; align-items:center; justify-content:center;}
.coke-col-title{float:left; width:100%; font-size:2.4vmin; color:var(--clr-white); font-family:var(--font-head);}
.coke-col-bottom{float:left; width:100%; background:#da0000; min-height:4vmin; min-width:4vmin; display:flex; align-items:center; justify-content:center;}
.coke-col-text{float:left; width:100%; font-size:2vmin; text-transform:uppercase; color:var(--clr-white); font-family:var(--font-head);}
.coke-time-duration-easier{float:left; width:100%; padding-top:4vmin;}
.coke-time-duration-easier-inner{float:left; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.coke-time-duration-card{float:left; width:100%; max-width:60vmin; background:linear-gradient(90deg, #fdc102 0%, #ffffff 45%, #fdc102 100%); --radius:1vmin; border-radius:var(--radius); --spacing:0.14vmin; padding:var(--spacing);}
.coke-time-duration-card-inner{float:left; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; background:linear-gradient(90deg, #ffda7f -20%, #ffffff 50%, #ffda7f 120%); border-radius:calc(var(--radius) - var(--spacing));}
.coke-time-duration-card-head{float:left; width:100%; max-width:max-content; padding:0.5vmin 3vmin; filter:drop-shadow(0 0 0.6vmin rgba(0,0,0,0.4)); background:#fed067; border-radius:5vmin; text-align:center; margin-top:-2vmin;}
.coke-time-duration-card-title{float:left; width:100%; font-size:2.6vmin; color:var(--clr-base); font-family:var(--font-head); text-transform:uppercase;}
.coke-time-duration-card-content{float:left; width:100%; padding:2vmin 4vmin;}
.coke-time-duration-card-text{float:left; width:100%; font-size:3vmin; line-height:1em; color:var(--clr-base); text-align:center;}
.coke-time-duration-card-text span{color:#ff0000; font-family:var(--font-head);}
.coke-time-remaining{float:left; width:100%; margin-top:3vmin;}
.coke-time-remaining-inner{float:left; width:100%; position:relative;}
.coke-remaining-bg{float:left; width:100%;}
.coke-remaining-bg img{float:left; width:100%;}
.coke-remaining-block{float:left; width:100%; position:absolute; top:0; left:0; bottom:0; right:0; height:100%;}
.coke-remaining-block-inner{float:left; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:1vmin; padding:0 6vmin;}
.coke-remaining-head{float:left; width:100%;}
.coke-remaining-title{float:left; width:100%; font-size:3.4vmin; font-family:var(--font-head); text-transform:uppercase; text-align:center; color:var(--clr-white);}
.coke-remaining-mid{float:left; width:100%;;}
.coke-remaining-text{float:left; width:100%; font-size:2.6vmin; color:var(--clr-white); text-align:center;}
.coke-remaining-bottom{float:left; width:100%;}
.coke-remaining-target{float:left; width:100%; font-size:2.8vmin; color:var(--clr-white); text-align:center; text-transform:uppercase;}
.coke-remaining-target span{font-family:var(--font-head);}
.strike {position:relative;}
.strike::before,
.strike::after{content:""; position:absolute; width:5vmin; height:0.4vmin; background:var(--bg-base); top:50%; left:0; transform:rotate(40deg);}
.strike::after{transform:rotate(-40deg);}
.highlight{color:#ffe00d;}
/* Splash Screen CSS End */

/* Leaderboard CSS Start */
.leaderboard-wrap{float:left;width:100%;background:var(--leaderboard-bg) no-repeat center; background-size:100% 100%;}
.leaderboard-screen-block{float:left; width:100%; max-width:84vmin;}
.coke-time-logo{float:left;width:100%; display:flex; justify-content:center; align-items:center;margin-bottom:2.2vmin;}
.coke-time-logo-figure{float:left;width:100%;max-width:18vmin;}
.coke-time-logo-figure img{float:left;width:100%;}
.leaderboard-widget{float:left;width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.leaderboard-mid{float:left; width:100%;}
.leaderboard-mid-block{float:left; width:100%;position:relative; background:var(--bg-base); --radius:2vmin; border-radius:var(--radius); --spacing:2.4vmin; overflow:hidden;}
.leaderboard-head{float:left; width:100%;}
.leaderboard-title{float:left;width:100%;text-align:center;text-transform:uppercase;color:var(--clr-base);font-size:4vmin;line-height:1.2em;}
.leaderboard-mid-inner{float:left;width:100%;}
.leaderboard-data-wrap{float:left;width:100%;}
.leaderboard-head-block{float:left;width:100%;display:flex;justify-content:space-between;align-items:center; background:var(--bg-black);}
.leader-head.leader-rank, .leader-data.leader-rank{justify-content:flex-start; padding-left:var(--spacing); max-width:20vmin;}
.leader-head.leader-time, .leader-data.leader-time{justify-content:flex-start; width:15.2vmin; min-width:15.2vmin; max-width:15.2vmin;}
.leader-head.leader-nickname, .leader-data.leader-nickname{padding-right:6vmin; max-width:28vmin;}
.leader-head.leader-entries, .leader-data.leader-entries{justify-content:center; max-width:13vmin; padding-right:var(--spacing);}
.leader-head{float:left;width:100%; display:flex; align-items:center; min-height:5vmin;}
.leader-head-title{float:left;width:auto;font-size:2vmin;text-transform:uppercase;text-align:center;color:var(--clr-primary); line-height:normal; font-family:var(--font-head);}
.leaderboard-data-content{float:left;width:100%;max-height:37.4vmin;overflow:hidden;overflow-y:auto;}
.leader-data-block{float:left;width:100%;display:flex;justify-content:space-between;align-items:center;border-bottom:0.212vmin solid var(--brdr-primary);}
.leader-data-block.selected{background:var(--clr-theme); border-top:0.2vmin solid var(--clr-white); border-bottom:none;}
.leader-data-block.selected .leader-data-text{color:var(--clr-white);}
.leader-data{float:left;width:100%;display:flex;align-items:center; min-height:6vmin;}
.leader-data-text{float:left;width:auto;font-size:2vmin;color:var(--clr-base); font-family:var(--font-head); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.rank-sup{text-transform:none;}
.show-more-btn-block{float:left; width:100%; display:flex; justify-content:center; align-items:center;}
.show-more-btn, .show-less-btn{float:left; width:auto; font-size:2vmin; text-transform:uppercase; color:var(--clr-theme); padding:2vmin 0;}
.show-more, .show-less{display:flex; align-items:center; gap:0.14vmin; font-family:var(--font-head);}
.show-more-icon{font-size:2.2vmin; font-weight:700;}
.leaderboard-buttons-inner{display:flex; justify-content:center; align-items:center; margin-top:2vmin;}
.leaderboard-buttons-inner .btn-col{max-width:36vmin;}
.leaderboard-buttons-inner .btn-col .btn{min-height:7vmin;}
.no-data-block{float:left;width:100%;}
.no-data-inner{float:left;width:100%;padding:5vmin 0;}
.no-data-title-block{float:left;width:100%;}
.no-data-title{float:left;width:100%;text-align:center;font-size:2vmin; font-family:var(--font-head); text-transform:uppercase;}
.leaderboard-prizes-btn .btn-col{max-width:16vmin;}
.leaderboard-prizes-btn .btn{min-height:4vmin;}
.leaderboard-prizes-btn .btn-text{font-size:1.8vmin; padding-bottom:0;}
.top-filter{float:left;width:100%;margin-bottom:16px;}
.top-filter-inner{float:left;width:100%; display:flex; align-items:center; padding:1vmin 0; position:relative;}
.top-filter-list{float:right;width:100%; max-width:max-content;display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between;}
.filter-item{float:left;flex:1;}
.drop-item-label{float:left;width:100%;margin-bottom:4px;font-size:14px;font-weight:500;color:var(--selectLabel-clr);line-height:1.3em;}
.base-drop{float:left;width:100%;}
.select-box{float:left;position:relative;--radius:0.5vmin;cursor:pointer; min-width:13vmin;}
.select-box::after{position:absolute; content:"\ea34"; height:100%; display:inline-flex; align-items:center; top:auto; right:0.6vmin; bottom:auto; left:auto; font-size: 2.2vmin; font-weight: 700; font-family:'icons' !important;}
.select-box.active::after{content:"\ea37";}
.select-label{display:flex; justify-content:flex-start; align-items:center; float:left;width:100%; height:100%; font-size:1.8vmin; color:var(--clr-base);position:relative; text-transform:uppercase; font-family:var(--font-head); border-radius:var(--radius); background:var(--bg-base);padding:0.8vmin 3vmin 0.8vmin 1vmin;cursor:pointer;border:0.1vmin solid var(--clr-base);}
.select-label.select-drop-active .icon:before{content:"\ea37";}
.select-option{flex:1;width:100%;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:3vmin;color:var(--clr-base);}
.select-dropdown{position:absolute; z-index:2; cursor:pointer; padding:0 0.4vmin; font-size:1.6vmin; top:0; right:0; bottom:0; left:0; height:100%; border-radius:var(--radius); border:none; background: none;color: transparent;}
.select-dropdown option{float:left; width:100%; height:3.2vmin; line-height:3.2vmin; color:var(--clr-base); position:relative; font-family:var(--font-head); text-transform:uppercase;}

.info-block{float:left; width:100%; margin-right:2vmin; display:flex; justify-content:flex-end; align-items:center; --bdr-size:0.1vmin;}
.info-icon{float:left; width:100%; background:#ffffff; border:var(--bdr-size) solid var(--bg-black); border-radius:50%; max-width:4vmin; position:relative; cursor:pointer; transition:0.3s ease 0s;}
.info-icon img{float:left; width:100%; padding-left:0.2vmin;}
.info-icon::before{position:absolute; content:''; top:auto; right:auto; bottom:calc(100% + 0.68vmin); left:30%; transform:rotate(45deg); border-radius:0.15vmin; z-index:1; height:1.2vmin; width:1.2vmin; background:var(--bg-base); border-bottom:var(--bdr-size) solid var(--bg-black); border-right:var(--bdr-size) solid var(--bg-black); display:none;}
.info-block-inner{float:left; width:auto; display:flex; justify-content:center; align-items:center;}
.info-block-inner .info-hover{display:none;}
.info-content{float:left; width:fit-content; max-width:84vmin; position:absolute; top:auto; right:0; bottom:100%; left:auto; transition:0.3s ease 0s; display:none;}
.info-content-inner{float:left; width:100%; background:var(--bg-base); border:var(--bdr-size) solid var(--bg-black); border-radius:0.5vmin; padding:1.4vmin 1.4vmin;}
.info-text{float:left; width:100%; font-size:1.6vmin; font-family:var(--font-head); position:relative; padding-left:1.6vmin;}
.info-text::before{position:absolute; content:''; top:0.8vmin; right:auto; bottom:auto; left:0; height:0.6vmin; width:0.6vmin; border-radius:50%; background:var(--bg-black);}
.info-text + .info-text{margin-top:0.6vmin;}
.leaderboard-wrap-inner .top-btn-inner .btn-col{max-width:12vmin;}
.leaderboard-wrap-inner .top-btn-inner .btn-text{text-transform:none; font-size:2.2vmin;}

/* Desktop hover only */
@media (hover: hover) and (pointer: fine) {
  .info-block-inner:hover .info-icon {background:#ff0000;border-color:#ff0000;}
  .info-block-inner:hover .info-hover {display:block;}
  .info-block-inner:hover .info-nohover {display:none;}
  .info-block-inner:hover .info-content {display:block;}
  .info-block-inner:hover .info-icon::before {display:block;}
}
/* Leaderboard CSS End */

/* Enter Nickname Screen CSS Start */
.enter-nickname{float:left;width:100%;background:var(--nickname-bg) no-repeat center; background-size:100% 100%;}
.nickname-widget{display:flex; justify-content:center; align-items:center;}
.nickname-card-wrap{float:left; width:100%; background:url('../images/nickname-card-bg.webp') no-repeat center; background-size:100% 100%; max-width:84vmin; padding:4vmin 0 12vmin;}
.my-code-info{float:left;width:100%;display:flex;justify-content:center;}
.my-code-card{float:left;width:100%;}
.my-code-code-info{float:left;width:100%;text-align:center;}
.my-code-mid{float:left; width:100%; display:flex; justify-content:center; align-items:center;}
.code-title-pre{float:left; width:100%; text-align:center; font-size:2.2vmin;}
.prize-title-pre{float:left; width:100%; font-size:2.8vmin; text-align:center; background: var(--clr-theme); color:var(--clr-white); padding:1.4vmin 0; line-height:normal;}
.my-code-bottom{float:left; width:100%; max-width:64%;}
.enter-code-info{float:left; width:100%;}
.enter-code-outer{float:left; width:100%; position:relative;}
.enter-my-code{float:left; width:100%;}
.enter-my-code .form-control{border:0.22vmin solid var(--brdr-secondary); font-size:2.8vmin;}
.enter-nickname .form-control{height:6.4vmin;text-align:center;font-size:2vmin;}
.enter-nickname .form-control::placeholder{color:#6a6a6a; font-size:2vmin;}
.my-code-action{float:left; width:100%; margin-top:2.2vmin;}
.button-bar{float:left; width:100%;}
.button-bar-inner{float:left; width:100%;}
.button-col{float:left; width:100%; display:flex; align-items:center; justify-content:center;}
.button-col .btn{min-height:6.8vmin; max-width:32vmin;}
.button-col .btn-text{font-size:3vmin;}
.nickname-head{float:left; width:100%; margin-bottom:6vmin;}
.nickname-title{float:left;width:100%;text-align:center;text-transform:uppercase;color:var(--clr-base);font-size:3.4vmin; line-height:normal;}
.nickname-logo{float:left;width:100%; display:flex; justify-content:center; align-items:center;margin-bottom:4vmin;}
.nickname-logo-figure{float:left;width:100%;max-width:18vmin;}
.nickname-logo-figure img{float:left;width:100%;}
/* Nickname CSS End */

/* How to Screen Start */
.how-to-widget{display:flex; justify-content:center; align-items:center;}
.how-to-card-wrap{float:left; width:100%; background:url('../images/how-to-card-bg.webp') no-repeat center; background-size:100% 100%; max-width:75vmin; padding:4vmin 0 6vmin;}
.how-to-head{float:left; width:100%; margin-bottom:2.4vmin;}
.how-to-two-inner .how-to-head{margin-bottom:8vmin;}
.how-to-three-inner .how-to-head{margin-bottom:7.4vmin;}
.how-to-title{float:left;width:100%;text-align:center;text-transform:uppercase;color:var(--clr-base);font-size:4vmin; line-height:normal;}
.how-to-card{float:left; width:100%; padding:0 2vmin; filter:drop-shadow(0 0 0.4vmin rgba(0,0,0,0.2));}
.how-to-card-inner{float:left; width:100%; background:var(--bg-base); border-radius:0.5vmin; padding:6vmin 0 3vmin;}
.how-to-card-block{float:left; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.how-to-card-fig-block{float:left; width:100%; display:flex; justify-content:center; align-items:center;}
.how-to-card-fig{float:left; width:100%;}
.how-to-card-fig img{float:left; width:100%;}
.how-to-two-inner .how-to-card-fig-block{margin-top:-12vmin; margin-bottom:2vmin;}
.how-to-two-inner .how-to-card-fig{max-width:12vmin;}
.how-to-three-inner .how-to-card-fig-block{margin-top:-7vmin; margin-bottom:3vmin;}
.how-to-three-inner .how-to-card-fig{max-width:20vmin;}
.how-to-card-title{float:left; width:100%; font-size:2.6vmin; font-family:var(--font-head); text-align:center;}
.how-to-card-text{float:left; width:100%; font-size:2.4vmin; text-align:center;}
.how-to-buttons-outer{margin-top:5vmin;}
.how-to-three-inner .how-to-buttons-outer{margin-top:2vmin;}
.how-to-buttons-inner{display:flex; justify-content:center; align-items:center; gap:0 4vmin;}
.how-to-buttons-inner .btn-col{max-width:24vmin;}
.how-to-buttons-inner .btn{min-height:6.8vmin;}
.how-to-three-inner .how-to-card-inner{padding-top:0;}
.how-to-highlight{color:#0cad3f;}
.how-to-logo{float:left;width:100%; display:flex; justify-content:center; align-items:center;margin-bottom:4vmin;}
.how-to-logo-figure{float:left;width:100%;max-width:18vmin;}
.how-to-logo-figure img{float:left;width:100%;}
/* How to Screen End */

/* Daily Target Screen Start */
.daily-target-widget{display:flex; justify-content:center; align-items:center;}
.daily-target-block{float:left; width:100%; max-width:84vmin;}
.daily-target-block-inner{float:left; width:100%; display:flex; justify-content:center; align-items:center; position:relative;}
.target-block-bg{float:left; width:100%;}
.target-loose-fig{float:left; width:100%; position:relative;}
.target-block-bg img{float:left; width:100%;}
.target-win-fig{display:none;}
.target-over-content{float:left; width:100%; position:absolute; top:auto; right:auto; bottom:auto; left:auto;}
.target-over-content-inner{float:left; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.target-over-title{float:left; width:100%; color:#fec75b; font-size:3.6vmin; font-family:var(--font-head); text-align:center;}
.target-over-title span{display:block;}
.target-time-block{float:left; width:100%;}
.target-time-block-inner{float:left; width:100%; display:flex; justify-content:center; align-items:center; padding:1.4vmin 10vmin 0.6vmin;}
.col{float:left; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:0 1vmin; position:relative;}
.col.col-left::after{position:absolute; content:''; top:0; right:0; bottom:0; left:auto; margin:auto; width:0.1vmin; height:100%; background:rgba(255,255,255,0.4);}
.time-title{float:left; width:auto; font-size:2.3vmin; color:#fbbd04; font-family:var(--font-head);}
.time-value{float:left; width:auto; font-size:2.6vmin; color:var(--clr-white); font-family:var(--font-head);}
.time-value span{font-size:2.2vmin;}
.daily-target-outer{margin-top:4vmin;}
.daily-target-inner{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:2vmin;}
.daily-target-inner .btn-col{max-width:34vmin;}
.daily-target-inner .btn-col:last-child{max-width:70vmin;}
.daily-target-block.win .daily-target-inner .btn-col:last-child{order:1; max-width:34vmin;}
.daily-target-block.win .daily-target-inner .btn-col:first-child{order:3; display:block;}
.daily-target-block.win .daily-target-inner .btn-col:nth-child(2){display:none;}
.daily-target-block.win .daily-target-inner .btn-col:nth-child(2){order:2;}
.target-bottle-fig-block{display:none;}
.daily-target-block.win .target-loose-fig{display:none;}
.daily-target-block.win .target-win-fig{display:block;}
.daily-target-block.win .target-stars{float:left; width:100%; position:absolute; top:auto; right:auto; bottom:0; left:auto;}
.target-stars img{float:left; width:100%;}
.daily-target-block.win .target-bottle-fig-block{float:left; width:100%; display:flex; justify-content:center; align-items:center; margin-top:-8vmin;}
.target-bottle-fig{float:left; width:100%; max-width:10vmin;}
.target-bottle-fig img{float:left; width:100%;}
.daily-target-block.win .time-title{color:#00ff5a;}
.target-win-details{float:left; width:100%; font-size:1.8vmin; color:var(--clr-white); text-align:center;}
.target-win-details span{font-family:var(--font-head);}
.target-win-details br{display:none;}
.target-win-bottom,.target-loose-bottom{float:left; width:100%;}
.target-loose-details{float:left; width:100%; font-size:2.8vmin; font-family:var(--font-head); color:var(--clr-white); text-transform:uppercase; text-align:center;}
.target-win-bottom{display:none;}
.daily-target-block.win .target-win-bottom{display:block;}
.daily-target-block.win .target-loose-bottom{display:none;}
/* Daily Target Screen End */

/* Gift Vouchers CSS Start */
.gift-vouchers-logo{float:left;width:100%; display:flex; justify-content:center; align-items:center;margin-bottom:3vmin; margin-top:-6vmin;}
.gift-vouchers-logo-figure{float:left;width:100%;max-width:20vmin;}
.gift-vouchers-logo-figure img{float:left;width:100%;}
.gift-vouchers-wrap{float:left;width:100%;background:var(--gift-vouchers-bg) no-repeat center; background-size:100% 100%;}
.gift-vouchers-screen-block{float:left;width:100%;}
.gift-vouchers-head{float:left; width:100%; text-align:center; margin-bottom:4vmin;}
.gift-vouchers-title{float:left; width:100%; font-size:4vmin; font-weight:700; text-transform:uppercase;}
.gift-vouchers-mid{float:left; width:100%; display:flex; justify-content:center; align-items:center;}
.gift-vouchers-mid-inner{float:left; width:100%; max-width:120vmin; display:flex; flex-direction:column; gap:3vmin;}
.gift-vouchers-row{float:left; width:100%; display:flex; justify-content:center; align-items:flex-end; gap:3vmin;}
.gift-vouchers-col{float:left; width:100%; filter:drop-shadow(0 0 0.34vmin rgba(0,0,0,0.36));}
.gift-vouchers-col-inner{float:left; width:100%;}
.gift-vouchers-card-head{float:left; width:auto; background:var(--bg-black); border-radius:1.2vmin 1.2vmin 0 0; position:relative; min-height:4vmin; padding-bottom:1vmin; margin-bottom:-1vmin;}
.gift-vouchers-card-head::after{position:absolute; content:''; width:4vmin; height:calc(100% - 0.2vmin);  top:0.2vmin; right:-2.5vmin; bottom:auto; left:auto; background:var(--bg-black); clip-path:polygon( 0 0, calc(100% - 2.9vmin) 0, calc(100% - 2.3vmin) 1vmin, calc(100% - 1.9vmin) 2.2vmin, calc(100% - 1.6vmin) 2.8vmin, calc(100% - 1.3vmin) 3.4vmin, calc(100% - 0.95vmin) 4.2vmin, calc(100% - 0.5vmin) 4.8vmin, 100% 100%, 0 100%);}
.gift-vouchers-card-title{float:left; width:100%; font-size:2.4vmin; font-weight:700; color:var(--clr-white); text-transform:uppercase; padding:0.4vmin 2vmin 0.4vmin 1.4vmin;}
.gift-vouchers-card-title span{font-size:2vmin; font-weight:normal;}
.gift-vouchers-card{float:left; width:100%; --radius:1.2vmin; border-radius:var(--radius); overflow:hidden;}
.gift-vouchers-card-inner{float:left; width:100%; background:#f5f5f5; z-index:2; display:flex; justify-content:center; border-radius:var(--radius); align-items:center; padding:2vmin 0 2vmin 3vmin; position:relative;}
.gift-vouchers-card-inner::before{position: absolute; content: ''; z-index:-1; top: auto; right: auto; bottom: auto; left: 0; background: url(../images/gift-vouchers-card-bg.webp) no-repeat left; height: 100%; width: 100%; background-size: auto 100%;}
.card-left-bg{float:left; width:100%; min-width:36vmin; position:relative; filter:drop-shadow(0.24vmin 0.44vmin 0.24vmin rgba(0,0,0,0.36));}
.card-vouchers-fig{float:left; width:100%;}
.card-vouchers-fig img{float:left; width:100%;}
.card-right-content{float:left; width:100%;}
.content-label{float:left; width:100%; display:flex; justify-content:center; align-items:center;}
.content-label-text{float:left; width:auto; background:#a60106; color:var(--clr-white); font-size:3.2vmin; font-weight:700; padding:0 2vmin; text-transform:uppercase;}
.monthly-prizes-row .content-label-text{background:#3a9255;}
.monthly-prizes-row .content-num-col-text{color:#265638;}
.content-price{float:left; width:100%;}
.content-price-inner{float:left; width:100%; display:flex; align-items:center; justify-content:center; gap:0 0.6vmin;}
.gift-vouchers-inner .top-btn-inner .btn-col{max-width:11vmin;}
.card-left-content{float:left; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:1vmin; padding-left:11vmin; position:absolute; top:auto; right:0; bottom:auto; left:0;}
.card-left-content .content-label{flex-direction:column; gap:0.4vmin;}
.card-left-content .content-label-text{font-size:2.4vmin;}
.content-details{float:left; width:100%;}
.content-details-text{float:left; width:100%; color:var(--clr-white); font-size:1.2vmin; font-weight:700; text-transform:uppercase; line-height:1em;}
.content-num-col{background:var(--bg-base); box-shadow:0 0 1vmin rgba(0, 0, 0, 0.2), 0 0 0.6vmin rgba(0, 0, 0, 0.1); min-width:3.6vmin; min-height:4vmin; position:relative; display:flex; justify-content:center; align-items:center;}
.content-num-col::before{position:absolute; content:''; top:50%; right:auto; bottom:auto; left:0; height:0.1vmin; width:100%; background:#bcbdbf;}
.content-num-col-text{color:#d40119; font-size:3.4vmin; font-weight:700; text-transform:uppercase; position:relative;}
.content-num-col-text::before, .content-num-col-text::after{position:absolute; content:''; top:46%; right:auto; bottom:auto; left:-0.4vmin; height:0.6vmin; width:0.1vmin; background:#bcbdbf;}
.content-num-col-text::after{left:auto; right:-0.4vmin;}
.flight-centre-icon{float:left; width:100%; max-width:7.6vmin; position:absolute; top:auto; right:auto; bottom:1.2vmin; left:1.2vmin;}
.flight-centre-icon img{float:left; width:100%;}
.visa-icon{float:left; width:100%; max-width:11vmin; position:absolute; top:3vmin; right:auto; bottom:auto; left:2.4vmin;}
.visa-icon img{float:left; width:100%;}
.month-content-card{padding:5vmin 14vmin 0 3vmin;}
.month-content-card .content-price{padding-top:0.6vmin;}
.month-content-card .content-price-inner{justify-content:flex-start;}
.month-content-card .content-details-text{font-size:1.8vmin; text-align:left;}

.gift-vouchers-col{animation-name:fadeIn;animation-delay:0.6s;animation-duration:0.5s;animation-fill-mode:both;}
 @keyframes fadeIn{ 0%{opacity:0;} 100%{opacity:1;}
}
.major-prizes-row .gift-vouchers-col:nth-child(1){animation-delay:0.2s;}
.major-prizes-row .gift-vouchers-col:nth-child(2){animation-delay:0.4s;}
.monthly-prizes-row .gift-vouchers-row .gift-vouchers-col:nth-child(1){animation-delay:0.6s;}
.monthly-prizes-row .gift-vouchers-row .gift-vouchers-col:nth-child(2){animation-delay:0.8s;}
/* Gift Vouchers CSS End */

/* Faq CSS Start */
.faq-wrap{float:left;width:100%;background:var(--faq-bg) no-repeat center; background-size:100% 100%;}
.faq-widget{display:flex; justify-content:center; align-items:center;}
.faq-card-wrap{float:left; width:100%; background:url('../images/faq-card-bg.webp') no-repeat center; background-size:cover; max-width:84vmin; padding:4vmin 0 18vmin; border-radius:0.8vmin;}
.faq-info{float:left;width:100%;display:flex;justify-content:center; padding:0 2vmin;}
.faq-card{float:left;width:100%;}
.faq-code-info{float:left;width:100%;text-align:center;}
.faq-head{float:left; width:100%; margin-bottom:3vmin;}
.faq-heading-title{float:left;width:100%;text-align:center;color:var(--clr-base);font-size:4.2vmin;line-height:1.2em;}
.faq-accordin{float:left; width:100%; overflow:auto; max-height:50.2vmin;counter-reset:li;}
.faq-accordin > li{float:left; width:100%; position:relative;margin-bottom:1.6vmin;background:var(--bg-base);border-radius:0.8vmin;}
.faq-accordin > li:last-child{margin-bottom:0;}
.accordin-head{float:left; width:100%; background:var(--bg-base); cursor:pointer; display:flex;align-items:center; position:relative; padding:2vmin 2vmin; border-radius:0.8vmin;  z-index:1;overflow:hidden;}
.accordin-head::before{position:absolute; content:''; top:auto; right:auto; bottom:-0.6vmin; left:0; width:6vmin; min-height:calc(100% + 1.2vmin); background:#ff0000; border-radius:0 50% 50% 0;}
.accordin-head::after{content:counter(li);height:100%;counter-increment:li; z-index:2; position:absolute; pointer-events:none; font-size:2.6vmin; text-transform:uppercase; color:var(--clr-white); font-family:var(--font-head); top:0px; right:auto; bottom:0px; left:0; margin:0; display:inline-flex;align-items:center; justify-content:center; min-width:6vmin; border-radius:0 5vmin 5vmin 0;}
.faq-title{float:left; width:100%; padding-left:5.6vmin;}
.faq-title-text{float:left; width:100%; font-size:2vmin; font-family:var(--font-head);}
.chevron-down{width:2vmin;transition:all 0.3s ease;text-align:center;}
.chevron-down .icon{float:left; width:100%; display:inline-flex; justify-content:center; align-items:center; transition:transform 0.3s ease; font-size:2.8vmin;}
.open .chevron-down .icon{transform:rotate(180deg); color:var(--clr-theme);}
.faq-content{float:left; width:100%;position:relative;}
.faq-wcard{float:left; width:100%;}
.faq-content-text{float:left; width:100%; font-size:2vmin; color:var(--clr-base); font-family:var(--font-base); padding:2vmin 2vmin 2vmin 2.4vmin;}
.coke-r-head{font-size:2.2vmin;}
.coke-r{font-size:2.1vmin;}
/* Faq CSS End */

.desk-fig{display:block!important;}
.mob-fig{display:none!important;}

@media screen and (max-width:1281px) and (orientation:portrait){
  .gift-vouchers-mid-inner{max-width:110vmin;}
}

@media screen and (max-width:1024px){
  /* Mobile click toggle */
  .info-block-inner.show .info-icon {background:#ff0000;border-color:#ff0000;}
  .info-block-inner.show .info-hover {display:block;}
  .info-block-inner.show .info-nohover {display:none;}
  .info-block-inner.show .info-content {display:block;}
  .info-block-inner.show .info-icon::before {display:block;}
}

@media screen and (max-width:1024px) and (orientation:portrait){
  :root{
    --splash-bg:url("../images/splash-bg-tab.jpg");
    --leaderboard-bg:url("../images/leaderboard-bg-tab.jpg")
  }
  .back-to-btn {
    max-width:5.34vmin;
  }

  /* Gift Vouchers CSS Start */
  .gift-vouchers-wrap{background-size:cover;}
  .gift-vouchers-mid-inner{max-width:94vmin;}
  .gift-vouchers-card-title{font-size:1.8vmin;}
  .gift-vouchers-card-title span{font-size:1.46vmin;}
  .content-num-col-text{font-size:3vmin;}
  .content-details-text{font-size:1.6vmin;}
  .content-num-col{min-width:3.2vmin;}
  .content-label-text{font-size:2.6vmin;}
  .content-num-col-text::before, .content-num-col-text::after{top:40%;}
  .gift-vouchers-card-inner{padding:2vmin 0 2vmin 2vmin;}
  .card-left-bg{min-width:30vmin;}
  
  .card-left-content .content-label-text{font-size:2.2vmin;}
  .content-details-text{font-size:1vmin;}
  .month-content-card .content-details-text{font-size:1.6vmin;}
  .visa-icon{max-width:9vmin; top:2.6vmin; left:3.2vmin;}
  .flight-centre-icon{max-width:6.6vmin;}
  /* Gift Vouchers CSS End */
}

@media screen and (max-width:767px) and (orientation:portrait){
   .back-to-bar {
    margin-top:2vmin;
  }
  .back-to-btn {
    max-width:7.8vmin;
  }
}

@media screen and (max-width:480px) and (orientation:portrait){
  :root{
    --splash-bg:url("../images/splash-bg-mob.jpg");
    --leaderboard-bg:url("../images/leaderboard-bg-mob.jpg");
    --gift-vouchers-bg:url("../images/gift-vouchers-bg-mob.jpg");
  }

  .desk-fig{display:none!important;}
  .mob-fig{display:block!important;}

  .btn{min-height:13.6vmin; padding-bottom:0.6vmin;}

  /* Splash CSS Start */
  .splash-screen-block{max-width:100%;}
  .brand-logo-wrap{margin-top:-2vmin;}
  .brand-logo-figure{max-width:38vmin;}
  .splash-buttons-outer{margin-top:14px;}
  .splash-buttons-inner{gap:8px;}
  .splash-buttons-inner .btn-col{max-width:72vmin;}
  .splash-buttons-inner .btn-col:last-child{max-width:72vmin;}
  .splash-buttons-inner .btn-col .btn{min-height:50px;}
  .splash-buttons-inner .btn-text{font-size:18px;}
  .coke-time-duration-title{font-size:22px;}
  .coke-time-duration-title-pre{font-size:14px;}
  .coke-col-title{font-size:16px;}
  .coke-col-text{font-size:11px;}
  .coke-col-top{min-height:24px; min-width:8vmin;}
  .coke-col-bottom{min-height:20px;}
  .coke-time-col{border-radius:4px;}
  .coke-time-row{gap:0 2px;}
  .coke-remaining-title{font-size:19px;}
  .coke-remaining-text{font-size:3.2vmin;}
  .coke-remaining-target{font-size:14px;}
  .coke-time-duration-remain{margin-top:4vmin;}
  .coke-time-remaining{margin-top:2vmin;}
  .coke-time-duration-inner{gap:2vmin;}
  .top-btn-inner .btn-col{max-width:18vmin;}
  .top-btn-inner .btn{min-height:6vmin;}
  .top-btn-inner .btn-text{font-size:4.2vmin; padding-bottom:0;}
  .strike::before, .strike::after{width:6vmin;}
  .coke-time-duration-card{max-width:100%; --radius:1.2vmin;}
  .coke-time-duration-easier-inner{padding:0 4vmin;}
  .coke-time-duration-card-title{font-size:4.8vmin;}
  .coke-time-duration-card-text{font-size:4.8vmin;}
  .coke-time-duration-card-head{padding:0.8vmin 4vmin; margin-top:-4vmin; filter:drop-shadow(0 0 1vmin rgba(0,0,0,0.4))}
  .coke-time-duration-easier{padding-top:8vmin;}
  .top-btn-outer{top:2vmin; right:2vmin; z-index:4;}

  .splash-buttons-inner .btn-col:nth-child(2){order:-1;}
  /* Splash CSS End */

  /* Leaderboard CSS Start */
  .leaderboard-screen-block{max-width:88vmin;}
  .coke-time-logo-figure{max-width:28vmin;}
  .coke-time-logo{margin-bottom:2vmin; margin-top:-2vmin;}
  .leaderboard-title{font-size:6.4vmin;}
  .leaderboard-mid-block{--radius:3vmin; --spacing:10px;}
  .leader-head.leader-nickname, .leader-data.leader-nickname{padding:0; margin-left:0vmin; padding-right:6px;}
  .leader-head.leader-time, .leader-data.leader-time{min-width:88px; width:100%; max-width:100px; justify-content:normal;}
  .leader-head.leader-entries, .leader-data.leader-entries{max-width:74px; margin-left:0vmin; padding-right:var(--spacing);}
  
  .leader-head.leader-rank, .leader-data.leader-rank{min-width:60px; width:100%;}
  .leader-head.leader-nickname, .leader-data.leader-nickname{float:left;min-width:100px;}

  .leader-data{min-height:34px;}
  .leader-data-text{font-size:12px;}
  .leader-data-block{border-bottom:0.32vmin solid var(--brdr-primary);}
  .leader-head{min-height:10vmin;}
  .leader-head-title{font-size:12px;}
  .leaderboard-data-content{max-height:68vmin;}
  .leaderboard-btn-inner{padding:5.2vmin 0;}
  .show-more-btn, .show-less-btn{font-size:14px; padding:3.2vmin 0}
  .show-more-icon{font-size:22px; font-weight:normal;}
  .no-data-inner{padding:8vmin 0;}
  .no-data-title{font-size:4.2vmin;}
  .select-label{font-size:12px; padding:6px 22px 6px 6px; border-radius:5px;}
  .select-dropdown{font-size:12px;}
  .select-box::after{font-size:20px; font-weight:normal;}
  .top-filter-inner{padding:3vmin 0 2vmin;}
  .leaderboard-buttons-inner{margin-top:4vmin;}
  .leaderboard-buttons-inner .btn-col{max-width:76vmin;}
  .leaderboard-buttons-inner .btn-col .btn{min-height:12vmin;}
  .leaderboard-buttons-inner .btn-col .btn-text{font-size:6.4vmin;}
  .leaderboard-prizes-btn .btn-text{font-size:3.2vmin; padding-bottom:0.2vmin;}
  .leaderboard-prizes-btn .btn-col{max-width:28vmin;}
  .leaderboard-prizes-btn .btn{min-height:6.4vmin; padding-bottom:0;}

  .leaderboard-wrap-inner .top-btn-inner .btn-col{max-width:22vmin;}
  .leaderboard-wrap-inner .top-btn-inner .btn{min-height:28px;}
  .leaderboard-wrap-inner .top-btn-inner .btn-text{font-size:14px; padding-top:2px;}

  .info-block{margin-right:3.68vmin;}
  .info-icon{max-width:6vmin;}
  .info-text{font-size:2.8vmin; padding-left:2.4vmin; line-height:1.4em;}
  .info-content{bottom: calc(100% - 4px); max-width:88vmin;}
  .info-content-inner{padding:2.2vmin 2vmin; border-radius:0.8vmin;}
  .info-icon::before{height:2.2vmin; width:2.2vmin; bottom:calc(100% + 7px);}
  .info-text::before{height:1vmin; width:1vmin; top:1.2vmin;}
  .info-text + .info-text{margin-top:1.2vmin;}
  /* Leaderboard CSS End */

  /* Nickname CSS Start */
  .nickname-title{font-size:7.5vmin;}
  .code-title-pre{font-size:4.6vmin; padding:0 6vmin;}
  .enter-my-code .form-control{border-width:2px; border-radius:1.6vmin;}
  .enter-nickname .form-control{height:14vmin; font-size:4.2vmin;}
  .enter-nickname .form-control::placeholder{font-size:4.2vmin;}
  .nickname-logo{margin-bottom:9vmin;}
  .button-col .btn{min-height:14vmin; max-width:80vmin;}
  .button-col .btn-text{font-size:5.6vmin;}
  .my-code-bottom{padding:4vmin 4.4vmin 4.6vmin; max-width:100%;}
  .my-code-action{margin-top:8vmin;}
  .alert-info{font-size:2.8vmin; padding-left:1.5vmin; top:calc(100% - 0.1vmin);}
  .nickname-logo-figure{max-width:40vmin;}
  .nickname-widget{padding:0 4vmin;}
  .nickname-card-wrap{max-width:100%; padding:7vmin 0 20vmin; background:url('../images/nickname-card-bg-mob.webp') no-repeat center; background-size:100% 100%;}
  /* Nickname CSS End */

  /* How to Screen Start */
  .how-to-widget{padding:0 4vmin;}
  .how-to-logo-figure{max-width:40vmin;}
  .how-to-title{font-size:7vmin;} 
  .how-to-card{filter:drop-shadow(0 0 4px rgba(0,0,0,0.2));}
  .how-to-card-text{font-size:4.2vmin;}
  .how-to-buttons-inner{gap:0 6vmin;}
  .how-to-buttons-inner .btn{min-height:11vmin;}
  .how-to-buttons-inner .btn-col{max-width:35vmin;}
  .how-to-buttons-inner .btn-text{font-size:4.2vmin; padding-bottom:0; line-height:2em;}
  .how-to-card-wrap{max-width:100%; padding:6vmin 0 12vmin; background:url('../images/how-to-card-bg-mob.webp') no-repeat center; background-size:100% 100%;}
  .how-to-buttons-outer{margin-top:8vmin;}
  .how-to-card-inner{padding:10vmin 0 6vmin; border-radius:5px;}
  .how-to-head{margin-bottom:10vmin;}
  .how-to-two-inner .how-to-head{margin-bottom:14vmin;}
  .how-to-two-inner .how-to-card-fig-block{margin-top:-20vmin;}
  .how-to-two-inner .how-to-card-fig{max-width:20vmin;}
  .how-to-three-inner .how-to-buttons-outer{margin-top:4vmin;}
  .how-to-three-inner .how-to-card-fig{max-width:40vmin;}
  .how-to-three-inner .how-to-head{margin-bottom:14vmin;}
  .how-to-three-inner .how-to-card-fig-block{margin-top:-14vmin; margin-bottom:5vmin;}
  .how-to-card-title{font-size:5vmin; padding-bottom:0.6vmin;}
  /* How to Screen End */

  /* Daily Target Screen Start */
  .daily-target-block{max-width:100%;}
  .target-bottle-fig{max-width:16vmin;}
  .target-over-title{font-size:8vmin;}
  .time-title{font-size:17px;}
  .time-value{font-size:24px; line-height:1em; padding-top:4px;}
  .time-value span{font-size:18px;}
  .col{flex-direction:column;}
  .target-win-details{font-size:14px;}
  .daily-target-block.win .target-bottle-fig-block{margin-top:-13vmin; margin-bottom:0vmin; padding:0 4vmin;}
  .target-win-details br{display:block;}
  .daily-target-block.win .target-time-block-inner{padding:3vmin 6vmin 2vmin;}
  .target-time-block-inner{padding:6vmin 10vmin 2vmin;}
  .daily-target-inner .btn-col{max-width:80vmin;}
  .daily-target-block.win .daily-target-inner .btn-col:first-child{order:1;}
  .daily-target-inner .btn-col:last-child{max-width:80vmin;}
  .daily-target-block.win .daily-target-inner .btn-col:last-child{max-width:80vmin;}
  .daily-target-inner .btn-text{font-size:26px;}
  .daily-target-inner{gap:4vmin;}
  .daily-target-outer{margin-top:7.4vmin;}
  .target-loose-details{font-size:4.8vmin;}
  .target-loose-bottom{margin-top:2vmin;}
  .col.col-left::after{height:76%; width:1px;}
  /* Daily Target Screen End */

  /* Gift Vouchers CSS Start */
  .gift-vouchers-logo{margin-bottom:2vmin; margin-top:-1vmin;}
  .gift-vouchers-logo-figure{max-width:26vmin;}
  .gift-vouchers-title{font-size:6.6vmin;}
  .gift-vouchers-row{flex-direction:column; gap:2.8vmin;}
  .gift-vouchers-card-title{padding:4px 12px 4px; font-size:3.6vmin;}
  .gift-vouchers-card-title span{font-size:2.8vmin;}
  .content-label-text{font-size:5.4vmin; padding:0 3vmin;}
  .card-left-bg{min-width:50vmin; filter:drop-shadow(0.66vmin 0.99vmin 0.66vmin rgba(0,0,0,0.36));}
  .gift-vouchers-card-inner{padding:2.4vmin 0 2.4vmin 3.4vmin;}
  .gift-vouchers-card{--radius:8px;}
  .gift-vouchers-card-head{border-radius:8px 8px 0 0; margin-left:0.4vmin;}
  .gift-vouchers-card-head::after{clip-path: polygon(0 0, calc(100% - 4.8vmin) 0, calc(100% - 2.7vmin) 1vmin, calc(100% - 2vmin) 2vmin, calc(100% - 1.6vmin) 3.4vmin, calc(100% - 1.3vmin) 3.8vmin, calc(100% - 1.9vmin) 2.2vmin, calc(100% - 0.5vmin) 5.6vmin, 100% 100%, 0 100%);}
  .gift-vouchers-mid-inner{padding:0 7.6vmin; gap:3.6vmin; max-width:100%;}
  .gift-vouchers-head{margin-bottom:1vmin;}
  .gift-vouchers-col{filter:drop-shadow(0 0 1vmin rgba(0, 0, 0, 0.36));}
  .gift-vouchers-inner .top-btn-inner .btn-col{max-width:19vmin;}
  .gift-vouchers-inner .top-btn-inner .btn{min-height:7vmin; padding:0;}
  
  .card-left-content{padding-left:13vmin; gap:1.24vmin;}
  .card-left-content .content-label{gap:0.6vmin;}
  .card-left-content .content-label-text{font-size:3.8vmin;}
  .content-num-col{min-width:5.4vmin; min-height:7.6vmin;}
  .content-details-text{font-size:1.8vmin;}
  .content-num-col-text{font-size:4.8vmin;}
  .content-num-col-text::before, .content-num-col-text::after{top:48%;}
  .flight-centre-icon{max-width:11.6vmin;}
  .flight-centre-icon{bottom:2vmin; left:1.6vmin;}
  .visa-icon{max-width:15vmin; top:3.6vmin; left:4.8vmin;}
  .month-content-card{padding:6vmin 0vmin 0 5vmin;}
  .month-content-card .content-price{padding-top:1vmin;}
  .month-content-card .content-details-text{font-size:2.6vmin;}

  .gift-vouchers-screen-block{transform:scale(0.94);}
  /* Gift Vouchers CSS End */

  /* Faq CSS Start */
  .faq-card-wrap{background:url('../images/faq-card-bg-mob.webp') no-repeat center; background-size:100% 100%; padding:5vmin 0 30vmin; max-width:100%;}
  .faq-widget{padding:0 5.2vmin;}
  .faq-head{margin-bottom:5vmin;}
  .faq-heading-title{font-size:7vmin;}
  .faq-accordin > li{margin-bottom:6px;border-radius:5px;}
  .accordin-head{padding:9px 8px;border-radius:5px;}
  .accordin-head::before{width:34px;}
  .accordin-head::after{font-size:13px;min-width:30px;}
  .faq-title{padding-left:9.6vmin;}
  .faq-title-text{font-size:13px;}
  .faq-content-text{font-size:12px; padding:12px 10px 12px 16px;}
  .chevron-down{width:6vmin; margin-left:2.8vmin;}
  .chevron-down .icon{font-size:5.4vmin;}
  .faq-accordin{max-height:89vmin;}
  .coke-r-head{font-size:13px;}
  .coke-r{font-size:12px;}
  /* Faq CSS End */
}

@media screen and (max-width:375px) and (orientation:portrait){
  /* Splash CSS Start */
  .splash-buttons-outer{margin-top:4vmin;}
  .coke-time-duration-remain{margin-top:0;}
  .splash-buttons-inner{min-height:14vmin;}
  /* Splash CSS End */

  /* Leaderboard CSS Start */
  .coke-time-logo-figure{max-width:34vmin;}
  .coke-time-logo{margin-bottom:3vmin;}
  .show-more-btn, .show-less-btn{padding:2.2vmin 0;}
  .leaderboard-buttons-inner .btn-col .btn-text{font-size:22px;}
  /* Leaderboard CSS End */
  
  /* Gift Vouchers CSS Start */
  .gift-vouchers-logo{margin:0;}
  .gift-vouchers-title{font-size:6.2vmin;}
  .gift-vouchers-logo-figure{max-width:28vmin;}
  .content-num-col-text{font-size:5.2vmin;}
  .gift-vouchers-card-title{font-size:3vmin; padding:1.2vmin 3.88vmin 1.2vmin;}
  .content-label-text{font-size:4.8vmin;}
  /* Gift Vouchers CSS End */
}

@media screen and (max-width:360px) and (orientation:portrait){
  /* Gift Vouchers CSS Start */
  .gift-vouchers-logo{margin-bottom:0;}
  .gift-vouchers-logo-figure{max-width:30vmin;}
  .gift-vouchers-title{font-size:7.2vmin;}
  .card-left-bg{min-width:52vmin;}
  .gift-vouchers-card-title{font-size:3.4vmin;}
  .gift-vouchers-card-title{padding:4px 12px 4px;}

  /* Gift Vouchers CSS End */
}

@media screen and (min-width:481px){
  .game-played .splash-buttons-inner .btn-col:nth-child(1){order:2;}
  .game-played .splash-buttons-inner .btn-col:nth-child(2){order:1;}
  .game-played .splash-buttons-inner .btn-col:nth-child(3){order:3;}

  .splash-buttons-inner:has(.btn-col:first-child.hidden):not(:has(.btn-col:nth-child(2).hidden)) .btn-col:last-child {max-width: 78vmin;}
  .splash-buttons-inner:has(.btn-col:nth-child(2).hidden):not(:has(.btn-col:first-child.hidden)) .btn-col:last-child {max-width: 78vmin;}
  .splash-buttons-inner:has(.btn-col:first-child.hidden):has(.btn-col:nth-child(2).hidden) .btn-col:last-child {max-width:38vmin;}
  .splash-buttons-inner:has(.btn-col:first-child.hidden) .btn-col:nth-child(3){order:-1;}
}


/* Error CSS Start */
.error-wrap{background:url('../images/error-bg.jpg') no-repeat center; background-size:100% 100%;}
.error-wrap-inner{float:left; width:100%; height:100%; padding:2vmin 0 5vmin; display:flex; align-items:center; justify-content:center; flex-direction:column;}
.error-widget{float:left; width:100%;}
.error-logo-wrap{float:left; width:100%; display:flex; justify-content:center; align-items:center; margin-top:0;}
.error-logo-figure{float:left; width:100%; max-width:30vmin;}
.error-logo-figure img{float:left; width:100%;}
.error-action-info{float:left; width:100%; display:flex; justify-content:center; align-items:center; margin-top:12vmin;}
.error-action-inner{float:left; width:100%; display:flex; flex-wrap:wrap; gap:1vmin; max-width:110vmin;}
.error-button-bar{float:left; width:100%;}
.error-button-bar-inner{float:left; width:100%; display:flex; gap:1vmin; flex-wrap:wrap; flex-direction:column;}
.error-button-col{float:left; width:100%;}
.error-button-col span{display:flex; justify-content:center; align-items:center; text-align:center; color:#ffffff; font-family:'TCCC Unity'; text-transform:uppercase; font-size:4.75vmin; padding:1vmin 0; letter-spacing:0;}

.error-buttons-outer{float:left; width:100%; margin-top:6vmin;}
.error-buttons-inner{float:left; width:100%; display:flex; justify-content:center; align-items:center;}
.error-btn-col{float:left;width:100%;max-width: 25vmin;}
.error-btn{float:left; width:100%;}
.error-btn-text{float:left; width:100%;}
.error-btn-col .btn-text{font-size:4vmin; line-height:1.5em;}

@media (max-width: 1024px) and (orientation: portrait) {
  .error-wrap{background:url('../images/error-bg-tab.jpg') no-repeat center; background-size:100% 100%;}
  .error-logo-figure{max-width:34vmin;}
  .error-action-inner{max-width:75vmin;}
  .error-btn-col{max-width: 24vmin;}
 
}
@media (max-width: 767px) and (orientation: portrait) {
  .error-wrap{background:url('../images/error-bg-mob.jpg') no-repeat center; background-size:100% 100%;}
  .error-logo-figure{max-width:56vmin;}
  .error-action-inner{max-width:85vmin;}
  .error-button-col span{padding:2vmin 0; font-size:6vmin;}
  .error-action-info{margin-top:14vmin;}

  .error-btn-col .btn{min-height:13vmin;}
  .error-btn-col .btn-text{font-size:5.4vmin;}
  .error-btn-col{max-width:35vmin;}
  
}
/* Error CSS End */