/* 1: BODY AND UNIVERSAL RESET
============================================================================ */

body {
	margin: 0px;
	padding: 0px;
	background: #f2f2f2;
	color: #333333;
	font: 12px/160% Verdana, Arial, 'Bitstream Vera Sans', sans-serif;
	text-align: center;
	}

/* Reset margin and padding for all elements */

* {margin: 0; padding: 0;}

h1 {
	font: bold 16px/180% Verdana, Arial, 'Bitstream Vera Sans', sans-serif;
	color:#000;
	margin: 10px 0px 10px 0px;
	
	}


/* 2: NAVIGATION
============================================================================ */

/* a) Top navigation and user box */

#topnav {
	list-style: none;
	float: right;
	margin: 6px -6px 0 0;
	text-align: right;
	}
#topnav li {padding: 0 16px 1px;}
#topnav li.active {
	background: url(images/menuindicator.png) right 70% no-repeat;
	font-weight: bold;
	}
#topnav a:link, #topnav a:visited {
	margin-top: 11px;
	padding: 1px 0;
	border-bottom: 1px solid #666;
	color: #fff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	}
#topnav li.active a:link, #topnav li.active a:visited {
	color: #fff;
	border: none;
	}
#topnav a:hover {
	border-bottom: 1px solid #fff;
	background: none;
	color: #fff;
	}

#userbox {
	float: right;
	width: 205px;
	margin: 0 0 20px;
	padding: 6px 16px 0;
	background: url(images/bg-userbox.png) bottom left no-repeat;
	}
#userbox img, img.avatar, img.userprofile {
	float: left;
	margin: 6px 12px 0 4px;
	padding: 4px;
	border: 1px solid #424a53;
	background: #fff;
	}
#userbox p {margin: 0 0 1.7em; color: #ccc; font-size: 11px;}
#userbox p.big {
	margin: 8px 0 0;
	color: #e9e9e9 !important;
	font-size: 13px;
	font-weight: bold;
	}
#userbox a:link, #userbox a:visited {
	margin-top: 11px;
	padding: 1px 0;
	border-bottom: 1px solid #8C99A5;
	color: #fff;
	}
#userbox a:hover {
	border-bottom: 1px solid #fff;
	background: none;
	color: #fff;
	}		
#userbox p.big a {border-color: #74828f; color: #e9e9e9 !important;}
#userbox p.big a:hover {border-color: #fff !important; color: #fff;}
#userbox strong {color: #fff;}

/* b) Footer navigation */

#nav-footer {list-style: none;float: left;}
#nav-footer li {
	display: inline;
	float: left;
	width: 100px;
	margin-left: 16px;
	padding-left: 16px;
	border-left: 1px solid #d9d9d9;
	}
#nav-footer li h4 {
	margin: 15px 0 0;
	color: #888;
	font: bold 12px 'verdana, Helvetica Neue', Arial, Helvetica, sans-serif;
	}
#nav-footer li ul {list-style: none;}
#nav-footer li ul li {border: none; margin: 0; padding: 0;}

/* c) header-nav nav */

ul#header-nav {
	list-style: none;
	float: right;
	margin: 37px 0 15px;
	padding: 3px 0;
	text-align: right;
	}
ul#header-nav li {
	display: inline;
	margin: 0 7px;
	color: #697987;
	font-size: 12px;
	font-weight: bold;
	}
ul#header-nav li a {
	margin: 0;
	padding: 0;
	color: #000;
	border: none;
	background: none;
	text-decoration: none;
	}
ul#header-nav li a:hover {color: #d5e5f2}
ul#header-nav sup {
	display: inline;
	color: #c00;
	font-size: 9px;
	font-style: normal;
	font-weight: normal;
	text-transform: uppercase;
	text-decoration: none;
	}


/* 3: PAGE STRUCTURE
============================================================================ */

/* a) Containers */

#container {float: left; width: 100%; background: #fff;}
/* CONTOROL THE CONTENT WIDTH ON THE NEXT LINE */
.wrapper, #main-wrapper {width: 90%; margin: 0 auto; text-align: left;}
#main-wrapper {width: 716px;}

