﻿/**********************************************************************************
* 
* © 2008 Ecliptic Technologies, Inc. - All Rights Reserved
* Unauthorized use or reproduction of this product is strictly prohibited by law.
* Website: www.ecliptictech.com
* Email: info@ecliptictech.com
*
* Name: layout.css
* Description: Layout CSS file for the Autos & Trucks website
*
***********************************************************************************/

/* Auxiliary style sheets
----------------------------------------------------------------------------------*/

@import url(type.css);
@import url(forms.css);
@import url(lightbox.css);


/* Body 
----------------------------------------------------------------------------------*/

*
    {
    margin:0px;
    padding:0px;
    }

body
	{
	background:#e20315 url(/sitegraphics/autostruck-sitebg.gif) repeat-x;
	}


/* Images 
----------------------------------------------------------------------------------*/

img
    {
	border:none;
    }

a.nostyle, a.nostyle:hover
    {
    background:none;
    border:none;
    }
    
a.nostylecatalog, a.nostylecatalog:hover
    {
    background:none;
    border:none;
    float:left;
    margin:0px 50px 20px 0px;
    }
    
a.viewed, a.viewed:hover
    {
    background:none;
    border:none;
    float:left;
    margin:15px 20px 0px 0px;
    }

.imageleft
    {
    float:left;
    margin:0px 1em 1em 0px;
    clear:both;
    }

.imageright
    {
    float:right;
    margin:0px 0px 1em 1em;
    clear:both;
    }

.image-container
    {
    float:left;
    width:100%;
    clear:both;
    }

.image-sticky
    {
    float:left;
    margin:0px 1em 1em 0px;
    }

.imageleft img, .imageright img
    {
    }

.imagefull
    {    
    display:block;
    margin:0px 0px 1em 0px;
    clear:both;
    }

.imagecenter
    {
    display:block;
    margin:0px auto;
    }


/* Container
----------------------------------------------------------------------------------*/

#container
	{
	margin:0px auto;
	width:1000px;
	}


/* Masthead
----------------------------------------------------------------------------------*/

#masthead
    {
    float:left;
    width:1000px;
    height:13px;
    }

#logo
    {
	float:right;
	margin:0px 20px 0px 0px;
    }


/* Main background
----------------------------------------------------------------------------------*/

#main
    {
    float:left;
    width:970px;
    padding:5px 15px 15px 15px;
    background:#ffffff url(/sitegraphics/autostruck-contentbg.gif) repeat-x;
    }


/* Marquee
----------------------------------------------------------------------------------*/

#marquee
    {
    float:right;
    width:970px;
    margin:0px 0px 1em 0px;

    }


/* Page title
----------------------------------------------------------------------------------*/

#pagetitle
    {
    float:left;
    width:970px;
    margin:0px 0px 0em 0px;
    }


/* Sidepane
----------------------------------------------------------------------------------*/

#sidepane
    {
    float:left;
    width:165px;
    margin:0px -1px 0px 0px;
    padding:0px 15px 0px 0px;
    border-right:1px solid #b0b0b0;
    }


/* Navigation background
----------------------------------------------------------------------------------*/

#nav
    {
    float:left;
    width:100%;
    margin:0px 0px 5px 0px;
    padding:8px 0px 8px 0px;
    background:#660000;
    }


/* Contact information
----------------------------------------------------------------------------------*/

#contactinfo
    {
    /*float:left;
    width:800px;
    height:27px;
    margin:0em 0px 0px 0px;
    padding:3px 0px 0px 0px;
    background:url(/sitegraphics/trs-contactinfobg.gif) repeat-y;
    border-right:1px solid #000000;
    border-left:1px solid #000000;*/
    }


/* Banner
----------------------------------------------------------------------------------*/

#banner
    {
    }


/* Flash animation
----------------------------------------------------------------------------------*/

#flashanimation
    {
    }


/* Vehicle search
----------------------------------------------------------------------------------*/

