/* * CMSBOX 2.1  * * * * * * * * *
  *                               *
  *   Content Management System   *
  *   © 2007 Cmsbox GmbH, Bern    *
  *   contact (at) cmsbox . com   *
  *                               *
  * * * * * * * * * * * * * * * * */


/* @group  G E N E R A L
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* GLOBAL */
* {
  margin: 0; 
  padding: 0;
  border: 0 none #fff;
}

/* CANVAS */
html, body {
  height: 100%;
}
body {
  overflow: auto;
  font-size: 12px;
  line-height: 1.5em;
  font-family: "Helvetica Neue", Arial, sans-serif;
}
#desk {
  position: relative;
}

/* UTILITIES */
#root a:active, a:focus {
  outline: none;
}
#root a img {
  border: 0 none #fff;
}
#root div.stop {
  clear: both;
}


/* @end *//* @group  N A V I G A T I O N
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* NAVIGATION */
#root div.navi a.menu {
  display: block;
}


/* @end *//* @group  L A Y O U T
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* AREA */
#root div.area {
  float: left;
  min-height: 280px;
}

/* UNIT */
#root div.unit {
  float: left;
}
#root a.hash {
  display: block;
}
#root div.body {
  float: left;
  width: 100%;
  margin: 0.4em 0;
  min-height: 2em;
}
#root div.part {
  float: left;
}
#root div.foot {
  clear: both;
/*  overflow: hidden; REMOVED*/
}

/* WIDTH */
div.wide  {
  width: 98%;
}
div.slim {
  width: 49%;
}

/* MAIN */
div.main {
  width: 66%;
}
div.main h2,
div.main div.foot {
  margin: 0 2%;
}
div.main div.part,
div.main div.grid table {
  margin: 0.4em 2%;
}

div.main div.tall,
div.main div.grid table {
  width: 94%;
}
div.main div.tiny {
  width: 45%;
}

/* SIDE */
div.side {
  width: 33%;
}
div.side h2,
div.side div.foot {
  margin: 0 4%;
}
div.side div.part,
div.side div.grid table {
  margin: 0.4em 4%;
}
div.side div.tall,
div.side div.grid table {
  width: 90%;
}
div.side div.tiny {
  width: 41%;
}

/* BASE */
div.base {
  width: 99%;
}
div.base h2,
div.base div.foot {
  margin: 0 1%;
}
div.base div.part,
div.base div.grid table {
  margin: 0.4em 1%;
}
div.base div.tall,
div.base div.grid table {
  width: 96%;
}
div.base div.tiny {
  width: 47%;
}


/* @end *//* @group  D E S I G N
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* PURE */
div.pure {
  border: 1px solid #fff;
}
div.pure div.head h2 { /* exeption */
  border-bottom: 1px solid #666;
}

/* SEAM */
div.seam {
  border: 1px solid #999;
}
div.seam div.head {
  color: #333;
  background-color: #ccc;
  border-bottom: 1px solid #999;
}

/* FLAT */
div.flat {
  color: #fff;
  background-color: #666;
  border: 1px solid #fff;
}
div.flat div.head {
  border-bottom: 1px solid #fff;
}

/* EDGE */
div.edge {
  border-top: 1px solid #999;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #999;
  border-left: 1px solid #fff;
}
div.edge div.head {
  border-bottom: 1px solid #999;
}


/* @end *//* @group  F O R M A T
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* TITLE */
h1 {
  font-size: 2em;
  font-weight: 400;
}
h2 {
  font-size: 1.5em;
  font-weight: 400;
}

/* LEAD */
#root div.lead {
  margin-bottom: 0;  
}
h3, h4, h5, h6 {
  font-weight: 800;
  text-decoration: none;
}

/* TEXT */
div.text p.loud {
  color: #fff;
  padding: 0.2em 0.4em;
  background-color: #333;
}
div.text p.pale {
  color: #999;
  font-size: 0.9em;
  background-color: inherit;
}
div.text p.skew {
  font-style: italic;
  letter-spacing: 1px;
}

/* CODE */
#root div.code pre {
  white-space: normal;
  font-family: Monaco, "Courier New", Courier, mono;
}

/* LINK
a.open => all links
a.site, a.goto, a.doit, a.mail => specific parts */
a {
  color: #900;
  text-decoration: none;
  background-color: inherit;
}
a:hover {
  text-decoration: underline;
}

