/*
b2 systems

MWISMedia New Media Design & Development

Author: Garry Bartle

 */


/* ---------------------------------------------------------------*/
/* Forces vert scrollbar on all pages*/
/* Removes unpredictable 'browser default' settings */
/* Body tag settings */

html { height: 100%; margin-bottom: 1px; }  

html,body{height:100% !important}

p, td, li, ul,ol, h1, h2, h3 ,h4 ,h5 ,h6, label, input {
	font: normal 12px "arial", Arial;
	margin: 0 0 0 0; 
	padding: 0 0 0 0; 
}

body {margin: 0px;	padding: 0px;text-align:left;font: normal 12px "arial", Arial;color:#7F7F7F;	background: #0057AE no-repeat url(../images/bg_main.jpg);	}	
		
#main_container {width: 987px; margin:30px auto;position:relative; background-color:#FFFFFF; padding:5px 5px 5px 5px;}
#header {width:987px; height:127px; }
#banner {width:970px; height:135px; background:url(../images/bg_banner2.jpg) repeat-x; padding:0 0 0 17px;  }
#page_container {width:950px; background:url(../images/bg_page2.jpg) repeat-y; padding:0 0 0 22px; margin:10px 0 10px 0; }
#page_top {width:987px; height:22px; background:url(../images/page_top.jpg) no-repeat; }
#nav_col {float:left; width:180px; margin:0 36px 0 0;  }
#col_container { float:left; width:727px }
#col_one {float:left; width:370px; }
#col_two {float:left; width:330px; padding:0 0 0 20px;}
#full_span {float:left; width:710px;  }
#search_login {float:left; width: 710px; height:64px; background-color:#ffffff; margin-bottom:10px; background:url(../images/search_bar.jpg) no-repeat; padding:0 0 0 0;}

#search_login2 {float:left; width: 710px; height:64px; background-color:#ffffff; margin-bottom:10px; background:url(../images/search_bar2.jpg) no-repeat; padding:0 0 0 0;}

h1.caps {text-transform: capitalize;}

/* --------------NAVS-----------------------*/

#nav_col ul {padding:0 0 0 0; margin:0 0 0 0; list-style:none;}
#nav_col li {padding:13px 0 13px 25px; margin:0 0 0 0; background:url(../images/nav_bg.jpg) no-repeat; }
#nav_col li a { font-weight:bold; text-decoration:none; color:#003A74; font-size:13px;}
#nav_col li a:hover { text-decoration:underline;}
#nav_col li.xerox {padding:13px 0 0 25px; margin:0 0 0 0; background:url(../images/nav_bg_xerox.jpg) no-repeat; }
#nav_col li.xerox a { font-weight:bold; text-decoration:none; color:#CC0000; font-size:13px;}
#nav_col li.xerox a:hover { text-decoration:underline;}
#nav_col li.xerox2 {padding:5px 0 5px 25px; margin:0 0 0 0; background:url(../images/nav_bg_xerox2.jpg) no-repeat;  }
#nav_col li.xerox2 a {  text-decoration:none; color:#CC0000; font-size:13px; font-weight:normal; line-height:135%;}
#nav_col li.xerox2 a:hover { text-decoration:underline;}
#nav_col li.xerox3 {padding:0 0 7px 25px; margin:0 0 0 0; background:url(../images/nav_bg_xerox3.jpg) no-repeat;  }
#nav_col li.xerox3 a {  text-decoration:none; color:#CC0000; font-size:13px; font-weight:normal; line-height:135%;}
#nav_col li.xerox3 a:hover { text-decoration:underline;}

#nav_col li.it {padding:13px 0 0 25px; margin:0 0 0 0; background:url(../images/nav_bg_it.jpg) no-repeat; height:27px}
#nav_col li.it a { font-weight:bold; text-decoration:none; color:#003D76; font-size:13px;}
#nav_col li.it a:hover { text-decoration:underline;}
#nav_col li.it2 {padding:0 0 10px 25px; margin:0 0 0 0; background:url(../images/nav_bg_it2.jpg) no-repeat;  }
#nav_col li.it2 a {  text-decoration:none; color:#003D76; font-size:13px; font-weight:normal; line-height:135%;}
#nav_col li.it2 a:hover { text-decoration:underline;}

#nav_col li.office {padding:13px 0 0 25px; margin:0 0 0 0; background:url(../images/nav_bg_office.jpg) no-repeat;}
#nav_col li.office a { font-weight:bold; text-decoration:none; color:#83BE41; font-size:13px;}
#nav_col li.office a:hover { text-decoration:underline;}
#nav_col li.office2 {padding:0 0 5px 25px; margin:0 0 0 0; background:url(../images/nav_bg_office3.jpg) no-repeat;  }
#nav_col li.office2 a {  text-decoration:none; color:#7F7F7F; font-size:11px; font-weight:normal; }
#nav_col li.office2 a:hover { text-decoration:underline;}
#nav_col li.office3 {padding:0 0 7px 25px; margin:0 0 5px 0; background:url(../images/nav_bg_office2.jpg) no-repeat;  }
#nav_col li.office3 a {  text-decoration:none; color:#83BE41; font-size:13px; font-weight:normal; }
#nav_col li.office3 a:hover { text-decoration:underline;}

#nav_col li.red {padding:13px 0 0 25px; margin:0 0 0 0; background:url(../images/nav_bg_red.jpg) no-repeat; height:27px}
#nav_col li.red a { font-weight:bold; text-decoration:none; color:#CC0000; font-size:13px;}

#nav_col li.top {padding:13px 0 0 25px; margin:0 0 0 0; background:url(../images/nav_bg_top.jpg) no-repeat; height:27px}
#nav_col li.top2 {padding:13px 0 0 25px; margin:10px 0 0 0; background:url(../images/nav_bg_top.jpg) no-repeat; height:27px}

.arrowlistmenu{width: 180px; margin:0 0 0 0;  /*width of accordion menu*/ }

#nav_col li.basket {padding:13px 0 13px 25px; margin:0 0 0 0; background:url(../images/nav_bg_basket.jpg) no-repeat; }


.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
padding:0 0 0 23px;; margin:10px 0 0 0; background:url(../images/nav_bg_office2.jpg) no-repeat;  color: #83BE41; /*bottom spacing between header and rest of content*/
 /*header text is indented 10px*/
cursor: hand;cursor: pointer; float:left; width:150px; font-size:13px;  }
.menuheader a{ text-decoration:none; color:#83BE41;}
.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
}
.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;margin: 0 0 10px 0;padding: 0 0 50px 50px; color: #83BE41;/*bottom spacing between each UL and rest of content*/}

