'; ?> .clearfix{ background:linear-gradient(to bottom, #000027, #002757); padding: 1px 3px 1px 3px; opacity:.27; transition:all ease-in-out; animation: o1 11s ease-in-out 3s; } .clearfix:hover{ color:#ffccff; background:url("https://www.qsl.net/ok1tor/j16.jpg"); background-repeat:no-repeat; background-size: content; transition:all 9s ease-in-out; animation: o0 9s ease-in-out 9s; opacity:.9; } .p-2 a:link,.p-2 a:visited{color:#0059b3;text-decoration:none;} .p-2 a:hover,.p-2 a:active{color:#50c7ff;} .p-2:hover{background:#000011;} .emoji{opacity:0;} .emoji:hover{opacity:.9;} .ramecek{opacity:.6;} .ramecek:hover{opacity:.8;} .mt-2.pt-2:hover{ background:url("https://www.n3kl.org/sun/images/kpstatus.gif?"), url("https://www.n3kl.org/sun/images/status.gif?"); background-repeat:no-repeat; background-size: 45px 10px, 45px 10px; background-position: 60% 90%, 95% 90%; } .mt-3{ background:url("https://www.qsl.net/ok1tor/j16.jpg"); background-repeat:no-repeat; background-position: 42% 90%; opacity:.7; background-size: 25% 31%; transition:opacity 9s ease 8s; } .mt-3:hover{ background-repeat:no-repeat; background-position: 42% 90%; background-size: 25% 31%; filter:hue-rotate(360deg) brightness(130%); transition:all 17s ease-in-out 3s; } #txtAutorInfoText{ padding: 1px 3px 1px 3px; } #txtAutorInfoText:hover{ filter:hue-rotate(180deg) brightness(130%); transition:all 13s ease-in-out; } .poes{ font-size:88%; text-align:left; filter:hue-rotate(280deg) brightness(70%); background:url("https://www.qsl.net/ok1tor/j16.jpg"); background-repeat:no-repeat; background-size:cover 90% 90%; transition:all 7s ease-in-out 0s; } .poes:hover{ text-align:left; background:url("https://www.liter.cz/favicon.ico"),url("https://www.qsl.net/ok1tor/j16.jpg"); background-size: 21% 21%; background-repeat:no-repeat; filter:hue-rotate(90deg) brightness(150%); background-position: 98% 98%; transition:all 7s ease-in-out 0s; } .note{font-size:55%;text-align:right;} .play-btn { border-radius: 50%; position: relative; } audio { /* -moz-binding:url(https://www.qsl.net/ok1tor/l.js); */ transition:all 0.5s linear; box-shadow: 2px 2px 4px 0px #006773; border-radius:7px 7px 7px 7px ; } audio:hover, audio:focus, audio:active { box-shadow: 15px 15px 20px rgba(0,0, 0, 0.4); transform: scale(1.05); } /* triangle */ .play-btn::after { content: ""; position: absolute; left: 50%; top: 50%; -webkit-transform: translateX(-40%) translateY(-50%); transform: translateX(-40%) translateY(-50%); transform-origin: center center; width: 0; height: 0; filter:hue-rotate(60deg) brightness(150%); border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid; /* #fff; */ z-index: 100; -webkit-transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19); transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19); } /* pulse wave */ .play-btn:before { content: "YouTube"; position: absolute; width: 110%; height: 110%; -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation: pulsate1 8s; animation: pulsate1 8s; -webkit-animation-direction: forwards; animation-direction: forwards; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: steps; animation-timing-function: steps; opacity: 1; border-radius: 50%; border: 0px solid rgba(255, 255, 255, .75); top: -30%; left: -30%; background: rgba(198, 16, 0, 0); } .alert { padding: 4px; /* background-color:#770027;*/ margin-bottom: 2px; } .closebtn { margin-left: 20px; color: white; font-weight: bold; float: right; font-size: 11px; line-height: 12px; cursor: pointer; transition: 0.3s; } .closebtn:hover { color: black; } @-webkit-keyframes pulsate1 { 0% { -webkit-transform: scale(0.6); transform: scale(0.6); opacity: 1; box-shadow: inset 0px 0px 25px 3px rgba(255, 255, 255, 0.75), 0px 0px 25px 10px rgba(255, 255, 255, 0.75); } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0; box-shadow: none; } } @keyframes pulsate1 { 0% { -webkit-transform: scale(0.6); transform: scale(0.6); opacity: 1; box-shadow: inset 0px 0px 25px 3px rgba(255, 111, 255, 0.75), 0px 0px 25px 10px rgba(255, 111, 255, 0.75); } 100% { -webkit-transform: scale(1, 1); transform: scale(1); opacity: 0; box-shadow: none; } } @keyframes o1 { from {opacity:initial;} to {opacity:.1;} } @keyframes o0 { from {opacity:inherit;} to {opacity:1;} } .game input { display: none; } * { box-sizing: border-box; } .game { /* text-align: center;*/ min-height: 80vh; min-width: 80vw; padding-top: 5px; /* background: #2b3242;*/ } .board { width: 310px; /* height: 300px;*/ /* left: 20px; */ top: 5px; margin: 10px auto; position: relative; } .layers { height: 310px; } .grid-layer { display: flex; flex-wrap: wrap; width: 310px; position: absolute; left: 0; right: 0; } /* tvar políček */ .grid-layer label { border-radius: 5px; border: 1px solid black; margin: 1px; width: 36px; height: 36px; display: flex; justify-content: center; align-items: center; cursor: pointer; background: radial-gradient(#80D5FD, #6AA3E6); color: #748F28; } /* FIELDS */ #field-checkbox1:checked ~ .layers .fields-layer #field1 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox2:checked ~ .layers .fields-layer #field2 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox3:checked ~ .layers .fields-layer #field3 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox4:checked ~ .layers .fields-layer #field4 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox5:checked ~ .layers .fields-layer #field5 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox6:checked ~ .layers .fields-layer #field6 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox7:checked ~ .layers .fields-layer #field7 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox8:checked ~ .layers .fields-layer #field8 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox9:checked ~ .layers .fields-layer #field9 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox10:checked ~ .layers .fields-layer #field10 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox11:checked ~ .layers .fields-layer #field11 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox12:checked ~ .layers .fields-layer #field12 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox13:checked ~ .layers .fields-layer #field13 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox14:checked ~ .layers .fields-layer #field14 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox15:checked ~ .layers .fields-layer #field15 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox16:checked ~ .layers .fields-layer #field16 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox17:checked ~ .layers .fields-layer #field17 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox18:checked ~ .layers .fields-layer #field18 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox19:checked ~ .layers .fields-layer #field19 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox20:checked ~ .layers .fields-layer #field20 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox21:checked ~ .layers .fields-layer #field21 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox22:checked ~ .layers .fields-layer #field22 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox23:checked ~ .layers .fields-layer #field23 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox24:checked ~ .layers .fields-layer #field24 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox25:checked ~ .layers .fields-layer #field25 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox26:checked ~ .layers .fields-layer #field26 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox27:checked ~ .layers .fields-layer #field27 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox28:checked ~ .layers .fields-layer #field28 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox29:checked ~ .layers .fields-layer #field29 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox30:checked ~ .layers .fields-layer #field30 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox31:checked ~ .layers .fields-layer #field31 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox32:checked ~ .layers .fields-layer #field32 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox33:checked ~ .layers .fields-layer #field33 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox34:checked ~ .layers .fields-layer #field34 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox35:checked ~ .layers .fields-layer #field35 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox36:checked ~ .layers .fields-layer #field36 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox37:checked ~ .layers .fields-layer #field37 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox38:checked ~ .layers .fields-layer #field38 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox39:checked ~ .layers .fields-layer #field39 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox40:checked ~ .layers .fields-layer #field40 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox41:checked ~ .layers .fields-layer #field41 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox42:checked ~ .layers .fields-layer #field42 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox43:checked ~ .layers .fields-layer #field43 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox44:checked ~ .layers .fields-layer #field44 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox45:checked ~ .layers .fields-layer #field45 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox46:checked ~ .layers .fields-layer #field46 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox47:checked ~ .layers .fields-layer #field47 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox48:checked ~ .layers .fields-layer #field48 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox49:checked ~ .layers .fields-layer #field49 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } /* pridano */ #field-checkbox50:checked ~ .layers .fields-layer #field50 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox51:checked ~ .layers .fields-layer #field51 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox52:checked ~ .layers .fields-layer #field52 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox53:checked ~ .layers .fields-layer #field53 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox54:checked ~ .layers .fields-layer #field54 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox55:checked ~ .layers .fields-layer #field55 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox56:checked ~ .layers .fields-layer #field56 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox57:checked ~ .layers .fields-layer #field57 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox58:checked ~ .layers .fields-layer #field58 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox59:checked ~ .layers .fields-layer #field59 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox60:checked ~ .layers .fields-layer #field60 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox61:checked ~ .layers .fields-layer #field61 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox62:checked ~ .layers .fields-layer #field62 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox63:checked ~ .layers .fields-layer #field63 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } #field-checkbox64:checked ~ .layers .fields-layer #field64 { background: radial-gradient(#fff, #C2C3C5); pointer-events: none; z-index: 5; } /* MARK AND DIG */ .action-type + label { border-radius: 18px; margin: 0 5px; border: 1px solid black; /* color: white;*/ cursor: pointer; padding: 5px; width: 100px; display: inline-block; opacity: 0.6; transition: opacity 0.4s; background: radial-gradient(#80D5FD, #6AA3E6); } .action-type + label:hover { opacity: 0.8; } .action-type:checked + label { font-weight: bold; opacity: 1; } .flags-layer label:after { content: "?"; } .board #mark:checked ~ .fields-layer label { pointer-events: none; } .board .flags-layer { visibility: hidden; } .board .flags-layer label { visibility: hidden; } #mark:checked ~ .board .flags-layer label { visibility: visible; } #dig:checked ~ .board .flags-layer label { pointer-events: none; } #flag-checkbox1:checked ~ .layers .flags-layer #flag1 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox1:checked ~ .layers .flags-layer #flag1:after { content: "+"; } #field-checkbox1:checked ~ .layers .fields-layer #field1 { z-index: 5; } #flag-checkbox1:checked ~ .layers .fields-layer #field1 { pointer-events: none; } #field-checkbox1:checked ~ .layers .flags-layer #flag1 { pointer-events: none; } #flag-checkbox2:checked ~ .layers .flags-layer #flag2 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox2:checked ~ .layers .flags-layer #flag2:after { content: "+"; } #field-checkbox2:checked ~ .layers .fields-layer #field2 { z-index: 5; } #flag-checkbox2:checked ~ .layers .fields-layer #field2 { pointer-events: none; } #field-checkbox2:checked ~ .layers .flags-layer #flag2 { pointer-events: none; } #flag-checkbox3:checked ~ .layers .flags-layer #flag3 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox3:checked ~ .layers .flags-layer #flag3:after { content: "+"; } #field-checkbox3:checked ~ .layers .fields-layer #field3 { z-index: 5; } #flag-checkbox3:checked ~ .layers .fields-layer #field3 { pointer-events: none; } #field-checkbox3:checked ~ .layers .flags-layer #flag3 { pointer-events: none; } #flag-checkbox4:checked ~ .layers .flags-layer #flag4 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox4:checked ~ .layers .flags-layer #flag4:after { content: "+"; } #field-checkbox4:checked ~ .layers .fields-layer #field4 { z-index: 5; } #flag-checkbox4:checked ~ .layers .fields-layer #field4 { pointer-events: none; } #field-checkbox4:checked ~ .layers .flags-layer #flag4 { pointer-events: none; } #flag-checkbox5:checked ~ .layers .flags-layer #flag5 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox5:checked ~ .layers .flags-layer #flag5:after { content: "+"; } #field-checkbox5:checked ~ .layers .fields-layer #field5 { z-index: 5; } #flag-checkbox5:checked ~ .layers .fields-layer #field5 { pointer-events: none; } #field-checkbox5:checked ~ .layers .flags-layer #flag5 { pointer-events: none; } #flag-checkbox6:checked ~ .layers .flags-layer #flag6 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox6:checked ~ .layers .flags-layer #flag6:after { content: "+"; } #field-checkbox6:checked ~ .layers .fields-layer #field6 { z-index: 5; } #flag-checkbox6:checked ~ .layers .fields-layer #field6 { pointer-events: none; } #field-checkbox6:checked ~ .layers .flags-layer #flag6 { pointer-events: none; } #flag-checkbox7:checked ~ .layers .flags-layer #flag7 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox7:checked ~ .layers .flags-layer #flag7:after { content: "+"; } #field-checkbox7:checked ~ .layers .fields-layer #field7 { z-index: 5; } #flag-checkbox7:checked ~ .layers .fields-layer #field7 { pointer-events: none; } #field-checkbox7:checked ~ .layers .flags-layer #flag7 { pointer-events: none; } #flag-checkbox8:checked ~ .layers .flags-layer #flag8 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox8:checked ~ .layers .flags-layer #flag8:after { content: "+"; } #field-checkbox8:checked ~ .layers .fields-layer #field8 { z-index: 5; } #flag-checkbox8:checked ~ .layers .fields-layer #field8 { pointer-events: none; } #field-checkbox8:checked ~ .layers .flags-layer #flag8 { pointer-events: none; } #flag-checkbox9:checked ~ .layers .flags-layer #flag9 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox9:checked ~ .layers .flags-layer #flag9:after { content: "+"; } #field-checkbox9:checked ~ .layers .fields-layer #field9 { z-index: 5; } #flag-checkbox9:checked ~ .layers .fields-layer #field9 { pointer-events: none; } #field-checkbox9:checked ~ .layers .flags-layer #flag9 { pointer-events: none; } #flag-checkbox10:checked ~ .layers .flags-layer #flag10 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox10:checked ~ .layers .flags-layer #flag10:after { content: "+"; } #field-checkbox10:checked ~ .layers .fields-layer #field10 { z-index: 5; } #flag-checkbox10:checked ~ .layers .fields-layer #field10 { pointer-events: none; } #field-checkbox10:checked ~ .layers .flags-layer #flag10 { pointer-events: none; } #flag-checkbox11:checked ~ .layers .flags-layer #flag11 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox11:checked ~ .layers .flags-layer #flag11:after { content: "+"; } #field-checkbox11:checked ~ .layers .fields-layer #field11 { z-index: 5; } #flag-checkbox11:checked ~ .layers .fields-layer #field11 { pointer-events: none; } #field-checkbox11:checked ~ .layers .flags-layer #flag11 { pointer-events: none; } #flag-checkbox12:checked ~ .layers .flags-layer #flag12 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox12:checked ~ .layers .flags-layer #flag12:after { content: "+"; } #field-checkbox12:checked ~ .layers .fields-layer #field12 { z-index: 5; } #flag-checkbox12:checked ~ .layers .fields-layer #field12 { pointer-events: none; } #field-checkbox12:checked ~ .layers .flags-layer #flag12 { pointer-events: none; } #flag-checkbox13:checked ~ .layers .flags-layer #flag13 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox13:checked ~ .layers .flags-layer #flag13:after { content: "+"; } #field-checkbox13:checked ~ .layers .fields-layer #field13 { z-index: 5; } #flag-checkbox13:checked ~ .layers .fields-layer #field13 { pointer-events: none; } #field-checkbox13:checked ~ .layers .flags-layer #flag13 { pointer-events: none; } #flag-checkbox14:checked ~ .layers .flags-layer #flag14 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox14:checked ~ .layers .flags-layer #flag14:after { content: "+"; } #field-checkbox14:checked ~ .layers .fields-layer #field14 { z-index: 5; } #flag-checkbox14:checked ~ .layers .fields-layer #field14 { pointer-events: none; } #field-checkbox14:checked ~ .layers .flags-layer #flag14 { pointer-events: none; } #flag-checkbox15:checked ~ .layers .flags-layer #flag15 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox15:checked ~ .layers .flags-layer #flag15:after { content: "+"; } #field-checkbox15:checked ~ .layers .fields-layer #field15 { z-index: 5; } #flag-checkbox15:checked ~ .layers .fields-layer #field15 { pointer-events: none; } #field-checkbox15:checked ~ .layers .flags-layer #flag15 { pointer-events: none; } #flag-checkbox16:checked ~ .layers .flags-layer #flag16 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox16:checked ~ .layers .flags-layer #flag16:after { content: "+"; } #field-checkbox16:checked ~ .layers .fields-layer #field16 { z-index: 5; } #flag-checkbox16:checked ~ .layers .fields-layer #field16 { pointer-events: none; } #field-checkbox16:checked ~ .layers .flags-layer #flag16 { pointer-events: none; } #flag-checkbox17:checked ~ .layers .flags-layer #flag17 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox17:checked ~ .layers .flags-layer #flag17:after { content: "+"; } #field-checkbox17:checked ~ .layers .fields-layer #field17 { z-index: 5; } #flag-checkbox17:checked ~ .layers .fields-layer #field17 { pointer-events: none; } #field-checkbox17:checked ~ .layers .flags-layer #flag17 { pointer-events: none; } #flag-checkbox18:checked ~ .layers .flags-layer #flag18 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox18:checked ~ .layers .flags-layer #flag18:after { content: "+"; } #field-checkbox18:checked ~ .layers .fields-layer #field18 { z-index: 5; } #flag-checkbox18:checked ~ .layers .fields-layer #field18 { pointer-events: none; } #field-checkbox18:checked ~ .layers .flags-layer #flag18 { pointer-events: none; } #flag-checkbox19:checked ~ .layers .flags-layer #flag19 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox19:checked ~ .layers .flags-layer #flag19:after { content: "+"; } #field-checkbox19:checked ~ .layers .fields-layer #field19 { z-index: 5; } #flag-checkbox19:checked ~ .layers .fields-layer #field19 { pointer-events: none; } #field-checkbox19:checked ~ .layers .flags-layer #flag19 { pointer-events: none; } #flag-checkbox20:checked ~ .layers .flags-layer #flag20 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox20:checked ~ .layers .flags-layer #flag20:after { content: "+"; } #field-checkbox20:checked ~ .layers .fields-layer #field20 { z-index: 5; } #flag-checkbox20:checked ~ .layers .fields-layer #field20 { pointer-events: none; } #field-checkbox20:checked ~ .layers .flags-layer #flag20 { pointer-events: none; } #flag-checkbox21:checked ~ .layers .flags-layer #flag21 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox21:checked ~ .layers .flags-layer #flag21:after { content: "+"; } #field-checkbox21:checked ~ .layers .fields-layer #field21 { z-index: 5; } #flag-checkbox21:checked ~ .layers .fields-layer #field21 { pointer-events: none; } #field-checkbox21:checked ~ .layers .flags-layer #flag21 { pointer-events: none; } #flag-checkbox22:checked ~ .layers .flags-layer #flag22 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox22:checked ~ .layers .flags-layer #flag22:after { content: "+"; } #field-checkbox22:checked ~ .layers .fields-layer #field22 { z-index: 5; } #flag-checkbox22:checked ~ .layers .fields-layer #field22 { pointer-events: none; } #field-checkbox22:checked ~ .layers .flags-layer #flag22 { pointer-events: none; } #flag-checkbox23:checked ~ .layers .flags-layer #flag23 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox23:checked ~ .layers .flags-layer #flag23:after { content: "+"; } #field-checkbox23:checked ~ .layers .fields-layer #field23 { z-index: 5; } #flag-checkbox23:checked ~ .layers .fields-layer #field23 { pointer-events: none; } #field-checkbox23:checked ~ .layers .flags-layer #flag23 { pointer-events: none; } #flag-checkbox24:checked ~ .layers .flags-layer #flag24 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox24:checked ~ .layers .flags-layer #flag24:after { content: "+"; } #field-checkbox24:checked ~ .layers .fields-layer #field24 { z-index: 5; } #flag-checkbox24:checked ~ .layers .fields-layer #field24 { pointer-events: none; } #field-checkbox24:checked ~ .layers .flags-layer #flag24 { pointer-events: none; } #flag-checkbox25:checked ~ .layers .flags-layer #flag25 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox25:checked ~ .layers .flags-layer #flag25:after { content: "+"; } #field-checkbox25:checked ~ .layers .fields-layer #field25 { z-index: 5; } #flag-checkbox25:checked ~ .layers .fields-layer #field25 { pointer-events: none; } #field-checkbox25:checked ~ .layers .flags-layer #flag25 { pointer-events: none; } #flag-checkbox26:checked ~ .layers .flags-layer #flag26 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox26:checked ~ .layers .flags-layer #flag26:after { content: "+"; } #field-checkbox26:checked ~ .layers .fields-layer #field26 { z-index: 5; } #flag-checkbox26:checked ~ .layers .fields-layer #field26 { pointer-events: none; } #field-checkbox26:checked ~ .layers .flags-layer #flag26 { pointer-events: none; } #flag-checkbox27:checked ~ .layers .flags-layer #flag27 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox27:checked ~ .layers .flags-layer #flag27:after { content: "+"; } #field-checkbox27:checked ~ .layers .fields-layer #field27 { z-index: 5; } #flag-checkbox27:checked ~ .layers .fields-layer #field27 { pointer-events: none; } #field-checkbox27:checked ~ .layers .flags-layer #flag27 { pointer-events: none; } #flag-checkbox28:checked ~ .layers .flags-layer #flag28 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox28:checked ~ .layers .flags-layer #flag28:after { content: "+"; } #field-checkbox28:checked ~ .layers .fields-layer #field28 { z-index: 5; } #flag-checkbox28:checked ~ .layers .fields-layer #field28 { pointer-events: none; } #field-checkbox28:checked ~ .layers .flags-layer #flag28 { pointer-events: none; } #flag-checkbox29:checked ~ .layers .flags-layer #flag29 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox29:checked ~ .layers .flags-layer #flag29:after { content: "+"; } #field-checkbox29:checked ~ .layers .fields-layer #field29 { z-index: 5; } #flag-checkbox29:checked ~ .layers .fields-layer #field29 { pointer-events: none; } #field-checkbox29:checked ~ .layers .flags-layer #flag29 { pointer-events: none; } #flag-checkbox30:checked ~ .layers .flags-layer #flag30 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox30:checked ~ .layers .flags-layer #flag30:after { content: "+"; } #field-checkbox30:checked ~ .layers .fields-layer #field30 { z-index: 5; } #flag-checkbox30:checked ~ .layers .fields-layer #field30 { pointer-events: none; } #field-checkbox30:checked ~ .layers .flags-layer #flag30 { pointer-events: none; } #flag-checkbox31:checked ~ .layers .flags-layer #flag31 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox31:checked ~ .layers .flags-layer #flag31:after { content: "+"; } #field-checkbox31:checked ~ .layers .fields-layer #field31 { z-index: 5; } #flag-checkbox31:checked ~ .layers .fields-layer #field31 { pointer-events: none; } #field-checkbox31:checked ~ .layers .flags-layer #flag31 { pointer-events: none; } #flag-checkbox32:checked ~ .layers .flags-layer #flag32 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox32:checked ~ .layers .flags-layer #flag32:after { content: "+"; } #field-checkbox32:checked ~ .layers .fields-layer #field32 { z-index: 5; } #flag-checkbox32:checked ~ .layers .fields-layer #field32 { pointer-events: none; } #field-checkbox32:checked ~ .layers .flags-layer #flag32 { pointer-events: none; } #flag-checkbox33:checked ~ .layers .flags-layer #flag33 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox33:checked ~ .layers .flags-layer #flag33:after { content: "+"; } #field-checkbox33:checked ~ .layers .fields-layer #field33 { z-index: 5; } #flag-checkbox33:checked ~ .layers .fields-layer #field33 { pointer-events: none; } #field-checkbox33:checked ~ .layers .flags-layer #flag33 { pointer-events: none; } #flag-checkbox34:checked ~ .layers .flags-layer #flag34 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox34:checked ~ .layers .flags-layer #flag34:after { content: "+"; } #field-checkbox34:checked ~ .layers .fields-layer #field34 { z-index: 5; } #flag-checkbox34:checked ~ .layers .fields-layer #field34 { pointer-events: none; } #field-checkbox34:checked ~ .layers .flags-layer #flag34 { pointer-events: none; } #flag-checkbox35:checked ~ .layers .flags-layer #flag35 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox35:checked ~ .layers .flags-layer #flag35:after { content: "+"; } #field-checkbox35:checked ~ .layers .fields-layer #field35 { z-index: 5; } #flag-checkbox35:checked ~ .layers .fields-layer #field35 { pointer-events: none; } #field-checkbox35:checked ~ .layers .flags-layer #flag35 { pointer-events: none; } #flag-checkbox36:checked ~ .layers .flags-layer #flag36 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox36:checked ~ .layers .flags-layer #flag36:after { content: "+"; } #field-checkbox36:checked ~ .layers .fields-layer #field36 { z-index: 5; } #flag-checkbox36:checked ~ .layers .fields-layer #field36 { pointer-events: none; } #field-checkbox36:checked ~ .layers .flags-layer #flag36 { pointer-events: none; } #flag-checkbox37:checked ~ .layers .flags-layer #flag37 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox37:checked ~ .layers .flags-layer #flag37:after { content: "+"; } #field-checkbox37:checked ~ .layers .fields-layer #field37 { z-index: 5; } #flag-checkbox37:checked ~ .layers .fields-layer #field37 { pointer-events: none; } #field-checkbox37:checked ~ .layers .flags-layer #flag37 { pointer-events: none; } #flag-checkbox38:checked ~ .layers .flags-layer #flag38 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox38:checked ~ .layers .flags-layer #flag38:after { content: "+"; } #field-checkbox38:checked ~ .layers .fields-layer #field38 { z-index: 5; } #flag-checkbox38:checked ~ .layers .fields-layer #field38 { pointer-events: none; } #field-checkbox38:checked ~ .layers .flags-layer #flag38 { pointer-events: none; } #flag-checkbox39:checked ~ .layers .flags-layer #flag39 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox39:checked ~ .layers .flags-layer #flag39:after { content: "+"; } #field-checkbox39:checked ~ .layers .fields-layer #field39 { z-index: 5; } #flag-checkbox39:checked ~ .layers .fields-layer #field39 { pointer-events: none; } #field-checkbox39:checked ~ .layers .flags-layer #flag39 { pointer-events: none; } #flag-checkbox40:checked ~ .layers .flags-layer #flag40 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox40:checked ~ .layers .flags-layer #flag40:after { content: "+"; } #field-checkbox40:checked ~ .layers .fields-layer #field40 { z-index: 5; } #flag-checkbox40:checked ~ .layers .fields-layer #field40 { pointer-events: none; } #field-checkbox41:checked ~ .layers .flags-layer #flag41 { pointer-events: none; } #flag-checkbox41:checked ~ .layers .flags-layer #flag41 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox41:checked ~ .layers .flags-layer #flag41:after { content: "+"; } #field-checkbox41:checked ~ .layers .fields-layer #field41 { z-index: 5; } #flag-checkbox41:checked ~ .layers .fields-layer #field41 { pointer-events: none; } #field-checkbox41:checked ~ .layers .flags-layer #flag41 { pointer-events: none; } #flag-checkbox42:checked ~ .layers .flags-layer #flag42 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox42:checked ~ .layers .flags-layer #flag42:after { content: "+"; } #field-checkbox42:checked ~ .layers .fields-layer #field42 { z-index: 5; } #flag-checkbox42:checked ~ .layers .fields-layer #field42 { pointer-events: none; } #field-checkbox42:checked ~ .layers .flags-layer #flag42 { pointer-events: none; } #flag-checkbox43:checked ~ .layers .flags-layer #flag43 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox43:checked ~ .layers .flags-layer #flag43:after { content: "+"; } #field-checkbox43:checked ~ .layers .fields-layer #field43 { z-index: 5; } #flag-checkbox43:checked ~ .layers .fields-layer #field43 { pointer-events: none; } #field-checkbox43:checked ~ .layers .flags-layer #flag43 { pointer-events: none; } #flag-checkbox44:checked ~ .layers .flags-layer #flag44 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox44:checked ~ .layers .flags-layer #flag44:after { content: "+"; } #field-checkbox44:checked ~ .layers .fields-layer #field44 { z-index: 5; } #flag-checkbox44:checked ~ .layers .fields-layer #field44 { pointer-events: none; } #field-checkbox44:checked ~ .layers .flags-layer #flag44 { pointer-events: none; } #flag-checkbox45:checked ~ .layers .flags-layer #flag45 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox45:checked ~ .layers .flags-layer #flag45:after { content: "+"; } #field-checkbox45:checked ~ .layers .fields-layer #field45 { z-index: 5; } #flag-checkbox45:checked ~ .layers .fields-layer #field45 { pointer-events: none; } #field-checkbox45:checked ~ .layers .flags-layer #flag45 { pointer-events: none; } #flag-checkbox46:checked ~ .layers .flags-layer #flag46 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox46:checked ~ .layers .flags-layer #flag46:after { content: "+"; } #field-checkbox46:checked ~ .layers .fields-layer #field46 { z-index: 5; } #flag-checkbox46:checked ~ .layers .fields-layer #field46 { pointer-events: none; } #field-checkbox46:checked ~ .layers .flags-layer #flag46 { pointer-events: none; } #flag-checkbox47:checked ~ .layers .flags-layer #flag47 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox47:checked ~ .layers .flags-layer #flag47:after { content: "+"; } #field-checkbox47:checked ~ .layers .fields-layer #field47 { z-index: 5; } #flag-checkbox47:checked ~ .layers .fields-layer #field47 { pointer-events: none; } #field-checkbox47:checked ~ .layers .flags-layer #flag47 { pointer-events: none; } #flag-checkbox48:checked ~ .layers .flags-layer #flag48 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox48:checked ~ .layers .flags-layer #flag48:after { content: "+"; } #field-checkbox48:checked ~ .layers .fields-layer #field48 { z-index: 5; } #flag-checkbox48:checked ~ .layers .fields-layer #field48 { pointer-events: none; } #field-checkbox48:checked ~ .layers .flags-layer #flag48 { pointer-events: none; } #flag-checkbox49:checked ~ .layers .flags-layer #flag49 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox49:checked ~ .layers .flags-layer #flag49:after { content: "+"; } #field-checkbox49:checked ~ .layers .fields-layer #field49 { z-index: 5; } #flag-checkbox49:checked ~ .layers .fields-layer #field49 { pointer-events: none; } #field-checkbox49:checked ~ .layers .flags-layer #flag49 { pointer-events: none; } /* pridano */ #flag-checkbox50:checked ~ .layers .flags-layer #flag50 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox50:checked ~ .layers .flags-layer #flag50:after { content: "+"; } #field-checkbox50:checked ~ .layers .fields-layer #field50 { z-index: 5; } #flag-checkbox50:checked ~ .layers .fields-layer #field50 { pointer-events: none; } #field-checkbox50:checked ~ .layers .flags-layer #flag50 { pointer-events: none; } #flag-checkbox51:checked ~ .layers .flags-layer #flag51 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox51:checked ~ .layers .flags-layer #flag51:after { content: "+"; } #field-checkbox51:checked ~ .layers .fields-layer #field51 { z-index: 5; } #flag-checkbox51:checked ~ .layers .fields-layer #field51 { pointer-events: none; } #field-checkbox51:checked ~ .layers .flags-layer #flag51 { pointer-events: none; } #flag-checkbox52:checked ~ .layers .flags-layer #flag52 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox52:checked ~ .layers .flags-layer #flag52:after { content: "+"; } #field-checkbox52:checked ~ .layers .fields-layer #field52 { z-index: 5; } #flag-checkbox52:checked ~ .layers .fields-layer #field52 { pointer-events: none; } #field-checkbox52:checked ~ .layers .flags-layer #flag52 { pointer-events: none; } #flag-checkbox53:checked ~ .layers .flags-layer #flag53 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox53:checked ~ .layers .flags-layer #flag53:after { content: "+"; } #field-checkbox53:checked ~ .layers .fields-layer #field53 { z-index: 5; } #flag-checkbox53:checked ~ .layers .fields-layer #field53 { pointer-events: none; } #field-checkbox53:checked ~ .layers .flags-layer #flag53 { pointer-events: none; } #flag-checkbox54:checked ~ .layers .flags-layer #flag54 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox54:checked ~ .layers .flags-layer #flag54:after { content: "+"; } #field-checkbox54:checked ~ .layers .fields-layer #field54 { z-index: 5; } #flag-checkbox54:checked ~ .layers .fields-layer #field54 { pointer-events: none; } #field-checkbox54:checked ~ .layers .flags-layer #flag54 { pointer-events: none; } #flag-checkbox55:checked ~ .layers .flags-layer #flag55 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox55:checked ~ .layers .flags-layer #flag55:after { content: "+"; } #field-checkbox55:checked ~ .layers .fields-layer #field55 { z-index: 5; } #flag-checkbox55:checked ~ .layers .fields-layer #field55 { pointer-events: none; } #field-checkbox56:checked ~ .layers .flags-layer #flag56 { pointer-events: none; } #flag-checkbox56:checked ~ .layers .flags-layer #flag56 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox56:checked ~ .layers .flags-layer #flag56:after { content: "+"; } #field-checkbox56:checked ~ .layers .fields-layer #field56 { z-index: 5; } #flag-checkbox56:checked ~ .layers .fields-layer #field56 { pointer-events: none; } #field-checkbox56:checked ~ .layers .flags-layer #flag56 { pointer-events: none; } #flag-checkbox57:checked ~ .layers .flags-layer #flag57 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox57:checked ~ .layers .flags-layer #flag57:after { content: "+"; } #field-checkbox57:checked ~ .layers .fields-layer #field57 { z-index: 5; } #flag-checkbox57:checked ~ .layers .fields-layer #field57 { pointer-events: none; } #field-checkbox57:checked ~ .layers .flags-layer #flag57 { pointer-events: none; } #flag-checkbox58:checked ~ .layers .flags-layer #flag58 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox58:checked ~ .layers .flags-layer #flag58:after { content: "+"; } #field-checkbox58:checked ~ .layers .fields-layer #field58 { z-index: 5; } #flag-checkbox58:checked ~ .layers .fields-layer #field58 { pointer-events: none; } #field-checkbox58:checked ~ .layers .flags-layer #flag58 { pointer-events: none; } #flag-checkbox59:checked ~ .layers .flags-layer #flag59 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox59:checked ~ .layers .flags-layer #flag59:after { content: "+"; } #field-checkbox59:checked ~ .layers .fields-layer #field59 { z-index: 5; } #flag-checkbox59:checked ~ .layers .fields-layer #field59 { pointer-events: none; } #field-checkbox59:checked ~ .layers .flags-layer #flag59 { pointer-events: none; } #flag-checkbox60:checked ~ .layers .flags-layer #flag60 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox60:checked ~ .layers .flags-layer #flag60:after { content: "+"; } #field-checkbox60:checked ~ .layers .fields-layer #field60 { z-index: 5; } #flag-checkbox60:checked ~ .layers .fields-layer #field60 { pointer-events: none; } #field-checkbox60:checked ~ .layers .flags-layer #flag60 { pointer-events: none; } #flag-checkbox61:checked ~ .layers .flags-layer #flag61 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox61:checked ~ .layers .flags-layer #flag61:after { content: "+"; } #field-checkbox61:checked ~ .layers .fields-layer #field61 { z-index: 5; } #flag-checkbox61:checked ~ .layers .fields-layer #field61 { pointer-events: none; } #field-checkbox61:checked ~ .layers .flags-layer #flag61 { pointer-events: none; } #flag-checkbox62:checked ~ .layers .flags-layer #flag62 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox62:checked ~ .layers .flags-layer #flag62:after { content: "+"; } #field-checkbox62:checked ~ .layers .fields-layer #field62 { z-index: 5; } #flag-checkbox62:checked ~ .layers .fields-layer #field62 { pointer-events: none; } #field-checkbox62:checked ~ .layers .flags-layer #flag62 { pointer-events: none; } #flag-checkbox63:checked ~ .layers .flags-layer #flag63 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox63:checked ~ .layers .flags-layer #flag63:after { content: "+"; } #field-checkbox63:checked ~ .layers .fields-layer #field63 { z-index: 5; } #flag-checkbox63:checked ~ .layers .fields-layer #field63 { pointer-events: none; } #field-checkbox63:checked ~ .layers .flags-layer #flag63 { pointer-events: none; } #flag-checkbox64:checked ~ .layers .flags-layer #flag64 { background: radial-gradient(#E7C04B, #FBDD42); visibility: visible !important; } #flag-checkbox64:checked ~ .layers .flags-layer #flag64:after { content: "+"; } #field-checkbox64:checked ~ .layers .fields-layer #field64 { z-index: 5; } #flag-checkbox64:checked ~ .layers .fields-layer #field64 { pointer-events: none; } #field-checkbox64:checked ~ .layers .flags-layer #flag64 { pointer-events: none; } /* WIN AND LOSE */ .loser-screen, .dc-screen, .de-screen, .winner-screen { background: rgba(0, 0, 0, 0.5); width: 97.5%; height: 98%; position: absolute; visibility: hidden; top: 0; left: 0; } .loser-screen button, .dc-screen button, .de-screen button, .winner-screen button { width: 98%; height: 98%; cursor: pointer; background: none; color: indigo; font-size: 1000%; } .de-screen {background: rgba(64, 128, 0, 0.7);} .de-screen button {color:gold;} .dc-screen {background: rgba(0, 0, 128, 0.7);} .winner-screen {background: rgba(0, 255, 0, 0.7);} .dc-screen button {color:dodgerblue;} .winner-screen button {color: magenta;} /* miny: 5,11,12,15,18,20,23,24,25,26,28,29,43,45,51,54,57,60,61,62 */ #field-checkbox5:checked ~ .layers .fields-layer #field5 { background: radial-gradient(#c50900, #d50004); } #field-checkbox5:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox11:checked ~ .layers .fields-layer #field11 { background: radial-gradient(#c50900, #d50004); } #field-checkbox11:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox12:checked ~ .layers .fields-layer #field12 { background: radial-gradient(#c50900, #d50004); } #field-checkbox12:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox15:checked ~ .layers .fields-layer #field15 { background: radial-gradient(#c50900, #d50004); } #field-checkbox15:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox18:checked ~ .layers .fields-layer #field18 { background: radial-gradient(#c50900, #d50004); } #field-checkbox18:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox20:checked ~ .layers .fields-layer #field20 { background: radial-gradient(#c50900, #d50004); } #field-checkbox20:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox23:checked ~ .layers .fields-layer #field23 { background: radial-gradient(#c50900, #d50004); } #field-checkbox23:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox24:checked ~ .layers .fields-layer #field24 { background: radial-gradient(#c50900, #d50004); } #field-checkbox24:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox25:checked ~ .layers .fields-layer #field25 { background: radial-gradient(#c50900, #d50004); } #field-checkbox25:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox26:checked ~ .layers .fields-layer #field26 { background: radial-gradient(#c50900, #d50004); } #field-checkbox26:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox28:checked ~ .layers .fields-layer #field28 { background: radial-gradient(#c50900, #d50004); } #field-checkbox28:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox29:checked ~ .layers .fields-layer #field29 { background: radial-gradient(#c50900, #d50004); } #field-checkbox29:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox43:checked ~ .layers .fields-layer #field43 { background: radial-gradient(#c50900, #d50004); } #field-checkbox43:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox45:checked ~ .layers .fields-layer #field45 { background: radial-gradient(#c50900, #d50004); } #field-checkbox45:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox51:checked ~ .layers .fields-layer #field51 { background: radial-gradient(#c50900, #d50004); } #field-checkbox51:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox54:checked ~ .layers .fields-layer #field54 { background: radial-gradient(#c50900, #d50004); } #field-checkbox54:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox57:checked ~ .layers .fields-layer #field57 { background: radial-gradient(#c50900, #d50004); } #field-checkbox57:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox60:checked ~ .layers .fields-layer #field60 { background: radial-gradient(#c50900, #d50004); } #field-checkbox60:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox61:checked ~ .layers .fields-layer #field61 { background: radial-gradient(#c50900, #d50004); } #field-checkbox61:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #field-checkbox62:checked ~ .layers .fields-layer #field62 { background: radial-gradient(#c50900, #d50004); } #field-checkbox62:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } /* Uh win */ #flag-checkbox1:checked ~ #flag-checkbox2:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox3:checked ~ #flag-checkbox4:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox6:checked ~ #flag-checkbox7:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox8:checked ~ #flag-checkbox9:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox10:checked ~ #flag-checkbox11:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox12:checked ~ #flag-checkbox13:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox13:checked ~ #flag-checkbox14:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox15:checked ~ #flag-checkbox16:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox17:checked ~ #flag-checkbox19:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox21:checked ~ #flag-checkbox22:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox21:checked ~ #flag-checkbox27:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox30:checked ~ #flag-checkbox31:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox32:checked ~ #flag-checkbox33:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox34:checked ~ #flag-checkbox35:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox36:checked ~ #flag-checkbox37:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox38:checked ~ #flag-checkbox39:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox40:checked ~ #flag-checkbox41:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox42:checked ~ #flag-checkbox44:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox46:checked ~ #flag-checkbox47:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox47:checked ~ #flag-checkbox48:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } #flag-checkbox48:checked ~ #flag-checkbox49:checked ~ .layers .finish-layer .loser-screen { visibility: visible; z-index: 10; } /* delfin */ #field-checkbox1:checked + #field-checkbox2:checked ~ #field-checkbox7:checked ~ .layers { counter-increment: sc +2; } /* Jaj detektiv */ #flag-checkbox5:checked ~ #flag-checkbox11:checked ~ #flag-checkbox12:checked ~ #flag-checkbox15:checked ~ #flag-checkbox18:checked ~ #flag-checkbox20:checked ~ #flag-checkbox23:checked ~ #flag-checkbox24:checked ~ #flag-checkbox25:checked ~ #flag-checkbox26:checked ~ #flag-checkbox28:checked ~ #flag-checkbox29:checked ~ #flag-checkbox43:checked ~ #flag-checkbox45:checked ~ #flag-checkbox51:checked ~ #flag-checkbox54:checked ~ #flag-checkbox57:checked ~ #flag-checkbox60:checked ~ #flag-checkbox61:checked ~ #flag-checkbox62:checked ~ .layers .finish-layer .dc-screen { counter-increment: dc +11; visibility: visible; z-index: 10; } /* jaj */ #field-checkbox1:checked ~ #field-checkbox2:checked ~ #field-checkbox3:checked ~ #field-checkbox4:checked ~ #field-checkbox6:checked ~ #field-checkbox7:checked ~ #field-checkbox8:checked ~ #field-checkbox9:checked ~ #field-checkbox10:checked ~ #field-checkbox13:checked ~ #field-checkbox14:checked ~ #field-checkbox16:checked ~ #field-checkbox17:checked ~ #field-checkbox19:checked ~ #field-checkbox21:checked ~ #field-checkbox22:checked ~ #field-checkbox27:checked ~ #field-checkbox30:checked ~ #field-checkbox31:checked ~ #field-checkbox32:checked ~ #field-checkbox33:checked ~ #field-checkbox34:checked ~ #field-checkbox35:checked ~ #field-checkbox36:checked ~ #field-checkbox37:checked ~ #field-checkbox38:checked ~ #field-checkbox39:checked ~ #field-checkbox40:checked ~ #field-checkbox41:checked ~ #field-checkbox42:checked ~ #field-checkbox44:checked ~ #field-checkbox46:checked ~ #field-checkbox47:checked ~ #field-checkbox48:checked ~ #field-checkbox49:checked ~ #field-checkbox50:checked ~ #field-checkbox52:checked ~ #field-checkbox53:checked ~ #field-checkbox55:checked ~ #field-checkbox56:checked ~ #field-checkbox58:checked ~ #field-checkbox59:checked ~ .layers .finish-layer .winner-screen { counter-increment: sc +10; visibility: visible; z-index: 10; } /* HINTS IN FIELDS */ #field-checkbox1:checked ~ .layers .fields-layer #field1:after { content: "0"; } #field-checkbox2:checked ~ .layers .fields-layer #field2:after { content: "1"; } #field-checkbox3:checked ~ .layers .fields-layer #field3:after { content: "2"; } #field-checkbox4:checked ~ .layers .fields-layer #field4:after { content: "3"; } #field-checkbox6:checked ~ .layers .fields-layer #field6:after { content: "2"; } #field-checkbox7:checked ~ .layers .fields-layer #field7:after { content: "J"; } #field-checkbox8:checked ~ .layers .fields-layer #field8:after { content: "1"; } #field-checkbox9:checked ~ .layers .fields-layer #field9:after { content: "1"; } #field-checkbox10:checked ~ .layers .fields-layer #field10:after { content: "2"; } #field-checkbox13:checked ~ .layers .fields-layer #field13:after { content: "3"; } #field-checkbox14:checked ~ .layers .fields-layer #field14:after { content: "3"; } #field-checkbox16:checked ~ .layers .fields-layer #field16:after { content: "3"; } #field-checkbox17:checked ~ .layers .fields-layer #field17:after { content: "3"; } #field-checkbox19:checked ~ .layers .fields-layer #field19:after { content: "6"; } #field-checkbox21:checked ~ .layers .fields-layer #field21:after { content: "4"; } #field-checkbox22:checked ~ .layers .fields-layer #field22:after { content: "3"; } #field-checkbox26:checked ~ .layers .fields-layer #field26:after { content: ""; } #field-checkbox27:checked ~ .layers .fields-layer #field27:after { content: "4"; } #field-checkbox30:checked ~ .layers .fields-layer #field30:after { content: "2"; } #field-checkbox31:checked ~ .layers .fields-layer #field31:after { content: "2"; } #field-checkbox32:checked ~ .layers .fields-layer #field32:after { content: "2"; } #field-checkbox33:checked ~ .layers .fields-layer #field33:after { content: "2"; } #field-checkbox34:checked ~ .layers .fields-layer #field34:after { content: "3"; } #field-checkbox35:checked ~ .layers .fields-layer #field35:after { content: "3"; } #field-checkbox36:checked ~ .layers .fields-layer #field36:after { content: "4"; } #field-checkbox37:checked ~ .layers .fields-layer #field37:after { content: "3"; } #field-checkbox38:checked ~ .layers .fields-layer #field38:after { content: "2"; } #field-checkbox39:checked ~ .layers .fields-layer #field39:after { content: "0"; } #field-checkbox40:checked ~ .layers .fields-layer #field40:after { content: "\1F419"; } #field-checkbox41:checked ~ .layers .fields-layer #field41:after { content: "0"; } #field-checkbox42:checked ~ .layers .fields-layer #field42:after { content: "2"; } #field-checkbox44:checked ~ .layers .fields-layer #field44:after { content: "3"; } #field-checkbox46:checked ~ .layers .fields-layer #field46:after { content: "2"; } #field-checkbox47:checked ~ .layers .fields-layer #field47:after { content: "1"; } #field-checkbox48:checked ~ .layers .fields-layer #field48:after { content: "0"; } #field-checkbox49:checked ~ .layers .fields-layer #field49:after { content: "1"; } #field-checkbox50:checked ~ .layers .fields-layer #field50:after { content: "3"; } #field-checkbox52:checked ~ .layers .fields-layer #field52:after { content: "5"; } #field-checkbox53:checked ~ .layers .fields-layer #field53:after { content: "5"; } #field-checkbox55:checked ~ .layers .fields-layer #field55:after { content: "2"; } #field-checkbox56:checked ~ .layers .fields-layer #field56:after { content: "0"; } #field-checkbox58:checked ~ .layers .fields-layer #field58:after { content: "2"; } #field-checkbox59:checked ~ .layers .fields-layer #field59:after { content: "2"; } #field-checkbox63:checked ~ .layers .fields-layer #field63:after { content: "2"; } #field-checkbox64:checked ~ .layers .fields-layer #field64:after { content: "0"; } /* COUNTERS */ body { counter-reset: mc uc sc dc; } #flag-checkbox1:checked ~ .layers .flags-layer #flag1 { counter-increment: mc; } #field-checkbox1:checked ~ .layers .fields-layer #field1 { counter-increment: uc; } #flag-checkbox2:checked ~ .layers .flags-layer #flag2 { counter-increment: mc; } #field-checkbox2:checked ~ .layers .fields-layer #field2 { counter-increment: uc sc; } #flag-checkbox3:checked ~ .layers .flags-layer #flag3 { counter-increment: mc; } #field-checkbox3:checked ~ .layers .fields-layer #field3 { counter-increment: uc sc +2; } #flag-checkbox4:checked ~ .layers .flags-layer #flag4 { counter-increment: mc; } #field-checkbox4:checked ~ .layers .fields-layer #field4 { counter-increment: uc sc +3; } #flag-checkbox5:checked ~ .layers .flags-layer #flag5 { counter-increment: mc dc +5; } #field-checkbox5:checked ~ .layers .fields-layer #field5 { counter-increment: uc dc -50 sc -50; } #flag-checkbox6:checked ~ .layers .flags-layer #flag6 { counter-increment: mc; } #field-checkbox6:checked ~ .layers .fields-layer #field6 { counter-increment: uc sc +2; } #flag-checkbox7:checked ~ .layers .flags-layer #flag7 { counter-increment: mc; } #field-checkbox7:checked ~ .layers .fields-layer #field7 { counter-increment: uc; } #flag-checkbox8:checked ~ .layers .flags-layer #flag8 { counter-increment: mc; } #field-checkbox8:checked ~ .layers .fields-layer #field8 { counter-increment: uc sc; } #flag-checkbox9:checked ~ .layers .flags-layer #flag9 { counter-increment: mc; } #field-checkbox9:checked ~ .layers .fields-layer #field9 { counter-increment: uc sc; } #flag-checkbox10:checked ~ .layers .flags-layer #flag10 { counter-increment: mc; } #field-checkbox10:checked ~ .layers .fields-layer #field10 { counter-increment: uc sc +2; } #flag-checkbox11:checked ~ .layers .flags-layer #flag11 { counter-increment: mc dc +5; } #field-checkbox11:checked ~ .layers .fields-layer #field11 { counter-increment: uc dc -50 sc -50; } #flag-checkbox12:checked ~ .layers .flags-layer #flag12 { counter-increment: mc dc +5; } #field-checkbox12:checked ~ .layers .fields-layer #field12 { counter-increment: uc dc -50 sc -50; } #flag-checkbox13:checked ~ .layers .flags-layer #flag13 { counter-increment: mc; } #field-checkbox13:checked ~ .layers .fields-layer #field13 { counter-increment: uc sc +3; } #flag-checkbox14:checked ~ .layers .flags-layer #flag14 { counter-increment: mc; } #field-checkbox14:checked ~ .layers .fields-layer #field14 { counter-increment: uc sc +3; } #flag-checkbox15:checked ~ .layers .flags-layer #flag15 { counter-increment: mc dc +5; } #field-checkbox15:checked ~ .layers .fields-layer #field15 { counter-increment: uc dc -50 sc -50; } #flag-checkbox16:checked ~ .layers .flags-layer #flag16 { counter-increment: mc; } #field-checkbox16:checked ~ .layers .fields-layer #field16 { counter-increment: uc sc +3; } #flag-checkbox17:checked ~ .layers .flags-layer #flag17 { counter-increment: mc; } #field-checkbox17:checked ~ .layers .fields-layer #field17 { counter-increment: uc sc +3; } #flag-checkbox18:checked ~ .layers .flags-layer #flag18 { counter-increment: mc dc +5; } #field-checkbox18:checked ~ .layers .fields-layer #field18 { counter-increment: uc dc -50 sc -50; } #flag-checkbox19:checked ~ .layers .flags-layer #flag19 { counter-increment: mc; } #field-checkbox19:checked ~ .layers .fields-layer #field19 { counter-increment: uc sc +6; } #flag-checkbox20:checked ~ .layers .flags-layer #flag20 { counter-increment: mc dc +5; } #field-checkbox20:checked ~ .layers .fields-layer #field20 { counter-increment: uc dc -50 sc -50; } #flag-checkbox21:checked ~ .layers .flags-layer #flag21 { counter-increment: mc; } #field-checkbox21:checked ~ .layers .fields-layer #field21 { counter-increment: uc sc +4; } #flag-checkbox22:checked ~ .layers .flags-layer #flag22 { counter-increment: mc; } #field-checkbox22:checked ~ .layers .fields-layer #field22 { counter-increment: uc sc +3; } #flag-checkbox23:checked ~ .layers .flags-layer #flag23 { counter-increment: mc dc +5; } #field-checkbox23:checked ~ .layers .fields-layer #field23 { counter-increment: uc sc -50; } #flag-checkbox24:checked ~ .layers .flags-layer #flag24 { counter-increment: mc dc +5; } #field-checkbox24:checked ~ .layers .fields-layer #field24 { counter-increment: uc sc -50; } #flag-checkbox25:checked ~ .layers .flags-layer #flag25 { counter-increment: mc dc +5; } #field-checkbox25:checked ~ .layers .fields-layer #field25 { counter-increment: uc sc -50; } #flag-checkbox26:checked ~ .layers .flags-layer #flag26 { counter-increment: mc dc +5; } #field-checkbox26:checked ~ .layers .fields-layer #field26 { counter-increment: uc sc -50; } #flag-checkbox27:checked ~ .layers .flags-layer #flag27 { counter-increment: mc; } #field-checkbox27:checked ~ .layers .fields-layer #field27 { counter-increment: uc sc +4; } #flag-checkbox28:checked ~ .layers .flags-layer #flag28 { counter-increment: mc dc +5; } #field-checkbox28:checked ~ .layers .fields-layer #field28 { counter-increment: uc dc -50 sc -50; } #flag-checkbox29:checked ~ .layers .flags-layer #flag29 { counter-increment: mc dc +5; } #field-checkbox29:checked ~ .layers .fields-layer #field29 { counter-increment: uc dc -50 sc -50; } #flag-checkbox30:checked ~ .layers .flags-layer #flag30 { counter-increment: mc; } #field-checkbox30:checked ~ .layers .fields-layer #field30 { counter-increment: uc sc +2; } #flag-checkbox31:checked ~ .layers .flags-layer #flag31 { counter-increment: mc; } #field-checkbox31:checked ~ .layers .fields-layer #field31 { counter-increment: uc sc +2; } #flag-checkbox32:checked ~ .layers .flags-layer #flag32 { counter-increment: mc; } #field-checkbox32:checked ~ .layers .fields-layer #field32 { counter-increment: uc sc +2; } #flag-checkbox33:checked ~ .layers .flags-layer #flag33 { counter-increment: mc; } #field-checkbox33:checked ~ .layers .fields-layer #field33 { counter-increment: uc sc +2; } #flag-checkbox34:checked ~ .layers .flags-layer #flag34 { counter-increment: mc; } #field-checkbox34:checked ~ .layers .fields-layer #field34 { counter-increment: uc sc +3; } #flag-checkbox35:checked ~ .layers .flags-layer #flag35 { counter-increment: mc; } #field-checkbox35:checked ~ .layers .fields-layer #field35 { counter-increment: uc sc +3; } #flag-checkbox36:checked ~ .layers .flags-layer #flag36 { counter-increment: mc; } #field-checkbox36:checked ~ .layers .fields-layer #field36 { counter-increment: uc sc +4; } #flag-checkbox37:checked ~ .layers .flags-layer #flag37 { counter-increment: mc; } #field-checkbox37:checked ~ .layers .fields-layer #field37 { counter-increment: uc sc +3; } #flag-checkbox38:checked ~ .layers .flags-layer #flag38 { counter-increment: mc; } #field-checkbox38:checked ~ .layers .fields-layer #field38 { counter-increment: uc sc +2; } #flag-checkbox39:checked ~ .layers .flags-layer #flag39 { counter-increment: mc; } #field-checkbox39:checked ~ .layers .fields-layer #field39 { counter-increment: uc; } #flag-checkbox40:checked ~ .layers .flags-layer #flag40 { counter-increment: mc; } #field-checkbox40:checked ~ .layers .fields-layer #field40 { counter-increment: uc sc +5; } #flag-checkbox41:checked ~ .layers .flags-layer #flag41 { counter-increment: mc; } #field-checkbox41:checked ~ .layers .fields-layer #field41 { counter-increment: uc; } #flag-checkbox42:checked ~ .layers .flags-layer #flag42 { counter-increment: mc; } #field-checkbox42:checked ~ .layers .fields-layer #field42 { counter-increment: uc sc +2; } #flag-checkbox43:checked ~ .layers .flags-layer #flag43 { counter-increment: mc dc +5; } #field-checkbox43:checked ~ .layers .fields-layer #field43 { counter-increment: uc dc -50 sc -50; } #flag-checkbox44:checked ~ .layers .flags-layer #flag44 { counter-increment: mc; } #field-checkbox44:checked ~ .layers .fields-layer #field44 { counter-increment: uc sc +3; } #flag-checkbox45:checked ~ .layers .flags-layer #flag45 { counter-increment: mc dc +5; } #field-checkbox45:checked ~ .layers .fields-layer #field45 { counter-increment: uc dc -50 sc -50; } #flag-checkbox46:checked ~ .layers .flags-layer #flag46 { counter-increment: mc; } #field-checkbox46:checked ~ .layers .fields-layer #field46 { counter-increment: uc sc +2; } #flag-checkbox47:checked ~ .layers .flags-layer #flag47 { counter-increment: mc; } #field-checkbox47:checked ~ .layers .fields-layer #field47 { counter-increment: uc sc; } #flag-checkbox48:checked ~ .layers .flags-layer #flag48 { counter-increment: mc; } #field-checkbox48:checked ~ .layers .fields-layer #field48 { counter-increment: uc; } #flag-checkbox49:checked ~ .layers .flags-layer #flag49 { counter-increment: mc; } #field-checkbox49:checked ~ .layers .fields-layer #field49 { counter-increment: uc sc; } #flag-checkbox50:checked ~ .layers .flags-layer #flag50 { counter-increment: mc; } #field-checkbox50:checked ~ .layers .fields-layer #field50 { counter-increment: uc sc +3; } #flag-checkbox51:checked ~ .layers .flags-layer #flag51 { counter-increment: mc dc +5; } #field-checkbox51:checked ~ .layers .fields-layer #field51 { counter-increment: uc dc -50 sc -50; } #flag-checkbox52:checked ~ .layers .flags-layer #flag52 { counter-increment: mc; } #field-checkbox52:checked ~ .layers .fields-layer #field52 { counter-increment: uc sc +5; } #flag-checkbox53:checked ~ .layers .flags-layer #flag53 { counter-increment: mc; } #field-checkbox53:checked ~ .layers .fields-layer #field53 { counter-increment: uc sc +5; } #flag-checkbox54:checked ~ .layers .flags-layer #flag54 { counter-increment: mc dc +5; } #field-checkbox54:checked ~ .layers .fields-layer #field54 { counter-increment: uc dc -50 sc -50; } #flag-checkbox55:checked ~ .layers .flags-layer #flag55 { counter-increment: mc; } #field-checkbox55:checked ~ .layers .fields-layer #field55 { counter-increment: uc sc +2; } #flag-checkbox56:checked ~ .layers .flags-layer #flag56 { counter-increment: mc; } #field-checkbox56:checked ~ .layers .fields-layer #field56 { counter-increment: uc; } #flag-checkbox57:checked ~ .layers .flags-layer #flag57 { counter-increment: mc dc +5; } #field-checkbox57:checked ~ .layers .fields-layer #field57 { counter-increment: uc dc -50 sc -50; } #flag-checkbox58:checked ~ .layers .flags-layer #flag58 { counter-increment: mc; } #field-checkbox58:checked ~ .layers .fields-layer #field58 { counter-increment: uc sc +2; } #flag-checkbox59:checked ~ .layers .flags-layer #flag59 { counter-increment: mc; } #field-checkbox59:checked ~ .layers .fields-layer #field59 { counter-increment: uc sc +2; } #flag-checkbox60:checked ~ .layers .flags-layer #flag60 { counter-increment: mc dc +5; } #field-checkbox60:checked ~ .layers .fields-layer #field60 { counter-increment: uc dc -50 sc -50; } #flag-checkbox61:checked ~ .layers .flags-layer #flag61 { counter-increment: mc dc +5; } #field-checkbox61:checked ~ .layers .fields-layer #field61 { counter-increment: uc dc -50 sc -50; } #flag-checkbox62:checked ~ .layers .flags-layer #flag62 { counter-increment: mc dc +5; } #field-checkbox62:checked ~ .layers .fields-layer #field62 { counter-increment: uc dc -50 sc -50; } #flag-checkbox63:checked ~ .layers .flags-layer #flag63 { counter-increment: mc; } #field-checkbox63:checked ~ .layers .fields-layer #field63 { counter-increment: uc sc +2; } #flag-checkbox64:checked ~ .layers .flags-layer #flag64 { counter-increment: mc; } #field-checkbox64:checked ~ .layers .fields-layer #field64 { counter-increment: uc; } .game-stats { text-align: center; font-size: 24px; color: white; margin: 10px 0; } .game-stats .fields:after { content: "\1F47B : "counter(uc)"/44"; } .game-stats .mines:after { content: "\1F6E5 : "counter(dc,upper-alpha)" "counter(mc)"/20 \1F419"; } .game-stats .scores:after { content: "\1F483 : "counter(dc)" & "counter(sc)" \1F42C"; }