/* CSS Document */

/* Author Ashoor Namrood, Syrox */

body {
	margin:0px; 
padding:0px; 
background-color:#4f4022; 
color:#333333; 
font-size:12px; 
font-family:Arial, Helvetica, sans-serif; 
/* Always define 0px margin and padding, never use the Body tag to specify spaces. Body tags should only be used to specify backgrounds, font-family's (i.e. Arial, Verdana etc), a container class (i.e. line 39, .container) should be used to specify spaces. */
}

h1 {
	margin:0px; 
padding:0px; 
/* Always define 0px margin and padding to begin with on heading tags. You can then modify these as you continue building a site. */
}

h2 {
	margin:0px; 
padding:0px; 
 
}

h3 {
	margin:0px; 
padding:0px; 

}

h4 {
	margin:0px; 
padding:0px; 

}

h5 {
	margin:0px; 
padding:0px; 
 /* */
}

h6 {
	margin:0px; 
padding:0px; 

}

a {
	text-decoration:none; 
color:#5f4003;
}

a:hover {
	color:#cccccc;
}

a img {
	border:0px; 
/* This defines that any images placed inside a <a href> tag or a .NET 2.2 Hyperlink have no default "blue" border that Internet Explorer adds by default */
}

p {
	margin:0px; 
padding:0px; 
color:#333333; 
font-size:12px; 
line-height:15px; 
/* Rule: when specifying font-size, line-height should always be roughly 3px more, so, i.e. 11px font-size = 14px line-height. */
}

ul {
	margin:0px; 
padding:0px;
}

ul li {
	margin:0px; 
padding:0px; 
list-style-type:none;
}

div.clear {
	clear:both; 
line-height:0px; 
font-size:0px; 
height:0px; 
/*.display:none !important;*/ /* When a CSS class has an auto height (i.e. line 39, .container), it means that it'll grow in height according to the elements inside it. However, due to cross-browser differences, some browsers will not comply with this rule as they dont take into account floated elements so the DIV is 0px in height effectively. 'div.clear' is an "invisible" DIV which enforces this rule. */
}

* html div.clear {
	line-height:0px; 
.line-height:0px; 

}

div.clear {
	.line-height:5px; 

}
/**/
.outercontainer {
	width:100%; 
height:auto; 
margin:auto; 
background-color:#e7dfc8; 
/* This is used to centre an element. Some people use text-align:center but that also centers text and you have to specify an inner DIV with a left or right text align which can then get slightly messy. */
}

img, input { behavior: url("/common/iepngfix.htc"); 
}


.container {
	width:982px; 
height:auto; 
margin:auto; 
position:relative;
}

.container#home {
	background:url(../Images/Layout/footercurves.gif) 50% 100% no-repeat #ffffff; 
padding-bottom:0px;
}

.container#website {
	background:url(../Images/Layout/footercurvesbite.gif) 50% 100% no-repeat #ffffff; 
padding-bottom:41px;
}

.header {
	position:relative; 
width:982px; 
height:auto; 
margin:auto; 
background:url(../Images/Layout/containergradient.gif) 50% 0% repeat-x #ffffff; 

}

.innerheader {
	position:relative; 
width:982px; 
height:111px; 
margin:auto; 
background:url(../Images/Layout/topnavgradient.gif) 130px 100% no-repeat; 

}

.header img {
}

.header a.logo {
	position:absolute; 
top:5px; 
left:29px; 
/* For detailed information on, CSS Positioning go to: http://webdesign.about.com/od/advancedcss/a/aa061307.htm */
}

.header .topnav {
	position:absolute; 
top:13px; 
right:10px; 
width:750px; 
height:20px;
}

.header .topnav ul {
	position:absolute; 
top:0px; 
left:0px; 
width:484px;
}

.header .topnav ul li.home {
}

.header .topnav ul li {
	float:left; 
padding:0px 0px 0px 22px; 
display:block;
}

.header .topnav ul li a {
	color:#5f4003; 
font-size:13px; 
float:left;
}

