body{background:transparent radial-gradient(closest-side at 25% 25%, #1A4550 0%, #0F2327 100%) 0% 0% no-repeat fixed}
.wrapper{overflow:hidden;position:relative;transition:all .5s;}
.wrapper:after{background: url(../images/sysadmin-contest-bg-2022.png) no-repeat;background-position:bottom right;background-size:900px;bottom:0;content:"";height:1000px;position:absolute;right:-100px;top:0;width:900px}
.wrapper:before{background: url(../images/sysadmin-contest-man-2022.png) no-repeat;background-position:bottom right;background-size:550px;bottom:200px;content:"";height:580px;position:absolute;right:-80px;width:580px;z-index:9;}
#title{font-size:36px;font-weight:bold;letter-spacing:2px;}
#board{display:flex;flex-wrap:wrap;height:420px;margin:3px auto 0;width:420px;}
.tile{align-items:center;border:1px solid #B6FFEB57;border-radius:5px;color:#fff;display:flex;font-size:36px;font-weight:bold;height:60px;justify-content:center;margin:2.5px;width:60px;}
.correct{background:#63C366;border:1px solid #63C366;color:#fff;}
.present{background:#CEB05E;border:1px solid #CEB05E;color:#fff;}
.absent{background:#899A99;color:#fff;}
.keyboard-row{display:flex;flex-wrap:wrap;width:400px;margin:0 auto;}
.key-tile{align-items:center;background:#163A41;border:1px solid #163A41;border-radius:5px;color:#81A3AD;display:flex;font-size:20px;font-weight:bold;justify-content:center;height:50px;margin:1px;width:36px;}
.enter-key-tile{align-items:center;border:1px solid lightgray;display:flex;font-size:20px;font-weight:bold;height:40px;justify-content:center;margin:1px;width:76px;}
form{display:none}
.form-container{background:#fff;border-radius:10px;left:38.7%;position:fixed;top:170px;width:370px;}
.form-container ul{margin:30px;padding:0;}
.form-container ul li{list-style:none;margin:0 0 20px;position:relative;}
.form-container ul li:nth-child(5){border:solid 1px #707070;border-radius:5px;}
.form-container ul li:before{background:url(../images/sysadmin-contest-sprite-2022.png) -42px -46px no-repeat;background-size:250px;content:"";height:16px;left:11px;position:absolute;top:12px;width:15px}
.form-container ul li:nth-child(4):before{background-position:-62px -46px;}
.form-container ul li:nth-child(5):before{background-position:-82px -46px;width:16px;}
.form-container ul li:nth-child(1):before,
.form-container ul li:nth-child(2):before,
.form-container ul li:nth-child(6):before,
.form-container ul li:nth-child(7):before{display:none}
.form-container ul li input{border:solid 1px #707070;border-radius:5px;font-size:14px;padding:10px 3% 10px 11%;width:85%}
.form-container ul li select{background:#fff;border:none;border-radius:5px;font-size:14px;padding:10px 3% 10px 11%;width:100%}
.form-container #startbut{background:#C12E39 0% 0% no-repeat padding-box;border:solid 1px #C12E39;border-radius:5px;color:#fff;cursor:pointer;display:inline-block;font-size:16px;font-weight:bold;padding:10px 0;text-align:center;width:100%;}
.form-container .gift-ico{background:url(../images/sysadmin-contest-sprite-2022.png) 0px -178px no-repeat;background-size:250px;height:75px;left:143px;position:absolute;top:-40px;width:75px}
.form-container .clo-ico{cursor:pointer;position:absolute;right:14px;top:10px}
.head{font-size:22px;margin:0 0 -20px}
.logocont{margin-top:40px;}
img{width:280px}
.countup{border:solid 1px #94a3b8;display:none;font-size:18px;margin:0 auto 30px;padding:8px 0;width:80px}
.animateeff{animation:flip 0.5s ease;}
.keyboard-row .key-tile{cursor:pointer;}
.kr1 .key-tile:nth-child(10){display: none}
.kr1 .key-tile:nth-child(1){margin-left:22px;}
.kr2 #Enter{background:#163A41;border:1px solid #163A41;border-radius:5px;color:#81A3AD;height:50px;width:66px}
.kr2 #Backspace{width:45px;}

.last-slide{background:#fff;border-radius:10px;display:none;margin:0 auto;padding:40px 0;position:relative;top:-350px;width:420px;}
.last-slide p{font-size:24px;margin:0 0 30px}
.last-slide input[type=submit]{background:#4CAF50;border:solid 1px #4CAF50;border-radius:5px;color:#fff;cursor:pointer;font-size:16px;font-weight:bold;padding:10px 0;text-align:center;width:80%;}

.intro{margin:50px 0 0 0}
.intro li{margin:0 0 40px;position:relative;}
.intro li:nth-child(1){height:50px}
.intro li:nth-child(1):before{background:url(../images/sysadmin-contest-sprite-2022.png) no-repeat;background-size:500px;content:"";height:50px;left:0;position:absolute;top:0;width:270px}
.intro li:nth-child(2){height:180px;margin-top:60px}
.intro li:nth-child(2):before{content:"";background:url(../images/sysadmin-contest-sprite-2022.png) -2px -140px no-repeat;background-size:500px;height:180px;left:20px;position:absolute;top:0;width:480px}
.intro li:nth-child(3){color:#B6FFEB;font-family:'Zoho_Puvi_Bold';font-size:36px;line-height:42px;opacity:0.7;}
.intro li:nth-child(3) span{color:#B6FFEB;display:block;font-family:'Zoho_Puvi_Thin';font-size:24px;opacity:0.7;}
.intro li:nth-child(4){color:#fff;font-family:'Zoho_Puvi_Regular';font-size:15px;line-height:30px;}
.intro li:nth-child(5) span:nth-child(1){background:#C12E39;border-radius:6px;color:#fff;cursor:pointer;display:inline-block;font-size:16px;padding:10px 20px 10px 43px;position:relative;}
.intro li:nth-child(5) span:nth-child(1):before{background:url(../images/sysadmin-contest-sprite-2022.png) -14px -36px no-repeat;background-size:210px;content:"";height:19px;left:23px;position:absolute;top:11px;width:20px;}
.intro li:nth-child(5) span:nth-child(2){color:#B6FFEB;cursor:pointer;display:inline-block;font-size:16px;margin:0 0 0 20px;padding:10px 20px;position:relative;}
.intro li:nth-child(5) span:nth-child(2):before{background:url(../images/sysadmin-contest-sprite-2022.png) -3px -37px no-repeat;background-size:210px;content:"";height:11px;position:absolute;right:4px;top:18px;width:10px;}
.intro li:nth-child(5) span:nth-child(2):after{background:#B6FFEB;bottom:14px;content:"";height:1px;left:20px;position:absolute;transition:all .5s;width:115px;}
.intro li:nth-child(5) span:nth-child(2):hover:after{height:0;left:50%;transition:all .5s;width:0}
.intro li:nth-child(6){background:#FFFFFF30 0% 0% no-repeat padding-box;border:1px solid #5CFFD261;border-radius:20px;padding: 10px}
.intro li:nth-child(6) span:nth-child(1){background:url(../images/sysadmin-contest-sprite-2022.png) -262px 0 no-repeat;background-size:450px;display:inline-block;height:119px;width:189px}
.intro li:nth-child(6) span:nth-child(2){color:#fff;display:inline-block;font-size:15px;line-height:30px;margin:12px 0 0 30px;vertical-align:top;width:460px}
.footer{bottom:0;color:#81A3AD;left:0;margin-top:50px;width:100%;}
.footer p{text-align:center;}
.popupCont{background:#ffffff1f;display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:99;}
.popup{background:#fff;border-radius:20px;display:none;left:34%;margin:80px auto 0;max-width:450px;padding:30px;position:fixed;z-index:999;}
.popup h2{border-bottom:solid 1px #E3E3E3;margin-top:0;padding-bottom:15px;}
.popup span{cursor:pointer;font-size:16px;position:absolute;right:25px;top:18px}
.popup ol{list-style:decimal;margin:0 0 0 25px;padding:0;}
.popup ol li{margin:0 0 10px}
.flurEffect{filter:blur(16px);transition:all .5s;}
#country_state{margin-left:4%;padding:10px 0% 10px 0%;width:45%}

.wrapper2.proce{overflow:hidden;position:relative;transition:all .5s;}
.wrapper2 .per50{display:none}
.wlogo{background:url(../images/sysadmin-contest-sprite-2022.png) no-repeat;background-size:500px;height:50px;margin:40px 0 90px;width:270px;}
#answer{background:#F27F7F;border-radius:40px;color:#112A30;display:none;font-size:18px;margin:0px auto 50px auto;padding:20px;text-align:center;width:150px;}
.htp{background:#ffffff29;border-radius:20px;color:#B6FFEB;cursor:pointer;margin-top:40px;padding:15px 0;text-align:center;width:140px}
.popup ol li ul li span{position:unset;}
.popup ol li ul li.green span{background:#63C366;border-radius:2px;color:#fff;display:inline-block;margin:0 3px 0 0;padding:0 5px;text-transform:uppercase;}
.popup ol li ul li.yellow span{background:#CEB05E;border-radius:2px;color:#fff;display:inline-block;margin:0 3px 0 0;padding:0 5px;text-transform:uppercase;}
.popup ol li ul li.grey span{background:#899A99;border-radius:2px;color:#fff;display:inline-block;margin:0 3px 0 0;padding:0 5px;text-transform:uppercase;}
.last-slide .corr,
.last-slide .wron{display:none}
.last-slide .corr h3,
.last-slide .wron h3{color:#1A4550;font-size:22px;margin-top:15px;}
.last-slide .corr p,
.last-slide .wron p{font-size:16px;}
.last-slide .corr p span,
.last-slide .wron p span{font-weight:bold}
.last-slide .corr > span{background:url(../images/sysadmin-contest-sprite-2022.png) -87px -179px no-repeat;background-size:250px;height:65px;left:177px;position:absolute;top:-34px;width:80px}
.last-slide .wron > span{background:url(../images/sysadmin-contest-sprite-2022.png) -176px -175px no-repeat;background-size:250px;height:72px;left:177px;position:absolute;top:-34px;width:72px}

@keyframes flip {
    0% {
        transform: scaleY(1);
    }
    50% {
        transform: scaleY(0);
    }
    100% {
        transform: scaleY(1);
    }
}

@media screen and (max-width:1500px) {
.popup{left:32%}
}
@media screen and (max-width:1500px) {
.popup{left:29%}
}
@media screen and (max-width:1300px) {
.popup{left:36.7%}
}
@media screen and (max-width:1150px) {
.popup{left:27%}
}
@media screen and (max-width:1100px) {
.popup{left:24%}
.form-container{left:34.7%}
}
@media screen and (max-width:980px) {
.wrapper:before,
.wrapper:after{display:none}
.form-container{left:32.7%}
}
@media screen and (max-width:850px) {
.popup{left:16%}
.form-container{left:29.7%}
}
@media screen and (max-width:800px) {
.mainbody .per75{width:98%}
.popup{left:5%;max-width:90%;right:5%;}
.form-container{left:27.7%}
}
@media screen and (max-width:750px) {
.intro li:nth-child(6) span{display:block !important;margin:12px auto;text-align:center;}
.intro li:nth-child(6) span:nth-child(2){margin:12px 5% !important;width:90% !important}
.form-container{left:25.7%}
}
@media screen and (max-width:700px) {
.form-container{left:23.7%}
}
@media screen and (max-width:650px) {
.form-container{left:21.7%}
}
@media screen and (max-width:600px) {
.form-container{left:18.7%}
}
@media screen and (max-width:540px) {
.intro li:nth-child(2)::before{background-position:-2px -110px;background-size:400px;height:146px;left:0;width:380px}
.intro li:nth-child(2){height:140px}
.form-container{left:15.7%}
}
@media screen and (max-width:500px) {
.form-container{left:5%;right:5%;width:90%}
.form-container .gift-ico{left:41%}
.wlogo{margin:40px auto 10px}
.htp{display:block;float:none;margin:30px auto 30px}
}