@import url("reset.css");

/* -------- ITP   ---------- **/
/* ----------------- by SJJ ---------------- */


* { font-family: Arial, Verdana, Tahoma, Helvetica, sans-serif; line-height: 140%; color: #333333;}
body {background: #ffffff url(../img/bg/body-internal.gif) top left repeat-x; }
body.home {background-image: url(../img/bg/body.gif); }

hr { text-align: right; width: 100%;  height: 1px; color: #b7c0c9; border: none; margin-bottom: 15px; clear: both;} /* For Internet Explorer */
html>body hr { margin-right: 0; width: 100%; height: 1px; background-color: #b7c0c9; border: none; } /* For Gecko-based browsers */
html>body hr { margin-right: 0; width: 100%; height: 1px; background-color: #b7c0c9; border: 0px solid #b7c0c9; } /* For Opera and Gecko-based browsers */

#wrapper {width: 960px; margin-left: auto; margin-right:auto; overflow: hidden; padding-right: 20px; font-size: 80%; }
body.home #wrapper {background: url(../img/bg/home_edge.jpg) right 44px no-repeat; }


/* ----------------- Header ---------------- */




#header {height: 201px; overflow: hidden; position: relative; background: url(../img/bg/header-internal.jpg) 1px 43px no-repeat;}
#header ul.nav {height: 39px; width: 750px;  float: left;}
#header ul.nav li {float: left; height: 39px; }
#header ul.nav li a {color: #e4e4e4; background: #4a4a4a url(../img/bg/nav.gif) top left repeat-y; padding: 12px 18px 0px 18px; height: 27px; display: block; text-decoration: none; font-weight: bold; }
#header ul.nav li a:hover {color: #ffffff;}

#header ul.language {float: right; width: 200px; margin-top: 10px; }
#header ul.language li {float: right; background: url(../img/icons/arrow-bullet.gif) left center no-repeat; padding-left: 16px;}
#header ul.language li a {color: #ffffff; padding-right: 25px; background-position: right center; background-repeat: no-repeat; text-decoration: none;}
#header ul.language li a:hover {text-decoration: underline;}
#header ul.language li a.german {background-image: url(../img/icons/german-flag.gif);}
#header ul.language li a.english {background-image: url(../img/icons/english-flag.gif);}

#header a.logo {position: absolute; top: 72px; left: 8px;  width: 347px; height: 100px; display: block; text-indent: -9999px; } 
#header #flash {background: url(../img/banners/save-the-earth.jpg) top left no-repeat; border-top: 9px solid #ffffff; border-left: 10px solid #ffffff; height: 239px; width: 530px; position: absolute; top: 44px; left: 420px;}
#header #smallflash {background: url(../img/banners/save-the-earth-small.jpg) top left no-repeat; height: 85px; width: 412px; position: absolute; top: 73px; left: 534px;}

#header a.banner {position: absolute; top: 73px; left: 534px;  width: 406px; height: 79px; display: block; text-indent: -9999px; background: url(../img/banners/save-the-earth-small.jpg) top left no-repeat; border: 3px solid #ffffff;}
#header a.banner:hover {border-color: #dcdc9e;}

body.home #header {height: 292px; background-image: url(../img/bg/header.jpg); background-position: 0px 43px;}


/* ----------------- Home Content---------------- */
#home-leftcol {width: 420px; background: url(../img/bg/home-leftcol.jpg) top right no-repeat; float: left; padding-top: 18px; margin-right: 20px;  margin-bottom: 0px;}
#home-leftcol ul.actions { overflow: hidden;}
#home-leftcol ul.actions li {float: left; }
#home-leftcol ul.actions li a {width: 190px; height: 110px; text-indent: -9999px; margin-right: 20px; display: block; background-position: top left; background-repeat: no-repeat; margin-bottom: 20px;}
#home-leftcol ul.actions li a.sell {background-image: url(../img/banners/sell.gif);}
#home-leftcol ul.actions li a.donate {background-image: url(../img/banners/donate.gif);}
#home-leftcol ul.actions li a.buy {background-image: url(../img/banners/buy.gif);}
#home-leftcol ul.actions li a.other {background-image: url(../img/banners/other.gif);}

#home-leftcol a img.didyouknow { border: 1px solid #bdbdbd; height: 128px; width: 398px; background-position: top left; background-repeat: no-repeat; display: block; text-indent: -9999px;} 
#home-leftcol a.dyk1 {background-image: url(../img/dyk/1.jpg);}

#home-rightcol {width: 510px; float: left; padding: 19px 0px 0px 0px;  margin-bottom: 20px;}
#home-rightcol h1 {color: #1e88b3; font-size: 185%; border-bottom: 1px solid #e4e211; padding-bottom: 9px; margin-bottom: 17px; font-weight: normal; }
#home-rightcol p {margin-bottom: 19px;}
#home-rightcol p.summary {font-weight: bold;}

#home-rightcol ul.banners {height: 1%;}
#home-rightcol ul.banners li.mostwanted {float: left;}
#home-rightcol ul.banners li.mostwanted a {height: 160px; width: 239px; display: block; background: url(../img/banners/most-wanted.jpg) top left no-repeat; text-indent: -9999px; margin-top: 5px;}
#home-rightcol ul.banners li.collect {float: right; margin-right: -10px;}
#home-rightcol ul.banners li.collect a {height: 165px; width: 250px; display: block; background: url(../img/banners/collect.jpg) top left no-repeat; text-indent: -9999px; }





/*-----------------Internal Left Col-------*/
#leftcol {width: 190px; float: left; margin-right: 32px; padding-top: 19px; margin-bottom: 20px;}
#maincol {width: 627px; float: left; margin-right: 18px; margin-bottom: 20px;  padding-top: 16px;}
#rightcol {width: 93px; float: left; margin-bottom: 20px; padding-top: 55px;}

#leftcol ul.nav {margin-bottom: 20px; }
#leftcol ul.nav li {margin-bottom: 2px; }
#leftcol ul.nav li a {padding: 4px 12px 4px 20px; display: block; color: #ffffff; text-decoration: none; font-weight: bold; font-size: 130%; background-color: #5f5f5f; }

#leftcol ul.nav li.sell a { background: #0a86b1 url(../img/bg/nav-main-blue.gif) top left no-repeat; }
#leftcol ul.nav li.sell a:hover {color: #c7e0e9;}
#leftcol ul.nav li.donate a {background: #dc680d url(../img/bg/nav-main-orange.gif) top left no-repeat; }
#leftcol ul.nav li.donate a:hover {color: #faceaf;}
#leftcol ul.nav li.buy a {background: #4e4e4e url(../img/bg/nav-main-grey.gif) top left no-repeat; }
#leftcol ul.nav li.buy a:hover {color: #c9c6c6;}
#leftcol ul.nav li.other a {background: #d8d608 url(../img/bg/nav-main-lime.gif) top left no-repeat; }
#leftcol ul.nav li.other a:hover {color: #e9e8a6;}
#leftcol ul.nav li.environment a {background: #5e9308 url(../img/bg/nav-main-green.gif) top left no-repeat; }
#leftcol ul.nav li.environment a:hover {color: #c5d4ab;}

#leftcol ul.nav li ul {border: 1px solid #c7c7c7; padding-top: 10px; padding-bottom: 13px; background: url(../img/bg/nav-bg-grey.gif) bottom left repeat-x; }
#leftcol ul.nav li ul li {padding-left: 23px; padding-right: 10px; margin-bottom: 12px; background: url(../img/icons/bullet-grey.gif) 11px 6px no-repeat; }
#leftcol ul.nav li ul li a {background-color: transparent!important; background-image: none!important;  color: #4a4a4a; text-decoration: underline!important; padding: 0px;  font-size: 100%; font-family: Tahoma;}
#leftcol ul.nav li ul li a:hover {text-decoration: none!important; color: #6d6c6c!important; }
#leftcol ul.nav li.sell ul { border-color: #92cfe4; background-image: url(../img/bg/nav-bg-blue.gif); display: none; }
#leftcol ul.nav li.sell ul li {background-image: url(../img/icons/bullet-blue.gif);}
#leftcol ul.nav li.donate ul { border-color: #f9c24c; background-image: url(../img/bg/nav-bg-orange.gif); display: none; }
#leftcol ul.nav li.donate ul li {background-image: url(../img/icons/bullet-orange.gif);}
#leftcol ul.nav li.other ul { border-color: #e0de1b; background-image: url(../img/bg/nav-bg-lime.gif); display: none; }
#leftcol ul.nav li.other ul li {background-image: url(../img/icons/bullet-lime.gif);}
#leftcol ul.nav li.environment ul { border-color: #a6d35e; background-image: url(../img/bg/nav-bg-green.gif); display: none; }
#leftcol ul.nav li.environment ul li {background-image: url(../img/icons/bullet-green.gif);}
#leftcol ul.nav li.buy ul { display: none; }

#leftcol ul.nav li.sell ul li ul, #leftcol ul.nav li.buy ul li ul {display: block; border: none; background: none;  padding-bottom: 0px; padding-top: 5px;}
#leftcol ul.nav li.sell ul li ul li, #leftcol ul.nav li.buy ul li ul li {background: url(../img/icons/bullet-small.gif) left center no-repeat; margin-bottom: 2px; padding-left: 7px;}
#leftcol ul.nav li.sell ul li ul li a, #leftcol ul.nav li.buy ul li ul li a  {font-weight: normal; text-decoration: none; color: #222222; }



#leftcol a.mostwanted {background: url(../img/banners/most-wanted-small.jpg) top left no-repeat; height:127px; width:190px; display: block; clear: both; text-indent: -9999px;}


#maincol h1 {padding-bottom: 9px; margin-bottom: 20px; color: #1e88b3; font-size: 195%; font-weight: normal; border-bottom: 1px solid #e4e211; }
#maincol h2 {color: #0d98b5; margin-bottom: 15px; font-size: 130%; font-weight: normal;}
#maincol h3 {color: #535252; font-weight: bold; background-color: #f1f0b7; padding: 5px 15px; margin-bottom: 20px; font-size: 110%; }
#maincol img {float: left; padding: 6px; border: 1px solid #cfcfcf; margin-right: 18px; margin-bottom: 18px;}
#maincol img.center {float: none; text-align: center; clear: both; border: none; padding: 0px; display: block; margin-left: auto; margin-right: auto;}
#maincol p {margin-bottom: 15px;}
#maincol p.summary {font-weight: bold; color: #666666;}
#maincol ul {margin-bottom: 20px;}
#maincol ul li {background: url(../img/icons/bullet.gif) left center no-repeat; padding-left:20px; margin-bottom: 5px; }
#maincol a {color: #0d98b5; text-decoration: underline; }
#maincol a:hover {text-decoration: none; }
#maincol ol {margin-bottom: 20px;}
#maincol ol li {list-style-type: decimal; margin-bottom: 5px; list-style-position: inside;}

#maincol ul.news-list li {padding-left: 0px; background: none; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #dddddd; overflow: hidden; height: 1%;}
#maincol ul.news-list li div {float: left; width: 535px;}
#maincol ul.news-list li h2 {margin-bottom: 1px;}
#maincol ul.news-list li h2 a {text-decoration: none;}
#maincol ul.news-list li h2 a:hover {text-decoration: underline;}
#maincol ul.news-list li p.date {font-weight: bold; margin-bottom: 5px;}
#maincol ul.news-list li p.date {font-weight: bold;}

#maincol ul.form li {padding-left: 0px; background: none; margin-bottom: 10px;  overflow: hidden; height: 1%;}
#maincol ul.form li label {font-weight: bold; width: 115px; display: block; float: left; margin-right: 5px;}
#maincol ul.form li label span {color: #ff0000;}
#maincol ul.form li input, #maincol ul.form li select {width: 155px;}
#maincol ul.form li textarea {width: 155px; height: 80px;}
#maincol ul.form li.button input {width: auto; }
#maincol ul.form li.right input {float: right;}
#maincol ul.form li.checkbox input {width: auto; }
#maincol ul.form li.link {padding-left: 120px;}
#maincol ul.form li.large textarea {height: 160px;}
#maincol div.split {width: 300px; float: left;  margin-right: 13px;}


#rightcol a.collect { display: block; height:443px; width:93px; background: url(../img/banners/collectmycartridges.gif) top left no-repeat; text-indent: -9999px;}


/* ----------------- Footer ---------------- */
#footer { background-color: #e4e211; clear: both; overflow: hidden;  padding: 7px 22px 6px 22px; margin-bottom: 30px;}

#footer p {float: left; font-size: 85%; color: #5c5c5c;}
#footer p.connexion {float:right; padding-left: 3px; }
#footer p.connexion a {color: #5c5c5c; text-decoration: none; font-weight: bold;}
#footer p.connexion a:hover {text-decoration: underline; }



/* ----------------- Tables in Admin screens ---------------- */
#maincol table {border: 1px solid #444444; margin-bottom: 10px;}
#maincol table tr th {padding: 3px 5px; font-weight: bold; background-color: #eeeeee; border: 1px solid #444444;}
#maincol table tr td {padding: 3px 5px; border: 1px solid #444444;}
#maincol table.asptable {width: 627px!important;}

/*-----------Messages----------*/
div.message { font-size: 90%; padding: 5px 9px; margin: 0px 18px 12px 6px; font-weight: bold; }
div.message span { line-height: 180%; padding-right: 20px; }
div.information { background: url(../img/icons/message-info.gif) right top no-repeat #dde8f6; border: 1px solid #3a6ba7; color: #5e7a9b; }
div.error { background: url(../img/icons/message-error.gif) right top no-repeat #facbb6; border: 1px solid #d44132; color: #c90e0e; }

div.validationsummary {font-size: 90%; padding: 5px 9px; margin: 0px 18px 12px 6px; font-weight: bold; background: url(../img/icons/message-error.gif) right top no-repeat #facbb6; border: 1px solid #d44132; color: #c90e0e; }
div.validationsummary ul {margin: 0px!important;}
div.validationsummary ul li {background-image: none!important; padding: 0px!important; margin-bottom: 1px!important;}

/*----------- Rotating Banners gallery >> SmoothGallery ----------*/
/*   http://smoothgallery.jondesign.net/getting-started/   */

#myGallery
{
width: 398px !important;
height: 128px !important;
border: 1px solid #bdbdbd!important;
overflow: hidden!important;
} 

#myGallery a {cursor: pointer; cursor: hand;}