/* 
Theme Name: Campus
Theme URL: http://campuscars.net
Description: A blank theme for you to draw on.
Author: Jake Ketcheson
Author URI: http://derp.com
Version: 2.0.1

Obviously, you may edit the above info upon your customization.
Though I wouldn't mind a link somewhere... *hint hint*
*/



/*
Here is a list of all the <DIV>s in Whiteboard.
*/

/*
This is used to change the header image
*/
body{
	background-image: url(images/headerlogo.png);
	background-repeat: no-repeat;
	background-position: center 36px;	
}
#contactBar h3{
	background-image: url(images/phone_number.png);
	background-repeat: no-repeat;
	display: block;
	height: 27px;
	width: 153px;
	background-position: bottom;
}
#contactBar h3 span{
	display:none;
}

#topTitleHTML  {
	height: 40px;
}

#html-container {
	width: 886px;
	margin-left: -5px;
	position: relative;
	margin-bottom: 20px;
	background: transparent url('images/homepage/shadow_middle_large.png') repeat-y 0 0;
}

#html-container:before {
	position: absolute;
	top:-14px;
	width: 100%;
	height: 25px;
	content: '';
	background: transparent url('images/homepage/shadow_top.png') no-repeat 0 0;
}

#html-container:after {
	position: absolute;
	bottom: -20px;
	width: 100%;
	height: 20px;
	content: '';
	background: transparent url('images/homepage/shadow_bottom.png') no-repeat 0 0;
	z-index: 1;
	clear: both;
}

#html-container #home-content {
	padding-top: 20px;
	min-height: 500px;
}

#html-container .limiter {
	width: 868px;
	margin: auto;
}

#html-container .limiter p {
	padding: 10px 15px 10px 15px;
}

#html-container #slideshow {
	width: 820px;
	height: 300px;
	margin: auto;
	background-color: #000;
	border: 4px solid #000;
	position: relative;
}

#slider {
	width: 820px;
	height: 300px;
	z-index: 2;
}

#slider #slide-prev {
	/* Any properties you need to stylize your Prev button */
}

#slider #slide-next {
	/* Any properties you need to stylize your Next button */
}

#slider .slide { display: none; }
#slider  .slide.activeSlide { display: block; }
.slide-captions { display: none; }

/*
#slideshow .caption {
	background:#000;
	height:50px;
	width:760px;
	position:absolute;
	left:-20px;
	bottom:20px;
	z-index:3;
	color:#fff;
	padding:20px 40px;
	display:none;
}
*/

#html-container .ribbon {
	width: 902px;
	height: 70px;
	background: transparent url('images/homepage/ribbon.png') no-repeat 0 0;
	margin-left: -8px;
	padding-top: 55px;
	padding-left: 45px;
	text-align: center;
	font-size: 200%;
	letter-spacing: 1px;
}

#html-container .ribbon a {
	color: #ccc;
	text-shadow: -2px -2px 0 #000;
	text-decoration: none;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}

#html-container .ribbon a:hover {
	color: #f33;
}

#html-container .ribbon#new-car-title {
	text-shadow: 1px 1px 0 #400;
}

#new-car-content #html-container {
	padding-top: 15px;
}

#new-car-content .ribbon {
	background: transparent url('images/newcars/ribbon.png') no-repeat 0 0;
	padding-top: 20px;
	text-align: left;
	margin-left: -4px;
}


#new-car-sidebar {
	text-align: center;
	float: left;
	width: 250px;
	margin-left: 30px;
}

#new-car-sidebar #carFocus {
	text-align: center;
	height: 230px;
	margin-left: 10px;
}

#new-car-sidebar #carFocus .table-center {
	display: table-cell;
	vertical-align: middle;
	height: 230px;
}

#new-car-sidebar #carFocus img.hidden {
	display: none;
}

#new-car-sidebar #carPictures ul {
	margin-left: 10px;
}

#new-car-sidebar #carPictures ul li {
	display: inline;
	padding-right: 10px;
	cursor: pointer;
}

#new-car-sidebar #start-price {
	margin-top: 20px;
	font-size: 180%;
	color: #3d423e;
	margin-bottom: 20px;
}

#new-car-sidebar #start-price span {
	font-size: 220%;
	font-weight: bold;
}

#new-car-sidebar #gas-mileage {
	background: url('images/newcars/gas.jpg') no-repeat 50% 10px;
	margin-top: 30px;
	margin-bottom: 15px;
}

