/*================================ 
 MAGNETICS
 global.css  

 Last Updated By: Ryan Perry 
 Last Updated: 03/10/2010
================================*/



/*================================ 
 GLOBAL LAYOUT
================================ */
* {margin:0; padding:0; outline:none;}
body {font-size:12px; color:#585757; background:url('/images/spang/bodyBG.gif') repeat-x #f2f2f2;}
.mainContainer {margin:0 auto; padding:0 6px; width:960px; clear:both; background:url('/images/spang/mainBG.jpg') no-repeat left top;}
.navContainer {height:45px; clear:both; width:960px; margin:0; padding:0; background:url('/images/spang/navMainBG.jpg') repeat-x;}
.headerContainer {clear:both; border-left:1px solid #d6d6d6; margin-bottom:-1px; background:url('/images/spang/headerBG.jpg') repeat-x -1px bottom;}
.contentContainer {clear:both; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; padding:0 0 50px 0;}
.footerContainer {clear:both; height:35px; background:url('/images/spang/footerBG.jpg') repeat-x; font-size:11px; padding:0 0 0 30px; position:relative; z-index:0;}



/*================================ 
 ELEMENT STYLES
================================ */
body, div, table, tr, td, th, h1, h2, h3, h4, h5, h6, a, form, input, textarea, blockquote, span, p, select, option, iframe, strong, em {font-family:Arial, Helvetica, sans-serif;}
table {border-collapse:collapse;}
table td {vertical-align:top;}
img {border:none; outline:none;}
a {text-decoration:none; outline:none; color:#eb0303;}
a:hover {text-decoration:underline;}
.clearFloat {content: "."; clear:both; height:0; visibility:hidden; display:block;}
h1 {font-size:18px; color:#eb0303; font-weight:normal; margin:0 0 10px 0;}
p {padding: 0 0 20px 0;}

.headerNoMargin {margin:0 !important;}
.contentParagraph {}
.textLeft {text-align:left !important;}
.textCenter {text-align:center !important;}
.textRight {text-align:right !important;}
.boldText {	font-weight:bold !important;}
.colWidth35 {width:25px !important;}
.colWidth40 {width:40px !important;}	
.colWidth50 {width:50px !important;}
.colWidth75 {width:75px !important;}
.colWidth100 {width:100px !important;}
.colWidth125 {width:125px !important;}
.colWidth150 {width:150px !important;}
.colWidth200 {width:200px !important;}
.colWidth225 {width:225px;}
.colWidth250 {width:250px !important;}
.subNote {font-size:11px; color:#585757;}
.noRightMargin {margin-right:0 !important;}
.noBottomMargin {margin-bottom:0 !important;}
.bottomMargin5 {margin-bottom:5px !important;}
.noMargin {margin:0 !important;}
.noBorder {border:none !important;}
.noRightBorder {border-right: none !important;}
.topBorder {border-top:1px solid #bebebe !important;}
.rightBorder {border-right:1px solid #bebebe !important;}
.bottomBorder {border-bottom:1px solid #bebebe !important;}
.leftBorder {border-left:1px solid #bebebe !important;}
.topPadding8 {padding-top:8px !important;}
.noPadding {padding:0 !important;}
.floatRight {float:right !important;}
.floatLeft {float:left !important;}
.zebraTable {}
.nonZebraTable {}
.zebraAccordionTable {}
.dividerList {}
.totalRow td{padding:5px 10px; white-space:nowrap; color:#000000; border-top:1px solid #bebebe;}
.titleRow {}
.buttonRow {}
.sortTable {}
.toolTip {}
:focus {outline:none;}



/*================================ 
 NAVIGATION LAYOUT
================================ */
.navContainer ul {list-style:none;}
.navContainer ul li {float:left; display:inline; border-right:1px solid #979797;}
.navContainer ul li a {display:block; font-size:14px; padding:10px 40px 11px 38px; color:#ffffff; background:url('/images/spang/navBG.jpg') repeat-x 0 0;}
.navContainer ul li a:hover {background-position: 0 -38px; text-decoration:none !important;}
.spaceContainer {margin:-5px 0 0 0; border-left:1px solid #d6d6d6; border-right:1px solid #d6d6d6; height:5px;}

.mainMenu {position:relative; z-index:5 !important;}
.mainMenu ul {padding: 0; margin: 0; list-style: none;}
.navContainer ul.mainMenu li {float:left; position:relative; z-index:10 !important;}
.navContainer ul.mainMenu li a  {display:block; text-decoration:none; outline:none !important; color:#ffffff;	}
.mainMenu li.current a {color:#ffffff !important; background-position:0 -38px;}

/*---- Second Level ----*/
.mainMenu li ul { position: absolute !important; left: -999em; top:37px; width:190px; padding:0 !important; margin:0 !important; background:url('/images/spang/navSecondLevelBG.png') no-repeat 0 0 !important; border-top:1px solid #bababa;}

/*---- Third Level ----*/
.mainMenu li ul ul { /*background:url('/images/spang/navSecondLevelBG.png') no-repeat 0 0 !important;*/ margin:-37px 0 0 190px !important; display:block; width:190px;}

.secondLevelLast {	background:url('/images/spang/navSecondLevelBottomBG.png') no-repeat bottom left !important; padding:0 0 7px 0 !important;}
.mainMenu li ul li {border:none !important;}
.mainMenu li ul li a {width:162px; padding:5px 14px 5px 14px; background:none !important; color:#ffffff !important;}	
.mainMenu li ul li a:hover {background:#cacaca !important; color:#e72b2b !important;}
.mainMenu li:hover ul ul, .mainMenu li:hover ul ul ul, .mainMenu li.sfhover ul ul, .mainMenu li.sfhover ul ul ul {left: -999em;}
.mainMenu li:hover ul, .mainMenu li li:hover ul, .mainMenu li li li:hover ul, .mainMenu li.sfhover ul, .mainMenu li li.sfhover ul, .mainMenu li li li.sfhover ul {left: auto;}
.mainMenu li:hover a, .mainMenu li:active a, .mainMenu li.sfhover a {background-position:0 -38px !important;}

.langaugeNAV {float:right; display:inline; margin:0; padding:0;}
.headerChineseLink{display:block;	cursor:pointer; margin:0; border:none; background:#00f003;}
.headerChineseLink span {background:url('/images/spang/Chinese.gif') no-repeat center center !important; height:14px; width:58px; text-indent:-9999px; display:block; cursor:pointer;}
.lastNAV {border-right:none !important;}



/*================================ 
 HEADER LAYOUT
================================*/
.headerLogo {float:left; display:inline; width:460px; padding:13px 0 8px 37px;}
.headerLogo h1 {background:url('/images/spang/magneticsLogo.jpg') no-repeat; text-indent:-9999px; margin:0 !important;}
.headerLogo h1 a {display:block; width:173px; height:74px;}
	
.headerSearch {margin:0 0 0 516px; font-size:11px; padding:0;}

.headerLogin {height:51px; display:block; border-right:1px solid #d6d6d6; text-align:right; padding:0 10px 0 0;}
.headerLogin ul {float:right; list-style:none; margin:5px 0; padding:0;}
.headerLogin ul li {float:left; display:inline; color:#585757; border-right:1px solid #585757; margin:0 5px 0 0; padding:0 5px 0 0;}
.headerLogin ul li a {color:#585757;}
.headerLoginLogout {margin:0 !important; padding:0 !important; border-right:none !important;}
.headerLogin p {clear:right; padding:0;}

/*---- Header Blog Link ----*/
.headerSearch .header-blog-link {display:block; height:51px; padding-right:10px; border-right:1px solid #d6d6d6;}
.headerSearch .header-blog-link a {margin-top:15px; display:block; background:url('/images/spang/header-blog-link-bg.jpg') no-repeat 0 center; padding:0 0 0 25px; font-size:13px; float:right; width:150px;}

.headerSearchFields {height:47px; border-right:1px solid #8c8b8b; padding-right:1px; position:relative; color:#ffffff;}
.headerSearchFields a {color:#ffffff;}
.headerKeywordSearch {float:left; width:217px; padding:5px 0 5px 5px; display:inline; position:relative;}
.headerPartNumSearch {position:relative; margin:0 0 0 223px; padding:5px 0 5px 5px; font-size:10px; height:37px}
.headerSearchInput {top:2px; position:relative; display:inline; width:104px; border:none !important; background:url('/images/spang/headerSearchInputBG.png') no-repeat; height:17px; padding:2px 3px; margin:0 0 0 -2px;}
.headerSearchButton {position:relative; display:inline; top:-1px; left:-2px; width:17px; height:17px; background:url('/images/spang/headerSearchButtonBG.png') no-repeat; text-indent:-9999px; cursor:pointer; border:none; outline:none; overflow: hidden; font-size: 0px; line-height: 0px;}



/*================================ 
 FORM STYLES
================================ */
.contentSearchButton {background:url('/images/spang/contentSearchButtonBG.png') no-repeat; width:23px; height:23px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.contentFormTable {border-collapse:collapse; width:600px; font-size:12px;}
.formLabel {width:175px; text-align:left; vertical-align:middle !important; color:#000000; padding-bottom:8px; height:35px;}
.formInput {height:35px; vertical-align:middle !important;}
.formInput input, .formInput select, .formInput textarea, .formInput label {margin:0 8px 8px 0;}
option {padding:0 2px;}
.formFieldContainer {margin:0 0 10px 0;}
.formSmallInput {border:1px solid #bebebe; padding:2px; width:75px;}
.formMediumInput {border:1px solid #bebebe; padding:2px; width:196px;}
.formMedium2Input {border:1px solid #bebebe; padding:2px; width:250px;}
.formLargeInput {border:1px solid #bebebe; padding:2px; width:410px;}
.formCheckBox {/*position:relative; margin:0 2px; top:2px;*/}
.formSearchInput {float:left; margin:0 5px 0 0;}
.formSearchLabel {float:left; margin:0 5px 0 0;}
.formButtonHolder {text-align:right; padding:20px 8px;}
.formButtonHolder input {margin:0 4px;}

.formProccessRequestButton {width:125px; background:url('/images/spang/formButtons.gif') no-repeat 0 -69px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSelectAllButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -23px; width:91px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formDeselectAllButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -46px; width:105px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSubmitButton {background:url('/images/spang/formButtons.gif') no-repeat 0 0px; width:70px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formLoginButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -146px; width:81px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSearchButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -173px; width:70px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSubmit2Button {background:url('/images/spang/formButtons.gif') no-repeat 0 -92px; width:82px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSearchAgainButton	{background:url('/images/spang/formButtons.gif') no-repeat 0 -119px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formQuoteButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -196px; width:70px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSampleButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -219px; width:70px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formBuyButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -242px; width:47px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formRefineSearchButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -265px; width:101px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formGetPricingButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -288px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSample2Button {background:url('/images/spang/formButtons.gif') no-repeat 0 -315px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formBuy2Button {background:url('/images/spang/formButtons.gif') no-repeat 0 -342px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSelectAll2Button {background:url('/images/spang/formButtons.gif') no-repeat 0 -369px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formDeselectAll2Button {background:url('/images/spang/formButtons.gif') no-repeat 0 -396px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formAddNewPartButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -423px; width:110px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formGetOrderDetailsButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -446px; width:130px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formAddToOrderButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -473px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formPlaceOrderButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -500px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formCheckLeadtimeButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -527px; width:125px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formGetQuoteButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -554px; width:97px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formAddNewAddressButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -581px; width:130px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formEditButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -608px; width:97px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSaveButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -635px; width:97px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formQuote2Button {background:url('/images/spang/formButtons.gif') no-repeat 0 -662px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formRefineSearch2Button {background:url('/images/spang/formButtons.gif') no-repeat 0 -689px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formAddProductButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -716px; width:100px; height:18px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formCalculateButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -739px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formPrintButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -766px; width:63px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formSaveDesignButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -793px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formBrowseButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -820px; width:74px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}
.formLoadDesignButton {background:url('/images/spang/formButtons.gif') no-repeat 0 -847px; width:103px; height:22px; text-indent:-9999px; border:none; outline:none; overflow: hidden;	 display:block; font-size: 0px; cursor:pointer; line-height: 0px}



/*================================ 
 FOOTER LAYOUT
================================ */
.footerContainer ul {list-style:none; padding:12px 0 0 0;}
.footerContainer ul li {display:inline; float:left; background:url('/images/spang/footerDivider.jpg') no-repeat 0 1px; margin:0 5px 0 0; padding:0 0 0 7px; color:#ffffff;}
.footerContainer ul li a {color:#ffffff;}
.footerFirst {background:none !important; padding:0px !important;}
.rohsLogo {position:relative; z-index:1; margin:-21px 2px 0 0; float:right; width:84px; text-indent:-9999px; height:41px; cursor:pointer; display:block; background:url('/images/spang/ROHSLogo.png') no-repeat;}