.header .topnav ul li a:hover {
	color:#74b245;
}

.header .searchnav {
	position:absolute; 
top:10px; 
right:16px; 
width:250px; 
height:20px;
}

.header .searchnav .searchouterbox {
	width:194px; 
height:16px; 
background:url(../Images/Top-nav/searchbox.gif) 0px 0px no-repeat; 
padding:2px 4px 3px 4px; 
position:absolute; 
top:0px; 
left:0px; 

}

.header .searchnav .searchouterbox input {
	width:186px; 
height:14px; 
border:0px !important; 
font-size:10px; 
font-family:Arial, Helvetica, sans-serif; 
color:#94ce60;
}

.header .searchnav ul {
	position:absolute; 
top:3px; 
left:203px;
}

.header .searchnav ul li {
	float:left; 
padding:0px 35px 0px 0px; 
display:block;
}

.header .searchnav ul li a {
	color:#5f4003; 
font-size:13px; 
float:left;
}

.header .searchnav ul li a:hover {
	color:#74b245;
}

.header .subnav {
	position:absolute; 
top:40px; 
right:24px; 
width:630px; 
height:20px;
}

.header .subnav ul {
/*	float:right;*/
}

.header .subnav ul li {
	float:left; 
padding:0px 23px 0px 0px; 
display:block; 
color:#5f4003; 
font-size:13px; 

}

.header .subnav ul li.basketli {
	padding:0px 10px 0px 10px; 

}

.header .subnav ul li.cssnavli {
	padding:7px 0px 0px 0px; 

}

.header .subnav ul li p {
	color:#5f4003; 
font-size:13px; 
float:left; 
padding:13px 3px 13px 0px; 
display:block;
}

.header .subnav ul li cufon {
	float:left;
}

.header .subnav ul li span {
	color:#74b245; 
font-size:18px; 
float:left; 
padding:10px 0px 13px 1px;
}

.header .subnav ul li a {
}

.header .subnav ul li a.topnavlink {
	color:#5f4003; 
font-size:13px; 
float:left; 
padding:13px 3px 13px 0px; 
display:block;
}

.header .subnav ul li a.basketlink {
	color:#5f4003; 
font-size:13px; 
float:left; 
display:block; 
padding:6px 10px 7px 33px; 
background:url(../Images/Buttons/basket.gif) 0% 50% no-repeat;
}

.header .subnav ul li a.basketlink:hover {
	background:url(../Images/Buttons/rollover/basket.gif) 0% 50% no-repeat;
}

.header .subnav ul li a:hover {
	color:#74b245;
}





.outercontent {
	width:100%; 
height:auto; 
margin:auto; 
padding:0px 0px 10px 0px; 
background:url(/Images/Layout/background.gif) 50% 0% no-repeat #e7dfc8; 
 /* I have given the .content DIV a min-height of 500px. This means that the container-alternative DIV which I had given a min-height of 500px will now rise to 650px high when taking into account the heights of the header (100px) and the footer (50px). */
}



.content {
	width:960px; 
min-height:380px; 
height:auto !important; 
height:380px; 
margin:auto; 
padding:0px 11px 11px 11px; 
position:relative;/* I have given the .content DIV a min-height of 500px. This means that the container-alternative DIV which I had given a min-height of 500px will now rise to 650px high when taking into account the heights of the header (100px) and the footer (50px). */
}



.outerfooter {
	width:100%; 
height:379px; 
margin:auto; 
background:url(/Images/seasonal-footer/100816-TLGS-Autumn01.jpg) 50% 0px no-repeat #4f4022; 
padding-top:5px;/* */ 
}



.footer {
	width:982px; 
height:376px; 
margin:auto; 
background:url(/Images/seasonal-footer/100816-TLGS-Autumn01.jpg) 50% -5px no-repeat #4f4022; 
padding:3px 0px 0px 0px; 
position:relative; 
/* */
}




