@charset "UTF-8";
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS framework
 * (en) central stylesheet
 * (de) zentrales Stylesheet
 *
 * @creator       YAML Builder V1.2 (http://builder.yaml.de)
 * @file          my_layout.css
 * @-yaml-minver  3.1
 * 
 */

/* import core styles | Basis-Stylesheets einbinden */
@import url(../yaml/core/base.css);

/* import screen layout | Screen-Layout einbinden */

@import url(screen/basemod.css);
@import url(screen/content.css);

/* import print layout | Druck-Layout einbinden */
@import url(../yaml/print/print_draft.css);
/* end layout =======================================================================*/

/***** Form style ****/
#form_container {
	background:#000;
	margin:0 auto;
	text-align:left;
	width:640px;
	color: white;
}
#form_container label {
	color: white;
}

form.appnitro {
	margin:20px 20px 0;
	padding:0 0 20px;
}
.appnitro {
	font-family:Lucida Grande, Tahoma, Arial, Verdana, sans-serif;
	font-size:small;
}

.appnitro li {
	width:61%;
}

form.appnitro ul {
	font-size:100%;
	list-style-type:none;
	margin:0;
	padding:0;
	width:100%;
}

form.appnitro li {
	display:block;
	margin:0;
	padding:4px 5px 2px 9px;
	position:relative;
}
form.appnitro li div {
	color:#444;
	margin:0 4px 0 0;
	padding:0 0 8px;
}

form.appnitro li span {
	float:left;
	margin:0 4px 0 0;
	padding:0 0 8px;
}

form.appnitro li div.left {
	display:inline;
	float:left;
	width:48%;
}

form.appnitro li div.right {
	display:inline;
	float:right;
	width:48%;
}

form.appnitro li div.left .medium {
	width:100%;
}

form.appnitro li div.right .medium {
	width:100%;
}
form.appnitro li div label {
	clear:both;
	color:#444;
	display:block;
	font-size:9px;
	line-height:9px;
	margin:0;
	padding-top:3px;
}

form.appnitro li span label {
	clear:both;
	display:block;
	font-size:9px;
	line-height:9px;
	margin:0;
	padding-top:3px;
}
label.description {
	border:none;
	display:block;
	font-size:95%;
	font-weight:700;
	line-height:150%;
	padding:0 0 1px;
}

/***** Tooltips tinytips ******/

.tinyTip { width: 325px; padding: 17px 0px 0px 0px; display: block; background: url(/cw/js/tinytips/demo/images/tinyTip-top.png) 0px 0px no-repeat; }
.tinyTip .content { text-align: left; padding: 0px 15px 0px 15px; font-size: 14px; font-family: "Lucida Sans Unicode"; color: #010101;  
					background: url(/cw/js/tinytips/demo/images/tinyTip-content.png) 0px 0px repeat-y; }
.tinyTip .bottom { height: 47px; background: url(/cw/js/tinytips/demo/images/tinyTip-bottom.png) 0px 0px no-repeat; font: 0px/0px sans-serif; }

