/*
 * ---------------------------------------------------- 
 * Some general stuff
 * ---------------------------------------------------- 
 */
*
{
    margin: 0px;
    padding: 0px;
}

body
{
    margin: 5px;
    padding: 0px;

    font-family: Trebuchet,"Bitstream Vera Sans",verdana,lucida,arial,helvetica,sans-serif;
    font-size: 70%;

    background-color: #e9e9e9;
}

/**
 * ---------------------------------------------------- 
 * Avoid scrolling problems for scroll-to by
 * using local scroll bars for wide content, applied
 * when needed.
 * ---------------------------------------------------- 
 */
pre
{
    overflow: auto;
}

/**
 * ---------------------------------------------------- 
 * Headlines
 * ---------------------------------------------------- 
 */
h1
{
    font-size: 20px;
    font-weight: bold;
}
h2
{
    font-size: 16px;
    font-weight: bold;
}
h3
{
    font-size: 14px;
    font-weight: bold;
}

/**
 * ---------------------------------------------------- 
 * The global anchor definitions
 * ---------------------------------------------------- 
 */
a 
{
	color: #3d5376; 
	text-decoration: none;
}
	a:hover 
	{
		color: #3d5376; 
		text-decoration: underline;
	}
	a:visited 
	{
		color: #3d5376;
	}

/**
 * Global container for the page
 */
#container
{
    background-color: #e9e9e9;
}

/**
 * ---------------------------------------------------- 
 * The content section. Holds header, navigation, data, footer.
 * No direct need at the moment, maybe for future use.
 * ---------------------------------------------------- 
 */
#content 
{
}

/**
 * ---------------------------------------------------- 
 * Headers
 * ---------------------------------------------------- 
 */
#header
{
    background-color: #dAA163;
    border: 1px solid #bbb;

	/* 
		This is not 100% standard conform, but gives us
		rounded corners for CSS 3 and in some supporting browsers 
		even before that. Will fall back to standard corners
		in all other browsers.
	*/
    border-radius: 4px;
	-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    padding: 15px 10px 15px 15px;
}
	#header h1
	{
	    font-size: 250%;
	    font-weight: bold;
	
	    color: #f9f9f9;
	}
	#header h2
	{
	    font-size: 120%;
	    font-weight: normal;
	  	text-align: left;
	    color: #f9f9f9;
		padding-left:2px;
	}
		#header h2 a
		{
		    color: #f9f9f9;
		}

/**
 * ---------------------------------------------------- 
 * The navigation that is places right upper corner.
 * ---------------------------------------------------- 
 */
#navigation
{
	position: fixed;
	top: 10px;
	right: 10px;
	width: 15em;
    
    border: 1px solid #aaa;
    font-size: 11px;
    padding: 5px;
    color: #333;
    background-color: White;

    border-radius: 4px;
	-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
	z-index:100;
}	
	#navigation h2
	{
	    text-align: right;
	    padding: 0px;
	    color: #3D5376;
	    font-size: 11px;
	}
    #navigation ul
    {
        margin: 5px;
        text-align: right;
    }
        #navigation ul li
        {
            list-style-type: none;
        }


/**
 * ---------------------------------------------------- 
 * Data Content section to hold all the reports and 
 * data tables.
 * ---------------------------------------------------- 
 */
#data-content 
{
	padding: 0px;
}

/**
 * ---------------------------------------------------- 
 * The footer.
 * ---------------------------------------------------- 
 */
#footer
{
    padding: 10px 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    text-align:center;
    font-size: 11px;

    border: 1px solid #aaa;
    background-color: #EAA163;
    color: #f9f9f9;

    border-radius: 4px;
	-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
}
	#footer a
	{
		color: #f9f9f9;
	}

/**
 * ---------------------------------------------------- 
 * The most important data container, the table
 * with all these beautful numbers.
 * ---------------------------------------------------- 
 */
table
{
    width: 100%;
	border-spacing: 1px;

    /* get wide tables displayed nicely */
    overflow: scroll;
}
    table thead td, th
    {
        background-color: #F0DCA9;
        padding: 4px;
    }
    table tfoot td
    {
        background-color: #F0DCA9;
        padding: 4px;
    }
    table th
    {
        background-color: #f0dCa9;
    }
        table th.table-sortable
        {
            background: #f0dCa9 url(../images/01_unsorted.gif) right no-repeat;
        }
        table th.table-sorted-asc
        {
            background: #f0cCa9  url(../images/01_ascending.gif) right no-repeat;
        }
        table th.table-sorted-desc
        {
            background: #f0cCa9  url(../images/01_descending.gif) right no-repeat;
        }
    table td
    {
        background-color: #Eeeed0;

        padding: 4px;
        vertical-align: top;
    }
        /* format total rows in bold */
        table tr.totals
        {
            font-weight: bold;
        }
        table tr.totals td.key
        {
            text-align: right;
        }

            table tbody tr:hover td
            {
                background-color: #dedec0;
            }

        table tbody tr.odd td
        {
            background-color: #f5f5f0;
        }
            table tbody tr.odd:hover td
            {
                background-color: #dedec0;
            }

        table td.key
        {
            text-align: left;
        }
			table td.key div.cluetip-data
			{
				display: none;
			}
        table td.value
        {
            text-align: right;
        }
        table td.text
        {
            text-align: left;
        }
        table td.number
        {
            text-align: right;
        }
        table td.link
        {
            text-align: center;
        }
        table td.error
        {
            color: Red;
        }
        table td.event
        {
            color: #cc6600;
        }
		/* Style the directory entry in the error table */
		table td.directory
		{
			white-space: nowrap;
		}

