/*
reset.css
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.2
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;}

table td {
	vertical-align: top; 
}

/*
 *	Tawala project defaults
 *
 */
body {
	margin: 16px 0;
	padding: 0;
	color: #000000;
	background-color: #ffffff;
	font-family:  Verdana, Geneva, sans-serif; 
	font-size: 11pt;
	line-height: 1.3;
	text-align: left;
}

div#outerContainer {
	text-align: center;
	width: 100%;
}

table {
	font-size: inherit;
	font-family: inherit;
	color: inherit;
}

strong {
	font-weight: bold;
}

img {
	border: 0px;
}

table.TAWALA-tabbed-paragraph {
	border-collapse: collapse;
	border: none; 
	margin-left:0; 
	padding-left: 0px; 
	width: 90%
}
	
	table.TAWALA-tabbed-paragraph tr {
		margin-left: 0; 
		padding-left: 0px; 
		padding-right: 0px; 
	}
	
	table.TAWALA-tabbed-paragraph td {
		margin-left: 0; 
		padding-left: 0px; 
		padding-right: 2px; 
		vertical-align: middle; 
	}

		table.TAWALA-tabbed-paragraph td input.text {
			margin-bottom: .4em;
		}

input.text, textarea {
	font-size: 100%;
	font-family: Verdana, Helvetica, sans-serif;
	padding: .2em;
}

input.text {
	line-height: .9em;
}

	input.text.validateError, textarea.validateError {
		background-color: #fff0f0;
		border: 3px solid #cc0000;
	}

textarea {
	line-height: 1.2em;
}

h1, h2, h3, h4, h5, h6, div.text.heading, div.text.subheading  {
	color: #222222;
	font-family:  verdana, helvetica, sans-serif; 
	line-height: 1.1;
	margin-bottom: 10px;
	background-image: none;
	background-position: 0% 8px;
	background-repeat: no-repeat;
}

h1, div.text.heading {
	font-size: 36px;
}

	h1.pageHeading {
		font-size: 36px;
		line-height: 64px;
		position: relative;
		background-image: none;
		background-position: 100% 50%;
		background-repeat: no-repeat;
		height: 80px;
		margin: 0;
		padding: 0;
		text-align: left;
	}

		h1.pageHeading img {
		}
	
		h1.pageHeading div {
			position: absolute;
			top: 20px;
			left: 0px;
			z-index: 2;
			white-space: nowrap;
			overflow: hidden;
			width: 95%;
			padding-left: 16px;
			padding-right: 16px;
			text-align: left;
		}

h2, div.text.subheading {
	font-size: 24px;
}

h3 {
	font-size: 1.5em;
}

h4 {
	font-size: 1.4em;
}

h5 {
	font-size: 1.3em;
}

h6 {
	font-size: 1.2em;
}


#tawalaProjectContainer {
	background-color: #ffffff;
	border: 0px solid #cccccc;
	margin: 0 auto;
	display: inline-block;
	min-width: 700px;
	max-width: 950px;
	text-align: left;
}

#tawalaRightSideAdsContainer {
	float: right;
}

#innerTawalaFooter {
	position: relative;
	width: 100%;
	height: 44px;
	text-align: right;
/*	background: url("images/madewithtawala-button.gif") 98% 50% no-repeat; */
}


#tawalaFooter {
	height: 0px;
}

#tawalaFooterLogo {
	position: absolute;
	right: 15px;
	top: 7px;	
	width: 173px;
	height: 29px;
	background: url("images/madewithtawala-button.gif") 100% 50% no-repeat;
	cursor: pointer;
}

#errormsg {	
	border: 1px solid #cc0000;
	padding: 6px;
	width: 80%;
	color: #880000;
	text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 8px;
    font-weight: bold;
}

.urgent-message {
	clear: both;
	margin: 10px;
	font-size: 115%;
	border: 1px dashed #C24322;	
	background: #ffffff url(/images/icons/warning.png) no-repeat 10px center;
	text-align: left;
	padding: 10px 0 10px 52px;
	color: #cc0000;
}
		
	.urgent-message.info {
		background-image: url(/images/icons/info.png);
		border-color: #43C222;
		color: #448844;		
	}

