:root { --effect: hover 1s linear infinite;}
#loading {position: fixed; display: flex;justify-content: center; align-items: center;width: 100%; height: 100%; top: 0; left: 0;opacity: 0.9; background-color: #000; z-index: 219;}
#loading-txt {font-size: 1.2em; text-align:center; position: absolute; padding-top: 50% height: 0}
#loading-image { z-index: 220;}
#loading-txt p { display: inline-block; text-transform: uppercase; text-align: center; font-size: 4em; font-family: arial; font-weight: 600; transform: scale(.5);
    color: #121212; -webkit-text-stroke: 2px gray;}
#loading-txt p:nth-child(1) { animation: var(--effect);}
#loading-txt p:nth-child(2) { animation: var(--effect) .125s;}
#loading-txt p:nth-child(3) { animation: var(--effect) .25s;}
#loading-txt p:nth-child(4) { animation: var(--effect) .375s;}
#loading-txt p:nth-child(5) { animation: var(--effect) .5s;}
#loading-txt p:nth-child(6) { animation: var(--effect) .675s;}
#loading-txt p:nth-child(7) { animation: var(--effect) .75s;}
@keyframes hover {
    0% { transform: scale(.5); color: #121212;-webkit-text-stroke: 2px gray; }
    20% { transform: scale(1); color: pink;-webkit-text-stroke: 3px red;filter: drop-shadow(0 0 1px black)drop-shadow(0 0 1px black)drop-shadow(0 0 3px red)drop-shadow(0 0 5px red)hue-rotate(10turn);
    }
    50% { transform: scale(.5); color: #121212; -webkit-text-stroke: 2px gray; }
}
/*new */
a{-webkit-text-decoration:none;text-decoration:none;color:#fff;}
html { box-sizing: border-box;scrollbar-width: thin;scrollbar-color: #aaadbe;background: #000;}
html::-webkit-scrollbar { width: 6px; height: 6px; background: rgba(0, 0, 0, 0);}
html::-webkit-scrollbar-thumb { background: #914173; border-radius: 1em;}
html::-webkit-scrollbar-corner { background: rgba(0, 0, 0, 0);}
*,
*::before,
*::after { box-sizing: inherit;}
.fc-stack-icon {background-color:#EEE !important}
@font-face {font-family: Righteous; font-display: optional;src:url(/static/game43/images/Righteous-Regular.woff2) format('woff2')}
.css-1f20jmh{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;position:relative;}
.css-6qu7l6{display:inline-block;fill:currentcolor;height:24px;width:24px;}

.css-qthmdk{width:200px;-webkit-transition:visibility 0s,all 0.15s ease-in-out;transition:visibility 0s,all 0.15s ease-in-out;height:calc(100vh);
@media (max-width:1200px){
    .css-qthmdk{width:0}
}
z-index:3;background: #000; position:fixed;top:60px;left:0;border-right: thin solid #222;}
.css-qgh3qe {width: 60px;transition: visibility 0s ease 0s, all 0.15s ease-in-out 0s;height: calc(100vh - 60px);background: #0c0d14;z-index: 3;position: fixed;top: 60px;left: -200px;border-right: 1px solid #28293d;}
@media (min-width:1910px){.css-qthmdk{width:200px;}}
.css-qthmdk:hover{width:200px;}
@media (max-width:1909.95px){
    .css-qthmdk, .css-qgh3qe, .gcolumn{	width:60px;	}
    .css-qthmdk:hover [class*='LabelContainer']{opacity:1;visibility:visible;	}
}
@media (max-width:1200px){
    .css-qthmdk{width:0}
}
.css-y67g5x{width:100%;height:calc(100% - 46px);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-top:6px;padding-bottom:30px;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow:auto;overflow-x:hidden;scrollbar-width:none;}
.css-y67g5x::-webkit-scrollbar{	width:0;height:0;}
.css-y67g5x::-webkit-scrollbar-thumb{	border-radius:30px;}
.css-y67g5x:hover{scrollbar-width:thin;scrollbar-color:#aaadbe;}
.css-y67g5x:hover::-webkit-scrollbar{	width:3px;height:3px;background:rgba(0,0,0,0);}
.css-y67g5x:hover::-webkit-scrollbar-thumb{background:#aaadbe;border-radius:30px;}
.css-y67g5x:hover::-webkit-scrollbar-corner{background:rgba(0,0,0,0);}
.css-6n1w7f {border-radius: 30px;-webkit-transition: all 250ms ease;transition: all 250ms ease;border: none;
    cursor: pointer;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;
    -webkit-justify-content: center;justify-content: center;-webkit-align-items: center;-webkit-box-align: center;
    align-items: center;font-weight: 800;font-size: 16px;box-sizing: border-box;padding: 0;background: #0000;color: #EFF0F7;height: 48px;width: 48px;margin-right: 4px;}
.css-148wt6v{	margin:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;border-width:0;border-style:solid;border-color:rgba(255, 255, 255, 0.12);border-bottom-width:thin;margin-top:8px;margin-bottom:8px;margin-left:16px;margin-right:16px;}
.css-1hfy2mq{	position:absolute;bottom:0;width:100%;height:46px;background:rgba(26, 27, 40, 0.6);-webkit-backdrop-filter:blur(12.5px);backdrop-filter:blur(12.5px);box-shadow:0px -1px 0 #28293d;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
.css-1hxlhbi{min-height:calc(100vh);padding-left:200px;margin-top:0;}
#undertex { text-indent: 14px;font-size: 0.72em; letter-spacing: 0.046em;margin-top: -6px;}
@media (max-width:1909.95px){
    .css-1hxlhbi{padding-left:60px;	}
    .wrpp {padding-left: 60px; display: flex;justify-content: center;}
}
/*endnew */
.bigOne picture img {width: 100%; height: 100%}
.bigOne, .fourSmall {width: 25% !important}
#featuredTop {  height: calc(((((100vw - (216px)) / 4)) * 0.5617977528089888) + 48px);}
body{	margin: 0; font-size: 0.9em; font-family: Helvetica, Arial,sans-serif; color: #fff;}
h1,h2{text-align: left;}
.gamename span{	font: 600 0.85em/1.1rem 'Arial', cursive;  display: block; white-space: nowrap; text-indent: 4px;}
.h1tag { color:#fff; font-size:1.3em}
.gtags { color:#fff; font-size: 1.0em; padding-top: 1.2%;}
.gtags a { text-decoration: none; color:#fff}
input, textarea{color:#000;font-size: 10px;font-family: arial;}
input[type="submit"] { -webkit-appearance: none !important;-moz-appearance: none;appearance: none;border-radius: 0;}
img.bottom{	position:absolute;bottom:0px;	left: 0;}
.clear {font-size: 1px; height: 1px}
div#container{position: relative;justify-content: center;}
div#large_box{ z-index: 105;}
#formdiv2 { margin-left: auto; margin-right: auto; width: 580px; height: 100%; text-align: left;}
.dotted {	width: 100%; z-index: 2;}
.dotted:hover {	border: none;}
.clVisible { display:block; visibility:visible;}
.clHidden { display:hidden; visibility: hidden;}
.gameVid { position: absolute; bottom: 0; z-index: 2; width: 100%; height: 100%; border-radius: 8px; overflow: hidden; }
.gameVidNot { display:none; }
div.love { width: 30px; display:inline-flex;}
div.notlove {	width: 30px; display:inline-flex; }
.headerFirst { display: flex; flex-direction: row; padding-left: 8px; align-items: center;}
#cont_inng { background:#000; color:#fff;padding: 1%}
.descbox { font-size: 1.15em; padding: 0 8% 1.2%}
.descbox h4 {margin-block: 1em;}
#butGo {color: #ddd;font: 400 1em "Righteous", Helvetica}
#butGoVid {color: #ddd;	text-shadow: 2px 2px 0 #192c35;font: 400 1em "Righteous", Helvetica}
#paddz a div#butGo,#paddz a div#butGoVid { padding-bottom:1.5%;}
.gright{ grid-area: garight; display:none;}
.undergameMore {display:none; background: #000;}
.vert_gameright {vertical-align: top; padding-top: 3px;position: sticky; top: 55px;}
/* new */
#butGoFree{ height: 40px;width: 150px; position: relative;overflow: hidden; cursor: pointer; border-radius: 8px 8px; border: 2px solid #fff; font-family: 'Righteous', Helvetica; font-size:1.1em; background: #101c22;}
#butGoFree a { position: relative; transition: all .45s ease-Out; display: block; padding:9px;}
#butGoFree:hover a {color:#074B6B}
#circle { width: 0%; height: 0%; opacity: 0; line-height: 40px; border-radius: 50%; background: #6fd2ff; position: absolute;
    transition: all .5s ease-Out; top: 20px; left: 70px;}
#butGoFree:hover{border: 2px solid #074B6B;}
#butGoFree:hover #circle { width: 200%; height: 500%; opacity: 1; top: -70px; left: -70px;}
#butGoFreeMob{ height: 40px; width: 70%; position: relative; overflow: hidden; cursor: pointer; border-radius: 8px 8px; border: 2px solid #fff; font-family: 'Righteous', Helvetica;
    font-size:1.1em; margin:0 auto; background: #101c22;}
#butGoFreeMob a { position: relative; transition: all .45s ease-Out; display: block; padding:9px;}
#gabHeader { z-index: 111;	position: fixed;background-image: none; background: #101c22ef; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); width: 100%;
    top: 0; left: auto; right: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;
    -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
    height: 60px; min-height: 60px; box-shadow: 0 3px 3px -2px rgb(0 0 0 / 20%), 0 3px 4px 0 rgb(0 0 0 / 14%), 0 1px 8px 0 rgb(0 0 0 / 12%);
}
.grid-item_listingYT .gamevido embed{ object-fit: cover; width: 100%; height: 100%; z-index: 12; border-radius: 12px 12px; overflow: hidden; position: absolute; top: 0; left:0; box-shadow:4px 4px 3px #22222299;
    border:4px solid #192d36; transition: all 0.1s cubic-bezier(.65, .05, .36, 1) 0s; box-sizing: border-box;
    /* transform: scale(1.2); */}
.contentTitle { display: flex; flex-direction: column; width: calc( 100% - 110px ); padding-top:6px; background: #000;  padding-right: 15px; }
.contentTitle h1 { padding-left: 18px; font-size: 17px;}
.contentTop { display: flex; align-items: flex-end; justify-content: space-between;align-items: center; padding-right: 32px; flex-flow: row wrap;}
.contentTopSear {width:100%; display: flex; flex-direction: column;padding-right: 18px; padding-left: 18px; }

.grid-item_listingYT img { border-radius: 6px 6px; transition: opacity 0.1s cubic-bezier(0.5, 0, 0.1, 1) 0ms;}
.videoWrapper { position: absolute; overflow: hidden; top:-150%; height: calc(100%*4);width: 100% }
.cover { position: absolute; height: calc((534px - (300px * (9 / 16))) / 2); max-width: 300px; display: flex;justify-content: center; align-items: center; color: #fff; font-size: 20px; text-align: center; }
.css-xgeqm6 { position: absolute; left: 70%; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.wrpp{margin-top: 60px !important; min-height: calc(100vh);width:100%; background:#000; display:flex}
.css-j0n0xf.MuiAutocomplete-root .MuiInput-root .MuiInput-input { padding-top: 0; padding-left: 4px;}
.css-j0n0xf .MuiInput-root .MuiInput-input { padding: 4px 4px 4px 0;}
.css-j0n0xf .MuiAutocomplete-inputRoot .MuiAutocomplete-input { width: 0; min-width: 30px;}
.css-1pz5at6 .MuiInput-input { background: transparent; margin-left: 12px; outline: 0;color: #fff; width: 100% !important;}
.css-j0n0xf .MuiAutocomplete-input { border-width: 0; box-shadow: 0 0; font-family: Helvetica, Arial, sans-serif; font-weight: 700; margin-bottom: 17px; font-size: 15px;}
.css-j0n0xf .MuiAutocomplete-input { -webkit-box-flex: 1; flex-grow: 1; text-overflow: ellipsis; opacity: 1;}
.MuiAutocomplete-hasPopupIcon.css-j0n0xf .MuiAutocomplete-inputRoot { padding-right: 50px;}
.css-j0n0xf .MuiInput-root { padding-bottom: 1px;}
.css-j0n0xf .MuiAutocomplete-inputRoot { flex-wrap: wrap;}
.css-2iz2x6 { position: absolute; right: 0; top: calc(50% - 14px);}
.css-1rq9o8u { display: inline-flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;position: relative; box-sizing: border-box; background-color: #131F25; outline: 0; border: 0; margin: 0 -2px 0 0; cursor: pointer;
    user-select: none; -webkit-appearance: none; -moz-appearance: none;appearance: none; opacity: 1;text-decoration: none; text-align: center; flex: 0 0 auto;  font-size: 1.5rem; padding: 2px;}
.css-kksz1w svg { height: 20px; width: 20px;}
button { font-family: Helvetica,Arial, sans-serif;}
.css-j0n0xf.MuiAutocomplete-root { border-radius: 11px; height: 38px; position: relative; padding-top: 9px; background-color: #131F25;border-color: transparent; border-style: solid; border-width: 1px;}
.contentDesc {text-align:left; padding: 2px 39px 5px 20px}
.contentDesc_bottom {text-align:left; padding: 20px 12px 11px 12px;}
// #main_games_box {justify-content: center;}
#playedNowBox {padding: 16px;}
.css-xgeqm6 { -webkit-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;}
@media (min-width: 1082px){
    .css-xgeqm6 { position: absolute; left: 50%; top: 50%;padding: 20px 17px 17px 20px; -webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
}
@media (max-width: 1909.95px){
    .css-j0n0xf.MuiAutocomplete-root { font-size: 14px; width: 460px; }
    .grid-container { display: grid; grid-template-areas: 'main' 'footer'; grid-template-columns: 100%; width:100%}
}
@media (max-width: 1509.95px){.css-j0n0xf.MuiAutocomplete-root { font-size: 11.2px;}}
@media (max-width: 868.95px){
    .css-j0n0xf.MuiAutocomplete-root { width: 200px;}
    #playedNowBox {padding: 10px;}
    .contentDesc { overflow: hidden; line-height:1.1em; max-height: calc( 5 * 1.1em ); display: -webkit-box;-webkit-line-clamp: 5; -webkit-box-orient: vertical;}
    .contentTop {padding-right: 16px; height:48.3px}
}
@media (max-width: 609.95px){
    .css-j0n0xf.MuiAutocomplete-root { display: none;}
    #searchIconic {display:flex; position: absolute;right: 10px;top: 17px;}
}
@media (min-width: 610px){ #searchIconic {display:none}}
@media (min-width: 600px){.css-j0n0xf.MuiAutocomplete-root { margin-right: calc(10px) !important;	}}
@media (min-width: 1280px){	.css-j0n0xf.MuiAutocomplete-root { width: 460px; font-size: 14px; }}
/*endnew */
@media screen and (max-width: 1200px){
    .wrpp{padding:0}#padd,#brr {display: none;}	#paddz,#brrz {display:block;background: #000; padding: 2% 1.2%; color: #fff;}
    #cont_inng{padding: 2.5% 0 1%} #thumbor {margin:0 auto}
}
@media screen and (min-width: 1201px){
    #padd,#brr {display: block;} #paddz,#brrz {display: none;margin-left:2em}
    #padd { padding: 5% 4% 0 4%;} #cont_inng {display:flex} .descbox {text-align:left;}
}
@media screen and (max-width: 890px){.descbox {padding: 0 5% 2%}}
.biggrid {grid-column-start: 3;grid-column-end: 5;}
#gfnresp {min-height:280px }
.bottom_text {z-index: 102;margin:0 auto;text-align:center;color:#FFF; height: fit-content;display:flex; gap: 2%;align-items:center;padding:1.8%;font-family: Arial, Helvetica, sans-serif; font-size: 1.0em}
.ghead {width: 100%; }.ghead ins {margin:0.3% 0;}
.gleft {grid-area: menu; width: auto}.gmiddle {grid-area: main; }
.gcolumn {position: sticky;z-index: 1000;}.gfooter {grid-area: footer;padding-top:16px; width:calc( 100% )}
.searchRes {background-color: #000;width: 100%; text-align:left; padding:0.1% 1% 1%}
.grid-container_listing { display: grid; grid-template-columns:repeat(9, 1fr); background-color: #000; grid-template-rows: auto; padding:15px;width: 100%; column-gap: 10px; row-gap: 6px;}
.grid-item_listing,.grid-item_listing-pro  { border-radius: 6px 6px;position: relative;	background-color: rgba(255,255,255,0.07);  -webkit-background-clip: padding-box; background-clip: padding-box;}
.grid-item_listenFeat {border-radius: 6px 6px;position: relative;background-color: rgba(255,255,255,0.07);-webkit-background-clip: padding-box;background-clip: padding-box;}
.grid-item_listing .gamevido video{  object-fit: cover; width: 100%; height: 100%;z-index: 7; overflow: hidden; position: absolute; top: 0; left:0; -webkit-transition: opacity 0.4s ease-in-out;-moz-transition: opacity 0.4s  ease-in-out; -o-transition: opacity 0.4s  ease-in-out; transition: opacity 0.4s  ease-in-out; box-sizing: border-box; padding: 3px; border: 2px solid #6fd2ff; border-radius: 10px 10px;}
.grid-item_listing  picture img, .grid-item_listingFeat picture img { transition: all  0.1s ease-in-out; aspect-ratio: 336 / 189;}
.grid-item_listing-pro .gamevido video{ object-fit: cover; width: 100%; height: 100%; z-index: 7;  border-radius: 6px 6px;overflow: hidden; position: absolute; top: 0; left:0; opacity:1;transition: all 0.2s cubic-bezier(.65, .05, .36, 1) 0s; box-sizing: border-box; padding: 2px; border: 2px solid #6fd2ff;}
.grid-item_listing-pro picture img { transition: all  0.1s ease-in-out;aspect-ratio: 178 / 100; border: 2px solid transparent; border-radius: 6px 6px;}
.h { margin-left: 0; margin-top: 0; width: 100%; height: 100%;box-sizing: border-box;display: block;position: relative;-webkit-transition: -webkit-transform .1s cubic-bezier(.5, 0, .1, 1); transition: transform .1s cubic-bezier(.5, 0, .1, 1); z-index:10;}
a.h:hover [class*='clHidden'] { visibility: visible; display:block;}
a.h:hover [class*='clVisible '] { visibility: hidden; display: hidden}
a.h:hover .gameVid { box-sizing:border-box; background-clip: content-box; transform: scale(1.15); box-shadow: 3px 3px 3px #00000055; border: 2px solid #101c22;}
.pagero {transition: all .1s ease-in 0; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; border-radius: 8px; padding: 9px; background: #101c22;width: 34px; height: 34px; margin: 3px;}
a.pagero:hover {background: rgb(132,174,194); color: #000;}
.pageroActive{transition: all .1s ease-in 0s; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; border-radius: 8px; padding: 9px; background: #213945; width: 34px; height: 34px; cursor: default; margin: 3px;}
.grid-item_listing img {border-radius: 10px 10px; transition: all 0.2s cubic-bezier(0.65, 0.05, 0.36, 1) 0s;}
.grid-item_listing-pro_cont {display:grid;grid-template-columns:none;width: 100%; grid-gap: 2px;}
.playmorePro {max-width:100%;margin-bottom:0;color: #fff;background: #101c22;padding: 18px;text-align: left;font-size:1.2em;font-weight: 600;border-radius: 4px 4px;cursor:default;}
.custom-width {display: inline-block; }
.foot_grid {display: grid;  grid-template-columns: auto auto auto auto;	text-align: center;border-bottom: 2px solid #913F70;height:49px; width: 100%}
.foot-grid_item {background-color: #101c22; border-radius: 4px 4px  0 0;border-left: 1px solid #000;border-top: 1px solid #192d36; padding: 12px 8px;margin: 3px 3px 0;}
.foot-grid_item a {/*font-family: 'Righteous', Helvetica;font-size:1.1em;*/ font-weight:bold}
.pageneviou { background-color: #101c22;color: #6fd2ff; vertical-align: middle; border-radius: 18%; text-decoration: none; display: inline-block;	padding: 0.4em 0.8em; grid-auto-flow: column; box-shadow: 2px 2px 0 #213945}
.pageneviou:hover {box-shadow: none;}
.pageNums { display:flex;flex-wrap: wrap;padding:2% 1% 1%;font-family: 'Righteous', Helvetica; width: 100%; justify-content: center;}
.custom-width {width: 100%}
#main { transition: margin-left .5s;}
.gamename{ color: #fff;	background-color: #101c2299; border-radius: 0 5px 5px 0; position: absolute;top: 10px;left:2px; transition: opacity 0.4s ease-in; opacity:0; transition-delay:200ms; z-index:12; padding:1.7% 4.5% 2% 1%; max-width: 97%; overflow: hidden;}
.bardd78 {position: relative;width:100%;height: 100%;overflow: hidden;z-index:3;border-radius:6px}
.bardd78 img {z-index: 14; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.barff77 {position: absolute; background: transparent; bottom: 0; z-index: 11; height: 100%; width: 100%;}
.gamedesc {padding:1.5% 1.7% 7%; color: #fff;}
.pflast {width:100%}
#large_content_box { padding: 1% 3%; font-size: 12px}
.pure-menu-linker { padding: 3px 0 0 2px; line-height: 1.15; display: flex; align-items: center;justify-content: space-between; gap: 12px;}
#playvideoButton { margin-top: 2em;}
@media screen and (max-width: 550px){
    body{padding: 0;text-align: center;color: #fff;background:#000}
    .advmnt{margin-right: 0;}
    .advmnt:after{display: none;}
    #gabHeader {justify-content: flex-start}
    .wrpp {padding-left: 0}
    /*bdcn*/
    .game{padding-left: 0;text-align: center;}
    .pure-menu-linker span { min-width: 80px;}
    .pure-menu-linker svg { width: 60%}
    .pure-menu-linker {gap:4px}
}
@media screen and (max-width: 1982px){.grid-container_listing { grid-template-columns: repeat(8, 1fr)}}
@media screen and (max-width: 1750px){.grid-container_listing { grid-template-columns: repeat(7, 1fr)}}
@media screen and (max-width: 1460px){.grid-container_listing { grid-template-columns: repeat(6, 1fr)}}
@media screen and (max-width: 1320px){#padd {padding-bottom: 3%}.grid-container_listing { grid-template-columns: repeat(5, 1fr)}}
@media screen and (max-width: 1078px) {.grid-container_listing { grid-template-columns: repeat(4, 1fr)}}
@media screen and (max-width: 870px) {.grid-container_listing { grid-template-columns: repeat(3, 1fr)}}
@media screen and (max-width: 870px) {.grid-container {grid-template-areas: 'main' 'footer'; grid-template-columns: auto;}.foot-grid_item { padding: 12px 5px;font-size: 0.9em}}
@media screen and (max-width: 550px) {.grid-container {	grid-template-areas: 'main' 'footer'; padding: 0; grid-template-columns: auto;}.gleft, .gcolumn {display: none;}}
@media screen and (max-width: 300px) { #GamegabTex {display:none}}
@media screen and (max-width: 360px) {.pure-menu-linker span { min-width: 50px;}}
@media screen and (max-width: 680px){.biggrid {grid-row-start: 2;grid-row-end:3; grid-column-start: 1; grid-column-end: 3;}}
@media screen and (max-width: 610px) {.grid-container_listing { grid-template-columns: repeat(2, 1fr)}.grid-item_listing{}#main{padding:0}}
@media screen and (max-width: 450px) {
    .gleft {display:none}
    .grid-container {grid-template-areas:  'main' 'footer'; padding:0;}
    .grid-container_listing {
        grid-template-columns: repeat(2, 1fr); grid-gap: 2px;}
    .biggrid {grid-row-start: 2;grid-row-end:3; grid-column-start: 1; grid-column-end: 3;}
    #gfnresp {min-height:210px }#main{padding:0}
}
.css-1exdxkp{ display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;width:200px;height:34px;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-left-width:4px;border-left-style:solid;border-left-color:transparent;font-size: 14px;
    font-weight: 600;}
.css-1exdxkp svg { width:60px;height:34px;padding:0 19px;text-align:center;margin-left:-4px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#6fd2ff;}
.css-1exdxkp .LabelContainer{ -webkit-transition:visibility 0s,opacity 0.3s,all 0.2s ease-in-out;transition:visibility 0s,opacity 0.3s,all 0.2s ease-in-out;opacity:0;visibility:hidden;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;}
@media (min-width:1910px){
    .css-1exdxkp .LabelContainer{ opacity:1;visibility:visible; }.wrpp { padding-left:200px;  justify-content: center;}
    .grid-container { display: grid; grid-template-areas: 'main' 'footer'; grid-template-columns: 100%;width:100% }
}
.css-1exdxkp:active{ color:#6fd2ff;}
.css-1exdxkp:active svg { color:#6fd2ff;}
@media (hover: hover){
    .css-1exdxkp{ border-left-color:#6fd2ff;}
    .css-1exdxkp:hover { color:#6fd2ff;}
    .css-1exdxkp:hover [class*='LabelContainer'], .css-1exdxkp:hover [class*='css-6qu7l6'] {-webkit-transform:translate(8px, 0);-moz-transform:translate(8px, 0);-ms-transform:translate(8px, 0);transform:translate(8px, 0); }
    .css-1exdxkp [class*='LabelContainer'], .css-1exdxkp:hover [class*='css-6qu7l6'] {-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important;transform:none!important;color:#6fd2ff; }
    .css-1exdxkp svg { color:#6fd2ff;}
}
.css-1s73xoa {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-flex-wrap: nowrap;-webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap;flex-wrap: nowrap;width: 200px;height: 34px;-webkit-align-items: center;-webkit-box-align: center;
    -ms-flex-align: center;align-items: center;border-left-width: 4px;border-left-style: solid;border-left-color: transparent;}
.css-1s73xoa svg {width: 60px;height: 34px;padding: 0 19px;text-align: center;margin-left: -4px;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: center;
    -ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;color: #fff;transition: all 0.3s ease-in-out;}
.css-1s73xoa .LabelContainer {-webkit-transition: visibility 0, opacity .3s, all .2s ease-in-out;transition: visibility 0, opacity .3s, all .2s ease-in-out;
    opacity: 0;visibility: hidden;font-size: 14px;font-weight: 600;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 120px;}
@media (min-width:1910px) {.css-1s73xoa .LabelContainer { opacity: 1; visibility: visible;}}
.css-1s73xoa:active {color:#6fd2ff;}
.css-1s73xoa:active svg {color:#6fd2ff;}
@media (hover: hover) {.css-1s73xoa:hover { cursor: pointer; color: #6fd2ff;}
    .css-1s73xoa:hover [class*='LabelContainer'], .css-1s73xoa:hover [class*='css-6qu7l6'] {-webkit-transform: translate(8px, 0); -moz-transform: translate(8px, 0);-ms-transform: translate(8px, 0); transform: translate(8px, 0);-webkit-transition: visibility 0s, opacity 0.3s, all 0.2s ease-in-out; transition: visibility 0s, opacity 0.3s, all 0.2s ease-in-out;}
    .css-1s73xoa:hover [class*='css-6qu7l6']{transition: 0.05s}
    .css-1s73xoa:hover svg { color: #6fd2ff;}
}
.css-1upoo4v {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-flex-wrap: nowrap;-webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;flex-wrap: nowrap;width: 200px;height: 34px;-webkit-align-items: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;
    border-left-width: 4px;border-left-style: solid;border-left-color: transparent;opacity: .3;}
.css-1upoo4v svg {width: 60px;height: 34px;padding: 0 19px;text-align: center;margin-left: -4px;display: -webkit-box;
    display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;
    justify-content: center;-webkit-align-items: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;color: #6fd2ff;}
.css-1upoo4v .LabelContainer { -webkit-transition: visibility 0s, opacity 0.3s, all 0.2s ease-in-out;transition: visibility 0s, opacity 0.3s, all 0.2s ease-in-out;opacity: 0;visibility: hidden;font-size: 14px;font-weight: 600;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 120px;}
@media (min-width:1910px) {.css-1upoo4v .LabelContainer { opacity: 1; visibility: visible;}}
.css-1upoo4v:active { color: #A48eff;}
.css-1upoo4v:active svg { color: #A48eff;}
.contentCent {width: 100%;display: flex;padding: 8px 16px 16px 16px;}
.contentCent_in {display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%}
.contentLeft {display: flex;flex-direction:row;justify-content: flex-start;align-items: center;padding: 8px 16px 16px 16px; gap:4px}
.fourSmall{display: grid;grid-template-columns: auto auto;gap:4px}
.burku {display: grid;flex-flow: row wrap;box-sizing: border-box;content-visibility: visible;padding: 0;gap: 7px;margin: 0;width: 100%;grid-template-columns: repeat(1, 1fr);}
.autocomplete-items {position: absolute;z-index: 105;top: 100%;left: 0;right: 0;}
@media (max-width: 329.95px) {.grid-item_listing{width: calc(100vw - (32px));}}
@media (min-width: 330px) and (max-width: 589.95px){.burku {grid-template-columns: repeat(2, 1fr);}.contentCent{padding: 8px 8px}.grid-item_listing{width: calc((100vw - (23px)) / 2);}.gmiddle {width:100%}}
@media (min-width: 590px) and (max-width: 849.95px){.burku {grid-template-columns: repeat(3, 1fr);}.grid-item_listing{width: calc((100vw - (46px)) / 3);}}
@media (min-width: 850px) and (max-width: 1079.95px){.burku {grid-template-columns: repeat(4, 1fr);}.grid-item_listing{width: calc((100vw - (53px)) / 4);}}
@media (min-width: 1080px) and (max-width: 1249.95px){.burku {grid-template-columns: repeat(5, 1fr);}
// .grid-item_listing{width: calc((100vw - (60px)) / 5);}
}
@media (min-width: 1250px) and (max-width: 1544.95px){.burku { grid-template-columns: repeat(6, 1fr);}
// .grid-item_listing{width: calc((100vw - (67px)) / 6);}
}
@media (min-width: 1545px) and (max-width: 2019.95px){.burku {grid-template-columns: repeat(7, 1fr);}
// .grid-item_listing{width: calc((100vw - (74px)) / 7);}
}
@media (min-width: 2020px){.burku { grid-template-columns: repeat(8, 1fr);}}
.autocomplete {position: relative; box-sizing:border-box}
@media(max-width:1679px){.gleft {display:none}}
img#expando {	display:	none;	position:	absolute;	z-index:1;-ms-interpolation-mode: bicubic;}
.wide img#expando,.tall img#expando {	display: 	block;}
.wide img#expando {height: 	auto;	width: 100%;}
.tall img#expando {	height:		100%;	width:auto;}
.noPhone {position: absolute;top: 50px; left: 50%; transform: translate(-50%, -50%);}
.oneSmall {width:calc(100% / 2);}
.twoSmall {display: grid; gap: 4px; padding: 2px;}
.playBoder {border: 1px solid #fff; display: flex; padding: 9px 10px 11px; border-radius: 7px;}
.playBoderLong {width: 165px; border: 1px solid #bbb; padding: 1.2% 1.3%; border-radius: 7px;margin:0 auto; text-align: center;}
/*!
Pure v2.0.6 (reduced size)
*/
html{line-height:1.15;-webkit-text-size-adjust:100%}main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0}a{background-color:transparent}b,strong{font-weight:bolder}code{font-family:monospace,monospace;font-size:1em}img{border-style:none}
/*! jQuery UI css - v1.13.2 - 2022-07-14
* REDUCED FILE SIZE !
* */
.ui-icon{display:inline-block;vertical-align:middle;margin-top:-.25em;position:relative;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat}.ui-widget-icon-block{left:50%;margin-left:-8px;display:block}.ui-autocomplete{position:absolute;top:0;left:0;cursor:default}.ui-menu{list-style:none;padding:0;margin:0;display:block;outline:0}.ui-menu .ui-menu{position:absolute}.ui-menu .ui-menu-item{margin:0;cursor:pointer;list-style-image:url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)}.ui-menu .ui-menu-item-wrapper{position:relative;padding:3px 1em 3px .4em}.ui-menu .ui-state-active,.ui-menu .ui-state-focus{margin:-1px}.ui-menu .ui-icon{position:absolute;top:0;bottom:0;left:.2em;margin:auto 0}.ui-menu .ui-menu-icon{left:auto;right:0}.ui-button{padding:.4em 1em;display:inline-block;position:relative;line-height:normal;margin-right:.1em;cursor:pointer;vertical-align:middle;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;/*overflow:visible*/}.ui-button,.ui-button:active,.ui-button:hover,.ui-button:link,.ui-button:visited{text-decoration:none}.ui-button-icon-only{width:2em;box-sizing:border-box;text-indent:-9999px;white-space:nowrap}input.ui-button.ui-button-icon-only{text-indent:0}.ui-button-icon-only .ui-icon{position:absolute;top:50%;left:50%;margin-top:-8px;margin-left:-8px}button.ui-button::-moz-focus-inner,input.ui-button::-moz-focus-inner{border:0;padding:0}.ui-tabs{position:relative;padding:.2em}.ui-tabs .ui-tabs-nav{margin:0;padding:.2em .2em 0}.ui-tabs .ui-tabs-nav li{list-style:none;float:left;position:relative;top:0;margin:1px .2em 0 0;border-bottom-width:0;padding:0;white-space:nowrap}.ui-tabs .ui-tabs-nav li.ui-tabs-active{margin-bottom:-1px;padding-bottom:1px}.ui-widget{font-family:Arial,Helvetica,sans-serif;font-size:1em}.ui-widget .ui-widget{font-size:1em}.ui-widget button,.ui-widget input,.ui-widget select,.ui-widget textarea{font-family:Arial,Helvetica,sans-serif;font-size:1em}.ui-widget.ui-widget-content{border:1px solid #c5c5c5}.ui-widget-content{border:1px solid #ddd;background:#fff;color:#333}.ui-widget-content a{color:#333}.ui-widget-header{border:1px solid #ddd;background:#e9e9e9;color:#333;font-weight:700}.ui-widget-header a{color:#333}.ui-button,.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default{border:1px solid #c5c5c5;background:#f6f6f6;font-weight:400;color:#454545}.ui-button,.ui-state-default a,.ui-state-default a:link,.ui-state-default a:visited,a.ui-button,a:link.ui-button,a:visited.ui-button{color:#454545;text-decoration:none}.ui-button:focus,.ui-button:hover,.ui-state-focus,.ui-state-hover,.ui-widget-content .ui-state-focus,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-focus,.ui-widget-header .ui-state-hover{border:1px solid #ccc;background:#ededed;font-weight:400;color:#2b2b2b}.ui-state-focus a,.ui-state-focus a:hover,.ui-state-focus a:link,.ui-state-focus a:visited,.ui-state-hover a,.ui-state-hover a:hover,.ui-state-hover a:link,.ui-state-hover a:visited,a.ui-button:focus,a.ui-button:hover{color:#2b2b2b;text-decoration:none}.ui-button.ui-state-active:hover,.ui-button:active,.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active,a.ui-button:active{border:1px solid #003eff;background:#007fff;font-weight:400;color:#fff}.ui-icon-background,.ui-state-active .ui-icon-background{border:#003eff;background-color:#fff}.ui-state-active a,.ui-state-active a:link,.ui-state-active a:visited{color:#fff;text-decoration:none}.ui-state-checked{border:1px solid #dad55e;background:#fffa90}.ui-icon{width:16px;height:16px}.ui-icon-document{background-position:-32px -96px}.ui-icon-document-b{background-position:-48px -96px}.ui-icon-tag{background-position:-240px -96px}.ui-icon-home{background-position:0 -112px}.ui-icon-search{background-position:-160px -112px}.ui-icon-link{background-position:-240px -112px}.ui-icon-close{background-position:-80px -128px}.ui-icon-key{background-position:-112px -128px}.ui-icon-clipboard{background-position:-160px -128px}.ui-icon-image{background-position:-208px -128px}.ui-icon-video{background-position:-224px -128px}.ui-icon-script{background-position:-240px -128px}.ui-icon-info{background-position:-16px -144px}.ui-icon-play{background-position:0 -160px}.ui-icon-circle-close{background-position:-32px -192px}.ui-corner-all,.ui-corner-left,.ui-corner-top{border-top-left-radius:3px}.ui-corner-all,.ui-corner-right,.ui-corner-top,.ui-corner-tr{border-top-right-radius:3px}.ui-corner-all,.ui-corner-bottom,.ui-corner-left{border-bottom-left-radius:3px}.ui-corner-all,.ui-corner-bottom,.ui-corner-right{border-bottom-right-radius:3px}.ui-widget-shadow{-webkit-box-shadow:0 0 5px #666;box-shadow:0 0 5px #666}

.ui-autocomplete-row, .ui-widget-content,.ui-widget-content a {
    background: #101c22; color: #FFF; font-weight:bold; }
.ui-state-active,.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,a.ui-button:active,
.ui-button:active,.ui-button.ui-state-active:hover {
    background: #213945; font-weight: bold;color: #fff; margin:0; border:none; }
.ui-menu .ui-menu-item-wrapper { position: relative; padding: 3px 10px 2px 2px; }
.ui-widget.ui-widget-content { border:none; }
.ui-autocomplete-row:hover { background: #6fd2ff; }
.autoli {width: 100%; height: 100%; justify-items: left; display: flex;}
#ui-id-1, #ui-id-1 ul {max-height:432px;margin-top: 106px;z-index:113;overflow-y:auto;text-align:left}
#ui-id-1::-webkit-scrollbar {width:6px; background: rgba(0, 0, 0, 0); }
#ui-id-1::-webkit-scrollbar-thumb { background: #6fd2ff;border-radius: .2em; }
.ui-menu .ui-menu-item{border-bottom:1px solid #080C0F;}
html {line-height: 1.0;}
div#large_flash_game_box{	background-color: #000; height:100%;z-index: 125;}
#likeit, #hateit {color: #6fd2ff;}
#likeit svg:hover g g{stroke:#80FF80}
#hateit svg:hover g g{stroke:#ff5c5c}
.thetopbar_play {	height: 0; z-index: 105;text-align: center;}
#gameholder {
    width: 100%;min-height: 231px; height:100%;display:flex;flex-direction: column;
    margin: 0 auto; z-index: 3;
}
.tabsundergame {
    background-color: #101C22;color:#6fd2ff;
    margin: 0 auto;flex-flow: row nowrap;-webkit-box-pack: justify; justify-content: space-between;
    -webkit-box-align: center; align-items: center; user-select: none; box-sizing: content-box;
    z-index: 3; position: absolute; bottom: 0; transition: all 0.2s ease-in-out 0s;
    left: 0;  right: 0; height: 45px; display:none; overflow:hidden;
}
.grid-item_listing-pro .gamevido video  {width:178px; height:100px}
.tags_undergame {
    display:flex;
    margin: 0 auto;flex-flow: row wrap;
    -webkit-box-pack: justify;justify-content: space-evenly;-webkit-box-align: center;
    align-items: center;user-select: none;
    box-sizing: content-box;font-size: 14px;width:100%;gap: 5px 0;text-align:center;
    padding: 5px 0;
}
.tagElement{ padding: 8px 17px; background: #29414E; min-width: 60px; border-radius: 11px;font-weight:bold}
.tagElement:hover { background: #84aec2; color: #101C22;}
.belowWalkthrough {display:flex;-webkit-box-pack: justify;justify-content: space-between;-webkit-box-align: center;align-items: center;background: #29414E;text-indent: 10px;height: 34.1px;max-width:1024px}
.tabsundergam_grid-items {padding-left: 1.3%;text-align: center;}
#walkthroughButton {vertical-align: middle; justify-content: center; padding-right: 13px; padding-top: 2px;}
#fullscreenButton {padding: 4px 1% 0}
.ifneeded{ transition: 0.5s; -webkit-font-smoothing: antialiased;}
#endFullscr {display:none; position:fixed;top:35px;padding: 5px 8px 5px;background: #00000099;border-radius: 0 50% 50% 0;}
.grid-container {
    grid-template-areas:
        'main'
        'belowg'
        'belowAr'
        'footer';
    grid-template-columns: 1fr;
}
.gleft {display:none}
.desc {display:none; grid-area: desc;  margin-top: 8px;}
.desc_inner {
    text-align:left; display: flex;
    -webkit-flex-direction: row; -ms-flex-direction: row;
    flex-direction: row; -webkit-box-flex-flow: row wrap; -webkit-flex-flow: row wrap;
    -ms-flex-flow: row wrap; flex-flow: column wrap;
    background-color: #101C22 !important;
    border-width: 0; border-radius: 10px 10px;
    color: #fff; padding-right: 18px; padding-left: 18px;
    width: 100%; height: 100%; padding-bottom: 18px;
    position: relative; margin: auto; line-height: 1.5;
}
.desc_innerText {padding-bottom: 8px;padding-right:8px;text-align: justify;}
.desc_innerFooter {
    background-color: #101C22; border-radius: 10px 10px;
    padding:1%;text-align:left; display: flex; min-height: 30px;
    flex-flow: row nowrap;-webkit-box-pack: justify;
    justify-content: space-between;-webkit-box-align: center;
    align-items: center;user-select: none;box-sizing: content-box;
    /* font-family: 'Righteous', cursive; */
    margin-bottom: 12px;
}
.desc_video {  grid-area: video;display:none}
.desc_video_inner {
    display:none; margin-top: 8px
    background-color: #101C22 !important;
    border-width: 0;border-radius: 10px 10px 0 0;padding-right: 18px;
    width: 100%;height: calc( 100% - 40px);
    margin: auto;line-height: 1.5;padding-top: 18px;
}
.galeft {display:none; grid-area: galeft;}
.garightau { display:none; grid-area: garightau;}
.garightau_alt {display:none;grid-area: garightau_alt;}
#game_did {margin:0 auto; }
#game_did_in {height:100%;text-align:center}
.walkthroughContainer {float: right; padding:2% 2.2%; margin-top:0px;position: relative;}
#howto {margin-top:3px; display:none}
.garightau_2x2,.garightau_2x2-content {display:none}
.galeft, .garightau{ height: fit-content;}
.undergameMore {width:100%; grid-area:belowAr; display:grid; grid-template-columns: repeat(4, 178px); justify-content: space-evenly }
.underGwagon {display:flex; width: 100%;justify-content: space-evenly;flex-flow: row;text-align:center; background:#000; align-items: center;grid-area: belowg;margin:0 auto}
.rresp {padding-top:2px}
#fbb { padding-top:17px;width: 102px; overflow:hidden}
@media (max-width: 1199.95px) {
    /* start before all other media */
    .grid-item_listing-pro picture img { border: 0; width:178px; height: 100px}
}
@media (max-width: 364.95px) {
    .undergameMore { width: 100%; margin-left:0;grid-gap: 4px; grid-template-columns: 1fr 1fr;justify-content: center;padding: 0 4px}
    .underGwagon {padding: 10px 0;}
    .grid-item_listing, .grid-item_listing-pro{ max-width: calc(50vw - 4px);}
    #gameholder {width: calc( 100vh )}
    .dotted {width: 100%; height: auto;}
    /* .grid-item_listing-pro picture img { max-width: 178px; width: 100%; max-height: 100px; height: auto;aspect-ratio: 178 / 100;} */
    .grid-item_listing-pro picture img { width: 100%; max-height: auto; height: auto;aspect-ratio: 178 / 100;}
    .gmiddle {width:calc(100vw); max-width: 100%; min-height:231px; height: auto; }
}
@media (min-width: 365px) and  (max-width: 545.95px) {
    .undergameMore { margin-left:0;grid-gap: 4px; grid-template-columns: 178px 178px;justify-content: space-evenly;}
    .underGwagon {padding: 10px 0;}
    .dotted {width: 182px; height: 104px;}
    .gmiddle {width:calc(100vw); min-height:231px; height: auto;}
}
@media (min-width: 546px)  and  (max-width: 735.95px) {
    .undergameMore { margin-left:0;grid-gap: 4px; grid-template-columns: repeat(3, 178px); justify-content: space-evenly;}
    .dotted {width: 178px; height: 100px;}
    .underGwagon {padding: 10px 0;height: fit-content;}
    .gmiddle {width:calc(100vw); min-height:231px; height: auto; }
    #howto {margin-top:3px; display:block}
}
@media (min-width: 736px)  and  (max-width: 831.95px) {
    .undergameMore { margin-left:0;grid-gap: 4px; grid-template-columns: repeat(4, 178px); justify-content: space-evenly;}
    .dotted {width: 178px; height: 100px;}
    .underGwagon {padding: 10px 0;height: fit-content;}
    .gmiddle {width:calc(100vw); min-height:231px; height: auto;}
    #howto {margin-top:3px; display:block}
}
@media (min-width: 832px) and (max-width: 1199.95px) {
    .gmiddle {width:calc(100vw); min-height:231px; height: auto; }
    .undergameMore {margin-left:0;height: 212px; overflow: hidden; grid-gap: 4px;}
    .underGwagon {padding: 10px 0; width: 100%; display: flex; flex-direction: column;}
    #howto {margin-top:3px; display:block}
}
@media (min-width: 930px) and (max-width: 1199.95px) {
    .undergameMore {grid-template-columns: repeat(5, 178px); }
    #howto {margin-top:3px; display:block}
}
@media (min-width: 1201px) and (max-width: 1358.95px)
{
    .grid-container {
        display: grid;
        gap: 4px;
        margin-top: 6px;
        grid-template-columns: repeat(6,183px);
        /* grid-template-rows: repeat(9, 100px); */
        grid-template-areas:
  'galeft main main main main garight'
  'galeft main main main main garight'
  'galeft main main main main garight'
  'galeft main main main main garight'
  'galeft belowg belowg belowg belowg garight'
  'galeft belowg belowg belowg belowg garight'
  'galeft belowAr belowAr belowAr belowAr garight'
  'galeft belowAr belowAr belowAr belowAr garight'
  'galeft belowAr belowAr belowAr belowAr garight'
  'desc desc desc desc desc desc'
  'desc desc desc desc desc desc'
  'desc desc desc desc desc desc'
  'desc desc desc desc desc desc'
  'desc desc desc desc desc desc'
  'desc desc desc desc desc desc'
  'desc desc desc desc desc desc'
  'desc desc desc desc desc desc'
  'footer footer footer footer footer footer';
    }
    .tabsundergame {position:absolute;}
    #gWagon_wrap{width: 100%; height: 100%;}
    /* .gfooter{padding-top:240px} */
    .undergameMore {width: 748px; grid-area:belowAr;
        flex-flow: column wrap;
        box-sizing: border-box;
        display:flex;
        gap: 0 6px;
        height: 318px;
        overflow:hidden; }
    .underGwagon {width: 748px; height: 158px}
    .grid-item_listing-pro_cont{grid-template-columns:none; grid-gap:0;justify-content: center;}
    .grid-item_listing-pro{
        width: 182px;
        height: 104px;
        margin: 1px 0;
        border-width: 2px;
        padding: 0;
        border-style: solid;
        border-color: transparent;
        box-sizing: border-box;
        display: block;
        position: relative;
    }
    .grid-item_listing-pro picture img { border: 0; width: 178px; height: 100px;}
    .gmiddle {width: 100%; height: 468px; margin-top: -4px;}
    .gfooter {padding-top: 8px;}
    .gcolumn {width:60px}
    .galeft {display:flex; flex-flow: row wrap; margin-top:-5px }
    .gright {display: block;margin-top:-6px }
    .vert_gameright { padding-top: 2px; top: 58px;width: 178px; margin: 0 auto;}
    .desc {display: flex; flex-direction: column; }
    .desc_video_inner {display:flex; position: relative;justify-content: center; align-items: center}
    #game_did {width: 100%;height: calc( 100% - 45px)}
    #howto {margin-top:3px; display:block}
}
@media (min-width: 1359px) and (max-width: 1559.95px)
{
    .grid-container {
        display: grid;
        gap: 4px;
        margin-top: 4px;
        grid-template-columns: repeat(7,180px);
        /* grid-template-rows: repeat(9,100px); */
        grid-template-areas:
    'galeft main main main main main garight'
    'galeft main main main main main garight'
    'galeft main main main main main garight'
    'galeft main main main main main garight'
    'galeft main main main main main garight'
    'galeft belowg belowg belowg belowg belowg garight'
    'galeft belowg belowg belowg belowg belowg garight'
    'galeft belowAr belowAr belowAr belowAr belowAr garight'
    'galeft belowAr belowAr belowAr belowAr belowAr garight'
    'galeft belowAr belowAr belowAr belowAr belowAr garight'
    'desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc'
    'footer footer footer footer footer footer footer';
    }
    .tabsundergame {position:absolute;}
    #gWagon_wrap{width: 100%; height: 100%; }
    .undergameMore {width:100%; grid-area:belowAr;
        flex-flow: row wrap;
        box-sizing: border-box;
        justify-content: space-evenly;
        overflow: hidden;
        height: 216px;
        display: flex;
        flex-direction: column;
    }
    .grid-item_listing-pro picture img { border: 0; width:178px; height: 100px}
    .grid-item_listing-pro_cont{grid-template-columns:none; grid-gap:0;justify-content: center;}
    .grid-item_listing-pro{
        width: 182px;
        height: 104px;
        margin: 2px;
        border-width: 2px;
        padding: 0;
        border-style: solid;
        border-color: transparent;
        box-sizing: border-box;
        display: block;
        position: relative;    }
    .undergameMore   .grid-item_listing-pro {}
    .gcolumn {width:60px}
    .vert_gameright { padding-top: 3px; top: 58px;}
    .gmiddle {width: 906px; height: 532px; margin: 4px auto 0 6px;}
    .galeft {display: block;display:flex; flex-flow: row wrap; }
    .gright {display: block; padding-left: 4px; }

    .desc {display: flex; flex-direction: column; }
    .desc_video_inner {display:flex; position: relative;justify-content: center; align-items: center}
    #game_did {width: 100%; height: calc( 100% - 45px)}
    #howto {margin-top:3px; display:block}
}
@media (min-width: 1560px) and (max-width: 1769.95px)
{
    .grid-container {
        display: grid;
        gap: 4px;
        grid-template-columns: repeat(8,178px);
        /* grid-template-rows: repeat(9,100px); */
        grid-template-areas:
    'galeft main main main main main garight garightau'
    'galeft main main main main main garight garightau'
    'galeft main main main main main garight garightau'
    'galeft main main main main main garight garightau'
    'galeft main main main main main garight garightau'
    'galeft main main main main main garight garightau'
    'galeft belowg belowg belowg belowg belowg garight garightau'
    'galeft belowg belowg belowg belowg belowg garight garightau'
    'galeft belowAr belowAr belowAr belowAr belowAr garight garightau'
    'desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc'
    'footer footer footer footer footer footer footer footer'
    }
    .tabsundergame {position:absolute;}
    .gmiddle, #gameholder {width: 900px; height: 640px; margin:0 auto; margin-top: 2px;margin-left:4px}
    #gWagon_wrap{width: 100%; height: 100%;}
    .undergameMore {width:100%; grid-area:belowAr;
        flex-flow: row wrap;box-sizing: border-box;
        justify-content: space-evenly;
        grid-template-columns: repeat(5, 178px);
        overflow:hidden; height: 104px; }
    .underGwagon {width: 900px; margin-left: 8px; }

    .vert_gameright { padding-top: 3px; top: 58px;}
    .grid-item_listing-pro picture img { border: 0; width:178px; height: 100px}
    .grid-item_listing-pro_cont{grid-template-columns:none; grid-gap:0;justify-content: center;}
    .grid-item_listing-pro{
        width: 182px;
        height: 104px;
        margin: 2px;
        border-width: 2px;
        padding: 0;
        border-style: solid;
        border-color: transparent;
        box-sizing: border-box;
        display: block;
        position: relative; }
    .gcolumn {width:60px}
    .galeft {display: block;display:flex; flex-flow: row wrap; }
    .gright {display: block; padding-left: 4px; }
    .garightau {display: block;display:flex; flex-flow: row wrap; }
    .desc {display: flex;flex-direction: column; }
    .desc_video_inner {display:flex; position: relative;justify-content: center; align-items: center}
    #game_did {width: 100%; height: calc( 100% - 45px)}
    #howto {margin-top:3px; display:block}
}
@media (min-width: 1770px) and (max-width:2069.95px) {
    .grid-container {
        display: grid; gap: 4px;
        grid-template-columns: repeat(9,178px);
        grid-template-rows: repeat(9,100px);
        grid-template-areas:
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft belowg belowg belowg belowg belowg belowg garight garightau'
    'galeft belowg belowg belowg belowg belowg belowg garight garightau'
    'galeft belowAr belowAr belowAr belowAr belowAr belowAr garight garightau'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'footer footer footer footer footer footer footer footer footer';
    }
    .tabsundergame {position:absolute;}
    .gmiddle, #gameholder {width: 1088px;height: 620px;}
    #gWagon_wrap{width: 100%; height: 100%; }
    .undergameMore {width:100%; grid-area:belowAr;
        flex-flow: row wrap; box-sizing: border-box; justify-content: space-evenly;
        grid-template-columns: repeat(6, 178px);overflow:hidden;
        max-height: 104px;
    }
    .rresp {width: 1084px; height: 196px}
    .grid-item_listing-pro_cont{grid-template-columns:none; grid-gap:2px;justify-content: center;}
    .grid-item_listing-pro{ padding: 0; box-sizing: border-box; display: block; position: relative; }
    .grid-item_listing-pro picture img {border:0}
    .gcolumn {width:60px}
    .galeft {display: block;display:flex; flex-flow: row wrap; gap: 2px 2px;}
    .garightau {display: block;display:flex; flex-flow: row wrap;gap: 2px;}
    .gright {display: block;}
    .desc { display: flex; flex-direction: column; }
    .desc_video_inner {display:flex; position: relative;justify-content: center; align-items: center}
    .walkthroughContainer {padding: 1.5% 2%}
    #game_did {width: 100%; height: 100%}
    #howto {margin-top:3px; display:block}
}
@media (min-width: 2070px) and (max-width:2269.95px)  {
    .grid-container {
        display: grid; gap: 4px;
        grid-template-columns: repeat(9,178px);
        grid-template-rows: repeat(9,100px);
        grid-template-areas:
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft main main main main main main garight garightau'
    'galeft belowg belowg belowg belowg belowg belowg garight garightau'
    'galeft belowg belowg belowg belowg belowg belowg garight garightau'
    'galeft belowAr belowAr belowAr belowAr belowAr belowAr garight garightau'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'desc desc desc desc desc desc desc desc desc'
    'footer footer footer footer footer footer footer footer footer';
    }
    .tabsundergame {position:absolute;}
    .gmiddle, #gameholder {width: 1088px;height: 620px;}
    #gWagon_wrap{width: 100%; height: 100%; }
    .grid-item_listing-pro picture img {border:0}
    .undergameMore {width:100%; grid-area:belowAr;
        flex-flow: row wrap;
        box-sizing: border-box;
        justify-content: space-evenly;
        grid-template-columns: repeat(6, 178px);
        overflow: hidden;
        height: 100px;
    }
    .grid-item_listing-pro_cont{grid-template-columns:none; grid-gap:4px;justify-content: center;}
    .grid-item_listing-pro{ width: 178px;height: 100px; padding: 0;display: block; position: relative; }
    .gcolumn {width:60px}
    .galeft {display: block;display:flex; flex-flow: row wrap; gap: 4px; }
    .garightau {display: block; display:flex; flex-flow: row wrap; gap: 4px; }
    .desc { display: flex; flex-direction: column; }
    .gright {display: block; gap: 4px;}
    .desc_video_inner {display:flex; position: relative;justify-content: center; align-items: center}
    .walkthroughContainer {padding: 1.5% 2%}
    #game_did {width: 100%; height: calc( 100% - 45px)}
    #howto {margin-top:3px; display:block}
}
@media (min-width: 2270px) {
    .grid-container {
        display: grid;
        gap: 8px;
        grid-template-columns: repeat(9,196px);
        grid-template-rows: repeat(9,113px);
        grid-template-areas:
   'galeft main main main main main main garightau_alt garightau_alt'
   'galeft main main main main main main garightau_alt garightau_alt'
   'galeft main main main main main main garightau_alt garightau_alt'
   'galeft main main main main main main garightau_alt garightau_alt'
   'galeft main main main main main main garightau_alt garightau_alt'
   'galeft main main main main main main garightau_alt garightau_alt'
   'galeft belowg belowg belowg belowg belowg belowg garightau_alt garightau_alt'
   'galeft belowAr belowAr belowAr belowAr belowAr belowAr garightau_alt garightau_alt'
   'desc desc desc desc desc desc desc desc desc'
   'desc desc desc desc desc desc desc desc desc'
   'desc desc desc desc desc desc desc desc desc'
   'desc desc desc desc desc desc desc desc desc'
   'desc desc desc desc desc desc desc desc desc'
   'desc desc desc desc desc desc desc desc desc'
   'desc desc desc desc desc desc desc desc desc'
   'footer footer footer footer footer footer footer footer footer';
    }
    .tabsundergame {position:absolute;}
    .gmiddle {width: 1216px;height: 716px;margin-top:4px}
    #gameholder {width: 1216px;height:716px;}
    #gWagon_wrap{width: 100%; height: 100%;}
    .rresp {width: 1216px; height: 116px}
    .undergameMore {width:100%; grid-area:belowAr;
        flex-flow: row wrap; box-sizing: border-box;
        justify-content: space-evenly;
        grid-template-columns: repeat(6, 196px);
        overflow: hidden; height: 104px; gap: 4px;  }
    .grid-item_listing-pro_cont{grid-template-columns:none; grid-gap:0;justify-content: center;}
    .grid-item_listing-pro{
        width: 178px; height: 100px;
        margin: 1px; padding: 0; box-sizing: border-box; display: block; position: relative;
    }
    .gcolumn {width:60px}
    .galeft {display: block;display:flex; flex-flow: row wrap;  justify-content: flex-end;gap:4px}
    .garightau {display: none; flex-flow: row wrap; }
    .garightau_alt {display: block; display:flex; flex-flow: row wrap;gap:4px; height: max-content;}
    .garightau_2x2 {display: block; flex-flow: row wrap; width: 370px; height: 313px;}
    .garightau_2x2-content {display:block; width: 370px; max-height: 313px;}
    .grid-item_listing-pro picture img {border:0}
    .desc { display: flex; flex-direction: column; }
    .gright {display: none; padding-left: 4px; }
    .desc_video_inner {display:flex; position: relative;justify-content: center; align-items: center}
    .walkthroughContainer {padding: 1.5% 2%}
    #gameholder {position: relative; }
    #game_did {width: 100%; height: calc( 100% - 45px)}
    #howto {margin-top:3px; display:block}
}
@media screen and (max-width: 1199.95px)
{
    .grid-container {
        grid-template-areas:
    'main'
    'belowg'
    'belowAr'
    'footer';
        grid-template-columns: 1fr;
    }
    .gright {display: none}
    div#container {width: 100%}
    .gfooter {z-index:2}
    .desc_innerText { padding: 45px 2% 1.4%;}
    .gamevido_play::after {background-color: rgba(12, 12, 12, 0.7);}
}
@media (min-width: 780px) and (max-width: 1200px)
{
    .grid-container {grid-template-areas:
    'main'
    'belowg'
    'belowAr'
    'desc'
    'footer';
        grid-template-columns: 1fr;
    }
    .desc {display:block; height: fit-content}
    .desc_inner {padding: 5px 27px 15px 27px}
    .gameImgo_play img { min-height: 231px; width:100%; object-fit: cover; opacity: 0.6; aspect-ratio: 800 / 600}
    #gameholder {width: calc(100%); height: auto; aspect-ratio: 800 / 600}
    .walkthroughContainer {float: none;display:block; margin: 0 auto; height: 0; text-align:center;position:relative;
        top: 0;width:100%; padding-bottom: 56.25%;padding-left: 0; padding-right: 0}
    .walkthroughContainer iframe {  position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
    .belowWalkthrough {width:100%;margin:0 auto; height: 35px;position: relative;  top: 0px; }
    .desc_innerFooter, .desc_inner {border-radius: 0}
    /* .desc { display: flex; flex-direction: column; } */
}
@media screen and (max-width: 779px)
{
    .grid-container {grid-template-areas:
    'main'
    'belowg'
    'belowAr'
    'desc'
    'footer';
        grid-template-columns: 1fr;
    }
    .desc {display:block; height: fit-content}
    .desc_inner {padding: 0.75% 2%;}
    .desc_innerFooter {padding: 2.5%}
    .desc_innerFooter, .desc_inner {border-radius: 0}
    .walkthroughContainer {float: none;display:block; margin: 2px auto; height: 0; text-align:center;position:relative;
        margin-top: 0;width:100%; padding-bottom: 56.25%;padding-left: 0; padding-right: 0; max-width:1024px}
    .walkthroughContainer iframe {  position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
    .belowWalkthrough {width:100%;margin:0 auto; height: 35px;position: relative;  top: 0; }
    #gameholder {width: 100%; height: auto; aspect-ratio: 800 / 600}
    .tags_undergame { flex-flow: row wrap;gap: 12px;}
    .gright {display: none}
    #main{padding:0}
}
.rresp { width: calc(100vw); height: 255px; margin:0 auto;}
@media only screen and (min-width: 320px) { .rresp { width: calc(100vw); min-width: 320px; height: 255px; margin:0 auto;}}
@media only screen and (min-width: 360px) { .rresp { width: calc(100vw); min-width: 360px; height: 312px} #walkthroughButton{display:none} #ytapi {padding:4px 5px 0 0; width: 120px; overflow:hidden}}
@media only screen and (min-width: 390px) { .rresp { width: calc(100vw); min-width: 386px; height: 327px}}
@media only screen and (min-width: 410px) { .rresp { width: calc(100vw); min-width: 404px; height: 345px}}
@media only screen and (min-width: 414px) { .rresp { width: calc(100vw); min-width: 410px; height: 355px}}
@media only screen and (min-width: 470px) { .rresp { width: calc(100vw); min-width: 466px; height: 250px}}
@media only screen and (min-width: 530px) { .rresp { width: calc(100vw); min-width: 526px; height: 94px}}
@media only screen and (min-width: 596px) { .rresp { width: calc(100vw); min-width: 592px; height: 94px}}
@media only screen and (min-width: 620px) { .rresp { width: calc(100vw); min-width: 616px; height: 94px}}
@media only screen and (min-width: 680px) { .rresp { width: calc(100vw); min-width: 676px; height: 94px}}
@media only screen and (min-width: 730px) { .rresp { width: calc(100vw); min-width: 726px; height: 94px}}
@media only screen and (min-width: 768px) { .rresp { width: calc(100vw); min-width: 764px; height: 94px} #ytapi {padding:4px 1.2% 0 0;width:126px}}
@media only screen and (min-width: 800px) { .rresp { width: calc(100vw); min-width: 796px; height: 94px}}
@media only screen and (min-width: 844px) { .rresp { width: calc(100vw); min-width: 840px; height: 94px}}
@media only screen and (min-width: 869px) { .rresp { width: calc(100vw); min-width: 865px; height: 94px}}
@media only screen and (min-width: 896px) { .rresp { width: calc(100vw); min-width: 892px; height: 94px}}
@media only screen and (min-width: 940px) { .rresp { width: calc(100vw); min-width: 936px; height: 94px}}
@media only screen and (min-width: 980px) { .rresp { width: calc(100vw); min-width: 976px; height: 94px}}
@media only screen and (min-width: 1024px) { .rresp { width: calc(100vw); min-width: 1020px; height: 94px} #ytapi {padding:4px 1.7% 0 0; width: 130px;}}
@media only screen and (min-width: 1080px) { .rresp { width: calc(100vw);  height: 196px}}
@media only screen and (min-width: 1140px) { .rresp { width: calc(100vw); height: 196px}}
@media only screen and (min-width: 1200px) { .rresp { width: 748px; min-width: 748px; height: 158px}lite-youtube {width: 720px}}
@media only screen and (min-width: 1359px) { .rresp { width: 900px; height: 208px}}
@media only screen and (min-width: 1560px) { .rresp { width: 900px; height: 200px}}
@media only screen and (min-width: 1770px) { .rresp { width: 1084px; height: 200px}}
@media only screen and (min-width: 1920px) { .rresp { width: 1084px; height: 200px}}
@media only screen and (min-width: 2270px) { .rresp { width: 100%; height: 108px}}
/* if prerollad */
#splashScreen {
    z-index: 6; width: 100%; display:none;
    text-align: center; flex-direction: column;
    height: 100%; background-color: #09181F;
    /* align-items: center; */
    position: absolute; justify-content: center;
}
#pregamediv { overflow-y:hidden;width: 100%; height: 100%;}
#gotoPlayBut {
    margin: 1% auto; padding: 2.2% 8%; color: #FFF; text-align: center; border: 0; cursor: pointer; z-index: 4;
    background-color: #5198ce;-webkit-border-radius: 5px 5px;
    -moz-border-radius: 5px 5px; border-radius: 5px 5px;
    font-size: 1.3em;font-family: 'Righteous', Helvetica;
}
.buttonRum { margin: 0 auto; padding: 2% 5%; width:100%;z-index:116;
}
#notonthis { z-index:116;margin:0 auto; width: 90%;cursor: default; }
#ghtmlname {
    color: #000;  font-size: 1em;
    padding: 1.5%; text-align: center;
    overflow: hidden; background: linear-gradient(to left,#0000 17%,#fff7 50%,#0000 83%);
    z-index:13; cursor: default;
}
#blurry {
    position: absolute; z-index: 2; background-size: cover;
    filter: blur(8px) brightness(1.1);
    width: 100%; height: 100%;
    /* calc( 100% - 45px ); */
    /* transform: scale(0.98); */
    overflow:hidden;
}
#adContainer {margin:0 auto; width:100%; height:100%}
#adsContainer { z-index: 5; position: relative; top: 0; left: 0; width: 100%; height: 100%;}
#videoElement { position: absolute; top: 0; left: 0; visibility:hidden;}
#large_flash_game_box {grid-area: main;overflow:hidden;   height:calc( 100% - 4px )
}
.gamevido_play{ height: 100%;}
.gamevido_play video { height: 100%; width: 100%; object-fit: cover}
.gamevido_play::after { content: ""; position: absolute; inset: 0; background-color: rgba(12, 12, 12, 0.8);z-index: 1;width: 100%; height: 100%;  object-fit: cover;}
.gameImgo_play{ height: 100%;width: 100%;}
.gameImgo_play img { min-height: 231px; width:100%; object-fit: cover; opacity: 0.6; aspect-ratio: 800 / 600}
.gameImgo_play::after{ content: "";position: absolute;inset: 0;z-index: 1;object-fit: cover }
.tabsundergame { width: 100% }
#floating-snap-btn-wrapper {
    display:none; position: absolute; transform: translate(-50%, -50%);
    top: 30%; left: 20px; width: 40px; height: 40px;
}
#endFullscr {
    position: absolute; top: 0; left: 0; display: flex; justify-content: center;
    align-items: center; width: 100%; height: 100%; background-color: #00000055;
    color: white; z-index: 1000; box-shadow: 0 2px 12px -1px rgba(0,0,0,0.3);
}
&.left {
li:nth-child(1) { top: 0%; left: 300%; transition-delay: 0s;}
li:nth-child(2) { top: 0%; left: 200%; transition-delay: 0.2s;}
li:nth-child(3) { top: 0%; left: 100%; transition-delay: 0.4s;}
}
&.right {
li:nth-child(1) { top: 0%; left: -300%; transition-delay: 0s; }
li:nth-child(2) { top: 0%; left: -200%; transition-delay: 0.2s; }
li:nth-child(3) { top: 0%; left: -100%; transition-delay: 0.4s; }
}
lite-youtube {
    background-color: #000;position: relative;display: block;
    contain: content;background-position: center center;
    background-size: cover;cursor: pointer;max-width: 1024px;margin: 0 auto;
}
lite-youtube::before {
    content: ''; display: block;position: absolute; top: 0;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==);
    background-position: top; background-repeat: repeat-x;
    height: 60px; padding-bottom: 50px; width: 100%;
    transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
}
/* responsive iframe with a 16:9 aspect ratio*/
lite-youtube::after { content: ""; display: block; padding-bottom: calc(100% / (16 / 9));}
lite-youtube > iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: 0;}
/* play button */
lite-youtube > .lty-playbtn {
    display: block; width: 68px; height: 48px; position: absolute;cursor: pointer;
    transform: translate3d(-50%, -50%, 0); top: 50%; left: 50%;z-index: 1; background-color: transparent;
    /* YT's actual play button svg */
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 68 48"><path d="M66.52 7.74c-.78-2.93-2.49-5.41-5.42-6.19C55.79.13 34 0 34 0S12.21.13 6.9 1.55c-2.93.78-4.63 3.26-5.42 6.19C.06 13.05 0 24 0 24s.06 10.95 1.48 16.26c.78 2.93 2.49 5.41 5.42 6.19C12.21 47.87 34 48 34 48s21.79-.13 27.1-1.55c2.93-.78 4.64-3.26 5.42-6.19C67.94 34.95 68 24 68 24s-.06-10.95-1.48-16.26z" fill="red"/><path d="M45 24 27 14v20" fill="white"/></svg>');
    filter: grayscale(100%); transition: filter .1s cubic-bezier(0, 0, 0.2, 1); border: none;
}
lite-youtube:hover > .lty-playbtn,
lite-youtube .lty-playbtn:focus { filter: none;}
/* Post-click styles */
lite-youtube.lyt-activated { cursor: unset;}
lite-youtube.lyt-activated::before,
lite-youtube.lyt-activated > .lty-playbtn { opacity: 0; pointer-events: none;}
.lyt-visually-hidden {clip: rect(0 0 0 0); clip-path: inset(50%);height: 1px;overflow: hidden;position: absolute; white-space: nowrap; width: 1px;}
#howTo-container {margin: 20px; padding-bottom: 6px; border: 6px solid #2C566Af7;border-radius: 10px 10px; background: #101C22ee; box-shadow: 2px 2px 0 #11111144;
    position: absolute; right: 0px; bottom: 45px; max-width: 65%; min-height: 13%; min-width: 27%; max-height: 82%;transition: opacity 250ms ease-in-out 0.9s;-webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.9s ease-in-out; transition: opacity 0.9s ease-in-out;opacity: 1}
#howTo-container h2 {margin-block-start: 0px;margin-block-end: 8px;}
#xhowto { position: absolute; top: -16px; right: -16px; width: 35px; height: 35px;
    background-color: #2C566Af7; border-radius: 50%; border: 4px solid #2C566Af7; z-index: 1;}
#xhowto_inner {
    background: #2C566Af7;color: #000000;padding: 0px;width: 27px;min-width: 27px;height: 27px;
    border-radius: 30px;transition: all 250ms ease 0s;border: none;cursor: pointer;
    display: flex;-webkit-box-pack: center;justify-content: center;-webkit-box-align: center;align-items: center;}