div.link {
  background-position: 0 3px;
  background-repeat: no-repeat;
  background-image: url(/icon-small/link.gif);
}
div.mail {
  background-image: url(/icon-small/mail.gif);
}
div.link a.open {
  display: block;
  margin-left: 14px;
}

/* FILE UPLOAD */
div.load {
  background-position: 0 3px;
  background-repeat: no-repeat;
  background-image: url(/icon-small/file.gif);
}
div.load a {
  display: block;
  margin-left: 14px;
}

#root div.show {
  margin-top: 0.6em;
}
#root div.show img {
  width: 100%;
  display: block;
}

/* IMAGE */
#root div.crop {
  overflow: hidden;
  position: relative;
}
#root div.crop img {
  width: auto;
  position: absolute;
}
div.unit div.crop {
  height: 320px;  
}

/* MOVIE */
#root div.show a.plug {
  height: 100%;
  display: block;
  background: url(/player/adobe.png) center no-repeat;
}
		
/*  LIST */
div.list p.gist {
  list-style-type: disc;
}
div.list p.dent {
  list-style-type: circle;
}

#root div.list {
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}
#root div.list p.item {
  display : list-item;
  list-style-position: outside;  
}
#root div.list p.gist {
  margin-left: 16px;
}
#root div.list p.dent {
  margin-left: 32px;
}

/*  LINE */
#root div.line {
  margin-top: 0;
  padding: 2px 0;
  font-size: 0px;
  line-height: 0px;
  margin-bottom: 0;
}
#root div.line hr  {
  height: 1px;
  border: none;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
}

#root div.line hr.hair {
  border-bottom-style: solid;
}
#root div.line hr.dash {
  border-bottom-style: dashed;
}
#root div.line hr.spot {
  border-bottom-style: dotted;
}
#root div.line hr.fine {
  border-bottom-width: 1px;
}
#root div.line hr.bold {
  border-bottom-width: 2px;
}

div.line hr {
  border-bottom-color: #333;  
}

/* TABLES */
#root div.grid table {
  border-collapse: collapse;
}
#root div.grid table td {
  vertical-align: top;
}

#root div.grid table.horz td {
  padding: 1px;
}
#root div.grid table.vert td {
  padding: 1px 4px;
}

#root div.grid table.horz .trim td {
  border-top-width: 1px;
  border-bottom-width: 1px;
}
#root div.grid table.vert .trim td {
  border-left-width: 1px;
  border-right-width: 1px;
}

div.grid table td {
  border-width: 0;
  border-color: #999;
  border-style: solid;
}
div.grid table thead td,
div.grid table tfoot td {
  font-weight: 800;
  background: #ccc; 
}

div.grid table.vert tbody.beam td.odd,
div.grid table.horz tbody.beam tr.odd td {
  background: #eee;
}


/* @end *//* @group  I N P U T
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* GENERAL */
select,
textarea,
input.text,
input.sign,
input.password {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  border: 1px solid #666;
  background-repeat: no-repeat;
  background-position: right center;
}
textarea {
  overflow: auto;
}
select:focus,
textarea:focus,
input.text:focus,
input.sign:focus,
input.password:focus {
  border-color: #7be;
}

option {
  color: #666;
  background: #eee;
}

/* STANDARD */
#root input,
#root select,
#root option,
#root textarea {
  color: #333;
  background: #fff;
}
#root input.submit {
  color: #333;
  padding: 0 1em;
  font-size: 12px;
  background: #ddd;
  line-height: 16px;
  text-align: center;
  border: 1px solid #666;
}

/*  UNIT FORM */
div.form div.tick,
div.form div.word {
  line-height: 1.6em;
  margin-bottom: 1em;
}
div.form div.foot {
  text-align: right;
  padding-bottom: 1em;
}

/* ALIGN */
div.form label.name {
  width: 33%;
  float: left;
}
div.form select,
div.form div.chop,
div.form textarea,
div.form input.text {
  width: 63%;
  float: right;
  overflow: hidden;
}
div.form div.chop input.file {
  margin: 0;
  float: right;
}
div.form label.sign {
  width: 57%;
  float: right;
}
div.form div.tack {
  width: 6%;
  float: right;
}

/* BELOW */
div.form div.pile select,
div.form div.pile textarea,
div.form div.pile input.text,
div.form div.pile input.file,
div.form div.pile label.name {
  width: 99%;
  float: none;
  display: block;
}
div.form div.pile label.sign {
  width: 93%;
  float: right;
}
div.form div.pile div.tack {
  width: 6%;
  float: left;
}

/* FEEDBACK */
#root input.hint {
  color: #999;
  background: #fff;
}
#root input.fail,
#root textarea.fail {
  color: #f00;
  border-color: #f00;
  background-color: #eee;
  background-repeat: no-repeat;
  background-position: center right;
  background-image: url(/icons/warning.gif);
}
#root input.fade,
#root select.fade,
#root textarea.fade {
  color: #999;
  border-color: #ccc;
  background-color: #eee;
}


/* @end *//* @group  S E R V I C E S
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
p.dock {
  overflow: hidden; /* clear items */
}
p.dock a.meta {
  padding: 0 0.5em;
  white-space: nowrap; 
  text-decoration: none;
}
p.dock a.meta:hover {
  text-decoration: underline; 
}

#root span.flag {
  color: inherit;
  background: #fd3;
}


/* @end *//* @group  L I G H T B O X
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* GENERAL */
#over {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 600;
  overflow: hidden;
  position: absolute;
  background-image: url(../images/over.png);
}
#disp {
  top: 10%;
  left: 50%;
  margin: 0;
  color: #444;
  width: 320px;
  z-index: 600;
  background: #fff;
  position: absolute;
  margin-left: -163px;
  border: 3px solid #888;
}

/* HEADER */
#lbox div.head,
#lbox div.head h2,
#lbox div.head a.quit  {
  color: #444;
  height: 36px;
  background: #ddd;  
  line-height: 36px;
}

#lbox div.head {
  overflow: hidden;
  position: relative;
}
#lbox div.head h2 {
  float: left;
  cursor: move;
  margin: 0 10px;
  font-size: 18px;
}
#lbox div.head a.quit {
  width: 36px;
  float: right;
  cursor: pointer;
  font-size: 24px;
  text-align: center;
  text-decoration: none;
  font-family: Arial, sans-serif;
}
#lbox div.head a.quit:hover {
  color: #fff;
  background: inherit;
  text-decoration: none;
}

/* BODY */
#lbox div.body {
  width: 300px;
  margin: 10px;
  background: #fff;
}
#lbox div.body img {
  width: 100%;
  display: block;
  overflow: hidden;
}

#lbox a.mail,
#lbox select,
#lbox textarea,
#lbox div.tick,
#lbox input.text,
#lbox input.file,
#lbox input.password {
  width: 298px;
  display: block;
  margin-bottom: 1em;
}
#lbox label.name {
  width: 300px;
  display: block;
  font-weight: 800;
}
#lbox textarea {
  height: 160px;
}

#lbox label.sign {
  width: 278px;
  float: right;
}
#lbox div.tack {
  width: 20px;
  float: right;
}

/* FOOT */
#lbox div.foot {
  margin: 0 10px;
  text-align: left;
  padding-bottom: 1em;
}
#lbox div.foot p {
  float: left;
}
#lbox div.foot a {
  float: right;
}

#lbox input.submit {
  margin-right: 1em;
}

/* SPECIAL */
#lbox div.site div.body {
  overflow: auto;
  max-height: 400px;
}
#lbox div.site ul li {
  margin-left: 16px;
}
#lbox div.srch th,
#lbox div.srch td {
  padding: 0 2px;
  text-align: left;
  vertical-align: top;
}

#lbox div.srch a,
#lbox div.site a {
  color: #333;
  text-decoration: none;
  background-color: inherit;
}
#lbox div.srch a:hover,
#lbox div.site a:hover {
  text-decoration: underline;
}

/* ZOOM */
#lbox div.zoom {
  top: 10%;
  width: 740px;
  margin-left: -373px;
}
#lbox div.zoom img {
	width: 720px;
}
#lbox div.zoom a.goto {
	position: absolute;
	display:block;
	background: transparent;
	top: 36px;
	height: 100%;
}
#lbox div.zoom a.prev {
	width: 360px;
	left: 10px;
	z-index: 20000;
}
#lbox div.zoom a.next {
	width: 360px;
	left: 370px;
}

/* TUBE */
#lbox div.tube {
  top: 10%;
  width: 660px;
  margin-left: -333px;
}
#lbox div.tube div.body div,
#lbox div.tube div.body embed {
  width: 640px;
}

/* LOGIN */
#tool {
  background-image: url(/icons/tool.png);
}
#task dd {
  display: none;
  background-image: url(/icons/down.png);
}
#task dl a:hover {
  background-image: url(/icons/over.png);
}

/* @end */