/********************** reset default browser style **********************/
/* Reset unneeded margins and paddings */
html, body, form, fieldset { margin: 0; padding: 0; }
/* Vertical margins */ 
h1, h2, h3, h4, h5, h6, p { margin: 1em 0 0 0; padding: 0; }		/* top */
ul, ol, dl { margin: 0 0 1em; padding: 0; }										 /* bottom */
pre, blockquote, address { margin: 1em 0; padding: 0; }				 /* top & bottom */  
li { margin: 0; padding: 0; }									/* none */
/* Left margin */
li, dd, blockquote { margin-left: 1em; }
/* Page colors (background and text) */
body { background: white; color: black; }
/* Page main font */
h1, h2, h3, h4, h5, h6, p, li, dd, dt, th, td, input, textarea, select, label { font: 11px/1.2em Verdana, Tahoma, Arial, sans-serif; }
h1 { font-size: 16px; font-weight: bold; }
h2 { font-size: 14px; font-weight: bold; }
h3 { font-size: 12px; font-weight: bold; }
/* Links: underlined only when hovered */
a { text-decoration: none; }
a:hover { text-decoration: underline; }
/* Images without borders when used as links */
a img { border: 0; }
/* Labels have 'hand' as mouse pointer */
label { cursor: pointer; }
/********************** /reset default browser style *********************/
body { background: #003145 }
#container { margin: 0 auto; width: 760px; }
#header { background: white;}
	#logo { background: white; }
		img#suzukiLogo { float: left; }
		div#dealer { float: left; padding: 10px 0 0 0; text-align: right; height: 50px; width: 560px; }
		div#dealer p { font-size: 10px; margin: 0; color: gray; }
		img#suzukiLogo { float: left; }
/********Menu**********/
#menu { border: 1px solid white; background: gray; height: 20px;}
#nav, #nav ul { padding: 0; margin: 0; list-style: none; }
#nav, #nav li { padding: 0; margin: 0; }
#nav a { display: block; padding: 3px; text-decoration: none; font: italic 12px/1.2em Verdana, Tahoma, Arial, sans-serif; }
#nav li { float: left; width: 107px; background: rgb(78,78,78); /* width needed or else Opera goes nuts */ border-right: 1px solid white;}
#nav li a { color: white; }
#nav li.bgGray { background: gray; }
#nav li a:hover { background: #febe01; }
#nav li ul { /* second-level lists */ position: absolute; border-bottom: 1px solid white; background: #febe01; width: 10em; left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */}
#nav li ul li { width: 100%; }
#nav li ul li a { background: #febe01; color: black; font-weight: bold; border-right: 1px solid white; border-left: 1px solid white; border-top: 1px solid white;}
#nav li ul li a:hover { background: #fee6a0; }
#nav li ul ul { /* third-and-above-level lists */ margin: -21px 0 0 108px; -moz-opacity: 0.9; filter: alpha(opacity=90); }
#nav li ul li ul { width: 100px; } /* IE7 fix */
#nav li ul li li a { width: 220px; padding: 0 10px; }
#nav li ul ul li a:hover { background: #60bdf3; }
#nav li:hover ul ul, #nav li.sfhover ul ul { left: -999em; }
#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul { /* lists nested under hovered list items */ left: auto; }
#content { clear: left; color: #ccc; }
/********body**********/
#body { background: white; padding: 10px 10px 30px 10px; }
	/*submenu*/ 
	table#submenu { width: 100%; margin-bottom: 10px; }
	table#submenu td.priceBox { width: 230px; /*220px;*/ color: gray; }
	table#submenu td.priceBox  #new { margin-left: 3px; color: red; font-weight: bold; font-size: 13px; }
	table#submenu td.priceBox  #old { text-decoration: line-through; }
	table#submenu td.priceBox div { padding: 5px; border-top: 7px solid gray; border-left: 1px solid gray; border-right: 1px solid gray; border-bottom: 1px solid gray; }	
	table#submenu td.priceBox div a { font: 9px Verdana, Tahoma, Arial, sans-serif; color: gray; }
	#body ul#vehicleMenu { background: gray; padding: 2px; }
	#body ul#vehicleMenu li { background: gray; display: inline; color: white; }
	#body ul#vehicleMenu li a { color: white; }
	#body ul#vehicleMenu li a.sel { text-decoration: underline; }
	h2#vehicleLogo { font-weight: bold; margin-bottom: 5px;}
	/*overview*/	
	#pickColor { margin-top: 5px; }
	a.colorThumb { float: left; display: block; margin-right: 5px; width: 40px; height: 20px; border: 1px solid navajowhite;}
	a.colorThumb span { display: block; width: 20px; height: 20px; cursor: pointer; }
	p#shortIntro { padding: 10px 0; color: gray; border-top: 1px dashed gray; width: 600px; }
	img#bigImg { float: left; }
	div#rightBanner { float: right; width: 140px; padding: 5px; border-top: 7px solid gray; border-left: 1px solid gray; border-right: 1px solid gray; border-bottom: 1px solid gray; text-align: center; color: gray; }
		div#rightBanner p { font-size: 10px; padding-bottom: 3px; }
	#body h2 { font-size: 12px; }
	#body p a { color: gray; font-weight: bold; }
	#body a.comment { color: black; font: 11px/1.2em Verdana, Tahoma, Arial, sans-serif; }
	#detailsComment { margin: 20px 0 0 20px; }
	#featuresComment { margin-left: 30px; }
	/*index page*/
	table#prodIndex { border-spacing: 15px; }
	table#prodIndex td.category { padding-right: 10px; font: bold italic 12px/1.2em Arial, Verdana, Tahoma, sans-serif; }
  table#prodIndex td { padding: 1px; width: 90px; }
  table#prodIndex td.celImg { width: 90px; text-align: center; }
  /*.widthIm { border-left: 1px solid black; display: block; width: 90px; height: 80px; }*/
  .shiftImage { /* CROP IMAGE background-repeat:no-repeat; position:absolute; float: right; margin-top: -41px; padding-top: 8px; border: 1px dotted red; */
		border: 1px solid red; height: 90px; width: 122px; overflow:hidden;} 
.shiftImage img{ /*border: 1px dotted blue; margin-right: 15px;*/
		margin: 0 0 0 -1px; }
.shiftImage a{ border: 1px dotted green; }
 div.wim { margin-top:0; margin-right:15px; border: 1px dotted red; padding-top: 8px; background-repeat:no-repeat; position:absolute; }
		
 /* html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat
	html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat > div .bikes
	html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat > div .bikes > div .bikeSelect low-seat
	html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat > div .bikes > div .bikeSelect low-seat lightweight > div .bikeMainInfo > div .bikeImage
	html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat > div .bikes > div .bikeSelect low-seat lightweight > div .bikeMainInfo > div .bikeImage > div .shiftImage
	html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat > div .bikes > div .bikeSelect low-seat lightweight > div .bikeMainInfo > div .bikeImage > div .shiftImage > a > img
	html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat > div .bikes > div .bikeSelect low-seat lightweight > div .bikeMainInfo > div .bikeUnderImage > div .bikeName
	html > body > form #frmMain > div .background-top > div .background-bottom > div #module > div .panel > div .panel-body > div .panel-body-top > div .panel-body-bottom > div #panel-body-content .panel-body-content > div #bikeCatCont .bikeCatCont > div .bikeCat > div .bikes > div .bikeSelect low-seat lightweight > div .bikeMainInfo > div .bikeImage > div .shadowImage
		<div class="bikeSelect  low-seat">
		<div class="bikeMainInfo">
		  <div class="bikeImage">
				<div class="shadowImage" style="background-image: url('/~/media/Shadows/shadow_bike.ashx?w=105')"></div>
				<div class="shiftImage">
				  <a href="/Product Lines/Cycles/Products/Boulevard M50/2009/M50Z.aspx?category=cruiser">
						<img src="/~/media/Product/Cycles/M50/2009/M50Z/M50ZK9_OrangeBlack.ashx?h=71" height="71" alt="Boulevard M50 Special Edition" />
				  </a>
				</div>
		  </div>
		  <div class="bikeUnderImage">
				<div class="bikeName">Boulevard M50 Special Edition</div>
		  </div>
		</div>
		<div style="display:none;">
		  <input type="text" class="selectedYear" value="2009" />
		  <input type="text" class="selectedFilter" value="" />
		  <input type="text" class="bikename" value="Boulevard M50 Special Edition" />
		  <input type="text" class="bikeimgsrc" value="/~/media/Product/Cycles/M50/2009/M50Z/M50ZK9_OrangeBlack.ashx" />
		  <input type="text" class="msrp" value="$7,999" />
		  <input type="text" class="engineFacts" value="805 cc (49.1 cu. in), 4-stroke, liquid-cooled, OHC, 45-degree V-twin" />
		  <input type="text" class="href" value="/Product Lines/Cycles/Products/Boulevard M50/2009/M50Z.aspx" />
		  <input type="text" class="tagline" value="" />
				<div class="sibBikes">
				  <div style="display: none;">
						<input type="text" class="siblings" value="Boulevard M50" />
						<input type="text" class="editionMSRP" value="$7,799" />
						<input type="text" class="editionHref" value="/Product Lines/Cycles/Products/Boulevard M50/2009/M50.aspx?category=cruiser" />
				  </div>
				</div>
		</div>
  </div>
		  
  */
  /*details*/
	table.tabelDotari { color: gray; margin: 15px 15px 0 15px; width: 700px; }
	table.tabelDotari td { padding-left: 3px; }
	table.tabelDotari	td.dotCateg { background: gray; color: white; font-weight: bold; }
	table.tabelDotari	td.dotType {font-style: italic; }
	/*features*/
	table#featuresList { color: gray; margin: 30px 30px 0 30px; }
	table#featuresList tr { vertical-align: top; }
	table#featuresList td#featText { width: 450px; }
	table#featuresList td#featText h1.fulltext { margin: 10px 0; }
	table#featuresList td#featText h2.gray { color: gray; margin: 0; }
	table#featuresList td#featPic { width: 200px; padding-left: 50px; }
	/*media*/
	#mediAll { margin-left: 13px; }
	#mediAll a { outline: 0; }
	#mediAll img#front { float: left; }
  #mediAll table#mediaIm { float: left; border-collapse: collapse; }
	#mediAll table#mediaIm td, tr { padding: 0; }
  #mediAll table#mediaIm img {display: block; margin: 0;}
  /*products*/
  .products { margin-bottom: 1%; border-bottom: 1px solid gray;  font-family: Verdana, Helvetica;}
  .products a { outline: 0; }
  .products h1{ font-size: 10px; font-weight: bold; padding: 8px 0 10px 10px; background-color: #d8d7e5; border-bottom: 1px solid gray; }
  .products img { float: left; margin-bottom: 3px; }
  .products .descr { float: left; width: 550px; font-size: 11px; }
  .products .descr h2 { font-weight: bold; margin: 5px 0px 0px 5px; }
  .products .descr h3 { font-weight: normal; margin-left: 5px; }
  .top_nav { display: inline; float: right;}
  .top_nav a { outline: 0; }
  .top_nav span {  float: left; width: 70px;  font-weight: bold; color: #c7c7c7; font-size: 12px; margin-top: 2px; }
  .top_nav img { float: left; background-color: blue; margin: 0px 0px 0px -20px; }
  
  .items { text-align: center; font: 11px Verdana, Helvetica, sans-serif; padding: 30px 0 10px 0; }
  .items a { color: #d3d3d3; text-decoration: none; outline: 0; }
  .items a:hover { color: red; text-decoration: none; }
  .items .current { color: black; font-weight: bold; }
  
  /*product select box - items per page*/
  
  #stylez { font-family: Verdana, Helvetica; font-size: 10px; font-weight: bold; color: #444444; float: right; }
  #txt_items { float: left; margin-right: 5px; }
  #select_items { bord1er: 1px solid #B6B8FC; background: #B6B8CF; height: 20px; float: left; }
  
  #select_it, #select_it ul { padding: 0; margin: 0; list-style: none; }
  #select_it, #select_it li { padding: 0; margin: 0; }
  #select_it a { display: block; padding: 3px; text-decoration: none; font: italic 10px/1em Verdana, Tahoma, Arial, sans-serif; }
  #select_it li { float: left; width: 2.7em; background: rgb(78,78,78); } 
  
  #select_it li #a_increase { border-right: 1px solid white; border-bottom: 1px solid white; border-top: 1px solid black; border-left: 1px solid black; }
  #select_it li a { color: black; background: #B6B8CF; font-weight: bold; }
  #select_it li a:hover { background: #B6B8CF; }
  #select_it li ul  { /* second-level lists */  position: absolute; border-bottom: 1px solid #B6B8CF; width: 2.8em; left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */}
  #select_it li ul li { width: 100%; }
  #select_it li ul li a { background-color : #B6B8CF; color: black; font-weight: bold; border-right: 1px solid #B6B8CF; border-left: 1px solid #B6B8CF; border-top: 1px solid #B6B8CF;}
  #select_it li ul li a:hover { background-color: darkblue; color: white; }
  
  #select_it li:hover ul , #select_it li.sfhover ul { left: -999em; }
  #select_it li:hover ul, #select_it li.sfhover ul { /* lists nested under hovered list items */ left: auto; }
				 
/*	---------------------------------------------------------------------  */
/*  table#featuresList td#featPic img:hover { border: 3px solid gray; } */

	b.features-count { background-color: gray; color: white; margin-left: 3px; padding: 1px 3px; font-size: 10px; font-weight: normal; }
	/* contact.php */
	#contact { margin-left: 50px; }
	h2 { margin: 0 0 10px 20px; padding: 0; height: 20px; color: black; font: bold 11px Arial, Tahoma, Verdana, sans-serif; }
	dl.col { float: left; margin: 0 15px 0 15px; font: 11px Arial, Tahoma, Helvetica, Verdana, sans-serif; }
	dt { margin-top: 5px; font-weight: bold; }
	#contact img { padding: 20px 0 0 80px; }
	#contact a#mailto { color: black; }
	/*others*/
	h1.error { color: red; text-align: center; }
/*******footer********/
#footer { background: gray; height: 30px; }

#edit-form { }
  form { margin-top: 10px; }
  input.text, .text { border: solid 1px silver; border-top: solid 2px gray; border-left: solid 2px gray; }

.edit_prod_bt { padding-bottom: 30px; }  
	.edit_prod_bt a { padding: 3px; border: solid 1px silver; border-bottom: solid 2px gray; border-right: solid 2px gray; background-color: #e8e8e8; color: black; font-weight: bold; }
	.edit_prod_bt a:hover { text-decoration: none; }

.errors { padding-bottom: 30px; color: red; font-weight: bold; }

#concediu{color: red; text-align:center;  padding-bottom: 20px; }
#concediu p{ font: bold 18px Arial, Tahoma, Helvetica, Verdana, sans-serif; }


table#prod-index { border-spacing: 15px; }
  #prod-index th { padding-top: 30px; vertical-align: top; font-weight: bold; font-style: italic; }
  #prod-index td.catItems td { text-align: center; width: 90px; height: 80px; border-spacing: 15px; }
  #prod-index td.catItems a { display: block;  width: 90px; height: 80px; }
  #prod-index td.catItems img { border-left: 1px solid black; }