/* ~-~-~~-~-~ CSS Document -~-~-~-~-~ *\
					|                                      |
					|              Created for             |
					|        Outdoor Collections.com       |
					|                  and                 |
					|           Teak Warehouse.com         |
					|           by Ashton Sanders          |
					|         WebsitesinaFlash.com         |
					|                                      |
					\* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */

/* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~ LAYOUT -~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */


body {
	margin: 23px auto 10px;
	text-align:center;
	color: #838489;
	font-size:14px;
	font-family:  Arial, Helvetica, sans-serif;
	behavior: url(csshover2.htc);
	background: #333;
}

.container {
	clear:both;
	margin:0 auto;
	text-align:left;
	width:974px;
	z-index:10;
}

.greybar {
	padding:6px 0 0; 
	height: 20px;
	background:#838489;
	color:#FFF;
	text-transform:uppercase;
	font-size:14px;
	line-height:16px;
}

#out {
	height:610px;
}

#container {
	height:610px;
	background: url('../images/orangeline.gif') repeat-x 0 72px;
}

#logo {
	maring-right: 0; /*30px;*/
}

a img { border:0px;}

#footer {
	background: url('../images/orangeline.gif') repeat-x;
	padding-top:8px

}

#seof {
	width: 965px;
	margin: 140px auto 0;
	text-align:left
}
#seof h1 { color:#999999}

#scrollbox {
	font-family: Arial, Helvetica, sans-serif;
	color:#a7a7a7;
	background-color:#333;
	margin:0 20px 0 0;
	padding:0 5px;
	font-size:14px;
	width:300px;
	height:420px;
	overflow:auto;
	float:right;
}

#scrollbox p { margin-top:0;} 
#scrollbox a { color:#FFFFFF} 
#scrollbox h2 {font-size:14px; color: #9c6728; font-weight:100; }

#leftlogo {
	height:109px;
	width:941px;
}

/* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~ LEFT COLUMN -~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */

#left {
	margin: 8px 0 0 16px;
	padding-left: 0px;
	float:left;
	width: 221px;
	height:460px;
	text-align:left;
	clear:left;
	font-family:Arial,Helvetica,sans-serif
}
#left img {
}

#left ul {
	list-style:none;
	margin:0;
}

#left ul.leftprods {
	float:left;
	width: 109px;
	padding: 10px 0 0 0;
	font-family:"Arial Narrow", Arial, Helvetica, sans-serif;
}

#left ul.leftprods li {
	list-style:none;
	margin: 0 0px 5px 0;
	padding: 0;
	width: 100px;
	font-size: 12px;
	text-align:center;
}

#left ul.leftprods li, #left ul.leftprods a {
	color:#a7a7a7;
	text-decoration:none;
}

#left ul.leftprods span.navimg {
	display:block;
	width: 70px;
	height:70px;
	border: 1px solid #838489;
	background-position: top center;
	background-repeat:no-repeat;
	margin: 0 auto;
}

ul.leftcat {
	padding:0;
	margin-top:-10px;
}

ul.leftcat li {
	font-size: 13px;
	font-weight: 100;
	text-decoration:none;
	text-transform:uppercase;
	margin:6px 0;
}

ul.leftcat li a, a {
	text-decoration:none;
	color:#a7a7a7;
}

ul.leftcat li h2 {
	text-decoration:none;
	color:#a17938;
	margin:5px 0 0;
	padding:0;
	font-weight:100;
	font-size:18px;
}

ul.leftcat a:hover, ul.leftcat a.selected, a:hover {
	color:#FFFFFF;
}

/* -- Added #left to the next three... ? */
a.hover span {display:none}
a.hover {
	display:block;
	height:62px;
	width:166px;
	background: url('../images/home/ocsitelink.gif') top left;
}

a:hover.hover {
	background-position:top right;
}

/* ~-~- Classifications/COMMERCIAL/MAIN CAT PAGES -~-~-~ */

