@font-face {
  font-family:'ornated';
  src: url("font/GoudyMediaeval-Regular.woff2");
  font-display: swap;
}
@font-face {
  font-family:'fantasy';
  src: url("font/Cardo-Regular.woff2");
  font-display: swap;
}

html{background-color:#000000;}
*{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;letter-spacing:0.02rem;line-height:1.4em;}
body {font-size:18px;-webkit-font-smoothing: antialiased;font-family:sans-serif/*"fantasy"*/;}
a {text-decoration:none;}
small {font-size:0.75em;}
big {font-size:1.2em;}
.hytale a {color:#e4ad5b;}
.hytale a:hover {color:#ffffcc;}
.hytale .logo {padding:64px 0px;display:block;margin-bottom:-8px;}
.hytale .logo > img {display:block;margin:0 auto;height:160px;}
.hytale .logo > span {font-size:32px;color:#e4ad5b!important;font-weight:bold;font-family:"fantasy";text-align:center;text-shadow:1px 1px #000000,-1px -1px #000000,1px -1px #000000,-1px 1px #000000;}
.hytale .item {width:64px;height:64px;border:1px solid #112233;position:relative;background-color:#1e2f40;cursor:pointer;display:inline-block;margin:0;font-size:0px;}
.hytale .item::before {display:block;content:' ';position:absolute;left:0px;top:0px;right:0px;bottom:0px;border:1px solid #334455;}
.hytale .item > img {display:block;width:64px;height:64px;}
.hytale .navigation {height:48px;background-color:rgba(0,15,30,0.75);}
.hytale .backnav {text-align:center;clear:both;}
.hytale .subnav {font-size:1.2em;font-family:"fantasy";font-weight:bold;}
.hytale .subnav::before {content:'» ';color:#445566;}
.hytale .button {display:inline-block;padding:8px 32px;border:1px solid #334455;color:#bbccdd;font-weight:bold;border-radius:8px;cursor:pointer;background-color:#223344;cursor:pointer;}
.hytale .button:hover {background-color:#334455;color:#ffffff;}
.hytale .button:active {background-color:#445566;color:#ffffff;}
.hytale .width {max-width:1024px;margin:0 auto;}
.hytale > .background {position:fixed;left:0px;top:0px;bottom:0px;right:0px;background-image:url(img/back.jpg);background-position:50% 50%;background-size:cover;z-index:-10;}
.hytale .menubar {display:block;background:#223344;}
.hytale .menubar > * {line-height:2em;font-size:1em;font-family:"fantasy";font-weight:bold;text-align:center;}
.hytale .menubar > ul {list-style-type:none;}
.hytale .menubar > ul > li {display:inline-block;color:#bbccdd;position:relative;}
.hytale .menubar > ul > li > a {color:#bbccdd;text-decoration:none;line-height:2em;display:inline-block;padding:0px 16px;line-height:2em;text-align:center;}
.hytale .menubar > ul > li > a:visited {color:#bbccdd;}
.hytale .menubar > ul > li:hover > a {color:#ffffff;}
.hytale .menubar > ul > li.active > a {color:#e4ad5b;}
.hytale > .wrapper {padding:0px 16px 96px 16px;}
.hytale .box {background-color:rgba(0,15,30,0.88);color:#bbccdd;border-radius:4px;border:2px solid #334455;box-shadow:0px 0px 1px #000000,inset 0px 0px 5px #000000;position:relative;margin-top:8px;}
.hytale .box.opaque {background-color:rgba(0,15,30,1);}
.hytale .message {padding:8px;font-size:0.75em;margin-top:8px;}
.hytale .message.alert {color:#ffffff;background-color:#aa1122;font-weight:bold;}
.hytale .box.content > .inner {padding:48px;position:relative;}
.hytale .box.content > .inner > * {margin-top:1em;margin-bottom:1em;}
.hytale .box.content > .inner h1::before {content:'~ ';}
.hytale .box.content > .inner h1::after {content:' ~';}
.hytale .box.content > .inner h1 {font-size:4em;margin-top:1.4em;margin-bottom:0.2em;font-family:"ornated";text-align:center;color:#e4ad5b;white-space: nowrap;overflow:hidden;}
.hytale .box.content > .inner > *:first-child {margin-top:0em;}
.hytale .box.content > .inner > *:last-child {margin-bottom:0em;}
.hytale .box.content > .inner h2::before {content:'~ ';}
.hytale .box.content > .inner h2::after {content:' ~';}
.hytale .box.content > .inner h2 {font-size:2em;margin-top:1.2em;margin-bottom:0.2em;font-family:"fantasy";text-align:center;color:#e4ad5b;font-weight:bold;white-space: nowrap;overflow:hidden;}
.hytale .box.content > .inner h3 {font-size:1.2em;margin-top:1em;margin-bottom:0.2em;font-family:"fantasy";color:#e4ad5b;font-weight:bold;white-space: nowrap;overflow:hidden;}
.hytale .box.content > .inner ul {list-style-position: outside;margin-left:20px;}
.hytale .box.content > .inner {line-height:1.5em;text-shadow:0px 1px 1px #000000;}
.hytale .box.content > .bottom {text-align:center;padding-bottom:48px;}
.hytale .box.commands .inner h2::before {display:none;}
.hytale .box.commands .inner h2::after {display:none;}
.hytale .box.commands .inner h2 > span {font-size:0.5em;color:#bbccdd;}
.hytale .box.commands .inner h2 {text-align:left;}
.hytale .box.wiki >.inner h2 {font-size:1.2em;margin-top:1em;margin-bottom:0.2em;font-family:"fantasy";color:#e4ad5b;font-weight:bold;}
.hytale .box.wikiDetail >.inner h2 {text-align:left;}
.hytale .box.wikiIndex >.inner .q {text-align:center;}
.hytale .box.wikiDetail .article_img {float:right;padding-left:48px;margin:0px;}
.hytale .box.wikiDetail .article_img > div {padding:8px;background-color:#1e2f40;border:1px solid #334455;margin-bottom:16px;}
.hytale .box.wikiDetail .article_img > div > img {display:block;width:360px;}
.hytale .box.wikiDetail .inner::after {clear:both;display:block;content:'';}
.hytale .box.intro .inner > * {margin-top:0.8em;margin-bottom:0.8em;}
.hytale .serverStatus > .good {color:#66ff88;}
.hytale .serverStatus > .bad {color:#ff7788;}
.hytale .serverStatus > .neutral {color:#667788;}
.hytale .serverStatus {font-family:sans-serif;font-size:0.7em;padding-top:16px;}
.hytale .copyable {border:1px solid #112233;position:relative;background-color:#1e2f40;display:inline-block;font-size:18px;}
.hytale .copyable > div {border:1px solid #334455;padding:16px 32px;}
.hytale .copyable > div > div:first-child {font-weight:bold;color:#e4ad5b;font-family:"fantasy";font-size:1.2em;}
.hytale .serverBox {text-align:center;}
.hytale .overlay {position:fixed;top:0px;left:0px;right:0px;bottom:0px;background-color:rgba(0,0,0,0.5);}
.hytale .overlay > .boxWrapper {max-width:640px;margin:60px auto;box-shadow:0px 8px 16px #000000;}
.glossar {cursor:pointer;}
.glossar:hover {color:#ffffff;}
.glossar sup{font-size:0.7em;font-family:sans-serif;vertical-align:top;font-weight:bold;color:#667788;}
@media only screen and (max-width: 720px) {
	body {font-size:16px;}
	.hytale .wrapper {padding:0px;}	
	.hytale > .wrapper .box {border:none;box-shadow:none;}
	.hytale .logo {padding:16px;}
	.hytale .logo > img {height:48px;}
	.hytale .logo > span {font-size:16px;}
	.hytale .subnav {font-size:1.0em;}
	.hytale .menubar > ul > li {padding:8px 0px;}
	.hytale .menubar > ul > li > a {padding:0px 4px;}
	.hytale .box {border-radius:0px;}
	.hytale .box.content > .inner {padding:24px;}
	.hytale .box.content > .inner h1 {font-size:2em;}	
	.hytale .box.content > .inner h2 {font-size:1.4em;}
	.hytale .box.content > .inner p {text-align:justify;}
	.hytale .box.content > .inner h2 {font-size:1.4em;}	
	.hytale .box.wikiDetail .article_img {width:auto;float:none;padding:0px;}
	.hytale .box.wikiDetail .article_img > div {}
	.hytale .box.wikiDetail .article_img > div > img {display:block;width:100%;}
	.hytale .box.wikiDetail .inner::after {display:none;}
	.hytale .copyable {width:auto;margin:0px;display:block;}
	.hytale .copyable > div {padding:16px 0px;}	
	.hytale .overlay > .boxWrapper {max-width:none;margin:16px;}
}	
.ornated {font-family:"fantasy";font-size:1.2em;color:#e4ad5b;}
.center {text-align:center!important;}
.bold {font-weight:bold;color:#e4ad5b;}
.strong {color:#e4ad5b;font-weight:bold;}
.pileWrapper {position:relative;}
.pileHolder {position:absolute;left:0px;top:0px;bottom:0px;right:0px;overflow:hidden;}
.pile {width:38px;height:28px;position:absolute;background-image:url(img/pile.png);background-size:100% 100%;position:absolute;left:0px;bottom:0px;margin-left:-19px;}
.pile.animated {transform:translate(0px, 0px);transition:transform 1000ms ease-in;}
.pile.spawn {transform:translate(0px, -360px);}
.pile.animated2 {opacity:1;transition:opacity 1000ms ease;}
.pile.fade {opacity:0;}
.pile.ready:hover {height:32px;}
