

html {font-size:16px;}
body {margin:0;padding:0 0 4em 0;width:100%;text-align:center;font:1em/1.5 'Open Sans',sans-serif;background:#234;color:#fff;overflow-x:hidden;overflow-y:scroll;}

@keyframes waitspin {0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
#wait {position:fixed;width:96px;height:96px;top:50%;left:50%;transform:translate(-50%,-50%);margin:-64px 0 0 -64px;
border-radius:50%;border:16px solid;border-color:#DA2128 #0000FF #DA2128 #0000FF;z-index:9;
animation: waitspin 2s linear infinite;box-shadow:0 0 1em rgba(0,0,0,0.4), inset 0 0 1em rgba(0,0,0,0.4);}
.wait_bgnd {position:fixed;top:0;left:0;width:100%;height:100%;background:url(/img/empty64.gif);display:none;}

img {margin:0;}
a {text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.main {position:relative;user-select:none;-moz-user-select:none;}
.group {display:block;box-sizing:border-box;padding:0;margin:0 auto;width:94%;transition:top 0.5s, left 0.5s, width 0.5s;}
.group h3 {margin:0 0 0.5em 0;padding:0.5em;text-align:center;box-sizing:border-box;border-bottom:1px solid rgba(0,0,0,0.5);}
.group h2 {letter-spacing:0.2em;padding:0.25em 0;}
.group.wide {background:rgba(255,255,255,0.15);box-shadow:0 0 1em rgba(0,0,0,0.55);}
.group.narrow {}
.links {padding:0;}
.links.icon p {margin:0.75rem 0 0 0;padding:0;}
.links.icon a {display:block;line-height:3em;margin:0;padding:0 2.25em 0 2em;color:#AFEEEE;background-color:#141F29;x:rgba(0,0,0,0.4);}
.links.icon img {height:2em;width:auto;vertical-align:middle;margin:-0.2em 0.5em 0 0;}
.links.big-icon p {margin:0.75rem 0 0 0;}
.links.big-icon a {display:block;margin:0;padding:0.5em 0;}
.links.big-icon img {vertical-align:text-bottom;}
.links.big-icon .text {line-height:1em;}
.font20 {font-size:1.25em;}


@font-face {
	font-family:"icomoon";
	font-style: normal;
	font-weight: normal;
	src:url(/ico/icomoon/fonts/icomoon.ttf);
}



.menu-btn {position:fixed;top:14px;right:10px;color:#fff;font:32px/40px icomoon;z-index:9;width:40px;text-align:center;background:#000;cursor:pointer;}

#menuside {position:fixed;top:0;bottom:0;width:20em;max-width:100%;padding:0;opacity:1;background:#000;color:#def2f7;z-index:7;overflow-y:hidden;transition:0.35s;right:0;transform:translateX(100%);}
#menuside hr {border:none;border-bottom:2px solid rgba(255,255,255,0.2);}
.main-menu {text-align:left;padding:1em;height:100%;overflow-y:auto;}
.main-menu a {text-decoration:none;color:#fff;}
.mitem {display:block;line-height:1em;padding:0.55em 1em 0.55em 0.5em;cursor:pointer;}
.mitem:hover {background-color:rgba(255,255,255,0.15);}
.mitem::before {content:"\f078";font-family:icomoon;float:left;margin:0 0.5em 0 0;}
.mitem.act {color:#FFD700;background:rgba(0,0,0,0.2);}
#menuside .mitem::before {color:#FFD700;}
#menuside .mitem:hover {color:#fff;}

@media (min-width:600px) {
	.main {opacity:0;transition:opacity 0.5s;}
	.group {max-width:300px;}
}
/* pc, laptop, none mobiles: (hover:hover) and (pointer:fine) */
@media (pointer:fine) {
	.links p {transition:transform 0.3s;}
	.links p:hover {transform:scale(1.05);}
}


.kill_bgnd {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,200,0.2) url(/img/bg-kill-3.png);opacity:0;transition:opacity 0.5s;}

.dialog {position:fixed;top:0;left:50%;max-width:90%;transform:scale(0.9) translateX(-55%);background:#f0f0f0;opacity:0;transition:opacity 0.25s, transform 0.25s;box-shadow:0 0 1em rgba(0,0,0,0.5);overflow:hidden;}
.dialog.show {transform:scale(1) translateX(-50%);opacity:1;transition:0.35s;}
.dialog_head {position:relative;font-size:1.125em;padding:0.25em 8px 0.2em 0.75em;background:linear-gradient(#0033cc,#003399);color:#fff;letter-spacing:1px;}
.dialog_div {position:relative;visibility:hidden;opacity:0;}
.dialog_div.show {visibility:visible;transition:opacity 0.5s;opacity:1;}
.dialog_inner {position:relative;box-sizing:border-box;overflow:auto;user-select:text;-moz-user-select:text;}
.dialog_inner img {max-width:100%;} /* ei tarvitse olla? häiritsee img-bin-simple maskia */
.close {float:right;margin:-0.25em 0 0 0.5em;width:42px;height:16px;background:url(/img/close_nad.png);cursor:pointer;}
.close:hover {background-position: -42px 0;box-shadow:0 0 16px #fff;}
.close:active {background-position: -84px 0;}
.close16 {position:absolute;top:0.5em;right:0.5em;width:16px;height:16px;background:url(/img/close_nad.png) -164px 0;cursor:pointer;}
.close16:hover {background-position: -182px 0;}
.close16:active {background-position: -200px 0;}
.closegray {background-color:rgba(0,0,0,0.3);}

.dlg-toast {position:fixed;bottom:5em;max-width:50%;text-align:center;padding:0.25em 1em 0.25em 1em;background:#000;color:#fff;box-shadow:0 0 1em #000;transition:opacity 0.5s;overflow:hidden;}

.dlgs {padding:1.5em 70px 2em 70px;color:#222;min-height:4em;}
.dlgs a {color:#0000ff}
.dlgi {width:60px;height:64px;background:url(/img/dlg-icons.png) no-repeat;margin:8px 0 0 8px;}
.dlgi.err {background-position: 0 0;}
.dlgi.info {background-position: -60px 0;}
.dlgi.ok {background-position: -120px 0;}
.dlgi.yesno {background-position: -180px 0;}
.dlgi.alert {background-position: -240px 0;}
.dlgi.not {background-position: -310px 0;}
.dlgi.stop {background-position: -370px 0;}
.dlgi.remark {background-position: -430px 0;}
.dlgi.add {background-position: -495px 0;}
.dlgi.edit {background-position: -556px 0;}
.dlgi.swap {background-position: -684px 0;}
.dlgi.new {background-position: -747px 0;}
.dlgi.prompt {background-position: -808px 0;}
.dlgi.mar {margin:0 -24px 0 0;}
.dlgs_btn {background:rgba(0,0,0,0.05);padding:0.5em 0 0.5em 0;text-align:center;border-top:1px solid #ccc;}
.dlgs_btn button {margin:0 1em 0 1em;width:100px;}

button {font:inherit;cursor:pointer;outline:none;-BRW-user-select:none;}
button *, .valign {vertical-align:text-bottom;}
.boton {font:500 1.125em/125% FONTSANS;padding:0.3em 1em 0.25em 1em;color:#fff;margin:0 0.5em 0 0;border-radius:0.25em;border:2px solid #fff;background:none;}
.boton.w100 {display:block;}
.boton img {float:right;margin:0 -11px 4px 20px;}
.boton:hover {text-shadow:1px 1px 1px rgba(0,0,0,0.3);}
.boton a {color:inherit;cursor:pointer;}
.boton a:hover {color:inherit;}
.boton em {color:#000;font:italic 0.778em/140% serif;display:block;margin:0.25em 55px 0 0;}
.boton.right {margin:0 0 0.5em 1em;}
.boton.setti {margin:0.25em 0.5em 0.25em 0;}
.boton.default {background-color:#7D81B7;}
.boton.orange {background-color:#FF9900;}
.boton.yellow {background-color:#F5DB00;color:#990000;}
.boton.yellow a {color:#FF4500;}
.boton.yellow:hover {text-shadow:1px 1px 1px #FFFF66;}
.boton.violet {background-color:#993366;}
.boton.violet em {color:#FFCC33;}
.boton.green {background-color:#33CC00;}
.boton.black {background-color:#222;}
.boton.black {color:#0066FF;}
.boton.blue {background-color:#0066FF;}
.boton.blue em {color:#66FFFF;}
.boton.pink{background-color:#FF00CC;}
.boton.red {background-color:#E31C19;}
.boton.dusky {background-color:rgba(0,0,0,0.2);}
.boton.dusky em {color:#000;}
.boton.shade {box-shadow:2px 2px 6px rgba(255,255,255,0.2) inset, 2px 2px 8px rgba(0,0,0,0.2);}

.boton:disabled {color:#999;background-color:#D1D1D5;text-shadow:1px 1px 1px #fff;border-color:#bbb;pointer-events:none;}
.boton:disabled a {cursor:default;color:inherit;}
.boton:disabled em {color:inherit;}
.boton:disabled img {filter:grayscale(100%);opacity:0.4;}
.boton:active {border-color:rgba(0,0,0,0.25)}
.boton:focus {border-color:yellow;}
