/* === ELEMENTS === */
img, table
{
    border: 0;
}
input, select, textarea
{
    font-family: verdana, tahoma, arial, helvetica, sans-serif;
    font-size: 1em;
    vertical-align: middle;
}
ul
{
    list-style-type: none;
}
ul.square
{
    list-style-type: square;
    padding-left: 15px;
}
ol
{
    list-style-type: decimal;
    padding-left: 20px;
}
dt
{
    float: left;
}
dl.color dt
{
    font-weight: bold;
    color: rgb(188,135,0);
}
.checkmany li
{
    float: left;
    width: 75px;
}
.checkmany .select
{
    margin-right: 5px;
}
table img
{
    display: block;                                                                                                     /* avoids space between image and cell bottom in xhtml strict */
}
#images, .images
{
    position: relative;
    top: 10px;
    font-size: 0px;
}
#images img, .images img
{
    margin-right: 3px;
}




/* === DISTANCE === */
.top1{margin-top:1em}
.top2{margin-top:2em}
.top3{margin-top:3em}
.top4{margin-top:4em}
.top5{margin-top:5em}
.top6{margin-top:6em}
.top7{margin-top:7em}
.top8{margin-top:8em}
.top9{margin-top:9em}
.top10{margin-top:10em}
.left1{margin-left:2.4em}
.left2{margin-left:4.8em}
.left3{margin-left:7.2em}
.left4{margin-left:9.6em}
.left5{margin-left:12.0em}
.left6{margin-left:14.4em}
.left7{margin-left:16.8em}
.left8{margin-left:19.2em}
.left9{margin-left:21.6em}
.left10{margin-left:24.0em}
.bottom1{margin-bottom:1em}
.bottom2{margin-bottom:2em}
.bottom3{margin-bottom:3em}
.bottom4{margin-bottom:4em}
.def4 dt {width:4em}
.def5 dt {width:5em}
.def6 dt {width:6em}
.def7 dt {width:7em}
.def8 dt {width:8em}
.def9 dt {width:9em}
.def10 dt{width:10em}
.def11 dt{width:11em}
.def12 dt{width:12em}
.def4 dd {margin-left:4em}
.def5 dd {margin-left:5em}
.def6 dd {margin-left:6em}
.def7 dd {margin-left:7em}
.def8 dd {margin-left:8em}
.def9 dd {margin-left:9em}
.def10 dd{margin-left:10em}
.def11 dd{margin-left:11em}
.def12 dd{margin-left:12em}
.dist4 {width:4em;float:left;clear:left}
.dist5 {width:5em;float:left;clear:left}
.dist6 {width:6em;float:left;clear:left}
.dist7 {width:7em;float:left;clear:left}
.dist8 {width:8em;float:left;clear:left}
.dist9 {width:9em;float:left;clear:left}
.dist10{width:10em;float:left;clear:left}
.dist11{width:11em;float:left;clear:left}
.dist12{width:12em;float:left;clear:left}




/* === WIDTH === */
.w10 {width:10px}
.w20 {width:20px}
.w30 {width:30px}
.w40 {width:40px}
.w50 {width:50px}
.w60 {width:60px}
.w70 {width:70px}
.w80 {width:80px}
.w90 {width:90px}
.w100{width:100px}
.w110{width:110px}
.w120{width:120px}
.w130{width:130px}
.w140{width:140px}
.w150{width:150px}
.w160{width:160px}
.w170{width:170px}
.w180{width:180px}
.w190{width:190px}
.w200{width:200px}
.w250{width:250px}
.w300{width:300px}
.w350{width:350px}
.w400{width:400px}




/* === STYLER === */
/* !!! common !!! */
.pagebreakbefore{page-break-before:always}
.pagebreakafter {page-break-after:always}

/* !!! at end !!! */
.text{width:100px}
.integer,.decimal,.currency,.rate{width:60px;text-align:right;padding-right:2px}
.date{width:80px}
.time{width:40px}
.control{cursor:pointer}
.localizer{cursor:pointer}
.localize{display:none}
.hide{display:none}
.show{display:run-in}
.unvisible{visibility:hidden}
.visible{visibility:visible}
.required{background-color:rgb(255,255,208)}

/* !!! sort order !!! */
.color   {color:rgb(188,135,0)}
.plus    {color:rgb(255,0,0)}
.minus   {color:rgb(0,174,0)}
.light   {color:rgb(167,167,167)}
.active  {color:rgb(212,75,5)}
.passive {color:rgb(255,255,255)}
.success {color:rgb(0,0,0)}
.info    {color:rgb(0,0,0)}
.warn    {color:rgb(255,0,0)}
.error   {color:rgb(255,0,0)}
.select  {}

