/*  CSS for USABLE TRANSIT  embed, schmembed  works with and overrides certain styles from format20 */

body.vhome {
	background-color: #ffe303; 
}

div#whole-vhome {
	color: #000000;
}



div#bannerpic-unlimited {
	background: url('../images/dfield2.png') 0 0;
/* drop in dfield2 when ready */
}


div#below-fold {
/* can spec a color in here ffe303 to enable flanks via vhome style */
}



div#usable-sidebyside {
	position: relative;  /* position to set for photo float absolutes */
	width: 1000px;
}

div#usable-sidebyside div#usable-col-left {
	float: left;
	width: 370px;
}

div#usable-sidebyside div#usable-col-left p.usable-titlebar {
	margin: 12px 0 0.3em 16px;
	padding: 10px 10px 10px 20px;
	background-color: #000000;
	font-size: 46px;
	letter-spacing: -2px;
	font-weight: bolder;
	color: #ffffff;
}

div#usable-sidebyside div#usable-col-left p.usable-exp {
	margin: 0 48px 1em 40px;
	font-size: 0.8em;
	line-height: 1.5em;
}



/* photo mini-exhibit */

.exhibit-photo-whole {
	display: none;
	background-color: #6692c1;
	padding: 18px;
	border: 1px solid #000000;
	position: absolute;
	left: 80px;
	z-index: 20;
}


div#usable-sidebyside div#usable-col-left p.exhibit-intro {
	margin: 1em 48px 1em 40px;
	border-top: 2px solid #e6cd01;
	padding-top: 0.8em;
	font-size: 0.8em;
	line-height: 1.3em;
	color: #cd6600;
}

div#usable-sidebyside div#usable-col-left ul.exhibit-photo-set {
	margin: 10px 48px 10px 40px;
	padding-top: 8px;
	list-style-type: none;
	border-top: 1px dashed #e6cd01;
}

div#usable-sidebyside div#usable-col-left ul.exhibit-photo-set li {
	display: block;
	width: 130px;
	float: left;
}

div#usable-sidebyside div#usable-col-left ul.exhibit-photo-set img.exhibit-photo-thumb {
	display: inline;
}

div#usable-sidebyside div#usable-col-left ul.exhibit-photo-set li.exhibit-photo-item:hover .exhibit-photo-whole {
	display: block;
}


div#usable-sidebyside div#usable-col-left ul.exhibit-photo-set li.exhibit-photo-caption {
	font-size: 0.8em;
	color: #cd6600;
}





/* RIGHT COLUMN */



div#usable-sidebyside div#usable-col-right {
	border-left: 1px solid #e6cd01;
	background-color: #ffffaa; 
	margin-top: 12px;
	padding-top: 86px;
	float: left;
	width: 629px;
	z-index: 10;
}


div#usable-sidebyside div#usable-col-right p {
	padding-left: 50px;
	margin-left: 30px;
	margin-right: 16px;
}


div#usable-sidebyside div#usable-col-right p.usable-feature-top-title {
	background: url('../images/us_top.png') 0 center no-repeat;
	font-size: 30px;
	font-weight: bolder;
	letter-spacing: -1px;
}

div#usable-sidebyside div#usable-col-right p.usable-feature-mid-title {
	background: url('../images/us_mid.png') 0 center no-repeat;
	font-size: 30px;
	font-weight: bolder;
	letter-spacing: -1px;
}

div#usable-sidebyside div#usable-col-right p.usable-feature-bottom-title {
	background: url('../images/us_bot.png') 0 center no-repeat;
	font-size: 30px;
	font-weight: bolder;
	letter-spacing: -1px;
}

div#usable-sidebyside div#usable-col-right p span {
	border-width: 6px;
	border-style: solid;
	padding: 2px 8px;
}



div#usable-sidebyside div#usable-col-right p span.usable-friendly {
	border-color: #325c74;
	color: #325c74;
	background-color: #ffffff;
}

div#usable-sidebyside div#usable-col-right p span.usable-friendly:hover {
	color: #ffffff;
	background-color: #000000;
}





div#usable-sidebyside div#usable-col-right p span.usable-easy {
	border-color: #308014;
	color: #308014;
	background-color: #ffffff;
}

div#usable-sidebyside div#usable-col-right p span.usable-easy:hover {
	color: #ffffff;
	background-color: #000000;
}


div#usable-sidebyside div#usable-col-right p span.usable-convenient {
	border-color: #964514;
	color: #964514;
	background-color: #ffffff;
}

div#usable-sidebyside div#usable-col-right p span.usable-convenient:hover {
	color: #ffffff;
	background-color: #000000;
}

div#usable-sidebyside div#usable-col-right p span.usable-bright {
	border-color: #ff8600;
	color: #ff8600;
	background-color: #ffffff;
}

div#usable-sidebyside div#usable-col-right p span.usable-bright:hover {
	color: #ffffff;
	background-color: #000000;
}


div#usable-sidebyside div#usable-col-right p span.usable-visible {
	border-color: #00688b;
	color: #00688b;
	background-color: #ffffff;
}

div#usable-sidebyside div#usable-col-right p span.usable-visible:hover {
	color: #ffffff;
	background-color: #000000;
}


div#usable-sidebyside div#usable-col-right p span.usable-smart {
	border-color: #166304;
	color: #166304;
	background-color: #ffffff;
}

div#usable-sidebyside div#usable-col-right p span.usable-smart:hover {
	color: #ffffff;
	background-color: #000000;
}





div#usable-sidebyside div#usable-col-right p.usable-feature-mid-text {
	background: url('../images/us_line.png') 0 0 repeat-y;
	font-size: 0.8em;
	line-height: 1.36em;
	padding: 0 0 1.05em 66px;
	margin: 0 72px 0 30px;
	color: #555555;
}


div#usable-sidebyside div#usable-col-right p.usable-feature-bottom-text {
	font-size: 0.8em;
	line-height: 1.36em;
	padding: 0 0 1.05em 66px;
	margin: 0 72px 0 30px;
	color: #555555;
}







div#bottom-nav p {
	color: #8b6508;
}


div#bottom-nav p a {
	color: #8b6508;
}

div#bottom-nav p a:hover {
	color: #139775;
	text-decoration: underline;
}

div#footer {
	color: #8b6508;
}