@charset "UTF-8";@font-face{font-family:'Poppins Regular';src:url('fonts/Poppins-Regular.ttf');src:url('fonts/Poppins-Regular.ttf') format('truetype');font-weight:normal;font-style:normal;}
@font-face{font-family:'Poppins Medium';src:url('fonts/Poppins-Medium.ttf');src:url('fonts/Poppins-Medium.ttf') format('truetype');font-weight:normal;font-style:normal;}
@font-face{font-family:'Poppins Bold';src:url('fonts/Poppins-Bold.ttf');src:url('fonts/Poppins-Bold.ttf') format('truetype');font-weight:normal;font-style:normal;}
@font-face{font-family:'Poppins Light';src:url('fonts/Poppins-Light.ttf');src:url('fonts/Poppins-Light.ttf') format('truetype');font-weight:normal;font-style:normal;}
html, body, div, span, applet, object, iframe, header, footer,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;overflow-wrap: break-word;}

#egg{margin:0 auto;display:block;width:85px;height:140px;background-color:red;-webkit-border-radius:63px 63px 63px 63px/108px 108px 72px 72px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;}
#pacman{margin:0 auto;width:0px;height:0px;border-right:60px solid transparent;border-top:60px solid red;border-left:60px solid red;border-bottom:60px solid red;border-top-left-radius:60px;border-top-right-radius:60px;border-bottom-left-radius:60px;border-bottom-right-radius:60px;}
#space-invader{box-shadow:0 0 0 1em red,
0 1em 0 1em red,
-2.5em 1.5em 0 .5em red,
2.5em 1.5em 0 .5em red,
-3em -3em 0 0 red,
3em -3em 0 0 red,
-2em -2em 0 0 red,
2em -2em 0 0 red,
-3em -1em 0 0 red,
-2em -1em 0 0 red,
2em -1em 0 0 red,
3em -1em 0 0 red,
-4em 0 0 0 red,
-3em 0 0 0 red,
3em 0 0 0 red,
4em 0 0 0 red,
-5em 1em 0 0 red,
-4em 1em 0 0 red,
4em 1em 0 0 red,
5em 1em 0 0 red,
-5em 2em 0 0 red,
5em 2em 0 0 red,
-5em 3em 0 0 red,
-3em 3em 0 0 red,
3em 3em 0 0 red,
5em 3em 0 0 red,
-2em 4em 0 0 red,
-1em 4em 0 0 red,
1em 4em 0 0 red,
2em 4em 0 0 red;background:red;width:1em;height:1em;overflow:hidden;margin:50px 0 70px 65px;margin-left:inherit;margin-right:inherit;}