.footerbuttonlinks {
	width:982px; 
min-height:120px; 
height:auto !important; 
height:120px; 
margin:auto; 
position:relative; 
/*background:url(../Images/Icons/thelittlegreensheep.gif) 50% 11px no-repeat;
*/}




.footercolumn {
	float:left; 
width:135px; 
height:auto; 
padding:15px 0px 0px 10px;
}

.footercolumn h1 {
	color:#fbfaf8; 
font-size:12px; 
font-weight:100; 
text-transform:uppercase; 
margin:0px 0px 9px 0px;
}

.footercolumn ul {
}

.footercolumn ul li {
	font-size:12px; 
padding:0px 0px 3px 20px; 
margin:0px 0px 0px 0px; 
display:block; 
background:url(../Images/Layout/flowerbullet.gif) 2px 3px no-repeat;
}

.footercolumn ul li a {
	color:#fbfaf8; 
letter-spacing:-0.002em;
}

.footercolumn ul li a:hover {
	color:#666666;
}




.footertestimonial {
	width:350px; 
min-height:82px; 
height:auto !important; 
height:82px; 
background:url(../Images/Layout/testimonialbg.gif) 0px 0px no-repeat; 
position:absolute; 
bottom:140px; 
right:20px; 
padding:10px;
}

.footertestimonial p {
	color:#fbfaf8; 
font-size:12px;
}

ul.social-networking-links { position:absolute; bottom:60px; right:20px; z-index:100; }

ul.social-networking-links li { float:right; padding:0px 0px 0px 10px; display:block; width:140px; }

ul.social-networking-links li a { color:#fbfaf8; display:block; height:16px; width:auto; }

ul.social-networking-links li a:hover { color:#cccccc; }

ul.social-networking-links li a span { padding:0px 0px 2px 0px; }

ul.social-networking-links li img.link-button { float:left; margin:0px 5px 0px 0px; }

a.blog-footer-graphic { position:absolute; right:50px; bottom:84px; }

.footerlinks img.securehostinglinks { position:absolute; top:15px; left:240px; }

.footerlinks img.footericons {
	position:absolute; 
top:0px; 
left:0px;
}

.footerlinks {
	width:952px; 
min-height:28px; 
height:auto !important; 
height:28px; 
margin:auto; 
position:absolute; 
bottom:0px; 
left:10px; 
padding:65px 0px 0px 0px;
}

.footerlinks p {
	color:#fbfaf8; 
font-size:12px; 
float:left;
}

.footerlinks p.syroxlink {
	float:right;
}

.footerlinks p a {
	color:#fbfaf8; 

}

.footerlinks p a:hover {
	color:#cccccc; 

}


/* Dropdown area */

.content .top-nav {
	width:960px; 
height:25px; 
margin:auto; 
padding:0px 0px 0px 0px; 
position:absolute; 
z-index:1600; 
top:-25px; 
left:0px;
}

.content .top-nav .topnavlist {
	position:absolute; 
top:0px; 
right:0px; 
width:auto; 
height:auto; 
z-index:1600; 

}/**/


.content .top-nav .topnavlist .top-level {
	float:left; 
/*position:relative;*/ list-style:none; 
min-height:26px; 
height:auto !important; 
height:26px; 
display:block; 
padding:0px 0px 0px 0px; 
margin:0px; 
background:url(../Images/Buttons/tab-right.gif) 100% 0% no-repeat; 
margin:0px 2px 0px 0px; 
position:relative; 

}


.content .top-nav .topnavlist .selected {
	background:url(../Images/Buttons/rollover/tab-right.gif) 100% 0% no-repeat;
}

.content .top-nav .topnavlist .selected span {
	display:block; 
 background:url(../Images/Buttons/rollover/tab-left.gif) no-repeat 0% 0% !important; 

}

.content .top-nav .topnavlist .selected a {
	color:#5f4003 !important; 

}


.content .top-nav .topnavlist .top-level a {
	float:left; 
list-style:none; 
min-height:25px; 
height:auto !important; 
height:25px; 
display:block; 
color:#ffffff; 
line-height:16px; 
font-size:13px; 
font-weight:bold; 
text-decoration:none; 
cursor:pointer !important;
}

.content .top-nav .topnavlist .top-level a span {
	display:block; 
 background:url(../Images/Buttons/tab-left.gif) no-repeat 0% 0%; 
 padding:4px 12px 5px 12px;
}

.content .top-nav .topnavlist .top-level a:hover span {
	display:block; 
 background:url(../Images/Buttons/rollover/tab-left.gif) no-repeat 0% 0%; 
}

.content .top-nav .topnavlist .top-level a:hover {
	color:#5f4003; 
background:url(../Images/Buttons/rollover/tab-right.gif) no-repeat 100% 0%; 

}



.content .top-nav .topnavlist #links {
	position:absolute; 
top:25px; 
left:0px; 
padding:0px 0px 35px 0px !important; 
margin:0px 0px 0px 0px; 
background:url(../Images/Buttons/dropdown/dropdown-bottom.png) no-repeat 0% 100% !important; 
display:block; 
width:162px; 
height:auto; 

}

.content .top-nav .topnavlist #links div.clear {
	display:none !important;
}