#content {float: left; width: 100%; padding: 0 0 30px; background: #fff;}

/* b) Header */

#logo {
	float: left;
	width: 215px;
	margin: 15px 0 0;
	color: #fff;
	}
#logo span, #logo a {
	display: block;
	width: 207px;
	height: 115px;
	border: none;
	background: url(images/c21logo_Svcs.jpg) no-repeat;
	}
#logo img  {display: block; width: 0; border: none;}

#header {
	float: left;
	width: 100%;
	background: #fff;
	}
#header h1 a {
	display: block;
	position: absolute;
	width: 342px;
	height: 36px;
	margin-top: 29px;
	border: none;
	background: transparent url(images/logo.gif) no-repeat;
	text-decoration: none;
	text-indent: -9999px;
	}
#header h2 {display: none;}

#pagebar {
	float: left;
	width: 100%;
	background: #fff url(images/bg-pagebar.gif) top left repeat-x;
	border-bottom: 0px solid #a4cf43;
	}
#pagebar h1 {
	padding: 6px 0 9px 7px;
	color: #fff;
	font-size: 6px;
	font-family: 'Trebuchet MS', Trebuchet, Arial, sans-serif;
	}
	
/* c) Main content */




/* 5: LISTS
/* 6: FORMS & TABLES 
/* 7: GLOBALS
============================================================================ */

/* a) Links */

a:link, a:visited {
	border-bottom: 0px solid #a1cfd4;
	color: #069;
	text-decoration: none;
	}