/* !!! sort order !!! */
input.light,   select.light,   textarea.light   {color:rgb(0,0,0);background-color:rgb(167,167,167)}
input.active,  select.active,  textarea.active  {color:rgb(0,0,0);background-color:rgb(254,196,45)}
input.passive, select.passive, textarea.passive {color:rgb(0,0,0);background-color:rgb(255,255,255)}
input.success, select.success, textarea.success {color:rgb(0,0,0);background:rgb(255,255,255)}
input.info,    select.info,    textarea.info    {color:rgb(0,0,0);background-color:rgb(0,0,0)}
input.warn,    select.warn,    textarea.warn    {color:rgb(0,0,0);background-color:rgb(255,0,0)}
input.error,   select.error,   textarea.error   {border: 2px solid red}




/* === FONT === */
.pre     {white-space:pre-wrap}
.bold    {font-weight:bold}
.left    {text-align:left}
.center  {text-align:center}
.right   {text-align:right}
.status  {font-weight:bold;color:rgb(255,0,0)}
.special {font-weight:bold;color:rgb(255,0,0)}
.noborder{border:0}
.through {text-decoration:line-through}

h1       {font-size:1.4em;font-weight:bold;letter-spacing:.07em;color:rgb(188,135,0);margin-bottom:1.6em}
h2       {font-size:1.1em;font-weight:bold;color:rgb(188,135,0)}
h3       {font-size:1.0em;font-weight:normal;color:rgb(188,135,0)}
em       {color:rgb(188,135,0)}
strong   {font-weight:bold;color:rgb(188,135,0)}




/* === MENU === */
#menu
{
    margin-bottom: 3em;
    color: rgb(188,135,0);
}
#menu a
{
    text-decoration: none;
    color: rgb(188,135,0);
}
#menu a.active
{
    font-weight: bold;
}
#menu h2
{
    display: inline;
    font-size: 100%;
}
h1 + #menu
{
    margin-top: -1.0em;
}




/* === LINKS === */
a:link,a:visited,a:hover,a:focus,a:active{text-decoration:underline;color:rgb(188,135,0)}

#command
{
    position: absolute;
    top: 191px;
    width: 547px;
    text-align: right;
    line-height: 1.6em;
    white-space: nowrap;
}	
#f-content.noside #command
{
    width: 711px;
}
#command a
{	
    margin-left: 5px;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 5px;
    padding-right: 5px;
    line-height: 1.6em;
    font-size: 1.0em;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    font-family: verdana,tahoma,arial,helvetica,sans-serif;
    color: rgb(255,255,255);
    background-color: rgb(255,0,0);
}
#command a.active
{
    color: rgb(188,135,0);
    background-color: rgb(255,222,120);
}




/* === TABLE === */
#f-content table
{
    font-size: 0.8em;
    border-collapse: collapse;
}
#f-content table strong
{
    font-weight: normal;
    color: rgb(0,0,0);
}
#f-content tr
{
    padding-left: 10px;
    padding-right: 10px;
    line-height: 15px;
}
#f-content th
{
    height: 30px;
    padding-left: 10px;
    padding-right: 10px;

    font-weight: bold;
    text-align: left;

    color: rgb(255,255,255);
    background-color: rgb(255,182,0);
}
#f-content th a
{
    color: rgb(255,255,255);
    text-decoration: underline;
}
#f-content th h1, #f-content th h2, #f-content th h3
{
    color: rgb(255,255,255);
}
#f-content td
{
    height: 30px;
    padding-left: 10px;
    padding-right: 10px;
    border-bottom: 1px solid rgb(200,200,200);
}
#f-content thead a
{
    display: block;
}
#f-content thead a:link, #f-content thead a:visited, #f-content thead a:focus, #f-content thead a:active
{
    color: rgb(255,255,255);
    text-decoration: none;
}
#f-content thead a:hover
{
    color: rgb(0,0,0);
    text-decoration: none;
}
#f-content tbody tr.active td, #f-content tbody tr.active td strong
{
    font-weight: bold;
    color: rgb(212,75,5);
}
#f-content thead .sort a, #f-content thead .asc a, #f-content thead .desc a
{
    padding-left: 5px;
    background-repeat: no-repeat;
    background-position: 0px 7px;
}
#f-content thead .sort a{background-image: url(/image/_common/sort.gif)}
#f-content thead .asc  a{background-image: url(/image/_common/sort-asc.gif)}
#f-content thead .desc a{background-image: url(/image/_common/sort-desc.gif)}
#f-content tfoot
{
    padding-left: 10px;
    padding-right: 10px;
}
#f-content tfoot td
{
    height: 17px;
    line-height: 0px;
    font-weight: bold;
    text-align: left;
    color: rgb(255,255,255);
    background-color: rgb(255,182,0);
}


