/*  BOX   */
.bl {background: url(./images/bl.gif) 0 100% no-repeat #ffffff; width: 20em}
.br {background: url(./images/br.gif) 100% 100% no-repeat}
.tl {background: url(./images/tl.gif) 0 0 no-repeat}
.tr {background: url(./images/tr.gif) 100% 0 no-repeat; padding:0px}
.clear {font-size: 1px; height: 1px}
.tb-focus:focus {background-color: #ccffff;}

body{
margin:0;
padding:0;
line-height: 1.5em;
}
#topsection{
background: #EAEAEA;
height: 90px; /*Height of top section*/
}
#topsection h1{
margin: 0;
padding-top: 15px;
}
#footer{
clear: left;
width: 100%;
background: black;
color: #FFF;
text-align: center;
padding-buttom: 4px 0;
}
#footer a{
color: #FFFF80;
}
.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide
padding)*/
margin-top: 0;
}
.arrowlistmenu{
width: 180px; /*width of accordion menu*/
}
.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 12px Tahoma;
color: white;
background: black url(./images/titlebar.png) repeat-x center left;
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 4px 0 4px 10px; /*header text is indented 10px*/
cursor: hand;
cursor: pointer;
}
.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background-image: url(./images/titlebar-active.png);
}
.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}
.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}
.arrowlistmenu ul li a{
color: #A70303;
background: url(./images/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 90%;
}
.arrowlistmenu ul li a:visited{
color: #A70303;
}
.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #A70303;
background-color: #cfcfcf;
}
/*  Menu    */
#chromemenu{
width: 99%;
font-weight: bold;
font-size: 90%;
}

#chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

#chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(./images/chromebg.gif) center center repeat-x;
padding: 5px 0;
margin: 0;
text-align: right; /*set value to "right" for example to align menu to the left of page*/
}

#chromemenu ul li{
display: inline;
}

#chromemenu ul li a{
color: #494949;
padding: 5px;
margin: 0;
text-decoration: none;
border-right: 1px solid #DADADA;
}

#chromemenu ul li a:hover{
background: url(./images/chromebg2.gif) center center repeat-x;
}
a.boldbuttons{
        background: transparent url('./images/roundedge-gray-left.gif') no-repeat top left;
        display: block;
        float: left;
        font: bold 13px Arial; /* Change 13px as desired */
        line-height: 22px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 30px) */
        height: 30px; /* Height of button background height */
        padding-left: 8px; /* Width of left menu image */
        text-decoration: none;

        }

a:link.boldbuttons, a:visited.boldbuttons, a:hover.boldbuttons, a:active.boldbuttons{
        color: white; /*button text color*/
        }

a.boldbuttons span{
        background: transparent url('./images/roundedge-gray-right.gif') no-repeat top right;
        display: block;
        padding: 4px 10px 4px 2px; /*Set 10px to be equal or greater than'padding-left' value above*/
        }

a:hover.boldbuttons{ /* Hover state CSS */
        text-decoration: underline;
        }


.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
        overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
        width: 100%;
        }
.commentbox{
        background-color: #ececec;
        width: 600px;
        padding: 10px;
        }
.commentfooter{
        background: url(./images/commentarrow.gif) 600px 0 no-repeat; /*20px 0 equals horizontal and vertical position of arrow. Adjust as desired (ie: 20px -5px).*/
        padding-left: 52px;
        padding-top: 5px;
        margin-bottom: 2em;
        font-size: 90%;
        color: #4A4A4A;
        }
.handcursor
{
    cursor: pointer;
    }