/* Clayworks CSS Document - MASTER */
html, body, h1, h2, h3, p, blockquote, ol, ul, cite, li, fieldset, form, label, img, div { margin:0; padding:0; border:0; }
body { background:url(/images/bg-top.gif) top repeat-x #4c4c50; font-family:Arial, Helvetica, sans-serif; font-size:62.5%; }
.logo { display:block; background:url(/images/logo-clayworks.gif) 0 0 no-repeat; width:217px; padding:52px 0 0 0; height:0 !important; height /**/:52px; overflow:hidden; position:absolute; top:95px; left:63px; }
#container { width:941px; margin:0 auto; position:relative; padding-top:173px; }
/*NAVIGATION
---------------------------------------------------------------------------------------------------------------*/
.primary-navi { position:absolute; top:117px; left:375px; }
.primary-navi li { float:left; list-style:none; padding-right:32px; }
.primary-navi li a { display:block; padding:24px 0 0 0; height:0 !important; height /**/:24px; overflow:hidden; }
.primary-navi li a:hover { background-position:0 24px; }
.navi-story-so-far { background:url(/images/navi-story.gif) 0 0; width:136px; }
.navi-contact { background:url(/images/navi-contact.gif) 0 0; width:87px; }
.navi-clay { background:url(/images/navi-clay.gif) 0 0; width:144px; }
/*IMAGE REPLACEMENTS
---------------------------------------------------------------------------------------------------------------*/
.home-footer { width:941px; background:url(../images/bottom-bar.gif) 0 0 no-repeat; height:90px; position:absolute; top:570px; }
.home-footer p, .top-bar p { display:block; overflow:hidden; position:absolute; }
.building-naturally { width:182px; background:url(/images/building-naturally.gif) 0 0; padding:21px 0 0 0; height:0 !important; height /**/:21px; }
.building-naturally-2 { width:166px; background:url(/images/building-naturally-2.gif) 0 0; padding:18px 0 0 0; height:0 !important; height /**/:18px; }
.queen { width:284px; background:url(/images/queen.gif) 0 0; padding:11px 0 0 0; height:0 !important; height /**/:11px; }
.copyright { width:102px; background:url(/images/copyright.gif) 0 0; padding:12px 0 0 0; height:0 !important; height /**/:12px; position: relative; top: 0px; left: 500px; }
.story-contact { top:300px; left:647px; position:absolute; }
.main-footer-contact { top:28px; left:230px; position:absolute; }
.story-contact a:hover, .main-footer-contact a:hover { background-position:0 -12px; }
.ctd { width:54px; background:url(/images/ctd.gif) 0 0; padding:12px 0 0 0; height:0 !important; height:12px; display:block; overflow:hidden; }
.home-ctd { top:50px; left:863px; position:absolute; }
.main-footer-ctd { top:20px; left:690px; position:relative; width:100px;height:20px; }
.Booklinks span{
font-family: 'Lucida Grande', Verdana, Sans-Serif;
font-size: 11px;
color: #FFFFFF;
text-decoration: none;
}
.Booklinks a{
font-family: 'Lucida Grande', Verdana, Sans-Serif;
font-size: 11px;
color: #FFFFFF;
text-decoration: none;
}
.Booklinks a:hover{
font-family: 'Lucida Grande', Verdana, Sans-Serif;
font-size: 11px;
color: #BCC900;
text-decoration: none;
}
/*BODY
---------------------------------------------------------------------------------------------------------------*/
#body { padding-left:61px; width:745px; }
.the-story-so-far { width:745px; padding:54px 0 0 0; height:0 !important; height /**/:54px; display:block; overflow:hidden; position:absolute; top:501px; left:61px; background:url(/images/h1-the-story-so-far.gif) 0 0 no-repeat; }
#body ul { padding-top:115px; }
/* #body li { list-style:none;font-size:1.2em; color:#c7df49; padding:0 0 5px 11px;}*/
#body li a { color:#c7df49; text-decoration:none; }
.main-footer { float:left; clear:both; height:100px; width:745px; padding-left:61px;}
.main-footer div { position:relative; }
.main-footer div p { display:block; overflow:hidden; position:absolute; }
/*BLOG
---------------------------------------------------------------------------------------------------------------*/
#blog { margin-top:100px; padding-left:61px; float:left; clear:both; width:745px; padding-top:55px; background:url(/images/line-break.gif) 61px 0 no-repeat; }
#blog div h2 { font-size:1.3em; color:#c7df49; padding:0 100px 1em 0; text-transform:uppercase; }
/*#blog div { width:515px; float:left; clear:both; padding:0 0 53px 230px; background:url(/images/line-break.gif) 0 bottom no-repeat; position:relative; }
#blog div img { margin:-28px 0 0 -230px; float:left; width:204px; }
#blog div h2 { font-size:1.3em; color:#c7df49; padding:0 100px 1em 0; text-transform:uppercase; }
#blog div p { font-size:1.3em; color:#FFF; padding-bottom:1em; padding-right:20px; }*/
#blog div { width:745px; float:left; clear:both; padding:0 0 53px 0; background:url(/images/line-break.gif) 0 bottom no-repeat; position:relative; }
#blog div img {width:204px; float:left; margin:-60px 0 0 -230px; }
/* Blog */
#blog div h2 {font-size:1.3em; color:#c7df49; padding:0 100px 1em 230px; text-transform:uppercase; }
#blog div p { font-size:1.3em; color:#FFF; padding:0 20px 1em 230px; }
#blog a {color:#FFF; text-decoration:underline; }
#blog a:hover {color:#dc763d; }
#blog .back-to-top { font-size:1.1em; }
#blog .back-to-top a { color:#c7df49; text-decoration:none; }
#blog .back-to-top a:hover { text-decoration:underline; }
#blog div div { display:none; }
.top-bar { position:relative; }
.top-bar p { display:block; overflow:hidden; position:absolute; }
.navi-contact-2 { background:url(/images/navi-contact-2.gif) 0 0; width:60px; padding:12px 0 0 0; height:0 !important; height /**/:12px; display:block; overflow:hidden; }
/*PAGE
---------------------------------------------------------------------------------------------------------------*/
#content { margin-top:0; padding-left:61px; float:left; clear:both; width:745px; padding-top:55px;}
.page-top-bar { position:relative; }
.page-top-bar p { display:block; overflow:hidden; position:absolute; top:0; left:0; }
#content .naturally-beautiful { width:513px; margin-left:230px; padding:28px 0 0 0; height:0 !important; heig/colour-chart/ht /**/:28px; display:block; overflow:hidden; background:url(/images/naturally-beautiful.gif) 0 0 no-repeat; margin-bottom:16px; }
.clayworth { width:513px; margin-left:230px; padding:28px 0 0 0; height:0 !important; height /**/:28px; display:block; overflow:hidden; background:url(/images/Clayworth2.png) 0 0 no-repeat; margin-bottom:16px; }
#content cite{ float: right;padding-left:40px;padding-bottom:20px; color: #979797; }
#content h2 { margin-left:230px; padding:53px 0 0 0; height:0 !important; height:53px; display:block; overflow:hidden; }
.inspired-by-nature { background:url(/images/inspired-by-nature.gif) 0 0 no-repeat; width:358px; }
.where-to-use-them { background:url(/images/where-to-use-them.gif) 0 0 no-repeat; width:374px; }
.why-use-them { background:url(/images/healthy.png) 0 0 no-repeat; width:500px; }
.how-to-use-them { background:url(/images/how-to-use-them.gif) 0 0 no-repeat; width:336px; }
.where-to-buy { background:url(/images/where-to-buy.gif) 0 0 no-repeat; width:263px; }
.guidance-notes { background:url(/images/guidance-notes.gif) 0 0 no-repeat; width:304px; }
.more-to-know { background:url(/images/books.png) 0 0 no-repeat; width:500px; }
.colour-chart { background:url(/images/mica3.png) 0 0 no-repeat; width:515px; height:90px;}
.conditions-of-sale { background:url(/images/conditions-of-sale.gif) 0 0 no-repeat; width:358px; }
.training-style { background:url(/images/Database.png) 0 0 no-repeat; width:500px; height: 80px; }
.products {background:url(/images/product8.png)0 0 no-repeat; width:302px;}
.trainingcourses{background:url(/images/training2.png)0 0 no-repeat; width:505px; position:relative; height:40px; }
.training2 { width:513px; margin-left:230px; padding:40px 0 0 0; height:0 !important; height /**/:28px; display:block; overflow:hidden; background:url(/images/training2.png) 0 0 no-repeat; margin-bottom:16px; }
#content .post { width:745px; float:left; clear:both; padding:40px 0 20px 0; }
#content .post div { width:515px; float:right; }
#content .post div h1 { color:#bcc900; font-size:2.6em; font-weight:normal; }
h3 {color:#bcc900; font-size:18px; padding-bottom:10px;}
#content .post div h3 {color:#ffffff; font-size:20px; font-weight:normal; }
/* #h4correction h4 {color:#bcc900; font-size:20px; font-weight:normal; position:relative; top:30px;}*/
#content .post div h4 {color:#ffffff; font-size:16px; font-weight:normal; text-decoration:underline; }
#content .post div h5 { color:#bcc900; font-size:18px; font-weight:normal;text-decoration:underline;}
#content .post div p { font-size:1.5em; line-height:1.5em; color:#cecccc; padding-bottom:20px;padding-right:20px; /*padding-top:10px;*/ }
#content .post div em { color:#bcc900; font-style:normal; }
#content .post div a { color:#bcc900; text-decoration:none; /*font-weight:bold;*/ }
#content .post div a:hover { color:#FFF; text-decoration:underline; }
/* Default List style */
#content .post div ul { list-style:none; color:#bcc900;/*background:url(/images/list.gif) 0 0 no-repeat; padding:28px 0 0 0; margin-top:8px; */}
/*
#content .post div ul li { font-size:1.6em; line-height:1.5em; padding-right:40px; }
*/
#content .post div ol { list-style:none; background:url(/images/dotty.gif) 0 0 repeat-x; padding-top:8px; margin-bottom:8px; width:100%; float:left; clear:both; }
#content .post div ol li { font-size:1.5em; line-height:1.5em; color:#cecccc; width:125px; float:left; }
#content .post div ol li a { color:#cecccc; outline:none; }
#content .post div ol li a:hover { color:#bcc900; text-decoration:none; }
#content .post div ol li a:focus { color:#bcc900; font-weight:bold; }
#content .post .secondary-navi { list-style:none; width:230px; float:left; }
#content .post .secondary-navi li { width:209px; float:left; clear:both; font-size:1.5em; background:url(/images/dotty.gif) 0 bottom repeat-x; padding-bottom:10px; margin-bottom:10px; }
#content .post .secondary-navi li a { color:#FFF; text-decoration:none; }
#content .post .secondary-navi li a:hover, #content .post .secondary-navi li a.active { color:#bcc900; }
/*CONTACT FORM
---------------------------------------------------------------------------------------------------------------*/
#contact { padding:20px 0 0 15px; }
#contact form { width:497px; }
#contact form p { float:left; clear:both; width:497px; padding-top:8px; }
#contact form label { float:left; clear:both; font-size:1.1em; color:#414141; padding-bottom:3px; }
#contact form label em { color:#979797; }
.formbox { float:left; clear:both; border:1px solid #717171; height:20px; padding:4px 0 0 4px; width:491px; background:#ededed; }
.formbox-large { float:left; clear:both; border:1px solid #717171; height:145px; padding:4px 0 0 4px; width:491px; background:#ededed; }
.but-form { width:203px; height:24px; margin-top:4px; }
/*ZIMOZ additions----------#dc763d
#c7df49-----------------------------------------------------------------------------------------------------*/
.tel-black {background:url(/images/telstrip.jpg); width:745px; height:34px; position: absolute; top:255px; left:0px; z-index:13}
/* SIDE PANNEL For Blog */
#sidepannel {list-style:none; width:330px; position:absolute; top:480px;left:740px; padding-left:10px;}
#sidepannel ul {list-style-type: none; list-style-image: none; list-style:none; line-height:12px; padding-bottom:20px;}
#sidepannel li{list-style:none; list-style-image: none; width:230px; line-height:1em;}
#sidepannel h3 {color:#979797;font-size:14px; background:url(/images/dotty.gif) 0 bottom repeat-x; padding-bottom:10px; float:left; width:100px;}
/*#sidepannel .post li {list-style:none; width:209px; float:left; clear:both; font-size:1.2em; 0 bottom repeat-x; padding-bottom:10px; margin-bottom:10px; }*/
#sidepannel .post li a {list-style:none;color:#FFF; text-decoration:none; }
#sidepannel .post li a:hover, #content .post li a.active { color:#979797; list-style:none;}
#sidepannel ul {list-style:none; padding-top:36px;}
#sidepannel li {font-size:12px; padding:0 0 5px 11px; font-style:normal;}
#sidepannel li a {list-style:none; color:#CDCDCD; text-decoration:none; }
#sidepannel li a:hover {list-style:none; color:#c7df49; text-decoration:none; }
/* SIDE PANNEL For Archive */
#sidepannel2 {list-style:none; width:100px; position:absolute; top:230px;left:790px; /*float:right;*/}
#sidepannel2 ul {padding-bottom:0px; position: relative; top: 0px; line-height:12px; padding-left:10px;}
#sidepannel2 li { list-style:none; list-style-image: none; position:relative;top:-100px; left: -61px; font-size:1.4em; color:#CDCDCD; line-height:11px;}
/* H3 menu right Archive */
#sidepannel2 h3 {color:#979797;font-size:14px; background:url(/images/dotty.gif) 0 bottom repeat-x; padding-bottom:6px; position:relative; left:-60px; top: -20px; float:left; width:100px;}
#sidepannel2 li a {font-size:12px; line-height:12px; list-style:none; color:#CDCDCD; text-decoration:none; }
#sidepannel2 li a:hover {list-style:none; color:#c7df49; text-decoration:none; }
#sidepannel2 navigation a{color:#c7df49;}
#sidepannel2 navigation a:hover {color:#fff;text-decoration:underline;}
#menu2 {position: absolute; top: 70px;}
#menu3 {position: relative; top: 0px; left: 0px;}
/* Archive */
#content2 {margin-top:0; padding-left:61px; float:left; clear:both; width:600px; font-size:1.5em; color:#fff; line-height:1.5em;}
#archive h3 a {color:#c7df49;font-size:22px; float:left; line-height=10px; text-decoration:none; position: relative;}
#archive {width:600px; height: auto; position:relative;
top:0px; left:-58px;}
#content2 address {font-size:1em;}
#content2 .post h3{position: relative; left:-58px; top-26px; color:#c7df49;font-size:22px; clear:both; text-decoration:none; padding-top:10px;}
/*.archive h3 {position: relative; left:-60px; top-26px; color:#c7df49;font-size:22px; padding-top:10px; padding-bottom:20px; clear:both; text-decoration:none;}*/
#content2 small {font-size: 12px; color: #979797; position:relative; top:0px; left:-58px; }
#content small {font-size: 12px; line-height: 14px; color: #979797; position:relative;top:20px;}
/*.linebreak {background:url(/images/line-break.gif); width:745px;height:30px; position:relative; clear:both; padding-top:10px;}*/
#sidepannel .links {position:absolute;top:400px;}
#cat ul {line-height:12px; color:#979797; text-decoration:none; position: relative; text-transform:lowercase;}
#cat li a{list-style:none; color:#979797;font-size:16px; line-height:12px; text-decoration:none; text-transform:lowercase; position: relative;}
.navigation {font-size: 12px; position:relative; top: 0px; display: block; text-align: center; width:745px; clear: both; padding-bottom:10px;}
.navigation2 {font-size: 12px; position:relative; display: block; text-align: center; width:680px;}
.navigation a{font-size:1em; color:#979797}
#content2 a {color:#fff; text-decoration:underline;}
#content2 a:hover {color:#fff; text-decoration:underline;}
#content2 h2.pagetitle{font-size:30px; color:#979797;
text-align: left; padding-bottom:20px; position: relative; left: -58px; top: 0px;background:url(/images/dotty.gif) 0 bottom repeat-x; }
/*#content2 h2 {font-size:2em;color:#979797; background:url(/images/dotty.gif) 0 bottom repeat-x; padding-bottom:10px; width: 600px; }*/
#content2 a{color:#c7df49; line-height:24px; text-decoration:none; }
#content2 img{padding-right:10px; padding-bottom: 10px;}
/* Telephone index.php front home page */
#newtel {background:url(/images/newtel3.png); width:142px; height: 34px; position: absolute; top: 0px; left:54px; }
/* SEARCH FORM */
#searchform {position:absolute; width: 150px; top:-40px; text-transform:lowercase; font-size:12px; color:#979797; }
#searchform ul{padding-bottom:0px;}
#searchform input[type="text"]
{width:100px;
display:block;
margin-bottom:10px;
background-color:#979797;
}
/* SEARCH FORM2 */
#searchform2 {position: absolute; width: 150px; top: -200px; left: 350px; text-transform:lowercase; font-size:12px; color:#979797; }
#searchform2 ul{padding-bottom:0px;}
#searchform input[type="text"]
{width:70px;
display:block;
margin-bottom:10px;
background-color:#979797;
}
/* CONTENT 3 Search Page */
#content3 {padding-left:61px; /*float:left; clear:both; */width:745px; font-size: 1.5em; line-height:22px; color:#fff; position:relative; top: 20px; left:-61px;}
#content3 h2.pagetitle{color:#979797;font-size:24px; background:url(/images/dotty.gif) 0 bottom repeat-x; padding-bottom:10px; width: 745px;}
#content3 h2.pagetitle{font-size:30px; color:#979797;
text-align: left; padding-bottom:20px; position: relative; left: 0px; top: -30px; }
#content3 a{color:#c7df49; text-decoration:none; }
#content3 a:hover{color:#fff; text-decoration:underline; }
#content3 img{padding-right:10px; padding-bottom:10px;}
/* Forward back menu and breadcrumbs */
#menu3 {font-size:14px; position: relative; top: 50px; left:10px; }
#archive .menu3 {font-size:14px; width: 650px;}
#menu3 a{font-size:14px;}
#menu3 a:hover {font-size:14px;}
.alignright {
float: right;
}
.alignleft {
float: left;
}
#linebreak {position: relative; clear:both; width:650px; padding-top:55px; background:url(/images/line-break3.gif) no-repeat;}
#linebreak2 {position: relative; top:10px; width:745px; padding-top:55px; background:url(/images/line-break.gif) no-repeat; clear:both;}
#content3 h2 {background:url(/images/dotty.gif) 0 bottom repeat-x; padding-bottom:20px;
}
/*
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
*/
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {float:left;
padding-top: 4px;
display: inline;
}
#content3 .post img.alignleft {float:left;
padding-top: 4px;
display: inline;
}
#content2 p{padding-bottom:1.2em;}
#content3 p{padding-bottom:1.2em; margin-top:4px; position:relative; top: 4px;}
#content3 img {padding-right:16px; padding-bottom:16px;}
#correct{position:relative; left:0px; display: block;}
#searchbreak{background:url(/images/dotty.gif) 0 bottom repeat-x; width:745px; padding-bottom:20px;
}
#twitter{position:relative; top:30px;}
#productlist li{font-size:14px; color: #cecccc;
list-style-type: circle;
list-style-position: inside;
line-height:20px;
padding-left:30px;
}
#subtitle {position:relative; top:-25px; color: #cecccc; font-size:20px; font-weight:bold;}
#twitter_share{position: relative;
top:70px;}
/* LISTS */
#JB_list ul{padding-bottom:20px; padding-top:20px;}
#JB_list li{Font-size:16px; color: #cecccc; position: relative; left: 20px;
list-style: decimal outside;clear: left; margin-left:20px;
padding-bottom:10px;}
table{font-size:12px; color: #cecccc;}
table li {position: relative; left: 20px;
list-style: decimal outside;clear: left; margin-left:20px;
padding-bottom:10px;}
#JB_list a:link {color: #fff;}
#wheretouse{font-size:22px;color: #cecccc; padding-bottom:20px;}
.widgettitle{font-size:16px;}
.subtitle{font-size:16px;color:#cecccc; position:relative; padding-bottom:20px;clear:both;width:100%;}
#content .post div .plaster{font-size:26px;color:#cecccc; position:relative; width:100%; padding-bottom:10px;}
#content .post a img {
/* This centers the image */
display: block;
/*
margin-left: auto;
margin-right: auto;
*/
/* This adds the border */
padding:8px;
border:solid;
border-color: #474747 #4A4A4A #4A4A4A #474747;
border-width: 1px 2px 2px 1px;
background-color:#525252 ;
margin-right:20px;
}
blockquote {
font: 11px italic Times, serif;
font-style:italic;
/* padding: 8px;*/
/*
background-color: #777;
*/
border-top: 2px solid #555;
/*
border-bottom: 2px solid #555;
*/
/* margin: 5px;*/
background-position: top left;
background-repeat: no-repeat;
}
#introtext{font-family:Arial, Helvetica, sans-serif; font-size:130%; float:right; position: relative; width: 330px; color:#CDCDCD; text-align:justify; padding-left:5px; z-index:3;}
#introtext a {color:#CDCDCD; /*text-decoration:underline; */font-weight: bold; }
#introtext a:hover {color:#BCC900; }
.social ul{list-style-type: none; float:right; padding-right:20px;}
.social li{float:left; width:30px; position: relative; top:13px;}
/*CLEAR FIX
---------------------------------------------------------------------------------------------------------------*/
.clearfix { display:inline-table; /* Hides from IE-mac \*/ height:1%; display:block; /* End hide from IE-mac */ }
html>body .clearfix { height:auto; }
.clearfix:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }