@font-face {
    font-family: 'Frutiger';
    src: url('../font/FrutigerLT-LightCn.woff2') format('woff2'),
        url('../font/FrutigerLT-LightCn.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cocon Pro';
    src: url('../font/CoconPro-Regular.woff2') format('woff2'),
        url('../font/CoconPro-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cocon Pro';
    src: url('../font/CoconPro-Bold.woff2') format('woff2'),
        url('../font/CoconPro-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'The Future';
    src: url('../font/TheFuture-Medium.woff2') format('woff2'),
        url('../font/TheFuture-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'The Future';
    src: url('../font/TheFuture-Bold.woff2') format('woff2'),
        url('../font/TheFuture-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'The Future';
    src: url('../font/TheFuture-Regular.woff2') format('woff2'),
        url('../font/TheFuture-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
html,
body,
h1,
h2,
h3,
h4,
h5,
p,
ul,
li,
p {
    margin: 0;
    padding: 0;
}
img {
    max-width: 100%;
    width: auto;
}
a,
a:hover {
    text-decoration: none;
}
body {
    font-family: 'The Future';
}
.inner_body {
    font-size: 14px;
    min-height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    position: relative;
    overflow: hidden;
    max-width: 640px;
    margin: 0 auto;
    background-color: #000;
}
.game_head h2 {
    font-size: 55px;
    color: #fff;
    font-weight: 500;
}
.game_head p {
    font-size: 29px;
    color: #231f20;
    margin: 25px 0;
    font-family: "FrutigerLT-Cn"
}
.game_head h3 {
    font-size: 40px;
    color: #231f20;
    /*font-family: "FrutigerLT-Cn";*/
}
.play_btn {
    display: inline-block;
    background: #70a84f;
    padding: 12px 30px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 40px;
    line-height: normal;
    color: #fff;
    font-family: 'Cocon Pro';
    font-weight: bold;
}
.play_btn:hover, .play_btn:focus {
    text-decoration: none;
    color: #ffffff;
    border-color: #231f20;
}
p.Terms_Conditions {
    position: static;
    width: 100%;
    text-align: center;
    bottom: 20px;
    left: 0;
    right: 0;
    font-family: "FrutigerLT-Cn"
}
.Terms_Conditions a {
    font-size: 16px;
    color: #fff !important;
    border-bottom: 1px solid #fff;
    font-family: 'The Future';
    outline: none;
    text-decoration: none;
}
.game_head,
.play_panal {
    position: relative;
    /*z-index: 1;*/
}
.play_panal {
    margin: 60px 0 0;
}
.footer_img_left {
    position: absolute;
    left: 0;
    bottom: 0;
}
.footer_img_right {
    position: absolute;
    right: 0;
    bottom: 0;
}
.game_head {
    margin-top: 80px;
}
figcaption.ball-5 {
    position: absolute;
    left: -15px;
    top: -114px;
    z-index: 1;
}
figcaption.flower-left {
    position: absolute;
    left: 0px;
    top: 55px;
    z-index: 1;
}
figcaption.flower-right {
    position: absolute;
    right: 0px;
    top: 30px;
    z-index: 1;
}
.leaf-right {
    position: absolute;
    right: 0px;
    bottom: 40px;
    z-index: 1;
}
figcaption.ball-1 {
    position: absolute;
    right: -10px;
    top: -140px;
}
figcaption.ball-4 {
    position: absolute;
    left: 10px;
    bottom: -80px;
    z-index: 1;
}
figcaption.ball-2 {
    position: absolute;
    right: 60px;
    top: -30px;
}
figcaption.ball-3 img {
    margin-left: -100px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.game_head figcaption.flower img {
    max-width: 90px;
}
figcaption.flower.flower-left img {
    max-width: 65px;
}
.game_head figcaption.ball img,
.play_panal figcaption img,
.cont-panal figcaption img {
    max-width: 100px;
}
.game_head figcaption.leaf-right img {
    max-width: 60px;
}
.footer_img img {
    max-width: 160px;
}
/***==================== POP UP ====================***/
#instructionModal .modal-content,
.game-modal .modal-content {
    border-radius: 17px;
    background-color: #e30000;
    text-align: center;
    padding: 40px 0 20px 0;
}
#instructionModal .modal-content button.close,
.game-modal .modal-content button.close {
    text-shadow: 0 0 0;
    color: #fff;
    background: rgba(255, 255, 255, .5);
    opacity: 1;
    border-radius: 50px;
    position: absolute;
    right: 20px;
    top: -20px;
    width: 35px;
    height: 35px;
    padding: 00;
}
#instructionModal .modal-content button.close span,
.game-modal .modal-content button.close span {
    position: relative;
    color: #fff;
    top: -2px;
}
#instructionModal .modal-content h4,
.game-modal .modal-content h4 {
    color: #fff;
    font-size: 42px;
    margin-bottom: 20px;
}
#instructionModal .modal-content p,
.game-modal .modal-content p {
    color: #fff;
    font-size: 28px;
    font-family: "FrutigerLT-Cn";
    line-height: normal;
}
#instructionModal .modal-content a,
.game-modal .modal-content a {
    margin-top: 20px;
}
/***==================== Screen-2 ====================***/


.play_screen_page .game_head {
    margin: 0;
}
.grab {
    position: relative;
    z-index: 1;
}
.grab p {
    font-size: 20px;
    color: #231f20;
    margin: 0;
    font-family: "FrutigerLT-Cn";
}
.game-pro ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    max-width: 420px;
    margin: 20px auto 0;
    border-radius: 15px;
    position: relative;
    z-index: 1;
}
.game-pro ul li {
    background-color: transparent;
    width: 110px;
    list-style: none;
    margin: 12px 12px;
    border-radius: 14px;
    height: 110px;
    line-height: 110px;
    overflow:hidden;
    padding:0 10px;
}
.game-pro ul li img {
    max-width: 100%;
    display: inline-block;
    margin: 0 auto;
    border: none;
    background-color: transparent;
}
.cont-panal, .cont-time {
    position: relative;
    background: #a7be39;
    max-width: max-content;
    margin: 0 auto;
    padding: 10px 26px;
    font-size: 30px;
    border-radius: 10px;
    font-family: 'The Future';
    font-weight: bold;
    color: #fff;
}
.cont-panal {
    margin-bottom: 20px;
}
.cont-panal .cta-cont.score {
    margin-left: 8px;
}
.cont-time .cont_footer.timer{
        margin-left: 8px;
}
.cont-time {
    background: #016d3c;
    display: flex;
}
.cont_footer .timer-text {
    font-size: 30px;
    border-radius: 10px;
    font-family: 'The Future';
    font-weight: bold;
    color: #fff;
    display: inline-block;
    margin: 0;
}
svg.entry-ct {
    width: 159px;
    height: 170px;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -30px;
    transform: rotate(14deg);
}
svg.entry-ct path {
    display: none;
}
svg.entry-ct text {
    font-size: 75px;
}

.cont-panal figcaption.ball-3 {
    position: absolute;
    bottom: -45px;
    left: -92px;
    right: 0;
}
.play_screen_page .footer_img {
    position: absolute;
    width: 100%;
    bottom: 0;
}
#Folder_tab {
    display: block;
}
#Folder_mobile {
    display: none;
}
/***==================== Screen-3 ====================***/
.play_panal form {
    z-index: 1;
    position: relative;
    max-width: 400px;
    margin: 0 auto;
}
form input::placeholder {
    font-size: 30px;
    font-family: 'The Future';
    color: #000;
}
form input {
    width: 100%;
    height: 60px;
    border-radius: 12px;
    border: 0px;
    margin-top: 10px;
    font-size: 18px;
    text-align: center;
    font-family: 'The Future';
    font-weight: bold;
    color: #000;
    padding: 0;
}

/**********/
tspan {
    white-space: pre
}
.entry_ct_btm_text {
    font-size: 35px;
    fill: #231f20;
    font-family: "FrutigerLT-BlackCn";
    font-weight: 800
}
svg.entry-ct-btm {
    position: absolute;
    left: 60px;
    margin: 0 auto;
    right: 0;
    z-index: 1;
    bottom: -39px;
}
.container {
    position: relative;
}
div#instructionModal.play_get {
    display: block;
}
/***==================== 4-12-2019====================***/
.Game_form_page .game_head { 
    margin-top: 25px;
}
div#myModal{
    font-family: "FrutigerLT-Cn";	
}
div#myModal button.close {
    position: absolute;
    right: 20px;
    top: 17px;
}
.game-pro ul li a, .game-pro ul li {
    cursor:pointer;
    display:block;
}

/* ============= Hide image css ============= */
.inner_body figcaption {
    display: none;
}
.footer_img img {
    display: none;
}
.inner_body{
    position: relative;
    z-index: 1;
}

p.Terms_Conditions {
    position: absolute;
    z-index: 2;
} 
.game_head {
    position: relative;
    z-index: 1;
}
div#some_div {
    z-index: 2;
}
/* ============= Hide image css ============= */
.cont-panal img {
    position: absolute;
    top: -22px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
}
.inner_body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}
.inner_body .game_logo {
    position: absolute;
    top:40px;
    right: 0;
    left: 0;
}
.inner_body .game_head {
    max-width: 100%;
    flex: 0 0 100%;
}
.inner_body .play_panal {
    max-width: 100%;
    flex: 0 0 100%;
}
.game_logo img {
    max-width: 300px;
}
.game_head {
    margin-top: 20px !important;
}
.game_head h2 {
    font-size: 34px;
    line-height: normal;
}
.game_head p {
    font-size: 18px;
    margin: 15px 0;
}
.game_head h3 {
    font-size: 24px;
}