.content .top-nav .topnavlist #links .outertopnavarea {
	 display:block; 
width:162px; 
height:auto; 

}

.content .top-nav .topnavlist #links .outertopnavarea .innertopnavarea {
	padding:4px 0px 0px 0px !important;/* */background:url(../Images/Buttons/dropdown/dropdown-middle.png) repeat-y 0px 0px; 
display:block; 
width:162px; 
height:auto;
}




.content .top-nav .topnavlist #links ul li a {
	float:none; 
display:block; 
padding:4px 12px 4px 12px; 
min-height:5px; 
height:auto !important; 
height:5px; 
color:#ffffff !important;
} 

.content .top-nav .topnavlist #links ul li a:hover {
	background:none;	color:#5f4003 !important; 


}














/* CSS Buttons */

.cssnav { 
position: relative; 
 display: block; 
width: auto; 
height:23px; 
margin:0px 0px 0px 5px; 
padding: 0px; 
float:left; 
background:url(/Images/Buttons/Rollover/bttn-small-right.png) repeat-x 100% 0%; 
 behavior: url("/common/iepngfix.htc"); 

}

.cssnav a {
display: block; 
width: auto; 
height: 16px; 
display: block; 
float: left; 
text-decoration: none; 
padding:4px 11px 3px 6px; 
font-weight:bold; 
background:url(/Images/Buttons/bttn-small-right.png) repeat-x 100% 0%; 
font-size:12px; 
color:#ffffff !important; 
font-family:Arial, Verdana, Helvetica, sans-serif; 

}

.cssnav#brownbg { 
	background:url(/Images/Buttons/Rollover/bttn-small-brown-right.png) repeat-x 100% 0%;
}

.cssnav#brownbg a {
	background:url(/Images/Buttons/bttn-small-brown-right.png) repeat-x 100% 0%;
}

.cssnav a:hover, .cssnav#brownbg a:hover {
	background:none;
}

.cssnav a img {	border:0px; 
float:left;}

.cssnav a img.img-up {visibility:visible; 
position:absolute; 
top:0px; 
left:-5px;}

.cssnav a img.img-down {visibility:hidden; 
position:absolute; 
top:0px; 
left:-5px;}

* html a:hover {visibility:visible; 
behavior: url("/common/iepngfix.htc"); 
}

.cssnav a:hover {visibility:visible;}

.cssnav a:hover img.img-up {visibility:hidden;}

.cssnav a:hover img.img-down {visibility:visible;}


.maincolumn .returningcustomerwrapper .returningcustomerform .returningcustomerformtop .returningcustomerinner .formrow .cssnav a, .page-option-rounded-inner .cssnav a {
	background:url(/Images/Buttons/bttn-small-brown-right.png) repeat-x 100% 0%; 

}

.maincolumn .returningcustomerwrapper .returningcustomerform .returningcustomerformtop .returningcustomerinner .formrow .cssnav a:hover, .page-option-rounded-inner .cssnav a:hover {
	background:none;
}

