/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 3.1.1
build: 47
*/
html {
color: #000;
background: #FFF;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset,img {
border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
font-style: normal;
font-weight: normal;
}
li {
list-style: none;
}
caption,th {
text-align: left;
}
h1,h2,h3,h4,h5,h6 {
font-size: 100%;
font-weight: normal;
}
q:before,q:after {
content: '';
}
abbr,acronym {
border: 0;
font-variant: normal;
}
sup {
vertical-align: text-top;
}
sub {
vertical-align: text-bottom;
}
input,textarea,select {
font-family: inherit;
font-size: inherit;
font-weight: inherit;
}
input,textarea,select {*font-size:100%;
}
legend {
color: #000;
}
/*regular styles */
html {
height: 100%;
overflow: auto;
background: #1f231f
}
body {
text-align: center;
background: #1f231f url(../template-images/body-bg.png);
font-family: "trebuchet ms", sans-serif;
font-size: 11px
}
#wrapper0 {
width: 100%;
height: 100%
}
#wrapper1 {
width: 100%;
overflow: auto;
background: url(../template-images/body-bottom-bg.png) repeat-x bottom
}
#siteContainer {
width: 942px;
margin-left: auto;
margin-right: auto;
text-align: left
}
#contentContainer {
padding-left: 5px;
width: 937px;
float: left;
background: url(../template-images/content-bg.png) repeat-y
}

section {
background: #28422b;
width: 920px;
height: 391px;
float: left;
color: #8a9c8d;
overflow: hidden;
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 8px;
}

::-webkit-scrollbar-track {
    background-color: rgba(0,0,0, .2);
}
::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: rgba(0,0,0,.5);
	-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

#emailForm {
text-align: left;
display: none;
position: absolute;
width: 350px;
height: 250px;
background: url(../template-images/content-bg.png) repeat-y;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
box-shadow: 3px 3px 10px #000;
-webkit-box-shadow: 3px 3px 10px #000;
-moz-box-shadow: 3px 3px 10px #000;
color: #FFF;
padding: 10px 20px 20px
}
#emailForm label {
display: block;
float: left;
width: 170px;
text-align: right;
padding-right: 5px;
font-size: 110%
}
#emailForm .textInput {
width: 170px
}
#emailForm div {
clear: both;
padding: 4px 0
}
#emailForm h3 {
clear: both;
font-size: 140%;
padding: 4px 0 0
}
#emailForm p {
font-size: 120%;
padding: 10px 0
}
#getFlash h1, #getFlash p{
padding: 10px;
}
#emailForm .submitButton {
text-align: center;
float: right
}
.closeButton {
float: right;
font-size: 120%;
font-weight: 700;
color: #111;
text-decoration: none;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
padding: 5px 10px
}
.closeButton:hover {
background-color: #204529;
color: #FFF
}
.gallery section {
width: 937px;
height: 406px
}
section article {
margin-top: 15px;
float: left;
overflow: hidden
}
.home section article,.how-to section article {
margin-top: 0
}
.home section,.how-to section {
padding-top: 0;
overflow: hidden
}
.home header {
background: transparent url(../template-images/hedge-top.png) no-repeat 0 83px;
height: 172px;
float: left;
width: 920px;
overflow: hidden
}
header h1 {
background: url(../template-images/living-walls-banner.png) no-repeat 0 0;
width: 389px;
height: 134px;
margin: 18px 0 0 18px;
float: left;
}
header h1 a {
	overflow: hidden;
	text-indent: -3000px;
	display: block;
	height: 100%;
}
#mainTitle {
cursor: pointer
}
h1 {
font-size: 17px;
letter-spacing: 3px;
padding-bottom: 10px
}
#leftColumn.siteMapBlurb {
padding-left: 59px;
padding-top: 34px
}
article h1,.contactDetails h1,.siteMapBlurb h1 {
font-style: italic;
font-size: 17px;
font-family: "Gill Sans", "trebuchet MS", sans-serif;
letter-spacing: 3px;
padding-bottom: 10px
}
.contactDetails h2 {
font-family: "Gill Sans", "trebuchet MS", sans-serif
}
article p,.contactDetails p {
line-height: 180%;
padding-right: 30px;
width: 290px
}
.siteMapBlurb p {
width: 290px
}

.contactDetails p {
width: auto;
padding-right: 30px;
padding-left: 29px
}
#pageShadow {
float: left;
width: 100%;
background: url(../template-images/paper-shadow.png) no-repeat 34px 0
}
.home #pageShadow,.how-to #pageShadow {
background: url(../template-images/paper-shadow.png) no-repeat 34px 0
}
#contentShadow.how-to {
padding-top: 0
}
.gallery #pageShadow {
background: url(../template-images/paper-shadow-right.png) no-repeat 599px 0
}
footer {
float: left;
background: transparent url(../template-images/content-bg-bottom.png) no-repeat -5px 0;
color: #546857;
padding-bottom: 75px;
width: 100%
}
footer a {
color: #8a9c8d;
font-weight: 700;
text-align: right
}
footer p a {
color: #518e5b
}
footer p {
margin-right: 50px;
text-align: right;
float: right;
display: inline
}
footer nav {
font-size: 10px;
float: right!important;
list-style: none;
height: 18px;
clear: both;
padding: 20px 50px 0 0
}
footer li {
float: left;
border-right: 1px solid #8a9c8d;
padding: 0 8px
}
footer li.lastChild,footer li:last-child {
border: 0;
padding: 0 0 0 8px
}
footer li.lastChild a {
float: left;
text-indent: 0!important;
margin: 0!important
}
#homeLink {
float: left;
padding-left: 45px;
display: block;
width: 309px;
height: 85px;
margin-top: 30px;
overflow: hidden;
background: url(../template-images/tvn-logo.png) no-repeat 45px
}
#logo a {
text-indent: -3000px;
float: left;
width: 100%;
height: 100px
}
.hidden {
display: none
}
section nav,header nav,#extendedNav {
float: right;
width: 411px;
overflow: hidden;
padding-right: 46px;
padding-top: 40px;
z-index: 1
}
section nav li,header nav li,#extendedNav li {
display: block;
float: left;
width: 112px;
overflow: hidden;
margin-right: 25px;
padding-bottom: 30px;
text-align: center
}
header nav li {
padding-bottom: 8px
}
section nav a,header nav a,#extendedNav a {
display: block;
color: #a3aea6;
width: 100%;
padding-top: 118px;
font-weight: 700
}
header nav {
padding-top: 21px;
height: 140px
}
#extendedNav {
float: right;
width: auto;
padding-right: 46px;
padding-top: 9px;
margin: 0
}
#extendedNav a {
padding-top: 0;
padding-bottom: 118px
}
#extendedNav li {
float: right;
margin-right: 25px;
padding-bottom: 0
}
#livingEdgeButton a {
background: url(../template-images/button-sprites.jpg) no-repeat
}
#livingBoundaryButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -112px 0
}
#livingScreenButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -224px 0
}
#livingEdgeButton.selected a,#livingEdgeButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -672px 0
}
#livingBoundaryButton.selected a,#livingBoundaryButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -784px 0
}
#livingScreenButton.selected a,#livingScreenButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -896px 0
}
#howToButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -336px 0
}
#understandButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -448px 0
}
#catalogueButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -560px 0
}
#howToButton.selected a,#howToButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -1008px 0
}
#understandButton.selected a,#understandButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -1120px 0
}
#catalogueButton.selected a,#catalogueButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -1232px 0
}
#extendedNav #howToButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -336px 21px
}
#extendedNav #understandButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -448px 21px
}
#extendedNav #catalogueButton a {
background: url(../template-images/button-sprites.jpg) no-repeat -560px 21px
}
#extendedNav #howToButton.selected a,#extendedNav #howToButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -1008px 21px
}
#extendedNav #understandButton.selected a,#extendedNav #understandButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -1120px 21px
}
#extendedNav #catalogueButton.selected a,#extendedNav #catalogueButton a:hover {
background: url(../template-images/button-sprites.jpg) no-repeat -1232px 21px
}
#contentShadow {
position: relative;
clear: both;
float: left;
height: 148px;
width: 942px!important;
background: url(../template-images/content-bg.png) repeat-y
}
.submitButton {
background: #efeada;
color: #28422b;
border: 2px solid #28422b;
text-decoration: none;
padding: 5px 10px
}
.submitButton:hover {
text-decoration: underline
}
#contentShadow img {
background: url(../template-images/hero-image-shadow.png) no-repeat 0 0;
width: 495px;
height: 150px;
position: absolute;
right: 0;
top: -34px;
display: block;
padding: 19px 32px 35px 22px
}
article,.article,#leftColumn {
float: left;
width: 317px;
background: url(../template-images/paper-bg.png) no-repeat 29px 0;
height: 372px;
padding-left: 59px;
padding-top: 34px;
color: #284235
}
#leftColumn {
width: 347px;
height: 406px;
padding: 0 0 0 29px;
position: relative;
}
#leftColumn.contactDetails {
height: 372px;
padding-left: 29px;
padding-top: 34px;
overflow: hidden;
width: 347px
}
#introBlurb p {
font-size: 120%
}
.contactDetails dl {
padding-left: 29px;
font-size: 100%
}
.contactDetails dd {
white-space: nowrap;
width: 200px
}
.contactDetails h1,.contactDetails h2 {
width: 270px;
display: inline;
padding-left: 29px
}
.contactDetails #shareNav {
margin-left: 10px;
padding: 15px 0 0
}
.home article {
height: 357px
}
.how-to article {
padding-left: 30px;
background: url(../template-images/paper-bg.png) no-repeat 0 0
}
#scrollContent dl {
width: 470px;
overflow: hidden;
font-size: 95%
}
#scrollContent dt {
width: 215px;
clear: both
}
#scrollContent dd {
width: 255px;
line-height: 150%
}
#linkLogos {
padding: 0;
position: absolute;
left: 47px;
top: 235px;
}
#linkLogos a {
padding: 0 10px;
display: block;
float: left;
}
#leftColumn img.noBorder {
box-shadow: 3px 3px 5px #666;
-webkit-box-shadow: 3px 3px 5px #666;
-moz-box-shadow: 3px 3px 5px #666;
margin: 12px 12px 5px;
padding: 0
}
p.sp,h4.sp {
padding-top: 15px!important
}
#productBrochureIcon,#availabilityIcon {
text-indent: -200px;
width: 112px;
height: 112px;
display: block;
float: left;
overflow: hidden;
margin-right: 15px;
margin-bottom: 15px
}
#productBrochureIcon {
background: transparent url(../template-images/product-availability-icon-off.jpg) no-repeat 0 0!important
}
#availabilityIcon {
background: transparent url(../template-images/product-catalogue-icon-off.jpg) no-repeat 0 0!important
}
#productBrochureIcon:hover {
background: transparent url(../template-images/product-availability-icon.jpg) no-repeat 0 0!important
}
#availabilityIcon:hover {
background: transparent url(../template-images/product-catalogue-icon.jpg) no-repeat 0 0!important
}
#sectionNav {
float: left;
width: 140px;
margin-top: 13px
}
strong {
font-weight: 700
}
dl {
width: 270px;
float: left;
line-height: 120%;
font-size: 120%;
padding-top: 10px
}
dt {
float: left;
width: 70px;
line-height: 180%
}
img.noBorder {
border: 0
}
dd {
float: right;
line-height: 180%
}
#shareButtons {
width: 170px;
float: left
}
#shareButtons a {
color: #28422b;
font-size: 90%;
display: block;
white-space: nowrap;
width: 60px;
height: 16px;
padding: 3px 0;
line-height: 16px;
margin-bottom: 4px;
}
#shareButtons li {
float: left
}
#shareNav {
width: 320px;
padding: 0 12px;
position: absolute;
left: 35px;

