﻿@import url(../../resources/css/reset.css);
@import url(../../resources/css/typography.css);

html, body{background:#eee url(images/bgtile.jpg) repeat-x 0 0;color:#000;cursor:default;line-height:1;}
h1,h2,h3{color:#000064;letter-spacing:normal;line-height:1}
h1,h2{font-weight:bold}
h2 {font-size:20px}
h3 {font-size:16px}
h4 {font-size:14px}
a,a:visited{color:#003399}
a:hover{color:#6A6BFF}
hr{clear:both;border:solid 1px #ccc;margin:7px 0;*margin:0}
img{border:0;font-size:1px /*prevents additional padding when resizing text through browser*/}
q{font-style:italic}
sup{vertical-align:baseline;position:relative;bottom:0.35em;/*this method ensures IE will not adjust line-heights*/}
sub{vertical-align:baseline;position:relative;bottom:-0.25em;/*this method ensures IE will not adjust line-heights*/}
.leftcolumn{width:49.33%;float:left;padding-right:5px}
.rightcolumn{width:49.33%;float:right;padding-left:5px}
.clear{clear:both;height:0;line-height:0;/*IE Only:height and line-height provided to address a rendering error of empty containers*/}
.info{background:transparent url(images/info.gif) no-repeat left;padding-left:18px}
/*Forms
---------------------------------------------------------*/
button{width:auto;overflow:visible;/*IE padding fix - uses auto width and overflow*/ }
fieldset{margin:0 0 1em 0;padding:1em;border:solid 1px #cc0000;*position:relative;*padding-top:1.85em;*margin-bottom:1.5em;-moz-border-radius:4px 8px 8px 8px}
legend{padding:0 0.35em;color:#000064;font-weight:bold;font-size:1.35em;*padding-top:0.5em;*padding-bottom:0.5em;*padding-left:0;*padding-right:0;*position:absolute;*top:-1em;*left:1em;overflow:visible;clear:both}
input, textarea, select{padding:2px;font:normal 100% Arial, Helvetica, sans-serif;-moz-border-radius:4px}
input{margin-right:2px;*margin-right:0}
select{font-family:Arial, Helvetica, Sans-Serif}
option{padding-right:5px}
textarea{overflow:auto /*IE overrides default to show scrollbar*/}
.caption, .note{font-size:11px;line-height:12px;font-weight:normal;color:#999999;font-family:Arial, Helvetica, san-serif}
.fm-button{background-color:#000064;color:#fff;padding:5px 10px;font-weight:bold;font-size:13px}
.formelementwrapper{margin-bottom:1.35em}
.errormessage{display:block;font:bold 1em/1 Arial, Helvetica, sans-serif;clear:both;padding:4px 0 4px 22px;background:transparent url(images/icon-error.gif) no-repeat 4px 4px}
/*Formated Forms - Based on the markup by Derek Featherstone at www.simplyaccessible.org and enhancements by Gayaranga Prabhath Sirisena (Prabhath) at www.nidahas.com*/
div.formwrapper{font-family:Arial, Helvetica, Sans-Serif}
div.formwrapper fieldset div.clear{clear:both;padding:0 !important}
/**/
div.formwrapper p.legend{margin-bottom:1em;font-size:11px;line-height:1.2em}
div.formwrapper p.legend em{color:#C00;font-size:1em;font-weight:bold;font-style:normal}
/**/
div.formwrapper .errors{margin-bottom:1.35em;padding:1em;border:1px solid #CCC;background-color:#FFC}
div.formwrapper .errors p{margin:0}
div.formwrapper .errors p em{color:#C00;font-size:1.2em;font-weight:bold;font-style:normal}
div.formwrapper .errormessage{display:block;margin-left:170px;font:bold 1em Arial, Helvetica, sans-serif;clear:both;padding:4px 0 4px 22px}
div.formwrapper .controlset .errormessage{margin-left:0}
/**/
div.formwrapper p{margin:0;line-height:1.2}
div.formwrapper p.note{margin-left:170px;color:#666;font-size:0.9em;font-family:Arial, Helvetica, Sans-Serif;line-height:1.1em}
div.formwrapper fieldset{}
div.formwrapper fieldset fieldset{border:0;border-top:double 3px #eee;padding:0.5em 0 0 0;*padding-top:1em;-moz-border-radius:0}
div.formwrapper fieldset fieldset legend{font-size:1.1em;*left:0;*padding-left:0}
div.formwrapper legend{}
div.formwrapper fieldset div, div.formwrapper div{padding:2px 0}
div.formwrapper fieldset div input, div.formwrapper fieldset div select{width:200px}
div.formwrapper fieldset div .checkbox input, div.formwrapper fieldset div .radiobutton input, .fm-button, .fm-button-cancel, .noborder input {width:auto !important;line-height:1}
div.formwrapper label, div.formwrapper span.label{color:#000064;font-weight:bold;margin-right:10px;_margin-right:8px;padding-right:10px;width:150px;float:left;display:block;text-align:right;line-height:15px;position:relative}
div.formwrapper label.error, div.formwrapper span.error{color:#C00}
div.formwrapper label em, div.formwrapper span.label em{color:#C00;font-size:1.2em;font-weight:bold;font-style:normal;font-family:Arial, Helvetica, sans-serif !important;position:absolute;right:0}
div.formwrapper input.error{border-color:#C00;background-color:#FEF}
div.formwrapper div.controlset label, div.formwrapper div.controlset input{float:none;display:inline;line-height:1;margin:0;margin-right:3px;_margin-right:0;*margin-right:0}
div.formwrapper div.controlset div{margin-left:170px}
div.formwrapper div.controlset div span{_zoom:1}
div.formwrapper div.buttonrow{margin-left:170px}
div.formwrapper div.important p{margin-bottom:1em}
div.formwrapper div .radiobutton input{position:relative;top:2px}
/*Wide Labels*/
div.formwrapper .widelabels label, div.formwrapper .widelabels span.label{width:175px}
div.formwrapper .widelabels p.note, div.formwrapper .widelabels .errormessage, div.formwrapper .widelabels div.controlset div, div.formwrapper .widelabels div.buttonrow{margin-left:195px !important}

/*Structural Elements & Their Styles
---------------------------------------------------------*/
#Wrapper{width:760px;margin:0 auto;_height 1%}
/*Header*/
#Header{overflow:visible;position:relative;height:132px;width:100%;clear:both;background:transparent url(images/headerslogan.gif) no-repeat 375px 40px}
#Header h1{text-indent:-9999px;width:241px;position:absolute;left:-24px;z-index:9999;height:124px;background:transparent url(images/alinelogo.gif) no-repeat left 8px}
#Header h1 span{width:241px;height:110px;position:relative;top:-24px;display:block;cursor:pointer}
#Header h2{display:none}
#Header ul{margin:0;padding:0;list-style:none;position:absolute;top:84px;right:0}
#Header ul a, #Header ul a:visited, #Header ul a:focus{display:block;font:normal 18px/48px "Trebuchet MS", Arial, Helvetica, sans-serif;letter-spacing:-1px;text-transform:uppercase;float:left;padding:0 6px;color:#fff;text-decoration:none}
#Header ul a:hover{background:#40408b url(images/menu-hover-bg.gif) repeat-x left bottom;cursor:pointer}
#Header p.customerlogin{position:absolute;top:0;right:10px;text-indent:-9999px;background:transparent url(images/btn-customerlogin.gif) no-repeat 0 0;z-index:1}
#Header p.customerlogin a, #Header p.customerlogin a:visited, #Header p.customerlogin a:focus{outline:none;width:178px;height:29px;display:block}
.rtsLevel{height:132px}

/*Content*/
#Content{margin:1.5em 0}
#Content ul{list-style-type:disc}
#Content img{border:solid 4px #fff}
#Content * img{border:none}
   
/*Footer*/
#Footer{border-top:solid 1px #ccc;border-bottom:solid 1px #ccc;padding:10px 18px;margin-bottom:25px;overflow:hidden;position:relative}
#Footer p{color:#666;font-size:11px;line-height:1;margin:0;position:relative}
#Footer p span{color:#999;position:absolute;right:0;font-style:italic}
#Footer a, #Footer a:visited{color:#666}
#Footer span a, #Footer span a:visited{color:#999}
#Footer a:hover{color:#333}

/*Basket
---------------------------------------------------------*/
.basket{position:relative;min-width:8em;max-width:760px;/* based on image dimensions - not quite consistent with drip styles yet */ z-index:1;margin-left:10px;/* default, width of left corner */ margin-bottom:0.5em;/* spacing under dialog */}
.basket .contentwrapper, .basket .t, .basket .b, .basket .b div{background:transparent url(images/basket.gif) no-repeat top right}
.basket .contentwrapper{position:relative;zoom:1;_overflow-y:hidden;padding:10px 10px 0 0}
.basket .contentwrapper .content{border:solid 1px #aeaeb4;padding:8px 8px 0 8px;height:1%}
.basket .contentwrapper .content h2{border-bottom:solid 1px #aeaeb4;margin:-8px -8px 0.5em -8px;padding:8px}
.basket .t{/* top+left vertical slice */ position:absolute;left:0;top:0;width:10px;/* top slice width */margin-left:-10px;height:100%;_height:1600px;/* arbitrary long height, IE 6 */background-position:top left}
.basket .b{/* bottom */ position:relative;width:100%}
.basket .b, .basket .b div{height:10px;/* height of bottom cap/shade */ font-size:1px}
.basket .b{background-position:bottom right}
.basket .b div{position:relative;width:10px;/* bottom corner width */ margin-left:-10px;background-position:bottom left}
.basket .hd, .basket .bd, .basket .ft{position:relative}
.basket .wrapper{/* extra content protector - preventing vertical overflow (past background) */ position:static;max-height:1000px;/* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */}

#CatalogWrapper { width: 800px;  margin: 0 auto; _height: 1%;}
#Catalog { margin: 0 auto; background-color: #fff; padding: 3px; border: solid 1px #808080; }
#Catalog div.tabcontainermargin { height: 4px; }
#Catalog h2 { background: #cc0000 url(images/red-h2-bg.gif) repeat-x left bottom; color: #fff; margin-bottom: 0; border-bottom: solid 1px #aeaeb4; padding: 8px; }
#Catalog h3 { margin-bottom: 0.5em; }
#Catalog .ajax__tab_tab, #Catalog .ajax__tab_tab a { font-size: 10pt; font-weight: bold; text-decoration: none; color: #000; }
#Catalog .searchwrapper { background: #cccbd9 url(images/gray-h2-bg.gif) repeat-x left bottom; border: solid 1px #aeaeb4; padding: 8px; text-align: center;}
#Catalog .searchwrapper .searchbox { margin-bottom: 4px; padding: 2px; }
#Catalog .searchwrapper .fm-button { }
#Catalog .searchwrapper ul { z-index: 1000; }
#Catalog .categories ul, #Catalog .subcategories ul, #Catalog .manufacturers ul { list-style: none; margin-left: 0; overflow: hidden; _position: fixed; zoom: 1; margin-bottom: 2px; margin-right: 0; }
#Catalog .categories p, #Catalog .subcategories p, #Catalog .manufacturers p { margin-bottom: 0; margin-top: 14px;}
#Catalog .categories ul li, #Catalog .subcategories ul li, #Catalog .manufacturers ul li { width: 24%; float: left; _display: inline; padding: 2px; line-height: 1.1;}
#Catalog .subcategories .selectedcategory { color: #C00; font-weight: bold; }
#Catalog .results { position: relative; zoom: 1; margin-bottom: 6px; }
#Catalog .results .numericpager { color: #000064; font-size: 15px; font-weight: bold; height: 20px; line-height: 20px; position: absolute; right: 2px; top: 6px; }
#Catalog .results .footerpagers { position: relative; margin: 5px 0 10px 0; }
#Catalog .results .buttonpager { text-align: center; color: #000064; font-size: 15px; font-weight: bold; display: block; }
#Catalog .results .buttonpager input  { width: 80px !important; }
#Catalog .results .buttonpager span.fm-button { background-color: #ccc; width: 80px !important; padding-top: 7px; padding-bottom: 7px; display: inline-block; text-align: center; }
#Catalog .results h2 { background: #cccbd9 url(images/gray-h2-bg.gif) repeat-x left bottom; color: #000064; font-size: 1.5em; margin-top: 0 !important; margin-bottom: 10px; }
#Catalog .results .itemsize { height: 160px; margin: 0 4px 6px 4px;  width: 140px; padding: 4px; overflow: hidden;}
#Catalog .results .item { float: left; overflow: hidden; text-align: center; }
#Catalog .results .item h4 { text-align: center; font-size: 14px; font-weight: bold; }
#Catalog .results .item p { text-align: center; font-size: 11px; line-height: 13px; }
#Catalog .results .item .thumbnail { height: 100px; }
#Catalog .results .popupwrapper { visibility: hidden; z-index: 1}
#Catalog .results .popupwrapper .popupbg { position: absolute; border: solid 1px #c0c0c0; background-color: #eee; opacity: .35; filter: alpha(opacity=35); -moz-opacity: 0.35; }
#Catalog .results .popupwrapper .popupcontent { position: absolute; text-align: center; padding-top: 30px; text-align: center; opacity: 0.9; filter: alpha(opacity=90); -moz-opacity: 0.90; z-index: 1000;}
#Catalog .results .popupwrapper .popupcontent input { background-color: #000064; color: #fff; padding: 5px; font-weight: bold; font-size: 11px; margin-left: 2px; margin-bottom:15px; width: 120px; cursor: pointer;  vertical-align: baseline;}
#Catalog .modal { background-color: #fff; padding: 18px 18px 18px 3px; overflow: hidden; }
#Catalog .modal .imagewrapper { float: left; width: 280px; overflow: hidden; }
#Catalog .modal img { margin-left: auto; margin-right: auto; width: auto; display: block; }
#Catalog .modal dl { float: left; margin-left: 20px; width: 375px; overflow: hidden; margin-bottom: 0px; }
#Catalog .modal dt { width: 85px; display: block; float: left; border-bottom: solid 2px #ccc; padding: 4px 0; }
#Catalog .modal dd { width: 280px; display: block; float: left; border-bottom: solid 1px #eee; padding: 4px 0 4px 8px; }
#Catalog .modal .noborder  { border: none; }
#Catalog .modal .fm-button-close { background: #cc0000 url(images/red-h2-bg.gif) repeat-x left bottom; color: #fff; font-weight: bold; float: right; cursor: pointer; }
#Catalog .modal div.logo { float: right; margin-top: 23px; }
#Catalog .modal div.logo input { width: 60px; display: inline; float: right; margin: 0; padding: 0; cursor: pointer; }
#Catalog .modalbg { background-color: #333; opacity: 0.9; filter: alpha(opacity=90); -moz-opacity: 0.90; }
#Catalog p.dataerror { font-size: 8pt; text-transform: capitalize; }
#Catalog p.dataerror a { color: #666; }
#Catalog .progress { background: url(images/animated-progress.gif) no-repeat 50% 50%; position: fixed; top: 50%; left: 50%; width: 50px; height: 62px; margin: -30px 0 0 -31px; z-index: 1002; padding: 20px 25px; background-color: #fff; border: solid 1px #ccc; _position: absolute;}

/* Fix interactions problems with Sitefinity administrative interface */
.CmsPageToolBar label {font-weight:normal;}