.inner_body.play_screen_page .game_logo {
    position: relative;
}
.inner_body.play_screen_page .grab p {
    font-weight: 700;
}
.inner_body.Game_form_page .game_head h2 span {
    display: block;
    font-size: 28px;
    margin: 15px 0 0;
}
form input {
	text-align: center;
}
 ::selection {
  color: inherit;
  background: transparent;
}
.game_logo-middle img {
    width:380px;
}
.inner_body.Game_form_page, .inner_body.Game_thanks_page {
    background-color: #76a84a;
    display: block;
    align-content: unset;
}
.inner_body.Game_form_page .game_logo, .inner_body.Game_thanks_page .game_logo {
    top: 0;
    background: #000;
    padding: 30px 0;
    position: static;
}
.inner_body.Game_form_page .game_head h2, .inner_body.Game_thanks_page .game_head h2 {
    font-size: 65px;
    padding: 0 !important;
    margin: 0;
    font-family: 'The Future';
    font-weight: bold;
    color: #000;
    margin-bottom: 20px;
}
.inner_body.Game_form_page .game_head h3, .inner_body.Game_thanks_page .game_head h3 {
    font-size: 24px;
    color: #000;
    font-family: 'The Future';
    font-weight: 500;
    margin-bottom: 15px;
    line-height: normal;
}
 .inner_body.Game_thanks_page .game_head h3{
     font-size: 30px;
 }
  .inner_body.Game_thanks_page .game_head h3 span {
    font-family: 'The Future';
    font-weight: bold;
    display: block;
}
.inner_body.Game_form_page .play_panal {
    margin: 20px 0 0;
}
.inner_body.Game_form_page .play_btn,  .inner_body.Game_thanks_page .play_btn {
    background: #231f20;
    text-transform: capitalize;
    border: 0;
    margin-top: 30px;
}
.instructions.inner_body .game_head h1 {
    padding: 40px 10px 20px;
    font-size: 60px;
    color: #fff;
    font-family: 'Cocon Pro';
    margin: 6px 0;
    line-height: 60px;
}
.instructions.inner_body .game_head h1 span.play {
    font-weight: 500;
    line-height: normal;
    color: #fff;
    font-size: 30px;
    font-family: 'The Future';
    display: block;
}
.instructions.inner_body .game_head p {
    font-size: 35px;
    color: #fff;
    font-family: 'The Future';
    font-weight: 500;
    line-height: normal;
    padding: 0;
}
.instructions.inner_body .play_btn {
    margin-top: 20px;
}
.game-pro {
    padding: 40px 0;
}
.ready-icon {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left:50%;
    z-index:5;
}
.ready-icon .overlay-img {
    width: 180px;
}
.ready-icon .overlay-img-go{
      width: 100px;
}
.instructions .game_head h2 {
    margin: 0 0 30px;
        font-size: 26px;
}
.instructions .game_head img {
    width: 38px;
    vertical-align: middle;
}
.modal-body {
    padding: 0;
}
.modal-content {
     padding: 15px;
}
.modal-content.inner-model-content p {
    font-family: 'The Future';
}

.modal-content {
    font-family: 'The Future';
    font-size: 16px;
    line-height: 26px;
}