#content ul.classprods{
	margin:0;
	padding-left: 20px;
	font-family:"Arial Narrow", Arial, Helvetica, sans-serif;
}

#content ul.classprods li {
	text-transform:uppercase;
	list-style:none;
	margin: 0 20px 20px 0;
	width: 110px;
	height:126px;
	float:left;
	font-size: 12px;
	font-weight:100;
	text-align:center;
}

#content ul.classprods .navimg{
}

#content ul.classprods li, #content ul.classprods a {
	color:#838489;
	text-decoration:none;
}

#content ul.classprods span.navimg {
	display:block;
	width: 110px;
	height: 88px;
	background-position: top center;
	background-repeat:no-repeat;
	margin: 0 auto;
	border: solid #999999;
	border-width: 0 1px 1px 1px;
}

.commerce {
	height: 486px;
}

.pagenums{
	margin-right:20px ;
	margin-bottom: 10px;
}

.pagenums b{
	color: #fff;
	font-weight:100;
}

.pagenums a{
	color: #a17938;
}




/* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~ NAVIGATION BAR -~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */

#navbar{
	text-transform:uppercase;
}

#navbar ul#nav1{
	margin:0;
	padding:0;
}

#navbar ul {
	list-style:none;
	margin:0;
	margin:0;
}

#navbar li{
	float:left;
	height:20px;
}

a.dd {
	cursor:default;

}


#navbar li.nav0 {width:108px;}
#navbar li.nav1 {width:138px; }
#navbar li.nav5 {width:118px;}
#navbar li.nav6 {width:80px;}
#navbar li.nav65{width:230px;}
#navbar li.nav7 {width:110px;}
#navbar li.nav8 {width:120px;}

#navbar li a.nav {
	padding:0 17px;
	margin:0 ;
	display:block;
	color:#FFF;
	text-decoration:none;
	font-size:14px;
	line-height:16px;
	border-left:1px solid #4E4E50;
	text-align:center
}

#navbar li.nav0 a.nav{border:none}

#navbar li a.nav:hover, #navbar li a.current {
	color: #333;
}

/*#navbar a span {display:none;}
*/
ul#nav1 li ul { display:none}
ul#nav1 li:hover ul {display:block;}
ul#nav1 li ul:hover {display:block;}


ul#nav1 li ul#dropdownmenu {
	position:absolute;
	top: 155px;
	width: 178px;
	padding:2px 10px 12px;
	background: #a17938;
	text-align:left; 
	z-index:900;
	font-size:12px;
	text-align:left;
}

ul#nav1 li ul#dropdownmenu li h2 {
	font-weight:100;
	margin: 10px 0 0;
	color:#FFF;
}

ul#nav1 li ul#dropdownmenu li {
	padding: 3px 15px 0px 0;
	float:none;
	height:auto;
	line-height:normal
}
ul#nav1 li ul#dropdownmenu li.widthtopli {
	width:166px;
}

ul#nav1 li ul#dropdownmenu li a {
	font-size:12px;
	text-decoration:none;
	color:#333;
/*	font-weight:600; */
}

ul#nav1 li ul#dropdownmenu li a:hover, ul#nav1 li ul#dropdownmenu li a.selected {
	color:#CCC;
}


/* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~ CONTENT -~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */


/* ~-~-~~-~-~-~-~ Product Pages ~-~-~~-~-~-~-~ */

#content {
	width: 685px;
	float:right;
	margin-right: 0;
	text-align:right;
	padding:10px 0 0 0;
	font-family: Arial, Helvetica, sans-serif;
}

#prodstats {
	width: 210px;
	float:right;
	padding: 0 16px 0 0;
	color: #A7A7A7;	
}

#prodstats img {
	float:right;
	margin-left:10px;
}

#prodpic1 {
	float:left;
	width: 440px;
	margin-top:35px;
}

