body {background-color:#fff0d0; color:#444444; font-size:1em; font-family: Arial, Helvetica, Verdana, sans-serif; margin:0px auto 0px auto; max-width:1024px;}
a {color:#aa642c;}

#main {background-color:#ffffff; width:100%;}

#top {display:flex; flex-wrap:wrap; background-color:#2c7586; color:#ffffff; margin-bottom:40px;}
#logo {width:280px; position:relative; left:20px; top:18px;}
#logo img {border:0px;}
#bar {vertical-align:middle; background-color:#2c7586; padding-top:25px;}
#bar h1 {margin-left:14%; min-width:355px;}

#tail {display:block; width:100%; bottom:0px;}
#cright {display:block; width:100%; background-color:#f2f2f2; margin:0px; padding:10px 0px 10px 0px;}
#cright a {display:block; margin-left:20px; text-decoration:none;}

#bod {padding-left:25px;}
#bod h2, #bodform h2 {font-size:22px;}
#bod p, #bodform p {font-size:16px; margin:20px 5px 15px 0px;}
#bod p.sml, #bodform p.sml {font-size:12px;}
#bod p.tight, #bodform p.tight {margin:0px;}
#bod ul.tight, #bodform ul.tight {margin-top:3px; margin-bottom:3px;}
a.noline {text-decoration:none;}
a.noline:hover {text-decoration:underline;}

.dberror {color:#990000; font-weight:bold;}
.successmsg {color:#006600; font-weight:bold;}
p.foll {margin-top:2px !important;}
p.smaller {font-size:.8em !important;}

div.headingbarwide {background-color:#ffe9bb; margin-right:20px; padding:5px; font-weight:bold;}

#register input[type="button"] {display:inline-block; margin-bottom:20px;}
#register label {display:inline-block; width:300px; text-align:right;}
#register input, #register select {border-radius:5px;}
#register .regline {margin:6px 0px 6px 0px;}
#register .offset {margin-left: 300px;}
#regfeedback {display:none; margin: 15px 15px 20px 0px;}
#regfeedback .mgood {display:inline-block; padding:5px;background-color:#bcddbc; color:#005500;}
#regfeedback .mbaad {display:inline-block; padding:5px; background-color:#ffcccc; color:#660000;}
#regfeedback .mbago {display:inline-block; padding:5px; background-color:#dddddd; color:#666666;}

#login label {display:inline-block; width:100px; text-align:right;}
#login input, #login select {border-radius:5px;}
#login .offset {margin-left: 110px;}


/* Forms */
#formbod {}
h2.fhead {float:left; margin-left:8px;}
p.fhead {padding-left:8px;}
p.trlog {float:right;}
div.clear {clear:both;}
#applform input, #applform select, #applform textarea {border-radius:5px;}

#popmsg {display:none; position:fixed; bottom:30%; right:40%; text-align:center; max-width:300px; border-radius:10px; font-size:2em;}
#popmsg .mgood {background-color:#bcddbc; color:#006600; padding:30px;}
#popmsg .mbaad {background-color:#ffccbb; color:#990000; padding:30px;}
.wordcount {font-size:.8em; font-style:italic;}

#sect1 {border-left: 8px solid #999999; border-right: 8px solid #999999; padding:0px;}
#sect2 {border-left: 8px solid #006600; border-right: 8px solid #006600; padding:0px;}
#sect3 {border-left: 8px solid #ffb964; border-right: 8px solid #ffb964; padding:0px;}
#sect4 {border-left: 8px solid #993300; border-right: 8px solid #993300; padding:0px;}
#sect5 {border-left: 8px solid #002266; border-right: 8px solid #002266; padding:0px;}
#sect6 {border-left: 8px solid #770077; border-right: 8px solid #770077; padding:0px;}
#sect7 {border-left: 8px solid #ff8844; border-right: 8px solid #ff8844; padding:0px;}
#sect8 {border-left: 8px solid #00ccaa; border-right: 8px solid #00ccaa; padding:0px;}
.sectinner {padding:20px;}
.abuttons {text-align:center; margin:12px 2px 12px 2px;}
.bbuttons {margin:20px 2px 12px 0px;}
.abuttons a, .bbuttons a {display:inline-block; margin:0px 4px 0px 4px; padding:10px; text-decoration:none; border-radius:4px;}
.s1 {background-color:#999999; color:#000000;}
.s2 {background-color:#006600; color:#ffffff;}
.s3 {background-color:#ffb964; color:#000000;}
.s4 {background-color:#993300; color:#ffffff;}
.s5 {background-color:#002266; color:#ffffff;}
.s6 {background-color:#770077; color:#ffffff;}
.s7 {background-color:#ff8844; color:#000000;}
.s8 {background-color:#00ccaa; color:#000000;}
#setnewpwd {display:none; background-color:#eeeeee; color:#000000; padding:5px;}
#setnewpwd input {display:inline-block; margin-right:15px;}
#utilreport {display:none; margin:0px 2px 0px 2px;}
a.pwd0, a.pwd1, a.topnav {background-color:#eeeeee; color:#000000; border:1px solid #000000;}
a.save {background-image:url('../g_lib/rgb-button.png'); background-repeat: no-repeat; background-position: center; color:#ffffff; border:1px solid #000000;}
.complete {background-color:#eeeeee; color:#000000; border:1px solid #000000; border-radius:5px;}
.completed {display:inline-block; padding:12px; background-color:#000000; color:#ffffff; border:1px solid #666666; border-radius:0px;}
#utilreport .mgood {text-align:center; padding:5px; background-color:#bcddbc; color:#005500;}
#utilreport .mbaad {text-align:center; padding:5px; background-color:#ffcccc; color:#660000;}
#utilreport .mbago {text-align:center; padding:5px; background-color:#dddddd; color:#666666;}
#utilreport .mgood a {color:#005500;}
#utilreport .mbaad a {color:#660000;}
#utilreport .mbago a {color:#666666;}

.bluebox {padding:10px; border:2px solid #d4ae36; background-color:#ffe9bb; margin-10px 5% 10px 5%;}

#review, .asetable {display:table; border-spacing:2px;}
#review div {display:table-row; margin:3px 0px 3px 0px; padding:3px;}
#review div div {display:table-cell; padding:3px; background-color:#eeeeee; border:1px solid #cccccc;}
.asettable  {display:table; border-spacing:2px; border:1px solid #666666;}
.asettable div {display:table-row; margin:3px 0px 3px 0px; padding:3px; }
.asettable div div.tabhead  {display:table-cell; padding:3px; background-color:#dddddd;}
.asettable div div.example  {display:table-cell; padding:3px; background-color:#eeeeff; color:#666666;}
.asettable div div  {display:table-cell; padding:3px; background-color:#dddddd;}
.asettable .wordcount {font-size:.6em;}
.asettable label {display:none;}

.fline {margin:6px 0px 6px 0px;}
.fbox {margin:30px 0px 12px 0px; width:94%;}
.txtbox {width:96%;}
.wide-label {display:inline-block; max-width:80%; text-align:right; padding-right:10px;}
.s1-label {display:inline-block; width:300px; text-align:right; padding-right:10px;}
.s1-data {display:inline-block; font-weight:bold;}
.s2-label {display:inline-block; padding-right:10px;}
.s2-data {display:inline-block; font-weight:bold;}
.s3-label {display:inline-block; width:420px; text-align:right; padding-right:10px;}
.s3-data {display:inline-block; font-weight:bold;}
.s4-label {display:inline-block; width:330px; text-align:right; padding-right:10px;}
.s4-data {display:inline-block; font-weight:bold;}
.s5-label {display:inline-block; width:600px; text-align:right; padding-right:10px;}
.s5-data {display:inline-block; font-weight:bold;}
.s6-label {display:inline-block; width:300px; text-align:right; padding-right:10px;}
.s6-data {display:inline-block; font-weight:bold;}
.s7-label {display:inline-block; width:300px; text-align:right; padding-right:10px;}
.s7-data {display:inline-block; font-weight:bold;}
.s8-label {display:inline-block; width:300px; text-align:right; padding-right:10px;}
.s8-data {display:inline-block; font-weight:bold;}
label.radlist {margin-left:40px; display:block; position:relative; top:-20px;}
div.radlist {margin-top:6px;}
#budget_ul, #budget_ul_response, #accounts_ul, #accounts_ul_response, #extra_ul, #extra_ul_response {width:90%; background-color:#eeeeee; cursor: pointer; border-radius:5px; border:2px solid #666666;}
#budget_ul_response, #accounts_ul_response, #extra_ul_response {display:none; cursor:default; padding:20px; text-align:center;}
#offer_ul, #offer_ul_response, #reflet1_ul, #reflet1_ul_response, #reflet2_ul, #reflet2_ul_response {width:90%; background-color:#eeeeee; cursor: pointer; border-radius:5px; border:2px solid #666666;}
#offer_ul_response, #reflet1_ul_response, #reflet2_ul_response {display:none; cursor:default; padding:20px; text-align:center;}
#feestat_ul, #feestat_ul_response {width:90%; background-color:#eeeeee; cursor: pointer; border-radius:5px; border:2px solid #666666;}
#feestat_ul_response {display:none; cursor:default; padding:20px; text-align:center;}

.dz-image {width:320px !important;}
.dropzone .dz-preview .dz-progress {width:280px !important; left:19% !important;}
.dropzone .dz-preview .dz-details .dz-filename {margin-top:20px;}
.dz-error-mark, .dz-success-mark {display:none;}
.dz-message {font-weight:bold; font-size:1.2em;}

/* Mobile devices */
@media only screen  and (max-width:760px) {
 #register label, #login label {display:block; text-align:left;}
 #register .offset, #login .offset {margin-left: 0px;}
 .s1-label, .s2-label, .s3-label, .s4-label {text-align:left; display:block;}
 .s5-label {text-align:left; float:left; width:80%;}
 .s5-data:after {content:""; display:block; clear:both; height:20px;}
 .fline {margin-bottom:15px;}
}
@media only screen  and (max-width:660px) {
  #setnewpwd a {margin-top:15px;}	
}
@media only screen  and (max-width:560px) {
input[type="submit"] {display:inline-block; margin-top:10px;}
#bodform input[type="text"] {max-width:80%;}
.s3-label {max-width:85%}
#setnewpwd label {display:block; text-align:left;}
#setnewpwd input {width:60%; display:block; text-align:left;}
#setnewpwd a {position:relative; left:-25%;}
}
@media only screen  and (max-width:480px) {
 #register input[type="text"] {width:80%;}
 #bodform input[type="text"] {width:85%;} 
}