.arrowlistmenu ul li{padding:0 0 0 0; float:left; /*bottom spacing between menu items*/}

.arrowlistmenu ul li a{color: #83BE41;  /*custom bullet list image*/
padding: 0 0 0 0; width:130px; /*link text is indented 19px*/
text-decoration: none; float:left; }

.arrowlistmenu ul li a:hover{color: #83BE41;}

.categoryitems {padding-bottom:50px;}

#not_registered { width:550px;  padding:12px 0 0 0; font-size:11px; color:#999999; text-align:right }

/* --------------PARAGRAPHS & TEXT STYLES------------------------*/

#col_one p{ line-height:160%; padding:0 0 10px 0; }
.bold_blue {font-weight:bold; color:#003D77; font-size:13px;}
.bold_green {font-weight:bold; color:#83BE41; font-size:13px;}
.green { color:#83BE41; }
.big_bold_green {font-weight:bold; color:#83BE41; font-size:16px;}
.big_green { color:#83BE41; font-size:18px;}
.big_bolder_green {font-weight:bold; color:#83BE41; font-size:18px;}
#nav_col p{ line-height:160%; padding:10px 0 10px 0; color:#004B95; }
#nav_col a { color:#004B95; }
#full_span p{ line-height:160%; padding:0 0 10px 0; }
.smalltext {font-size:10px;}
.big_bold_black {font-weight:bold; color:#666666; font-size:16px;}
.bold_grey {font-weight:bold; color:#999999; font-size:11px;}



/* --------------BUTTONS------------------------*/

#blue_button {width:136px; height:21px; background:url(../images/button_blue.jpg) no-repeat; text-align:center; padding:3px 0 0 0; margin:10px 0 0 0;}
#blue_button a {text-decoration:none; color:#FFFFFF; font-weight:bold;}
#blue_button a:hover {color:#A7BEFC; }

#red_button {width:136px; height:21px; background:url(../images/button_red.jpg) no-repeat; text-align:center; padding:3px 0 0 0; margin:10px 0 0 0;}
#red_button a {text-decoration:none; color:#FFFFFF; font-weight:bold;}
#red_button a:hover {color:#F2B6B8; }

#green_button {width:136px; height:21px; background:url(../images/button_green.jpg) no-repeat; text-align:center; padding:3px 0 0 0; margin:10px 0 0 0;}
#green_button a {text-decoration:none; color:#FFFFFF; font-weight:bold;}
#green_button a:hover {color:#E3F0D4; }

/* --------------LISTS------------------------*/

#col_one ul { margin:0 0 20px 20px; padding:0 0 0 0;}
#col_one li { margin:0 0 0 0; padding:5px 0 5px 0; line-height:140%;}
#filter ul {padding:0 0 0 0; margin:0 0 0 0; list-style:none;}
#filter li {padding:13px 0 0 25px; margin:0 0 0 0; background:url(../images/list_bg.jpg) no-repeat; height:15px}
#filter li a {  text-decoration:none; color:#7F7F7F; font-size:13px;}
#filter li a:hover { text-decoration:underline;}
#col_two ul { margin:50px 0 20px 30px; padding:0 0 0 0;}
#col_two li { margin:0 0 0 0; padding:4px 0 4px 0; line-height:120%; font-size:11px; color:#83BE41;}
#col_two li  a { color:#7F7F7F; text-decoration:none;}
#col_two li  a:hover { text-decoration:underline;}

/* --------------MISC------------------------*/

.line_space {padding:5px 0 10px 0;}
.button_space {padding:20px 0 0 0;}
.button_space2 {padding:10px 0 0 0;}

/* --------------FOOTER------------------------*/

#footer {width:987px; height:61px; background:url(../images/bg_footer.jpg) no-repeat;}
.links {width: 100%; margin: auto;position:relative; text-align:center;  padding:5px 0 0 0; color:#999999;   }
.links a{ color:#999999; padding:0 5px 0 5px; font-size:10px; font-weight:normal; text-decoration:none; }

/* --------------LOGIN FORMS-----------------------*/

#form_login {margin:0 0 0 0; padding:0 0 0 0; float:left;}
#form_login input{ width: 146px; height: 15px;border: 1px solid #C0C0C0; background-color:#FFFFFF; padding: 3px; font-size:11px; color:#999999;}
#form_login label { font-weight:bold; color:#83BE41; line-height:160%}
#form_login .btnLogin { width:30px; height:30px; background:url(../images/search.jpg) ; border:none; padding: 0; margin:0 0 0 5px ;  }
#form_login .field_height {height:20px; margin:11px 0 0 0; padding:5px 0 0 5px; width:127px;}

#form_search {margin:0 0 0 0; padding:0 0 0 0; float:left;}
#form_search input{ width: 146px; height: 15px;border: 1px solid #C0C0C0; background-color:#FFFFFF; padding: 3px; font-size:11px; color:#999999;}
#form_search label { font-weight:bold; color:#83BE41; line-height:160%}
#form_search .btnSearch { width:30px; height:30px; background:url(../images/search.jpg) ; border:none; padding: 0; margin:0 0 0 5px ;  }
#form_search .field_height {height:20px; margin:11px 0 0 0; padding:5px 0 0 2px;}

#product_search {margin:0 0 10px 0; padding:0; }
#product_search input{ width: 130px; height: 15px;border: 1px solid #C0C0C0; background-color:#FFFFFF; padding:3px; font-size:11px; color:#999999;}
#product_search label { font-weight:bold; color:#83BE41; line-height:160%}
#product_search .btnSearch { width:30px; height:30px; background:url(../images/model_search.jpg) ; border:none; padding: 0; margin:0 0 0 5px ;  }
#product_search .field_height {height:20px; margin:0 0 0 0; padding:5px 0 0 2px;}

#xerox_search {margin:0 0 10px 0; padding:0; }
#xerox_search .btnSearch { width:30px; height:30px; background:url(../images/model_search.jpg) ; border:none; padding: 0; margin:0 0 0 5px ;  }

/* ----------------------------------------IT---------------------------------------------*/

#it_logos {width:702px; height:102px; background:url(../images/it_logos.jpg) no-repeat;}

.news_image {padding:0 0 30px 0;}


/* ---------------------------------------OFFICE SUPPLIES-------------------------------------------*/

.product_box {float:left; width:134px; height:130px; background:url(../images/product_box_bg.jpg) no-repeat; margin:0 5px 5px 0; text-align:center; padding:0 10px 0 10px; font-size:12px; color:#81B549; font-weight:bold;}
.product_box  a{ color:#ffffff; text-decoration:none;}
.product_box  a:hover { color:#ffffff; text-decoration:underline;}
.small_picture_box {float:left; width:80px;  padding:10px; }
.product_desc {float:left; width:470px; }
.product_price {float:left; width:100px; padding:0 0 0 20px;}
.product_price2 {float:left; width:120px; padding:0 0 0 10px;}
#product_title {width:700px; height:20px; padding:8px 5px 5px 5px; color:#FFFFFF; background-color:#8CB952; font-weight:bold;   font-size:16px; margin-bottom:5px}
#big_picture_box {float:left; width:300px;  padding:10px; }
#product_details {float:left; width:350px; padding:0 10px 0 10px;}
#product_details ul {margin:10px 0 10px 20px; padding:0; line-height:140%;}
#product_details li {margin:0; padding:5px 0 5px 0;line-height:140%; }
#details { float:left; width:150px;  padding:10px 0 0 10px;}
#details p { float:left; width:150px;  padding:10px 0 0 0; font-size:16px; font-weight:bold; color:#83BE41; }
.detail_title {width:130px; height:20px; background-color: #8CB952; color:#FFFFFF; font-weight:bold; text-align:center; padding:5px 0 0 0; margin:10px 0 0 0; }
.detail_box {width:128px; height:20px; text-align:center; padding:5px 0 0 0; border:solid 1px #8CB952;  }
.quantity_menu {width:60px; float:left; margin:5px 70px 0 0; }
.product_menu {width:150px; float:left; margin:5px 0 10px 0; }
#order { margin:0 0 0 0; padding:0 0 0 0; }
.quantity { width:30px; margin-right:10px;color: #7F7F7F;}
#order .label {font-size:16px; font-weight:bold; color:#83BE41; }
#order .btnOrder { width:130px; height:26px; background:url(../images/order.jpg) ; border:none; padding: 0; margin:0 0 0 0 ;  }
#order2 .btnSubmit { width:130px; height:26px; background:url(../images/submit.jpg) ; border:none; padding: 0; margin:0 0 0 0 ;  }
.quantity_box {width:40px;}
.btnUpdate { width:92px; height:23px; background:url(../images/update2.jpg) ; border:none; padding: 0; margin:0 0 0 0 ;  }
.btnDelete { width:92px; height:23px; background:url(../images/delete2.jpg) ; border:none; padding: 0; margin:0 0 0 0 ;  }


#o_box1 {float:left; width:165px; height:348px; background:url(../images/o_box1.jpg) no-repeat;}
#o_box2 {float:left; width:165px; height:348px; background:url(../images/o_box2.jpg) no-repeat;}
#o_box3 {float:left; width:165px; height:148px; background:url(../images/o_box3.jpg) no-repeat;}
#o_box4 {float:left; width:165px; height:148px; background:url(../images/o_box4.jpg) no-repeat;}
#o_box5 {float:left; width:165px; height:148px; background:url(../images/o_box5.jpg) no-repeat;}

#page_links {width:600px;  margin:10px auto 0 auto; height:20px;  text-align:center;}
#page_previous  a{float:left; color:#83BE41; font-weight:bold; font-size:13px;  }
#page_numbers {float:left;  }
#page_links  a{color:#83BE41; font-weight:bold; font-size:13px;  padding:0 5px 0 5px; }
#page_next  a{float:left;  color:#83BE41; font-weight:bold; font-size:13px;  }

#page_links2 {width:600px;  margin:10px auto 0 auto; height:20px;  text-align:center;}
#page_previous2  a{float:left; color:#C60405; font-weight:bold; font-size:13px;  }
#page_numbers2 {float:left;  }
#page_links2  a{color:#C60405; font-weight:bold; font-size:13px;  padding:0 5px 0 5px; }
#page_next2  a{float:left;  color:#C60405; font-weight:bold; font-size:13px;  }

.nav_spacing {line-height:200%;}


/* ---------------------------------------XEROX-------------------------------------------*/

.small_picture_xerox {float:left; width:150px;  padding:0 10px 0 0; }
.xerox_desc {float:left; width:500px; }
.red_text {color:#CC0000;}
.download_brochure {float: left; width:167px; height:20px; background:url(../images/download_brochure.jpg) no-repeat;text-align:center;  padding:2px 0 0 0; margin:0 10px 0 0;}
.download_brochure a {color:#FFFFFF; font-weight:bold;  font-size:13px; text-decoration:none;}
.download_brochure a:hover { text-decoration:underline;}

#extra {float:left; width:730px; }
#bottom_links {width:700px; margin:40px 0 0 0;}

/* ----------------------------FORMS--------------------------------*/

label {font-size: 11px;font-weight: normal; color:#7F7F7F;}
fieldset{border: none;}
#form legend { margin: 5px 0 5px 8px;	 padding-bottom: 5px;border-bottom: dotted #ccc 1px;}
#form label {display:block;float:left;width: 60px;text-align:right;margin: 0 5px 0 0; padding-top:5px}
#form p { display:block;clear:both; padding:2px 0 2px 0; }
legend {display:block; clear:both; font: normal 18px "trebuchet MS", Arial; color:#000000; }
input, select, option, textarea {border: 1px solid #999999;background-color: #FFFFFF;color: #000; width: 250px; padding:3px 0 0 3px }
.field_height {height:20px;}
form {padding:0 0 0 0;}


address {float:left; width:190px; font-style:normal; font-size:11px; margin:10px 0 30px 0;}
address.two {float:left; width:190px; font-style:normal; font-size:11px; margin:10px 0 30px 0;}

.registration


#xerox_enquiry {padding:0; margin:0;}

/* ----------------------------TABLE STYLING--------------------------------*/

table#detail {    background-color:#FFFFFF;    border: solid #FFFFFF 3px;    width: 100%;}
table#detail td {    padding: 5px;    border: solid #FFFFFF 1px;}
.data {    color: #7F7F7F;    text-align: left;    background-color: #FFFFFF;}
.toprow {    font-style: italic;    text-align: left;    background-color: #8CB952; color:#FFFFFF;}

#breadcrumb {float:left; width:660px;  text-align:center; padding:10px;}
#breadcrumb a{ font-weight:bold; color:#8CC13F;}

/* ---------------------------SITEMAP--------------------------------*/

#sitemap li {padding:0 0 0 0;}
#sitemap li a{ text-decoration: none; color: #003D77; font-weight:bold;}