a:hover {
	border-color: #069;
	background: none;
	color: #FFCC00;
}
a:link.img, a:hover.img, a:visited.img {border: none; background: none;}
a.link {color: #069; border: none; background: none;}
a.edit {
	padding: 0;
	border: none;
	color: #f00;
	font: normal 11px Verdana, Arial, Helvetica;
	text-decoration: underline;
	}
a.edit:hover {background: #f00; color: #fff;}
/* b) Typography */
h2 {
	padding: 2px 0 0.5em;
	color: #4d5762;
	font-size: 21px;
	font-family: 'Helvtica Neue', Arial, sans-serif;
	}
h2#first {padding: 30px 0 0.7em;}
h2.add {padding-top: 50px;}
h2.listtitle {padding-bottom: 3px;}
h3 {
	padding: 0.5em 0;
	color: #4d5762;
	font-size: 18px;
	font-weight: normal;
	font-family: Arial, Helvetica, Verdana, sans-serif;
	}
h3 a:link, h3 a:visited {border: none; color: #4d5762;}
h3 a:hover {border: none; background: none; color: #069;}	
h4 {padding: 0 0 0.5em; font-size: 12px;}
h5 {
	padding: 0 0 1em;
	margin-top: -2px;
	color: #93bb3a;
	font-size: 10px;
	font-weight: normal;
	font-family: Arial, Helvtica, sans-serif;
	text-transform: uppercase;
	}

p {margin: 0 0 1.5em;}
p.left {float: left;}
p.right {float: right;}
p.big {font-size: 13px;}
p.small {font-size: 11px; color: #999; margin-bottom: 10px;}
p.center {
	margin: 0 0 40px !important;
	font: normal 16px 'Helvetica Neue', Arial, Verdana, sans-serif;
	text-align: center;
	}
p.centersmall {margin-top: -10px; text-align: center;}
p.price strong {
	color: #4d5762;
	font: normal 18px 'Helvetica Neue', Arial, Verdana, sans-serif;
	}
p.info {
	margin-top: 20px;
	padding: 5px 0 7px 36px;
	background: url(images/info-bg.gif) no-repeat 0 0;
	color: #036;
	font-size: 11px;
	}
#addwish p, #editwish p, #list p {margin: 0;}
p#wrong {background-image: url(images/cancel.gif); color: #c00;}
p#small {margin-bottom: 5px; font-size: 11px;}
p#searchtip {
	margin: 4px 0 0;
	padding-left: 22px;
	background: url(images/icon-lightbulb16.gif) 0 1px no-repeat;
	color: #999;
	font-size: 11px;
	}
p#welcome {
	margin: 20px 0 2em;
	font-size: 16px;
	font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
	line-height: 150%;
	}

em.highlight {background: #eeffbf; font-style: normal;}
em.help {color: #4d5762; font-style: normal; font-weight: bold;}

span.small {color: #999; font-size: 11px;}
span.right {float: right;}
span.bullet {
	padding: 1px 0 1px 22px;
	background: url(images/listbullet.png) no-repeat 0 1px;
	}
span.add {
	padding: 1px 0 7px 22px;
	background: url(images/icon-add16.gif) no-repeat 0 0;
	font-size: 11px;
	}
span.added {
	padding: 1px 0 7px 22px;
	background: url(images/icon-checkmark16.gif) no-repeat 0 0;
	color: #693;
	font-size: 11px;
	}
span.note {margin-left: 20px; color: #999; font-size: 11px;}
span.qm {font-family: 'Helvetica Neue', Arial, sans-serif; font-size: 14px;}
p#ok span {color: #666; font-weight: normal; font-size: 11px;}

#content strong {color: #4d5762;}

blockquote {
	margin: 0 30px 2em;
	padding-left: 15px;
	border-left: 5px solid #ccc;
	color: #888;
	font-size: 11px;
	}
samp {
	display: block;
	width: 500px;
	margin: 2em 30px 1em;
	padding: 0 10px 20px;
	color: #11b;
	border-left: 5px solid #c4e3ff;
	background: #f0f8ff;
	font-family: Monaco, 'Courier New', Courier, mono;
	font-size: 12px;
	overflow: auto;
	clear: both;
	}
samp em {color: #444;}

/* 8: MISC
============================================================================ */

/* Horisontal ruler */

hr {display: none;}
.hr {
	height: 1px;
	margin: 15px 0 10px;
	background: url(images/doth.gif) repeat-x top left;
	font-size: 1px;
	line-height: 1px;
	clear: both;
	}

/* Images */
/* Clear floats */

.clear {clear: both;}

.clearall {
	display: block;
	clear: both;
	height: 1px;
	margin: 0;
	font-size: 1px;
	line-height: 1px;
	}
	
html {height: 100%; margin-bottom: 1px;}

/* Specials */

#special {text-align: center;}
#special img {margin: 10px;}
#special div.float-left {float: left; width: 188px; padding: 15px 40px 0 20px;}
#special div.float-right {float: right; width: 188px; padding: 15px 20px 0 40px;}

#marklet #header {height: 102px;}

/*- Menu Tabs LEFT--------------------------- */

    #tabs {
      float:left;
	  margin-top:20px;
      width:100%;
      background:none;
      font-size:93%;
      line-height:normal;
      }
    #tabs ul {
	  margin:0;
	  padding:2px 10px 0 0px;
	  list-style:none;
      }
    #tabs li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabs a {
      float:left;
      background:url("images/tableftB.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabs a span {
      float:left;
      display:block;
      background:url("images/tabrightB.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#000;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabs a span {float:none;}
    /* End IE5-Mac hack */
    #tabs a:hover span {
      color:#000;
      }
   
/*- Menu Tabs RIGHT--------------------------- */

    #tabsR {
      float:right;
      width: 18%;
      background:#fff;
      font-size:93%;
      line-height:normal;
	  /*border: solid 1px #ccc;*/
      }
    #tabsR ul {
	  margin:0;
	  padding:10px 10px 0 0px;
	  list-style:none;
      }
    #tabsR li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabsR a {
      float:left;
      background:url("images/tableftB.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabsR a span {
      float:left;
      display:block;
      background:url("images/tabrightB.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#666;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsR a span {float:none;}
    /* End IE5-Mac hack */
    #tabsR a:hover span {
      color:#000;
      }
    #tabsR a:hover {
	background-position:0% -42px;
	color: #FFFFFF;
      }
    #tabsR a:hover span {
      background-position:100% -42px;
      }