.imgTip { width: auto; }
.imgTip .content { width: auto; padding: 5px; border: 6px solid #e2e2e2; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #ffffff; color: #020202; }
.imgTip .bottom { height: 14px; background: url(../images/notch-white.png) top center no-repeat;  }

.lightTip { width: 342px; }
.lightTip .content { text-align: center; width: 310px; padding: 10px; border: 6px solid #e2e2e2; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #ffffff; color: #020202; }
.lightTip .bottom { height: 14px; background: url(../images/notch-white.png) top center no-repeat; }

.yellowTip { width: 342px; }
.yellowTip .content { width: 310px; padding: 10px; border: 6px solid #f9e98e; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #fbf7aa; color: #020202; }
.yellowTip .bottom { height: 14px; background: url(../images/notch-yellow.png) top center no-repeat; }

.orangeTip { width: 342px; }
.orangeTip .content { width: 310px; padding: 10px; border: 6px solid #f9cd8e; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #fbe3aa; color: #020202; }
.orangeTip .bottom { height: 14px; background: url(../images/notch-orange.png) top center no-repeat; }

.redTip { width: 342px; }
.redTip .content { width: 310px; padding: 10px; border: 6px solid #ce6f6f; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #f79992; color: #020202; }
.redTip .bottom	{ height: 14px; background: url(../images/notch-red.png) top center no-repeat; }

.greenTip						{ width: 342px; }
.greenTip .content				{ width: 310px; padding: 10px; border: 6px solid #a9db66; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #cae8a2; color: #020202; }
.greenTip .bottom				{ height: 14px; background: url(../images/notch-green.png) top center no-repeat; }

.blueTip						{ width: 342px; }
.blueTip .content				{ width: 310px; padding: 10px; border: 6px solid #36a4d9; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #90d8f0; color: #020202; }
.blueTip .bottom				{ height: 14px; background: url(../images/notch-blue.png) top center no-repeat; }

.purpleTip						{ width: 342px; }
.purpleTip .content				{ width: 310px; padding: 10px; border: 6px solid #8671de; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #a290f0; color: #020202; }
.purpleTip .bottom				{ height: 14px; background: url(../images/notch-purple.png) top center no-repeat; }

.darkTip						{ width: 342px; }
.darkTip .content				{ width: 310px; padding: 10px; border: 6px solid #303030; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #505050; color: #f8f8f8; }
.darkTip .bottom				{ height: 14px; background: url(../images/notch-dark.png) top center no-repeat; }


a#saveBuild {
	color: white;
}
.scwBuilder {
	color: black;
}


legend {
    display:none;
}
label {
	color: black;
}

.catImageNav td {
	border: none;
	font-size:10px;
}

.cwLink {
	color: white;
}
.cwYellow {
	color: #ffff00;
}
.startOver img {
	padding: 10px 0;
}
.total{
	clear: both;
	padding: 10px 0 0 10px;
	font-size: 15px;
}
.category-head {
    max-width:95%;
}
#frontWheelButton  {
    width: 120px;
    height: 120px;
    background:url(/cw/images/frontWheel.png) 0 0 no-repeat;
}
#frontWheelButton:hover {
    background-position: -120px 0;
}
#rearWheelButton  {
    width: 120px;
    height: 120px;
    background:url(/cw/images/rearWheel.png) 0 0 no-repeat;
}
#rearWheelButton:hover {
    background-position: -120px 0;
}
#bothWheelButton  {
    width: 120px;
    height: 120px;
    background:url(/cw/images/wheelSet.png) 0 0 no-repeat;
}
#bothWheelButton:hover {
    background-position: -120px 0;
}
/* ======== Fixes to make the core magento css play friendly with the cw layout =======*/
.header-nav {
	
}
.page_margins {
	/* this fixes the firefox problem of extra space but kills IE and Chrome
    margin-top: -20px;
    */
}
body {
	background: #808080 url(/skin/frontend/default/pwb/images/carbonFiberBgFull.gif) repeat fixed center center;
}
body a {
	color: #fff;
	text-decoration: none;
}
body * {
	font-family: Arial,Helvetica,sans-serif;
}
.hover {
	color: #000;
}
.hover h4,p a {
    color: #000;
}
.hover p a {
    text-decoration: underline;
}
ul {
	list-style-type: none;
}
#header {
	width: 700px;
	padding: 0;
}
.infoGraphic {
	padding: 0 0 0 5px;
	vertical-align: bottom;
}
.continue {
    vertical-align: bottom;
}
.quick-access {
	width: 95%;
}
.quick-access a {
	color: white;
	font-weight: bold;
}
.quick-access ul {
	display: block;
	margin: 0;
}
.header-top-container {
	min-height: 146px;	
}
.header-nav ul {
	margin: 0;	
}
.required {
	color: black;
}
.header-nav-container { padding-bottom: 0;}
/* ======== Jquery Overlay Div =======*/
/* the overlayed element */ 
.simple_overlay { 
    /* must be initially hidden */ 
    display:none; 
    /* place overlay on top of other elements */ 
    z-index:10000; 
    /* styling */ 
    background-color:#fff; 
     
    /* min-width:600px; */
	min-width:800px;
    min-height:175px; 
    border:1px solid #666; 
	padding: 15px;
     
    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #000; 
    -webkit-box-shadow: 0 0 90px #000;     
}
.simple_overlay input[type="image"] {cursor: pointer;}


/* close button positioned on upper right corner */ 
.simple_overlay .close { 
    background-image:url(/cw/images/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}
/* ======== Jquery Tool Tip =======*/
/* simple css-based tooltip */ 
#tooltip { 
    display:none; 
    background:transparent url(/cw/images/black_arrow.png); 
    font-size:12px; 
    height:80px; 
    width:160px; 
    padding:25px; 
    color:#fff;    
	z-index: 10001; 
}
#tooltip2 { 
    display:none; 
    background:transparent url(/cw/images/tooltip.png); 
    font-size:12px;
    width:381px; 
    height:100px; 
    padding:10px;
    color:#fff;    
    z-index: 10001; 
}
#tooltip3 { 
    display:none; 
    background:transparent url(/cw/images/tooltip.png); 
    font-size:12px;
    width:200px; 
    height:50px; 
    padding:10px;
    color:#fff;    
    z-index: 10001; 
}
#tooltip4 { 
    display:none; 
    background:transparent url(/cw/images/tooltip.png); 
    font-size:12px;
    width:200px; 
    height:65px; 
    padding:10px;
    color:#fff;    
    z-index: 10001; 
}
/* ======== Ajax config pages =======*/
.productImage {
	display: inline; 
	float: right;
}


