/*
	 * DIN Tile @2008
	 * Screen CSS
	 *
	 *
	 */


@import "din-typo.css";

html, body, div, p, blockquote, h1, h2, h3, h4, h5, h6, form, fieldset, legend, ul, ol, li, dl, dt, dd, a, img, address, strong, em
	{ margin: 0; padding: 0; font-weight: normal; font-style: normal; list-style: none; border: 0; outline: none; }

h5 {color:#666666; font-weight:bold; size:11px;}	

a span { cursor: pointer; }
form legend { display: none; }

html { background: #fff url(../images/bg-html.png) repeat-x; }
body { font: normal 0.68em/1.4em 'Trebuchet MS', Tahoma, Helvetica, sans-serif; }


.aural { position: absolute; left: -100em; }

a { color: #5e5e5e; text-decoration: none; }
a:focus, a.focus, a:hover { color: #a1a1a1; text-decoration: underline; }

/* main */
#wrap { width:998px; margin:14px auto; background: #fff; overflow:hidden; height:100%; }

#top { height:126px; width:998px; background:url(../images/top_01.jpg) no-repeat 5px top; }
#top h1 { margin-left:450px; }
#top strong { position: absolute; left: -2000em; }
#middle { height:118px; width:791px; margin-bottom:2px; /*background:url(../images/middle-bg.png) no-repeat bottom;*/ }
#middle-big { width:998px; height:109px; margin-bottom:6px; padding-top:2px; padding-left:2px; /*background: url(../images/bg-middle-big.png) top; */ }
#middle-big span { display:block; width:250px; float:left; margin-top:23px; color:#fff; font:italic 15px "Myriad Pro", "Trebuchet MS", "Tahoma", Arial, Helvetica, sans-serif; }

#middle img,
#middle-big img { float:left; }

/* left */
#left { width:990px; float:left; }
#top #menu { height:23px; width:943px; padding-left:24px; background:url(../images/bg-menu_1.png) no-repeat; font:11px Verdana, Arial, Helvetica, sans-serif; margin-left: 15px; }
#top #menu li { float:left; }
#top #menu li a {  line-height:23px; text-decoration:none; }

.photos li {background:#9FD8E2; padding-top:2px; padding-left:2px; width:69px; height:69px; margin-right:8px}
.photos_supplier li {text-align:center; color:#0b2c86; background:#9FD8E2; padding-top:2px; padding-left:1px; padding-right:1px; width:69px; height:100px; margin-right:8px}
#gallleryItemWrapper { margin-bottom:10px}
#gallleryItemWrapper .galleryItem {background:#9FD8E2; padding-top:2px; padding-left:2px; width:69px; height:69px; float:left;}
#gallleryItemWrapper .itemDescription {float:left; width: 320px; height:auto; margin-left:5px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px; color:#666666;}

/* locations */
.locations ul {border-right:2px solid #3EB1C4;}
.locations ul li {margin-bottom:10px}
.locations ul li a { 
	display:block; 
	height:17px; 
	margin-bottom:5px; 
	padding-left:20px; 
	color:#3EB1C4; 
	background:url(../images/faq-pointer.png) no-repeat left center; 
	font:italic 17px "Myriad Pro", "Trebuchet MS", "Tahoma", Arial, Helvetica, sans-serif; 
	text-decoration:none; 
}
.locations .red {color:#E13625;}

#content ul.questionFindTiler li {margin:3px 0px;}

/* right */
#right-small { float:left; width:256px; }
#right-small form { margin-left: 9px; }
#right-small form input,
.supplier-name form input { width:200px; } /* 6 */
#right-small form label.label-how,
.supplier-name label.label-how { width:76px; }
#right-small form label.label-feedback,
.supplier-name label.label-feedback { width:54px; }
#right-small form input.how,
.supplier-name input.how { width:164px; }
#right-small form input.submit,
.supplier-name input.submit { width:44px; margin-left:198px; background:#df3726; }
#right-small form textarea.feedback,
.supplier-name textarea.feedback { height:131px; width:186px; } /* 6 */

form label { float:left;  height:16px; width:40px; padding-top:2px; }
form label.label-how { width:136px; }
form label.label-feedback { width:58px; padding-top:10px; }
form input { height:16px; width:264px; background:#fff; border:1px solid #d9d9d9; }
form input.how { width:168px; }
form input.submit { width:44px; height:17px; margin: 10px 0 0 262px; padding: 2px 0 4px; border: none; color:#fff; background:#0097b1; font:9px Verdana, Arial, Helvetica, sans-serif; text-align:center; text-transform:uppercase; }
.blue-button {width:auto; height:19px; margin: 10px 0 0; line-height:20px; padding: 2px 4px 6px; border: none; color:#fff; background:#0097b1; font:9px Verdana, Arial, Helvetica, sans-serif; text-align:center; text-transform:uppercase;}
form textarea { height:67px; width:246px; border:1px solid #d9d9d9; background:#fff; }

/* product pages */
.product-tile-tip-heading {color:#0097b1; font-size:14px; font-weight:bold; font-style:italic; margin-bottom:15px}
.boxing {display:block; min-height:50px; width:233px; color:#fff;}
.boxing .boxing-top {background:url(../images/products/box-top.png) no-repeat top left transparent; width:233px; height:14px;}
.boxing .boxing-bottom {background:url(../images/products/box-bottom.png) no-repeat top left transparent; width:233px; height:14px;}
.boxing .boxing-body {background:url(../images/products/box-bg.png) repeat-y top left transparent; width:233px; overflow:hidden; height:100%;}
.boxing .boxing-body .boxing-title {color:#0097b1; font-size:16px; font-family:"Myriad Pro","Trebuchet MS","Tahoma",Arial,Helvetica,sans-serif; font-weight:bold; padding:3px 15px; width:205px; font-style:italic;}
.boxing .boxing-body .boxing-divider {background:url(../images/products/box-divider.png) repeat-x top left transparent; width:201px; height:7px; margin:0 auto;}
.boxing .boxing-body .boxing-content {width:201px; margin:3px auto; height:100%; color:#fff;} 

.swimming-photos {list-style-type:none; width:440px;}
.swimming-photos li {display:block; float:left; margin-right:5px; margin-bottom:5px; width:213px; height:139px;}

/* contact us - store list */
.storeListContactUs {list-style-type:none; width:302px; margin-top:1em;}
.storeListContactUs li {float:left; width:150px;}

/* footer */
#footer { margin-top:0px; width:948px; height:27px; clear:both; padding-left:50px; background:url(../images/bg-footer.png) no-repeat top; font:9px/16px Verdana, Arial, Helvetica, sans-serif;  }
#footer li { float:left; }
#footer li a { display:block; padding-right:27px; margin-right:10px; color:#fff; background:url(../images/separator-footer.png) no-repeat 100% 50%; text-decoration:none; }
#footer li a.last {background-image: none; }

.itemDescription strong {font-weight:bold;}