/*
   model-compare.css
   Mazda Model Compare
   
   Created by Matthieu Aussaguel on 2010-04-19.
   Copyright 2010 igloo digital. All rights reserved.
*/


/*MODEL: COMPARE*/

/*title & intro on the compare page*/
#compare-meta #content-title h1 {padding-bottom: 5px;}
#compare-meta #content-intro {width: 450px; font-size:1.2em;}

/*title & blurb on the compare rendering on model homepage*/
#rendering-title-compare h2 {padding-bottom:0}
#rendering-intro-compare {width:450px; font-size:1.2em;}

#compare-wrapper {width: 766px; margin-top: 10px; margin-bottom:30px;}

#compare-models {float:left; width: 132px; font-weight: bold; margin-top: 10px;}
#compare-models li {cursor: pointer; padding-left: 5px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px;}
#compare-models b {color: #0085cf; font-size: 12px; line-height: 16px;}
#compare-models li.active, #compare-models li.active b, #compare-models li.active:HOVER {background-color: #1C92D4; color: #fff; }
#compare-models li.hover {background-color: #e6e6e6;}
#compare-models .model {border-bottom: 1px solid #e5e5e5; margin-right: 10px; padding: 5px; display:block;}
#compare-models li.active .model {border: 0;}

.compare-content {float: left; width: 633px;color: #fff; }
.compare-content * {color: #fff;}
.compare-content h2 {font-weight: 100; font-size: 16px; margin: 20px  0 20px 0; color: #fff;}

	.compare-model-container {background: #1991D4 url('/images/compare/header-background-blue.gif') no-repeat 0 0;  padding: 10px 20px 20px 30px; position:relative; min-height:288px;}
		
		.compare-media {position: absolute; right:30px; top:-75px;}
	
		.compare-model-spec {float: left; margin: 0 30px 0 0px; display:inline; width:164px;}
		.compare-model-spec li{border-bottom: 1px solid #7abfe6; padding: 10px 0px 10px 0; font-size: 10px; color: #fff;}
		.compare-model-spec li b {font-size: 16px; color: #fff;}
		.compare-model-spec h3 {font-size: 12px; font-weight: 100; color:#bbdff2;}

		.compare-model-description { padding-top: 48px; padding-right: 40px;font-size: 11px; line-height: 18px; margin-left: 194px;}
		.compare-model-description div { margin-top: 10px;}
		.compare-model-description .compare-model-select, .compare-model-description a { font-weight: bold;}

		.compare-model-button a {margin-bottom: 10px; background: url('/images/compare/compare-button.gif') no-repeat left center; width:159px; height:26px; display:block; border: 0;}
		.compare-model-button a:HOVER {background-position: right center;}
	
	.compare-content-footer {background: url('/images/compare/footer-background-blue.gif') bottom left no-repeat; width: 100%; height: 6px; line-height:6px; /*  padding: 0 20px 0 30px;*/}