/* ---------------------------------------------------------------
Style Sheet

Site:       ihre Meinung Bregenzerwald
Author:     Michael E. Trawetzky - MASSIVE ART www.massiveart.com
Version:    1.0
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
Reset-File */
@import url(reset.css);
/* ------------------------------------------------------------ */

/* --------------------------
@start, General Definition */
body {
  background-color: #fff;
  color: #333;
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 20px;  
}
p {
  padding-bottom: 10px;
}
.clear {
  clear: both;
  height: 0;
  line-height: 0;
  font-size: 0;
}
.inner {
  width: 750px;
  margin: 0 auto 0 auto;  
}
/* @end, General Definition */

</* ------------
@start, FONTS */

/* @end, FONTS */
			
/* ----------------
@start, Links */
a, a:hover {
  font-size: 14px;
  line-height: 20px;
  color: #006699;
  font-weight: normal;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
a.buttonSmall {
  font-size: 18px;
  font-weight: bold;
  color: #003366;
  text-decoration: none;
}
/* @end, Links */

/* ----------------
@start, Custom Checkbox and Radiobuttons */
span.checkbox {
  width: 19px;
  height: 25px;
  padding: 0 5px 0 0;
  background: url(/images/buttons/checkbox.png) no-repeat;
  display: block;
  clear: left;
  float: left;
}
span.radio {
  width: 19px;
  height: 25px;
  padding: 0 5px 0 0;
  background: url(/images/buttons/radio.png) no-repeat;
  display: block;
  clear: left;
  float: left;
}
span.select {
  position: absolute;
  width: 158px; /* With the padding included, the width is 190 pixels: the actual width of the image. */
  height: 21px;
  padding: 0 24px 0 8px;
  color: #fff;
  font: 12px/21px arial,sans-serif;
  background: url(select.gif) no-repeat;
  overflow: hidden;
}
/* @end, Custom Checkbox and Radiobuttons */

/* ----------------
@start, Headlines */
h1 {
  font-size: 30px;
  line-height: 40px;
  font-weight: normal;
  font-family: Georgia, Times New Roman, Arial, sans-serif;
  color: #FFF;
}
h2 {
  font-size: 22px;
  line-height: 40px;
  font-weight: normal;
  font-style: italic;  
  font-family: Georgia, Times New Roman, Arial, sans-serif;
  color: #FFF;
}
h3 {
  font-size: 24px;
  line-height: 40px;
  font-weight: normal;
  font-style: italic;
  padding: 0 0 10px 0;
  font-family: Georgia, Times New Roman, Arial, sans-serif;
  color: #000;
  display: inline;
}
h4 {
  font-size: 11px;
  line-height: 15px;
  font-weight: normal;
  padding:0 0 10px 0;
  font-family: Georgia, Times New Roman, Arial, sans-serif;
  color:#000;
}
/* @end, Headlines */

/* --------------
@start, Header */
.header {
  padding: 0 0 30px 0;  
}
.index {
  padding-top: 100px;  
}
.header .naviContainer {
  float: left;
  width: 590px;
}
.header .naviContainer .headline {
	height: 180px;
	background: transparent url(/images/magazin_hw_2010_11.gif) no-repeat right bottom;
	margin: 0;
}
.header .naviContainer .headline .placeholder {  
  height: 80px;
}
.header .naviContainer .headline .first {
  background: #3b7fbd;
  color: #FFF;
  height: 40px;
  width: 420px;
  margin: 0 0 10px 0;
  padding: 0 0 0 10px;
}
.header .naviContainer .headline .second {
  background: #3b7fbd;
  color: #FFF;
  height: 40px;
  width: 560px;
  margin: 0 0 10px 0;
  padding: 0 0 0 10px;
}
.header .naviContainer .navigation {
  padding:30px 0 0 0;
}
.header .naviContainer .navigation .item {
  float: left;
  height: 50px;
  padding: 10px 0 0 10px;
}
.header .naviContainer .navigation .item div{
  color: #666;
}
.step {
  font-size: 18px;
  line-height: 20px;
  color: #3b7fbd;
  font-style: italic;
  font-family: Georgia, Times New Roman, Arial, sans-serif;
  text-decoration: none;
}
.active .step {
  color: #003366;  
}
.arrow {
  float: left;
  width:22px;
  height:60px;
}
.on{
  background: transparent url(/images/navigation/step_on_winter.gif) no-repeat 0 0;  
}
.off{
  background: transparent url(/images/navigation/step_off_winter.gif) no-repeat 0 0;  
}
.endOn{
  background: transparent url(/images/navigation/step_end_on_winter.gif) no-repeat 0 0;
  margin:0 0 0 -11px;
}
.endOff{
  background: transparent url(/images/navigation/step_end_off_winter.gif) no-repeat 0 0;
  margin:0 0 0 -11px;  
}
.header .cloudContainer {
	float: left;
  position: relative;
}
.header .cloudContainer img {
  position: absolute;
  top: 75px;
  left: -10px;
}
.header .cloudContainer .reposition .image {
  position: absolute;
  top: 75px;
  left: -10px;
  background: transparent url(/images/bubble_winter.gif) no-repeat 0 0;
  width: 172px;
  height: 176px;
}
.header .cloudContainer .reposition .text {
  position: absolute; 
  top: 98px; 
  width: 115px; 
  margin:0 0 0 20px;
}
.header .cloudContainer .reposition .text .step{
  padding: 0 0 5px 18px;
  color: #003366;
}
.header .cloudContainer .reposition .text .info{
  text-align: center; 
  font-size: 13px; 
  line-height: 15px; 
  color: #333;
}
/* @end, Header */


/* ---------------
@start, Content */
.content .inner .left,
.content .inner .right {
  float: left;
}

/* @end, Content */

input{
  margin:0 10px 0 5px;
}

textarea{
  width: 730px;
  height: 200px;
  background-color:transparent;
  border: 0;
  padding:10px;
  font-size: 14px;
  line-height: 20px;
  font-family: Arial, sans-serif;
}

.textareaContainer{
  background-color: #E8EEF0;
}

/* ------------------
@start, Navigation */
.active {
  background: #99ccff;
}
.inactive {
  background: #cce5ff;
}

/* @end, Navigation */

.startContainer {
  border: 5px dotted #1e2aa0;
  padding: 30px;
  margin: 0 0 20px 0;
}

.button {
  background: transparent url(/images/button_winter.gif) no-repeat 0 0;
  width: 250px;
  height: 40px;
  float: right;
  padding: 9px 0 0 0;
  cursor: pointer;
}
.button1Pos {
  width: 155px;
  margin: 0 auto 0 auto;
}
.button2Pos {
  width: 170px;
  margin: 0 auto 0 auto;
}
.button4Pos {
  width: 175px;
  margin: 0 auto 0 auto;
}
.button5Pos {
  width: 220px;
  margin: 0 auto 0 auto;
}
.button6Pos {
  width: 200px;
  margin: 0 auto 0 auto;
}
.stepContainer .headline {
  border-bottom: 2px solid #0095cc;
}
.headline .big {
  /*float: left;*/
}
.headline .small {
  display: inline;
  font-size: 13px;
}
.stepContainer .contact {  
  border: 0 none;
}
.stepContainer .contact h3{  
  padding: 0;
  display: block;
}
.stepContainer .contact .small{  
  padding:0 0 10px 0;
  display: block;
}
.checkBoxContainer {
  background-color: #e8eef0;
  height: 26px;
  padding: 4px 0 0 0;
  margin: 0 0 20px 0;
}
.inputContainer{
  background-color: #e8eef0;
  height: 26px;
  padding: 4px 0 0 10px;
  margin: 0 0 20px 0;
}
.radioButtonContainer {
  background-color: #e8eef0;
  height: 26px;
  padding: 4px 0 0 0;
  margin: 0 0 20px 0;
}
.valueContainer {
  background-color: #e8eef0;
  height: 26px;
  padding: 4px 0 0 0;
  margin: 0 0 20px 0;
}
.centerContainer {
  /*float: left;
  margin: 0 0 0 250px;*/  
}
.center {
  /* margin: 0 auto 0 auto;
  width: 100px; */
  text-align:center;
}
.sliderBox {
  width: 222px;
  margin: 0 auto 0 auto;
}
.informations {
  margin: 0 0 0 50px;  
}
.informations .left {
  float: left;
  width: 100px;
  height: 30px;
  text-align: right;
  margin: 0 10px 5px 0;
}
.informations .right {
  float: left;
  width: 420px;
  margin: 0 0 5px 0;
}
.informations .right input.text {
  background-color: #e8eef0;
  border: 0;
  width: 420px;
  height: 25px;
  font-size: 14px;
  padding:5px 0 0 5px;
}
.buttonContainer {
  width: 230px;
  margin: 0 auto 0 auto;
}
.buttonContainer {
  width: 230px;
  margin: 0 auto 0 auto;
}
.buttonContainer .big {
  background: transparent url(/images/button_result_winter.gif) no-repeat 0 0;
  width: 250px;
  margin: 0 0 10px;
  text-align: center;
  padding: 5px 0 20px 0;
  line-height: 80px;  
  font-size: 80px;
  font-weight: bold;
  color: #003366;
}
.buttonContainer .big .info {
  font-size: 18px;
  font-weight: bold;
  line-height: 20px;
}
.buttonContainer .small {
  background: transparent url(/images/button_winter.gif) no-repeat 0 0;
  width: 250px;
  height:40px;
  padding: 9px 0 0;
}

/* -------------------
@start, Font Weight */
.bold {
  font-weight:bold;
}
.normal {
  font-weight:normal;
}
.lighter {
  font-weight:lighter;
}
.bolder {
  font-weight:bolder;
}
/* @end, Font Weight */

/* --------------
@start, Colors */
.black {
  color: #000;
}
.white {
  color: #fff;
}
.dark {
  color: #6c6c6c;
}
.gray {
  color: #666;
}
/* @end, Colors */

/* ----------------
@start, Paddings */
.pTop10 {
  padding-top:10px;
}
.pTop20 {
  padding-top:20px;
}
.pBottom10 {
  padding-bottom:10px;
}
.pBottom20 {
  padding-bottom:20px;
}
.pBottom40 {
  padding-bottom:40px;
}
.pLeft10 {
  padding-left:10px;
}
.pLeft20 {
  padding-left:20px;
}
.pRight10 {
  padding-right:10px;
}
.pRight20 {
  padding-right:20px;
}
.pRight40 {
  padding-right:40px;
}
/* @end, Paddings */
	
/* ---------------
@start, Margins */
.mTop10 {
  margin-top:10px;
}
.mTop20 {
  margin-top:20px;
}
.mTop40 {
  margin-top: 40px;
}
.mTop60 {
  margin-top: 60px;
}
.mBottom10 {
  margin-bottom: 10px;
}
.mBottom20 {
  margin-bottom: 20px;
}
.mBottom60 {
  margin-bottom: 60px;
}
.mLeft10 {
  margin-left:10px;
}
.mLeft20 {
  margin-left:20px;
}
.mRight10 {
  margin-right:10px;
}
.mRight20 {
  margin-right:20px;
}
.mRight60 {
  margin-right: 60px;
}
/* @end, Margins */

/* --------------
@start, Floats */
.left {
  float:left;
  padding-right:20px;
  margin-right:20px;
}
.right {
  float:right;
}
/* @end, Floats */

.noBorder {
  border: 0 none;
}
.missing h3 {
  color: #FF0000;
}
.missing .label {
  color: #FF0000;
}
.missing input.text {
  border: 2px solid #FF0000;
}