@font-face {font-family: "DaxCondensed";src: url("../fonts/DaxCondensedBlack.ttf") format("truetype");font-weight: normal;font-style: normal;}
#Content {background: url("../images/bg_page.jpg?v=1");background: none;background-size: 100%;}
#Content h1:after {content: "Bingo Card Generator";background: linear-gradient(360deg,#ffc000 0%,#ffe888 100%);color: transparent;-webkit-background-clip: text;background-clip: text;text-shadow: none;position: absolute;letter-spacing: 5px;top: 0px;left: 0px;width: 100%;display: block;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
#Content h1 {text-transform: uppercase;line-height: 120%;text-align: center;font-family: "DaxCondensed";display: block;display: none;font-size: 3.6vw;text-shadow: 2px 3px 5px #093568,0px 10px 5px rgba(69,11,65,.3);letter-spacing: 5px;background: none;margin-bottom: 10px;position: relative;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
#bingo-generator-form input[type="submit"] {margin-top: 10px;}
#generator-result {position: relative;}
.bingo-generator {display: grid;grid-template-columns: 1fr;justify-items: center;}
.bingo-generator .grid-inputs {display: grid;width: 23.9vw;height: 23.75vw;padding: 0;box-sizing: border-box;position: absolute;margin-left: 2.91vw;margin-top: 6.4vw;}
.bingo-generator .grid-inputs input {width: 100%;height: 100%;background: transparent;padding: 0;margin: 0;border: 0;outline: 0;text-align: center;font-family: "DaxCondensed";font-size: 20px;color: transparent;}
.bingo-generator .grid-inputs input:focus {color: #0b0b0b;}
.bingo-generator .grid-inputs input:hover {}
.bingo-generator .grid-inputs input:focus {background: radial-gradient(closest-side,rgba(123,235,255,1) 0%,rgba(192,250,255,1) 60%,rgba(160,237,255,0) 100%) !important;}
#generator-results-canvas {width: 30vw;height: calc(30vw / .915);border-radius: 15px;box-shadow: 0px 0px 35px #000;}
#pdf-loading {display: none;width: 100%;height: calc(13vw / 150 * 54);text-align: center;margin: 10px auto 0;font-size: 30px;line-height: calc(13vw / 150 * 54);color: #fff;font-family: "DaxCondensed";}
#generate-pdf {width: 13vw;height: calc(13vw / 150 * 54);font-family: "DaxCondensed";font-size: 1.9vw;line-height: 120%;-webkit-text-stroke: 2px rgba(34,53,6,.48);text-stroke: 2px rgba(34,53,6,.48);background: url("../images/btn_create_yours.png") no-repeat;margin: 10px auto 0;padding: 0 0 5px;background-size: 100% 100%;display: block;}
#generate-pdf:hover {filter: brightness(120%);}
#generate-pdf:after {display: none;}
.bingo-generator .inputs {display: flex;padding: 0 3.1vw 0 2.9vw;justify-content: space-between;position: absolute;top: 1.14vw;width: 100%;box-sizing: border-box;}
.bingo-generator input.title, .bingo-generator .grid-size, .bingo-generator .grid-size-options, .bingo-generator .inputs input[type="button"] {border: 0px;border-radius: 20px;height: 2.2vw;width: 11vw;padding: 0 20px 0 20px;font-size: 1.3vw;text-align: center;font-family: "DaxCondensed",sans-serif;color: #0b0b0b;box-shadow: inset 1px 1px 3px rgba(0,0,0,.5);outline: 0;box-sizing: border-box;}
.bingo-generator input.title {width: 13vw;line-height: 100%;}
.bingo-generator .inputs input[type="button"] {background: #fff url("../images/icon-templates.png") no-repeat center;background-size: 50%;padding: 0;margin: 0;width: 2.18vw;}
.tooltip {opacity: 0;top: -5000px;left: -5000px;position: absolute;width: 11.9vw;height: calc(11.9vw * 74 / 200);background: url("../images/bg_tooltip.png");background-size: 100% 100%;font-family: "DaxCondensed";text-align: center;line-height: calc(11.3vw * 74 / 200);font-size: 1.1vw;text-transform: uppercase;transition: opacity .2s linear;z-index: 15;box-sizing: border-box;padding-left: 13px;color: #b26e59;}
.bingo-generator .canvas-wrapper {background: url("../images/bingo_default.png") no-repeat;background-size: 100%;}
.bingo-generator .canvas-wrapper .grid-inputs div.right:after {position: absolute;top: -5000px;left: -5000px;content: "Click to add custom \Anumber or text";white-space: pre-wrap;width: 11.9vw;height: calc(11.9vw * 74 / 200);font-family: "DaxCondensed";background: url("../images/bg_tooltip.png");background-size: 100% 100%;text-align: center;font-size: 1.1vw;text-transform: uppercase;transition: opacity .2s linear;z-index: 15;box-sizing: border-box;padding-left: 13px;opacity: 0;line-height: 1.25vw;padding-top: .83vw;color: #b26e59;pointer-events: none;}
.bingo-generator .canvas-wrapper .grid-inputs div.right:hover:after {top: auto;left: auto;margin-left: 15px;opacity: 1;}
.bingo-generator .canvas-wrapper .grid-inputs.grid-size-5 div.right:hover:after {margin-top: .34vw;}
.bingo-generator .canvas-wrapper .grid-inputs.grid-size-4 div.right:hover:after {margin-top: .98vw;}
.bingo-generator .canvas-wrapper .grid-inputs.grid-size-3 div.right:hover:after {margin-top: 1.8vw;}
.bingo-generator .canvas-wrapper .grid-inputs div.left:before {position: absolute;top: -5000px;left: -5000px;content: "Click to add custom \Anumber or text";white-space: pre-wrap;width: 11.9vw;height: calc(11.9vw * 74 / 200);font-family: "DaxCondensed";background: url("../images/bg_tooltip_fliped.png");background-size: 100% 100%;text-align: center;font-size: 1.1vw;text-transform: uppercase;transition: opacity .2s linear;z-index: 15;box-sizing: border-box;padding-right: 13px;opacity: 0;line-height: 1.25vw;padding-top: .83vw;color: #b26e59;pointer-events: none;}
.bingo-generator .canvas-wrapper .grid-inputs div.left:hover:before {top: auto;left: auto;margin-left: -15px;transform: translate(-100%,0);opacity: 1;}
.bingo-generator .canvas-wrapper .grid-inputs.grid-size-5 div.left:hover:before {margin-top: .34vw;}
.bingo-generator .canvas-wrapper .grid-inputs.grid-size-4 div.left:hover:before {margin-top: .98vw;}
.bingo-generator .canvas-wrapper .grid-inputs.grid-size-3 div.right:hover:before {margin-top: 1.8vw;}
.bingo-generator .button-wrapper:hover .tooltip {margin-left: 2.7vw;margin-top: -1.04vw;top: auto;left: auto;display: block;opacity: 1;}
.bingo-generator .title-wrapper {line-height: 100%;}
.bingo-generator .title-wrapper:hover .tooltip {background-image: url("../images/bg_tooltip_fliped.png");margin-left: -12.5vw;margin-top: -1.04vw;padding-left: 0;padding-right: 13px;top: auto;left: auto;display: block;opacity: 1;}
.bingo-generator .grid-size:hover .tooltip {margin-left: 5.2vw;margin-top: 1.3vw;top: auto;left: auto;display: block;opacity: 1;}
.bingo-generator .grid-size {background: #fff;line-height: 2.39vw;cursor: pointer;position: relative;padding: 0;max-width: 90px;}
.bingo-generator .grid-size:hover .grid-size-options {display: block;position: absolute;width: 100%;height: auto;background: #fff;top: 0px;padding: 0;overflow: hidden;z-index: 1;}
.bingo-generator .grid-size:hover .grid-size-options li {width: 100%;}
.bingo-generator .grid-size:hover .grid-size-options li:hover {background: #f0f0f0;box-shadow: inset 1px 1px 3px rgba(0,0,0,.5);}
.bingo-generator .grid-size:hover .grid-size-options li.active {background: #dcdcdc;box-shadow: inset 1px 1px 3px rgba(0,0,0,.5);}
.bingo-generator .grid-size-options {display: none;}
.bingo-generator div.icon-down-open:before {position: absolute;top: .57vw;right: 0px;}
.bingo-generator .canvas-wrapper .grid-size-5 {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;grid-template-rows: 1fr 1fr 1fr 1fr 1fr;}
.bingo-generator .canvas-wrapper .grid-size-4 {grid-template-columns: 1fr 1fr 1fr 1fr;grid-template-rows: 1fr 1fr 1fr 1fr;}
.bingo-generator .canvas-wrapper .grid-size-3 {grid-template-columns: 1fr 1fr 1fr;grid-template-rows: 1fr 1fr 1fr;}
#templates-popup-background {position: fixed;width: 100%;height: 100%;background: rgba(0,0,0,.7);z-index: 999999;top: 0;pointer-events: none;display: none;}
#templates-popup.hidden {display: none;}
#templates-popup {position: fixed;width: 72.9vw;height: 41.5vw;top: 45%;left: -50%;transform: translate(-50%,-50%);z-index: 2000;background: url("../images/bg_popup.png") no-repeat center;background-size: 100% auto;align-items: center;display: flex;flex-direction: column;font-family: "DaxCondensed";padding: 40px 20px;box-sizing: border-box;}
#templates-popup .tabs-area {width: 100%;}
#templates-popup .tabs {display: flex;grid-gap: .78vw;margin-left: 2.6vw;}
#templates-popup .tabs li {background: url("../images/tab.png") no-repeat center;background-size: 100% 100%;text-align: center;min-width: 9vw;text-transform: uppercase;line-height: 2.34vw;cursor: pointer;font-size: 1.1vw;color: #b26e59;}
#templates-popup .tabs li:hover {opacity: .9;}
#templates-popup .tabs li.active {background-image: url("../images/tab_active.png");opacity: 1;background-size: 100% 100%;margin-bottom: -1px;}
#templates-popup .tabs-content {display: block;width: 100%;height: 100%;background: url("../images/bg_tabs_content.png");background-size: 100% 100%;padding: 1.5vw 2.6vw 0;box-sizing: border-box;}
#templates-popup .tabs-content li {display: none;grid-template-columns: 1fr 1fr 1fr;overflow-y: scroll;height: 31vw;padding-right: 15px;}
#templates-popup .tabs-content li.active {display: grid;grid-gap: 25px;}
#templates-popup .tabs-content li div {position: relative;}
#templates-popup .tabs-content li div span {position: absolute;display: flex;justify-content: center;align-items: center;width: 60%;left: 20%;top: 3.5%;background: #fff;color: #0b0b0b;text-align: center;text-transform: uppercase;font-size: 1vw;border-radius: 20px;line-height: 100%;height: 6%;padding-top: 1%;box-sizing: border-box;box-shadow: inset 1px 1px 3px rgba(0,0,0,.5);}
#templates-popup .tabs-content li div:after {content: "";position: absolute;width: 75%;height: 72%;top: 12%;left: 12.5%;background-image: url("../images/grid5.png");background-size: 100% 100%;}
#templates-popup .close-button {background: url("../images/btn_close.png") center;background-size: 100%;width: 3vw;height: 3vw;display: block;position: absolute;right: 0;top: 0;cursor: pointer;}
#templates-popup .tabs-content li button {width: 7.8vw;height: calc(7.8vw / 154 * 54);font-family: "DaxCondensed";font-size: 1.25vw;line-height: 100%;-webkit-text-stroke: 1px rgba(34,53,6,.48);text-stroke: 1px rgba(34,53,6,.48);background: url("../images/btn_pick_me.png") no-repeat;margin: -1.56vw auto 0;padding: 0;background-size: 100% 100%;display: block;}
#templates-popup .tabs-content li button.active {background-image: url("../images/btn_active.png");}
#templates-popup .tabs-content li button:after {display: none;}
#templates-popup .tabs-content li {scrollbar-width: thin;scrollbar-color: #f78a3f rgba(255,255,255,.2);}
#templates-popup .tabs-content li::-webkit-scrollbar {width: 14px;}
#templates-popup .tabs-content li::-webkit-scrollbar-track {background: rgba(255,255,255,.2);-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);-webkit-border-radius: 10px;border-radius: 5px;}
#templates-popup .tabs-content li::-webkit-scrollbar-thumb {background: #f78a3f;width: 34px;height: 44px;border-radius: 15px;}
.section.mcb-section.footer-top {margin-top: 0;}
.bingo-generator-text {margin-top: 10px;font-family: "DaxCondensed";text-align: center;margin-bottom: 0px;padding-bottom: 30px;font-size: 1.04vw;color: #fff;text-shadow: 1px 1px 5px rgba(57,27,4,1);}
.cards-per-page {padding-top: 15px;padding-bottom: 15px;display: flex;justify-content: space-between;}
.custom-radio {display: inline-block;position: relative;padding-left: 22px;margin-bottom: 0px;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;font-family: "DaxCondensed";font-size: 1.04vw;text-transform: uppercase;color: #fff;}
.custom-radio input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.checkmark {position: absolute;top: 3px;left: 0;height: 18px;width: 18px;background-color: #fff;border-radius: 50%;box-shadow: inset 0px 0px 1px black;}
.custom-radio:hover input ~ .checkmark {background-color: #ccc;}
.custom-radio input:checked ~ .checkmark {background-color: #2196f3;}
.checkmark:after {content: "";position: absolute;display: none;}
.custom-radio input:checked ~ .checkmark:after {display: block;}
.custom-radio .checkmark:after {top: 6px;left: 6px;width: 6px;height: 6px;border-radius: 50%;background: white;}
#bingo-caller {display: flex;margin: 0 auto;width: 32vw;height: calc(32vw * 96 / 673);background: url("../images/caller-bar.png");background-size: 100% 100%;margin-bottom: 8px;}
#bingo-caller #play-now {width: calc(32vw / 10.66);height: calc(32vw / 10.66);margin-top: calc(32vw / 55.3);margin-left: calc(32vw / 45);display: inline-block;background-image: url("../images/play-icon.png");background-size: 100% 100%;cursor: pointer;}
#bingo-caller #play-now.paused {background-image: url("../images/pause-icon.png");}
#bingo-caller #play-now-wrapper {margin-right: 5px;}
#bingo-caller #play-now-wrapper:hover .tooltip {background-image: url("../images/bg_tooltip_fliped.png");margin-left: calc(32vw / -2.83);margin-top: 0;top: auto;left: auto;display: block;opacity: 1;padding-left: 0;padding-right: 13px;}
#bingo-caller .played-balls {display: block;height: 3.2vw;min-height: 72px;width: calc(32vw / 1.28);margin-left: calc(32vw / 32);padding-top: .6vw;overflow: hidden;position: relative;}
@-webkit-keyframes move_ball {from {right: 100%;}
	to {right: -15%;}}
@-moz-keyframes move_ball {from {right: 100%;}
	to {right: -15%;}}
@-o-keyframes move_ball {from {right: 100%;}
	to {right: -15%;}}
@keyframes move_ball {from {right: 100%;}
	to {right: -15%;}}
#bingo-caller .played-balls .paused {animation-play-state: paused !important;}
#bingo-caller .played-balls .ball {position: absolute;right: -15%;display: inline-block;width: calc(32vw / 10);height: calc(32vw / 10);background-size: 100% 100%;font-family: "DaxCondensed";font-size: 1vw;line-height: 100%;color: #003952;text-align: center;padding-top: 1.2vw;box-sizing: border-box;animation: 20s linear 0s alternate move_ball;}
#bingo-caller .played-balls .ball span {display: inline-block;font-size: .75vw;line-height: 100%;margin-top: 0vw;}
#bingo-caller .played-balls .ball_b {background-image: url("../images/ball_b.png");}
#bingo-caller .played-balls .ball_i {background-image: url("../images/ball_i.png");}
#bingo-caller .played-balls .ball_n {background-image: url("../images/ball_n.png");}
#bingo-caller .played-balls .ball_g {background-image: url("../images/ball_g.png");}
#bingo-caller .played-balls .ball_o {background-image: url("../images/ball_o.png");}
@media screen and (max-width: 1239px) {#Content h1 {margin-top: 50px;}}
@media screen and (max-width: 992px) {body div#Content {margin-top: 66px;}
	.bingo-generator .grid-size {width: 5vw;}
	#templates-popup .tabs-content li {height: 29vw;}}
@media screen and (max-width: 876px) {#bingo-caller {width: 273px;height: calc(273px * 96 / 673);margin-bottom: 8px;}
	#bingo-caller #play-now {width: calc(273px / 10.66);height: calc(273px / 10.66);margin-top: calc(273px / 55.3);margin-left: calc(273px / 45);}
	#bingo-caller #play-now-wrapper {margin-right: 5px;}
	#bingo-caller #play-now-wrapper:hover .tooltip {margin-left: calc(273px / -2.83);}
	#bingo-caller .played-balls {width: calc(273px / 1.28);margin-left: calc(273px / 32);}
	#bingo-caller .played-balls .ball {width: calc(273px / 10);height: calc(273px / 10);font-size: 10px;padding-top: 9px;}
	#bingo-caller .played-balls .ball span {font-size: 6px;margin-top: 0px;}
	#bingo-caller #play-now-wrapper:hover .tooltip {display: none;}
	.cards-per-page {flex-direction: column;align-items: center;}
	.cards-per-page label {top: 2px;padding-bottom: 10px;width: 120px;}
	.custom-radio {font-size: 14px;}
	body div#Content {margin-top: 66px;}
	#generator-results-canvas {width: 263px;height: calc(263px / .915);}
	#Content h1 {font-size: 30px;}
	#generate-pdf {width: 140px;height: calc(140px / 150 * 54);font-size: 14px;}
	#pdf-loading {height: calc(140px / 150 * 54);font-size: 25px;margin-bottom: 0;}
	.bingo-generator-text {font-size: 14px;line-height: 120%;}
	.bingo-generator input.title {font-size: 12px;width: 113px;height: 19px;}
	.bingo-generator .grid-size {font-size: 12px;width: 43px;height: 19px;}
	.bingo-generator .inputs input[type="button"] {font-size: 12px;width: 19px;height: 19px;}
	.bingo-generator .grid-size-options {font-size: 12px;border-radius: 10px;}
	.bingo-generator .inputs {padding: 0 29px;top: 10px;}
	.bingo-generator .grid-inputs {width: 209px;height: 208px;margin-top: 56px;margin-left: 25px;}
	.bingo-generator #generator-result .inputs div.tooltip {display: none;}
	.bingo-generator .canvas-wrapper .grid-inputs div:after {display: none;}
	.bingo-generator .canvas-wrapper .grid-inputs div:before {display: none;}
	.bingo-generator .grid-size .value {line-height: 20px;}
	#Content {background-size: auto 100%;background-position: center;}
	.bingo-generator .grid-size:hover .grid-size-options li {line-height: 120%;}
	#templates-popup .tabs-content li {height: calc(35vw - 50px);}
	#templates-popup .tabs li {font-size: 13px;min-width: 50px;line-height: 20px;padding: 5px 10px 0;}
	#templates-popup {padding: 20px 10px;}}
@media screen and (max-width: 700px) {#templates-popup .tabs-content li {grid-template-columns: 1fr 1fr;}
	#templates-popup .tabs-content li div span {font-size: 1.5vw;}}
@media screen and (max-width: 550px) {#templates-popup {width: 90vw;height: 80vw;background-size: 100% 100%;left: 44%;}
	#templates-popup .tabs-content li {height: calc(70vw - 50px);}
	#templates-popup .tabs-content li.active {grid-gap: 10px;}
	#templates-popup .tabs-content li div span {font-size: 2vw;}
	#templates-popup .tabs-content li.active button {width: 70px;height: calc(70px / 154 * 54);font-size: 13px;margin: -17px auto 0;}
	#templates-popup .close-button {width: 30px;height: 30px;}}