/* 
Styles for SEM quoting page and registration page (Slider version)
Date: April 2012
Author: Mende Williams
Notes: 
  +  properties are listed in alphabetical order 
  +  font size values are based on an 18px or 1.125em line height. this includes the combination of font size, line height, and top and bottom margins. please be mindful of this if altering any of these values.  *there are some exceptions to this. 
  +  please preserve formatting 
*/

/*----------------------------------------------------------
  =import applicable styles
----------------------------------------------------------*/
@import url("_bzGlobalLegacy.css");


/*----------------------------------------------------------
  =page specific styles
----------------------------------------------------------*/
body {
	background: #d4e7ec;
}
.wrapper {
	margin: 0 auto;
	position: relative;
	width: 900px;
}
.header {
	background: #fff;
	border-bottom: none;
	padding: 3px 15px 0 15px;
	width: 870px;
}
.header ul {
	display: none;
}
.mainContent {
	background: #d4e7ec url(/bzng/images/layout/semTile.jpg) repeat-x;
	float: none;
	min-height: 470px;
	padding: 10px 0;
	position: relative;
	width: 100%;
}
/*----------------------------------------------------------
  =quote box
----------------------------------------------------------*/
/* hide form headline initially, will be display by js when appropriate */
.form_headline { display: none; }

.quoteBox {
    padding: 15px 19px;
    width: 412px;
}
body.rfq .quoteBox .form,
body.registration .page {
    border: 1px solid #fff;
    min-height: 340px;
    height: auto;
}

.rfq .quoteBox form {
    overflow-x: hidden;
    overflow-y: visible;
    position: relative;
}
.rfq .quoteBox form dl {
    left: 410px;
    position: absolute;
    width: 410px;
}

/*----------------------------------------------------------
  =form nav
----------------------------------------------------------*/
.quoteBox .formNav { height: 60px; }
.quoteBox .formNav ul { height: 40px; }

.formNav li.continue a, .formNav li.submit a {
	background: url(/bzng/images/buttons/legacy_sem_continue.gif) no-repeat;
	border: 1px dotted #fff;
	display: block;
	height: 38px;
	text-indent: -9999px;
	width: 129px;
}
.formNav li.back a:focus,
.formNav li.continue a:focus,
.formNav li.submit a:focus {
	border-color: #6b6b6b;
}
.formNav li.back {
	margin: 12px 20px 0 0;
}
.formNav li.back a {
	background: url(/bzng/images/buttons/legacy_sem_back.gif) no-repeat;
	border: 1px dotted #fff;
	display: block;
	height: 26px;
	text-indent: -9999px;
	width: 68px;
}
.registration .formNav li.submit a{
	background-image: url(/bzng/images/buttons/legacy_sem_submit.gif);
}

/*----------------------------------------------------------
  = form elements
----------------------------------------------------------*/
.multipleAnsOther input {
    float: none;
    margin-left: 0;
}
/*----------------------------------------------------------
  =left content
----------------------------------------------------------*/
.leftContent {
	float: left;
	width: 220px;
}
.leftContent h3,
.leftContent p {
	padding: 0 5px 0 15px;
}
.leftContent h3 {
	color: #fff;
	margin: 27px 0 5px 0;
	text-align: center; 
}
.leftContent p {
	font-weight: bold;
	margin-top: 0;
}
.personImage {
	position: absolute;
	top: 140px;
	z-index: 100;
}
/*----------------------------------------------------------
  =right content
----------------------------------------------------------*/
.rightContent {
	background: url(/bzng/images/layout/semSidebar.png) 0 30px no-repeat;
	float: left;
	min-height: 480px;
	left: -12px;
	margin-top: -30px;
	padding: 0 20px;
	width: 180px;
	position: relative;
	z-index: 100;
}
.ie .rightContent {
	background: url(/bzng/images/layout/semSidebar_ie.png) -5px 31px no-repeat;
}
.rightContent .productImage {
	left: -5px;
	position: relative;
}
.rightContent h6 {
	color: #e98822;
	font-size: 1.125em; 
	line-height: 1.115em; 
	margin: 8px 0 6px 0; 
	text-align: center;
}
.rightContent p {
	font-style: italic;
	margin: 6px 0;
}
.categoryPdf img {
	-moz-box-shadow: 0 0 4px 0 rgba(0, 0, 0, .5); 
	-webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, .5); 
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, .5); 
	margin: 6px 40px;
}
.ie .categoryPdf img {
	border: 1px solid #ccc;
}
/*----------------------------------------------------------
  =footer
----------------------------------------------------------*/
#footer {
	border-top: none;
	color: #000;
	margin-top: 0; /* will be adding padding w/ JS when supplier call-out is hidden after first screen */
}
#footer a, 
#footer a:link, 
#footer a:visited, 
#footer a:hover, 
#footer a:active { 
	color: #000;
}
#whyEmail {
	display:none;
}
/*----------------------------------------------------------
  =additional requirements example answers
----------------------------------------------------------*/
form dd .addReqs {
	display:none;
}

/*----------------------------------------------------------
  =microsite include
----------------------------------------------------------*/
.microsite {
	background: #fff;
	padding: 20px 20px 10px 20px;
	width: 860px;
}
/*----------------------------------------------------------
  =supplier callout
----------------------------------------------------------*/
.supplier-callout {
	height: 36px;
	margin-top: 4px;
}
.supplier-callout p {
	margin: 0;
}


/*----------------------------------------------------------
  =seller logos include (on select cats only)
----------------------------------------------------------*/
.logos { background: #fff; margin-bottom: 15px; padding: 20px 0px 10px 0px; text-align:center; width: 100%; }
.logos.blue { background: none; }
.logos img { margin: 0 15px; }



/*----------------------------------------------------------
    rfq test flow
----------------------------------------------------------*/
.rfqt-tag {
    color: #fff;
    font-size: 1em;
    margin: 0;
    position: absolute;
    bottom: 10px;
    left: 10px;
}
