/*tags*/
html {
  min-height:100%;
  font-size:62.5%;
}

body {
  height:100%;
  position:relative;
  font-size:1.8rem;
  font-family:sans-serif;
}

img {
  max-width:100%;
  height:auto;
}

a {
  color:#336699;
  text-decoration:underline;
  cursor:pointer;
}

a:hover {color:#29547E;}


#header {margin-bottom:3rem;}

/*nav*/
#menu {margin:3rem 0 3rem 0; max-width:650px; margin:0 auto; font-size:1.95rem;}
#menu ul {margin:0; padding:0;}
#menu ul li {display:inline-block; margin:0; vertical-align:middle;}
#menu ul li a {display:block; text-decoration:none; background-color:#336699; color:#FFF; border-radius:3px; padding:0.5rem  1rem; cursor:pointer; font-size:1.95rem;}
#menu ul li a:hover {background-color:#29547E; color:#FFF; border-radius:3px;}

/*systemmessage*/
#systemmessage {position:sticky; bottom:20px; right:20px; width:20%; z-index:500; float:right;}
#systemmessage .content {padding:15px; background-color:#222; text-align:center; color:#EEE;}
#systemmessage .close-msg {font-weight:bold; cursor:pointer; color:#EEE; position:absolute; right:6px; top:6px; padding:2px 5px; text-align:center; z-index:501;}


/*misc*/
#main {overflow:hidden; clear:both;}

.text-right {text-align:right;}
.text-center {text-align:center;}

.success {
  padding:2rem;
  margin:2rem 0 2rem 0;
  background-color:#f8fff0;
  color:#234600;
  border:1px solid #be7;
  max-width: 800px;
}

.error {
  padding:2rem;
  margin:2rem 0 2rem 0;
  background-color:#fef5f1;
  color:#8c2e0b;
  border:1px solid #ed541d;
  max-width: 800px;
}

.notice {
  padding:2rem;
  margin:2rem 0 2rem 0;
  background-color:#ECF2F9;
  color:#29547E;
  border:1px solid #336699;
}

.red {color:red; font-weight:bold;}
.orange {color:orange; font-weight:bold;}
.green {color:green; font-weight:bold;}

.mb-2 {margin-bottom:2rem;}
.mt-2 {margin-top:2rem;}

#stage {
  max-width:650px;
  margin:0 auto;
  font-size:1.95rem;
}