/*
CSS - TIWI DESIGN
*/

/* layout styles */
* {padding: 0;	margin: 0;}/* this will reset all elements to margin/padding = 0 */
body {margin: 0; padding: 0; background: #fff;}

img { border: 0; }

#container {margin: 0 auto; padding: 0; width: 995px; margin-top: 15px;}

#banner-container { margin: 0 auto; padding: 0; width: 995px;height:215px; background:#FFFFFF; }
body#fabric #banner-container { position:absolute; top: 14px; display:block; z-index:0; }

#banner-logo1 {width:195px; background:#ffb82e; float:left;height:215px;}
#banner-logo2 {width:531px; background:#ffb82e; float:left;height:215px;}
#banner-address {width:195px; background:#d38b02; float:left;height:215px;}
#banner-dots {width:74px; height:215px; background:#FFF url(../images/dots.gif) no-repeat; float:right;}

#fabric-promo {
	background: url(../images/fabric-promo.jpg) no-repeat 0 0;
	width: 253px;
	height: 214px;
	z-index: 400;
	position: relative;
	top: -1px;
	left: 474px;
}

#main-container {margin: 0 auto; padding: 0; width:995px;}

#navigation {
	width:195px;
	height: 306px;
	background:#d38b02;
	padding: 0;
	float:left;
	margin: 0;
	display: block;
}
#navigation a { padding: 0; margin: 0; }
#navigation p, #navigation h2 {
	background: #fff;
	padding-top: 0px;
	width: 195px;
}	
#main {width:515px; float:left; padding:0 15px 0 11px;}
#main2 {width:531px; float:left; display: block;}
#flash {width:531px; height:306px; display: block;}

#cta-right {width:195px; height: 306px; float:right; background:#d38b02; display: block; position: relative; right: 74px;}

#footer {width:740px; margin: 50px 0 0 100px; padding-top:15px; border-top:1px solid #999; text-align:center; display: block; height: 100px;}
#footer-container {width:740px; margin: 0 auto; padding: 0px;}
#footer-01 {float:left; width:250px; text-align:center; padding-top:30px;}
#footer-02 {float:left; width:160px; text-align:center; padding-top:30px;}
#footer-03 {float:left; width:330px; text-align:center;}

.hidden {display:none;}

#products {float:left; width:150px; height: 215px; text-align:center; margin:0 9px 25px 9px;}
#products p {height: 37px;}
#item {width:100px; height:100px; padding:0 0 15px 0px; margin: 0 auto;}
#item-large {width:179px; margin: 0 auto; padding: 0;}

#news-title{float:left; width:320px; height:48px; background:url(../images/icon-news.gif) no-repeat; padding:15px 0 0 50px;}
#news-date {float:right; width:145px; height:48px; text-align:right; padding:15px 0 0 0;}
#news-img {float:right; margin: 0 0 10px 10px;}

#cart-snippet {text-align:right; position:relative; top: -39px;}
#cart{width:515px; height:auto;}
 
/* nav */
ul#nav {list-style:none;height:192px;}
ul#nav li {float:left;text-indent:-9999px;overflow:hidden;}
ul#nav li a {display:block;}
ul#nav li a:hover {background-position: -65px!important;}

ul#nav li#home a {background:url(../images/nav/home.gif) no-repeat 0 0;width:65px; height:64px;} 
ul#nav li#about a {background:url(../images/nav/about.gif) no-repeat 0 0;width:65px; height:64px;} 
ul#nav li#artists a {background:url(../images/nav/artists.gif) no-repeat 0 0;width:65px; height:64px;} 
ul#nav li#gallery a {background:url(../images/nav/onlinegallery.gif) no-repeat 0 0;width:65px; height:65px;}
ul#nav li#fabricgallery a {background:url(../images/nav/fabricgallery.gif) no-repeat 0 0;width:65px; height:65px;} 
ul#nav li#news a {background:url(../images/nav/news.gif) no-repeat 0 0;width:65px; height:65px;} 
ul#nav li#contact a {background:url(../images/nav/contact.gif) no-repeat 0 0;width:65px; height:63px;} 
ul#nav li#space {background:url(../images/nav-piece.gif) no-repeat 0 0;width:130px; height:63px;}

