body { background: url(../images/layout/body1.gif) top repeat-x; font-family: Arial, Helvetica, sans-serif; } #body1 { background: url(../images/layout/body.gif) top repeat-x;} /* =Header ----------------------------------------------- */ #header { height: 317px; position: relative; width: 960px; margin: 0 auto; } #header h1 { padding: 37px 0 0 0; margin-bottom: -5px; text-shadow: 1px 1px 1px #000; } #header h1 a { font: 48px "Times New Roman", Times, serif; color: #cdcdcd; text-decoration: none; } #header h1 a:hover { color: #addbd8; } #header strong { font-size: 13px; color: #b7b7b7; } #header #main-nav { position: absolute; left: 0; top: 152px; height:50px;} #header #main-nav li { display: inline; } #header #main-nav li a { display: block; float: left; font-size: 15px; text-decoration: none; padding: 17px 20px 16px 20px; color: #535353; } #header #main-nav li a:hover,#header #main-nav li a.active { background: url(../images/layout/main_nav_hover.gif) top repeat-x; color: white; } #quote { width: 151px; height: 21px; border: none; font-size: 11px; position: absolute; right: 20px; top: 69px; padding: 5px 38px 0 8px; color: #999; } #social-media { position: absolute; top: 161px; right: 0; } #social-media li { display: inline; } #social-media li a { display: block; float: left; text-indent: -5000px; width: 30px; height: 32px; margin-left: 12px; } #social-media li.item-1 a { background: url(../images/icons/facebook.gif) no-repeat; } #social-media li.item-2 a { background: url(../images/icons/twitter.gif) no-repeat; } #social-media li.item-3 a { background: url(../images/icons/rss.gif) no-repeat; } #header h2, #content-inner .column h2 { font: 36px "Times New Roman", Times, serif; color: #3a3a3a; text-shadow: 1px 1px 1px #fff; position: absolute; top: 230px; left: 0; } #header h2 span { font: 13px Arial, Helvetica, sans-serif; display: block; text-shadow: none; } /* added ish by thabang*/ #back { padding: 0px 0 0 -50px ;float:left; width: 100%; } #logo { margin-top : -300px ; width:100px; height:50px } #pos { margin: 50px 0 0 0} #cu3er-container {width:500px; height:180px; float:left; outline:0; position:absolute; top:210px; left:460px; z-index:10} #header #main-n { position: absolute; left: 750px; top: 151px; } #header #main-n li { list-style:disc; display:inline;} #header #main-n li a { list-style:disc; display:; float: left; font-size: 12px; text-decoration: none; padding: 17px 0px 0px 20px; color:#000000; } #header #main-n li a:hover,#header #main-n li a.active { background: url(../images/layout/main_nav_hover.gf) top repeat-x; color:#3333FF; } #read-more { text-align: right; } #read-more a { text-transform: uppercase; color: #515151; text-decoration: none; background: url(../images/icons/read_more.gif) left no-repeat; padding-left: 18px; } #read-more a:hover { color: #739b99; } /* =Content ----------------------------------------------- */ #content { background: url(../images/layout/content.gif) bottom repeat-x; padding-bottom: 90px; color: #3c3c3c; } #content-inner { width: 960px; margin: 0 auto; padding-top: 110px; } #content-contact { width: 960px; margin: 0 auto; margin-top:-70px; } #content-about { width: 960px; margin: 0 auto; margin-top:-70px; } #content-consumable { width: 960px; margin: 0 auto; margin-top:-70px; } #content-stationary { width: 960px; margin: 0 auto; margin-top:-70px; } #content-productDescription { width: 960px; margin: 0 auto; margin-top:-70px; } #content .column { width: 300px; margin-right: 30px; float: left; } #content .column.last { margin-right: 0; } #content .column h2 { position: relative; top: auto; left: auto; font-size: 26px; font-weight: normal; text-shadow: none; } #content .column h2 a { color: #3c3c3c; text-decoration: none; } #content .column h2 a:hover { color: #6e8f8d; } #content .column p.info { font-size: 12px; margin-bottom: 10px; } #content .column p.info strong { color: #6d6c6c; } #content .column img { display: block; padding-bottom: 5px; border-bottom: 3px solid #e6e6e6; margin-bottom: 20px; } #content .column p { font-size: 12px; color: #515151; line-height: 1.5; margin-bottom: 20px; text-align: justify; } #content .column p.read-more { text-align: right; } #content .column p.read-more a { text-transform: uppercase; color: #515151; text-decoration: none; background: url(../images/icons/read_more.gif) left no-repeat; padding-left: 18px; } #content .column p.read-more a:hover { color: #739b99; } #content .column p strong { font-weight: bold; } #content .column p em { font-style: italic; } #content .column p a { color: #739b99; } #content .column.main { width: 650px; position: relative; } #content .column.main h2 { margin-bottom: 20px; } #content .column.main h3 { font-size: 13px; font-weight: bold; } /* no side */ #content .column.noside { width: 960px; position: relative; } #content .column.noside h2 { margin-bottom: 20px; } #content .column.noside h3 { font-size: 13px; font-weight: bold; } #content .column.noside #products li { width: 140px; margin-left: 40px; margin-right: 15px; float: left; width: 250px; margin-right : 0;} #content .column.noside #products li img { margin-bottom: 10px; width: 200px; height: 130px; padding:0 0 0 0px ; margin-left: 25px; } #content .column.noside #products li.last { margin-right: 0; } #content .column.noside #products li h4 { font-size: 12px; font-weight: bold; margin-bottom: 5px; } #content .column.noside #products li p { font-size: 11px; } /* no side - end */ #content .column.main #team li { width: 140px; margin-right: 20px; float: left; } #content .column.main #team li img { margin-bottom: 10px; } #content .column.main #team li.last { margin-right: 0; } #content .column.main #team li h4 { font-size: 12px; font-weight: bold; margin-bottom: 5px; } #content .column.main #team li p { font-size: 11px; } #content .column.main #services img { float: left; width: 300px; margin-right: 20px; } #content .column.main #services li { clear: both; margin-bottom: 30px; } #content .column.main #services li h3 { font-size: 18px; font-weight: normal; margin-bottom: 10px; } #content .column.main #services li img { padding: 0; margin: 0 20px 0 0; border: none; } #content .column.main #services li.last { margin-bottom: 0; } #content .column.main #contact { width: 100%; margin-left:80px } #content .column.main #contact li { margin-bottom: 20px; } #content .column.main #contact li .input-text { background: url(../images/layout/contact_input_text.PNG) no-repeat; width: 100%; height: 28px; border: none; font-size: 12px; padding: 3px 5px 0 5px; } #content .column.main #contact li label { font-size: 12px; display: block; margin-bottom: 5px; text-indent: 5px; } #content .column.main #contact li textarea { background: url(../images/layout/text.png) no-repeat; width: 440px; height: 134px; padding: 5px; border: none; } #content .column.main #contact li .input-button { background: url(../images/layout/contact_button.gif) no-repeat; width: 95px; height: 29px; text-align: center; font-size: 12px; color: #fff; border: none; cursor: pointer; float: left; } #content .column.main #info { position:absolute; left: 650px; top: 50px; width:300px } #content .column.main #info h3 { font-size: 13px; font-weight: bold; } #content .column.main #products li { width: 140px; margin-right: 20px; float: left; width: 250px} #content .column.main #products li img { margin-bottom: 10px; width: 150px; height: 100px } #content .column.main #products li.last { margin-right: 0; } #content .column.main #products li h4 { font-size: 12px; font-weight: bold; margin-bottom: 5px; } #content .column.main #products li p { font-size: 11px; } #content .column.main .blog-post .photo { width:160px; margin-right: 10px; float: left;} #content .column.main .blog-post .photo img { border: 3px solid #eee; padding: 0; } #content .column.main .blog-post h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; } #content .column.main .blog-post span.category, #content .column.main .blog-post.full p.author { font-size: 12px; display:block; margin-bottom: 10px; } #content .column.main .blog-post h3 a { color: #739b99; text-decoration: none; } #content .column.main .blog-post h3 a:hover { color: #000; } #content .column.main .blog-post span.category a { color: #739b99; } /*--------------------------the add on-------------------------*/ #content .column.main .one .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .one .photo img { border: 3px solid #eee; } #content .column.main .one h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .one span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -104px 8px 0px 0px;float:right} #content .column.main .one span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .one h3 a { color: #739b99; text-decoration: none; } #content .column.main .one h3 a:hover { color: #000; } #content .column.main .one span.category a { color: #739b99; } #content .column.main .one span.cate a { color: #739b99; } #content .column.main .one p { margin: -56px 8px 0px 0px; float:right;} #content .column.main .two .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .two .photo img { border: 3px solid #eee; } #content .column.main .two h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .two span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -104px 8px 0px 0px;float:right} #content .column.main .two span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .two h3 a { color: #739b99; text-decoration: none; } #content .column.main .two h3 a:hover { color: #000; } #content .column.main .two span.category a { color: #739b99; } #content .column.main .two span.cate a { color: #739b99; } #content .column.main .two p { margin: -56px 8px 0px 0px; float:right;} #content .column.main .three .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .three .photo img { border: 3px solid #eee; } #content .column.main .three h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .three span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -104px 8px 0px 0px;float:right} #content .column.main .three span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .three h3 a { color: #739b99; text-decoration: none; } #content .column.main .three h3 a:hover { color: #000; } #content .column.main .three span.category a { color: #739b99; } #content .column.main .three span.cate a { color: #739b99; } #content .column.main .three p { margin: -56px 8px 0px 0px; float:right;} #content .column.main .four .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .four .photo img { border: 3px solid #eee; } #content .column.main .four h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .four span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -104px 8px 0px 0px;float:right} #content .column.main .four span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .four h3 a { color: #739b99; text-decoration: none; } #content .column.main .four h3 a:hover { color: #000; } #content .column.main .four span.category a { color: #739b99; } #content .column.main .four span.cate a { color: #739b99; } #content .column.main .four p { margin: -56px 8px 0px 0px; float:right;} #content .column.main .five .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .five .photo img { border: 3px solid #eee; } #content .column.main .five h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .five span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -106px 8px 0px 0px;float:right} #content .column.main .five span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .five h3 a { color: #739b99; text-decoration: none; } #content .column.main .five h3 a:hover { color: #000; } #content .column.main .five span.category a { color: #739b99; } #content .column.main .five span.cate a { color: #739b99; } #content .column.main .five p { margin: -56px 8px 0px 0px; float:right;} /*-------------------the pens---------------------------*/ #content .column.main .een .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .een .photo img { border: 3px solid #eee; } #content .column.main .een h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .een span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -124px 8px 0px 0px;float:right} #content .column.main .een span.cate { font-size: 12px; margin: -117px 8px 0px 0px;float:right} #content .column.main .een h3 a { color: #739b99; text-decoration: none; } #content .column.main .een h3 a:hover { color: #000; } #content .column.main .een span.category a { color: #739b99; } #content .column.main .een span.cate a { color: #739b99; } #content .column.main .een p { margin: -92px 8px 0px 0px; float:right;} #content .column.main .2 .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .2 .photo img { border: 3px solid #eee; } #content .column.main .2 h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .2 span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -104px 8px 0px 0px;float:right} #content .column.main .2 span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .2 h3 a { color: #739b99; text-decoration: none; } #content .column.main .2 h3 a:hover { color: #000; } #content .column.main .2 span.category a { color: #739b99; } #content .column.main .2 span.cate a { color: #739b99; } #content .column.main .2 p { margin: -56px 8px 0px 0px; float:right;} #content .column.main .3 .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .3 .photo img { border: 3px solid #eee; } #content .column.main .3 h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .3 span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -104px 8px 0px 0px;float:right} #content .column.main .3 span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .3 h3 a { color: #739b99; text-decoration: none; } #content .column.main .3 h3 a:hover { color: #000; } #content .column.main .3 span.category a { color: #739b99; } #content .column.main .3 span.cate a { color: #739b99; } #content .column.main .3 p { margin: -56px 8px 0px 0px; float:right;} #content .column.main .4 .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .4 .photo img { border: 3px solid #eee; } #content .column.main .4 h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .4 span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -104px 8px 0px 0px;float:right} #content .column.main .4 span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .4 h3 a { color: #739b99; text-decoration: none; } #content .column.main .4 h3 a:hover { color: #000; } #content .column.main .4 span.category a { color: #739b99; } #content .column.main .4 span.cate a { color: #739b99; } #content .column.main .4 p { margin: -56px 8px 0px 0px; float:right;} #content .column.main .5 .photo { width:150px; margin-left: 10px; float:right; margin: -127px 0px 0px 0px; } #content .column.main .5 .photo img { border: 3px solid #eee; } #content .column.main .5 h3 { font: 18px "Times New Roman", Times, serif; margin-bottom: 1px; float:right; margin: -127px 8px 0px 00px} #content .column.main .5 span.category, #content .column.main .blog-post.full p.author { font-size: 12px; margin: -106px 8px 0px 0px;float:right} #content .column.main .5 span.cate { font-size: 12px; margin: -82px 8px 0px 0px;float:right} #content .column.main .5 h3 a { color: #739b99; text-decoration: none; } #content .column.main .5 h3 a:hover { color: #000; } #content .column.main .5 span.