﻿/*
    Blue   : #78a4c1
Light Blue : #d6e4ec
    Grey   : #818181
    Orange : #f09100
*/

/*****************************
   Tags
*****************************/
body { font-family:Arial; font-size:12px; color:#333; background-color:#d9d9d9; }

h1, h2, h3 { font-weight:normal; }

h2 { font-size:26px; line-height:34px; color:#7da7c2; font-family:Verdana,Arial; margin-bottom:5px; }
h3 { font-size:14px; color:#f09100; font-weight:bold; margin-bottom:20px; text-transform:uppercase; }
h4 { font-size:14px; color:#78a4c1; font-weight:bold; }
/*h4 { font-size:14px; color:#818181; border-bottom:solid 1px #818181; padding-bottom:5px; margin-bottom:20px; text-transform:uppercase; }*/
h5 { font-weight:bold; color:#f09100; }
p { margin-bottom:10px; line-height:17px; text-align:justify; }

a { color:#78a4c1; text-decoration:none; }
a:hover { color:#f09100; text-decoration:underline; }



sup { vertical-align:super; }


/*****************************
   Layup
*****************************/
#page_shadow { position:fixed; top:0; }
.shadow { height:9px; width:100%; background:url(../_images/layup/page_shadow.png) repeat-x left top; }

#wrapper { position:relative; margin:auto; width:949px; background:#fff url(../_images/layup/bg_content.png) repeat-y left top; border:solid 1px #7da7c2; border-top:none; }

#header { position:relative; padding:108px 0 31px 0; background-color:#fff; }
#logo { position:absolute; top:84px; left:32px; width:266px; height:71px; }
#logo a { display:block; width:266px; height:71px; background:url(../_images/layup/logo.png) no-repeat left top; }
#logo span { display:none; }
#clock { position:absolute; top:75px; right:5px; text-align:right; color:#999; font-size:11px;  }

#comms_search { position:absolute; top:0; background:url(../_images/layup/comms_search.jpg) no-repeat left top; width:949px; height:38px; padding-top:9px; }
#comm_details { float:left; text-align:left; color:#999; letter-spacing:1px; margin-left:15px; padding:5px; font-size:10px; }
#comm_details strong { color:#f09100; }

#comms_search .search_area { float:right; width:305px; margin:5px 10px 0 0; }
#comms_search .search_area label { float:left; font-size:10px; margin:4px 4px 0 0; color:#8f8f8f; }
#comms_search .search_area .search_txt { float:left; width:150px; height:12px; padding:3px; font-size:10px; border:solid 1px #a0a0a0; border-right:none; }
#comms_search .search_area .search_btn { float:left; width:23px; height:20px; border:solid 1px #a0a0a0; border-left:none; background:#a0a0a0 url(/_images/btn_search.jpg) no-repeat center center; }


/** Menus
*****************************/
ul.menu { padding-left:348px; text-transform:uppercase; height:27px; background:url(../_images/layup/bg_menu.png) repeat-x left top; }
ul.menu li { float:right; margin:0 3px 0 3px; font-size:12px; font-weight:bold; text-transform:uppercase; text-align:center; }
ul.menu li a { display:block; height:23px; line-height:23px; padding:2px; color:#78a4c1; }

ul.menu a.selected, 
ul.menu li a:hover { color:#f09100; text-decoration:none; }

ul.menu li.spacer { height:27px; padding-right:7px; background:url(../_images/layup/bg_menu_spacer.png) no-repeat right center; }

ul.menu li.home, 
ul.menu li.email { float:right; width:27px; height:27px;  }
ul.menu li.home a, 
ul.menu li.email a { display:block; padding:0; height:27px; width:27px; background-position:center top; background-repeat:no-repeat; }
ul.menu li.home a { background-image:url(../_images/layup/bg_menu_home.png); }
ul.menu li.email a { background-image:url(../_images/layup/bg_menu_email.png); }
ul.menu li.home a:hover { background-position:center bottom; }
ul.menu li.email a:hover { background-position:center bottom; }

/** Fly-out menu
*****************************/
ul.menu {  }
ul.menu ul { position:absolute; overflow:hidden; /*width:208px; */ display:none; background:#7da7c2; z-index:20000; opacity:0; }
ul.menu ul li { text-align:left; display:block; float:none; margin:0; font-size:11px; text-transform:none; font-weight:normal; white-space:nowrap; }
ul.menu ul li a { text-transform:uppercase; display:block; height:20px; line-height:20px; padding:0px 10px; color:#fff; white-space:nowrap;  }
ul.menu ul li a:hover { position:relative; color:#fff; background-color:#f09100; filter:alpha(opacity = 100); }


/** Sub Header
*****************************/
h2#ss-service-centre { height:55px; background-image:url(/_images/stainless-steel-service-centre.png); background-repeat:no-repeat; background-position:25px center; }

#sub_header { height:120px; background-repeat:no-repeat; background-position:left top; background:#f09100; }
#sub_header .shadow { position:absolute; z-index:100; }

#overlay { position:absolute; left:32px; z-index:101; text-align:center; width:269px; height:80px; padding-top:40px; background-color:#78a4c1; background-repeat:repeat; background-position:left top; }

#footer { position:relative; margin:auto; font-size:10px; width:951px; text-align:left; padding:0 0px; color:#999; background:url(../_images/layup/bg_footer.png) repeat-x left top;  }
#footer #copyright { margin-right:120px; height:20px; line-height:20px; }
#footer a.site-by-fdg { float:right; width:76px; height:20px; background:url(../_images/layup/site-by-fdg.png) no-repeat center center; }


/** Content
*****************************/
#content_container { /*background:url(../_images/layup/bg_content.png) repeat-y left top;*/ }
#content_side { float:left; margin-left:32px; width:219px; padding:25px 25px 84px 25px; background-color:#d6e4ec; }
#content_side .aCenter { margin-top:25px; }
#content_side img { margin-bottom:25px; border:solid 1px #78a4c1; }
#content_side h4 { color:#000; border-bottom:solid 1px #000; padding-bottom:5px; margin-bottom:10px; text-transform:uppercase; }

#content_side_footer { position:absolute; bottom:0; left:32px; width:269px; height:84px; background-color:#78a4c1; }
#content_side_footer .bsi { position:absolute; left:10px; width:84px; height:84px; background:#78a4c1 url(../_images/bsi_logo.png) no-repeat center center; }
#content_side_footer a { position:absolute; top:35px; left:115px; font-size:10px; padding-right:30px; line-height:13px; color:#fff;  }

#content_main { margin-left:301px; padding:25px 35px; padding-bottom:100px; }
#content_main ul { list-style-type:square; margin-bottom:10px; padding:0px 15px; }
#content_main ul li { margin:5px; line-height:17px; text-align:justify; color:#f09100; }
#content_main ul li span { color:#333; }

/** Sub (content) menu
*****************************/
ul#sub_menu { text-transform:uppercase; color:#818181; }
ul#sub_menu li { font-weight:bold; display:block; margin-bottom:5px; }
ul#sub_menu li a { display:block; font-weight:normal; color:#000; font-size:13px; height:15px; line-height:15px; padding:2px 2px 2px 20px; background-image:url(../_images/layup/arrows.png); background-repeat:no-repeat; background-position:2px 5px; }
ul#sub_menu li a.selected,
ul#sub_menu li a:hover  { text-decoration:none; background-position:2px -15px; background-color:#b0cadb; }

ul#sub_menu ul li { margin-left:20px; }
ul#sub_menu ul li a { display:block; font-weight:normal; color:#666; height:15px; line-height:15px; padding:2px 2px 2px 2px; background:none; }
ul#sub_menu ul li a:hover { text-decoration:none; background-position:2px -15px; background-color:#b0cadb; }

ul#sub_menu ul { margin:5px 0; }



a.arrow_link { padding:5px 0; padding-left:25px; background-image:url(/_images/pdf-icon.png); background-repeat:no-repeat; background-position:left center; }
a:hover.arrow_link {  }

/** Tables
*****************************/
.links { width:90%; margin-left:5%; }
.links th,
.links td { padding:10px; vertical-align:middle; background-color:#eee; }
.links th { text-align:left; font-weight:normal; }
.links td { width:110px; text-align:right; font-size:10px; }

.links .alt th,
.links .alt td { background-color:#fff; }

.products { width:100%; margin-top:30px; color:#666; border-collapse:separate;  }
.products th,
.products td { margin:0; padding:10px; vertical-align:middle; background-color:#eee; border-bottom:solid 10px #fff; }
.products th { color:#000; text-align:center; font-weight:normal; background-color:#fbe4cd; border-right:solid 3px #fff; }
.products td { background-color:#e4edf3; color:#666; text-align:center; }
.products td:first-child { text-align:left; }

.products th.h2 { background-color:#fbcfa3; border-right:none; }

.products td.yes { background:#e4edf3 url(/_images/layup/black_disc.png) no-repeat center center; }
.products td.no { background:#e4edf3 url(/_images/layup/black_circle.png) no-repeat center center; }
.products td.yes span,
.products td.no span { visibility:hidden; }



.downloads { width:90%; margin-left:5%; color:#666; border-collapse:separate;  }
.downloads th,
.downloads td { margin:0; padding:10px; vertical-align:middle; background-color:#eee; border:solid 1px #eee; }
.downloads th { text-align:left; font-weight:normal; border-right:none; }
.downloads td { width:110px; text-align:right; font-size:10px; border-left:none; }

.downloads th.icon { padding-left:40px; background-position:10px center; }

.downloads .alt th,
.downloads .alt td { background-color:#fff; border-color:#fff }

.downloads tr:hover th,
.downloads tr:hover td { border:solid 1px #999; color:#000; }
.downloads tr:hover th { border-right:none; }
.downloads tr:hover td { border-left:none; }

.downloads.notd tr:hover th { border:solid 1px #999; }


/** Forms
*****************************/

label { font-size:13px; color:#172983; font-weight:bold; }

/*
.row { margin-bottom:10px; }
.row label { display:block; margin-bottom:3px; font-size:13px; color:#172983; font-weight:bold; }
.row input[type="text"],
.row textarea { width:90%;  } */

.contact_address { float:left; width:290px; padding-right:0px; margin-bottom:20px; }
.contact_address_map { float:right; width:310px; padding-left:30px; margin-bottom:20px; border-left:solid 1px #999; }

.contact_form { margin-top:50px; }
.contact_form .row { display:block; margin-bottom:10px; }
.contact_form .row label { float:left; width:150px; margin:5px 10px 0 0; color:#666; font-weight:normal; text-align:right; font-size:11px; }
.contact_form .row input[type="text"] { width:300px; background-color:#e6e6e6; border:solid 1px #f09100; padding:2px;  }
.contact_form .row textarea { width:300px; background-color:#e6e6e6; border:solid 1px #f09100; padding:2px; font-family:Arial;  }
.contact_form .row select { }

.contact_form .row.btns { padding-left: 160px; }

.contact_address label { margin-top:2px; line-height:17px; }

.address_col { padding-left:70px; }

#map { height:398px; border:solid 1px #818181; }


/*****************************
   Icons
*****************************/
.icon { min-height:20px; line-height:20px; display:block; padding-left:20px; background-repeat:no-repeat; background-position:left center; }
.icon.pdf { background-image:url(/_images/pdf-icon.png); }
.icon.wmp { background-image:url(/_images/icon_wmp.png); }
.icon.qt { background-image:url(/_images/icon_qt.png); }



.get_adobe_reader { border:dotted 1px #ccc; margin-top:50px; padding:10px; font-size:11px; color:#999; }
.get_adobe_reader a { float:right; display:block; width:112px; height:33px; margin:0; padding:0;  }
.get_adobe_reader p { margin:0; margin-right:135px; }





/*****************************
   Site Specific Classes
*****************************/
.blue { color:#7da7c2; }
.grey { color:#818181; }
.orange { color:#f09100; }

.mTop10 { margin-top:10px; }
.pad20 { padding:20px; }
.borderRight { border-right:solid 1px #999; }


/*****************************
   Useful Classes
*****************************/

.bold { font-weight:bold; }
.aCenter { text-align:center; }
.aLeft { text-align:left; }
.fLeft { float:left; }
.fRight { float:right; }
.fNone { float:none; }
.clear { clear:both; }
.hide { display:none; }

.larger { font-size:larger; }

.lighter { color:#999; }