div.text {
	padding-bottom: 1em;
}

	.yui-dt-bd table td div {
		padding-bottom: 0;
		white-space: nowrap;
	}

	div.text.condensed, div.text.instructional.condensed, div.text.error.condensed {
		padding-bottom: 0;
	}

	div.text.heading, div.text.subHeading {
		background-position: 0% 10%;
		padding-bottom: 0;
	}
	
	div.text.instructional {
		color: #3e4695;
		font-weight: normal;
		font-style: italic;
		padding: .5em;
		margin: 1em;
		text-align: justify;
	}
	
	div.text.error {
		color: #c24322;
	    font-weight: normal;
		font-style: normal;
		padding: .6em;
		margin: 1em;
		text-align: justify;
	}

form, div.tawalaDocument, div.document {
    text-align: left;
}

div.tawalaDocument, div.document {
	padding: .2em 1em .2em 2em;
}	

form {
	padding: 1em 2em;
}

	/* column widths for FIB labels and inputs */
	form input.text.small, form textarea.small {
		width: 6em;
	}
	
	form table.fib td.small {
		width: 12em;
	}
	
	form table.justified {
		width: 70%;
	}
	
		form table.justified td {
			text-align: left;
			vertical-align: top;
			padding-top: 4px;
		}
		
		form table.justified td.right {
			width: 1%;
			padding-left: 0.4em;
			padding-right: 0.5em;
			text-align: right;
		}
		
		form table.justified td.left {
			padding-left: 0.4em;
		}
		
		form table.justified td.blank {
			padding-top: 0px;
		}
	
		form table.justified td.blank input.text,
		form table.justified td.blank textarea {
			width: 96%;
		}

		form table.justified td table.remainder {
			width: 100%
		}
		
		form table.justified td table.remainder td {
		}

	form input.text.medium, form textarea.medium, form table.fib td.medium {
		width: 24em;
	}
	
	form input.text.large, form textarea.large, form table.fib td.large {
		width: 48em;
	}
	
	form input.radio, form input.checkbox {
		background-color: transparent;
	}

	form div.mcRadio, 
	form div.mcCheckbox,
	form div.textItem {
		padding-bottom: 1.4em;
	}

		form div.mcRadio.condensed, 
		form div.mcCheckbox.condensed,
		form div.textItem.condensed {
			padding-bottom: 0;
		}

		form div.mcRadio.validateError, 
		form div.mcCheckbox.validateError  {
			background-color:#FFD8D8;
			border: 1px solid #FF8D8D;
			color: #000000;		
			padding: 4px;
			margin-top: 4px;
			margin-bottom: 4px;
		}

		*html form div.mcRadio.validateError, 
		*html form div.mcCheckbox.validateError  {
			display: inline-block;
		}

	form div.fib div {
		padding-bottom: .4em;
	}
	
	form div.textItem {
		padding-top: .5em;
	}
	
	form table.fib tr td {
		padding-bottom: .4em;
	}
	
    form table.fib tr td.label,
	form table.fib tr td.blank,
	form table.fib tr td.remainder {
		vertical-align: top;
		padding-right: .5em;
	}
	
    form table.fib tr td.label {
		width: 160px;
		padding-right: 1em;
	}

		form table.fib tr td.label.left {
			text-align: left;
		}
		
	    form table.fib tr td.label.right {
			text-align: right;
		}
	
    form div.fib label {
		padding-right: 1em;
    }

	form div.fib div.answer {
		display: inline;
		padding-top: .5em;
	}

        form div.fib.vertical div.answer {
			display: block;
		}
		
	form div.fib div.answer input.text {
		margin-right: .5em;
	}

	form div.fib div.answer label {
		padding-right: 1em;
	}

		
   	form div.mcRadio label.question, form div.mcCheckbox label.question {
		display: block;
       	padding-bottom: .4em;
       	padding-top: .5em;
   	}

    	form div.mcRadio span.answer, form div.mcCheckbox span.answer {
			display: block;
			padding-top: .3em;
    	}

    	form div.mcRadio span.answer input, 
		form div.mcCheckbox span.answer input {
    	}

		form div.mcRadio span.answer label, 
		form div.mcCheckbox span.answer label {
			display: block;
			font-size: 100%;
			padding: 0 0 0 0;
			margin: -15px 12px .4em 24px; 
			* margin-top: -20px;
			/* width: 90%; */
		}
		
		form div.mcRadio.vertical span.answer label, 
		form div.mcCheckbox.vertical span.answer label {
			width: 90%;
		}
		
		form div.mcRadio.horizontal span.answer, 
		form div.mcCheckbox.horizontal span.answer {
			display: inline;
			padding-right: 1em;
		}
		
		form div.mcRadio.horizontal span.answer label, 
		form div.mcCheckbox.horizontal span.answer label {
			display: inline;
			margin: -15px 0 .4em 0;
		}

		form div.mcRadio.multiColumn table.answer,
		form div.mcCheckbox.multiColumn table.answer {
			width: 600px;
		}

			form div.mcRadio.multiColumn table.answer tbody tr td,
			form div.mcCheckbox.multiColumn table.answer tbody tr td {
				width: 20%;
				vertical-align: top;
			}

		
    form .submitButton {
        margin: 2em 0 0 0;
    }

        form .submitButton input {
            font-weight: bold;
            Text-transform: capitalize;
			padding: 0;
        }

    form .produced-by, form .produced-by a {
    	text-align: center;
    	font-size: .9em;
    }

