/* ================================================================================ */
/*
	Stylesheet for the city/statepages with expandable divelettes
	See Rick's research file expandable_divlette_multi.html for pure reserach info.
	June 2007
*/
/* ================================================================================ */




/* ================================================================================ */
/* city/state pages																	*/
/* ================================================================================ */

#contentrightcitystatepage {
	/* formats the rightside "sidebar" on city/state pages */
	float:				left;
	width:				219px;
	/*	height:			330px; removed this and added overflow:auto on the main container
		in order to clear the right side float/footer problem RL */
	margin-top:			18px;}
	
	#contentrightcitystatepage p img {
		/* floats the Get Quotes button */
		float:				right;}
	
	#contentrightcitystatepage select {
		margin-left:		36px;
		width:				168px;}
		
	ul.citystatelist,
	ol.citystatelist {
		margin-left:		234px;
		padding-left:		0px;}



/*	expandable divlettes ========================================================= */

/*	There are 4 expandable divlettes defined, repeatatively, with backgrounds 
	specifically created for the city/state pages.

	Note that there are slight differences in the content formatting 
	depending on whether the divlette top expands (divlette 0 in the left column)
	or the bottom expands (divlettes 1 through 3 in the right column) 
*/

/*	Expandable Diveltte 0 
	=====================
*/

/* structure */

.exdiv0wrapper {
	float:				left;
	width:				219px;
	margin-right:		14px;
	margin-bottom:		1em;}

.exdiv0top {
	background-image:	url(divlette_0_top.jpg);
	background-repeat:	no-repeat;
	padding-bottom:		8px;}
	
.exdiv0bottom {
	height:				43px;
	width:				219px;
	background-image:	url(divlette_0_bottom.jpg);
	background-repeat:	no-repeat;}

/* content formatting */

	.exdiv0wrapper h2 {
		/* don't use margin for positioning. It affects the background graphic position */
		margin:				0px;
		padding-top:		10px;
		padding-left:		10px;
		font-size:			140%;}
		
	.exdiv0top p {
		margin:				8px 10px 0px 10px;}
		
	.exdiv0bottom p {
		margin:				0px 12px 0px 0px ;
		padding-top:		4px;
		padding-left:		10px;
		line-height:		1.5em;
		text-align:			right;}



/*	Expandable Diveltte 1 
	=====================
*/

/* structure */

.exdiv1wrapper {
	width:				219px;
	margin-bottom:		1em;}

.exdiv1top {
	height:				33px;
	background-image:	url(divlette_1_top.jpg);
	background-repeat:	no-repeat;}
	
.exdiv1bottom {
	width:				219px;
	padding-bottom:		12px;
	background-image:	url(divlette_1_bottom.jpg);
	background-repeat:	no-repeat;
	background-position:bottom;
	/* shows the bottom of the graphic */ } 
	
/* content formatting */

	.exdiv1wrapper h2 {
		margin:				0px 10px 0px 0px ;
		padding-top:		10px;
		padding-left:		10px;
		text-align:			right;
		font-size:			14px;}
		
	.exdiv1top p {
		margin:				8px 10px 0px 10px;}
		
	.exdiv1bottom p {
		margin:				0px 10px 8px 0px ;
		padding-top:		6px;
		padding-left:		10px;
		line-height:		1.5em;}



/* 	Expandable Diveltte 2 
	=====================
*/


/* structure */

.exdiv2wrapper {
	width:				219px;
	margin-bottom:		1em;}

.exdiv2top {
	height:				33px;
	background-image:	url(divlette_2_top.jpg);
	background-repeat:	no-repeat;}
	
.exdiv2bottom {
	width:				219px;
	padding-top:		6px;
	padding-bottom:		12px;
	background-image:	url(divlette_2_bottom.jpg);
	background-repeat:	no-repeat;
	background-position:bottom;
	/* shows the bottom of the graphic */ } 
	
/* content formatting */

	.exdiv2wrapper h2 {
		margin:				0px 10px 0px 0px ;
		padding-top:		10px;
		padding-left:		10px;
		text-align:			right;
		font-size:			14px;}
		
	.exdiv2top p {
		margin:				8px 10px 0px 10px;}
		
	.exdiv2bottom p {
		margin:				0px 10px 0px 0px ;
		padding-top:		0px;
		padding-left:		10px;
		text-align:			right;
		line-height:		1.25em;}
		



/* 	Expandable Diveltte 3 
	=====================
*/


/* structure */

.exdiv3wrapper {
	width:				219px;
	margin-bottom:		1em;}

.exdiv3top {
	height:				33px;
	background-image:	url(divlette_3_top.jpg);
	background-repeat:	no-repeat;}
	
.exdiv3bottom {
	width:				219px;
	padding-bottom:		12px;
	background-image:	url(divlette_3_bottom.jpg);
	background-repeat:	no-repeat;
	background-position:bottom;
	/* shows the bottom of the graphic */ } 
	
/* content formatting */

	.exdiv3wrapper h2 {
		margin:				0px 10px 0px 0px ;
		padding-top:		10px;
		padding-left:		10px;
		text-align:			right;
		font-size:			14px;}
		
	.exdiv3top p {
		margin:				8px 10px 0px 10px;}
		
	.exdiv3bottom p {
		margin:				0px 10px 0px 0px ;
		padding-top:		6px;
		padding-left:		10px;
		text-align:			right;
		line-height:		1.25em;}



/* end of styles */