html,body{height:100%;background-color:#252528;font-family:'Poppins Regular', Helvetica, Arial, sans-serif;font-size:16px;color:#FFF;}
a{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition:-webkit-transform 0.6s ease-in-out;transition:transform 0.6s ease-in-out;color: #f00;text-decoration: underline;font-weight: bold;}
p, ol, ul{margin-bottom: 1rem;}
ul li{margin-top: 1rem;margin-bottom: 1rem;}
h2{margin-top:0px;padding-left:44px;padding-right:44px;color:#FFF;text-align: center;}
h3{margin:0px auto;color:#fccf01;text-transform: capitalize;text-align: center;}
button, input, select, textarea{padding: 10px;}
.row{margin-left:0;margin-right:0;}
.topnav {overflow: hidden;float: right;}
.topnav a {float: left;display: block;color: #FFF;text-align: center;padding: 14px 16px;text-decoration: none;font-size: 17px;}
.active {background-color: #04AA6D;color: #FFF;}
.topnav .icon {display: none;font-size:40px;}
.dropdown {float: left;overflow: hidden;}
.dropdown .dropbtn {font-size: 17px;border: none;outline: none;padding: 14px 16px;background-color: inherit;font-family: inherit;margin: 0;}
.dropdown-content {display: none;position: fixed;background-color: #252528;min-width: 160px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);z-index: 1;top: 54px;}
.dropdown-content a {float: none;color: #FFF !important;padding: 12px 16px;text-decoration: none;display: block;text-align: left;}
.topnav a:hover, .dropdown:hover .dropbtn, .redbutton a:hover, .redinputbtn:hover {background-color: #555;color: #FFF;}
.dropdown-content a:hover {background-color: #555;color: #FFF;}
.dropdown:hover .dropdown-content {display: block;}
#logosm{display: inline;width: 150px; }
#logolg{display: none;width: 600px; }
.logo{max-width:100%;}
.logo:hover{transition:all .5s ease;-webkit-filter:opacity(70%);filter:opacity(70%);}
.logodiv{text-align:left;float:left;}
.redbutton{background-color: #CD0000; margin-right: 10px; display: inline-block;color:#FFF;}
.redbutton a{display: block;color: #FFF !important;text-align: center;padding: 14px 16px;text-decoration: none;font-size: 17px;}
.redinputbtn{background-color: #CD0000; margin-right: 10px; display: inline-block;color:#FFF;color: #FFF;text-align: center;padding: 14px 16px;text-decoration: none;font-size: 17px;border: none;}
.doublesize{padding: 30px;} 
.doublesize a{font-size: 30px;}
/*hero*/
#abouthero{height: 1080px; max-height: 100vh; background-image:url('/images/desertbg.png');background-repeat:no-repeat;background-color:#fae8b9;background-size: cover;}
#buildhero{height: 1080px; max-height: 100vh; background-image:url('/images/buildgamebg.jpg');background-repeat:no-repeat;background-color:#2696de;background-size: cover;}
#contacthero{height: 1080px;max-height: 100vh; background-image:url('/images/greybg.jpg');background-repeat:no-repeat;background-color:#ccc;background-size: cover;}
#esportshero{height: 1152px; max-height: 100vh; background-image: url('/images/E-Sports Summer Camp 2025 Banner 1792x1024.jpg');background-position: top center;background-repeat:no-repeat;background-size: cover;}
#esportsmt25hero{height: 1152px; max-height: 100vh; background-image: url('/images/E-Sports Midterm 2025 1792x1024.jpg');background-position: top center;background-repeat:no-repeat;background-size: cover;}
#eventshero{height: 1080px;max-height: 100vh; background-image:url('/images/Volunteers.jpg');background-repeat:no-repeat;background-color:#ccc;background-size: cover;}
#fourzerofourhero{height: 1080px; max-height: 100vh;background: rgb(85,142,133);background: linear-gradient(0deg, rgba(85,142,133,1) 0%, rgba(255,255,255,1) 100%);}
#gameshero{height: 1080px;max-height: 100vh; background-image:url('/Website Assets/Desktop/5 Game Development/BeachBG.jpg');background-repeat:no-repeat;background-color:#ccc;background-size: cover;}
#homepagehero{height: 1080px;max-height: 100vh; background-image: url('/images/Controller.png');background-position: center;background-repeat: no-repeat;background-size: contain;}
#jobshero{height: 1080px;max-height: 100vh; background-image:url('/images/unitysky.jpg');background-repeat:no-repeat;background-color:#ccc;background-size: cover;}
#newshero{height: 1080px; max-height: 100vh; background-image: url('/Website Assets/Desktop/2 Events and News/lion.svg');background-repeat:no-repeat;}
#privacyhero{height: 1080px;max-height: 100vh; background-image:url('/images/shipbg.png');background-repeat:no-repeat;background-color:#333;background-size: cover;}
/*content*/
#herotitle{text-align: center;transform: translate(0, 150%); margin: 40px auto;height: 300px;}
#herotitle h1{font-family: 'Poppins Bold';font-size: 40px; line-height: 54px; text-shadow: 2px 2px 10px black;}
#herotext{text-align: left;transform: translate(0, 25%); margin: 40px; width: 66%;}
header{position:absolute;width:100%;}
#aboutdiv, #builddiv, #contactdiv, #esportsdiv, #eventsdiv, #privacydiv, #bootcampdiv, #jobsdiv, #investordiv, #lessonsdiv{padding: 40px 10%;}
#aboutdiv{background: linear-gradient(0deg, rgb(253 204 107) 0%, rgb(250 232 185) 100%);color: #252528;}
#aboutdiv h2{margin: 20px 0;color: #252528;}
#contactdiv{background-color: #999;}
#contactdiv h2{margin: 20px 0;}
#gamedesignwrap{background: rgb(72,11,12);background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(72,11,12,1) 100%);}
#gamesdiv{background: rgb(85,142,133);background: linear-gradient(0deg, rgba(85,142,133,1) 0%, rgba(255,255,255,1) 100%);color:#252528;}
#recentevents{margin: 40px 0;min-height: 50vh; background-image: url('/Website Assets/Desktop/2 Events and News/lion.svg'); background-repeat: no-repeat;}
.recentimg{margin: 20px auto 10px auto;max-width: 75%;border: 1px solid #BE0000;}
.recentimg img{width: 100%;border: none;opacity: 75%;transition: 0.3s;}
.recentimg img:hover{opacity: 100%;}
.recenttitle{max-width: 75%;margin: 0 auto;text-align: left;color:#FFF;font-size: 24px;font-weight: bold;}
.recentdate{max-width: 75%;margin: 0 auto;text-align: left;color:#FFF;font-size: 20px;}
#bignewstitle{writing-mode: vertical-lr;transform: rotate(180deg);width: 25%;display: inline-block;font-size: 90px; font-family: 'Poppins Bold'; line-height: 108px;}
.newsslice {width:25%;display: inline-block;vertical-align: top;margin: 0 20px; background: #393939; min-height: 500px;}
.newsimg{width:100%;}
.newstext{padding: 10px; color: #CCC; font-family: 'Poppins Light'; }
hr{width: 50%;border-top: #CCC 1px solid;margin-left: 0;}
#newsarrow{display: inline-block;vertical-align: top;text-align: center;}
#newsarrow img{margin-top: 50%; width: 50%;}
#firstoverlay{z-index: 10; position: absolute; opacity: 50%; width: 100%;}
#firstbermudian{margin: 40px 0;min-height: 84vh; background-image: url('/events/images/JrVideoGameBootcamp_1920x828.png'); background-repeat: no-repeat;}
#firsthero{text-align:right;width: 35%;transform:translate(0, 75%) rotate(3deg);float: left;padding: 40px 0;}
#firstherotop{font-size: 90px; font-family: 'Poppins Bold'; line-height: 108px; }
#firstherobottom{font-size: 30px; font-family: 'Poppins Medium'; line-height: 48px; }
#firstcontent{font-size: 40px; font-family: 'Poppins Light'; line-height: 48px; transform:translate(7%, 75%) rotate(-3deg); width: 90%; padding: 40px;}
#recentcourses{padding-top: 60px;min-height: 50vh; background-image: url('/Website Assets/Desktop/3 Courses/title section.svg'); background-repeat: no-repeat;}
#recentcourses h2{color: #252528;transform: rotate(-1deg);}
#ourgames{margin-top: 40px;}
#partnersdiv, #buildgamediv, #subscribediv, #gamesdiv {margin:0px auto;padding:40px 0px;text-align:center;}
.featuredgame{width:100%;max-width:414px;transition:all .3s ease;cursor:pointer;height:auto;padding:10px;display: inline !important;}
.featuredgame:hover, .quicklink:hover{transition:all .3s ease;-webkit-filter:opacity(70%);filter:opacity(70%);}
.partner{width:100%;max-width:414px;transition:all .3s ease;height:auto;padding:10px;filter: grayscale(0.5);}
.partner:hover{transition:all .3s ease;-webkit-filter:opacity(70%);filter:opacity(70%);}
#gameideahero{height: 885px; max-height: 100vw; background-image: url('/Website Assets/Desktop/5 Game Development/BeachBG.jpg');}
#latestnewsdiv{margin:0px auto;width:80%;}
#news p{padding-top:40px;}
#news div div ul{text-align: left;margin-left: 20%;}
.newsrow1{background:#CCC;border:2px solid #003e63;box-shadow:3px 3px 2px 0px;color: #252528;}
.newsrow2{background:#EEE;border-left:2px solid #003e63;border-right:2px solid #003e63;box-shadow:3px 3px 2px 0px;color: #252528;}
.newsimg{width:100%;padding:40px 20px;}
.newsimgleft {width:100%;padding-top:40px;padding-left:40px;padding-bottom:40px;}
.newsimgright {width:100%;padding-top:40px;padding-right:40px;padding-bottom:40px;}
.description{width:75%;text-align:justify;padding-bottom:40px;margin:0 auto;}
#gameideatext{padding: 250px 0 0 250px;}
#gameideatext h2{text-align: left; padding: 20px 0 20px 0;}
#gameideatext p{ padding-bottom: 20px;}
#mobilegame{position: absolute;left:50%;overflow: hidden;width: 50%;margin-top: 250px;}
#mobilegame img{width: 90%;}
#newsletter{background-color: #FFF; color: #252528;}
#jobstable{background-color: #FFFFFF50; margin: 40px;}
#jobstable tr td, #jobstable tr th{padding: 10px;}
.av-checkbox, input[type=checkbox]{  
    width: 20px;
    height: 20px;
    margin-top: auto;
	vertical-align: middle;
}
.hidediscount{
	display: none;
}
.crossout {
	text-decoration: line-through;	
	color: #666;
}
input[disabled], input[disabled]:hover, button[disabled], button[disabled]:hover{
	background: linear-gradient(to top right, #898989, #4c4c4c);
    border-color: #666666 !important;
    text-shadow: 0 0 2px #606060;
    color: #CCC;
}
input[type=text], input[type=email], textarea, select{ border-radius: 10px; }
input[type=submit], button { border-radius: 10px; padding-left: 25px; padding-right: 25px;}
#challengeform label{display: block;}
#footer{color: #CCC;}
#footer .row{padding: 40px;}
#footer a{color: #CCC;margin: 0 20px;}
#footer a:hover {color: #FFF;}
#footer hr{width: 100%; margin: 40px 0;}
/*dark mode*/
.dark .topnav a{color:#252528;}
.dark #herotitle h1, .dark #herotitle h2{color:#252528;}
.dark #herotext, .dark #herotext h2{color:#252528;}
/*popup*/
#popup { height : 250px; }
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}
.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
}
/* The Close Button */
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}
.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}
/* mobile */
@media screen and (max-width: 600px) {
  .topnav a, .topnav div a{display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .modal-content {
    width: 100%;
  }
}
@media screen and (min-width: 600px) {
	#logosm{display: inline;}
	#logolg{display: none;}
	#herotitle{transform: translate(0, 50%); margin: 40px auto;}
	#herotitle h1{font-size: 40px; line-height: 54px;}
	#herotext{transform: translate(0, 25%); margin: 40px; width: 66%;}
}
/* tablet */
@media screen and (min-width: 768px) {
	#logosm{display: inline;}
	#logolg{display: none;}
	#herotitle{transform: translate(0, 100%); margin: 20px auto;}
	#herotitle h1{font-size: 70px; line-height: 85px;}
	#herotext{transform: translate(0, 50%); margin: 80px; width: 66%;}
}
/* desktop */
@media screen and (min-width: 1024px) {
	#logosm{display: none;}
	#logolg{display: inline;}
	#herotitle{transform: translate(0, 75%); margin: 0 auto;}
	#herotitle h1{font-size: 90px; line-height: 108px;}
	#herotext{transform: translate(0, 75%); margin: 100px; width: 66%;}
}
