*{margin:0;padding:0;box-sizing:border-box;font-family:Roboto,sans-serif;}
p {padding: 10px;text-align: justify; border-radius: 5px; background-color: rgb(255 255 255 / 58%);}
h2,h3,h4 {margin: 20px 0;border-radius: 40px; background-color: rgb(255 255 255 / 58%); padding: 7px;}
body{background: url(../img/bg.png); background-size: contain; background-repeat-y: no-repeat; background-attachment: fixed; background-color: #000012;}
h1{text-align: center; font-weight: 900; font-size: 38px; margin: 20px; border-radius: 40px; background-color: rgb(255 255 255 / 58%);}
ul, ol{margin-left: 30px;}
table {border-collapse: collapse;overflow: overlay;width: 100%;margin: 10px 0;}
th, td{border:1px solid;padding: 5px;text-align:center;background-color: #54869e;}
nav {background-color: #2c2d30; height: 100px; padding: 10px 16px; display: flex; align-items: center;}
.logo {position: absolute; right: 40%;}
#container {max-width: 1200px; margin: 0 auto; padding: 0 50px;}
.quote {padding: 20px 40px; font-style: italic; background: url(../img/left-quote.png) no-repeat left 12px top 12px,url(../img/right-quote.png) no-repeat right 12px bottom 12px,linear-gradient(90deg,#68696b 0,#0b0b0c 100%); border-radius: 12px; color: white;}
.tableofcontents {padding: 8px; background-color: #ffffff94; text-decoration: none; margin: 8px; border-radius: 13px; font-weight: 800; color: #111112; display: inline-block;}
.tableofcontents:hover{background-color:#d26f6f;box-shadow:0 0 30px #ff0000}
.demo-left {width: 70%; float: left;}
.iframe-demo-game {width: 96%; margin: 30px 2%;}
.reg-button {text-align: center;}
.demo-right {width: 28%; float: left; margin-left: 2%; text-align: center;}
.gamesrow {border-style: dotted; border-radius: 20px; padding: 5px; border-color: #fc000099; display: flex; margin: 5px; background-color: rgb(255 255 255 / 58%);}
.left {width: 20%; float: left;}
.left img {height: auto; width: 100%; border-radius: 15px; max-width: 150px;}
.right {width: 80%; float: left; text-align: center; padding: 0 10px;}
.name {width: 100%; font-size: x-large; font-weight: 800; margin: 10px 0;}
.bonus {width: 80%; margin-left: 10%; background: #569213; font-size: large; font-weight: 600; padding: 10px; border-radius: 50px;}
.bonusdesc {width: 100%; text-align: justify; margin: 10px 0;}
#menu-footer, #menu ul{margin: 0; padding: 0; list-style: none;}
#menu-footer{margin: 0px 0 5px 0; }
#menu-footer li{display: inline-block; padding: 0 5px; border-left: 1px solid #EFE390;}
#menu-footer li:first-child{border: none;}
#menu-footer li a{color: #fff;}

@media screen and (max-width:1005px){
	.demo-left {width: 100%;}
	.demo-right {width: 100%; margin-left: unset;}
}

@media screen and (max-width:420px){
	.logo {right: 10%;}
	.tableofcontents{display: block;}
	.image {width: 90%; margin-left: 5%;}
	h1 {font-size: 22px;}
	#container {padding: 0px 10px;}
	p {font-size: 20px;}
}