/* quicksand-regular - latin_latin-ext */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/quicksand-v13-latin_latin-ext-regular.eot?#iefix) format('embedded-opentype'), /* IE6-IE8 */
       url(../fonts/quicksand-v13-latin_latin-ext-regular.woff2) format('woff2'), /* Super Modern Browsers */
       url(../fonts/quicksand-v13-latin_latin-ext-regular.woff) format('woff'), /* Modern Browsers */
       url(../fonts/quicksand-v13-latin_latin-ext-regular.ttf) format('truetype'), /* Safari, Android, iOS */
       url(../fonts/quicksand-v13-latin_latin-ext-regular.svg#Quicksand) format('svg'); /* Legacy iOS */
}

/* quicksand-700 - latin_latin-ext */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url(../fonts/quicksand-v13-latin_latin-ext-700.eot?#iefix) format('embedded-opentype'), /* IE6-IE8 */
       url(../fonts/quicksand-v13-latin_latin-ext-700.woff2) format('woff2'), /* Super Modern Browsers */
       url(../fonts/quicksand-v13-latin_latin-ext-700.woff) format('woff'), /* Modern Browsers */
       url(../fonts/quicksand-v13-latin_latin-ext-700.ttf) format('truetype'), /* Safari, Android, iOS */
       url(../fonts/quicksand-v13-latin_latin-ext-700.svg#Quicksand) format('svg'); /* Legacy iOS */
}

body { font: 13px 'Quicksand', arial, sans-serif; text-align: center; margin: 0; padding: 0; background-color: #e6ebef; }

input, textarea, select { font-family: inherit; font-size: inherit; background-color: #FFFFFF; }
xtextarea { font-size: 1.11em; height: 7em; }

a { text-decoration: none; color: #114067; font-weight: 700; margin: 3px 10px; padding: 6px 10px; display: inline-block; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: transparent; outline: none; }

* { box-sizing: border-box; }

div { overflow: hidden; }
div.container { margin: 0px auto; }
div.container_header { font-size: 2em; background-color: #6C8BA2; padding: 20px 10px; }
div.container_main { background-color: #e6ebef; padding: 10px; margin-bottom: 110px; }
div.container_footer { padding: 10px 10px; position: fixed; bottom: 0; width: 100%; height: 110px; background-color: #628198; }
div.container_list { margin: 10px auto; column-width: 300px; }
div.container_list p.catheader { background-color: #CCCCCC; color: #0C2A44; margin: 3px 0px; padding: 6px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
div.container_list.cols4 { column-count: 4; }
div.container_list.cols3 { column-count: 3; max-width: 1200px; }
div.container_list.cols2 { column-count: 2; max-width: 800px; }
div.container_list.cols1 { column-count: 1; max-width: 400px; }
div.container_catlist {  }
div.container_catlinks {  }
div.container_catlinks a { cursor: pointer; font-size: 1.1em; }
div.container_catlinks a:hover { color: #777777; }
div.container_catlinks a:active { color: #114067; }
div.form { width: 400px; margin: 15px auto; max-width: 100%; }
div.message { margin: 5px auto 15px auto; }
div.message a:hover { color: #316087; }
div.message a:active { color: #013047; }
div.formmodify { margin: 0px auto 15px auto; }
div.formmodify form { width: 160px; max-width: 40%; display: inline-block; }
div.list { margin: 0px auto; }
div.menu { margin: 5px auto; }
div.menu a { background-color: #849EB2; font-size: 1.2em; }
div.menu a.curPage { background-color: #a5c1d6; }
div.menu a:hover { background-color: #DAE2E8; }
div.menu a:active { background-color: #425768; color: #E5F1FB; }
div.menu form { width: 293px; margin: 5px auto; max-width: 100%; }
div.text { width: 400px; margin: 15px auto; max-width: 100%; }
div.text a { text-decoration: underline; font-weight: normal; }

div.catlist { width: 400px; margin: 0px auto 10px auto; background: #d7dce0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; max-width: 100%; }
div.catlist form { display: inline-block; width: 46%; margin: 1% 2%; }
div.catlist p { margin: 1%; font-size: 1.2em; }

input,
.message,
a,
textarea,
select { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: transparent; outline: none; }
input,
textarea,
select { width: 100%; border: 0px; }

button { border: 0; background: none; margin: 0; cursor: copy; }
button { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
button:active { background-color: #bcd3c4; }

p { margin: 0; }

.f_fie { margin: 4px 0px; padding: 15px; }
.f_but.getset { background-color: #2476B0; color: #E5F1FB; font-weight: 700; margin: 6px 0px; padding: 15px; }
.f_but.getset:hover { background-color: #68A6D2; color: #0C2A44; }
.f_but.getset:active { background-color: #064068; color: #E5F1FB; }
.f_but.getset.sub { background-color: #555555; color: #E5F1FB; font-weight: 700; margin: 6px 0px; padding: 10px; width: 50%; }
.f_but.getset.sub:hover { background-color: #777777; color: #0C2A44; }
.f_but.getset.sub:active { background-color: #333333; color: #E5F1FB; }
.f_but.getset.paste { display: none; }
.f_but.modify { width:94%; background-color: #DCDCDC; color: #222222; font-weight: 700; margin: 3px 0px; padding: 6px; }
.f_but.modify:hover { background-color: #8EA0AC; color: #0C2A44; }
.f_but.modify:active { background-color: #253A49; color: #E5F1FB; }
.f_but.list { background-color: #FFFFFF; color: #0C2A44; font-weight: 700; margin: 3px 0px; padding: 6px; }
.f_but.list:hover { background-color: #9eafba; color: #0C2A44; }
.f_but.list:active { background-color: #758189; color: #E5F1FB; }
.f_but.logout { background-color: #1E608E; color: #E5F1FB; font-weight: 700; margin: 6px 0px; padding: 10px; }
.f_but.logout:hover { background-color: #3E7296; }
.f_but.logout:active { background-color: #074067; }

.error { color: red; background-color: lightred; }
.message { width: 400px; max-width: 100%; padding: 8px 4px; margin: 8px auto 25px auto; border: 1px solid #CCCCDD; line-height: 1.4em; overflow-wrap: break-word; }
.message p { padding: 3px 0px; }
.messagefilled button { padding: 0px 3px; }
.messagefilled button.name,
.messagefilled button.bard { font-weight: 700; }
.messagefilled button.comment { }
.messagesuccess { color: #003000; background-color: #66cc99; border: 1px solid #66cc99; }
.messageerror { color: #440000; background-color: #e26a6a; border: 1px solid #e26a6a; }
.messageempty { color: #e6ebef; }
.messagehidden { border: 0px; }


select
{
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}

select::-ms-expand {
     display: none;
}
 
.selectwrapper {
  position: relative;
}
 
.selectwrapper:after {
    content: '\22C1';
    font-size: 16px;
    font-weight: 700;
    color: #888888;
    transform: scale(1.2, 1);
    right: 11px;
    top: 6px;
    height: 34px;
    padding: 10px 3px 0px 8px;
    border-left: 1px solid #D4D9DB;
    position: absolute;
    pointer-events: none;
}


@media screen and (max-width: 1080px) {

	xdiv.container_list { column-count: 3; }
}
@media screen and (max-width: 720px) {

	xdiv.container_list { column-count: 2; }
}
@media screen and (max-width: 480px) {

	xdiv.container_list { column-count: 1; }
}
@media screen and (max-width: 420px) {

	a { margin: 3px 5px; }
}
@media screen and (max-width: 360px) {

	a { margin: 3px 4px; }
}
@media screen and (max-width: 350px) {

	a { font-size: 1.1em; margin: 3px 3px; padding: 6px 8px; }
}
@media screen and (max-width: 300px) {

	a { display: block; margin: 5px 10px; }
}

@media screen and (max-height: 400px) {

	div.container_main { margin-bottom: 0; }
	div.container_footer { position: relative; }
}