#vehiclesearch
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    padding:0px 0px 1em 0px;
    border-bottom:1px dotted #b0b0b0;
    }

#vehiclesearch .dropdown-full
    {
    float:left;
    width:150px;
    margin:0px 0px 1em 0px;
    clear:both;
    }

#vehiclesearch-shortdropdowns
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    clear:both;
    }

#vehiclesearch .dropdown-short
    {
    width:68px;
    }

#vehiclesearch .dropdown-full, #vehiclesearch .dropdown-short
    {    
    padding:1px;
    background:#e5e5e5;
    border:1px solid #808080;
    }

#vehiclesearch .checkbox
    {
    float:left;
    width:68px;
    margin:0px 0px 1em 0px;
    }

#vehiclesearch .checkbox input
    {
    margin:0px 5px 0em 0px;
    }


/* Content
----------------------------------------------------------------------------------*/

#content-home-left
	{
	float:left;
	width:329px;
	margin:0em 0px 0px 0px;
	padding:0px 20px 0px 20px;
	border-left:1px solid #b0b0b0;
	}

#content-home-right
	{
	float:left;
	width:400px;
	margin:0em 0px 0px 0px;
	padding:0px 0px 0px 20px;
	}

#content
	{
	float:left;
	width:749px;
	margin:0em 0px 0px 0px;
	padding:0px 20px 0px 20px;
	border-left:1px solid #b0b0b0;
	}

.box
    {
    width:345px;
    margin:0px 0px 1em 0px;
    }

.box-top
    {
    width:345px;
    height:6px;
    background:url(/sitegraphics/autostruck-box-top.gif) no-repeat;
    }

.box-main
    {
    width:321px;
    padding:6px 12px;
    background:url(/sitegraphics/autostruck-box-main.gif) repeat-y;
    }

.box-bottom
    {
    width:345px;
    height:6px;
    background:url(/sitegraphics/autostruck-box-bottom.gif) no-repeat;
    }

.box02
    {
    width:400px;
    margin:0px 0px 1em 0px;
    }

.box02 .box-top
    {
    width:400px;
    height:6px;
    background:url(/sitegraphics/autostruck-box02-top.gif) no-repeat;
    }

.box02 .box-main
    {
    width:376px;
    padding:6px 12px;
    background:url(/sitegraphics/autostruck-box02-main.gif) repeat-y;
    }

.box02 .box-bottom
    {
    width:400px;
    height:6px;
    background:url(/sitegraphics/autostruck-box02-bottom.gif) no-repeat;
    }


/* Used car category search
----------------------------------------------------------------------------------*/

#usedcars
    {
    margin:0px 0px 1em 0px;
    }

#usedcars table
    {
    width:100%;    
    }

#usedcars table td
    {
    width:33%;
    }


/* Featured vehicle
----------------------------------------------------------------------------------*/

#featuredvehicle
    {
    margin:0px 0px 1em 0px;
    }

.featuredvehicle-image
    {
    margin:0px 0px 0.2em 0px;
    }


/* Vehicle listing
----------------------------------------------------------------------------------*/

#vehiclelisting table, #vehiclelisting table td
    {
    /*border:1px solid #808080;
    border-collapse:collapse;*/
    }


/* Vehicle detail
----------------------------------------------------------------------------------*/

#vehicledetail
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    }

#vehicledetail-dealer
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    padding:0px 0px 1em 0px;
    border-bottom:1px dotted #b0b0b0;
    }

#vehicledetail-dealer-image, #vehicledetail-dealer-address, #vehicledetail-dealer-phone, #vehicledetail-dealer-links, #vehicledetail-dealer-print
    {
    float:left;
    }

#vehicledetail-dealer-image
    {
    width:190px;
    padding:0px 10px 0px 0px;
    }

#vehicledetail-dealer-address, #vehicledetail-dealer-phone, #vehicledetail-dealer-links, #vehicledetail-dealer-print
    {
    width:126px;
    padding:0px 10px 0px 0px;
    }