#prodpic2 img {
	margin: 0 auto
}
/*
#prodpic1:hover {
	width: 440px;
	margin-top:35px;
	background-repeat:no-repeat;
	background-position: top right;
}*/

#prodpic2 {
	width: 440px;
	height: 461px;
	background-position: bottom left;
	background-repeat:no-repeat;
	text-align:center
}


/* ~-~-~~-~-~-~-~ Static ~-~-~~-~-~-~-~ */


#content iframe{
	margin:0 0 0 7px;
}

#container .home{
	margin-top: 30px;
	text-align:center;
}
.home img{ margin:0 auto;}




.orangelinks, .orangetext {
	font-family: "TREBUCHET MS", Arial, Helvetica, sans-serif;
	color: #9C7443;
	font-size:17px;
	text-transform:uppercase;
}
.orangelinks a {
	text-decoration:none;
	color: #9C7443;
}
.orangelinks a:hover {color: #FFF;}
.home .orangelinks a:hover {color:#9C7443;}
.home .orangetext{ margin-top:30px; }

#leftlogo .orangelinks {
	margin-top: 28px;
	font-family:  Arial, Helvetica, sans-serif;
	font-weight:900;
	font-size:15px;
}
#leftlogo .orangelinks a{
	margin-right: 30px;
}

#container  #teakinfo {
	padding-left: 0;
	margin-left: -10px;
	margin-top: 15px;
	width: 685px;
	text-align:left;
}

#container #pictures {
	padding-left: 0;
	margin-left: -10px;
	width: 685px;
	text-align:left;
}

#container #pictures a {
	display:block;
	background-repeat:no-repeat;
	background-position: top left;
	cursor:default !important;
	
}

#container #pictures a.p1 {
	background: url(../images/home/1.jpg) ;
	width: 247px;
	height: 146px;
}

#container #pictures a.p2 {
	background: url(../images/home/2.jpg) ;
	width: 247px;
	height:131px;
}

#container #pictures a.p3 {
	background: url(../images/home/3.jpg) ;
	width: 250px;
	height:277px;
}

#container #pictures a.p4 {
	background: url(../images/home/4.jpg) ;
	width: 497px;
	height:180px;
}

#container #pictures a.p5 {
	background: url(../images/home/5.jpg) ;
	width: 157px;
	height:457px;
}

#container #pictures a:hover, #container #pictures a.sel {
	background-position: top right;
}

#container #pictures a span {
	display:none;
}




/* ~-~-~~-~-~-~-~ HEADERS ~-~-~~-~-~-~-~ */

h1 {
	text-transform:uppercase;
	margin:0;
	color:#FFF;
	font-weight:100;
	font-size:26px;
}

a.rattan-bg {
	background-color: #000000;
}

a.rattan-bg:hover img {
	opacity: .50;
	background-color: #000000;
}

#specialbutton {
	position:absolute;
	top:608px;
	left:50%;
	margin-left: -473px;
}

#specialbutton2 {
	position:absolute;
	top:608px;
	right:50%;
	margin-right: -471px;
}

#specialbutton3 {
	position:absolute;
	top:515px;
	left:50%;
	margin-left: -456px;
}

#soundfile {
	position:absolute;
	top:68px;
	right:50%;
	margin-right: -548px;
}

.left {float:left}

/* PRICE ON PRODUCT PAGE */
.before { 
	color: a7a7a7;
}

.after {
	font-size:18px;
	color:#a17938 ;
}

.orange {
	color:#a17938 !important;
}

.prodback {font-size:18px;}

/* Subscribe Form */

#emailinput {
	color:#FFF;
	background:#a17938;
	border:none;
	margin:7px 0;
}


#submitbtn {
	background: url('../images/submitbtn.gif') no-repeat;
	width: 49px;
	height: 21px;
	border:none;
}

.smalltext { font-size:80%;}
.centertext { text-align:center}
.notice { color:#FFFFFF; font-weight:900;}