/* ========Supply Own Forms=======*/
div.row {

    background:#ffc;
    border:1px solid #ccc;

    margin:0 0 5px 0;
    float:left;
    width:60%;
    padding:6px 0;}
div.row label {
    float:left;
    display:block;
    width:8em;
    font-weight:bold;
    padding:0 6px;}

div.row fieldset {
    border:1px solid gray;
    margin:0 6px;}
div.row fieldset span {
    display:block;}
div.row fieldset span label {
    float:none;
    display:inline;}
div.row fieldset legend {
    font-weight:bold;}
div.requiredRow {
    border:1px solid #ccc;}

div.row label.error {
	float:right;
	width: 225px;
	background: url('../images/unchecked.gif') no-repeat;
    padding-left: 25px;
    margin-left: .3em;
}
/* ========End Supply Own Forms=======*/

label.error {
    background: url('../images/unchecked.gif') no-repeat;
    padding-left: 16px;
    margin-left: .3em;
}

.cat {
	display:inline;
	list-style-image: none;
	list-style-type: none;
}
ul {
	/*display:inline;*/
}
.illadvised {
	background-color: red;
	color: white;
}
.approved {
	background-color: yellow;
	color: black;
}
.recommended {
	background-color: green;
	padding: 2px 5px;
	color: white;
}


.headline {
	font-weight: bold;
	font-size: 16px;	
	padding: 3px 0 0 0;
}
#topNav li {
	float: left;
	padding: 5px 5px 3px 0;
	font-weight: bold;
	margin:0;
}
#topNav li a {
	/*color: #FF0000;*/
	color: #CC0000;
	font-weight: bold;
}
#topNav li a:hover {
    text-decoration:none;
}
#topNav li div {
	padding-right: 0;
	text-align: center;
}
/* ================= wheel step data box =========================== */
#stepBox ul li h6 {
	font-weight: bold;
}
#stepBox {
	width: 175px;
	background-color: #DDD;
	float: right;
	border: 1px solid #AAA;

}
#stepBox ul {
	list-style-type:none;
}
#stepBox ul .a {
    background-color: #EEE;
	margin: 0 -4px 0 -4px;
}
#stepBox li {
	border-bottom:  1px solid gray;
	padding: 3px;
	margin-left: 0;
}
#stepBox li p {
	margin:  0px;
	font-weight: bold;
}
#stepBox #head {
	background: transparent url('/cw/images/gradient45.png') repeat-x 0 0;
	margin: 0 auto;
	width: 175px;
	min-height: 45px;
}
#stepBox #head p {
	color: white;
	padding-top: 15px;
	font-weight: bold;
	font-size: 15px;
	letter-spacing: 1px;
	text-align: center;
}
#stepBox .inner {
	padding: 4px;
	color: #000;
}
#stepBox > .inner > h6 {
    color: #000;
}
#stepBox > .inner > a {
    color: #000;
}
.summary > li > h6 {
    color: #000;
}
#itemList td {
	border:none;
}

/* ================= END wheel step data box =========================== */


/* ================= Product Listing UL =========================== */

.itemList li {
	display: inline;
	max-width: 185px;
}
#itemList li {
    list-style-type: none;
}
#itemList td {
    width: 200px;
}

/* ================= Review Page UL =========================== */
.reviewList {
    float: left;	
}

.reviewList li {
	list-style-type: none;
	width: 275px;
	border-bottom: 1px solid grey;
	padding: 3px;
}

.reviewList li h6 {
    font-weight: bold;
	color: #FFF;
}

/* ================== general ====================================== */

select option {
	padding-right: 15px;
}
select {
	min-width: 125px;
}

.cwFilter {float: left; padding: 5px 5px 5px 0;}
.cwFilter > select {min-width: 41px;}

#filterForm input[type=submit] {padding: 2px; margin: 2px; }

.formFilter {display: block; margin: 5px; overflow: auto;}
.formFilter label {display: block; font-weight: bold; background: white url(/cw/images/form.gif) repeat-x center left; padding: 3px 5px;}

.filterChoice {max-width: 680px; margin: 5px 0; padding: 5px; color: black; font-weight: bold; background: white url(/cw/images/form.gif) repeat-x center left;}

/* CSS updates and overides needed specifically for the cw builder */
.page {position: static; top: auto; left: auto; margin: 0; width: 910px; }
.header {position: static; top: auto; left: auto; margin-left: auto;}


.manAll {text-align:center; margin: 5px auto; width: 60%; border: 1px solid #C00; }
.manAll a {color: #000; font-weight: bold; width: 100%; display: block; background-color: #CCC;}
.manAll a:hover {background-color: white; text-decoration: none;}