.produced-by, .produced-by a {
	text-align: center;
	font-size: .9em;
}

/*
 * Component styles
 */
table.component {
	border-collapse: collapse;
	font-size: 1em;
}
	table.component div.text {
		padding-bottom: 0em;
	}

	table.component.outline {
		border: 1px solid #cccccc;				
	}
	
	table.component thead, tr.heading th,
	table.component th.leftheading {
		background-color: #888888;
		color: #eeeeee;
	}
	
		table.component th {
			padding: .2em .5em;
			font-weight: bold;
		}

		table.component.outline thead th {
			border: 1px solid #cccccc;
		}

	table.component tfoot {
		background-color: #eeeeee;
		color: #000000;
	}

		table.component tfoot .legend {
			font-size: .9em;
			color: #888888;
		}
	
	table.component tr {}

		table.component tbody tr td {
			white-space:nowrap;
		}

		table.component tbody tr.odd{
			background-color: #f8f8f8;
		}

		table.component tbody tr.even{
			background-color: #ffffff;
		}

		table.component tbody tr:hover {
			background-color: #e8e8e8;
		}

	table.component td{
		padding-left: 1em;
		padding-right: 1em;
		line-height: 1.5em;
	}
		table.component td.left {
			text-align: left;
		}

		table.component td.right {
			text-align: right;
		}

		table.component td.center {
			text-align: center;
		}

		table.component.outline tbody td,
		table.component.outline tbody th {
			border: 1px solid #dddddd;
		}
	

	/* ******************************
	 * Categorizer CSS
	 */
	div.categorizer {
		width: 100%;
	}

		div.categorizer div.destinationTable {
			width : 29%;
			float: right;
			overflow: auto;
			height: 400px;
		}

		div.categorizer div.sourceTable {
			width : 69%;
			float: left;
			overflow: auto;
			margin-right: 10px;
			height: 400px;
		}
		
	div.categorizer-left-filter {
			width : 68.5%;		
			border: 1px solid #888888;
			margin-bottom: 2px;
	}
	
	div.categorizer-left-filter form {
			padding: 3px 0;		
	}

		div.categorizer-left-filter form input.text {
				border-style: inset; 
				padding: 0 2px;
		}
		
	div.categorizer-right-filter {
			width : 28.5%;
			border: 1px solid #888888;		
			margin-bottom: 2px;
	}
	
	div.categorizer-right-filter form {
			padding: 3px 0;		
	}

		div.categorizer-right-filter form input.text {
				width: 125px;
				border-style: inset; 
				padding: 0 2px;
		}
		
		
		div.categorizer table {
			width: 100%;
			border-collapse: collapse;
			background-color: #ffffff;
			border: 1px solid #cccccc;
			text-align : left;
		}
			
			div.categorizer table tbody td {
				border: 1px solid #cccccc;
				line-height: 1.5em;
				white-space: normal;
				overflow: visible;
				padding-left: .5em;
				padding-right: .5em;
			}

			div.categorizer div.destinationTable table tbody td {
				white-space: nowrap;
			}
				
				div.categorizer table td.id, div.categorizer table th.id {
					display: none;
				}

			div.categorizer table th {
				color: #eeeeee;
				background-color: #888888;
				border: 1px solid #cccccc;
				font-size: 1em;
				line-height: 1.5em;
				text-align: center;
			}
			
			div.categorizer table.sourceTable { } 

				div.categorizer table.sourceTable th { }

			div.categorizer table.destinationTable { }
				
				div.categorizer table.destinationTable th span.categoryCount {
					text-align: left;
					padding-right: .6em;
				}
					
				div.categorizer table.destinationTable th {
					text-align: left;
				}
			
			div.categorizer form.categorizer-filter {
				text-align: right;
				padding-right: 0;
			}
			
	div.categorizer div.categorizer-left-filter {
		float: left;
	}

	div.categorizer div.categorizer-right-filter {
		float: right;
	}

	div.categorizer .buttons a, 
	div.categorizer .buttons a:visited, 
	div.categorizer .buttons button, 
	div.categorizer .buttons button:visited {
		font-size: 8px;
		margin-right: 4px;
	}
	
	.graph { 
		position: relative; /* IE is dumb */
		width: 200px; 
		border: 1px solid #aaaaaa;
		padding: 2px; 
		margin-bottom: .2em;					
		margin-top: .2em;					
	}

	.graph.small {
		width: 100px;
	}
	
	.graph.medium {
		width: 200px;
	}
	
	.graph.large {
		width: 300px;
	}
	
	.graph .bar { 
		display: block;	
		position: relative;
		text-align: center; 
		background: #aaaaaa; 					
		color: #333; 
		font-size: .9em;
		height: 1.3em; 
		line-height: 1.4em;									
	}

	.graph.color1 { border-color: #B1D632; }
		.graph.color1 .bar { background: #B1D632; }

	.graph.color2 { border-color: #56a8e2; }
		.graph.color2 .bar { background: #56a8e2; }

	.graph.color3 { border-color:#ff8888; }
		.graph.color3 .bar { background: #ff8888; }

	.graph.color4 { border-color: #ffcc33; }
		.graph.color4 .bar { background: #ffcc33; }

	.graph.color5 { border-color: #FFFF88; }
		.graph.color5 .bar { background: #FFFF88; }

	.graph.color6 { border-color: #CDEB8B; }
		.graph.color6 .bar { background: #CDEB8B; }

	.graph.color7 { border-color: #C3D9FF; }
		.graph.color7 .bar { background: #C3D9FF; }

	.graph.color8 { border-color: #FF1A00; }
		.graph.color8 .bar { background: #FF1A00; }

	.graph.color9 { border-color: #FF7400; }
		.graph.color9 .bar { background: #FF7400; }

	.graph.color10 { border-color: #008C00; }
		.graph.color10 .bar { background: #008C00; }

	.graph.color11 { border-color: #4096EE; }
		.graph.color11 .bar { background: #4096EE; }

	.graph.color12 { border-color: #FF0084; }
		.graph.color12 .bar { background: #FF0084; }

	.graph.color13 { border-color: #6BBA70 }
		.graph.color13 .bar { background: #6BBA70; }

	.graph.color14 { border-color: #D15600; }
		.graph.color14 .bar { background: #D15600; }

	.graph.color15 { border-color: #C79810; }
		.graph.color15 .bar { background: #C79810; }

	.graph.color16 { border-color: #73880A; }
		.graph.color16 .bar { background: #73880A; }

	.graph .bar span { position: absolute; left: 1em; }
	/* This extra markup is necessary because IE doesn't want to follow the rules for overflow: visible */


	/* BUTTONS 
	 * from Particle Tree article "Rediscovering the Button Element"
	 * http://particletree.com/features/rediscovering-the-button-element/
	 */
	div.buttons {
		clear: both;
	}

	.buttons a, .buttons a:visited, .buttons button, .buttons button:visited{
	    display:block;
	    margin:0 7px 0 0;
	    background-color:#f0f0f0;
	    border:1px solid #aaaaaa;
	    border-top:1px solid #cccccc;
	    border-left:1px solid #cccccc;

	    font-family: Tahoma, Arial, Verdana, sans-serif;		
		font-size: 10px;
			
	    line-height: 120%;
	    text-decoration: none;
	    font-weight: bold;
	    color: #555555;
	    cursor:pointer;
	    padding: 3px 7px 3px 7px; /* Links */

		-webkit-border-radius: 10px; /* Safari prototype */
		-moz-border-radius: 10px; /* Gecko browsers */
		border-radius: 10px; /* Everything else - limited support at the moment */
	}
	
	.buttons.inline a, .buttons.inline a:visited, .buttons.inline button, .buttons.inline button:visited{
		display: inline;
	}
	
	.buttons img.spacer {
		float: left;
		margin-right: 8px;
	}
	
	.buttons.right a, .buttons.right button, .buttons.right img.spacer{
	}
	
	.buttons button{
	    width:auto;
	    overflow:visible;
	    padding: 3px 7px 3px 7px; /* IE6 */
	}

	.buttons button[type]{
	    padding: 3px 7px 3px 7px; /* Firefox */
	    line-height: 15px; /* Safari */
	}

	*:first-child+html button[type]{
	    padding: 3px 7px 3px 7px; /* IE7 */
	}

	.buttons button img, .buttons a img{
	    margin: 0 3px -3px 0 !important;
	    padding: 0;
	    border: none;
	    width: 16px;
	    height: 16px;
	}

	/* STANDARD */
	button:hover, .buttons a:hover{
	    background-color: #e0e0e0; /* #dff4ff; */
	    border:1px solid #aeaeae;
	    color:#222222;
	}
	.buttons a:active, button:active {
	    background-color: #eeeeee; /* #6299c5; */
	    border: 1px solid #dedede;
	    color: #888888;
	    border: 1px solid #cccccc;
	    border-top: 1px solid #aaaaaa;
	    border-left: 1px solid #aaaaaa;
	}
	
	/* Dark */
	button.dark, .buttons a.dark {
	    color:#ffffff;
	    background-color: #888888; /* #E6EFC2; */
	    border: 1px solid #444444;
	    border-top: 1px solid #666666;
	    border-left: 1px solid #666666;
	}
	
	.buttons a.dark:hover, button.dark:hover{
	    background-color: #aaaaaa; /* #E6EFC2; */
	    color:#ffffff;
	}
	.buttons a.dark:active{
	    background-color: #cccccc; /* #529214; */
	    border: 1px solid #aaaaaa;
	    border-top: 1px solid #999999;
	    border-left: 1px solid #999999;
	}

/*****
 * YUI Datatable overrides
 */
.yui-skin-sam .yui-dt table {
	font-family: inherit;
}


.yui-skin-sam .yui-dt th {
	background-image: none;
	background-color: #888888;
	color: #eeeeee;
	text-align: center;
	font-weight: bold;	
}

.yui-skin-sam .yui-dt th, .yui-skin-sam .yui-dt th a {
	color:#EEEEEE;
	font-weight:bold;
}

.yui-skin-sam .yui-dt-liner {
	color: #000000;
}

/* Standard odd/even row colors */
.yui-skin-sam tr.yui-dt-odd {
	background-color: #f0f0f0;
}

.yui-skin-sam tr.yui-dt-even {
	background-color: #ffffff;
}

/* odd/even row colors when column is selected */
.yui-skin-sam tr.yui-dt-even td.yui-dt-asc, .yui-skin-sam tr.yui-dt-even td.yui-dt-desc {
	background-color:#EDF5FF;
}

.yui-skin-sam tr.yui-dt-odd td.yui-dt-asc, .yui-skin-sam tr.yui-dt-odd td.yui-dt-desc {
	background-color:#DBEAFF;
}

/* paginator attributes */
.yui-skin-sam .yui-pg-container, .yui-skin-sam .yui-dt-paginator {
	color: #444444;
}

.yui-skin-sam .yui-pg-current-page, .yui-skin-sam .yui-dt-paginator .yui-dt-selected {
	background-color:#FFFFFF;
	border:1px solid #FFFFFF;
}

.yui-skin-sam a.yui-pg-page, .yui-skin-sam a.yui-dt-page {
	background-color:#FFFFFF;
	border:1px solid #CBCBCB;
}

/* 
 * Turn of border around data table container div
 */
.yui-skin-sam .yui-dt-scrollable .yui-dt-hd,
.yui-skin-sam .yui-dt-scrollable .yui-dt-bd {
	border: none;
	background-color: #ffffff !important;
}

.yui-skin-sam .yui-dt-scrollable .yui-dt-hd {
	border-left: 1px solid #7F7F7F;
}

#validateMsg {
	display: none; 
	position: absolute; 
	z-index: 200; 
	background: url(/images/msg_arrow.gif) left center no-repeat; 
	padding-left: 7px
}

#validateMsgContent {
	display: block; 
	border: 2px solid #cc0000;
	border-left: none; 
	padding: 12px 20px 8px 8px; 
	min-width: 150px; 
	max-width: 250px;
	background: #ffe0e0 url(/images/x.gif) top right no-repeat; 
	color: #880000;
	cursor: pointer;
}