/**
 * ---------------------------------------------------- 
 * The data within a specific reporting topic
 * ---------------------------------------------------- 
 */
.section
{
	margin-top: 8px;
	margin-bottom: 8px;
    background-color: White;
	-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
	border: 1px solid #bbb;

	padding: 5px;
}
    .section h2
    {
        background-color: White;
        border-bottom: 2px solid #2F4782;
        padding: 5px 10px 2px 5px;
        color: #2F4782;
    }

    .section h3
    {
        margin: 5px 0px;
        padding: 2px 5px;
        color: #3D5376;
    }
        .section .description h3
        {
            display: none;
        }

    .section p
    {
        margin: 5px 0px;
        padding: 2px 5px;
        
        text-align: justify;
    }


/**
 * ---------------------------------------------------- 
 * The chart area, usually as tabs, but sometimes standalone.
 * You find the tab stuff below.
 * ---------------------------------------------------- 
 */
.charts
{
    text-align: center;
    margin: 10px 50px; 
}
    .charts .chart
    {

        text-align: center;
    }
        .charts .chart img
        {
            border: 1px solid #bbb;
        }

/**
 * ---------------------------------------------------- 
 * The tool tips and their styling
 * ---------------------------------------------------- 
*/
#cluetip
{
	width: auto !important;
	font-size: 10px;
	max-width: 95%;
}
	#cluetip #cluetip-inner
	{
		padding: 2px;
		overflow: hidden;

		border: 1px solid #bbb;

		background-color: White;
	}
	#cluetip h4
	{
		font-size: 10px;
		background-color:#f0cca9;
		padding: 5px 5px;
	}
	#cluetip ul.urls
	{
		padding:0px;
		margin: 0px;
	}
		#cluetip li
		{
			padding: 2px 5px;
			list-style-type: none;
		}
		#cluetip li.even
		{
			background-color: #e9e9d2;
		}
		#cluetip li.odd
		{
		}
    

/**
 * ---------------------------------------------------- 
 * Tabs
 * ---------------------------------------------------- 
 */
.ui-tabs 
{ 
	margin: 5px 0px; 
	padding: 10px; 
}
	.ui-tabs .ui-tabs-nav 
	{  
		text-align: left; 
		list-style: none; 
		padding: 0px; 
		margin: 0px;
	}
		.ui-tabs .ui-tabs-nav ul 
		{
			list-style: none; 
			padding: 5px; 
			margin: 0; 
		}
		.ui-tabs .ui-tabs-nav li 
		{ 
			display: inline;
			cursor: pointer; 
			position: relative; 
			z-index: 0;
			border: 1px solid #bbb; 
			margin: 0 5px -1px 0; 
			padding: 5px 0px 0px 0px; 
			background-color: #e9e9e9;

		    border-top-left-radius: 4px;
		    border-top-right-radius: 4px;
			-moz-border-radius-topleft: 4px;
			-moz-border-radius-topright: 4px;
		    -webkit-border-top-left-radius: 4px;
		    -webkit-border-top-right-radius: 4px;
		    -khtml-border-top-right-radius: 4px;
		    -khtml-border-top-left-radius: 4px;
		}
			.ui-tabs .ui-tabs-nav li a 
			{ 
				text-decoration: none; 
				padding: 0px 20px;
			}
			.ui-tabs .ui-tabs-nav li.ui-tabs-selected 
			{ 
				padding-bottom: 1px; 
				border-bottom-width: 0; 
				background-color: White;
			}
		.ui-tabs .ui-tabs-panel 
		{ 
	    	border-radius: 4px;
			-moz-border-radius: 4px;
		    -webkit-border-radius: 4px;
		    -khtml-border-radius: 4px;

		    border-top-left-radius: 0px;
		   	-moz-border-radius-topleft: 0px;
	    	-webkit-border-top-left-radius: 0px;
		    -khtml-border-top-left-radius: 0px;

			padding: 5px; 
			border: 1px solid #bbb; 
			background-color: White; 
		}

		.ui-tabs .ui-tabs-hide 
		{ 
			display: none !important; 
		}