/**
 *  TOC
 *	§1	DEFAULTS
 *	§1.1	reset
 *	§1.2	tools
 *	§1.3	typography
 *	§2	GLOBAL
 *  §3  CHAOS - put new stuff here
 */

/**
 *  COLOR REFERENCE TABLE
 *	#86b416  bg - green
 *	#5E8D05  bg - dark green
 *	#FFF     text
 *	#333     text - dark
 *	#999     text - light
 */

/******************************************************************************
 *  §1 DEFAULTS 
 ******************************************************************************/

/**
 *  §1.1 reset
 *
 *	based on Eric Meyer's css reset:
 *	http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
 */
body, html {
  width:            100%;
  height:           100%;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 			    0;
	padding: 			    0;
	border: 			    0;
	outline: 			    0;
	font-weight: 		  normal;
	font-style: 		  normal;
	font-size: 			  100%;
	font-family: 		  inherit;
	vertical-align: 	baseline;
}
:focus {
	outline: 			    0;
}
ol, ul {
	list-style: 		  none;
}
table {
	border-collapse: 	collapse;
	border-spacing: 	0;
}
caption, th, td {
	text-align: 		  left;
	font-weight: 		  normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content:          "";
}
blockquote, q {
	quotes:           "" "";
}
strong {
	font-weight:      bold;
}
img {
	vertical-align:   middle;
}
a {
  color:            inherit;
}
a:focus,
a:hover {
  text-decoration:  none;
}
a img {
  border:           0;
}

/**
 *  §1.2	Tools
 */
.hide {
	position: 			  absolute !important; 
	left:				      -9999px !important; 
}
.hide-text {
	text-indent: 	    -9999px;
}
.clear {
	clear:            both;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
.clearfix:after {
    content:        "."; 
    display:        block; 
    height:         0; 
    clear:          both; 
    visibility:     hidden;
}
.clearfix {
    display:        inline-block;
}
* html .clearfix { 
    height:         1%;
}
.clearfix {
  display:          block;
}

/* Clearen per Overflow */
.floatbox { 
  overflow:         hidden;
}
* html .floatbox { /*IE6*/
  width:            100%;
}



/******************************************************************************
 *  §2 GLOBALS 
 ******************************************************************************/
body {
	font-family:      Helvetica, Arial, "Sans Serif";
	font-size:        14px;
	line-height:      20px;
}

/* image sprite handling */
#canvas dl,
#choice-wrapper,
#choice table,
#choice td,
#choice-wrapper .arrow,
#gruene-fraktion-bayern-link {
  background-image: url(../images/sprite.png);
  background-repeat:no-repeat;
}
* html #choice table,
* html #choice td {
  background:       transparent;
}

#canvas dl                   { background-position:   0px    0px }
#choice-wrapper              { background-position:   0px -160px }
#choice table                { background-position:  100% -355px }
#choice td                   { background-position:   0px  -80px }
#choice-wrapper .deco        { background-position: -58px -270px }
#choice-wrapper .next        { background-position: -29px -270px }
#choice-wrapper .prev        { background-position:   0px -270px }
#gruene-fraktion-bayern-link { background-position:  100% -290px }
#canvas dl.costs,
#choice td.first {
  background-image: none;
}

#wrapper {
  width:            578px;
  height:           368px;
  margin:           auto;
  border:           1px solid #666;
  position:         relative;
	text-align:       center;
	overflow:         hidden;
	
  background-color: #86b416;
  color:            #FFF;
}

h1 {
  font-size:        20px;
  font-weight:      bold;
  height:           40px;
  line-height:      40px;
  background-color: #3b640d;
}

#content {
  padding:          0 9px;
}