#vehicledetail-dealer-image
    {
    }

#vehicledetail-dealer-image img
    {
    border:1px solid #b0b0b0;
    }

#vehicledetail-main
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    }

#vehicledetail-main-image, #vehicledetail-main-info
    {
    float:left;
    }

#vehicledetail-main-image
    {
    width:480px;
    padding:0px 20px 0px 0px;
    clear:right;
    }

#vehicledetail-main-image #imageview
    {
    width:480px;
    margin:0px 0px 1em 0px;
    }

#vehicledetail-main-image #imageview img
    {
    max-width:480px;
    }

/* star hack for IE6's special needs */

* html #vehicledetail-main-image #imageview img
    {
    }

#vehicledetail-main-image #scroll
    {
    width:480px;
    height:110px;
    overflow:auto;
    overflow-x:auto;
    overflow-y:hidden;
    }

#vehicledetail-main-image #thumbnails
    {
    width:auto;
    height:100px;
    }

#vehicledetail-main-image #thumbnails img
    {
    float:left;
    margin:0px 10px 0px 0px;
    border:1px solid #808080;
    }

/* star hack for IE6's special needs */

* html #vehicledetail-main-image #thumbnails img
    {
    margin:0px 5px 0px 0px;
    }

#vehicledetail-main-image #thumbnails a:hover img
    {
    border:1px solid #000000;
    }

#vehicledetail-main-image #thumbnails a
    {
    border:none;
    }

#vehicledetail-main-info
    {
    float:left;
    width:200px;
    }

#vehicledetail-form .textbox
    {
    display:block;
    width:200px;
    margin:0px 0px 1em 0px;
    padding:1px;
    background:#e5e5e5;
    border:1px solid #808080;
    }
    
#vehiclepostform .textbox
    {
    display:block;
    width:200px;
    margin:0px 0px 1em 0px;
    padding:1px;
    background:#e5e5e5;
    border:1px solid #808080;
    }
    
#vehiclepostform .dropdown-full
    {
    float:left;
    width:255px;
    margin:0px 0px 1em 0px;
    clear:both;
    background:#e5e5e5;
    }
    
#siteform .textbox
    {
    display:block;
    width:200px;
    margin:0px 0px 1em 0px;
    padding:1px;
    background:#e5e5e5;
    border:1px solid #808080;
    }    

.textboxaddedit
    {
    display:block;
    width:200px;
    margin:0px 0px .2em 0px;
    padding:1px;
    background:#e5e5e5;
    border:1px solid #808080;
    }

#vehicledetail-form textarea
	{
	display:block;
	margin:0px 0px 1em 0px;
	padding:1px;
	width:300px;
	height:150px;
	background:#e5e5e5;
	border:1px solid #808080;
	}

#vehicledetail-form .button
	{
	margin:0px 8px 1.8em 0px;
	padding:0px 3px;
	}


/* Dealer profile
----------------------------------------------------------------------------------*/

#dealerprofile
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    }

#dealerprofile-header
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    }

#dealerprofile-header-logo, #dealerprofile-header-info
    {
    float:left;
    width:auto;
    }

#dealerprofile-header-logo
    {
    margin:0px 1em 0px 0px;
    }

#dealerprofile-header-logo img
    {
    border:1px solid #b0b0b0;
    }

#dealerprofile-main
    {
    float:left;
    width:100%;
    margin:0px 0px 1em 0px;
    }

#dealerprofile-main-image, #dealerprofile-main-info
    {
    float:left;
    }

#dealerprofile-main-image
    {
    width:480px;
    }

#dealerprofile-main-info
    {
    width:269px;
    }

#dealerprofile label
    {
    display:block;
    margin:0px 0px 0.2em 0px;
    }

#dealerprofile .textbox
    {
    display:block;
    width:200px;
    margin:0px 0px 1em 0px;
    padding:1px;
    background:#e5e5e5;
    border:1px solid #808080;
    }