bottom: 15px;
}

.addthis_toolbox {
	position: absolute;
	bottom: 0;
}

.contactDetails #shareNav {
	left: 50px;
	bottom: 35px;
}


blockquote {
font-size: 110%;
padding-left: 10px;
padding-top: 15px
}
em {
font-style: italic;
font-weight: 700
}
#shareButtons a.printButton,#shareButtons a.printButton:hover {
background: url(../template-images/print-icon.png) no-repeat 0 center;
padding-left: 25px;
}
#shareButtons a.shareButton,#shareButtons a.shareButton:hover {
background: url(../template-images/share-all.png) no-repeat 0 center;
padding-left: 25px
}
#shareButtons a.linkedInButton,#shareButtons a.linkedInButton:hover {
background: url(../template-images/share-linkedin.png) no-repeat 0 center;
padding-left: 25px
}
#shareButtons a.fbButton,#shareButtons a.fbButton:hover {
background: url(../template-images/facebook-icon.png) no-repeat 0 center;
padding-left: 25px;
}
#rightColumn {
font-size: 13px;
background: #e7dcb6 url(../template-images/right-column-bg.png) repeat-y right;
float: right;
height: 406px;
width: 343px;
color: #213321
}
#rightColumn p {
color: #354938;
padding: 1px 42px
}
#rightColumn a {
font-weight: 700;
color: #2c2c2c
}
#rightColumn ul {
color: #354938;
line-height: 18px;
width: 240px;
float: left;
list-style: none;
font-weight: 700;
padding: 10px 0 4px 42px
}
#rightColumn li {
line-height: 130%;
margin: 0;
padding: 2px 0
}
#rightColumn h2 {
color: #354938;
font-size: 15px;
padding-left: 44px;
margin-top: 39px;
text-indent: -3000px;
padding-bottom: 20px;
background-repeat: no-repeat;
background-position: 42px 0;
}
#rightColumnTopWrapper {
background: url(../template-images/right-column-top.png) no-repeat top right;
float: right;
height: 100%;
width: 100%
}
#rightColumnBottomWrapper {
background: url(../template-images/right-column-bottom-bg.png) no-repeat bottom right;
float: right;
height: 100%;
width: 100%
}
#dingBatWrapper {
float: right;
height: 100%;
width: 100%;
background: url(../template-images/dingbat.png) no-repeat 290px 355px
}
#slideShow {
width: 594px;
height: 394px;
float: left;
background: #000;
margin: 0;
padding: 0
}
#scrollContent {
height: 351px;
overflow-y: scroll;
color: #cbcbcb;/*#8a9c8d;*/
font-size: 110%;
padding: 20px;
-webkit-overflow-scrolling: touch;
}
#scrollContent h1,section h1 {
font-size: 150%;
font-weight: 700;
letter-spacing: 2px
}
#scrollContent h1,#scrollContent h2,#scrollContent h3 {
color: #bcb297
}
#scrollContent a,section a {
color: #cbcbcb;/*#8a9c8d;*/
}
#scrollContent p,section p {
line-height: 150%;
padding: 3px 0
}
#scrollContent ol,section ol {
list-style-type: decimal;
padding: 5px 5px 5px 25px
}
#scrollContent ul li {
line-height: 130%;
padding: 2px 0
}
#scrollContent h4 {
font-size: 120%;
font-weight: 700;
padding-top: 5px
}
#scrollContent h2,section h2 {
letter-spacing: 1.5px;
font-weight: 700;
font-style: italic;
font-size: 140%
}
#scrollContent h3,section h3 {
letter-spacing: 1.5px;
font-weight: 700;
font-style: italic;
font-size: 130%
}
#scrollContent ol li,section ol li {
line-height: 130%;
margin-left: 2px 0;
list-style-type: decimal;
padding: 4px 0
}
footer a.selected,footer li.selected a {
color: #e4aa5e
}
.clear,p.break {
clear: both
}
.contactDetails a,.contactDetails a:hover,#leftColumn a,#leftColumn a:hover,#scrollContent a {
background: none
}
#mapCanvas,#nzMapCanvas {
width: 495px;
height: 350px;
margin-left: 5px
}
.ie7 #scrollContent {
position: relative
}