.list tbody td a:link, .list tbody td a:visited, .list tbody td a:hover, .list tbody td a:focus, .list tbody td a:active
{
    display: block;
    color: rgb(0,0,0);
    text-decoration: none;
}
.list tbody tr:hover, .list tbody tr:hover a
{
    font-weight: bold;
    color: rgb(255,255,255);
    background-color: rgb(255,182,0);
}


#f-content .row1 {background-color: rgb(255,255,255)}
#f-content .row2 {background-color: rgb(255,210,180)}
#f-content .sep1, #f-content tr.sep1 td, #f-content td.sep1 {border-bottom: 1px solid rgb(255,182,0)}
#f-content .sep2, #f-content tr.sep2 td, #f-content td.sep2 {border-bottom: 1px solid rgb(0,0,0)}
#f-content .sep3, #f-content tr.sep3 td, #f-content td.sep3 {border-top:    1px solid rgb(255,182,0)}
#f-content .sep4, #f-content tr.sep4 td, #f-content td.sep4 {border-top:    1px solid rgb(0,0,0);}




/* === PANEL === */
.panel
{
    margin-bottom: 4em;
}
#f-content .panel th, #f-content .panel td
{
    padding-left: 10px;
    padding-right: 10px;
}
.panel .name
{
    width: 110px;
    font-weight: bold;
    color: rgb(255,255,255);
    background-color: rgb(206,148,0);
}
.panel .name a
{
    color: rgb(255,255,255);
    text-decoration: none;
}
.panel .value
{
    width: 190px;
}




/* === MESSAGES === */
#messages
{
    border: 2px solid black;
    overflow: hidden;
    z-index: 10000;
}
#messages .close, #messages .indent, #messages .full
{
    position: absolute;
    top: 1px;
    height: 13px;
    text-align: center;
    color: rgb(255,255,255);
    background-color: rgb(0,0,0);
    cursor: pointer;
}
#messages .indent, #messages .full
{
    width: 15px;
    line-height: 11px;
    font-size: 12px;
    font-family: Courier New, Arial;
}
#messages .close
{
    width: 16px;
    line-height: 12px;
    font-size: 10px;
    font-weight: bold;
}
#messages .verticalScroller
{
    position: absolute;
    top: 15px;
    width: 14px;
    border: 1px;
    cursor: pointer;
}
#messages .verticalScroller div
{
    position: absolute;
    border: 1px;
    width: 12px;
    cursor: pointer;
}
#messages ul  
{
    position: absolute;
    padding-top: 1px;
    top: 0px;
    left: 10px;
    line-height: 24px;
    font-weight: bold;
    list-style-type: none;
}


#messages.error, #messages.fatal
{
    border-style: solid;
    border-color: rgb(255,0,0);
    color: rgb(255,0,0);
    background-color: rgb(244,220,220);
}
#messages.warn
{
    border-style: solid;
    border-color: rgb(255,102,0);
    color: rgb(255,102,0);
    background-color: rgb(252,216,200);
}
#messages.info
{
    border-style: solid;
    border-color: rgb(51,204,102);
    color: rgb(51,204,102);
    background-color: rgb(204,255,204);
}

#messages.error .indent, #messages.error .full, #messages.error .close, #messages.fatal .indent, #messages.fatal .full, #messages.fatal .close
{
    color: rgb(244,220,220);
    background-color: rgb(255,0,0);
}
#messages.warn .indent, #messages.warn .full, #messages.warn .close
{
    color: rgb(252,216,200);
    background-color: rgb(255,102,0);
}
#messages.info .indent, #messages.info .full, #messages.info .close
{
    color: rgb(204,255,204);
    background-color: rgb(51,204,102);
}

#messages.error .verticalScroller, #messages.fatal .verticalScroller
{
    border-style: inset;
    border-color: rgb(128,128,128);
    background-color: rgb(255,0,0);
}
#messages.error .verticalScroller div, #messages.fatal .verticalScroller div
{
    border-style: outset;
    border-color: rgb(128,128,128);
    background-color: rgb(244,220,220);
}
#messages.warn .verticalScroller
{
    border-style: inset;
    border-color: rgb(128,128,128);
    background-color: rgb(255,102,0);
}
#messages.warn .verticalScroller div
{
    border-style: outset;
    border-color: rgb(128,128,128);
    background-color: rgb(252,216,200);
}
#messages.info .verticalScroller
{
    border-style: inset;
    border-color: rgb(128,128,128);
    background-color: rgb(51,204,102);
}
#messages.info .verticalScroller div
{
    border-style: outset;
    border-color: rgb(128,128,128);
    background-color: rgb(204,255,204);
}

#messages li, #messages li a  
{
    color: rgb(0,0,0);
}
#messages li.error, #messages li.error a, #messages li.fatal, #messages li.fatal a
{
    color: rgb(255,0,0);
}
#messages li.warn, #messages li.warn a
{
    color: rgb(255,102,0);
}
#messages li.info, #messages li.info a
{
    color: rgb(51,204,102);
}