.editor
    {
    display:block;
    margin:0px 0px 1em 0px;
    }

	
/* Dealer Formatting
----------------------------------------------------------------------------------*/

#dealerlogin label
    {
    display:block;
    margin:0px 0px 0.2em 0px;
    }

#dealerlogin .textbox
    {
    display:block;
    width:200px;
    margin:0px 0px 1em 0px;
    padding:1px;
    background:#e5e5e5;
    border:1px solid #808080;
    }

#dealerexport
	{
	float:left;
	width:300px;
	text-align:right;
	}
	
/*#dealerprofile
	{
	float:left;
	width:350px;
	text-align:right;
	}*/
	
#fulllength
	{
	float:left;
	width:100%;
	}
	
.text
	{
	margin:0px 0px 5px 0px;
	}


/* YouTube video
----------------------------------------------------------------------------------*/

#content object
    {
    display:block;
    margin:0px 0px 1em 0px;
    }


/* Products
----------------------------------------------------------------------------------*/

#products
    {
    float:left;
    width:100%;
    margin:1em 0px 0px 0px;
    padding:1em 0px 0px 0px;
    border-top:1px dotted #000000;
    clear:both;
    }


/* Gallery container and thumbnails
----------------------------------------------------------------------------------*/

#gallery
	{
	float:left;
	width:810px;
	margin:1em 0px 0px 0px;
	padding:1em 0px 0px 0px;
	border-top: solid 1px #3366cc;
	}

#lightbox_container
    {
    padding:0px 0px 1em 0px;
    }

#lightbox_container img
    {
    margin:0px 10px 10px 0px;
    background:none;
    border:1px solid #3366cc;
    }

#lightbox_container a
    {
    background:none;
    border:none;
    }


/* Google map
----------------------------------------------------------------------------------*/

#map
    {
    float:right;
    width:402px;
    margin:0px 0px 1em 1em;
    clear:both;
    }

#map iframe
    {
    width:400px;
    height:325px;
    margin:0px 0px 0.2em 0px;
    border:1px solid #2f378f;
    }    

#map small
    {
    font:0.6875em Verdana, Arial, Helveticam sans-serif;
    line-height:1.8em;
    }


/* Footer
----------------------------------------------------------------------------------*/

#footer
    {
    float:left;
    width:970px;
    padding:16px 15px 10px 15px; 
    background:#ffffff;
    border-top:1px dotted #b0b0b0;
    }

#footer-nav
    {
    float:left;
    width:auto;
    margin:0px 0px 1em 0px;
    clear:both;
    }

#copyright
    {
    float:left;
    clear:both;
    }


/* Horizontal rules
----------------------------------------------------------------------------------*/

hr
	{
	display:none;
	}

.hr
	{
	margin:0px 0px 1em 0px;
	border-top:1px dotted #000000;
	}


/* Miscellaneous classes
----------------------------------------------------------------------------------*/

.dealeritem
	{
	height:60px;
	width:230px;
	}
	
.dealeritem a
	{
	border-bottom:none;
	}
	
.dealerdiv
	{
	float:left;
	width:33%;
	}
	
.label
	{
	display:inline;
	}
	
.rightalign
	{
	text-align:right;
	}

/* Pricing Section(GetStarted.aspx) */	
#pricingleft
	{
	float:left;
	width:49%;
	}
	
#pricingleft
	{
	float:right;
	width:49%;
	}
	
#imgsource
	{
    border: 1px solid #000000;
	}
	
.form_button
    {	
		padding:2px 2px;
		background:#660000;
		border:3px solid #4D0006;
		cursor:pointer;
		width:200px;
    }
    
.detailheader
	{
	display:block;
	width:480px;
	}
	
.detailprice
	{
	float:right;
	}
	
/* Helpdiv
--------------------------------------------------------------------------------*/

ul.helpdivlist img
    {
    vertical-align:middle;    
    }