div.header, div.footer, div.container, div.headerbar, div.footerbar { float:left; width:100%; box-sizing:border-box }
body.margin div.header, body.margin div.footer, body.margin div.container { width:98%; margin:0 1% }
div.headerbar { padding:0 0 1.0em 0 }
div.headerbar a, div.footerbar a { float:left;/*height:2.0em;*/ display:inline-block; text-transform:uppercase; font-weight:bold; text-decoration:none }
div.headerbar a { margin:1.0em 0 0 1.0em; padding:0 10px; box-sizing:border-box; overflow:hidden;line-height:2.0em }
/*div.footerbar { padding:2% 2% 2% 2% }*/
div.footer div.footer-left,
div.footer div.footer-right { float:left; width:50%; padding:2%;/* line-height:2.0em; background-color:inherit*/ }
div.footer div.footer-right { text-align:right }
div.footerbar a { /*height:2.0em;*/ display:inline-block; text-transform:uppercase; font-weight:bold;
 /*margin:1.0em 0 0 1.0em; padding:0 10px; box-sizing:border-box; overflow:hidden;*/
 background-color:inherit;/* line-height:2.0em*/ }
body div.headerbar a { transition:0.6s ease-out }
body div.footerbar a:hover { transition:0.6s ease-in }
/*div.content.link a { text-decoration:underline }*/




