/**
 *
 * CartXE CLIENT CSS File
 *
 * Use this file to override the base styling or to customize any styles specific to your site
 * 
 *  Notes on the custom 2px white borders:
 *  All main divs will output bottom border, except for:
 *   Billing and shipping do not have bottom borders
 *   On Order Form, Catalog has a top border (i.e., not on checkout page)
 *   On Checkout Page, xe-programs and xe-payment will need top border.
**/





#xe h4 {
	background-color:transparent;
	margin:0;
	padding:1px;
	font-size:120%;
	font-weight:bold;
	border:0;
}



/* =Form General Styles ---------------------------------------- */
.xe-asterisk {
	font-weight:bold;
	padding-left:1px;
}
.xe-fielderror {
	background-color:#990000;
	color:white;
}






/* =Loader Styles ---------------------------------------- */

#xe p.xe-loader {
	margin:24px 0;
	text-align:center;
}

/* Remember that the following class is NOT contained within #xe div ... */
p.xe-spinner {
	margin-top:50px;
	margin-left:50px;
	padding-left:50px;
	padding-bottom:100px;
	background:url(../img/ajax-loader.gif) no-repeat left 10px;
	color:green;
	font-weight:bold;
	font-size:150%;
}





/* =Menu ----------------------------------- */
#xe-menu {
 background-color:#E2D6B5;
 border-color:#C3B180;
}




/* =Billing and =Shipping ----------------------------------- */
#xe #xe-welcome {
 	border-bottom:2px solid #ffffff;
 	margin-bottom:18px;
}



/* =Billing and =Shipping ----------------------------------- */

#xe-billing {
	width:49%;
	padding-bottom:6px;
}
#xe-shipping {
	width:49%;
	padding-bottom:11px;
}
#xe-billing br, #xe-shipping br {
	clear:both;
}
#xe-billing h4, #xe-shipping h4 {
	margin-bottom:12px;
}
#xe-billing label, #xe-shipping label {
	width:100px;
	float:left;
	display:inline;			/* <3 I.E.! */
	margin:0px 2px 0px 0px;
	clear:both;
}
#xe-billing input, #xe-billing select, #xe-shipping input, #xe-shipping select {
	margin:2px 0;
	width:140px;
}






/* =Catalog ----------------------------------- */

#xe #xe-catalog {
	border-bottom:2px solid #FFF;
	margin-bottom:20px;
}

/* top border for catalog should be for order form page only */
#order-index #xe #xe-catalog {
	border-top:2px solid #FFF;
}

/* custom margins for Milano to override base styles */
#xe-catalog div {
	border:0;
	margin:25px 0px;
	padding:0;
}
#xe-catalog div div {
	margin:10px 0;
}
#xe-catalog .xe-product div {
	margin-top:10px;
	margin-bottom:10px;
}
#xe #xe-catalog .xe-product div {
	margin-left:15px;
}




#xe-catalog input {
	width:75px;
	margin-left:5px;
}

/* Top level cat names. If you don't define, they will inherit from #xe h4 defined at top of this file. */
#xe-catalog div h4 {
	background-color:transparent;
	color:#600;
	border-top:0;
	border-bottom:1px solid #666;
	font-size:120%;
}

/* Second level cat names */
#xe-catalog div div h4 {
	background-color:transparent;
	color:#600;
	border-top:0;
	border-bottom:1px solid #bbb;
	font-size:100%;
	margin:9px 0 9px 5px;
	text-transform:uppercase;
}






/* =ProductNotices ----------------------------------- */

#xe-catalog tr.xe-product .xe-product-notices li {
	padding-top: 4px;
	margin-left:0px;
	padding:0;
	font-style: italic;
	line-height:1;
	display:block;
}





/* =Programs ----------------------------------- */

/* custom padding and borders for Milano */
#xe #xe-programs {
	padding-bottom:1px;    /* this is critical to prevent IE from squashing layout */
	padding-top:10px;
	border-bottom:2px solid #FFF;
}

/* NOTE! on checkout page we need top border! */
#xe-page-checkout #xe #xe-programs {
	border-top:2px solid #FFF;
}


/* these divs exist specifically for Milano: */
#xe-summary-and-ship-container {
	zzzborder-top:2px solid #FFF;
 	padding-top:10px;
	border-bottom:2px solid #FFF;
}
#xe-custom-after-programs textarea {
	display:block;
	clear:both;
	width:275px;
	height:55px;
}


/* =ShipSelection -------------------------------------- */

div#xe-shipselection {
	position:absolute;
	zzzfloat:left;
	top:20px;
	left:20px;
	width:180px;
}
div#xe-shipselection div {
	/* margin:25px 0; */
}

#xe-shipselection fieldset {
	border:2px solid #FFF;
	padding:1px;
}

#xe-shipselection label {
	float:right;
	width:250px;
	text-align:left;
	margin:0;
	top:0;
}
#xe-shipselection input {
	float:left;
	width:20px;
	margin:0;
	clear:left;
	top:3px;
}


#xe div#xe-shippingnotices {
	margin:0;
}
#xe div#xe-shippingnotices p {
	margin:2px 0 0 0;
	line-height:1;
}


/* =Payment Section -------------------------------------- */

/* we need to add a <div class="clear"></div> just before each main section closing div, */
/* or dump a <br class="clear" /> after each input, to appease our floats */
#xe-payment {
	clear:both;
	padding:10px 0 20px 0;
	border-bottom:2px solid #FFF;
}

#xe-page-checkout #xe-payment {
	border-top:2px solid #FFF;
}


/* =OrderOptions Section -------------------------------------- */

#xe-orderoptions, #xe-programoptions {
	border-bottom:2px solid #FFF;
}

#xe-orderoptions h4, #xe-programoptions h4 {
	margin:12px 0;
}




textarea#orderoption-order-gift-message {
	width:180px;
	height:50px;
}
textarea#orderoption-order-comments {
	width:275px;
	height:50px;
}

/* specific to Milano: */
#orderoption-referrer-fieldset {
 border:2px solid #FFF;
 width:300px;
 margin-top:6px;
 margin-bottom:18px;
 padding:4px; 
}



/* =OrderNotices Styles ---------------------------------------- */

div#xe-ordernotices {
	margin:20px !important;
	padding:5px !important;
	background-color:#FFFFF0;
	border:4px double #888 !important;
	clear:both;
	
	
	display:none;
}



/* =OrderNotices Styles ---------------------------------------- */

/* was: div#xe-ordernotices, and was: !important on border and margin */
#xe #xe-ordernotices {
	margin:20px 0 !important;
	padding:5px;
	background-color:#F9F5E9;
	border:4px double #888;
	clear:both;
	
	display:none;
	
	padding-top:15px;
	padding-bottom:15px;
	
}

#xe #xe-ordernotices ul li {
 list-style-type:disc;
 font-weight:bold;
 margin:3px 20px;
}





/* =Registration ---------------------------------------- */

#xe #xe-registration {
	border-bottom:2px solid #FFF;
	padding-bottom:12px;
	margin-bottom:12px;
}
#xe #xe-registration p {
 	margin:12px 0;
}











/* =Panels (jqModals) - General Styling ---------------------------------------- */

.xe-panel p { line-height:18px; margin:6px 0; }
.xe-panel fieldset { border:1px solid #aaa; padding:10px;}