#new-car-sidebar #gas-mileage .gas-entry {
	height: 60px;
}

#new-car-sidebar #gas-mileage .gas-entry > div {
	margin-top: 5px;
	font-size: 250%;
	font-weight: bold;
	color: #3D423E;
}

#new-car-sidebar #gas-mileage #gas-city {
	float: left;
	margin-left: 10px;
}

#new-car-sidebar #gas-mileage #gas-hwy {
	float: right;
	margin-right: 10px;
}

#new-car-sidebar #gas-mileage .disclaimer {
	clear: both;
	color: #666;
}

#new-car-sidebar #facebook-share-btn {
	margin-top: 15px;
}

#html-container .content-wrapper {
	float: right;
	width: 500px;
	margin-right: 40px;
	margin-top: 20px;
}

#payment-calculator {
	font-size: 120%;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	background-color: #e0e0e0;
	color: #444;
	padding-bottom: 10px;
}

#payment-calculator .title {
	font-size: 140%;
	background-color: #900;
	padding: 5px 10px;
	margin-bottom: 10px;
	color: #fff;
	font-weight: bold;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#payment-calculator #calc-results {
	float: right;
	padding-right: 10px;
	width: 29.9%;
	text-align: center;
	font-size: 120%;
	color: #666;
}

#payment-calculator #calc-results .result {
	font-size: 150%;
	font-weight: bold;
	color: #444;
}

#payment-calculator #calc-results #my-monthly-payment {
	margin-bottom: 20px;
}

#payment-calculator #calc-form {
	width: 70%;
	padding-left: 10px;
}

#payment-calculator #calc-form table td {
	padding: 5px;
}

#payment-calculator #calc-form table td.label {
	width: 40%;
}

#payment-calculator #calc-form table td.field {
	font-size: 80%;
}

#payment-calculator #calc-form input {
	font-size: 120%;
	border: 1px solid #ccc;
	padding: 3px 6px;
	margin-left: 5px;
}

#payment-calculator #calc-form input.field-error {
	border: 1px solid #c00;
}

#payment-calculator #calc-form td.submit-btn {
	text-align: center;
}

#payment-calculator #calc-form input#calculate-btn {
	background-color: #fff;
	border: 1px solid #999;
	border-radius: 5px;
	padding: 5px 15px;
	cursor: pointer;
}

#html-container #new-car-specs {
	margin-top: 20px;
	font-size: 130%;
}

#new-car-specs .title {
	text-align: right;
	font-weight: bold;
	font-size: 150%;
	padding-bottom: 3px;
	border-bottom: 1px solid #ddd;
	margin-bottom: 10px;
	color: #999;
	-webkit-transition: all 0.25s ease-in-out;
}

#html-container #new-car-specs:hover .title {
		color: #000;
		padding-right: 20px;
}

#new-car-specs ul {
	background-color: #ddd;
	border-radius: 10px;
}

#new-car-specs li {
	clear: both;
}

#new-car-specs li .label {
	float: left;
	width: 40%;
	text-align: right;
	background-color: #bbb;
	padding: 5px;
}

#new-car-specs li:first-child .label {
	border-top-left-radius: 10px;
}

#new-car-specs li:last-child .label {
	border-bottom-left-radius: 10px;
}

#new-car-specs li .value {
	float: right;
	width: 53%;
	padding: 5px;
}

#html-container .CTA-wrapper {
	width: 870px;
	margin: auto;
	margin-top: 30px;
}

#new-car-content .CTA-wrapper {
	margin-top: 0px;
}

#html-container ul.CTA-items {
	padding: 0 20px;
	text-align: center;
	height: 165px;
}

#new-car-content ul.CTA-items {
	padding: 0 10px;
	height: 140px;
}

#html-container ul.CTA-items li {
	display: block;
	float: left;
	width: 25%;
}

#new-car-content ul.CTA-items li {
	width: 20%;
}

#html-container ul.CTA-items li img {
	border-radius: 15px;
	box-shadow: 0 10px 20px #bbb;
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	-ms-transform: scale(0.9);
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
	
}

#new-car-content ul.CTA-items li img {
	border-radius: 3px;
}

#html-container ul.CTA-items li:hover img {
	-webkit-transform: /* rotate(5deg) */ scale(1);
	-moz-transform: /* rotate(5deg) */ scale(1);
	-o-transform: /* rotate(5deg) */ scale(1);
	-ms-transform: /* rotate(5deg) */ scale(1);
	box-shadow: 0 5px 20px #333;
}

