﻿/*******************************************************
##Generic CSS Classes
********************************************************/
*.left { float : left; }
*.right { float : right; }
*.none { display : none; }
*.hidden { visibility : hidden; }
*.inline { display : inline; }
*.block { display : block; }
*.error { color : #ff0000; }
p.error { font-weight : bold; margin-top : 5px; }
*.clear { clear : both; }
/*******************************************************/




/*******************************************************
Uvl Container Form Styles
********************************************************/
form.uvl
{
    width : 794px;
    background-image : url(/assets/citygate/images/uvl/uvl_tile.gif);
    background-repeat : repeat-y;
    background-position : left top;
}

form.uvl img
{
    border : none;
}

img.uvl.header
{
    margin : 0 0 -2px 0;
}

img.uvl.footer
{
    display : block;
    clear : both;
    margin : 0;
}
/********************************************************/




/*******************************************************
Uvl Search Panel Styles
********************************************************/
div.searchpanel
{
    margin : 0;
    padding : 0;
    height : 166px;
    overflow : visible;
    background-repeat : no-repeat;
    background-position : left top;
    font-size : 9px;
}

div.searchpanel.car
{
    background-image : url(/assets/citygate/images/uvl/find_car_header.jpg);
}

div.searchpanel.van
{
    background-image : url(/assets/citygate/images/uvl/find_van_header.jpg);
}

div.searchpanel img
{
    vertical-align : middle;
}

div.searchpanel fieldset
{
    border-width : 0px;
    margin : 40px 0 0 20px;
    padding : 0;
    float : left;
}

div.searchpanel fieldset.panel.search
{
    width : 595px;
}

div.searchpanel fieldset.panel.locationsearch
{
    width : 135px;
}

div.searchpanel legend
{
    display : none;
}

div.searchpanel label
{
    display : block;
    margin-bottom : 2px;
    font-weight : bold;
}

div.searchpanel select,
div.searchpanel input
{
    color : #476B07;
    width : 100px;
    font-size : 10px;
    font-weight : bold;
    font-family : Verdana, Arial, Helvetica, Sans-Serif;
    border : 1px solid #7F9DB9;
}

div.searchpanel select.range
{
    width : 210px;
}

div.searchpanel fieldset.panel.locationsearch select
{
    width : 135px;
}

div.searchpanel fieldset.panel.locationsearch input
{
    width : 90px;
    float : left;
}

div.searchpanel fieldset.panel.locationsearch input.button.submit
{
    width : auto;
    height : auto;
    margin-left : 3px;
    margin-top : -4px;
    margin-bottom : -3px;
}

div.searchpanel div
{
    margin-top : 10px;
    margin-right : 10px;
    float : left;
}

div.searchpanel fieldset.panel.buttons
{
    clear : left;
    margin : -22px 0 0 455px;
    z-index : 10;
}

div.searchpanel img.button
{
    width : auto;
    height : auto;
}

div.searchpanel div.finder
{
    margin-top : 3px;
    margin-left : 18px;
}
/********************************************************/


/*******************************************************
Uvl Results Panel Styles
********************************************************/
div.resultspanel
{
    clear : left;
    float : left;
    margin : 10px 0 0 15px;
    width : 595px;
}

div.resultspanel img
{
    border-width : 0px;
}

div.resultspanel div.panel,
div.resultspanel fieldset.panel
{
    border-width : 0;
    float : left;
}

div.resultspanel div.panel.information
{
    margin-top : 2px;
    width : 210px;
}

div.resultspanel div.panel.pages
{
    text-align : center;
    margin-top : 2px;
    width : 160px;
}

div.resultspanel fieldset.panel.configuration
{
    padding : 0;
    float : right;
}

div.resultspanel fieldset.panel.configuration select,
div.resultspanel fieldset.panel.configuration input
{
    color : #476B07;
    width : auto;
    font-size : 10px;
    font-weight : bold;
    font-family : Verdana, Arial, Helvetica, Sans-Serif;
    border : 1px solid #7F9DB9;
}

div.resultspanel fieldset.panel.configuration div
{
    margin : 0;
}

div.resultspanel fieldset.panel.configuration label
{
    display : block;
    float : left;
    margin-right : 5px;
    margin-top : 3px;
    margin-left : 5px;
}

div.resultspanel div.pagination
{
    margin : 0;
    color : #476B07;
    font-weight : bold;
    font-size : 9px;
}

div.resultspanel div.pagination a
{
    color : #476B07;
    text-decoration : none;
}

div.resultspanel div.pagination a.page
{
    padding : 0 2px 0 2px;
    font-weight : normal;
    font-size : 11px;
}

div.resultspanel div.pagination a:hover
{
    text-decoration : underline;
}

div.resultspanel div.pagination a.active
{
    font-weight : bold;
    color : #999;
}


div.resultspanel div.results
{
    padding-top : 5px;
    display : block;
    clear : both;
}

div.results div.item
{
    border-bottom : 1px solid #999;
    margin-top : 5px;
    clear : both;
    height : 65px;
}
div.results div.item a
{
    float : left;
    display : block;
}
div.results div.item img.thumbnail
{
    float : left;
    width : 90px;
    height : 60px;
    border : none;
}

div.results div.item div.details
{
    float : left;
    margin-left : 2px;
    width : 500px;
}

div.results div.item div.title
{
    padding : 4px 10px 0 10px;
    background-image : url(/assets/citygate/images/uvl/cartitle_bar_bg.jpg);
    background-repeat : no-repeat;
    background-position : left top;   
    font-weight : bold;
    font-size : 10px;
    height : 23px;
}

div.results div.item div.title div.distance
{
    float : right;
    font-size : 9px;
    color : #476B07;
    text-decoration : none;
}

div.results div.item div.title a
{
    float : left;
    display : block;
    color : #476B07;
    text-decoration : none;
}

div.results div.item div.title a:hover
{
    text-decoration : underline;
}

div.results div.item p
{
    color : #476B07;
    margin-left : 10px;
}

div.results div.item div.details ul
{
    color : #476B07;
    margin : 5px 0 0 10px;
    font-weight : bold;
    padding : 0;
    list-style : none;
    font-size : 9px;
}

div.results div.item ul li
{
    float : left;
    height : 15px;
    padding : 0px;
    padding-top : 4px;
    white-space : nowrap;
}

div.resultspanel.instock div.results div.item ul li,
div.resultspanel.newstock div.results div.item ul li
{
    width : 75px;
}

div.resultspanel.presalestock div.results div.item ul li
{
    width : 72px;
}

div.resultspanel.reducedstock div.results div.item ul li
{
    width : 75px;
}

div.results div.item ul li.availabilitydate,
div.results div.item ul li.oldprice
{
    color : #ff0000;
}

div.results div.item ul li.oldprice
{
    font-size : 11px;
    text-decoration : line-through;
}

div.resultspanel div.results div.item ul li.fueltype
{
    width : 55px;
}

div.resultspanel div.results div.item ul li.transmission
{
    width : 65px;
    display : none;
}

div.resultspanel.instock div.results div.item ul li.oldprice,
div.resultspanel.instock div.results div.item ul li.saving,
div.resultspanel.reducedstock div.results div.item ul li.oldprice,
div.resultspanel.reducedstock div.results div.item ul li.saving
{
    width : 60px;
}

div.resultspanel.presalestock div.results div.item ul li.availabilitydate
{
    width : 135px;
}

div.resultspanel.instock div.results div.item ul li.availabilitydate,
div.resultspanel.newstock div.results div.item ul li.availabilitydate,
div.resultspanel.reducedstock div.results div.item ul li.availabilitydate,
div.resultspanel.newstock div.results div.item ul li.oldprice,
div.resultspanel.presalestock div.results div.item ul li.oldprice,
div.resultspanel.newstock div.results div.item ul li.saving,
div.resultspanel.presalestock div.results div.item ul li.saving,
div.resultspanel.reducedstock div.results div.item ul li.transmission,
div.resultspanel.presalestock div.results div.item ul li.transmission
{
    display : none;
}

div.results div.item ul li.price
{
    padding-top : 0;
    font-size : 13px;
    text-align : right;
}
/********************************************************/


/*******************************************************
Uvl Progress Panel Styles
********************************************************/
div.progresspanel
{
    position : absolute;
    top : 350px;
    left : 400px;
    float : left;
    z-index : 10;
}
/********************************************************/


/*******************************************************
Uvl No Results Panel Styles
********************************************************/
div.noresultspanel { margin-left : 20px; }

div.noresultspanel h1 { margin : 10px 0 5px 0;}
/********************************************************/


/*******************************************************
Uvl Timeout Panel Styles
********************************************************/
div.timeoutpanel
{
    padding : 5px 0 0 20px;
    width : 794px;
    background-image : url(/assets/citygate/images/uvl/uvl_header.gif);
    background-repeat : no-repeat;
    background-position : left top;
}
/********************************************************/



/*******************************************************
Uvl Random Panel Styles
********************************************************/
div.randompanel
{
    float : right;
    width : 177px;
    margin-right : 3px;
    text-align : center;
    clear : right;
}

div.randompanel div.list
{
    background-image : url(/assets/citygate/images/uvl/random_tile.gif);
    background-repeat : repeat-y;
}

div.randompanel div.list div.header
{
    background-image : url(/assets/citygate/images/uvl/random_hdr.gif);
    background-repeat : no-repeat;
    background-position : center top;
    padding-top : 6px;
}

div.randompanel div.list div.header h3
{
    color : #ffffff;
    margin-bottom : 5px;
}

div.randompanel div.list div.footer
{
    background-image : url(/assets/citygate/images/uvl/random_ftr.gif);
    background-repeat : no-repeat;
    background-position : center bottom;
    height : 15px;
}

div.randompanel div.list div.content div.item
{
    width : 137px;
    height : 107px;
    padding : 5px;
    margin : 0 15px 0 15px;
    background-image : url(/assets/citygate/images/uvl/random_itm.jpg);
    background-repeat : no-repeat;
    font-weight : bold;
}

div.randompanel div.list div.content div.item a
{
    display : block;
    text-decoration : none;
    color : #ffffff;
}
div.randompanel div.list div.content div.item a span
{
	display : block;
	width : 100%;
}

div.randompanel div.list div.content div.item a img
{
    display : block;
    margin : 5px auto;
    width : 90px;
    height : 60px;
}
/********************************************************/




/*******************************************************
Uvl Vehicle Panel Styles
********************************************************/
div.vehiclepanel
{
    width : 794px;
    background : none;
}

div.vehiclepanel div.header
{
    background-image : url(/assets/citygate/images/carview_header.jpg);
    background-repeat : no-repeat;
    height : 35px;  
}

div.vehiclepanel div.header h1
{
    font-size : 14px;
	font-weight : bold;
	color : #476B07;
	padding : 13px 15px 6px 15px;
}

div.vehiclepanel div.column
{
    float : left;
}

div.vehiclepanel div.column.one
{
    margin-left : 15px;
    width : 495px;
}

div.vehiclepanel div.column.two
{
    margin-top : 5px;
    margin-left : 15px;
    width : 257px;
}

div.vehiclepanel ul.vehicle
{
    padding : 0;
    margin : 0;
    height : 35px;
    background-image : url(/assets/citygate/images/uvl/carview_footer.gif);
    background-position : left top;
    background-repeat : no-repeat;
    list-style : none;
}

div.vehiclepanel ul.vehicle li
{
    width : 100px;
    float : left;
    text-align : center;   
    font-weight : bold;
    font-size : 11px;
    color : #666;
    padding-top : 2px; 
}

div.vehiclepanel ul.vehicle li span
{
    display : block;
    font-size : 10px;
    font-weight : normal;
}

div.vehiclepanel ul.vehicle li.price
{
    width : 85px;
    padding-top : 6px;
    font-size : 16px;
    color : #fff;
}

div.vehiclepanel ul.vehicle li.price span {display : none;}


div.vehiclepanel div.buttons
{
   margin-left : 8px;
}

div.vehiclepanel div.buttons img
{
   display : block;
   float : left;
   margin-left : -2px;
}

div.vehiclepanel.van div.buttons input.wishlist
{
   display : none;
}

div.vehiclepanel div.vehicle
{
    margin-right : 10px;
}

div.vehiclepanel div.vehicle h2
{
    margin : 5px 0 5px 0; 
    font-size : 12px;  
}

div.vehiclepanel div.vehicle p
{
    font-size : 9px; 
}
/*******************************************************
Uvl Vehicle Panel Image Styles
********************************************************/
div.vehiclepanel div.images
{
    width : 495px;
    height : 330px;
}

div.vehiclepanel div.images div.thumbnails
{
    width : 495px;
    text-align : right;
    position : absolute;
    z-index : 2;
}

div.vehiclepanel div.images div.thumbnails img
{
    cursor : pointer;
    width : 90px;
    height : 60px;
    
    border : 1px solid #fff;
    border-top-width : 0px;
    border-right-width : 0px;
}

div.vehiclepanel div.images img#mainimage
{
    border-width : 0px;
    width : 495px;
    height : 330px;
}

div.vehiclepanel div.images div.thumbnails img.zoom
{
    position : absolute;
    border : none;
    display : block;
    top : 63px; 
    right : 5px;
    width: 14px;
    height: 14px;
}

div.vehiclepanel div.images div.thumbnails img.zoom.none
{
    display : none;
}

div.vehiclepanel div.images div.thumbnails img.zoom.one
{
    top : 3px;
}
/*********************************************************
Uvl Vehicle Panel Wish List Alert Styles
*********************************************************/
div.alert
{
    width :  250px;
    height : 100px;
    position : absolute;
    top : 330px;
    left : 315px;
    z-index : 10;   
    font-weight : bold;
    font-size : 12px;   
    background-color : #fff;
    border : 1px solid #999;
    border-right-width : 2px;
    border-bottom-width : 2px;
}

div.alert p
{
    margin : 0;
    padding : 10px;    
    color : #666;
    font-weight : bold;
    font-size : 12px;
}

div.alert p img
{
    margin : 0 5px 30px 0;
    text-align : left;
    float : left;
}

div.alert div.close
{
    padding : 3px;
    text-align : right;
    background-color : #eee;
    border : none;
    border-bottom : 1px solid #999;
}

div.alert div.close img
{
    border : none;
    cursor : pointer;
    text-align : right;
}
/********************************************************/


/*********************************************************
Lozenge Specific
*********************************************************/
div.lozenge
{
    background-position : left top;
    background-repeat : repeat-y;
    font-size : 10px;
    color : #fff;
}

div.lozenge strong {font-size : 13px; display : block;}

div.lozenge div.header
{
    background-position : left top;
    background-repeat : repeat-x; 
    height : 14px;
}

div.lozenge div.content
{
    padding : 0 15px 0 15px;
    clear : both;
    
    background-position : right top;
    background-repeat : repeat-y; 
}

div.lozenge div.footer
{
    background-position : left bottom;
    background-repeat : repeat-x; 
    height : 14px;
}
/********************************************************/


/*********************************************************
Lozenge Specific
*********************************************************/
div.green.lozenge
{
    margin : 9px 0 3px 0;    
    background-image : url(/assets/citygate/images/uvl/lozenge_left.gif);
    background-color : #71bd0e;
}
div.green.lozenge div.header {background-image : url(/assets/citygate/images/uvl/lozenge_top.gif);}
div.green.lozenge div.content {background-image : url(/assets/citygate/images/uvl/lozenge_right.gif);}
div.green.lozenge div.footer {background-image : url(/assets/citygate/images/uvl/lozenge_bottom.gif);}
/********************************************************/


/*********************************************************
Vehicle Compact Panel Styles
*********************************************************/
div.vehiclepanel.compact
{
    margin : 0 10px 0 10px;
    background : none;
}

div.vehiclepanel.compact div.header
{
    height : auto;
    background : none;
}

div.vehiclepanel.compact div.header h1
{
    padding : 0;
    margin : 0 0 5px 0;
}

div.vehiclepanel.compact div.column.one,
div.vehiclepanel.compact div.column.two,
div.vehiclepanel.compact div.column.three
{
    float : left;
    margin : 0;
    padding : 5px 10px 5px 10px;
    height : 145px; 
    border-right : 1px dashed #ccc;
    overflow : hidden;
}

div.vehiclepanel.compact div.column.three
{
    overflow : auto;
}

div.vehiclepanel.compact div.column.one {width : 26.5%; border-left : 1px dashed #ccc;}

div.vehiclepanel.compact div.column.two {width : 24.5%;}

div.vehiclepanel.compact div.column.three {width : 38%; border-right-width : 0px;}

div.vehiclepanel.compact div.images
{
    width : auto;
    height : auto;
}

div.vehiclepanel.compact div.buttons
{
    width : auto;
    height : 20px;
    clear : both;
    margin : 3px 0 0 0;
}

div.vehiclepanel.compact div.buttons img {border : none; margin-right : 10px;}

div.vehiclepanel.compact div.vehicle {padding : 0; background : none;}

div.vehiclepanel.compact div.vehicle h2 {padding-top : 0px; font-size : 12px;}

div.vehiclepanel.compact ul.vehicle
{
    height : auto;
    background : none;
}

div.vehiclepanel.compact ul.vehicle li
{
    width : 100%;
    text-align : left;
}

div.vehiclepanel.compact ul.vehicle li span
{
    display : inline-block;
    width : 80px;
    float : left;
    font-size : 10px;
    font-weight : normal;
}

div.vehiclepanel.compact ul.vehicle li.price {font-size : 12px; color : #666;}
div.vehiclepanel.compact ul.vehicle li.price span {display : inline;}
/********************************************************/