/* CSS Buttons */

/* Large CSS Buttons */


.largecssnav { 
position: relative; 
 display: block; 
width: auto; 
height: 31px; 
margin:0px 0px 0px 7px; 
padding: 0px; 
float:left; 
background:url(/Images/Buttons/Rollover/bttn-large-right.png) repeat-x 100% 0%; 
 behavior: url("/common/iepngfix.htc"); 

}

.largecssnav a {
display: block; 
width: auto; 
height:19px; 
display: block; 
float: left; 
text-decoration: none; 
padding:7px 11px 5px 6px; 
font-weight:bold; 
background:url(/Images/Buttons/bttn-large-right.png) repeat-x 100% 0%; 
font-size:15px; 
color:#ffffff !important; 
font-family:Arial, Verdana, Helvetica, sans-serif;
}

.largecssnav a.leftarrow {
	padding:7px 11px 5px 32px;
}

.largecssnav a.rightarrow {
	padding:7px 37px 5px 6px;
}

.largecssnav a:hover {
	background:none;
}

.largecssnav a img {	border:0px; 
float:left;}

.largecssnav a img.img-up {visibility:visible; 
position:absolute; 
top:0px; 
left:-7px;}

.largecssnav a img.img-down {visibility:hidden; 
position:absolute; 
top:0px; 
left:-7px;}

.largecssnav a img.img-left-arrow {position:absolute; 
top:6px; 
left:4px;}

.largecssnav a img.img-right-arrow {position:absolute; 
top:6px; 
right:8px;}

* html a:hover {visibility:visible; 
behavior: url("/common/iepngfix.htc"); 
}

.largecssnav a:hover {visibility:visible;}

.largecssnav a:hover img.img-up {visibility:hidden;}

.largecssnav a:hover img.img-down {visibility:visible;}

.basketnavigation .basketnavigationleft .largecssnav {
	text-align:right;
}

.basketnavigation .basketnavigationleft .largecssnav a {
	width:161px;
}

.basketnavigation .basketnavigationright .largecssnav a {
	width:157px; 
padding:7px 30px 5px 8px;
}

.maincolumn .addtobasketcolumn .addtobasketcolumncontent #addbundletobasket.largecssnav {
	position:absolute; 
bottom:2px; 
left:5px;
}

.maincolumn .addtobasketcolumn .addtobasketcolumncontent #addbundletobasket.largecssnav a {
	width:200px; 
padding: 7px 11px 5px 31px;
}

/* Large CSS Buttons */


.footerbuttonlinks .leftfooterlinks {
	width:329px/*438px*/; 
min-height:69px/*87px*/; 
height:auto !important; 
height:69px; 
float:left; 
padding:18px 0px 0px 109px; 
position:relative;
}

.footerbuttonlinks .leftfooterlinks img#ilovenct {
	position:absolute; 
left:4px; 
top:-5px;
}

.footerbuttonlinks .leftfooterlinks h3 {
	color:#5f4003; 
font-size:30px; 
margin:1px 0px 2px 0px;
}

.footerbuttonlinks .leftfooterlinks p {
	color:#333333; 
font-size:12px; 
line-height:18px;
}

.footerbuttonlinks .leftfooterlinks a.readmorebutton {
	position:absolute; 
left:275px; 
bottom:-2px; 
display:block;
}

.footerbuttonlinks .rightfooterlinks {
	width:416px; 
min-height:71px; 
height:auto !important; 
height:71px; 
float:right; 
background:transparent url(/Images/Layout/newsletterpencil.gif) no-repeat scroll 100% 100%; 
padding:10px 0px 0px 0px; 
position:relative;
}

.footerbuttonlinks .rightfooterlinks h3 {
	color:#5f4003; 
font-size:30px; 
margin:11px 0px 3px 0px;
}

.footerbuttonlinks .rightfooterlinks a.checkitnowbutton {
	position:absolute; 
left:215px; 
bottom:6px; 
display:block; 

}