/*Slideshow specific */

#slideShow {
	width: 594px;
	height: 406px;
	position: relative;
	top: 0;
	font-family: Helvetica, Arial, sans-serif;
}
#galleries {
	background: #1d231f;
	width: 594px;
	height: 406px;
	position: absolute;
	top: 0;
}
#gallery {
	opacity: 0;
	display: none;
}
#galleries li {
	display: block;
	float: left;
	width: 276px;
	height: 182px;
	margin-top: 15px;
	margin-left: 14px;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	background: black;
}
#galleries li .title {
	position: absolute;
	bottom: 0px;
	font-size: 12px;
	padding: 3px 5px 1px 5px;
	color: white;
	background: rgba(0, 0, 0, 0.5);
	display: block;
	width: 100%;
}
#photoTitle {
	color: white;
	background: rgba(0, 0, 0, 0.7);
	display: block;
	width: 100%;
	position: absolute;
	font-size: 12px;
	padding: 3px 5px 5px 5px;
	top: -45px;
	-webkit-transition: all 0.6s ease-in-out;
	-moz-transition: all 0.6s ease-in-out;
	-o-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}
#backButton {
	float: left;
	text-decoration: none;
	padding: 8px 15px 10px 15px;
	font-size: 18px;
	font-weight: bold;
}
#backButton:hover {
	color: #444;
	background: #eee;
}
#nav {
	height: 36px;
	background: #333;
	float: left;
	overflow: hidden;
	width: 100%;
}
#nav li {
	float: right;
	padding: 0;
}
#nav a {
	color: white;
}
#imageContainer {
	width: 594px;
	height: 370px;
	float: left;
	overflow: hidden;
	background: black;
	position: relative;
}
#img2 {
	position: absolute;
	top: 0;
	opacity: 0;
}
#img1 {
	opacity: 0;
	position: absolute;
	top: 0;
}

