/*=======================================================
 CSS Document for Hobbyg
=======================================================*/

@import url("global.css");


.hidden { display: none; }
.show { display: inline-block; visibility: visible; }

/*=============================================================
	Main layout
=============================================================*/

#container { width: 800px; height: auto; margin: 0 auto; background: #FFFFFF; border: 2px solid #fff; clear: both; }

/*=============================================================
	Header - nav + logo + banner
=============================================================*/

#header { width: 800px; height: auto;  border-bottom: 2px solid #fff; clear: both; }
#logo { width: 200px; height: 74px; border-right: 2px solid #fff; float: left; }
#cta { width: 598px; height: 74px; float: right; display: block; }
#cta .colour { width: 400px; height: 35px; display: block; text-indent: -999em; float: left; background: url('../images/cta-red.gif') no-repeat 0 0; }
#cta .call { float: right; display: block; width: 164px; height: 54px; border-left: 2px solid #fff; padding: 10px 15px; background-color: #c3d4b0; font-size: 2em; font-weight: bold; line-height: 30px;}
/*navigation*/
ul#nav { width: 800px; height: 32px; clear: both; border-top: 2px solid #fff; display: inline-block; background-color: #950000; }
ul#nav li { position: relative; z-index: 100; display: block; float: left; }
ul#nav a { width: auto; height: 14px; padding: 9px; background-color: #950000; display: block; float: left; font-weight: bold; font-size: 1.2em; line-height: 16px; color: #fff; border-left: 2px solid #fff; text-decoration: none; }
ul#nav a:hover { text-decoration: none; background-color: #546d38; }
ul#nav ul { width: 220px; height: auto; position: absolute; left: -999em; top: 34px; }
ul#nav ul ul { width: 220px; height: auto; margin-left: 220px; float: left; clear: both;  top: 0; }
ul#nav ul li, ul#nav ul li li { border: 2px solid #fff; margin-top: -2px; display: block; float: left; }
ul#nav ul a { width: 202px; display: block; height: auto; border: none; background-color: #b92121; font-weight: normal; }
/*hide*/
ul#nav li:hover ul ul, ul#nav li:hover ul ul ul, ul#nav li:hover ul ul ul ul, ul#nav li:hover ul ul ul ul ul,
ul#nav li.sfhover ul ul, ul#nav li.sfhover ul ul ul, ul#nav li.sfhover ul ul ul ul, ul#nav li.sfhover ul ul ul ul ul { left: -999em;	}
/*show*/
ul#nav li:hover ul, ul#nav li li:hover ul, ul#nav li li li:hover ul, ul#nav li li li li:hover ul,
ul#nav li.sfhover ul, ul#nav li li.sfhover ul, ul#nav li li li.sfhover ul, ul#nav li li li li.sfhover ul { left: 0;	}
#home a#p1, #greenhouses a#p2, #assembly a#p3, #shelving a#p4, #solar-screens a#p5, #accessories a#p6, #prices a#p7, #contact a#p8 {
 text-decoration: none; background-color: #546d38; }


/*=============================================================
	Main body - left + right
=============================================================*/

#mainpage { width: 800px; height: auto; display: block; clear: both; }
#contact #mainpage { background-color: #e6e6cb; }
ul.cta2 { width: 258px; height: 280px; background-color: #d4d4a8; padding: 20px; float: right; display: bock; list-style: none; }
ul.cta2 li { background: url('../images/tick.gif') no-repeat 0 0; height: 35px; padding-left: 45px; margin-bottom: 5px; font-size:1.3em; font-weight: bold;  } 
ul.left { width: 378px; height: 172px; background-color: #d4d4a8; padding: 20px; float: left; display: bock; list-style: none; margin: 0; }
ul.left li {font-weight: bold; margin-left: 10px;  } 

.contents { padding: 20px; display: block; clear: both; }

/*=============================================================
	Footer
=============================================================*/

#footer { width: 800px; height: 92px; display: block; border-top: 2px solid #fff; clear: both; }
#footer #logo2 { width: 200px; height: 40px; padding: 5px 0; background-color: #990000; border-right: 2px solid #fff; text-align: center; float: left;  }
#footer .btmcolour { background-color: #950000; font-size: 2em; font-weight: bold; padding: 15px; height: 20px; width: 568px; color: #fff; display: block; float: right; }
#footer .crumb { padding: 5px 10px; width: 780px; height: 30px; background-color: #334a18; clear: both; border-top: 2px solid #fff; }
#footer .crumb p { float: left; font-size:1.1em; line-height: 15px;  color: #fff; display: block; margin: 0; width: 680px; }
#footer .crumb img { float: right; }
#footer a { color: #fff; text-decoration: none;}
#footer a:hover { color: #fff; text-decoration: underline;}



/*=======================================================
 End of CSS Document for Hobbyg
=======================================================*/