html{ font-size: 14px; }
.body{ background-color: #fff; margin: auto; padding: 0; }
.bold{ font-weight: bold; }
.white{ color: #fff; }
.center{ text-align: center; }
.left{ text-align: left; }
.right{ text-align: right; }
.top{ vertical-align: top; }
.middle{ vertical-align: middle; }
.bottom{ vertical-align: bottom; }
.floatl{ float: left; }
.floatr{ float: right; }
.mgnauto{ margin: auto; }
.mgnvauto{ margin-top: auto; margin-bottom: auto; }
.mgnhauto{ margin-left: auto; margin-right: auto; }
.mgntop2{ margin-top: 2px; }
.mgntop4{ margin-top: 4px; }
.mgntop8{ margin-top: 8px; }
.mgntop10{ margin-top: 10px; }
.mgntop12{ margin-top: 12px; }
.mgntop20{ margin-top: 20px; }
.mgnbtm2{ margin-bottom: 2px; }
.mgnbtm4{ margin-bottom: 4px; }
.mgnbtm8{ margin-bottom: 8px; }
.mgnbtm10{ margin-bottom: 10px; }
.mgnbtm12{ margin-bottom: 12px; }
.mgnbtm20{ margin-bottom: 20px; }
.mgn4{ margin: 4px; }
.mgn8{ margin: 8px; }
.mgn10{ margin: 10px; }
.mgnh4{ margin: 0 4px; }
.mgnh5{ margin: 0 5px; }
.mgnh8{ margin: 0 8px; }
.mgnh10{ margin: 0 10px; }
.mgnh12{ margin: 0 12px; }
.mgnv4{ margin: 4px 0; }
.mgnv8{ margin: 8px 0; }
.mgnv10{ margin: 10px 0; }
.mgnv20{ margin: 20px 0; }
.mgnv12{ margin: 12px 0; }
.mgnl2{ margin-left: 2px; }
.mgnl4{ margin-left: 4px; }
.mgnl8{ margin-left: 8px; }
.mgnl10{ margin-left: 10px; }
.mgnl20{ margin-left: 20px; }
.mgnr2{ margin-right: 2px; }
.mgnr4{ margin-right: 4px; }
.mgnr8{ margin-right: 8px; }
.mgnr10{ margin-right: 10px; }
.mgnr12{ margin-right: 12px; }
.mgnr20{ margin-right: 20px; }
.pad4{ padding: 4px; }
.pad8{ padding: 8px; }
.pad20{ padding: 20px; }
.pad30{ padding: 30px; }
.pad40{ padding: 40px; }
.padh4{ padding-left: 4px; padding-right: 4px; }
.padh8{ padding-left: 4px; padding-right: 8px; }
.padv2{ padding-top: 2px; padding-bottom: 2px; }
.padv4{ padding-top: 4px; padding-bottom: 4px; }
.padv8{ padding-top: 8px; padding-bottom: 8px; }
.padl4{ padding-left: 4px; }
.padl8{ padding-left: 8px; }
.padl10{ padding-left: 10px; }
.padl12{ padding-left: 12px; }
.padl20{ padding-left: 20px; }
.padr4{ padding-right: 4px; }
.padr8{ padding-right: 8px; }
.padr10{ padding-right: 10px; }
.padr12{ padding-right: 12px; }
.padr20{ padding-right: 20px; }
.padtop2{ padding-top: 2px; }
.padtop4{ padding-top: 4px; }
.padtop8{ padding-top: 8px; }
.padtop10{ padding-top: 10px; }
.padtop12{ padding-top: 12px; }
.padtop20{ padding-top: 20px; }
.padbtm2{ padding-bottom: 2px; }
.padbtm4{ padding-bottom: 4px; }
.padbtm8{ padding-bottom: 8px; }
.padbtm10{ padding-bottom: 10px; }
.padbtm12{ padding-bottom: 12px; }
.padbtm20{ padding-bottom: 20px; }
.nobdr{ border-width: 0; }
.header{ margin: 0; padding: 0; background: linear-gradient(to bottom, #00B894, #008A6F); color: #fff; text-align: center; border-bottom: 1px solid #005C4C; height: 110px; }
.headerchild{ margin: auto; padding: 10px 0 0 0; text-align: left; height: 100px; }
div.headertitle{ padding: 0; position: relative; height: 100px; }
div.headercaption{ font-size: 12px; width: 340px; }
div.headermenu{ float: right; margin: 10px 0 0 0; height: 40px; }
div.headerlang{ font-size: 12px; font-weight: normal; width: 340px; position: absolute; left: 0; bottom: 4px; }
div.headerad{ float: right; margin: 0 0 0 0; min-width: 728px; max-width: 820px; height: 90px; }
a.headermenu,a.headermenu:active,a.headermenu:link,a.headermenu:visited{ font-size: 20px; font-weight: bold; color: #fff; text-decoration: none; margin: 0 0 0 20px; }
a.headermenu:hover{ text-decoration: underline; }
a.title,a.title:active,a.title:link,a.title:visited{ font-size: 30px; font-weight: bold; color: #fff; text-decoration: none; }
a.title:hover{ text-decoration: underline; }
img.lang{ margin: 0 2px 0 0; border-width: 0; vertical-align: -1px; }
a.lang,a.lang:active,a.lang:link,a.lang:visited{ color: #fff; text-decoration: none; }
a.lang:hover{ text-decoration: underline; }
ul{ padding-left: 1.5rem; }
ul li{ margin-bottom: 0.5rem; }
h1{ display: inline; margin: 0; }
h2{ font-size: 1.2rem; border-left: 8px solid #117965; border-bottom: 1px solid #117965; padding: 0 0 0 4px; }
table.game{ border-collapse: collapse; padding: 0; margin: 10px auto; border-spacing: 0; }
table.games{ border-collapse: collapse; padding: 0; margin: 0; border-spacing: 0; }
td.game{ padding: 0; vertical-align: top; }
td.recomgame{ width: 150px; padding: 0; text-align: center; vertical-align: top; }
div.gamead{ margin: 0; padding: 0 0 10px 0; width: 336px; }
div.recomgame{ margin: 0 0 4px 0; padding: 0; }
img.recomgame{ width: 130px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
div.recomgameheader{ margin: 0 10px 10px 10px; padding: 4px; background-color: #008A6F; font-size: 14px; color: #fff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
a.recomgame,a.recomgame:active,a.recomgame:link,a.recomgame:visited{ filter: brightness(50%); }
a.recomgame:hover{ filter: brightness(100%); }
.round5 { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.collepicbox{
	padding: 10px;
	margin: 0 0 10px 0;
	background: #efefef;
	border: solid 1px #aaa;
	width: 314px;
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
}
div.footer{ font-size: 14px; margin: 20px 0 0 0; padding: 10px 0; background-color: #008A6F; color: #fff; text-align: center; }
span.footer{ margin: 0; padding: 0 10px; border-right: 1px dotted #9EE0D3; }
span.footer2{ margin: 0; padding: 0 10px; }
a.footer,a.footer:active,a.footer:link,a.footer:visited{ font-size: 14px; font-weight: normal; color: #fff; text-decoration: none; }
a.footer:hover{ text-decoration: underline; }
.hometitle { position: relative; padding: 0.8rem 1rem; color: #fff; border-radius: 5px; background: #117965; font-size: 1.5rem; font-weight: bold; }
.hometitle:after { position: absolute; bottom: -9px; left: 1em; width: 0; height: 0; content: ''; border-width: 10px 10px 0 10px; border-style: solid; border-color: #117965 transparent transparent transparent; }
.hometitle span { font-size: 1.1rem; font-weight: normal; display: inline-block; margin: 0 16px; }
.hometitle + p { margin-top: 20px; }

.homegame_container {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	gap: 20px;
	margin-bottom: 2rem;
}
.homegame_item {
	flex: 0 0 240px;
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	position: relative;
	overflow: hidden;
	background-color: #000;
	filter: drop-shadow(5px 5px 5px #444);
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
}
.homegame_item:hover .homegame_title {
	color: #66FFE2;
}
.homegame_item img {
	width: 240px;
	height: 240px;
	border-width: 0;
	display: block;
	margin-bottom: 14px;
}
.homegame_title {
	position: absolute;
	bottom: 4px;
	left: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 1);
	border-top: 1px solid #888;
	color: white;
	text-align: center;
	margin: 4px 0;
	padding: 4px 0 0 0;
	font-size: 14px;
}
.homegame_title a {
	color: #fff;
}

.othergame { margin: 30px 0 10px 0; padding: 4px; font-size: 1.5rem; font-weight: bold; border-left: 4px solid #117965; border-bottom: 1px solid #117965; color: #0C5547; }
.othergame_container {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	gap: 10px;
	margin-bottom: 2rem;
}
.othergame_item {
	flex: 0 0 140px;
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	position: relative;
	overflow: hidden;
	background-color: #000;
	filter: drop-shadow(5px 5px 5px #444);
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
}
.othergame_item img {
	width: 140px;
	height: auto;
	border-width: 0;
	display: block;
}
.othergame_title {
	position: absolute;
	bottom: -100%;
	left: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	color: white;
	text-align: center;
	margin: 4px;
	padding: 0;
	font-size: 14px;
	transition: bottom 0.2s ease;
}
.othergame_item:hover .othergame_title {
	bottom: 0;
}
.othergame_title a {
	color: #fff;
}

div.collepiclogo{ position: absolute; width: 100%; height: auto; left: 0; top: 0; }
img.collepiclogo{ border-width: 0; width: 100%; height: auto; }
div.newribbon{ position: absolute; width: 100%; height: auto; left: 0px; top: 0; }
img.newribbon{ border-width: 0; width: 64px; height: 65px; }
div.thirdribbon{ position: absolute; width: 60px; height: 60px; right: 0px; top: 0; }
img.thirdribbon{ border-width: 0; width: 60px; height: 60px; }
div.gametitle{ position: relative; text-align: left; font-size: 24px; font-weight: bold; color: #0C5547; padding: 0; margin: 0 10px 0 0; }
hr.gametitle{ height: 5px; background: linear-gradient(to right,#008A6F,#ffffff); border: none; margin: 0 0 10px 0; }
h1.gametitle{ display: inline; font-size: 24px; }
a.gametitle,a.gametitle:active,a.gametitle:link,a.gametitle:visited{ text-decoration: none; color: #0C5547; }
a.gametitle:hover{ text-decoration: underline; }
div.gamereset{ position: absolute; top: 0; right: 0; }
a.gamereset,a.gamereset:active,a.gamereset:link,a.gamereset:visited{ filter: contrast(100%); }
a.gamereset:hover{ filter: contrast(150%); }
div.aboutgame{ text-align: left; font-size: 1.5rem; font-weight: bold; color: #0C5547; padding: 0; margin: 10px 10px 0 0; }
hr.aboutgame{ height: 3px; background: linear-gradient(to right,#008A6F,#ffffff); border: none; margin: 0 0 10px 0; }
div.aboutgamein{ text-align: left; font-size: 1.1rem; color: #444; padding: 0; margin: 0 10px 10px 0; }
table.rank{ border-collapse: collapse; padding: 0; margin: 0 auto 20px auto; border-spacing: 0; }
td.rank{ padding: 0; vertical-align: top; }
table.nospc{ border-collapse: collapse; padding: 0; margin: 0; border-spacing: 0; }
td.nospc{ padding: 0; }
div.stitle { padding: 0; font-weight: bold; text-align: left; }
ul.howto{ padding: 4px 0 0 20px; margin: 4px 0 10px 0; text-align: left; }
div.hint { margin: 0; padding: 0; text-align: left; }
span.hint{ font-size: 0.9rem; font-weight: bold; margin: 0; padding: 0 10px; text-align: left; background-color: #008A6F; color: #fff; }
hr.hint{ height: 1px; background: #008A6F; border: none; margin: 0 10px 10px 0; }
div.date_title{ background-color: #eee; color: #000; font-size: 1.2rem; font-weight: bold; text-align: left; margin: 0; padding: 4px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
div.date_body{ font-size: 1rem; text-align: left; margin: 0 0 10px 10px; padding: 0; }
div.sect_title{ font-size: 1.2rem; font-weight: bold; margin: 20px 0 0 0; padding: 0; }
div.sect_body{ font-size: 1rem; line-height: 1.5; margin: 0 0 0 20px; padding: 0; }
ul.sect_body{ font-size: 1rem; line-height: 1.5; margin: 0 0 0 40px; padding: 0; }
ol.sect_body{ font-size: 1rem; line-height: 1.5; margin: 0 0 0 40px; padding: 0; }
span.whatsbasic{ display: block; margin-bottom: 20px; }
span.whatsbasic img{ margin-right: 8px; vertical-align: middle; }
#game-base {
  -webkit-user-select: none;  /* Chrome or Safari */
  -moz-user-select: none;     /* FireFox */
  -ms-user-select: none;      /* IE */
  -o-user-select: none;       /* Opera */
  user-select: none;
}