/* Category Widget */

.box.guides.categories {
	/* TODO: Should be in somewhere generic */
	width: 336px;
	margin: -1px 11px 23px 11px;
	padding: 0;
	border: 1px solid #A7A9AC;
	background-image: url(/images/PORTAL_LIVESTREAMS_box_background.jpg);
}

	.box.guides.categories .inside_box {
		/* TODO: Should be in somewhere generic */
		color: #000222;
		font-family: 'eurostilebold', Arial, sans-serif;
		font-size: 14px;
		font-weight: normal;
		border-spacing: 0 0;
		box-shadow: -5px 5px 5px #A7A9AC;
	}

	.box.guides.categories ul {
		background: url(/images/guides/guidesWidgetBackground.jpg) repeat scroll center bottom transparent;
		list-style-type: none;
		padding: 0;
		margin: 0;
	}

	.box.guides.categories li {
	/*background: rgba(237, 236, 237, 0.8); */
		height: 48px;
	}

	.box.guides.categories a {
		font-size: 18px;
		color: #000222;
		display: block;
		padding: 15px 0 15px 85px;
	}

	.box.guides.categories a:hover {
		color: #4B79BE;
	}

	.box.guides.categories a:active {
		color: #000222;
	}

/* Table Of Contents Widget */

.box.guides.tableOfContents {
	/* TODO: Should be in somewhere generic */
	width: 336px;
	margin: -1px 11px 23px 11px;
	padding: 0;
	border: 1px solid #A7A9AC;
/* max-height: 768px; */
	overflow-y: auto;

	background-image: url(/images/PORTAL_LIVESTREAMS_box_background.jpg);
}

	.box.guides.tableOfContents.float {
		position: fixed;
		top: 10px;
	}

	.box.guides.tableOfContents .inside_box {
		/* TODO: Should be in somewhere generic */
		color: #000222;
		font-family: 'eurostilebold', Arial, sans-serif;
		font-size: 14px;
		font-weight: normal;
		border-spacing: 0 0;
		box-shadow: -5px 5px 5px #A7A9AC;
	}

	/* .box.guides.tableOfContents .ellipsis{
		overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
	} */

	.box.guides.tableOfContents ul {
		list-style-type: none;
		padding: 0;
		margin: 0;
	}

	.box.guides.tableOfContents .body {

		/* background: url(/images/guides/guidesWidgetBackground.jpg); */
	}

	/* .box.guides.tableOfContents .body div.title {
		padding: 10px;
		font-weight: bold;
		background: rgba(163, 177, 172, 0.8);
		font-size: 15px;
		text-align: center;
	}

	.box.guides.tableOfContents .body div.title a {
		color: #000;
	}
	*/

	.box.guides.tableOfContents .body > ul {
	/*	padding: 10px; */
	/*	background: rgba(237, 236, 237, 0.85); */
	}

	.box.guides.tableOfContents .body > ul > li {
		font-weight: normal;
		font-size: 16px;
	/*	font-family: 'eurostilebold', Arial, sans-serif; */
		border-top: 1px solid #7A988C; /* rgba(163, 177, 172, 0.8); */
	}

		.box.guides.tableOfContents .body > ul > li a {
			color: #4E5E56;
			padding: 6px 12px;
			display: block;
			overflow: hidden;
	    	text-overflow: ellipsis;
	    	white-space: nowrap;
		}

		.box.guides.tableOfContents .body > ul > li a:hover {
			color: #4B79BE;
			background: #F2F2F2;
		}

		.box.guides.tableOfContents .body > ul > li.selected,
		.box.guides.tableOfContents .body > ul > ul li.selected {
			background: url(/images/bullet_8x8_blue.png) no-repeat -1px center #FCFCFC;
			padding: 2px 0 2px 4px;
		}

		.box.guides.tableOfContents .body > ul > li.selected {
			padding: 2px 0 2px 10px;
		}

		.box.guides.tableOfContents .body > ul > li.selected a{
			color: #7A988C;
			cursor: default;
    		pointer-events: none;
    		overflow: hidden;
	    	text-overflow: ellipsis;
	    	white-space: nowrap;		
		}

		.box.guides.tableOfContents .body > ul > ul li.selected a{
			color: #424445;
			cursor: default;
    		pointer-events: none;
    		overflow: hidden;
	    	text-overflow: ellipsis;
	    	white-space: nowrap;
		}

		.box.guides.tableOfContents .body > ul > ul {
			margin: 3px 0 6px;
			font-size: 14px;
		}

			.box.guides.tableOfContents .body > ul > ul li {
			}

			.box.guides.tableOfContents .body > ul > ul li a {
			/*	color: #7A988C; light green */
				color: #000222;
				padding: 4px 0 4px 20px;
				display: block;
				overflow: hidden;
	    		text-overflow: ellipsis;
	    		white-space: nowrap;
			}

			.box.guides.tableOfContents .body > ul > ul li a:hover {
				color: #4B79BE;
				background: #F2F2F2;
			}

				.box.guides.categories li {
	background: rgba(237, 236, 237, 0.8); 
		height: 48px;
	}
	.box.guides.categories li:hover{
		background: rgba(237, 236, 237, 0.9);
	}

	.box.guides.categories li.odd {
		background: rgba(163, 177, 172, 0.8); 
	}
	.box.guides.categories li.odd:hover {
		background: rgba(163, 177, 172, 0.9); 
	}
