html, body {height: 100%;}
body {background: #f8f8f8 url(../Images/bg.jpg); margin: 0; min-width: 939px; padding: 0 30px 0 30px; font-family: Tahoma,Verdana,Arial,sans-serif; font-size: 12px; color: #333333;}

a:link {color: #419797; text-decoration: underline; font-weight: bold;}
a:visited {color: #419797; text-decoration: underline; font-weight: bold;}
a:hover {color: #419797; text-decoration: none; font-weight: bold;}
a:active {color: #419797; text-decoration: none; font-weight: bold;}

.icon{left:0px;}
/* Tab-decoration icon (link-bg-N.gif) inside ui-tabs-nav li .icon — the div is
   absolute-positioned with bottom:-15px so its bottom anchors 15 px below the
   tab. An inline <img> with vertical-align:baseline adds ~3.6 px font-descent
   below itself, inflating the .icon div to 18.6 px and pushing the visible
   image up. display:block strips the descent so the image sits where the
   legacy view engine put it. */
.ui-tabs-nav li .icon img {display: block; margin: 0 auto;}

img {border: 0 solid;}
form {margin: 0; padding: 0;}
table {border:0px; border-collapse:collapse; width: 100%;}
table td{padding:0px;}
input, select, textarea, button { font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 12px; }

h1{margin: 0 0 25px 0; padding: 0 0 5px 0; border-bottom: #f6a728 2px solid; color: #429898; font-size: 20px; text-align: center; font-weight: normal;}

h2{margin: 0; padding: 0; float: left; background: top repeat-x url(../images/tit-bg.gif); color: white; font-size: 18px; font-weight: normal;}
h2 span{display: block; float: left; background: no-repeat top right url(../images/tit-right.gif);}
h2 b{height: 39px; font-weight: normal; float: left; display: block; padding: 0 20px 0 45px;}

h4{margin:-1px -1px 5px -1px; padding: 0; font-size: 12px; color: white; background: repeat-x top url(../images/tit-bg.gif); -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; border-top-right-radius: 4px; }
h4 span{height: 34px; padding: 5px 15px 0 42px; display: block; margin-left: 1px;}
h4 b{display: block; float: right;}

h5{position: relative; margin: 10px 3px 10px 3px; padding: 0; width: 203px; font-size: 12px; color: white; background-color: #f6a728; border: white 1px solid; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}
h5 span{display: block; position: relative; height:20px; padding: 4px 0 0 40px; margin:-1px;}

.clear{clear: both; font-size: 0;}
.tooltip { margin:5px 3px; display: block; background: none repeat scroll 0 0 #FFFFAA; border: 1px dashed #F6A728; padding: 0.8em 1em;  outline: none; text-decoration: none; }

ul.tick li {list-style-image: url(../images/ptushka.gif);}

/* Layouts */
#l-container {min-width: 939px; max-width: 1220px; width:expression(document.body.clientWidth < 939? "939px" : document.body.clientWidth > 1220? "1220px" : "auto"); margin: 0 auto; position:relative; min-height:100%}
/* index page */
#l-2col-main{float: left; width: 100%; margin-left: -370px;}
#l-2col-main .content{ margin-left: 370px;}
#l-2col-main .content .edit-button-container{text-align:right; padding-right:10px; margin-bottom:5px;}
#l-2col-left{position: relative; float: left; display: inline; width: 280px; margin-right: 90px;}
/* 3 cols page */
#l-3col-left{position: relative; float: left; display: inline; width: 280px; margin-right: 10px;}
#l-3col-right{position: relative; float: right; display: inline; width: 215px; margin-left: 10px;}
#l-3col-center{float: left; width: 100%; margin-left: -290px; margin-right: -225px;}
#l-3col-center .content{position: relative; margin-right: 225px; margin-left: 290px;}

#l-footer-space { height:60px; /*equal to footer*/ clear:both;}
#l-footer { min-width: 939px; max-width: 1220px; padding:8px 0 3px 0; bottom:0; left:0; position:absolute; width:100%; height:32px; color: #999; font-size: .9em; font-size: 11px; vertical-align:middle; text-align:center; /*border-top:1px solid #CCCCCC;*/}
#l-footer .buttons {float:left; width:auto;}
#l-footer .buttons td.vkontakte, #l-footer .buttons td.twitter, #l-footer .buttons td.facebook {padding:0 10px 0 0;}
#l-footer .design {float:right; width:175px;}
#l-footer .design img{vertical-align: middle; margin: 0 10px 5px 0; float:left;}
#l-footer .design a{margin-left: 5px;}
#l-footer .design text_link-container{ float:right;}
/* Facebook 225px*/
#l-footer span.fb_edge_comment_widget{top:-200px!important;}
#l-footer .fb_edge_widget_with_comment span.fb_edge_comment_widget iframe.fb_ltr {height:200px!important;}
#l-footer .connect_comment_widget .nub {display:none!important;}
#l-footer .fb_edge_widget_with_comment {margin-top:3px!important;}

#socialnetworks{width:180px;}
#webdesign{width:180px;}

/* CKEditor */
span.cke_skin_kama {clear:both; margin-top:20px;}

/* Vkontakte*/
#vk_like {width:140px!important;}

/* Form controls */
.field-container {display: block; clear: both;}
input[type="submit"], input[type="button"], button {margin:5px 3px; border: 1px solid #F6A728; height: 25px; background: repeat-x url(../images/btn-bg.gif); color: #429898; font-size: 12px; font-weight: bold; text-align: center; cursor: pointer; cursor: hand; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
input[type="submit"]:hover, input[type="button"]:hover, button:hover {color: #F6A728;}
.button-container {text-align:center; margin: 10px 0;}
.field-container input[type="text"],
.field-container input[type="password"],
.field-container select,
.field-container textarea {width: 143px; padding: 0; margin: 0; border: #f6a728 1px solid;}
.field-container input[type="text"],
.field-container input[type="password"] {height:16px;}
/* display:block removes the inline-flow line-box leading caused by the
   Razor whitespace text node between <label> and <textarea>. */
.field-container textarea {height:45px; display: block;}
.field-note {font-size:0.8em; color:Gray; display:block; clear:both;}
.field-validation-error {color: #ff0000;}
.field-validation-valid {display: none;}
.input-validation-error {border: 1px solid #ff0000; background-color: #ffeeee;}
.validation-summary-errors {font-weight: bold; color: #ff0000;}
.validation-summary-valid { display: none;}

.calculator-button{ width:16px; height:18px; margin:0 2px; padding:0px 2px 2px 2px; display:inline; position:absolute; left:236px; bottom:7px; border:none;}
.calculator-button-ie{ width:16px; height:18px; margin:0 2px; padding:0px 2px 2px 2px; display:inline; position:absolute; border:none;}

.data-form-container { position: relative; margin: 0 auto;  }
.data-form-container .field-container {padding: 5px 0 5px 50px;}
.data-form-container .field-container label {display: block; float: left; display: inline; text-align: right; width: 45%; padding-right: 15px;}
.data-form-container .field-validation-error {font-size:0.9em; margin-left:165px; float:left;}
.data-form-container .field-container select {width:145px;}

.change-pass-form-container{ position: relative; margin: 0 auto; width:auto;  }
.change-pass-form-container .field-container {padding: 5px 0 5px 50px;}
.change-pass-form-container .field-container label {display: block; float: left; display: inline; text-align: right; width: 45%; padding-right: 15px;}
/*.change-pass-form-container .field-validation-error {font-size:0.9em; margin-left:165px; float:left;}
*/
.change-pass-form-container .validation-summary-errors {text-align:center;}
/* Wide form */
.form-text { margin: 10px auto; width: 430px;}
.form-container {width: 430px; position: relative; margin: 0 auto; background: #ebebe6 repeat-x bottom url(../images/registr.gif);}
.form-container .field-container {padding: 5px 0 5px 50px;}
.form-container .field-container label {display: block; float: left; display: inline; text-align: right; width: 150px; padding-right: 15px;}
.form-container .field-validation-error {font-size:0.9em; margin-left:165px; float:left;}

/* Popup */
.ui-dialog .field-container {padding: 5px 0 5px 0px;}
.ui-dialog .field-container label {display: block; float: left; display: inline; text-align: right; width: 90px; padding-right: 10px;}
.ui-dialog .field-note {padding-left:100px;}
.ui-dialog .field-validation-error {font-size:0.9em; margin-left:100px; float:left;}

#b-loading {display: none; background-image: url(/Images/ajax-loader.gif); background-repeat: no-repeat; padding: 2px 2px 2px 18px; width: auto; height: 16px; position: fixed; top: 2px; border: 1px solid #429898; font-weight:bold; background-color: White; font-size: small; color: #429898; z-index: 10009;}
#b-logo {float: left; display: inline; margin-top: 5px;}
/* Legacy view engine emitted HTML with no inter-element whitespace; Razor adds
   newlines/indentation which makes inline <img> elements share a line-box with
   text nodes (line-height: normal ≈ 14 px). Without display:block the logo <a>
   wrapper added ~2 px descent below the 85 px GIF, and the 1×950 px blank.gif
   spacer between header floats and the top menu picked up ~11 px of leading. */
#b-logo a, #b-logo img {display: block;}
#l-container > img {display: block;}

/* font-size:0 collapses Razor's whitespace text nodes between the inline <a>
   siblings (legacy view engine emitted them with zero whitespace). The icons
   carry no text, so this only zeroes the gaps — the 5 px img margins stay. */
#b-social {text-align: center; padding-top: 35px; font-size: 0;}
#b-social img{margin: 0 5px 0 5px;}

#b-auth {float: right; display: inline; margin: 10px 0 10px 0; width: 377px; height: 76px; background: #f3f3f2 no-repeat url(../images/enter-bg.gif);}
#b-auth div.block{font-size: 11px; display: block; float: left; width: 145px; padding: 10px 0 0 13px;}
#b-auth input{vertical-align: middle;}
#b-auth input[type="text"], #b-auth input[type="password"] {margin: 2px 0 3px 0; font-size:11px;}
#b-auth input[type="checkbox"] {margin: 3px 3px 3px 0; font-size:11px;}
#b-auth .field-validation-error {font-size:8px;}
#b-auth div.logon{display: block; float: left; width: 35px; padding: 25px 0 0 13px; text-decoration: none;}
#b-auth a.register{display: block; float: left; display: inline; padding: 2px 15px 0 0; background: no-repeat right 6px url(../images/arrow.gif);}
#b-auth .validation-summary-errors {clear:both; font-size:9px; padding-left:10px;}

#b-auth-info{float: right; display: inline; margin: 10px 0 10px 0; width: 377px; height: 46px; font-size: 12px; font-weight: bold; text-align: right; padding-top: 30px;}
#b-auth-info img{vertical-align: middle; margin: 0 20px 2px 20px;}
#b-auth-info a:link {color: #419797; text-decoration: none; font-weight: bold;}
#b-auth-info a:visited {color: #419797; text-decoration: none; font-weight: bold;}
#b-auth-info a:hover {color: #419797; text-decoration: underline; font-weight: bold;}
#b-auth-info a:active {color: #419797; text-decoration: underline; font-weight: bold;}
#b-usertype-settings {display: block; margin-right: 10px; margin-top: 8px; font-size:12px;}

#b-forgot-pass {float:right; display:block; clear:both; margin:0 5px 5px 0;}
#b-forgot-pass-1 {text-align:center;}
#b-forgot-pass-popup {text-align:center;}

#b-top-menu{clear: both; background: #f7ab31 url(../images/top-menu-bg.gif);}
#b-top-menu .l{background: no-repeat left url(../images/top-menu-l.gif);}
#b-top-menu .r{height: 66px; background: no-repeat right url(../images/top-menu-r.gif);}
#b-top-menu .panel{margin: 0 auto; width: 939px;}

#b-top-menu a{display: block; float: left; display: inline; text-align: center; margin: 4px 33px 0 33px; _margin: 4px 33px 0 33px; color: white; text-decoration: none; font-weight: bold; font-size: 14px;}
#b-top-menu a b{display: block; text-align: center;}
#b-top-menu a i{display: none;}
/* Image-only icons inside <b>/<i> — display:block removes the ~3 px font-descent
   that vertical-align:baseline reserves below an inline <img>, which would push
   the label text down. margin:0 auto restores horizontal centering (block-level
   ignores the wrapper's text-align:center). Matches legacy view-engine layout. */
#b-top-menu a b img, #b-top-menu a i img {display: block; margin: 0 auto;}
#b-top-menu a:hover b{display: none;}
#b-top-menu a:hover i{display: block;}
#b-top-menu a.active{display: block; float: left; display: inline; text-align: center; margin: 4px 33px 0 33px; _margin: 4px 33px 0 33px; color: white; text-decoration: none; font-weight: bold; font-size: 14px;}
#b-top-menu a.active i{display: block; text-align: center;}
#b-top-menu a.active b{display: none;}

#warnings { background-image: url("/images/warning.png");width: 16px;height: 16px;float: right;margin-top: 18px;margin-right: 10px;cursor: pointer;}

a#rss{float: right; margin-top: 21px; margin-left:5px; }
a#rss img {height:12px;}
a#feed{float: right; display: inline; text-transform: uppercase; padding-left: 17px; margin-top: 20px; font-size: 11px; background: no-repeat left 3px url(../images/feed.gif);}
a#admin{float: right; margin-top:70px; right:20px;  position:absolute; text-transform: uppercase; font-size: 11px; }

#b-lang-panel{padding: 15px 0 0px 30px;}
#b-lang-panel span{display: block; margin-right: 10px; float: left; display: inline; text-transform: uppercase; width: 25px; height: 16px; padding-top: 1px; background: #f6a92d url(../images/lang-on.gif); font-weight: bold; color: white; text-align: center;}
#b-lang-panel a{display: block; margin-right: 10px; float: left; display: inline; text-transform: uppercase; text-decoration: none; width: 25px; height: 16px; padding-top: 1px; background: #489e9f url(../images/lang-off.gif); font-weight: bold; color: white; text-align: center;}

#b-about .header-meta b{background: no-repeat left url(../images/tit-news.gif);}
#b-about .header-features b{background: no-repeat left url(../images/tit-func.gif);}
#b-about .block {clear:both; padding:10px 0px;}

#b-service-type {clear:both;}
#b-service-type .home-accounting{float: left; display: inline; text-align: center; text-decoration:none; margin: 0 0 10px 0; color: white; font-weight: bold; font-size: 16px; width: 158px; height: 90px; padding-top: 47px; background: #f2a120 url(../images/folder-yellow.jpg);}
#b-service-type .home-accounting img{margin-top: 5px;}
#b-service-type .small-business{float: left; display: inline; text-align: center; text-decoration:none; margin: 0 0 10px 0; color: white; font-weight: bold; font-size: 16px; width: 158px; height: 90px; padding-top: 47px; background: #348989 url(../images/folder-green.jpg);}
#b-service-type .small-business img{margin-top: 5px;}
#b-service-type .demo{display: block; float: left; display: inline; margin: 40px 0 0 20px; width: 83px; height: 21px; padding-top: 7px; background: url(../images/demo.gif); text-align: center; color: #429898; text-decoration: none;}
#b-service-type .demo:hover{text-decoration: underline;}

#b-news {clear:both;}
#b-news .header b{background: no-repeat left url(../images/tit-news.gif);}
#b-news .item{clear: both; line-height: 19px;}
#b-news .item b{display: block; padding: 20px 0 10px 0;}
#b-news .item i{display: block; padding: 0 5px 0 5px; line-height: normal; margin-top: 3px; margin-right: 20px; font-style: normal; color: white; font-size: 11px; font-weight: bold; background-color: #f6a728; float: left;}

#b-articles {clear:both;}
#b-articles .header b{background: no-repeat left url(../images/tit-news.gif);}
#b-articles .item{clear: both; line-height: 19px;}
#b-articles .item b{display: block; padding: 20px 0 10px 0;}
#b-articles .item i{display: block; padding: 0 5px 0 5px; line-height: normal; margin-top: 3px; margin-right: 20px; font-style: normal; color: white; font-size: 11px; font-weight: bold; background-color: #f6a728; float: left;}
#b-articles .active{font-size:large;}



#b-whatisit {clear:both;}
#b-whatisit .header b{background: no-repeat left url(../images/tit-info.gif);}
#b-whatisit p b{color:#419797;}
#b-whatisit div {clear:both;line-height: 19px;padding-bottom:12px;}

#b-features {clear:both;}
#b-features .header b{background: no-repeat left url(../images/tit-func.gif);}
#b-features .double-item {clear: both;}
#b-features .item{float: left; width:50%; line-height: 19px; text-align:justify;}
#b-features .item b{display: block; padding: 10px 0 5px 0; color:#419797;}
#b-features .item i img{border: #f6a728 1px solid;}
#b-features .item i{display: block; float: left; display: inline; margin: 5px 12px 0 0;}
#b-features .item div{padding-right:12px;}

.b-transaction-edit .field-container {padding: 7px 0 7px 0; position:relative;}
.b-transaction-edit .field-container label {display: block; float: left; display: inline; text-align: right; width: 75px; padding-right: 15px;}
.b-transaction-edit .button-container {padding-left:90px; margin-bottom:0px;}
.b-transaction-edit .field-validation-error {font-size:0.9em; margin-left:90px; float:left;}
.b-transaction-edit .field-container .currency {float:left; margin-left:-30px; position:absolute;}
.b-transaction-edit .link-label {text-decoration:underline; color: #419797;cursor:pointer;}
.b-transaction-edit .expense {color: #f63728;}
.b-transaction-edit .transfer {color: #429898;}
.b-transaction-edit .revenue {color: #6bac0d;}

#b-transaction-type-selector{display:inline; margin-left:5px; cursor:pointer;}
#b-transaction-edit-title{display:inline;float:left;}

#b-register span.header {background: no-repeat top left url(../images/tit-registr.gif);}
#b-logon span.header {background: no-repeat top left url(../images/tit-registr.gif);}

#b-month-selector {text-align: center; padding: 10px 0 10px 0; color: #429898; font-weight: bold;}
#b-month-selector a {padding:5px;}

#b-quarter-selector {text-align: center; padding: 10px 0 10px 0; color: #429898; font-weight: bold;}
#b-quarter-selector a {padding:5px;}

#b-custom-period-selector {text-align:center; padding-bottom:6px;}
#b-custom-period-selector input {width:80px;}
#b-custom-period-selector .field-container { display:inline; margin-left:30px; margin-right:30px;}
#b-custom-period-selector .field-container label {padding-right:5px; font-weight:bold; color:#429898;}

#b-transactions .ui-tabs {border:0;}
#b-transactions .ui-tabs .ui-tabs-panel {padding-bottom:0;border-bottom:0; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; }
#b-transactions #b-month-selector {padding-top:0px;}
#b-transactions #b-quarter-selector {padding-top:0px;}
#b-transactions .b-sbagrid .header {background: none; border:0; color: #429898; font-weight: bold; text-align: left;}
#b-transactions .b-sbagrid .header td {background: none; border:0;padding-top:20px;}
#b-transactions .b-sbagrid .summary {background-color: #FCF5A9; color: #6BAC0D; font-weight: bold; text-align: right;}
#b-transactions .b-sbagrid .summary span {color: #F63728; text-decoration: none;}
#b-transactions .b-sbagrid .summary span.margin {margin-right: 20px;}
#b-transactions .b-sbagrid td.comment {text-align:left; font-size:0.9em; color:Gray;}
#b-transactions .b-sbagrid td.actions {text-align:right; min-width:40px; padding-left:3px;}

#b-transactions span.revenue {font-weight: bold; color: #6bac0d;}
#b-transactions span.expense {font-weight: bold; color: #f63728;}
#b-transactions span.transfer {font-weight: bold; color: #429898;}

/* font-size:0 collapses Razor whitespace text nodes between sibling
   .field-container divs so the 5+5 px margins give exactly 10 px gaps,
   matching the legacy view engine's zero-whitespace output. Each child
   restores its own font-size for the visible label/option text.
   line-height:28px gives wrapped lines a 10 px vertical gap when the
   middle column is too narrow to fit all selects on one row (fixes a
   visual bug present on the legacy site too). */
#b-transaction-filter {padding-bottom:10px; text-align:center; font-size: 0; line-height: 28px;}
#b-transaction-filter .field-container { display:inline; width:30%; margin:5px; font-size: 0;}
#b-transaction-filter select {width: 120px; color: White; background-color:#429898; font-weight:bold; font-size: 12px;}


#b-balance {min-height:288px; height:auto !important; height:294px;}
#b-balance span.balance{background: no-repeat top left url(../Images/tit-balance.gif);}
#b-balance .b-sbagrid table td, th {padding: 3px;}
#b-balance .b-sbagrid td.balance {text-align:right; color:#429898;font-weight: bold;}

#b-budget span.budget{background: no-repeat top left url(../Images/tit-plan.gif);}
#b-budget .panel {padding-bottom:10px;}
#b-budget {margin-bottom:10px;}
#b-budget span.expense{background: no-repeat left url(../images/tit-plan-rash.gif);}
#b-budget span.revenue{background: no-repeat left url(../images/tit-plan-doh.gif);}
#b-budget .b-sbagrid th .expand {padding-left:3px; cursor:pointer; float:right;}
#b-budget .b-sbagrid th .copy {padding-left:3px; cursor:pointer; float:right;}

#b-reminder span.header {background: no-repeat top left url(../images/tit-calend.gif);}
#b-reminder .header {background-color: #77b0b1; color: white; font-weight: bold; }
#b-reminder img {width:-1; height:-1;}
#b-reminder .b-sbagrid .name {border-right:none;}
#b-reminder .b-sbagrid .download {border-left:none; padding-left:3px; width:20px; }
#b-reminder .b-sbagrid .download img {width:16px;height:16px;}
#b-reminder .b-sbagrid .actions {width:25px; padding-left:3px;text-align:right;}
#b-reminder .b-sbagrid span.future {font-weight: bold; color: #6BAC0D;}
#b-reminder .b-sbagrid span.past {font-weight: bold; color: #F63728;}

#b-document input[type="text"], #b-document select, #b-document textarea {min-width: 160px; width:95%;}

#b-documents .b-sbagrid .header {background: none; border:0; color: #429898; font-weight: bold; text-align: left;}
#b-documents .b-sbagrid .header td {background: none; border:0;padding-top:20px;}
#b-documents .b-sbagrid td.doc-actions {text-align:right; min-width:68px; padding-left:3px;}
#b-documents .b-sbagrid td.event-actions {text-align:right; padding-left:3px;}
#b-documents .b-sbagrid .summary {background-color: #FCF5A9; color: #6BAC0D; font-weight: bold; text-align: right;}
#b-documents .b-sbagrid .summary span {color: #F63728; text-decoration: none; margin-right: 20px;}
#b-documents .b-sbagrid span.future {font-weight: bold; color: #6BAC0D;}
#b-documents .b-sbagrid span.past {font-weight: bold; color: #F63728;}

#b-documentedit input[type="text"], #b-documentedit select, #b-documentedit textarea {width: 220px;}

#b-document .form-container {margin: 10px 0px; width:300px; color:#429898; font-weight:bold; background: #ebebe6 repeat-x bottom url(../images/registr.gif);}
#b-document .form-container .field-container label { width: 100px; color:#333333; font-weight:normal;}

/* NewsViewPage */
#b-newsview .navigation-panel{text-align:center;}
#b-newsview .text {width:80%; text-align:justify; margin-left:10%; padding-bottom:20px;}
.news-edit-button-container{text-align:right; padding-right:10px; margin-bottom:5px;}

/* Legacy `#news-edit-control` / `#article-edit-control` ids were replaced by
   per-render `ne-<guid>` / `ae-<guid>` scope ids — target the wrapper class so
   the rules survive. Flex layout puts the label on the left of the input and
   lets the input fill the remaining horizontal space inside the popup. */
.b-newsedit .field-container,
.b-articleedit .field-container {display: flex; align-items: flex-start; gap: 10px;}
.b-newsedit .field-container > label,
.b-articleedit .field-container > label {flex: 0 0 90px; float: none; width: auto; text-align: right; padding-right: 0;}
.b-newsedit .field-container > textarea,
.b-newsedit .field-container > input,
.b-articleedit .field-container > textarea,
.b-articleedit .field-container > input {flex: 1 1 auto; display: block; width: auto; box-sizing: border-box;}
/* Date input stays at its natural ~dd.MM.yyyy width instead of flex-growing. */
.b-newsedit .field-container > input.datetime,
.b-articleedit .field-container > input.datetime {flex: 0 0 100px; width: 100px;}
/* jQuery UI's datepicker trigger button (`showOn:'button'`) ships with
   margin: 5px 3px + padding: 1px 6px, which pushes it ~6px below the input
   baseline. Zero the vertical padding and margin so its center lines up. */
.b-newsedit .field-container > button.ui-datepicker-trigger,
.b-articleedit .field-container > button.ui-datepicker-trigger {padding-top: 0; padding-bottom: 0; margin-top: 0; margin-bottom: 0;}
/* Checkbox row (Razor emits <input type=checkbox> then <label>): keep the label
   in the standard 90px first column (right-aligned, matching other rows) and
   put the checkbox at its natural width in the second column. Without these
   overrides the generic input rule stretches the checkbox to ~700px. */
.b-articleedit .field-container > input[type="checkbox"] {flex: 0 0 auto; width: auto; order: 1;}
.b-articleedit .field-container:has(> input[type="checkbox"]) > label {order: 0;}
.b-articleedit .field-container:has(> input[type="checkbox"]) {justify-content: flex-start;}
/* Lang switch (`#b-lang-panel`) is injected by ArticleEdit.js between the label
   and the textarea. Without absolute-positioning, flex layout makes the panel
   shift the CKEditor right by its width + gap. Pin it under the label inside
   the 90px label column so the editor keeps its left position. */
.b-articleedit .field-container:has(> #b-lang-panel) {position: relative;}
.b-articleedit .field-container > #b-lang-panel {position: absolute; left: 0; top: 22px; width: 90px; padding: 0; text-align: right;}
.b-articleedit #b-lang-panel a {float:right; margin-right: 0px;}

/* AdminPage */
.b-admin-actions{ margin-left:100px; }

#employee-edit-form-container .field-container {padding: 5px 0 5px 30px;}
#employee-edit-form-container .field-container label {display: block; float: left; display: inline; text-align: right; width: 45%; padding-right: 15px;}
#employee-edit-form-container .field-validation-error {font-size:0.9em; margin-right:80px; float:right;}

.b-use-employees{display:inline; float:right; margin-right:100px;}
.b-pay-twice{display:inline; float:right; margin-right:100px;}

#key-cert-container{text-align:center;}
.b-key-cert{border-style:solid; border-color:#419797; width:200px; margin:10px; display:inline-block; padding:0px 10px 10px 10px; text-align:center;}
.b-key-cert .state-image{position:relative; bottom:15px; right:70px;  background-color:#ebebe6;}
.b-key-cert .set-button, .b-key-cert .info-button, .b-key-cert .delete-button {margin:5px;}
.b-key-cert .block-name {position:relative; bottom:20px; font-weight:bold;}
.b-key-cert .state-text{position:relative; bottom:20px;}

#pwd-dialog .field-container{padding: 5px 0 5px 5px;}
#pwd-dialog .field-container label {float: left; display: inline; text-align: right; width: 30%; padding-right: 15px;}

.info-table {}
.info-table tr{vertical-align:top; }
.info-table td{border-style:solid; border-color:Gray; border-width:1px; padding:2px;}

.show-history-action{visibility:hidden;}
.show-history-link {color: #419797; text-decoration: underline; font-weight: bold; cursor:pointer;}

#b-balance  a:link{color: black; text-decoration: none; font-weight:normal;}
#b-balance  a:visited {color: black; text-decoration: none; font-weight: normal;}
#b-balance  a:hover {color: #419797; text-decoration: underline; font-weight: normal;}
#b-balance  a:active {color: #419797; text-decoration: underline; font-weight: normal;}
#b-balance .total  a:link{color:#419797 ; text-decoration: none; font-weight: bold;}
#b-balance .total  a:visited {color: #419797; text-decoration: none; font-weight: bold;}

#b-budget  a:link{color: black; text-decoration: none; font-weight:normal;}
#b-budget  a:visited {color: black; text-decoration: none; font-weight: normal;}
#b-budget  a:hover {color: #419797; text-decoration: underline; font-weight: normal;}
#b-budget  a:active {color: #419797; text-decoration: underline; font-weight: normal;}
#b-budget .total  a:link{color:#419797 ; text-decoration: none; font-weight: bold;}
#b-budget .total  a:visited {color: #419797; text-decoration: none; font-weight: bold;}

#CounterpartyEditForm label {display: block; float: left; display: inline; text-align: right; width: 170px; padding-right: 15px;}
#CounterpartyEditForm .b-field-group {width:340px; vertical-align: top; display: inline-block; border: thin dashed #f6a728; padding: 5px; margin: 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
#CounterpartyEditForm p {font-weight:bold; color: #f6a728; margin: 0; padding: 0;}
#CounterpartyEditForm .field-validation-error {display: block; float:right; margin-right:10px; }


#b-sitecomments { position: fixed; right: 0; top: 0; z-index: 0; width: 22px; height: 100%; }
#b-sitecomments table { height: 100%;}
#b-sitecomments td {vertical-align: middle;}
#b-sitecomments a { color: white; background: #F6A728; }

#gen-sett-form {width: 340px; height: 150px; margin:auto;}
#gen-sett-form .field-container {padding: 7px 0 7px 0; margin-top: 5px; margin-bottom: 10px; display:inline-block;}
#gen-sett-form .field-container label {display: block; float: left; display: inline; text-align: right; width: 110px; padding-right: 15px;}
#gen-sett-form img {display: inline-block; position: relative; top: 6px; left: 10px; }

.table-in-post td {border: thin solid black;}

.feedback-add {border: 2px solid orange; background-color:white; margin: 5px 0 5px 0; color: orange; font-weight:bold; cursor: text; padding: 3px 5px 3px 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}

.b-feedback-scroll {overflow-y:scroll; height:400px;}
.b-feedback-grid {-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: thin solid #CFCFCF; background-color:white;}
.b-feedback-grid a {margin:0px; padding:0px; text-decoration:none; font-weight:normal;}
.b-feedback-grid .b-sbagrid td {border-style: none; opacity:0.75;}
.b-feedback-grid .b-sbagrid tr {border-style: none; height: 40px; background-color:white; border-bottom: 1px dotted #CFCFCF;}
.b-feedback-grid .b-votes {font-size: 15px; font-weight: bold; width: 50px; text-align:center;}
.b-feedback-grid .b-votes .votes-chart {height: 5px; margin: 2px;}
.b-feedback-grid .b-votes .positive {background-color:#4C95C8;}
.b-feedback-grid .b-votes .negative {background-color:#E06666;}
.b-feedback-grid .title {font-weight:normal; text-decoration:none; color:#0060CC; font-size:14px; }
.b-feedback-grid .title:hover {text-decoration:underline;}
.b-feedback-grid .below-title li {display:inline; list-style:none; height:20px;}
.b-feedback-grid .below-title .date {float:right; margin-right:30px; position:relative; top: 2px;}
.b-feedback-grid .below-title .comments {margin-left:50px;}
.b-feedback-grid .below-title .agree, .b-feedback-grid .below-title .disagree
{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 1px 0 #A4A4A4; -moz-box-shadow: 0 1px 1px 0 #A4A4A4; box-shadow: 0 1px 1px #A4A4A4; background:url(../images/buttons-bg.png); padding:3px 3px 2px 3px;}
.b-feedback-grid img {margin:0px; padding:0px; position:relative; top:3px;}

/* sbaGrid action icons inside a floated wrapper (budget-style: action icons
   wrapped in <div style="float:left;">) — strip vertical-align:baseline so
   the wrapper height matches the 16 px icon, not 18 px after font-descent.
   Excludes transaction-style action TDs where the inputs sit beside &nbsp;
   text and need the baseline descent to match the legacy 25 px row height. */
.b-sbagrid div[style*="float"] > input[type="image"] {vertical-align: top;}

.b-feedback-grid .b-type-image {width:16px; height:16px; background-repeat:no-repeat;}
.b-feedback-grid .comment-type-0 {background-image: url(../Images/Icons/CommentType/0.gif);}
.b-feedback-grid .comment-type-0.active {background-image: url(../Images/Icons/CommentType/0-active.gif);}
.b-feedback-grid .comment-type-1 {background-image: url(../Images/Icons/CommentType/1.gif);}
.b-feedback-grid .comment-type-1.active {background-image: url(../Images/Icons/CommentType/1-active.gif);}
.b-feedback-grid .comment-type-2 {background-image: url(../Images/Icons/CommentType/2.gif);}
.b-feedback-grid .comment-type-2.active {background-image: url(../Images/Icons/CommentType/2-active.gif);}
.b-feedback-grid .comment-type-3 {background-image: url(../Images/Icons/CommentType/3.gif);}
.b-feedback-grid .comment-type-3.active {background-image: url(../Images/Icons/CommentType/3-active.gif);}
.b-feedback-grid .comment-type-4 {background-image: url(../Images/Icons/CommentType/4.gif);}
.b-feedback-grid .comment-type-4.active {background-image: url(../Images/Icons/CommentType/4-active.gif);}

.b-feedback-filter {list-style:none; width:100%; padding:0px; margin:0px;}
.b-feedback-filter li {display:table-cell; padding: 5px;  background-color: #F6A828; border: thin solid white; text-align:center; width:120px;}
.b-feedback-filter li.active {background-color: White;}
/* ID-prefixed selectors so they beat jQuery UI 1.13's themeroller override
   `.ui-widget-content a { color: #419797 }` / `:hover { color: #f6a728 }` —
   without this, inactive filter links render teal and turn orange-on-orange
   (invisible) when hovered inside the comments popup. Legacy site had no
   underline on these tabs (default or hover) — keep text-decoration: none. */
#b-feedback-filter li a,
#b-feedback-filter li a:link,
#b-feedback-filter li a:visited,
#b-feedback-filter li a:hover {font-size:14px; color: White; text-decoration: none;}
#b-feedback-filter li.active a,
#b-feedback-filter li.active a:link,
#b-feedback-filter li.active a:visited,
#b-feedback-filter li.active a:hover {color: Orange; font-weight: bold;}

.b-feedback-paging {padding:5px; text-align:center;}
.b-feedback-paging span {margin-left: 5px; margin-right: 5px;}
.b-feedback-paging .next, .b-feedback-paging .prev 
{height: 30px; width: 30px; background-color: white; cursor: pointer; display:inline-block; border: 2px solid #F6A828; color: gray; font-weight:bold; text-align:center; font-size:22px; margin: 1px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; opacity: 0.75;}
.b-feedback-paging .next.enabled, .b-feedback-paging .prev.enabled {border-color: #F6A828; color: #F6A828;}

#b-all-comments-link {margin:10px 0px 0px 5px;}
#b-all-comments-link a {color:Orange;}
.b-filter-for-this-page {margin:5px; display:inline-block; color: Orange; vertical-align:middle;}
.b-filter-for-this-page input {margin-right: 5px;}

.b-feedback-edit {padding-left: 50px; padding-bottom:20px}
.b-feedback-edit .field-container {margin-bottom:5px;}
.b-feedback-edit .field-container span {clear: both;}
.b-feedback-edit .field-container label {float: left; display: inline; text-align: right; width: 90px; padding-right: 10px;}
.b-feedback-edit .field-container input, .b-feedback-edit .field-container textarea ,.b-feedback-edit .field-container select { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.b-feedback-edit .field-container input, .b-feedback-edit .field-container textarea {width: 500px;}
.b-feedback-edit .field-container textarea {height: 200px;}
.b-feedback-edit .submit-container {text-align:center;}
.checkbox-container .field-container input {float: left; margin-left: 100px; margin-right: 10px; width:auto; border: 1px solid orange;}
.checkbox-container .field-container label {float: none; margin: 0px; padding: 0px;}
.back-link {cursor:pointer;}
.back-link:hover {text-decoration:underline; font-weight:normal;}

#b-comments-container {width:700px; margin-left:auto; margin-right:auto;}

#b-main-comment {-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: thin solid #CFCFCF; padding: 15px; text-align:right;}
#b-main-comment .b-votes { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: thin solid #CFCFCF; padding: 15px; display: inline-block; }
#b-main-comment .positive, #b-comments-container .negative {display:inline-block; width: 40px; text-align:center;}
#b-main-comment .graph-container {height: 40px; width: 15px; margin-left:auto; margin-right:auto;}
#b-main-comment .positive .graph {background-color: #4C95C8; }
#b-main-comment .negative .graph {background-color: #E06666; }

#b-body-container {display:inline-block; margin: 0px 0px 15px 15px; vertical-align:top; width:530px; text-align:left; white-space:pre-wrap; word-wrap: break-word;}

#b-main-comment .b-author {margin-top: 5px; color:Silver; display:inline;}
#b-main-comment .b-author .name {margin-right: 5px; display:inline; color: #419797;}
.b-vote-buttons {display: inline; margin-right: 200px;}
.b-vote-buttons .agree, .b-vote-buttons .disagree
 { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 1px 0 #A4A4A4; -moz-box-shadow: 0 1px 1px 0 #A4A4A4; box-shadow: 0 1px 1px #A4A4A4; background:url(../images/buttons-bg.png); padding:3px 3px 2px 3px; margin-right: 5px;}

#b-status {margin-top: 5px; margin-right:5px; text-align:right;}

.b-vote-buttons {opacity:0.6;}

.child-comment {padding: 15px;}
.child-comment .b-author {color: Silver; margin: 0px 0px 5px 5px; display: inline-block;}
.child-comment .b-vote-buttons {float:right;}
.child-comment .b-author img {margin-right: 5px;}
.child-comment .b-author .name {margin-right: 5px; display:inline; color: #419797;}
.child-comment .b-resulting-votes {display: inline-block; color : Green; float:right; margin-right: 30px;}

#b-comments-container h3 {color:#419797;}
#b-comments-container h3 img {margin-right: 5px;}

#b-comments-container .clickable {color: #f6a728; font-weight:bold; cursor: pointer; float:left; margin-left:20px;}

.b-admin-options {margin-top: 5px;}
.b-admin-options a {margin-left: 5px;}
#status-list {position:absolute; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 1px 0 #A4A4A4; -moz-box-shadow: 0 1px 1px 0 #A4A4A4; box-shadow: 0 1px 1px #A4A4A4; width: 120px; list-style:none; border: thin solid #CFCFCF; background-color:White; text-align:left;}
#status-list li {margin: 5px 0px 5px 0px;}