/* common */
BODY { text-align:center; margin: 0px 16px; background-color: #ffffff; font-family: Arial, Tahoma, Verdana, Helvetica, sans-serif; color: #343434; font-size: 12px; }
TD { font-size: 12px; }
TABLE { border-collapse: collapse; }

H1, H2, H3 { color: #343434; font-weight: normal; }
H2 { margin: 0px 0px 10px; font-size: 140%; }
H3 { margin: 8px 0px; font-size: 120%; font-weight: bold; color:#333 }
A { COLOR: #005C9C; font-weight:normal; text-decoration: none }
A:hover { color:#cc6600; text-decoration: underline; }
UL { margin: 10px 0px 10px 30px; padding: 0px; }
OL { margin:10px 0px 10px 30px; padding:0px }
P { margin: 6px 0px; }

.nowrap { white-space: nowrap; }
.clear:after { content: "."; height: 0; visibility: hidden; display: block; clear: both; } /* slaga se na containera na floatnat element za da se raztegne v Firefox */
.float_dummy { float: right; width: 100%; height:0px; max-height:0px; margin: 0px; padding: 0px; font-size: 0px; } /* tova pyk e za IE */
.hidden { display:none }
.borders { border: 1px dashed #FF0000; }
.required { color: #C00; }
.explain { color:#999; font-weight: normal; }
DIV.separator.tiny { margin: 10px 0px; border-bottom: 1px solid #CCC; }
a[href="#"] { color: #adafb0; }
IMG { border: none; vertical-align: middle; }

#body_container { min-width: 730px; max-width: 1220px;  margin: 0 auto; text-align:left; }

/* usability_about */
#usability_about { position: absolute; z-index: -999; top: -20px; left: -20px; width:10px; height:10px; overflow:scroll; }

/* head */
#head_container { position: relative; top: 0px; left: 0px; height: 84px; margin: 0px 0px 20px; }
.top_menu { height: 47px; margin: 12px 0px 0px; text-align: right; }
.top_menu .account_name { font-weight: bold; }
.top_menu A { margin: 0px 0px; }
.top_menu UL { margin: 0px 0px 5px; }
.top_menu LI { display: inline; margin: 0px 0px 0px 0px; padding: 0px 6px 0px 9px; list-style:none; border-left: 1px solid #999; }
.top_menu LI.first { border: none; }

.heading_site { float: left; margin-top:-4px; }
.heading_site IMG { border: 0px; }

.subhead { background-color: #118dc5; color: #ffffff; padding: 2px 8px; text-align:right; border-top: 1px solid #3EAEE1; border-bottom: 1px solid #D1D1D1; }
.subhead A { color:#FFF; font-weight: bold; }
.subhead A:hover { color:#FFF; }
.subhead .date { float: left; }

/* main_container */
#main_container { margin: 0px auto 20px; text-align:left; }

/* flash messages */
.flashmessages { min-height: 20px; border: 1px solid #999; margin: 0px 0px 20px; padding: 12px 10px 10px 55px; background-color: #F8F8F8; background-image:url("/images/icon_notice.png"); background-position: 6px 4px; background-repeat: no-repeat; }
.flashmessages.success { color: #0B4908; border-color: #390; background-color:#E3FFDF; background-image:url("/images/icon_success.png"); }
.flashmessages.failed { color: #660000; border-color: #FD8A8F; background-color:#FEF2F2; background-image:url("/images/icon_failed.png"); }
.flashmessages.warning { color: #63372D; border-color: #FFCC63; background-color:#FEF7E7; background-image:url("/images/icon_warning.png"); }

/* application form fields styling */
FORM { margin: 0px; padding: 0px; }
INPUT, SELECT, TEXTAREA { color: #2F2F2F; font-size: 12px; font-family: Arial, Tahoma, Verdana, Helvetica, sans-serif; }
BUTTON { margin: 0px 3px; font-size: 12px; font-family: Arial, Tahoma, Verdana, Helvetica, sans-serif; }
LABEL { display: block; margin: 5px 0px 4px; vertical-align: middle; }
INPUT, SELECT { vertical-align: middle; }
INPUT[type="text"], INPUT[type="password"] { width: 190px; }
INPUT[type="checkbox"], INPUT[type="radio"] { border: none; }
INPUT[type="text"], INPUT[type="password"], SELECT, TEXTAREA { border: 1px solid #000000; }
INPUT[type="text"].focused, INPUT[type="password"].focused, TEXTAREA.focused { background-color:#FFFFD6; }
OPTION.loading { color:#36C; }
TEXTAREA { width: 736px; height: 60px; }

H2.form_title { text-align: center; }
H2.form_title .shaded { color:#999; }

DIV.form_part { clear: left; padding: 0px 0px 10px; border-top: 2px solid #999; }
DIV.form_part.spacetop { padding-top: 10px; }

/* columnstyle for forms */
.columnstyle H3 { font-size: 120%; font-weight: bold; color:#515151 }
.columnstyle .field_container, .columnstyle .separator { clear: left; }
.columnstyle LABEL { float: left; display: block; width: 190px; vertical-align:top }
.columnstyle LABEL .explain { display: block; }
.columnstyle INPUT, .columnstyle SELECT, .columnstyle TEXTAREA { float: left; }
.columnstyle TEXTAREA { width: 556px; margin-bottom: 5px; }


/* application page for detailed view */
.detailed_view .page_name { text-align: center; }
.detailed_view .field_name { margin: 3px 0px 1px; font-weight: bold; }
.detailed_view .field_data { margin: 1px 0px; }


/* submit buttons */
.submitbuttons_container { position: relative; top: 0px; left: 0px; clear: left; min-height: 22px; height: 22px; margin: 20px 0px; padding: 6px; text-align: center; background-color:#F5F5F5; }
.submitbuttons_container .secondary_container { position: absolute; top: 8px; right: 6px; margin: 0px 6px; }


/* workwith_container */
.workwith_container { height: 28px; background-image: url('/images/workwith_background.gif'); background-position:bottom; background-repeat:repeat-x; background-color: #dadee4; }
.workwith_container a.add.big { float: left; display: block; margin: 2px 2px; padding: 4px 4px 3px 18px; border: 1px solid #feb900; background-image: url('/images/button_add_big_background.png'); background-position:center left; background-repeat:repeat-x; background-color:#feb900; color: #FFF; font-weight: bold; text-transform:uppercase; }

/* application table results styling */
TABLE.results { width: 100%; }
TABLE.results THEAD { background-color: #c8ced9; }
TABLE.results TD { padding: 2px 6px; }
TABLE.results TBODY.even TR, TABLE.results TBODY TR.even { background-color: #f2f4f8; }
TABLE.results TBODY.clickable TR { }
TABLE.results TBODY.clickable.over TR { background-color:#FFFFEA; }
TABLE.results TD.action_placeholder { width: 160px; }
TABLE.results TD.action_placeholder a { float: left; display: block; margin: 0px 3px; font-size: 90%; text-align: center; white-space:nowrap; }
TABLE.results TD.action_placeholder a.view { padding-top: 15px; background-image: url('/images/button_view.png'); background-position: top center; background-repeat:no-repeat; }
TABLE.results TD.action_placeholder a.edit { padding-top: 15px; background-image: url('/images/button_edit.png'); background-position: top center; background-repeat:no-repeat; }
TABLE.results TD.action_placeholder a.delete { padding-top: 15px; background-image: url('/images/button_delete.png'); background-position: top center; background-repeat:no-repeat; }

/* rspaging styling */
.paging_navigation { display:block; margin: 2px 0px; }
.paging_container .prev_next_container a, .paging_container .prev_next_spacer { display:inline-block; width: 19px; height: 19px; vertical-align: middle; }
.paging_container .prev_container a { background-image: url('/images/button_prev_spr.gif'); }
.paging_container .prev_container a:hover { background-position: -20px 0px; }
.paging_container .next_container a { background-image: url('/images/button_next_spr.gif'); }
.paging_container .next_container a:hover { background-position: -20px 0px; }

/* overlay */
/* use a semi-transparent image for the overlay :: must be initially hidden, place overlay on top of other elements */
.overlay { display:none; z-index:10000; width:775px; min-height:200px; background-color:#ffffff; color: #333; padding: 20px 20px; border:8px solid #999; }  
/* container for external content. uses vertical scrollbar, if needed */ 
.overlay .contentWrap { max-height:471px; overflow-y:auto; }
/* close button positioned on upper right corner */ 
.overlay div.close { position:absolute; right:-18px; top:-18px; height:35px; width:35px; cursor:pointer; background-image:url('../images/overlay/close.png'); }

/* the modal overlay */
div.modal { display:none; z-index:10000; width:775px; padding: 20px 20px; background-color:#ffffff; color: #333; border:8px solid #999; }  
/* container for external content. uses vertical scrollbar, if needed */ 
div.modal H2 { text-align: center; font-weight: bold!important; }
div.modal .contentWrap { max-height:471px; overflow-y:auto; }

/* tooltip */
.tooltip_container { display:none; width: 300px; height: auto; padding: 12px; background-color:#fff; border: 6px solid #999; }

/* bottom */
.bottom_container { clear: both; margin: 20px 0px 20px; border-top: 1px solid #999; }
.bottom_container UL { margin: 10px 0px 6px; }
.bottom_container LI { display: inline; margin: 0px 4px 0px 0px; padding: 0px 0px 0px 8px; list-style:none; border-left: 1px solid #999; }
.bottom_container LI.first { border: none; }

/* printable_head */
.printable_head { display: none; margin: 0px 0px 12px 0px; padding-bottom: 12px; border-bottom: 1px solid black; }
.printable_head .company_name { font-size: 160%; font-weight: bold; }


/* MEDIA: PRINT (sitewide) */
@media print { 
BODY, TD { color: black; font-size: 11pt; font-family:"Times New Roman", Times, serif }
H2 { color: black; }
H1, H3, .printable_head .company_name { color:#444; }
A { COLOR: black; text-decoration: underline }
.flashmessages { display: none; }
.printable_head { display: block; }

.detailed_view .field_name { margin: 0px; }
.detailed_view .field_data { margin: 0px; }

}