/* Minification failed. Returning unminified contents.
(666,217): run-time error CSS1038: Expected hex color, found '#0004'
(756,1): run-time error CSS1019: Unexpected token, found '}'
(822,56): run-time error CSS1038: Expected hex color, found '#0006'
(837,97): run-time error CSS1038: Expected hex color, found '#0004'
(843,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(844,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(847,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(848,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(853,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(854,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(857,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(858,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(864,128): run-time error CSS1038: Expected hex color, found '#000c'
(896,98): run-time error CSS1038: Expected hex color, found '#0002'
(906,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(907,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(910,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(911,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(914,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(915,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(918,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(919,1): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(927,77): run-time error CSS1038: Expected hex color, found '#000a'
(931,151): run-time error CSS1038: Expected hex color, found '#0002'
(933,163): run-time error CSS1038: Expected hex color, found '#0004'
(964,28): run-time error CSS1038: Expected hex color, found '#0004'
 */
/* GLOBALS AND RESETS */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img, strong, ul, li, form, br {margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: top;}
html {background: #333; min-height: 100%;}
body {background: url(/images/layout/nyc.jpg) #F8F8F8 bottom left no-repeat; background-size: 70%; background-attachment: fixed; position: relative; color: #555; font-family: "Trebuchet MS", arial, sans-serif; -webkit-text-size-adjust: none; transition: transform ease .4s;}
sup {padding: 0; margin: 0; font-size: 90%; line-height: normal;}
a {text-decoration: none; color: #EC1C23;}
a:hover {color: #F00;}
a img {border: none;}
input[type=text], input[type=password], textarea {background: #F3F3F3; border: 1px solid #EEE; padding: 6px 5px; font: normal 1em/normal arial, sans-serif; outline: none; border-radius: 0; transition: .3s all ease-in-out; color: #555; -webkit-appearance: none;}
.upper {text-transform: uppercase !important;}
.block {display: block !important;}
.hide {display: none !important;}
.clear {clear: both;}
.centred {margin: auto; text-align: center !important;}
.nowrap {white-space: nowrap !important;}
.lefty {text-align: left !important;}
.righty {text-align: right !important;}
.floatLeft {float: left !important;}
.floatRight {float: right !important;}
.imgL {float: left; margin: 0 10px 10px 0 !important;}
.imgR {float: right; margin: 0 0 10px 10px !important;}
.inline {display: inline-block;}
.padded5 {padding: 5px !important;}
.padded10 {padding: 10px !important;}
.padded20 {padding: 20px !important;}
.padded30 {padding: 30px !important;}
#content p.pad20 {padding:20px;}
.noMargin {margin: 0 !important;}
.noPadding {padding: 0 !important;}
.breaker {word-break: break-all; word-wrap: break-word;}
.clipper {background-clip: padding-box;}
.smallerText {font-size: 0.8em !important;}
.red {color: #EC1C23;}
.vMid {vertical-align: middle;}
.box-border, .box, footer, #content, .styleTable, #addsearch {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.transition, .button, nav > ul li a, nav > ul li > span, nav > ul li, .sub ul, .sub:after, #breadcrumbs li a, .faq .title4, .faq .answer, .onoffswitch, .onoffswitch:before {-webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
#logo a {display: block;}
header div#logo img {object-position: left;padding: 5px 0;}

/* HEADINGS */
h1, h2, .title {font: bold 2.2em/46px "Trebuchet MS", sans-serif; letter-spacing: -1px;}
h1 {margin-bottom: 20px;}
h2, .title {font-size: 1.8em; line-height: 30px; padding-bottom: 15px;}
h3, .subTitle {font-size: 1.4em; line-height: 30px; padding-bottom: 15px; font-weight: bold;}
h4, .title4, .styleTable caption {font-weight: bold; font-size: 1.2em; line-height: 24px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.3);}
.smallHeading {font-size:1.6em;}


/* BUTTONS & LINKS */
.button {background: #214686; position: relative; font: normal 1.2em/20px "Trebuchet MS"; text-align: center; padding: 14px 20px; margin: 2px 0; display: inline-block; color: #FFF; cursor: pointer; border-radius: 4px; border: none; -webkit-appearance: none;}
.button.white {background: #FFF; color: #555; text-transform: none !important;}
.button:hover {background: #EC1C23; color: #FFF; text-decoration: none !important;}
.button.disabled {color: #DDD; background: #BBB; cursor: default !important;}
.button.red {background: #EC1C23; color: #FFF; text-transform: none !important;}
.button.yellow, .button.red:hover {background: #FD0; color: #444; text-transform: uppercase;}
.button.yellow:hover {background: #FF0; color: #222; box-shadow: #FF0 0 0 10px;}
.button.yellow span {font-size: 0.8em; text-transform: none;}
.button.smaller {font-size: 1em; padding: 8px 10px;}



/* CONTAINERS */
.outer, footer {position: relative; width: 100%;}
#content, .inner {position: relative; max-width: 1200px; margin: auto;}
#jsVar {position: fixed; bottom: 0; left: 0; padding: 5px; color: #FFF; float: left; background: rgba(0,0,0,0.6); font: 10px/14px arial; z-index: 9999;}
.col-6 {width: 48%; margin: 10px 1%;}
.col-4 {width: 31.3%; margin: 10px 1%;}



/* FLEXBOX */
.fx, .fx-md, .fx-sm, .fx-xs {display: table; display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap;}
.fxStretch {-webkit-align-items: stretch; align-items: stretch;}
.fxCentreH {-webkit-justify-content: center; justify-content: center;}
.fxCentreV {-webkit-align-items: center; align-items: center;}
.fxBetween {-webkit-justify-content: space-between; justify-content: space-between;}
.fxColumn {-webkit-flex-direction:column; flex-direction: column;}
.fx1, .fx1-md, .fx1-sm, .fx1-xs {flex: 1;}
.fx2, .fx2-md, .fx2-sm, .fx2-xs {flex: 2;}



/* HEADER & FOOTER */
header {background: #FFF; position: relative; padding: 0 15px; z-index: 99;}
header .inner {position:relative; width:100%; max-width: 1170px;}
header #logo img {width: 260px; max-width: 100%; padding: 15px;}
nav > ul, nav > ul li {position: relative; list-style-type: none; height: 100%; vertical-align: middle;}
nav > ul li a, nav > ul li > span {display: inline-block; padding: 0 12px; line-height: 20px; font: bold 0.9em/75px "Trebuchet MS", sans-serif; color: #555; vertical-align: middle;}
nav > ul li a:after, nav > ul li > span:after {content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
nav > ul li:hover {background: #214686;}
nav > ul li:hover > a, nav > ul li:hover > a:after, nav > ul li:hover > span, nav > ul li:hover > span:after {color: #FFF;}
nav .expander {display: none; text-align: center;}
.sub li {height: auto;}
.sub li a {padding: 10px 20px; font: 0.9em/20px "Trebuchet MS"; color: #FFF; letter-spacing: 0;}
.sub li a:hover {text-decoration: underline;}
.sub > a:after, .sub > span:after {content: '\25BE'; font-weight: bold; position: absolute; right: 48%; top: 0; text-align: center; height: 100%; line-height: 110px; font-size: 1.2em; color: #214686;}
.sub:hover .subWide {visibility: visible; opacity: 1;}
.subWide {left: 0; width: 220px; padding: 20px; position: absolute; background: #214686; visibility: hidden; opacity: 0; border-radius: 0 0 6px 6px;  box-shadow: rgba(0,0,0,0.1) 0 5px 10px; z-index:3;}
.subWide.multi {left: -421px; width: 890px;box-sizing:content-box;}
.navOpen {display: none;}
li.subTitle {margin-right: 10px; padding: 0 0 10px 0 !important; border-bottom: 4px solid #ffffff;}
li.subTitle img {height: 40px;}
li.subTitle > img {padding: 0px}
li.subTitle.lotto {border-bottom: 4px solid #15294c;}
li.subTitle.powerball {border-bottom: 4px solid #db1735;}
li.subTitle.mega-millions {border-bottom: 4px solid #0f4f9f;}
li.subTitle.win-4 {border-bottom: 4px solid #7e0c6e;}
li.subTitle.pick-10 {border-bottom: 4px solid #4f41a5;}
li.subTitle.numbers {border-bottom: 4px solid #0060A9;}
li.subTitle.quick-draw {border-bottom: 4px solid #A200FF;}
li.subTitle.cash4life {border-bottom: 4px solid #5D840A;}
li.subTitle.millionaire-for-life {border-bottom: 4px solid #005030;}
li.subTitle.take-5 {border-bottom: 4px solid #01928f;}
.fullWidthMenuHeading {flex-basis:100%; color:#fff; margin:15px 10px 15px 10px; border-bottom:4px solid #a00300; font-size:1.3em; padding-bottom:10px; line-height:30px; text-transform:uppercase;}


.headMsg {position: relative; background: #333; color: #FFF; padding: 10px 30px 10px 10px; font-size: 14px; text-align: center;}
.headMsg a {color: #FFF; text-decoration: underline;}
.headMsg .closer {position: absolute; top: 50%; right: 10px; line-height: 30px; transform: translate(0,-15px); font-size: 24px; cursor: pointer;}
header .disc-2 {width:240px; font-size:10px; margin:-20px 15px 10px 20px; font-style:italic; text-align:center}
header .disc {position: absolute; left:50%; transform:translateX(-50%); display:inline-block; background:#f4f4f4; padding:2px 15px; border-radius:0 0 25px 25px; font-size:12px;}

.firstRow {display:flex; align-items: center;}

.secondRow .subMenu .-lotto {background:#15294c!important;}
.secondRow .subMenu .-win4 {background:#7e0c6e!important;}
.secondRow .subMenu .-numbers {background:#0060A9!important;}
.secondRow .subMenu .-take5 {background:#01928f!important;}
.secondRow .subMenu .-megamillions {background:#0f4f9f!important;}
.secondRow .subMenu .-powerball {background:#db1735!important;}
.secondRow .subMenu .-quickdraw {background:#A200FF!important;}
.secondRow .subMenu .-pick10 {background:#4f41a5!important;}
.secondRow .subMenu .-cash4life {background:#5D840A!important;}
.secondRow .subMenu .-millionaire-for-life {background:#005030!important;}

.langNav {background: #3868BB;  position: absolute; cursor: pointer; top: 0; right: 28px; color: #fff; height: 31px; min-width: 80px;  border-radius: 0 0 8px 8px; z-index: 99;}
.langNav:after {content: '\25BE'; width: 14px; height: 7px;position: absolute;top: 5px;right: 8px; color: #FFF;}
.langNav:hover:after {background-position: 0 -13px;}
.langNav ul {list-style-type: none;}
.langNav li {position: relative;padding: 0 30px 0 10px; font-size: 0.8em; line-height: 32px; text-align: right; color: #FFF;}
.langNav li:hover {color: 000;}
.langNav li .dropdown {
	display: block; width: 100%; height: auto; position: absolute; left: 0; top: 40px; opacity: 0; visibility: hidden;transition: all 0.25s ease 0.1s;
	top: -20px; background: #fff; transition: all 0.25s ease 0.1s; border-radius: 5px; box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.2);
}
.langNav li .dropdown li {line-height: 28px; text-align: left; padding: 5px 15px 5px 15px;}
.langNav li .dropdown li:last-child {border-bottom: none;}
.langNav li .dropdown li.grey {opacity: 0.2; color: #333; cursor: auto; font-weight: normal; font-size: 1em;}
.langNav li .dropdown:before {content: "";width: 0;height: 0;border-style: solid;border-width: 0 10px 10px 10px;border-color: transparent transparent #fff;position: absolute;top: -10px;left: 40px;}
.langNav li .dropdown a {padding: 0 15px 0 0; position: relative; color: #333; font-weight: normal; font-size: 1.2em; width: 100%; display: block;}
.langNav:hover .dropdown {opacity: 1;visibility: visible;transition: all 0.25s ease 0.1s;top: -10px;}
.langNav:hover .dropdown {top: 50px;transition: all 0.25s ease 0.1s;}
.langNav > ul {float: none;height: 20px;min-width: 80px;text-align: left;}

#searchForm {position: absolute; right: 20px; top: 37px; display: inline-block;}
#addsearch {position: relative; width: 100px; height: 34px; border-radius: 30px; padding: 2px 8px; color: #444; font-size: 14px; box-shadow: inset rgba(0,0,0,0.05) 0 0 3px; z-index: 1;}
#addsearch:focus, #sa:focus ~ #addsearch, #addsearch.active {width: 200px;}
#sa {background: url(/images/icons/search.svg) transparent no-repeat; background-size: 100% 100%; position: absolute; right: 2px; top: 2px; width: 30px; height: 30px; border: none; -webkit-appearance: none; cursor: pointer; z-index: 2; outline: none;}

footer {background: #333; position: relative; color: #FFF; text-align: center; padding: 10px 20px 20px; clear: both; font-size: 15px; margin-top: 50px;}
footer:before {position: absolute; content: ''; background: url(/images/layout/footer-bg.svg) transparent top no-repeat; background-size: cover; width: 100%; height: 50px; top: -49px; left: 0;}
footer img.logo {position: relative; max-width: 160px; padding: 10px 5px;}
footer p {font-size: 0.8em; max-width: 960px; margin: auto; color: #999; padding-bottom: 10px;}
footer p.copyright {font-size: 0.9em; padding: 10px 0;}
footer ul {display: inline-block; padding: 10px;}
footer ul li {display: inline-block; padding: 2px;}
footer .links {padding-bottom: 20px;}
footer .links li {padding: 0 10px; border-right: 1px solid #777;}
footer .links li:last-child {border: none;}
footer .links a {color: #FFF; font-family: "Trebuchet MS"; font-size: 0.8em;}
footer .links a:hover {text-decoration: underline;}



/* GENERAL CONTENT */
#content {padding: 20px;}
#content p {font: 1em/26px "Trebuchet MS"; padding: 10px 0;}
#content p.reducto {font: 0.9em/22px "Trebuchet MS";}
#content p.chino {font: 1.1em/24px "Trebuchet MS";}
#content a:hover {text-decoration: underline;}
#content hr {background: none; border: none; border-top: 1px solid #DDD;}
#content img {max-width: 100%;}
#content h2, #content .title, #content h3, #content .subTitle, #content h4 {padding-top: 30px;}
#content ul, #content ol {list-style-type: none; margin: 0 0 20px; padding: 0;}
#content ul li, #content ol li {position: relative; margin: 4px 0;}
.page {position: relative; background: #FFF; padding: 40px; border-radius: 0 0 10px 10px; box-shadow: rgba(0,0,0,0.1) 0 10px 20px;}
.page h2 {border-bottom: 1px solid #DDD;}

.box {background: #FFF; position: relative; border: 1px solid #DDD; box-shadow: rgba(0,0,0,0.08) 0 0 10px; border-radius: 10px; overflow: hidden;}
.box .lotteryLogo {height: 40px; padding: 10px;}
.box .date {padding-bottom: 10px;}
.box .titleBG {background: #F3F3F3; position: relative; padding: 10px 20px 0; margin-bottom: -20px; z-index: 5;}
.box .titleBG:after {content: ''; position: absolute; width: 100%; height: 50px; bottom: -26px; left: 0; background: url(/images/layout/title-bg.svg) bottom no-repeat; background-size: 100%; z-index: -1;}
.box .titleBG h2 {padding: 0 !important; margin-bottom: 20px;}
.box.colour, .box .head, .playBox {background-color: #214686; position: relative; color: #FFF; margin-bottom: 20px;}
.box.red, .box .head.red, .playBox.uk-lotto {background-color: #EC1C23 !important;}
.box.dark-blue, .box .head.dark-blue, .playBox.lotto, .styleTable.lotto thead th {background-color: #15294c !important;}
.box.darkRed, .box .head.darkRed, .playBox.canada-649 {background-color: #A00300 !important;}
.box.powerball-red, .box .head.powerball-red, .playBox.powerball, .styleTable.powerball thead th {background-color: #db1735 !important;}
.box.dark-purple, .box .head.dark-purple, .playBox.win-4, .styleTable.win-4 thead th {background-color: #7e0c6e !important;}
.box.pick-10-purple, .box .head.pick-10-purple, .playBox.pick-10, .styleTable.pick-10 thead th {background-color: #4f41a5 !important;}
.box.light-green, .box .head.light-green, .playBox.irish-lotto {background-color: #8DC63F !important;}
.box.numbers-blue, .box .head.numbers-blue, .playBox.numbers, .styleTable.numbers thead th {background-color: #0060A9 !important;}
.box.purple, .box .head.purple, .playBox.quick-draw, .styleTable.quick-draw thead th {background-color: #A200FF !important;}
.box.green, .box .head.green, .playBox.cash4life, .styleTable.cash4life thead th, .playBox.superenalotto {background-color: #5D840A !important;}
.box.dark-green, .box .head.dark-green, .playBox.millionaire-for-life, .styleTable.millionaire-for-life thead th {background-color: #005030 !important;}
.box.teal, .box .head.teal, .playBox.take-5, .styleTable.take-5 thead th {background-color: #01928f !important;}
.box.blue, .box .head.blue, .playBox.mega-millions, .styleTable.mega-millions thead th {background-color: #0f4f9f !important;}
.box .head h2, .box .head h3, .box .head .subTitle {margin-top: 0; padding: 10px !important; display: inline-block;}
.box .head a {color: #FFF;}
.boxLogo {display: block; margin: auto; height: 80px;}
.jackpot {font-size: 2.5em; letter-spacing: -2px;}
.jackpotArea hr {width: 60%;}
.timer {font-size: 0.8em; line-height: 24px;}
.counter {font-size: 1.6em; color: #EC1C23; line-height: 44px; display: inline-block;}
a.more {display: none;}
.iPhones {width: 160px;}
.info {border: 3px solid #214686; border-radius: 12px; padding: 20px; margin: 5px 0; color: #333; font-weight: 700; font-size: 1em; line-height: 20px;}

.playBox {background-image: url(/images/layout/flag-hand.png); background-position: left; background-repeat: no-repeat; background-size: auto 100%; border-radius: 10px; box-shadow: inset rgba(0,0,0,0.3) 0 0 60px; margin: 10px 0;}
.playBox.other {background-image: url(/images/layout/balls.png);}
.playBox img {min-width: 230px;}
.playBox > div:nth-child(2) {padding: 20px 0;}
.playBox .playTimer {max-width: 205px; padding: 0 10px;}
.playBox .playTimer > div[id] {min-height: 86px;}
.jackpotBox {font: 700 2.5em/40px "Trebuchet MS", sans-serif; padding: 5px; color: #FD0;}
.jackpotValue {font-size: 1.2em; font-family: "Trebuchet MS";}

.jackpotComBox {margin:80px auto 40px auto; width:50%; position:relative; font-family:Roboto,Arial,sans-serif; overflow:visible;}
.jackpotComBoxInner {overflow: hidden;border-radius: 20px;background: #fff;padding: 18px 25px;position: relative;z-index: 2;border:solid 3px #7e0c6e; box-shadow:rgba(0,0,0, 0.3) 0px 5px 15px; }
.officialPartnerSection {position: absolute;top: 0;left: 20px;background: #7e0c6e;padding: 10px 10px 8px;border-radius: 12px 12px 0 0;z-index: 1;opacity: 0;transform: translateY(20px);animation: badgePop 0.6s ease-out forwards;animation-delay:2.5s;}
@keyframes badgePop {0% {opacity: 1;transform: translateY(20px);}100% {opacity: 1;transform: translateY(-41px);}}
.jackpotComBox .officialPartnerSection img {height:24px;}
.jackpotComBoxTitle {color:#7E0C6E; font-size:26px; font-weight:700; letter-spacing:-.4px;}
.jackpotComBoxDrawDetails {display:flex; justify-content:space-between; font-size:14px; margin-top:2px;}
.jackpotComBoxTimer {color:#555; display:flex; gap:3px; margin:0px!important}
.jackpotComBoxTimer li {margin:0!important;}
.jackpotComBoxDrawCountdown {display:flex; gap:5px;}
.jackpotComBoxJackpot {font-weight:700; color:#000; font-size:32px;margin-top:10px;}
.jackpotComBoxLink1 {background:#7e0c6e; border:solid 2px #7e0c6e; color:#fff; font-weight:700; font-size:17px; border-radius:7px; text-align:center; padding:8px 17px; display:block; margin-right:8px; margin-bottom:0!important; transition:.2s all ease;}
.jackpotComBoxLink2 {background:#fff; border:solid 2px #7e0c6e; color:#7e0c6e; font-weight:700; font-size:17px; border-radius:7px; text-align:center; padding:8px 17px; display:block; margin-bottom:0!important; transition:.2s all ease;}
.jackpotComBoxLink1:hover, .jackpotComBoxLink2:hover {text-decoration:none!important; transition:.2s all ease;}
.jackpotComBoxLink1:hover {background:#680b5b; color:#fff;}
.jackpotComBoxLink2:hover {color:#a40e8f; border:solid 2px #a40e8f;}
.jackpotScreen {position:absolute; height:100%; width:100%; left:0; bottom:0; display:flex; justify-content:center; animation:screenSlide 2.5s linear forwards;z-index:99;background:#7e0c6e; align-items:center; align-content:center;}
.jackpotScreen img {max-height:0; animation:jackpotLogoDazzle 2s linear forwards; animation-delay:.2s; opacity:1;overflow: hidden;}
@keyframes screenSlide {95% {height:100%} 90% {height:100%; opacity:1;}100% {height:0; opacity:1;}}
@keyframes jackpotLogoDazzle {0% {max-height:0; opacity:1; transform:translateY(0);} 10%,92% {max-height:38px; opacity:1; transform:translateY(0);} 100% {max-height:38px; transform:translateY(200px);opacity:1;}}
.jackpotBoxHelp {position: absolute;top: -31px;left: 230px;font-size: 13px;border: solid 1px #000;text-align: center;width: 19px;height: 19px;line-height: 19px;cursor: pointer;border-radius: 50px;box-shadow: 0 0 6px #7c126b;visibility: hidden;opacity: 0;animation:jackpotHelpAppear 0.2s linear forwards, jackpotHelpGlow 2.2s ease-in-out infinite; animation-delay:3.6s, 3.8s;}
@keyframes jackpotHelpAppear {95% {visibility: hidden;opacity: 0;}100% {visibility: visible;opacity: 1;}}
@keyframes jackpotHelpGlow {0% {box-shadow: 0 0 6px #000;}50% {box-shadow: 0 0 10px #ffffff;}100% {box-shadow: 0 0 6px #000;}}
.jackpotBoxHelpBox { position:absolute; top:-74px; right:-56px; line-height:25px; width:350px; padding:15px; background:#fff; z-index:99; opacity:0; border-radius:10px; visibility:hidden; transition:opacity 0.25s ease; box-shadow:rgba(0,0,0, 0.3) 0px 5px 15px; border:solid 2px #000;}
.jackpotBoxHelpBox.active { opacity:1; visibility:visible;}
.jackpotBoxHelpBox a {color:#2631e0!important;}
.jackpotBoxHelpBox a img {vertical-align:super;}
.jackpotBoxClose { position:absolute; top:5px; right:8px; cursor:pointer; font-size:18px; line-height:18px;}

.jackpotComBox.pick10Jackpot .officialPartnerSection, .jackpotComBox.pick10Jackpot .jackpotScreen {background:#4f41a5;}
.jackpotComBox.pick10Jackpot .jackpotComBoxInner {border:solid 3px #4f41a5;}
.jackpotComBox.pick10Jackpot .jackpotComBoxTitle {color:#4f41a5;}
.jackpotComBox.pick10Jackpot .jackpotComBoxLink1 {background:#4f41a5;border-color:#4f41a5;}
.jackpotComBox.pick10Jackpot .jackpotComBoxLink2 {border:solid 2px #4f41a5; color:#4f41a5}
.jackpotComBox.pick10Jackpot .jackpotComBoxLink1:hover {background:#32286d;}
.jackpotComBox.pick10Jackpot .jackpotComBoxLink2:hover {color: #32286d; border: solid 2px #32286d;}

.jackpotComBox.numbersJackpot .officialPartnerSection, .jackpotComBox.numbersJackpot .jackpotScreen {background:#0060A9;}
.jackpotComBox.numbersJackpot .jackpotComBoxInner {border:solid 3px #0060A9;}
.jackpotComBox.numbersJackpot .jackpotComBoxTitle {color:#0060A9;}
.jackpotComBox.numbersJackpot .jackpotComBoxLink1 {background:#0060A9;border-color:#0060A9;}
.jackpotComBox.numbersJackpot .jackpotComBoxLink2 {border:solid 2px #0060A9; color:#0060A9}
.jackpotComBox.numbersJackpot .jackpotComBoxLink1:hover {background:#083e6c;}
.jackpotComBox.numbersJackpot .jackpotComBoxLink2:hover {color: #083e6c; border: solid 2px #083e6c;}

.jackpotComBox.lottoJackpot .officialPartnerSection, .jackpotComBox.lottoJackpot .jackpotScreen {background:#15294c;}
.jackpotComBox.lottoJackpot .jackpotComBoxInner {border:solid 3px #15294c;}
.jackpotComBox.lottoJackpot .jackpotComBoxTitle {color:#15294c;}
.jackpotComBox.lottoJackpot .jackpotComBoxLink1 {background:#15294c;border-color:#15294c;}
.jackpotComBox.lottoJackpot .jackpotComBoxLink2 {border:solid 2px #15294c; color:#15294c}
.jackpotComBox.lottoJackpot .jackpotComBoxLink1:hover {background:#0e5da1;}
.jackpotComBox.lottoJackpot .jackpotComBoxLink2:hover {color: #0e5da1; border: solid 2px #0e5da1;}

.jackpotComBox.megamillionsJackpot .officialPartnerSection, .jackpotComBox.megamillionsJackpot .jackpotScreen {background:#0f4f9f;}
.jackpotComBox.megamillionsJackpot .jackpotComBoxInner {border:solid 3px #0f4f9f;}
.jackpotComBox.megamillionsJackpot .jackpotComBoxTitle {color:#0f4f9f;}
.jackpotComBox.megamillionsJackpot .jackpotComBoxLink1 {background:#0f4f9f;border-color:#0f4f9f;}
.jackpotComBox.megamillionsJackpot .jackpotComBoxLink2 {border:solid 2px #0f4f9f; color:#0f4f9f}
.jackpotComBox.megamillionsJackpot .jackpotComBoxLink1:hover {background:#073670;}
.jackpotComBox.megamillionsJackpot .jackpotComBoxLink2:hover {color: #073670; border: solid 2px #073670;}

.jackpotComBox.powerballJackpot .officialPartnerSection, .jackpotComBox.powerballJackpot .jackpotScreen {background:#db1735;}
.jackpotComBox.powerballJackpot .jackpotComBoxInner {border:solid 3px #db1735;}
.jackpotComBox.powerballJackpot .jackpotComBoxTitle {color:#db1735;}
.jackpotComBox.powerballJackpot .jackpotComBoxLink1 {background:#db1735;border-color:#db1735;}
.jackpotComBox.powerballJackpot .jackpotComBoxLink2 {border:solid 2px #db1735; color:#db1735}
.jackpotComBox.powerballJackpot .jackpotComBoxLink1:hover {background:#9c071e;}
.jackpotComBox.powerballJackpot .jackpotComBoxLink2:hover {color: #9c071e; border: solid 2px #9c071e;}

.jackpotComBox.millionaireforlifeJackpot .officialPartnerSection, .jackpotComBox.millionaireforlifeJackpot .jackpotScreen {background:#084f31;}
.jackpotComBox.millionaireforlifeJackpot .jackpotComBoxInner {border:solid 3px #084f31;}
.jackpotComBox.millionaireforlifeJackpot .jackpotComBoxTitle {color:#084f31;}
.jackpotComBox.millionaireforlifeJackpot .jackpotComBoxLink1 {background:#084f31;border-color:#084f31;}
.jackpotComBox.millionaireforlifeJackpot .jackpotComBoxLink2 {border:solid 2px #084f31; color:#084f31}
.jackpotComBox.millionaireforlifeJackpot .jackpotComBoxLink1:hover {background:#215810;}
.jackpotComBox.millionaireforlifeJackpot .jackpotComBoxLink2:hover {color: #215810; border: solid 2px #215810;}

.jackpotWidgetContainer {display:flex; flex-wrap:wrap;column-gap:30px; row-gap:20px; margin:30px 0; justify-content:center;}
.jackpotWidgetContainer .jackpotComBox {margin:30px 0; width:unset; flex-basis:47%; flex-grow:1; max-width:525px;}

#breadcrumbs {
	background: #214686;
	background: -moz-linear-gradient(left, #214686 0%, #333 100%);
	background: -webkit-linear-gradient(left, #214686 0%,#333 100%);
	background: linear-gradient(to right, #214686 0%,#333 100%); 
	font-size: 0.8em; padding: 6px 10px !important; margin-bottom: 0 !important; border-radius: 10px 10px 0 0; line-height: 16px; color: #BBB; border-bottom: 3px solid #CCC;
}
#breadcrumbs li {position: relative; display: inline-block; padding-right: 20px; margin: 2px 0 !important; line-height: 20px;}
#breadcrumbs li a {color: #FFF;}
#breadcrumbs li:first-child span {display: none;}
#breadcrumbs li:first-child a {padding-right: 20px;}
#breadcrumbs li:first-child a:before {content: ''; background: url(/images/icons/liberty-white.svg) transparent no-repeat; position: absolute; background-size: 100% 100%; left: -8px; bottom: -7px; width: 36px; height: 36px; display: block;}
#breadcrumbs li:after {content: '\25B8'; position: absolute; top: 0; right: 5px; color: #FFF; width: 8px; height: 16px; text-indent: 0;}
#breadcrumbs li:last-child {padding: 0;}
#breadcrumbs li:last-child:after {display: none;}

.styleTable {width: 100%; border-collapse: seperate; border-spacing: 0; margin: 10px auto; border-radius: 10px;}
.styleTable thead tr, .styleTable tfoot tr {background: none !important;}
.styleTable thead th {background: #214686 !important;}
.styleTable thead tr:first-child th:first-child {border-top-left-radius: 9px;}
.styleTable thead tr:first-child th:last-child {border-top-right-radius: 9px;}
.styleTable tbody td {background: rgba(0,0,0,0.05);}
.styleTable tfoot td {background: #999 !important; color: #FFF;}
.styleTable tfoot td:first-child, .styleTable tbody:last-child tr:last-child td:first-child {border-bottom-left-radius: 9px;}
.styleTable tfoot td:last-child, .styleTable tbody:last-child tr:last-child td:last-child {border-bottom-right-radius: 9px;}
.styleTable td, .sparseTable td {padding: 8px; font-size: 0.8em; line-height: 18px;}
.styleTable th, .sparseTable th {font: 1em/18px "Trebuchet MS", sans-serif; padding: 12px 8px; font-weight: normal; color: #FFF; text-align: left;}
.styleTable tr:nth-child(odd) td {background: rgba(0,0,0,0.1);}
.styleTable.noAlt tbody td {background: rgba(0,0,0,0.05) !important;}
.styleTable .lotteryLogo {height: 40px;}
tr.dateRow th {background: #2B60BD !important; color: #FFF; font: 0.9em/16px "Trebuchet MS" !important; padding: 8px;}
.styleTable.fixied td, .styleTable.fixied th {width: 100px; text-align: center !important;}
.page.statistics .styleTable th {text-align: center;}

th.icon {cursor: pointer;position: relative;}
.table-sort th, .table-sort .small th {	text-align: left;	padding: 8px 25px 8px 15px;	font-size: .85em;}
th.icon:before, th.icon:after {	border-style: solid;	border-width: 2px 2px 0 0;	border-color: #fff;	height: 8px;	width: 8px;	right: 10px;	opacity: .3;	position: absolute;	content: "";}
th.icon:before {	-webkit-transform: rotate(-45deg);	-ms-transform: rotate(-45deg);	transform: rotate(-45deg);	top: 38%;}
th.icon:after {	-webkit-transform: rotate(135deg);	-ms-transform: rotate(135deg);	transform: rotate(135deg);	top: 47%;}
th.icon.ascending:after, th.icon.descending:before {	opacity: 1;}

#locationsTable > tbody > tr.county > td {cursor: pointer;}
#locationsTable > tbody > tr.alt > td {background: rgba(0,0,0,.05) !important;}
#locationsTable tr.breakdown {display: none;}
#locationsTable tr.dateRow td a {color: #FFF;}
#locationsTable tr.dateRow + tr.breakdown {display: table-row;}
#locationsTable > tbody > tr.county.dateRow > td {color: #FFF; background: #2b60bd !important;}
#locationsTable table tr td {background: #FFF; border-bottom: 1px solid #DDD; font-size: 1em;}

ul.bullet, ol.bullet {background: #F3F3F3; border-radius: 10px; padding: 20px 20px 20px 10px !important;}
ul.bullet.noBG, ol.bullet.noBG {background: none;}
ul.bullet li, ol.bullet li {padding: 4px 0 4px 50px; line-height: 24px;}
ul.bullet li:before, ol.bullet li:before {content: ''; background: url(/images/layout/usao.svg) transparent no-repeat; background-size: 100% 100%; position: absolute; display: block; width: 20px; height: 20px; left: 20px; top: 5px;}
ul.bullet li.noDot:before, ol.bullet li.noDot:before {display: none;}

.steps li {background: #214686; color: #FFF; flex: 20%; margin: 3px !important; padding: 15px; text-align: center; overflow: hidden; box-sizing: border-box; border-radius: 20px;}
.steps li:before {content: '1'; background: #EC1C23; position: absolute; border-radius: 50%; width: 100px; height: 100px; left: -40px; top: -40px; display: block; box-sizing: border-box; padding: 50px 0 0 30px; font-size: 1.8em;}
.steps li:nth-child(2):before {content: '2'}
.steps li:nth-child(3):before {content: '3'}
.steps li:nth-child(4):before {content: '4'}
.steps li:nth-child(5):before {content: '5'}
.steps li:nth-child(6):before {content: '6'}
.steps img:first-child {width: 100px; border-radius: 50%; margin: auto; display: block;}

.faq .answer {background: #DFDFDF; max-height: 0; padding: 0 20px !important; box-sizing: border-box; font-size: 1em; overflow: hidden;}
.faq .title4 {position: relative; padding: 10px 10px 10px 15px; background: #F3F3F3; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD; cursor: pointer; color: #EC1C23; font-weight: normal; font-size: 1.1em;}
.faq .title4.open {background: #214686; color: #FFF;}
.faq .title4.open a {color: #FFF;}
.faq .title4.open ~ .answer {max-height: 1000px; padding: 20px !important;}
.faq:first-child .title4 {border-radius: 10px 10px 0 0;}
.faq:last-child .title4, .faq:last-child .answer {border-radius: 0 0 10px 10px;}
.faq:last-child .title4.open {border-radius: 0;}

.alert {background: #FBECEB; border: 3px solid #C50B07; color: #C50B07; padding: 20px; border-radius: 10px; line-height: 30px;}
.alert:before {content: ''; background: url(/images/icons/alert.svg) transparent no-repeat; background-size: 100% 100%; position: relative; width: 34px; height: 30px; display: inline-block; vertical-align: middle;}
.blockQuote {box-shadow: inset #EEE 0 0 20px; border: 1px solid #DDD; padding: 30px; font-size: 1.5em; line-height: 30px; font-style: italic; border-radius: 10px; margin: 10px 0;}

.noticeBox {background: #2a6f1a; color: #fff; padding: 20px; margin:20px 0; border-radius: 10px; line-height: 30px; border-left:solid 10px #00b700}
.noticeBox a {color:#fd0;}

.howToSection {background: linear-gradient(301deg,rgba(56, 107, 194, 1) 0%, rgba(33, 70, 134, 1) 68%); color:#fff; padding:30px; border-radius:20px; margin:30px 0;}
#content .howToSection h2 {color:#fff; padding-top:10px; padding-bottom:30px; border:none;}
.htList li {padding:18px 40px 18px 70px;line-height:24px; position:relative; text-shadow:0 1px 4px #00000066; opacity:0; animation:slowAppear .6s ease-in-out forwards;}
.htList li a {color:#fd0;}
.htList li:nth-child(2) {animation-delay:.2s;}
.htList li:nth-child(3) {animation-delay:.4s;}
.htList li:nth-child(4) {animation-delay:.6s;}
.htList li:nth-child(5) {animation-delay:.8s;}
.htList li:nth-child(6) {animation-delay:1s;}
.htList li:nth-child(7) {animation-delay:1.2s;}
.htList li:nth-child(8) {animation-delay:1.4s;}
.htList li:nth-child(9) {animation-delay:1.6s;}
.htList li div {position:absolute; left:10px; top:50%; transform:translateY(-50%); color:#fff; font-weight:700; font-size:34px;}
.htList li:before {content: ""; position: absolute; width: 0; height: 0; top: 50%; left: 34px; border-style: solid; border-width: 0 0 12px 12px; border-color: transparent transparent #fff transparent;transform:translateY(-50%) rotate(-45deg) scale(.8);}
@keyframes slowAppear {50% {transform:scale(1.02)} 100% {opacity:1; transform:scale(1);}}
.howToSection h2 img {margin-right:5px; opacity:0; animation:iconAppear .5s ease-in-out forwards; animation-delay:.3s;}
@keyframes iconAppear {40% {opacity:1; transform:scale(1.2)} 60% {opacity:1; transform:scale(1)} 80% {opacity:1; transform:scale(1.05)} 100% {opacity:1; transform:scale(1)}}


/* RESULTS */
.prizeImg {height: 20px;}
.resultBall {position: relative; border: 3px solid #555; border-radius: 50%; width: 50px; height: 50px; margin: 3px 3px 10px; text-align: center; font-size: 24px; display: inline-block; line-height: 50px;}
.resultBall.small {width: 30px !important; height: 30px !important; font: 18px/30px "Trebuchet MS" !important; margin: 0 0 10px !important; border-width: 2px !important;}
.bonus-ball {background-color: #15294c; border-color: #15294c; color: #FFF;}
.bonus-ball:after, .lucky-sum:after, .resultBall.powerball:after, .resultBall.mega-ball:after, .resultBall.cash-ball:after, .resultBall.millionaire-ball:after {content: 'Bonus Ball'; position: absolute; bottom: -18px; color: #555; text-align: center; width: 120%; left: -10%; font: normal 0.5em/16px "Trebuchet MS";}
.lucky-sum:after {content: 'Lucky Sum';}
.resultBall.powerball:after {content: 'Powerball';}
.resultBall.mega-ball:after {content: 'Mega Ball';}
.resultBall.cash-ball:after {content: 'Cash Ball';}
.resultBall.millionaire-ball:after {content: 'Millionaire';}
.resultBall.noText:after {display: none;}
.lucky-sum.yellow {background-color: #FFB400; border-color: #FFB400; color: #FFF;}
.lucky-sum.green {background-color: #8DC63F; border-color: #8DC63F; color: #FFF;}
.resultBall.powerball {background-color: #db1735; border-color: #db1735; color: #FFF;}
.resultBall.smallBall {width:34px; height:34px; line-height:34px; font-size:18px;}
.mega-ball {background-color: #0f4f9f; border-color: #0f4f9f; color: #FFF;}
.power-play, .megaplier {text-transform: uppercase; font-size: 0.8em; vertical-align: baseline;}
.power-play strong, .megaplier strong {color: #A00300; font-size: 1.4em; vertical-align: baseline;}
.megaplier strong {color: #214686;}
.cash-ball {background-color: #5D840A; border-color: #5D840A; color: #FFF;}
.millionaire-ball {background-color: #005030; border-color: #005030; color: #FFF;}
.result {background: #F3F3F3;}
.result .date {background: #214686; padding: 5px 10px; vertical-align: middle; color: #FFF;}
.result .date * {vertical-align: middle;}
.result .date:before {content: ''; background: url(/images/icons/calendar.svg) transparent no-repeat; background-size: 100% 100%; position: relative; width: 30px; height: 30px; display: inline-block; vertical-align: middle; margin-right: 10px;}
.result .balls {padding: 20px 5px;}
.result .rollover {background: #EC1C23; position: absolute; border-radius: 50%; color: #FFF; width: 100px; height: 100px; right: -40px; top: -40px; display: block; box-sizing: border-box; padding: 50px 0 0 0; font-size: 0.9em; line-height: 10px; transform: rotate(45deg);}
.result .rollover span {font: bold 1.4em "Trebuchet MS"; vertical-align: baseline;}
.result .bottomArea {background: #FFF; color: #555; font-size: 0.9em;}
.result .bottomArea > div {border-right: 2px solid #F3F3F3; box-sizing: border-box; padding: 10px;}
.result .bottomArea > div:last-child {border: none;}
.result .bottomArea img {width: 50px; height: 50px;}
.result .bottomArea span {display: block; font-size: 1.7em; font-weight: bold;}
.extra {font: bold 1.2em/20px "Trebuchet MS"; color: #A200FF;}
.rolloverText {color: #F00; font-size: 11px;}

.date-range-section {text-align:center; width:550px; margin:20px auto;}
.date-range-section h3 {font-weight:bold; font-size:1.2em; line-height:24px; padding:10px 20px; border-bottom:none; margin:0 auto; padding-top:10px!important; background:#214686; color:#fff; border-radius:18px 18px 0 0;}
.filter-results-container {justify-content:center; padding:10px 20px; background:#2B60BD; margin:0 auto; border-radius:0 0 18px 18px; color:#fff;}
.filter-results-container, .filter-results-container-dates, .filter-results-container-box {display:flex; align-items:center;}
.filter-results-container-dates, .filter-results-container-box {gap:8px;}
.filter-results-container-box input {height:25px; border-radius:50px; border:solid 1px #939393; padding:5px 10px;}
input.filter-results-container-box:disabled {background:rgba(239, 239, 239, 0.3); color:rgba(16, 16, 16, 0.3); cursor:auto;}
input.filter-results-container-box {margin-left:15px!important; border-radius:50px; padding:10px 18px; font-family:"Trebuchet MS", sans-serif; border:none; background:#fd0; cursor:pointer;}

ul.balls {display:flex; gap:10px; justify-content:center;}

/* CHECKER */
.checkerNumber {color: #333; border: 3px solid #333; display: inline-block; border-radius: 8px; width: 60px; height: 60px; font: 2em/60px "Trebuchet MS"; text-align: center; margin: 5px; cursor: pointer;}
.checkerNumber:hover {background: #FFF; color: #214686; border-color: #214686;}
.checkerNumber.disabled {color: #BBB !important; border-color: #BBB !important;}
.checkerNumber.selected {background: #EC1C23; color: #FFF; border-color: #EC1C23;}
.checker.resultBall:before {content: '\2713'; background: #68B727; position: absolute; bottom: -5px; right: -10px; color: #FFF; border-radius: 20px; width: 24px; height: 24px; font: normal 0.8em/24px "Trebuchet MS"; display: block;}
.checker.resultBall.greyed {border-color: #CCC; color: #CCC;}
.checker.resultBall.greyed.bonus-ball, .checker.resultBall.greyed.powerball, .checker.resultBall.greyed.mega-ball, .checker.resultBall.greyed.cash-ball, .checker.resultBall.greyed.lucky-sum, .checker.resultBall.greyed.millionaire-ball {background: #CCC; color: #EEE;}
.checker.resultBall.greyed:before {display: none;}
.won {background: #E59191; box-shadow: inset #961919 0 0 20px; color: #FFF;}
.won .checker.resultBall.ball {border-color: #FFF;}
.won .checker.resultBall.greyed {opacity: 0.3;}
.won .checker.resultBall:after {color: #FFF;}
.won a {color: #FFF;}
#onoffswitch {display: none;}
.onoffswitch {background: #FFF; border-radius: 30px; width: 70px; height: 40px; border: 2px solid #CCC; position: relative; display: inline-block; cursor: pointer;}
.onoffswitch:before {content: ''; position: absolute; top: -2px; left: -2px; width: 44px; height: 44px; box-sizing: border-box; background: #FFF; border-radius: 30px; border: 2px solid #CCC;}
.onoffswitch.on {background: #EC1C23; border-color: #EC1C23;}
.onoffswitch.on:before {left: 28px; border-color: #EC1C23;}
.switch select[name="Multiplier"] {width: 150px;border: 11px solid #e63132;background: #e9282b;color: #fff;border-radius: 20px;margin: 0 0 10px;}

/* GENERATORS */
.generatorContainer {display:flex; flex-direction:column; width:fit-content; margin:0 auto; background:linear-gradient(0deg,rgba(255, 255, 255, 1) 30%, rgba(222, 222, 222, 1) 100%); padding:26px; border-radius:12px; overflow:hidden; margin:30px auto 20px auto;}
.generatorContainer ul, .generateMore ul {flex-wrap:wrap;}
.generateButton {cursor:pointer; display:block; margin:0 auto; background:#214686; width:auto; text-align:center; color:#fff; margin-left:-26px; margin-right:-26px; margin-bottom:-26px; padding:12px 0; font-weight:700;}
.generateMore {text-align:center;}
.generateMoreSelection {justify-content:center;}
.generateLink {display:block; width:fit-content; margin:0 auto; border-radius:50px; background:#214686; color:#fff; padding:12px 24px;}
#content a.generateLink:hover {background:#112f63; color:#fff; text-decoration:none;}

/*SCRATCHCARDS*/
.games-box {display: grid;grid-template-columns: 1fr 1fr;gap: 30px;justify-content: center;}
.game-box {	margin: 0;	min-height: 420px;}
.game-box .inner-box {	height: 100%;position: relative;display: flex;flex-direction: column;align-items: center;flex-grow: 1;}
.game-box .front {width: 100%;height: 100%;	display: flex;align-items: center;justify-content: space-between;flex-direction: column;padding: 10px;border-radius: 0px;border: 1px solid #373543;overflow: hidden;position: relative;}
.game-box .top {display: flex;flex-direction: column;align-items: center;justify-content: center;}
.game-box .img-box, .featured .img-box {margin-bottom: 25px;width: 286px;max-height: 428px;	display: flex;	align-items: baseline;	justify-content: flex-start;text-align: center;	flex-direction: column;	overflow: hidden;position: relative;}
.game-box .button{	margin: 10px 0 0;display: inline-block;float: none;line-height: 21px;padding: 10px;}

.no-display { display: none;}
.dropdown {
	display: inline-block; background: #F0F0F0; border: 1px solid #DDD; padding: 4px 10px; border-radius: 30px; position:relative;
	cursor: pointer; white-space: nowrap; min-width: 140px; user-select: none; text-align: left; z-index:9
}
.dropdown > span {display: block; font-weight: 700; z-index: 6; width: 100%; padding-right: 30px; line-height: 22px; margin: 0;}
.dropdown > span > *, .dropdown img {vertical-align: middle;}
.dropdown > span > img {left: -4px; margin-right: 0;}
.dropdown img {margin-right: 5px; display: inline-block;}
.dropdown > span > sup {top: -5px;}
.dropdown > span:after {content: ""; background-image: url(/images/layout/chevron-black.svg); position: absolute; right: 15px; top: 8px; height: 12px; width:12px; background-size:12px 12px;}
.dropdown ul {
	background: #F0F0F0; border: 1px solid #DDD; border-top: 0; border-bottom: 0; position: absolute; top: 18px; left: -1px; width: calc(100% + 2px); z-index: 3;
	list-style-type: none; margin: 0; padding: 0; max-height: 500px; opacity:0; overflow: hidden; transition: .2s all ease; border-radius: 0 0 20px 20px;
}
.dropdown ul li:first-child {margin-top: 12px;}
.dropdown ul li:last-child {margin-bottom: 6px;}
.dropdown ul li {display: block;}
.dropdown ul li > * {display: block; color: #333; text-decoration: none; padding: 8px 10px; font-size: 0.9em;}
.dropdown ul li > *:hover {background: #0042B0; color: #FFF;}
.dropdown.active {z-index: 9;}
.dropdown.active ul {max-height: 500px;  opacity:1; border-bottom: 1px solid #DDD; box-shadow: rgba(0,0,0,0.2) 0 10px 10px; overflow: auto; padding: 5px 0; z-index:-1;}

#searchAllDraws {display:flex;width:100%;margin:10px 0 0;align-items:center;justify-content:center;background:#234682;color:#fff;text-transform:uppercase;padding:15px 0;letter-spacing: 1px;border-radius:10px;position:relative;box-shadow:0 6px 0 #23468263;font-weight:700;font-size:18px;}
#searchAllDraws:after {content:"";width:16px;height:16px;clip-path: polygon(50% 30%, 50% 0, 100% 50%, 50% 100%, 50% 70%, 0% 70%, 0 30%);background:#fff;display:block;margin-left:10px;}


/*NEW LANDING PAGES FOR EACH LOTTERY - 21/10/2025 */
.downloadOurApp{position:relative;display:block}
.downloadOurApp .myButtonRow{position:absolute;bottom:70px;left:110px;width:300px;height:50px;display:flex;justify-content:center;align-items:center}
.downloadOurApp .myButtonRow img{height:100%;margin:0 10px}
.masonLayout{display:flex;justify-content:space-between;align-items:stretch;flex-wrap:wrap;margin:30px 0 0}
.masonLayout > div{box-shadow:0 4px 12px rgba(0,0,0,0.3);width:calc(50% - 15px);border-radius:15px;margin:0 0 25px;padding:30px;box-sizing:border-box;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}
.masonLayout > div:last-child:nth-child(odd){width:100%;}
#content .masonLayout h3{padding:30px 30px 10px;background:#214686;color:#fff;margin:-40px -30px 10px}
a.myButton{text-align:right;display:block;color:#214686}
a.myButton:after{content:"";display:inline-block;width:8px;height:10px;background:#ec1c23;margin-left:15px;clip-path:polygon(0 0,0% 100%,100% 50%);transition:margin-left .3s;}
a.myButton:hover:after{margin-left:10px}
.secondRow ul li.menuLogo a, nav li.subTitle > a  {display: contents;}

@media (max-width:1200px) {
	.masonLayout > div{width:100%!important;margin:0 0 20px}
}
/*END OF NEW LANDING PAGES FOR EACH LOTTERY */



/* ######### SMALLER DESKTOPS (MD) ######### */
@media (max-width: 1199px) {
	.subWide.multi {left: -400px;}
}

/* ######### MIN SIZE DESKTOP */
@media (min-width:1024px) {
	.secondRow {background:#214686; position: absolute; left: 0; bottom: -40px; height: 40px; width: 100%; box-sizing: border-box; z-index: 2;}
	.secondRow ul {display:flex;}
	.secondRow ul li {padding:0 10px; list-style-type: none;}
	.secondRow ul li a {line-height:40px; color:#fff; font-size: 0.9em; padding: 0 10px; font-weight: 700;}
	.secondRow ul li:not(.menuLogo):hover {background:#fff;}
	.secondRow ul li:hover a {color:#214686;}
	.secondRow ul li.activeSubLink a {text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:2px;}
	.subMenuBg {background: #214686; position: absolute; left: 0; bottom: 0; width: 100%; height: 40px; z-index: 1;}
	.flexThird {flex-basis:33%;}
	.ticketsLink {width:100px; text-align:center; background:#ffd700;}
	body.mflBG {background:linear-gradient(180deg,rgba(179, 210, 79, 1) 0%, rgba(179, 210, 79, 1) 84%, rgba(8, 79, 49, 1) 84%, rgba(8, 79, 49, 1) 100%);}
	body.mflBG #content {margin-top:185px;}
	body.mflBG .mflHpBG {background:#fff; border-radius:20px;}
	#mflLeft {left: 0;width: calc((100vw - 1174px) / 2);height: calc(100% - 115px);background: #b3d24f;position: absolute;top: 115px;}
	#mflRight {right: 0;width: calc((100vw - 1174px) / 2);height: calc(100% - 115px);background: #b3d24f;position: absolute;top: 115px;}
	#mflTop {left:50%; transform:translateX(-50%); position:absolute; width:1160px; background:#b3d24f; height:185px; margin-top:10px}
	.mflLeftContainer, .mflRightContainer {padding-top:190px; text-align:center; display:flex; flex-direction:column; height:100%; align-items:center; gap:30px; position:fixed; width:inherit;}
	img.mflJpLogo {width:24%;}
	img.mflLogo {width:60%;}
	img.mflIntroducingText {width:40%;}
	img.mflJpOrderText {width:103%;padding-top:10%; border-bottom:80vh solid #084f31;}
	#mflTop {display:flex; gap:30px; justify-content:space-evenly; align-items:center; z-index:1;}
	#mflTop img.mflJpLogo {width:unset; height:30%}
	#mflTop img.mflLogo {width:unset; height:60%;}
	#mflTop img.mflIntroducingText {width:unset; height:8%;}
	#mflTop img.mflJpOrderText {width:unset; padding-top:0; border:none; height:80%;}
}

@media (max-width:2000px) {
	img.mflJpLogo {width:39%;}
	img.mflLogo {width:84%;}
	img.mflIntroducingText {width:49%;}
	img.mflJpOrderText {width:135%;}
	.mflLeftContainer, .mflRightContainer {gap:20px;}
}

@media (max-width:1500px) {
	#mflLeft, #mflRight {border:none;}
	#mflLeft img, #mflRight img {display:none;}
	#mflTop {width:100%;}
}

/* ######### TABLET & MOBILE (SM) ######### */
@media (max-width: 1024px) {
	body {background: #F3F3F3;}
	body.menuOpen {transform: translate(-250px, 0);}
	header {padding: 0;}
	header .inner {padding: 0;}
	#content {padding: 20px;}
	#content .dropdown {overflow:unset!important;}
	.no-float-sm {float: none !important;}
	.no-align-sm {text-align: inherit;}
	.col-6, .col-4 {width: 100%; margin: 10px 0;}
	header #logo img {padding: 4px 0;}
	nav {background: #333; position: fixed; top: 0; right: -250px;  width: 250px; padding-top: 5px; overflow: auto; -webkit-box-sizing: border-box; box-sizing: border-box;}
	nav ul {display: block !important;}
	nav li {background: none !important; box-shadow: none !important; position: relative; display: block !important; border-bottom: 1px solid #555; left: 5%; max-width: 90%; height: auto !important;}
	nav li:last-child {border-bottom: none;}
	nav a, nav span {text-align: left; padding: 10px !important; display: block; color: #FFF !important; line-height: 20px !important;}
	nav li:hover > a, nav li:hover > span, nav a:hover {text-shadow: #FFF 0 0 6px;}
	nav .expander {background: rgba(255,255,255,0.2); position: absolute; display: block; width: 30px; height: 24px; right: 0; top: 4px; line-height: 24px; font-size: 20px; border-radius: 4px; cursor: pointer; z-index: 99; padding: 5px !important}
	.navOpen {position:absolute;width:34px;height:22px;top:calc(50% - 11px);right:10px;overflow:hidden;display:block;cursor:pointer;text-indent:-999px;}
	.navOpen span, .navOpen span:before, .navOpen span:after {background:#333;position:absolute; display:block;width:100%;height:4px;border-radius:1px;}
	.navOpen span {top: calc(50% - 2px);left:0}
	.navOpen span:before, .navOpen span:after {content: '';left: 0;width: 100%;}
	.navOpen span:before {top: -8px;}
	.navOpen span:after {bottom: -8px;}
	.navOpen span {-webkit-transition: background 0.3s linear 0.3s; transition: background 0.1s linear 0.1s;}
	.navOpen span:before {transition: transform 0.3s linear 0s;transform-origin: top left}
	.navOpen span:after {transition: transform 0.3s linear 0s;transform-origin: bottom left;}
	.navOpen.active span {background: transparent;}
	.navOpen.active span:before {-webkit-transform: translateX(5px) rotateZ(45deg) scaleX(0.75); transform: translateX(5px) rotateZ(45deg) scaleX(0.75);-webkit-transition-delay: 0s, 0.3s;transition-delay: 0s, 0.3s;}
	.navOpen.active span:after {-webkit-transform: translateX(5px) rotateZ(-45deg) scaleX(0.75);transform: translateX(5px) rotateZ(-45deg) scaleX(0.75);-webkit-transition-delay: 0s, 0.3s;transition-delay: 0s, 0.3s;}
	.sub > a:after, .sub span:after {display: none;}
	.sub:hover .subWide {visibility: hidden; opacity: 0;}
	.sub .subWide {position: relative; background: transparent !important; box-shadow: none; max-height: 0; visibility: visible; opacity: 1; top: 0; padding: 0; margin: 0; overflow: hidden; width: auto; left: auto;}
	.sub .subWide.open {visibility: visible; opacity: 1; padding-bottom: 10px; max-height: 2000px;}
	.sub ul {margin-bottom: 20px;}
	.sub ul li {border-bottom: none;}
	.sub ul li a, .sub ul li a:hover {color: #DDD; padding: 5px 10px !important;}
	
	.langNav {position: relative; top: 0; left: auto; right: auto; height: auto; margin: auto; border-radius: 0; overflow: hidden; width: 230px;}
	.langNav ul {height: auto; top: 0 !important; background: transparent !important; padding: 0 !important; margin: 0 !important;}
	.langNav ul:before {display: none;}
	.langNav li {display: block; text-align: left; position: relative !important; height: 100px; padding: 0 !important; margin: 0 0 1px 0 !important; left: 0 !important; text-indent: 20px; border-bottom: none !important; max-width: none;}
	.langNav li a {background: rgba(255,255,255,0.1);}
	.langNav li a span {padding: 0 !important;}
	.langNav li .dropdown {position: relative; height: auto; max-height: 0; display: block; opacity: 1 !important; visibility: visible !important; background: transparent; top: 0; border-radius: 0; box-shadow: none;}
	.langNav li .dropdown.open {max-height: 300px;}
	.langNav li .dropdown li.grey {opacity: 0.3; text-indent: 30px; color: #FFF;}
	.langNav:hover li .dropdown {max-height: 300px; top: 0;}
	.headMsg {padding: 5px 30px 5px 10px; font-size: 12px;}
	
	#searchForm {position: relative; display: block; float: none; width: 230px !important; padding: 0 0 20px 0; margin: auto; right: auto; top: 10px;}
	#addsearch {width: 230px !important; box-shadow: none !important;}
	
	/* NAV FLEX ORDERING - BSB OCT 2025 */
	nav {display: flex; flex-direction: column;}
	.langNav {order: 1;}
	#searchForm {order: 2;}
	.secondRow {position: relative; order: 3; padding-bottom: 10px;}
	nav > ul {order: 4;}
	ul.subMenu {width: 100%;}
	.secondRow nav {position: relative; top: auto; left: auto; right: auto; margin: auto; width: 240px;}
	
	.checkerNumber {width: 48px; height: 48px; font: 1.8em/48px "Trebuchet MS"; margin: 3px;}
	.page.statistics div {overflow: auto;}
	
	.fx-md {display: block;}
	.fx1-md, .fx2-md {flex: auto;}

	header .disc {position: relative; text-align:center;}
	header .logo-box {display:flex; align-items:center;}
	header .logo-box .disc-2 {margin:0 0 0 -10px;}
	
	/* Smart App Banner */

	#andBan {position: relative; width: 100%; height: 84px; padding: 10px 5px; background: #FFF; overflow: hidden; z-index: 999; box-sizing: border-box; transition: .5s all ease-in-out; top:0; box-shadow: 0 1px 8px 0px #0004;}
	#andBan img {width: 64px; height: 64px; margin-right: 5px; border-radius: 15px; box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15);}
	#andBan a {width: calc(88% + 15px);}
	#andBan > *, #andBan a > * {position: relative; display: inline-block; vertical-align: top; color: #343434;}
	.andBanClose {position: relative; width: 17px; height: 100%; line-height: 64px; font-size: 23px;}
	.andBanTitle {font-weight: bold; font-size: 13px; line-height: 20px;}
	.andBanSubTitle {font-size: 10px; color: #666; line-height: 12px;}
	.andBanStore {font-size: 12px; color: #666; line-height: 34px;}
	.andBanStore strong {color: #666;}
	.andBanButtoniOS {background: #007aff; float: right; border-radius: 20px; text-align: center; color: #FFF !important; padding: 5px 25px; font: normal 13px/21px arial; font-weight: 700; top: 14px;}
	.andBanButtonAndroid {background: #00875f; float: right; border-radius: 6px; text-align: center; color: #FFF !important; padding: 4px 16px; font: normal 13px/20px arial; font-weight: 700; top: 14px;}

	
	.coronaalert {background:none;width:90%;border:2px solid #ff0000;padding:5px 10px;border-radius:14px;}
	
	.subResults {display:flex; align-items:center; text-align:center; margin:15px 0 0; flex-direction: column;}
	.subResults .subResultTitle {font-weight:700;}
	.subResults ul {display:flex;}
	.subResults .results li {width:25px!important;height:25px!important; font-size:16px!important; line-height:26px!important; border-radius:50%; margin:5px!important; border-width:2px!important; margin: 1px !important;}
	.size-sidebar .standardContent span.tag {margin-bottom: 0px;}

	.ticketsLink {box-sizing: border-box;}
	.ticketsLink a {background:#ffd700; color:#000!important;width:100%;box-sizing: border-box;}
	.jackpotComBox {width:70%;}
	#mflTop, #mflLeft, #mflRight {display:none;}
}

/* ######### SMALLER TABLETS & MOBILES (XS) ######### */
@media (max-width: 767px) {
	footer .links {display: block !important;}
	footer .links li {display: block !important; padding: 10px; border-bottom: 1px solid #777; border-right: none;}
	.no-float-xs {float: none !important;}
	.no-align-xs {text-align: inherit;}
	.resultBall {width: 40px; height: 40px; margin: 2px; font-size: 20px; display: inline-block; line-height: 40px;}
	.resultBall:after {font-size: 10px;}
	.checker.resultBall:before {bottom: -5px; right: -10px; width: 20px; height: 20px; font: 0.6em/20px "Trebuchet MS";}
	.readMore span.more, .readMore div.more {display: none;}
	.readMore a.more {display: block; padding-bottom: 10px;}
	.steps li {flex: 45%;}
	table.block-xs > thead th {display: none;}
	table.block-xs > tbody > tr > td {display: block;}
	table.block-xs tr.dateRow:first-child th {border-radius: 9px 9px 0 0}
	table.block-xs tfoot td:first-child, table.block-xs tbody:last-child tr:last-child td:first-child {border-radius: 0 !important;}
	table.block-xs tfoot td:last-child, table.block-xs tbody:last-child tr:last-child td:last-child {border-radius: 0 0 9px 9px !important;}
	table.styleTable.block-xs td {border: none;}
	.prizeBreakdown * {text-align: left !important;}
	.prizeBreakdown tbody tr:first-child td:first-child {border-radius: 10px 10px 0 0;}
	.prizeBreakdown tbody tr:last-child td:first-child {border-radius: 0 !important;}
	.prizeBreakdown tbody tr:last-child td:last-child {border-radius: 0 0 10px 10px;}
	.prizeBreakdown tbody td {font-weight: bold; padding: 2px 8px;}
	.prizeBreakdown tbody td:first-child {padding-top: 15px;}
	.prizeBreakdown tbody td:last-child {padding-bottom: 15px;}
	.prizeBreakdown tbody td:before {content: ''; position: relative; font-weight: normal;}
	.prizeBreakdown tbody td:nth-child(2):before {content: 'Winners: ';}
	.prizeBreakdown.spanishBreakdown tbody td:nth-child(2):before {content: 'Ganadores: ';}
	.powerball .prizeBreakdown tbody td:nth-child(2):before, .mega-millions .prizeBreakdown tbody td:nth-child(2):before, .cash4life .prizeBreakdown tbody td:nth-child(2):before {content: 'NY Winners: ';}
	.prizeBreakdown tbody td:nth-child(3):before {content: 'Prize Per Winner: ';}
	.prizeBreakdown.spanishBreakdown tbody td:nth-child(3):before {content: 'Premio por ganador: ';}
	.prizeBreakdown tbody td:nth-child(4):before {content: 'Prize Fund Total: ';}
	.prizeBreakdown.spanishBreakdown tbody td:nth-child(4):before {content: 'Fondo total del premio: ';}
	.powerball .prizeBreakdown tbody td:nth-child(4):before, .mega-millions .prizeBreakdown tbody td:nth-child(4):before, .cash4life .prizeBreakdown tbody td:nth-child(4):before {content: 'NY Prize Fund: ';}
	.prizeBreakdown tbody td:nth-child(5):before {content: 'All Winners: ';}
	.playBox img {min-width: 0;}
	.playBox .playTimer {display: none;}
	.playBox .jackpotBox {font-size: 1.8em;}
	.playBox > div:nth-child(2) {padding: 10px 0;}
	.fx-md, .fx-sm {display: block;}
	.fx1-md, .fx1-sm, .fx2-md, .fx2-sm {flex: auto;}

	.date-range-section {width:100%;}
	.filter-results-container {flex-direction:column; gap:15px; padding:20px;}

	header .logo-box {flex-direction:column;}
	header .logo-box .disc-2 {margin:-10px 0 10px 10px}
	.headMsg {text-align: left;}
	.howToSection {margin-left: -40px;margin-right: -40px;border-radius: 0;}
	.resultBall.smallBall {width:30px; height:30px; line-height:30px; font-size:16px;}
	.jackpotComBox {width:100%; box-sizing:border-box;}
	.jackpotBoxHelpBox {right:unset; left:0; width:auto; height:auto;}
}

@media (max-width:570px) {
	.jackpotComBoxInner .jackpotComBoxDrawDetails:last-child {flex-direction:column; width:100%; gap:10px;}
	.jackpotComBoxInner .jackpotComBoxLink1, .jackpotComBoxInner .jackpotComBoxLink2 {flex-grow:1}
	.jackpotBoxHelp {left:unset;right:7px;}
	.jackpotBoxHelpBox {top:-60px; height:auto; min-height:190px; border-radius:20px; box-shadow:none; border:solid 3px #7e0c6e;padding:18px 25px;}
	.jackpotBoxClose {top:22px; right:10px;}
	.jackpotScreen {height:100%;}
	@keyframes screenSlide {95% {height:100%} 90% {height:100%; opacity:1;}100% {height:0; opacity:1;}}
	@keyframes jackpotLogoDazzle {0% {max-height:0; opacity:1; transform:translateY(0);} 10%,92% {max-height:38px; opacity:1; transform:translateY(0);} 100% {max-height:38px; transform:translateY(140px);opacity:1;}}
}

/* ######### MOBILES (XX) ######### */
@media (max-width: 499px) {
	h1 {font-size: 1.8em; line-height: 30px;}
	h2 {font-size: 1.4em;}
	h3 {font-size: 1.2em;}
	h4, .title4 {font-size: 1em;}
	header #logo img {padding: 5px; width: 200px;}
	
	#content {padding: 10px;}
	.page {padding: 15px;}
	.no-float-xx {float: none !important;}
	.no-align-xx {text-align: inherit;}
	.centred-xx {text-align: center !important;}
	.container-fluid {padding: 0 !important;}
	.veil .inner {top: 10px;}
	.box .head h2 {display: none;}
	.resultBall {border-width: 2px; width: 30px; height: 30px; margin: 0 0 10px; font-size: 16px; display: inline-block; line-height: 30px;}
	.resultBall:after {top: 32px; bottom: auto; line-height: 10px;}
	.checker.resultBall:before {bottom: -5px; right: -6px; width: 16px; height: 16px; font: 0.5em/16px "Trebuchet MS";}
	.bonus-ball:after {content: 'Bonus';}
	.lucky-sum:after {content: 'Lucky';}
	.result .date {text-align: center;}
	.result .date:before {margin: 5px;}
	.result .date strong {display: block;}
	.result .bottomArea {text-align: left !important;}
	.prevNext span {display: none;}
	.checkerNumber {width: 36px; height: 36px; font: 1.4em/36px "Trebuchet MS"; margin: 2px; border-width: 2px;}
	#reset_checker, #submit_checker {padding: 10px !important;}
	#breadcrumbs li:first-child a:before {background-image: url(/images/icons/home.svg); width: 20px; height: 15px; top: 2px; left: 0;}
	.fx-md, .fx-sm, .fx-xs {display: block;}
	.fx1-md, .fx1-sm, .fx1-xs, .fx2-md, .fx2-sm, .fx2-xs {flex: auto;}

	.filter-results-container-dates {width:100%; justify-content:center; gap:20px;}
	.filter-results-container-box {width:unset; flex-direction:column; justify-content:space-between; align-items:start; gap:3px;}
	.filter-results-container-box p {padding:3px 0!important;}
	input.filter-results-container-box {margin-top:15px!important; margin-bottom:10px!important;}

	header .disc {border-radius:0;}
	.howToSection {margin-left: -15px;margin-right: -15px;border-radius: 0; padding:20px; background:linear-gradient(232deg,rgba(56, 107, 194, 1) 0%, rgba(33, 70, 134, 1) 38%)}
	.htList li {padding:12px 10px 12px 47px}
	.htList li:before {top:29px; left:21px;}
	.htList li div {transform:none; left:5px; top:16px; font-size:26px;}
}

.mobTableContainer {position: relative; width: 100%; _overflow: auto; overflow-x: auto; overflow-y: hidden;}
.mobTableContainer:before {content: ''; background: url(/images/icons/hand-slide.svg) rgba(0,0,0,0.7) center no-repeat; background-size: 100px; position: absolute; top: 80px; left: 26%; width: 40%; height: 30px; padding: 10px 5%; transition: 0.5s all ease-in-out; border-radius: 10px; text-align: center; z-index: 9;}
.mobTableContainer.trans:before {opacity: 0; z-index: -1;}
.mobTableContainer.topper:before {top: 20px !important;}

.appButton {width:150px;}

/*App Page Design and Banner April 2026*/

.homeBox #newAppBanner:last-child:nth-child(odd),.homeBox #newAppBanner:not(last-child){width:calc(50% - 20px)}
.homeBox #newAppBanner:last-child:nth-child(even){width:100%;height:250px}
.homeBox #newAppBanner{margin:10px;height:auto;border-radius:10px;box-shadow:#00000014 0 0 10px}
.homeBox #qrButton{width:200px}
.homeBox .appBannerContent .banTitle{font-size:30px}
.homeBox .appBannerContent span:not(.banTitle){margin:5px 0 15px;font-size:20px}
.homeBox #newAppBanner:last-child:nth-child(odd):before,.homeBox #newAppBanner:not(:last-child):before,.homeBox #newAppBanner:last-child:nth-child(odd):after,.homeBox #newAppBanner:not(:last-child):after{width:180px;height:300px;top:unset;bottom:-130px}
.homeBox #newAppBanner:before{right:-30px}
.homeBox #newAppBanner:after{left:-30px}
.homeBox #newAppBanner:before, .homeBox #newAppBanner:after {animation: unset;}
#scratchBox{background:linear-gradient(0deg,#214686,#ec1c23)}
.scratchContent{position:relative;z-index:2;background:#0006;padding:60px;color:#fff;text-align:center}
#scratchFore{max-height:180px;width:380px;object-fit:contain;margin:20px 0 -160px;transform:translateY(-30px);pointer-events:none}
.scratchContent h3{text-transform:uppercase}
#scratchBox .button{background:#fff;color:#214686;display:block;width:130px;margin:2px auto}
@media (max-width: 1024px) {
#content .homeBox #newAppBanner{height:250px;width:100%;margin: 10px 0;}
}
@media (max-width: 550px) {
.homeBox #newAppBanner:before,.homeBox #newAppBanner:after{width:140px!important;bottom:-150px!important}
.scratchContent{padding:40px 20px}
#scratchFore{width:320px;margin:10px 0 -140px}
}

#qrButton{width:240px}
#qrButton:nth-last-child(2) {margin-bottom: 10px;}
#newAppBanner{display:block;width:100%;margin:30px 0 0;border-radius:15px;box-shadow:0 6px 12px #0004;height:350px;overflow:hidden;position:relative;background:linear-gradient(45deg,#002058,#0046c1)}
.appBannerContent .appLogo{width:160px;max-height: 60px;margin:0}
#content .appBannerContent span.banSpan{font-size:18px;margin:5px 0 10px}
.appBannerBacking{position:absolute;top:0;left:0;width:100%;height:100%}
.appBannerBacking img{position:absolute;top:50%;left:50%;transform-origin:center;transform:translate(-50%,-50%) scale(1) rotate(0deg);height:115%;width:115%;object-fit:cover;object-position:center}
.appBannerBacking > img:nth-child(1){filter:brightness(0.4) blur(2px)}
@keyframes appBanOne {
0%,100%{transform:translate(-50%,-50%) scale(1) rotate(0deg)}
50%{transform:translate(-55%,-55%) scale(1.2) rotate(-5deg)}
}
@keyframes appBanTwo {
0%,100%{transform:translate(-50%,-50%) scale(1) rotate(0deg)}
50%{transform:translate(-55%,-55%) scale(1.2) rotate(5deg)}
}
.appBannerContent{display:flex;flex-direction:column;justify-content:center;align-items:center;position:absolute;bottom:0;left:0;width:100%;height:100%;text-align:center;color:#fff;transition:transform .3s,background .3s;transform:scale(1)}
#newAppBanner:before,#newAppBanner:after{content:"";position:absolute;top:20px;width:340px;height:500px;background-size:contain;background-repeat:no-repeat;background-position:center;z-index:2;transform:scale(1) rotate(0deg);pointer-events:none}
@keyframes appWiggle1 {
0%,100%{transform:scale(1) rotate(0deg)}
50%{transform:scale(1.1) rotate(-5deg)}
}
@keyframes appWiggle2 {
0%,100%{transform:scale(1) rotate(0deg)}
50%{transform:scale(1.1) rotate(5deg)}
}
#newAppBanner:before{right:30px;background-image:url(/images/app/2026/app-banner-2.png);animation:appWiggle1 2s forwards infinite}
#newAppBanner:after{left:30px;background-image:url(/images/app/2026/app-banner-1.png);animation:appWiggle2 2s forwards infinite}
.appBannerContent *{position:relative;z-index:2}
.appBannerContent:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(0deg,#000,#000c);opacity:.8;z-index:1;transition:opacity .3s}
#newAppBanner:hover .appBannerContent{transform:scale(1.1)}
#newAppBanner:hover .appBannerContent:before{opacity:1}
.appBannerContent .banTitle{font-size:36px;font-weight:900;text-transform:uppercase;letter-spacing:1px}
.appBannerContent span{display:block}
.appBannerContent span:not(.banTitle){margin:10px 0 20px;font-size:24px}
.appBannerContent .appButtons > img:last-child{margin-right:0}

@media (max-width: 1200px) {
#newAppBanner{width:100%;margin:0;height:280px}
#newAppBanner:before,#newAppBanner:after{width:25vw;top:0;height:150%}
#newAppBanner:after{left:-60px}
#newAppBanner:before{right:-60px}
#newAppBanner:before,#newAppBanner:after{width:30vw;top:unset;bottom:-35%;height:120%}
}
@media (max-width: 950px) {
#newAppBanner{height:240px}
#content .appBannerContent .banTitle{font-size:26px;letter-spacing:0}
#content .appBannerContent span:not(.banTitle){font-size:20px;padding:0 20px;max-width:250px}
}
@media (max-width: 500px) {
#newAppBanner:before,#newAppBanner:after{min-width:150px;bottom:-130px;min-height:300px}
}

#newAppBanner {margin: 0}
.gameList{display:flex;align-items:stretch;justify-content:center;flex-wrap:wrap;margin:15px -40px 0!important}
.gameList li{color:#fff;border:2px solid #fff;display:block;padding:30px 0;margin:0!important;width:calc(33% - 4px);align-content:center}
.gameList li:nth-child(odd){background:linear-gradient(45deg,#14233c,#204686)}
.gameList li:nth-child(even){background:linear-gradient(45deg,#082842,#006dc8)}
.gameList strong{margin:0 auto 10px}
.gameList span,.gameList strong{display:block;text-align:center;margin:0 auto 10px;max-width:260px}
.gameList strong{font-size:20px}
.gameList img{width:160px;height:60px;margin:0 auto;display:block;filter:drop-shadow(0px 2px 4px #0002)}
#appIntro{position:relative;margin:-40px;background:linear-gradient(45deg,#204686,#eb2126);padding:40px;display:flex;align-items:stretch;justify-content:space-between;overflow:hidden}
#appIntro *{color:#fff}
#appIntro .appPara{width:calc(100% - 500px);margin:20px 0;position:relative;z-index:10}
#appImage{position:absolute;width:460px;top:0;right:0}
#appImage > img{position:absolute;object-fit:contain;max-height:600px;width:400px;top:-40px}
#appImage > img:nth-child(1){left:-80px;transform:translateY(100%) rotate(-45deg);z-index:6;animation:phoneOne 1s forwards 1}
#appImage > img:nth-child(2){right:-80px;transform:translateY(100%) rotate(45deg);z-index:5;animation:phoneTwo 1s forwards 1}
#appImage.start > img:nth-child(1){animation:phonedOne 4s forwards infinite}
#appImage.start > img:nth-child(2){animation:phonedTwo 4s forwards infinite}
@keyframes phoneOne {
0%{transform:translateY(100%) rotate(-45deg)}
100%{transform:translateY(0%) rotate(0deg)}
}
@keyframes phoneTwo {
0%{transform:translateY(100%) rotate(45deg)}
100%{transform:translateY(0%) rotate(0deg)}
}
@keyframes phonedOne {
0%,100%{transform:translateY(0%) rotate(0deg)}
50%{transform:translateY(10%) rotate(5deg)}
}
@keyframes phonedTwo {
0%,100%{transform:translateY(0%) rotate(0deg)}
50%{transform:translateY(10%) rotate(-5deg)}
}
#breadcrumbs,.page{position:relative;z-index:10}
.page{min-height:800px;padding:40px;border-radius:0 0 10px 10px;box-shadow:#0000001a 0 10px 20px}
.appPara{padding:10px}
.appPara h1,.appPara h3{margin:0}
.appButtons{display:flex;flex-wrap:wrap}
#appIntro .appButtons.qrcode{height:120px;width:260px;box-shadow:0 6px 12px #000a;background:#fff;border-radius:10px;overflow:hidden;margin-top:10px;}
#appIntro .appQR{height:100%}
.appButtons .appStore,.appPara .appQR{height:50px}
.appCards{padding:80px 20px 0;margin:35px -40px 5px -40px;display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;overflow:hidden;background:linear-gradient(0deg,#ccc,#eee)}
.appCards > div{position:relative;overflow:hidden;width:calc(33.33% - 60px);margin:0;background:linear-gradient(0deg,#ddd,#fff);box-shadow:0 3px 12px #0002;border-radius:10px;padding:20px;text-align:center;display:flex;flex-direction:column;justify-content:space-between;align-items:center}
#content .appCards > div h3{padding-top:0;padding-bottom:0;color:#23437b}
#content .appCards > div img{height:220px;width:210px;object-fit:cover;object-position:top;border-radius:20px 20px 0 0;border-bottom-width:0;box-shadow:0 3px 6px #0004;margin:10px auto -30px}
.appMason{margin:20px -8px 0}
.appMason > div:nth-child(1) > div{width:calc(33.33% - 66px)}
.appMason > div:nth-child(1) > div,.appMason > div:nth-child(2){background:linear-gradient(45deg,#ddd,#f9f9f9);border:4px solid #fff;padding:30px}
#content .appMason h4{padding-top:10px;font-size:22px;border-bottom-width:0}
@media (min-width: 1200px ) {
.appCards > div:nth-child(1){transform:rotate(-10deg);transform-origin:bottom right}
.appCards > div:nth-child(2){margin:0 -50px;z-index:2;transform:scale(1.05)}
.appCards > div:nth-child(3){transform:rotate(10deg);transform-origin:bottom left}
.appMason > div:nth-child(1){position:relative;display:flex;justify-content:stretch;align-items:stretch}
}
@media (max-width: 1200px) {
.appCards > div{width:calc(33.33% - 50px);margin:0 5px;padding:20px 10px}
#content .appCards > div img{width:180px}
.appButtons img{height:40px}
#appIntro .appPara{width:calc(100% - 300px)}
#appImage{position:absolute;width:260px;top:0;right:0}
#appImage > img{top:50%}
#appImage:before {
	content: "";
	position: absolute;
	right: 20px;
	top: 20px;
	transform: rotate(15deg);
	display: block;
	width: 110px;
	height: 110px;
	background: url(/images/app/app-icon-nylottery.png);
	background-size: cover;
	background-position: center;
	z-index: 100;
	box-shadow: 10px 10px 4px #0004;
	border-radius: 10px;
}
#content #appImage > img {
	animation: unset!important;
	top: unset;
	transform: translateY(0%) rotate(0deg);
}
#appImage {
	margin: 0 auto 40px;
}
.appMason{margin:10px 0 0}
.appMason > div:nth-child(2),#content .appMason > div > div{width:100%;box-sizing:border-box}
.appCards{background:linear-gradient(0deg,#444,#aaa)}
}
@media (max-width: 1032px) {
.appPara h1,.appPara h3{font-size:30px}
.appCards{padding:30px 30px 20px;margin:10px -40px 20px}
.appCards > div{width:100%;flex-direction:row;text-align:left;margin:0 0 10px}
.appCards > div > div{width:calc(100% - 300px);margin:0 30px}
.appPara{padding:10px 0}
#appHeader{display:none}
.gameList{margin:15px 0 0!important}
.gameList li{width:calc(50% - 4px)}
}
@media (max-width: 780px) {
.appCards{padding:15px 10px 5px;margin:10px -40px 20px}
#content .appCards > div img{width:120px;max-height:180px;border-radius:10px;height:auto;border-width:6px;margin:0 0 0 20px}
.appCards > div > div{width:calc(100% - 140px);margin:0}
#appIntro .appPara{width:calc(100% - 150px)}
#appImage{position:absolute;width:160px;top:-30px;height:100%;right:-30px}
#appImage > img{top:calc(30% - 150px);max-width:240px}
#appIntro{padding:20px;margin:-40px -40px -10px}
.appMason{padding:10px;background:#eee}
#content .appMason > div > div:not(.appButtons){background:unset;border-width:0;border-bottom:1px solid #888;margin:0 0 15px;padding:0 0 15px}
.appMason > div:nth-child(2){border-width:0;background:unset;padding:0}
.gameList li{width:100%;border-left:0;border-right:0}
#appImage:before {right: 50px;top: 50px;}
}
@media (max-width: 550px) {
.page{padding:20px}
#appIntro{margin:-20px -20px 0}
.appCards{background:unset;padding:0;margin:30px 0 0;overflow:visible}
#appIntro .appPara{width:100%;margin:0 0 30px 0}
#appImage{position:relative;width:100%;height:345px;top:unset;right:unset;max-width:260px;margin:0 auto 30px}
#appImage > img:nth-child(1){left:-60px}
#appImage > img:nth-child(2){right:-60px}
#appIntro{display:block}
.appPara h1,.appPara h3{font-size:26px}
#content .appCards p{line-height:1.2}
#content .appCards > div img{width:100px;margin:0 0 0 10px}
.appCards > div > div{width:calc(100% - 120px);margin:0}
}
#appImage:before {right: -60px;top: 0px;}


/* RESPONSIVE HIDERS */
.visible-xx,.visible-xs,.visible-sm,.visible-md,.visible-lg{display:none !important;}.visible-xx-block,.visible-xx-inline,.visible-xx-inline-block,.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block{display:none !important;}@media (max-width:499px){.visible-xx{display:block !important;} table.visible-xx{display:table !important;} tr.visible-xx{display:table-row !important;} th.visible-xx, td.visible-xx{display:table-cell !important;}.visible-xx-block{display:block !important;}.visible-xx-inline{display:inline !important;}.visible-xx-inline-block{display:inline-block !important;}}@media (min-width:500px) and (max-width:767px){.visible-xs{display:block !important;} table.visible-xs{display:table !important;} tr.visible-xs{display:table-row !important;} th.visible-xs, td.visible-xs{display:table-cell !important;}.visible-xs-block{display:block !important;}.visible-xs-inline{display:inline !important;}.visible-xs-inline-block{display:inline-block !important;}}@media (min-width:768px) and (max-width:991px){.visible-sm{display:block !important;} table.visible-sm{display:table !important;} tr.visible-sm{display:table-row !important;} th.visible-sm, td.visible-sm{display:table-cell !important;}.visible-sm-block{display:block !important;}.visible-sm-inline{display:inline !important;}.visible-sm-inline-block{display:inline-block !important;}}@media (min-width:992px) and (max-width:1199px){.visible-md{display:block !important;} table.visible-md{display:table !important;} tr.visible-md{display:table-row !important;} th.visible-md, td.visible-md{display:table-cell !important;}.visible-md-block{display:block !important;}.visible-md-inline{display:inline !important;}.visible-md-inline-block{display:inline-block !important;}}@media (min-width:1200px){.visible-lg{display:block !important;} table.visible-lg{display:table !important;} tr.visible-lg{display:table-row !important;} th.visible-lg, td.visible-lg{display:table-cell !important;}.visible-lg-block{display:block !important;}.visible-lg-inline{display:inline !important;}.visible-lg-inline-block{display:inline-block !important;}}@media (max-width:499px){.hidden-xx{display:none !important;}}@media (min-width:500px) and (max-width:767px){.hidden-xs{display:none !important;}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none !important;}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none !important;}}@media (min-width:1200px){.hidden-lg{display:none !important;}}