/** Load Mixin **/ /*========== Mobile First Method ==========*/ /* Custom, iPhone Retina */ /* Extra Small Devices, Phones */ /* Small Devices, Tablets */ /* Medium Devices, Desktops */ /* Large Devices, Wide Screens */ /*========== Non-Mobile First Method ==========*/ /* Large Devices, Wide Screens */ /* Medium Devices, Desktops */ /* Small Devices, Tablets */ /* Extra Small Devices, Phones */ /* Custom, iPhone Retina */ #flip-card-game-modal .modal-dialog .modal-content { background-image: url("/images/click_n_claim/games/lenormand_day/game_box_bg.jpg"); background-repeat: no-repeat; float: left; background-color: #fff; border-radius: 0; border: 2px solid #fff; background-size: 100% 100%; } #flip-card-game-modal .modal-dialog .modal-content .modal-body { border: none; } #flip-card-game-game.game-wrapper { position: relative; padding: 15px 10px; /** Game Won **/ } #flip-card-game-game.game-wrapper #gameOn { position: relative; width: 100%; display: inline-block; } #flip-card-game-game.game-wrapper #gameOn .game-wrapper-left { display: inline-block; } #flip-card-game-game.game-wrapper #gameOn .game-wrapper-right { display: inline-block; margin-left: 15px; width: 90%; vertical-align: top; margin-top: 0; } #flip-card-game-game.game-wrapper #gameOn h3 { font-family: game-font-pacifico; } #flip-card-game-game.game-wrapper #gameOn h3.game-wrapper-title { font-size: 25px; line-height: 25px; text-transform: none; text-align: left; margin: 2px 0 5px 0; padding: 0 0 20px 0; width: 100%; color: #0b4873; border-bottom: 1px solid #90a2af; } #flip-card-game-game.game-wrapper #gameOn p { font-family: game-font-varela; margin-top: 10px; } #flip-card-game-game.game-wrapper #gameOn p.game-wrapper-description { font-size: 16px; text-transform: none; text-align: left; margin: 2px 0 0 0; padding: 0 0 10px 0; color: #414141; width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container { position: relative; float: left; width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game { width: 100%; padding: 0 15px; display: inline-block; margin: 10px 0; text-align: center; background-color: transparent; position: relative; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items { width: 100%; position: relative; margin: 12px auto 5px auto; display: inline-block; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container { -webkit-perspective: 1000; -moz-perspective: 1000; perspective: 1000; float: left; cursor: pointer; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container.right-margin-zero { margin-right: 0 !important; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container.flip .flipper { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -ms-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .front, #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .back { width: 23%; float: left; border-radius: 4px; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container.right-margin-zero .flipper { /*margin-right: 0;*/ } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper { -webkit-transition: 0.6s; -moz-transition: 0.6s; transition: 0.6s; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -o-transform-style: preserve-3d; transform-style: preserve-3d; height: 100%; position: relative; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper .front, #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper .back { -webkit-backface-visibility: hidden; backface-visibility: hidden; -ms-backface-visibility: visible; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper .front { -webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); -ms-transform: rotateY(0deg); -o-transform: rotateY(0deg); transform: rotateY(0deg); background-image: url("/images/click_n_claim/games/lenormand_day/card_bg.jpg"); background-size: 100% 100%; background-repeat: no-repeat; border: 5px solid #fff; box-shadow: 2px 2px 9px #989898; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper .back { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -ms-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); background-size: 100% 100%; background-repeat: no-repeat; border: 5px solid #fff; box-shadow: 2px 2px 9px #989898; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs { top: 0; left: 0; z-index: 99; height: 100%; position: absolute; width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .cover { position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: 0.8; z-index: 800; background: #212121; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message .msg { font-family: game-font-pacifico; margin-top: 0; margin-bottom: 10px; color: #0b4873; font-size: 28px; text-align: center; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message.game-lost { background-image: url(/images/click_n_claim/games/lenormand_day/game_box_bg.jpg); background-repeat: no-repeat; background-size: 100% 100%; display: inline-block; width: 250px; z-index: 1000; position: absolute; top: 230px; left: 31%; padding: 15px; text-align: center; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message.game-lost .game-message-img { background-image: url("/images/click_n_claim/games/lenormand_day/you_lost.png"); background-repeat: no-repeat; width: 100%; height: 178px; display: inline-block; margin: 0; background-size: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message button { font-family: game-font-varela; margin-top: 10px; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message button:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash { width: 100%; float: left; padding: 0 15px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time { width: 25%; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .steps { width: 25%; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers { width: 50%; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .steps, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty { font-family: game-font-pacifico; font-size: 18px; float: left; padding-top: 18px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time span, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score span, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .steps span, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty span { padding: 5px; text-align: center; display: inline-block; margin-left: 10px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time span.label, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score span.label, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .steps span.label, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty span.label { color: #0b4873; padding: 0; margin: 0; font-size: 20px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time span.value, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score span.value, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .steps span.value, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty span.value { background-color: #c7a04c; background-image: -webkit-gradient(linear, left top, left bottom, from(#c7a04c), to(#926a44)); background-image: -webkit-linear-gradient(top, #c7a04c, #926a44); background-image: -moz-linear-gradient(top, #c7a04c, #926a44); background-image: -ms-linear-gradient(top, #c7a04c, #926a44); background-image: -o-linear-gradient(top, #c7a04c, #926a44); background-image: linear-gradient(top, #c7a04c, #926a44); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#c7a04c', endColorStr='#926a44'); font-family: game-font-varela; color: #ffffff; font-size: 16px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time span.value:hover, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score span.value:hover, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .steps span.value:hover, #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty span.value:hover { background-color: #926a44; background-image: -webkit-gradient(linear, left top, left bottom, from(#926a44), to(#c7a04c)); background-image: -webkit-linear-gradient(top, #926a44, #c7a04c); background-image: -moz-linear-gradient(top, #926a44, #c7a04c); background-image: -ms-linear-gradient(top, #926a44, #c7a04c); background-image: -o-linear-gradient(top, #926a44, #c7a04c); background-image: linear-gradient(top, #926a44, #c7a04c); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#926a44', endColorStr='#c7a04c'); } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty .label { float: left; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty #levelPanel { float: left; margin-left: 15px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty #levelPanel label { margin-left: 0; margin-right: 8px; vertical-align: middle; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty #levelPanel input { margin-top: 0 !important; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time span.time-value { width: 50px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score span.score-value { background-color: #53a24a; color: #ffffff; width: 40px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers { float: left; margin-top: 15px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button { font-family: game-font-varela; font-size: 16px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.start-game { float: left; outline: none; height: 36px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.start-game:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.change-card-deck { outline: none; float: right; height: 36px; background-color: #8d5998; background-image: -webkit-gradient(linear, left top, left bottom, from(#8d5998), to(#493c82)); background-image: -webkit-linear-gradient(top, #8d5998, #493c82); background-image: -moz-linear-gradient(top, #8d5998, #493c82); background-image: -ms-linear-gradient(top, #8d5998, #493c82); background-image: -o-linear-gradient(top, #8d5998, #493c82); background-image: linear-gradient(top, #8d5998, #493c82); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#8d5998', endColorStr='#493c82'); } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.change-card-deck:hover { background-color: #493c82; background-image: -webkit-gradient(linear, left top, left bottom, from(#493c82), to(#8d5998)); background-image: -webkit-linear-gradient(top, #493c82, #8d5998); background-image: -moz-linear-gradient(top, #493c82, #8d5998); background-image: -ms-linear-gradient(top, #493c82, #8d5998); background-image: -o-linear-gradient(top, #493c82, #8d5998); background-image: linear-gradient(top, #493c82, #8d5998); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#493c82', endColorStr='#8d5998'); } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty-group-addon input[type=radio] { /*opacity: 0; height: 1px; width: 1px;*/ } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty-group-addon input[type=radio] + label { background-image: url("/images/icons/sprite.svg"); background-position: 0 -512px !important; background-repeat: no-repeat; background-size: 400px auto; cursor: pointer; display: inline-block; height: 24px; margin-top: 10px; pointer-events: none; width: 24px; /* background-image: url(/images/icons/sprite.svg); background-position: 0 -320px !important; background-repeat: no-repeat; background-size: 250px auto; cursor: pointer; display: inline-block; height: 16px; margin-top: 10px; pointer-events: none; width: 15px; z-index: 1000; */ } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty-group-addon input[type=radio]:checked + label { background-position: -24px -512px !important; } #flip-card-game-game.game-wrapper #gameWon { position: relative; } #flip-card-game-game.game-wrapper #gameWon .game-box-image { display: inline-block; width: 100%; text-align: center; margin: 15px 0; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper { position: relative; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper h3 { font-family: game-font-pacifico; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper h3.game-box-title { font-size: 28px; line-height: 25px; text-transform: none; text-align: left; margin: 2px 0 0; padding: 0 0 10px 0; color: #0b4873; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper hr.game-box-title-hr { margin: 8px 0 !important; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper p { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper p.game-box-description { font-size: 18px; text-transform: none; text-align: left; margin: 2px 0 10px 0; padding: 0 0 10px 0; color: #414141; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won hr { border-top: 1px solid #c8c8c8; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user p.guest-user-title { font-size: 28px; color: #0b4873; font-family: game-font-pacifico; margin-bottom: 0; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user p.guest-user-message { font-size: 16px; color: #414141; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user button.new-customer { font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user button.new-customer:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user button.registered-customer { margin-left: 15px; font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user button.registered-customer:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user .btn-group { display: inline-block; width: 100%; text-align: center; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user .btn-group button { font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user .btn-group button:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.guest-user .btn-group button.new-game { font-family: game-font-varela; font-size: 16px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.registered-user button { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.registered-user .btn-group { display: inline-block; width: 100%; text-align: center; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.registered-user .btn-group button { font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.registered-user .btn-group button:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .game-won.registered-user .btn-group button.claim-now { margin-right: 15px; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user input { margin-top: 15px; width: 65%; margin-right: 10px; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user input::-webkit-input-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user input:-ms-input-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user input:-moz-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user input::-moz-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user label { margin-top: 15px; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user hr { float: left; border-top: 1px solid #c8c8c8; width: 100%; margin-top: 30px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user p { font-family: game-font-varela; font-size: 14px; display: inline-block; width: 100%; color: #414141; margin-bottom: 2px; margin-top: 6px; padding-bottom: 0; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user a { font-family: game-font-varela; font-size: 14px; text-align: left; text-decoration: underline; margin-top: 15px; width: 100%; display: inline-block; color: #16620e; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user a:hover { color: #53a24a; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user a .new-customer { margin-top: 15px; display: inline-block; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user button { margin-top: 15px; font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .registered-user button:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user { margin-bottom: 20px; display: inline-block; width: 100%; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user .checkbox-inline { padding-left: 0; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user .checkbox-inline p { display: inline-block; margin-left: 12px; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user .checkbox-inline p a { margin-top: 0; margin-left: 0; font-size: 14px; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input::-webkit-input-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input:-ms-input-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input:-moz-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input::-moz-placeholder { font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input[type=email] { width: 65%; margin-bottom: 10px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input[type=checkbox] { opacity: 0; height: 1px; width: 1px; margin-left: 0; margin-top: 0; position: absolute; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input[type=checkbox] + strong { background-image: url(/images/icons/sprite.svg); background-position: -48px -512px !important; background-repeat: no-repeat; background-size: 400px auto; cursor: pointer; display: inline-block; float: left; height: 24px; pointer-events: none; width: 24px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input[type=checkbox]:checked + strong { background-position: -72px -512px !important; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input[type=radio] + strong { background-image: url(/images/icons/sprite.svg); background-position: 0px -512px !important; background-repeat: no-repeat; background-size: 400px auto; cursor: pointer; display: inline-block; float: left; height: 24px; pointer-events: none; width: 24px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user input[type=radio]:checked + strong { background-position: -24px -512px !important; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user hr { float: left; border-top: 1px solid #c8c8c8; width: 100%; margin-top: 30px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user a { margin-left: 10px; margin-top: 25px; display: inline-block; color: #53a24a; text-decoration: underline; font-size: 16px; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user a.registered-customer { margin-left: 0; margin-top: 0; font-size: 14px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user .register-new-user { margin-top: 15px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user button { font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .new-user button:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success { text-align: center; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success p { text-align: center; margin-bottom: 0; font-family: game-font-varela; font-size: 20px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success p.registered-logged-user-title { font-family: game-font-pacifico; color: #0b4873; font-size: 28px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success p.registered-logged-user-message { font-size: 16px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons { display: inline-block; margin: 15px 10px; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons .new-game { margin-left: 15px; font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons .new-game:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons .ok-btn { font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons .ok-btn:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons a { background: #4267b2; border: 1px solid #4267b2; color: #fff; cursor: pointer; padding: 4px; border-radius: 3px; font-size: 14px; font-family: Helvetica, Arial, sans-serif; font-weight: bold; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons a:hover { text-decoration: none; background-color: #365899; border: 1px solid #365899; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons a.fb-xfbml-parse-ignore { padding: 7px 7px 7px 30px; position: relative; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .claim-success .buttons a.fb-xfbml-parse-ignore::before { background: url("/images/click_n_claim/games/mothers_day/fb_icon.png"); float: left; width: 30px; height: 30px; content: ""; top: 0; left: 0; position: absolute; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed { text-align: center; margin-top: 15px; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed p { text-align: center; margin-bottom: 0; font-size: 18px; font-family: game-font-varela; color: #414141; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed p a { color: #53a24a; text-decoration: underline; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed .buttons { float: left; width: 100%; margin: 10px 0 15px 0; font-family: game-font-varela; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed .buttons .new-game { margin-left: 15px; font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed .buttons .new-game:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed .buttons .ok-btn { font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .already-claimed .buttons .ok-btn:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper .ajax-loader { position: absolute; background-image: url(/images/icons/ripple.svg); width: 75px; height: 75px; z-index: 10000; float: left; background-repeat: no-repeat; background-position: top center; background-size: 110%; left: 44%; top: 55px; } #gameWon .game-message-bag { margin-bottom: 15px; } .game-message-bag.alert { text-shadow: none; box-shadow: none; border: 1px solid transparent; border-radius: 0; overflow: hidden; padding: 0; margin-top: 15px; margin-bottom: 0; } .game-message-bag.alert .alert-danger { background: #f47575; padding: 15px; color: #ffffff; font-family: game-font-varela; font-size: 15px; } @media (max-width: 460px) { #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container { height: 100px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button { padding: 0px 10px; } } @media (min-width: 461px) and (max-width: 767px) { #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container { height: 200px; } } @media screen and (max-width: 767px) { #flip-card-game-modal .modal-dialog { margin: 0 !important; } #flip-card-game-game.game-wrapper #gameOn h3.game-wrapper-title { width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game { /*height: 220px;*/ } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container { width: 25%; /*height: 100px;*/ margin: 2px 0; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper { margin-right: 4px; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper .front { background-size: 100% 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper .back { background-size: 100% 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message { width: 200px; left: 5%; top: 8px; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message .msg { font-size: 18px; margin-top: 0; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message .game-message-img { width: 104px; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message button { margin-top: 5px; height: 30px; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message.game-lost { left: 18%; top: 30px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash { margin-bottom: 10px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time { font-size: 14px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time span { padding: 2px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time span.time-value { margin-left: 5px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score { font-size: 14px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score span { padding: 2px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .score span.score-value { margin-left: 5px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.start-game { height: 30px; margin-top: 0; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.change-card-deck { height: 30px; margin-top: 0; } #flip-card-game-game.game-wrapper #gameWon .game-box-image img { display: block; max-width: 100%; height: auto; } #flip-card-game-game.game-wrapper #gameWon .registered-user input { width: 100% !important; margin-bottom: 10px; } #flip-card-game-game.game-wrapper #gameWon .new-user input[type=email] { width: 100% !important; } #flip-card-game-game.game-wrapper #gameWon .new-user label.checkbox-inline p { width: 160px; } #flip-card-game-game.game-wrapper #gameWon .already-claimed button { width: 100%; } #flip-card-game-game.game-wrapper #gameWon .already-claimed button.ok-btn { margin-bottom: 10px; font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .already-claimed button.ok-btn:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .already-claimed button.new-game { margin: 0 !important; font-family: game-font-varela; font-size: 16px; background-color: #2fa360; background-image: -webkit-gradient(linear, left top, left bottom, from(#2fa360), to(#1a7a70)); background-image: -webkit-linear-gradient(top, #2fa360, #1a7a70); background-image: -moz-linear-gradient(top, #2fa360, #1a7a70); background-image: -ms-linear-gradient(top, #2fa360, #1a7a70); background-image: -o-linear-gradient(top, #2fa360, #1a7a70); background-image: linear-gradient(top, #2fa360, #1a7a70); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2fa360', endColorStr='#1a7a70'); } #flip-card-game-game.game-wrapper #gameWon .already-claimed button.new-game:hover { background-color: #1a7a70; background-image: -webkit-gradient(linear, left top, left bottom, from(#1a7a70), to(#2fa360)); background-image: -webkit-linear-gradient(top, #1a7a70, #2fa360); background-image: -moz-linear-gradient(top, #1a7a70, #2fa360); background-image: -ms-linear-gradient(top, #1a7a70, #2fa360); background-image: -o-linear-gradient(top, #1a7a70, #2fa360); background-image: linear-gradient(top, #1a7a70, #2fa360); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#1a7a70', endColorStr='#2fa360'); } #flip-card-game-game.game-wrapper #gameWon .game-won.guest-user .btn-group button { margin-left: 0; margin-bottom: 15px; } } @media (min-width: 768px) { .modal-dialog { min-width: 490px; max-width: 730px; width: inherit; } #flip-card-game-game.game-wrapper #gameWon .claim-form-wrapper { max-width: 550px; } } @media (max-width: 767px) { .modal-dialog { width: 100%; } #flip-card-game-game.game-wrapper { padding: 0; } #flip-card-game-game.game-wrapper #gameOn .game-wrapper-left img { width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-wrapper-right { width: 100%; margin-left: 0; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash { padding: 0 5px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .steps { width: 50%; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .time { width: 50%; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty { width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .difficulty #levelPanel { margin-left: 10px; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers { width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.start-game { margin: 0; } #flip-card-game-game.game-wrapper #gameOn .game-container .controllers-dash .controllers button.change-image { height: 30px; width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game { height: auto; /* display: block;*/ } #flip-card-game-game.game-wrapper #gameOn .game-container .game #sortable { width: 100%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game #actualImageBox { width: 100%; float: left; margin-top: 10px; } #flip-card-game-game.game-wrapper #gameOn .game-container .game #actualImageBox img { width: 40%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-puzzle-items .start-game { top: 38%; left: 34%; font-family: game-font-pacifico; } #flip-card-game-game.game-wrapper #gameOn .game-container .dialogs .game-message.game-lost { left: 9%; } #flip-card-game-game #gameWon .claim-form-wrapper { max-width: 550px; } } /* Mobile */ @media screen and (max-width: 767px) { #flip-card-game-modal .modal-dialog { width: 100%; } .game-box #gameOn #game .flip-container { width: 25%; height: 66px; margin: 2px 0; } .game-box #gameOn #game .flip-container .flipper { margin-right: 4px; } .game-box #gameWon .game-box-image img { display: block; max-width: 100%; height: auto; } .game-box #gameWon .registered-user input { width: 100%; margin-bottom: 10px; } .game-box #gameWon .new-user input[type=email] { width: 100%; } .game-box #gameWon .ajax-loader { top: 168px; left: 20%; } } /* Tab */ @media (min-width: 768px) and (max-width: 991px) { #flip-card-game-modal .modal-dialog { width: 672px; } .game-box #gameOn #game .flip-container { width: 150px; height: 150px; margin: 5px 0; } .game-box #gameOn #game .flip-container .flipper { margin-right: 10px; } .game-box #gameWon .ajax-loader { top: 210px; left: 32%; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container { /*width: 156px; height: 194px; margin: 5px 0;*/ width: 23.60%; height: 194px; margin: 5px 10px 5px 0; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper { /*margin-right: 10px;*/ } } /* PC */ @media screen and (min-width: 991px) { #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container { /*width: 156px; height: 194px; margin: 5px 0;*/ width: 23.78%; height: 194px; margin: 5px 10px 5px 0; } #flip-card-game-game.game-wrapper #gameOn .game-container .game .image-flip-items .flip-container .flipper { /*margin-right: 10px;*/ } } .fb-share-button { margin-bottom: 20px; }