#canvas {
  overflow:         hidden;
  height:           80px;
  margin:           8px -5px 0;
}
#canvas dl {
  float:            left;
  position:         relative;
  width:            190px;
  height:           80px;
  
  font-weight:      bold;
  text-align:       center;
}
#canvas dt {
  position:         absolute;
  bottom:           -2px;
  left:             0;
  width:            100%;
}
#canvas dd {
  font-size:        37px;
  line-height:      76px;
}

#choice-wrapper {
  width:            560px;
  height:           110px;
  overflow:         hidden;
  position:         relative;
  top:              21px;
  
  background-color: #FFF;
}
#choice-wrapper .arrow {
  width:            29px;
  height:           19px;
  position:         absolute;
  z-index:          10;
}
#choice-wrapper .deco {
  top:              0;
  left:             50%;
  margin-left:      -14px;
}
#choice-wrapper .prev,
#choice-wrapper .next {
  bottom:           5px;
  text-indent:      -9999px;
}
#choice-wrapper .prev {
  left:             27px;
}
#choice-wrapper .next {
  right:            27px;
}
#choice-wrapper .prev:active,
#choice-wrapper .next:active {
  bottom:           4px;
}

#choice {
  border:           none;
  position:         absolute;
  left:             600px; /*we let it slide in in the beginning*/
  top:              0;
  padding:          0 190px;
  
  margin:           0 -5px;
  cursor:           move;
  cursor:           col-resize;
}
#choice td {
  padding:          0 6px 0 4px;
  margin:           0;
  height:           80px;
  
  border:           none;
  color:            #999;
  line-height:      16px;
  
  text-align:       center;
  vertical-align:   middle;
  overflow:         hidden;
  
       -o-transition: color .3s ease-in-out;
     -moz-transition: color .3s ease-in-out; 
  -webkit-transition: color .3s ease-in-out;
}
#choice strong {
  padding:          10px 5px 0;
  
  display:          block;
  position:         relative;
  width:            170px;
  overflow:         hidden;
}
* html #choice strong {
  border-left:      1px solid #ccc;
  width:            169px;
}
#choice td.current {
  color:            #333;
}

#footer {
  position:         absolute;
  bottom:           0;
  left:             0;
  width:            100%; 
  text-align:       left;
}
#footer a {
  display:          block;
}
#gruene-fraktion-bayern-link {
  height:           34px;
  padding:          26px 12px 0;
  color:            #FFF;
  
  text-decoration:  none;
  font-size:        14px;
  line-height:      18px;
  margin:           0 15px 9px 0; 
}
#gruene-fraktion-bayern-link strong {
  display:          block;
}
#embed-link {
  font-size:        12px;
  line-height:      32px;
  height:           30px;
  text-indent:      12px;
  
  border-top:       1px solid #333;
  margin:           0 -1px;
  background:       #e8f0cf;
  color:            #666;
}

#embed {
  position:         absolute;
  z-index:          100;
  left:             0;
  top:              370px;
  width:            100%;
  height:           100%;
  overflow:         hidden;
  
  /* IE fallback */
  background-color: #E9F0CF;
}
#embed h2 {
  font-size:        20px;
  font-weight:      bold;
  height:           40px;
  line-height:      40px;
  background-color: #86B416;
  margin-bottom:    0;
  
}
#embed h2 sub {
  font-size:        .6em;
  font-weight:      normal;
}
#embed div {
  padding:          46px 17px 20px;
  text-align:       left;
}
#embed p {
  color:            #666;
  font-size:        12px;
  line-height:      14px;
  
}
#embed textarea {
  width:            534px;
  font-size:        16px;
  line-height:      16px;
  height:           48px;
  margin:           13px 0 0;
  
  
  padding:          5px;
  border:           none;
}
#embed .close {
  position:         absolute;
  bottom:           0;
  left:             0;
  width:            100%;
  height:           30px;
  line-height:      30px;
  
  border:           1px solid #666;
  border-width:     1px 0;
  text-indent:      10px;
}



/******************************************************************************
 *  §3 CHAOS - add new stuff here
 ******************************************************************************/