#html-container #new-cars-slideshow-wrapper {
	width: 870px;
	margin: auto;
	position: relative;
}


#html-container #new-cars-slideshow-wrapper .slide-control {
	position: absolute;
	top: 35%;
	cursor: pointer;
	width: 32px;
	height: 32px;
	z-index: 20;
}

#html-container #new-cars-slideshow-wrapper .prev-slide {
	left: 10px;
	background: url('images/homepage/prev_slide_3.png') no-repeat 0 0;
}

#html-container #new-cars-slideshow-wrapper .next-slide {
	right: 10px;
	background: url('images/homepage/next_slide_3.png') no-repeat 0 0;
}

#html-container #new-cars-slideshow {
	position: relative;
	height: 120px;
	width: 770px;
	margin: auto;
	overflow: hidden;
	border: 1px solid #ccc;
}

#html-container #new-cars-slideshow ul {
	width: 5000px;
	position: relative;
	padding: 0;
	margin: 0;
}

#html-container #new-cars-slideshow li {
	float: left;
	width: 155px;
	position: relative;
	text-align: center;
	height: 120px;
}

#html-container #new-cars-slideshow li div.new-car-title {
	position: absolute; /* so z-index will work */
	width: 80%;
	top: 0;
	margin: auto;
	left: 10%;
	z-index: 5;
	background: #444;
	padding-top: 3px;
	height: 22px;
	text-shadow: -1px -1px 0 #000;
	font-size: 120%;
	color: #fff;
	margin-top: -25px;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	box-shadow: 0 0 15px #ccc;
}
#html-container #new-cars-slideshow li > a {
	text-decoration: none;
}

#html-container #new-cars-slideshow li img {
	position: absolute;
	left: 0;
	top: 30%;
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-o-transform: scale(0.8);
	-ms-transform: scale(0.8);
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}
#html-container #new-cars-slideshow li:hover img {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
}

#html-container #new-cars-slideshow li:hover div.new-car-title {
	margin-top: 0;
}

/*
#html-container #blurb {
	width: 80%;
	margin-auto;
	font-size: 150%;
	background-color: #333;
	text-shadow: 1px 1px 0 #000;
	color: #ddd;
	border-radius: 5px;
	box-shadow: 0 2px 10px #555, 0 10px 20px #000 inset;
	margin-top: 35px;
	margin-bottom: 10px;
}
*/

#html-container #blurb {
	width: 820px;
	margin: auto;
	font-size: 160%;
	margin-bottom: 20px;
}

#html-container #facebook-banner {
	margin-top: 30px;
	padding-bottom: 15px;
	text-align: center;
}

#html-container #facebook-banner a {
	display: block;
	height: 50px;
	overflow: hidden;
}

#html-container #facebook-banner a img {
	margin-top: 10px;
	opacity: 0.4;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}

#html-container #facebook-banner a:hover img {
	margin-top: 0;
	opacity: 1;
}

#html-container #location-map {
	padding-bottom: 15px;
	clear: both;
	height: 250px;
	font-size: 130%;
}

#location-map > div {
	float: left;
}

#location-map .contact, #location-map .hours {
	width: 245px;
	padding-top: 25px;
}

#location-map .contact {
	padding-left: 30px;
	padding-top: 40px;
	width: 215px;
	font-size: 120%;
}

#location-map .hours table td.days,
#location-map .contact td.dept {
	padding-right: 10px;
}

#location-map .contact td.dept {
	color: #C00;
	text-align: right;
}


#location-map .contact tr td.dept {
	color: #000;
	padding-bottom: 3px;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}

#location-map .contact tr:hover td.dept {
	color: #C00;
}

#location-map .contact tr td.phone-num {
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}

#location-map .contact tr:hover td.phone-num {
	padding-left: 20px;
	color: #c00;
}

#location-map #map-image {
	width: 370px;
	text-align: center;
}


#footer {
	height: 30px;
}

#footer li {
	width: 115px;
	margin-bottom: 3px;
}

#footer li a {
	display: block;
	width: 100%;
}

#footer li > ul {
	margin-top: 5px;
}

#footer ul.page-list > li a {
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}

#footer ul.page-list > li a:hover {
	color: #f00;
}

#footer ul.page-list > li > ul > li {
	background: transparent;
	border: none;
}

#footer ul.page-list > li > ul > li a {
	color: #aaa;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}

#footer ul.page-list > li > ul > li a:hover {
	color: #fff;
}