div#footer a {font:10px Verdana, Arial, Helvetica, sans-serif; text-decoration:none; color:#666;}
div#footer a:hover {text-decoration:underline; color:#d38b02;}

div#main a {font:11px Verdana, Arial, Helvetica, sans-serif; color:#000; text-decoration:none;}
div#main a:hover {color:#d38b02; text-decoration:underline;}

div.semi-transparent {
	position: relative;
	top: -410px;
	left: 0px;
	background: url(../images/alpha-bg.png) repeat-x;
	width: 194px;
	display: block;
	z-index: 200;
	border-left: 1px solid #FFFFFF;
}
.semi-transparent p {
	font:10px Verdana, Arial, Helvetica, sans-serif; color:#f0f0f0; text-decoration:none;
	margin: 2px 4px 3px 8px;

}

/* font styles */

div#navigation h2 {font:14px Verdana, Arial, Helvetica, sans-serif; color:#d38b02; font-weight:bold; padding: 20px 0 20px 0;}
div#navigation p {font:11px Verdana, Arial, Helvetica, sans-serif; color:#666; line-height:18px; padding:0 0 15px 0;}

div#footer p {font:10px Verdana, Arial, Helvetica, sans-serif; color:#666; line-height:18px; padding:0 0 15px 0;}
div#footer-03 p {font:10px Verdana, Arial, Helvetica, sans-serif; color:#666; padding:40px 20px 15px 20px;}

div#main h1 {font:16px Verdana, Arial, Helvetica, sans-serif; color:#d38b02; padding: 20px 0px 20px 0px;}
div#main h2 {font:14px Verdana, Arial, Helvetica, sans-serif; color:#666; padding:0 0px 10px 0px; text-transform:uppercase;}
div#main h3 {font:12px Verdana, Arial, Helvetica, sans-serif; color:#666; padding:0 0 10px 0; font-weight:bold; text-transform:uppercase;}
div#main h4 {font:12px Verdana, Arial, Helvetica, sans-serif; color:#d38b02; padding:0 50px 10px 50px; font-weight:bold; font-style:italic;}
div#main h5 {font:11px Verdana, Arial, Helvetica, sans-serif; color:#666; padding:0 0 5px 0; font-weight:normal;}
div#main p {font:11px Verdana, Arial, Helvetica, sans-serif; color:#666; padding:0 0 10px 0; line-height:18px; }
div#main i {color:#d38b02;}

/* styles */
.imgleft{padding:5px 15px 15px 0;}
.imgright{padding:5px 15px 15px 15px;}

.clearfix:after {
    content: "."; 
    clear: both; 
    display: block; 
    height: 0; 
    visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


a.pdf{background:url("../images/icon-pdf.gif") no-repeat; padding: 2px 2px 2px 20px;}


/*---------------------------------------------   
    forms
----------------------------------------------*/
form.form fieldset,
form.form ol, 
form.form li, 
form.form legend {
	margin: 0;
	padding: 0;
}

form.form fieldset { border: 0; }

form.form ol { list-style: none; }

form.form li { margin-bottom: 5px; }

form.form label {
	display: inline-block;
	width: 150px;
	font:11px Verdana, Arial, Helvetica, sans-serif; color:#666;
}

form.form input, form.form select, form.form textarea {
	width: 250px;
	padding: 3px;
	border: 1px solid #ddd;
	background: #fff;
	font: normal 13px/13px Verdana, Arial, Helvetica, sans-serif;
	color: #333;
}

form.form textarea { height: 200px; }

form.form select {
	padding: 0;
	width: auto;
}

form.form li.button { margin-top: 15px; }

form.form li.button input {
	width: auto;
	border: 0;
	background: #f6e8cc;
	color: #744d03;
	cursor: pointer;
	border:1px solid #d38b02;
}

form.form fieldset legend {
	padding: 20px 0;
	font-weight: bold;
	font-size: 18px;
	color: #444;
	_margin: 0 -7px; /* IE Win fix */
}

/* IE Mac legend fix */
form.form legend {
  display: inline-block;
}

select{margin:5px; width:150px;}