#imageContainer img {
	opacity: 0;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}
#galleries {
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}


/*
 * Media queries for responsive design
 * These follow after primary styles so they will successfully override. 
 */

@media all and (orientation:portrait) { 
  /* Style adjustments for portrait mode goes here */
  
}

@media all and (orientation:landscape) { 
  /* Style adjustments for landscape mode goes here */
  
}

/* Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)  
   Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
  #scrollContent, section {
  	overflow-y: visible;
  	height: auto;
  }
  #scrollContent {
  	width: 500px;
  	float: right;
  }
  #pageShadow {
  	background: none !important;
  }
  .gallery #pageShadow {
  	background: url(../template-images/paper-shadow-right.png) no-repeat 599px 0 !important;
  }
  
  /* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you
     j.mp/textsizeadjust 
  html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}

/* 
 * print styles
 * inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/ 
 */
@media print {
/* print styles */
body{font-family:"trebuchet ms", sans-serif;font-size:11px}
p.sp,h4.sp{padding-top:15px!important}
#contentContainer{padding-left:5px}
section article{margin-top:15px}
h1{font-size:17px;letter-spacing:3px;padding-bottom:10px}
#leftColumn.siteMapBlurb{padding-left:59px;padding-top:34px}
article h1,.contactDetails h1,.siteMapBlurb h1{font-style:italic;font-size:17px;font-family:"Gill Sans", "trebuchet MS", sans-serif;letter-spacing:3px;padding-bottom:10px}
.contactDetails h2{font-family:"Gill Sans", "trebuchet MS", sans-serif}
article p,.contactDetails p{line-height:180%;padding-right:30px}
.contactDetails p{width:auto;padding-right:30px}
#introBlurb p{font-size:120%}
.contactDetails dl{width:380px;font-size:100%;clear:both}
.contactDetails dt{width:110px;line-height:150%}
#scrollContent dl{width:480px;font-size:110%}
#scrollContent dt{width:210px}
#productBrochureIcon,#availabilityIcon{width:112px;height:112px;margin-right:15px;margin-bottom:15px}
dl{float:left;line-height:120%;font-size:120%;padding-top:10px;clear:both}
dt{float:left;width:70px;line-height:180%}
dd{float:right;line-height:180%}
blockquote{font-size:110%;padding-left:10px;padding-top:15px}
em{font-style:italic;font-weight:700}
#rightColumn{font-size:13px}
#rightColumn p{padding:1px 42px}
#rightColumn ul{line-height:18px;list-style:none;font-weight:700;padding:10px 0 4px 42px}
#rightColumn li{line-height:130%;margin:0;padding:2px 0}
#rightColumn h2{font-size:15px;padding-bottom:20px}
h1,section h1{font-size:150%;font-weight:700;letter-spacing:2px;clear:both;float:none}
p,section p{line-height:150%;padding:3px 0}
ol,section ol{list-style-type:decimal;padding:5px 5px 5px 25px}
ul li{line-height:130%;padding:2px 0}
h4{font-size:12%;font-weight:700;padding-top:5px}
h2,section h2{letter-spacing:1.5px;font-weight:700;font-style:italic;font-size:140%}
h3,section h3{letter-spacing:1.5px;font-weight:700;font-style:italic;font-size:130%}
ol li,section ol li{line-height:130%;margin-left:2px 0;list-style-type:decimal;padding:4px 0}
header,footer,#shareNav,#emailForm,nav,.hidden{display:none}
.clear,p.break{clear:both}
.contactDetails dd,#scrollContent dd{width:270px;line-height:150%}
strong,#rightColumn a{font-weight:700}
#mapCanvas,#nzMapCanvas{margin-left:5px}
}