body > div.body > div.container > ul.menu { background-color:inherit }
body > div.container > div.content.left > ul.menu > li { width:98%; padding:1%;
  margin:0 1%; box-sizing:border-box; background-color:#0000cc }
/*body > div.container > div.content.left > ul.menu > li a { width:98%;
   margin:0 1%; padding:1%; box-sizing:border-box; background-color:#00cc00 }*/

body.opaque > div.body > div.footer { float:left; height:40px; position:absolute; top:calc(100% + 4.0em) }
body.debug div.header > div.headerbar, body.debug div.footer > div.footerbar
 { background-color:#808080 }
/*body > div.body > div.header > div.headerbar > div.headerleft,
body > div.body > div.header > div.headerbar > div.headerright { width:100%; float:left }*/
body > div.body > div.header > div.headerbar > div.navitem
 { float:left; /*margin:0 1% 1% 0*/ }
/*body > div.body > div.header > div.headerbar > div.navitem a:link,
body > div.body > div.container > div.header > div.headerbar > div.navitem a:link,
body > div.body > div.footer > div.footerbar > div.footerright a:link { color:#cccc00 }
body > div.body > div.header > div.headerbar > div.navitem a:visited,
body > div.body > div.container > div.header > div.headerbar > div.navitem a:visited,
body > div.body > div.footer > div.footerbar > div.footerright a:visited { color:#cccc00 }*/
body div.headerbar.ul a:hover, body div.headerbar.ul a:active { border-bottom-width:3px; border-bottom-style:solid }
body div.headerbar.tile a,
body div.footerbar.tile a { border-radius:12px; }
/*body > div.body > div.header > div.headerbar > div.navitem a:active,
body > div.body > div.container > div.header > div.headerbar > div.navitem a:active,
body > div.body > div.footer > div.footerbar > div.footerright a:active { color:#cccc00 }*/

body.margin.opaque div.container { float:left; height:calc(100% - 160px); position:absolute; top:4.0em }
body div.container > div.content,
div.layout > div.content
 { float:left; padding-top:.66em }
body.dist div.container > div.content.main
 { float:left; width:99%; margin:2% 0.5% 2% 0.5%; text-align:justify; background-color:inherit; /*height:100%;*/ }
body div.container > div.content.left,
body div.container > div.content.right
 { float:left; /*width:99%; margin:2% 0.5% 2% 0.5%;*/ text-align:center;
   overflow:hidden; /*position:relative; height:100%*/ }
body.debug div.content.main, body.debug div.content.main h1 { color:#000000; background-color:#c0c0c0 }
body.debug div.content.main a { color:blue }
body.debug div.content.main a:visited { color:red }

/* Section */
body /*> div.body > div.container > div.content >*/ div.section-wrapper,
body /*> div.body > div.container > div.content >*/ div.section-wrapper > div.section-item
 { float:left; width:100%; margin:0 }
body /*> div.body > div.container > div.content >*/ div.section-wrapper.margin
 { width:94%; margin:0 3% }
body >/* div.body > div.container > div.content >*/ div.section-wrapper > div.section-item
 { float:left; width:100%; margin:0; padding:1px }
body /*> div.body > div.container > div.content >*/ div.section-wrapper.margin > div.section-item
 { float:left; width:100%; margin:.66em 0 0 0 /*padding:5%*/ }
body /*> div.body > div.container > div.content >*/ div.section-wrapper.margin > div.section-item:last-child
 { float:left; width:100%; margin:.66em 0 .66em 0 /*padding:5%*/ }
body /*> div.body > div.container > div.content >*/ div.section-wrapper /*> div.section-item >*/ div.section-head,
body /*> div.body > div.container > div.content >*/ div.section-wrapper /*> div.section-item >*/ div.section-foot,
body /*> div.body > div.container > div.content >*/ div.section-wrapper /*> div.section-item >*/ div.section-info,
body /*> div.body > div.container > div.content >*/ div.section-wrapper /*> div.section-item >*/ div.section-book
  { float:left; width:100%; box-sizing:border-box; margin:0; padding:.66em 1% }

/*
div.image { width: 98%; float:left; margin:2% 1% 2% 1%; padding:0 }
div.image-half { width:49%; float:left; margin:2% 0 2% 1%; padding:0 }
div.image-half:last-child { width:49%; float:left; margin:2% 1% 2% 0; padding:0 }
div.image-half.center { width:98%; float:left; margin:2% 1% 2% 1%; padding:0 }
div.image blockquote, div.image-half blockquote,
div.image-half.center blockquote { font-family:'Open Sans Display';
 font-weight:bold; margin:1% 1% 0 1%; padding:0 1% 1% 1%; float:left;
 text-align:left; border:0 }
div.image img { width:98%; height:auto; margin:0; padding:1%}
div.image-half img { width:98%; height:auto; margin:0; padding:1%; float:left }
*/
/* Menu */
div.content > ul.menu { width:96%; margin:2%; list-style:none; background-color:inherit }
div.content > ul.menu > li { width:96%; margin:0 2% 2% 2% }
div.content > ul.menu > li:hover { cursor:pointer }
div.content > ul.menu > li:first-child { margin:2% 2% 2% 4% }
/* Section */
body > div.body > div.container > div.content > div.section-wrapper.margin { width:98%; margin:0 1% 1% 1% }
body > div.body > div.container > div.content > div.section-wrapper > div.section-item > div.section-info > ul > li
 { width:100%; padding:0 0 1% 2%; box-sizing:border-box }

.column { float:left; width:55%; /*min-height: 400px;*/ box-sizing:border-box; margin: 2% 0.5% 2% 0.5%; padding: 1% 2% 1% 2%; }
.adlist { font-weight:bold }
div.sys-msg, div.sys-ok, div.sys-err, div.sys-state, div.sys-trace { margin:0; padding:0; float:left; font-size:0.8em }
div.sys-msg { margin: 0.5% 1%; padding: 0.5% 0.5%; width: 97%; background-color:black }
div.sys-msg code, div.sys-ok code, div.sys-err code, div.sys-state, div.sys-trace code { font-size:0.8em; border: 0;/* background-color:inherit*/ }
div.sys-state b { color: #80ff00; }
div.sys-trace b { color: #ffff80; }
div.sys-warn b { color: #ff8080; }
div.sys-ok { border: 0.5% solid #00ff00; }
div.sys-ok b { color: #00ff00; }
div.sys-err { border: 0.5% solid #ff0000; }
div.sys-err b { color: #ff0000; }

.aditem { }


a:link { }
a:visited { }
a:hover { }
a:active { }

.list { float:left;width:100%;margin: 0 }
.listrow { float:left;width:100%;}
.listcell { float:left;margin:0;padding: 1%; }
.listname { width:13%;float:left;margin:0;padding: 1%; }
.listdesc { width:83%;float:left;margin:0;padding: 1%; }
.listclr { float:left;width:32px;height:32px; }
.listhdr, .listdata { float:left;width:48%;margin:0;padding: 1%; }

@media only screen and (min-width: 600px) {
/*  body > div.body > div.header, body > div.body > div.footer { margin:1%; width: 98% }*/
/*  .navitem { width: 49% }*/
}
@media only screen and (min-width: 768px) {
/*  body > div.body > div.header, body > div.body > div.footer { margin:1%; width: 98% }*/
/*  .navitem { width: 24% }*/
}

@media all and (min-width: 1024px) {
  body.margin div.header, body.margin div.footer, body.margin div.container
    { width:91.67%; margin-left:4.165%; margin-right:4.165% }
}
@media only screen and (min-width: 1280px) {
  body.margin div.header, body.margin div.footer, body.margin > div.container
    { width:83.34%; margin:0 8.33% }

/*  #content { width: 76%; margin-left: 10%; margin-right: 10%; }*/
/*  body > div.body > div.container > div.content > div.section-wrapper.margin
    { width:98.5%; margin:0 .75% .75% .75% }
  body > div.body > div.container > div.content > div.section-wrapper.margin > div.section-item
    { width:100%; margin:0 0 .75% 0 }*/
}
@media only screen and (min-width: 1440px) {
  body.margin div.header, body.margin div.footer, body.margin div.container
    { width:66.68%; margin-left:16.66%; margin-right:16.66% }

/*  body > div.body > div.header > div.headerbar > div.headerleft { width:90% }
  body > div.body > div.header > div.headerbar > div.headerright { width:10% }*/
  div.image-half { width:48%; margin:2% 0 2% 2% }
  div.image-half:last-child { width:48%; margin:2% 2% 2% 0 }
  div.image-half.center { width:48%; margin:2% 26% 2% 26% }
  div.image blockquote, div.image-half blockquote,
  div.image-half.center blockquote { padding:0 2% 2% 2% }
/*  div.image img, div.image-half img { width:96%; padding:2% }*/
/*  div.content > ul.menu { width:92%; margin:2% 4% }
  div.content > ul.menu > li { width:96%; margin:0 2% .5% 2% }*/
  body > div.body > div.container > div.content > ul.menu > li:first-child { margin:.5% 2% .5% 2% }
/*  body > div.body > div.container > div.content > div.section-wrapper.margin
    { width:99%; margin:0 .5% .5% .5% }
  body > div.body > div.container > div.content > div.section-wrapper.margin > div.section-item
    { width:100%; margin:0 0 .5% 0 }
  body > div.body > div.container > div.content > div.section-wrapper > div.section-item > div.section-info > ul > li
   { padding:0 0 1% 2% }*/
/*  .column { width: 66%; margin-left: 15%; margin-right: 15%; }*/
}
@media only screen and (min-width:1920px) {
  body.margin div.header, body.margin div.footer, body.margin div.container
   { width:58.35%; margin-left:20.825%; margin-right:20.825% }

/*  body > div.body > div.container > div.content > div.section-wrapper.margin
    { width:98.5%; margin:0 .75% .75% .75% }
  body > div.body > div.container > div.content > div.section-wrapper.margin > div.section-item
    { margin:0 0 .25% 0 }
  body > div.body > div.container > div.content > div.section-wrapper.dist > div.section-item > div.section
    { margin:0 0 .25% 0 }*/
}
@media only screen and (min-width:2048px) {
  body > div.body.margin > div.container
    { width:50.02%; margin:0 24.99% }
}
