/**********************************************/
/* ALL MEDIA Style Sheet - www.ClickWorkx.com */
/**********************************************/



/* Allgemeine Definition der Standard-Html-Elemente: */

HTML, BODY {
color: #767676;
background-color: #fff;
height: 100%  !important
}

* {
padding: 0px;
margin: 0px;
border: 0px;
border-style: none;
border-spacing: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
letter-spacing:0.04em;
word-spacing: 0.03em
}


/* Horizontale Linien definieren: */

HR {
border-top: 1px solid #dcdcdc;
height: 0px;
width: 100%;
margin: 0 auto 0 auto;
}

@media screen {


/* Text-Absaetze: */

P {
text-align: left;
padding-top: 0.5em;
padding-bottom: 1.5em;
line-height: 1.7em
}


/* fetter Text */

B {
font-weight: 600
}


/* Hochgestellter Text: */

SUP {
font-weight: 500
}


/*Tiefgestellter Text: */

SUB {
letter-spacing: 0.02em ;
word-spacing: 0.01em 
}

IMG {
outline: none
}


/* Headlines definieren: */

H1, H2, H3, H4, H5, H6 {
font-style: normal ;
font-weight: normal ;
font-variant: normal
}

H1 {
font-size: 2.0em;
clear: both;
color: #bfe50f;
background-color: #fdfff1;
padding-bottom: 1em
}

H2 {
font-size: 1.4em;
clear: both;
background: url(http://www.clickworkx.de/de/pics/h_before.gif) left no-repeat;
padding-left: 25px
}

H3 {
font-size: 1.7em
}

H4 {
font-size: 1.5em;
text-align: right;
margin-right: 10px
}

H5{
font-size: 1.2em
}

H6{
font-size: 1.0em
}


/* Tabellen definieren: */

TABLE {
border-collapse: collapse;
empty-cells: show;
float: none
}

TH, TD {
vertical-align: middle;
text-align: left;
float: none
}


/* Formulare, Buttons und Eingabefelder: */

LABEL {
display: block;
float: left;
width: 80px
}

FORM BR {
text-align: center;
clear: both
}

.formular {
color: #282828;
background-color: #f1ffb0;
font-weight: 500;
width: 300px;
float: left;
border: 1px solid #bfe50f
}

INPUT {
vertical-align: middle
}

TEXTAREA.formular {
font-size: 1.4em;
line-height: 1.4em;
letter-spacing: 0.04em;
border: 1px solid #bfe50f;
color: #7b930e;
background-color: #f1ffb0
}

INPUT.formular, SELECT.formular {
font-size: 1.4em;
line-height: 1.4em;
height: 1.5em;
letter-spacing: 0.04em;
border: 1px solid #bfe50f;
margin-bottom: 2px;
color: #7b930e;
background-color: #f1ffb0
}

INPUT.login {
font-weight: 500;
width: 220px;
float: left;
font-size: 1.4em;
line-height: 1.4em;
height: 1.5em;
letter-spacing: 0.04em;
border: 1px solid #bfe50f;
margin-bottom: 2px;
color: #7b930e;
background-color: #f1ffb0
}

INPUT#submit { 
font-size: 1.4em;
line-height: 1.4em;
color: #282828;
width: 5em;
border: 1px solid #7b930e;
background-color: #f1ffb0
}

INPUT#submit0 { 
font-size: 1.4em;
line-height: 1.4em;
color: #282828;
width: 5em;
border: 1px solid #7b930e;
background-color: #f1ffb0
}

INPUT#reset {
font-size: 1.4em;
line-height: 1.4em;
color: #282828;
background-color: #f1ffb0;
float: none;
width: 5em;
border: 1px solid #bfe50f
}

INPUT#checkbox {
font-size: 1.4em;
width: 1.4em;
height: 1.4em;
border: 0px none
}


/* Keine Markierungsrahmen um Links: */
A {
outline: none
}

A:focus {
outline: none
}


/* Definition In-Text Links (Sub-Nav): */

.hyperlink {
color: #aecf14;
background-color: #fdfff1;
text-decoration: none;
font-weight: 600
}

.hyperlink:link {
color: #aecf14;
background-color: #fdfff1
}

.hyperlink:visited {
color: #aecf14;
background-color: #fdfff1
}

.hyperlink:active {
color: #e0fb00;
background-color: #fdfff1
}

.hyperlink:hover {
color: #7b930e;
background-color: #fdfff1
}


/* Definition Foot Links (Footer-Nav): */

.footer:link {
color: #767676;
background-color: #fff;
text-decoration: none;
font-weight: 500
}

.footer:visited {
color: #767676;
background-color: #fff;
text-decoration: none
}

.footer:active {
color: #282828;
background-color: #fff;
text-decoration: none
}

.footer:hover {
color: #282828;
background-color: #fff;
text-decoration: none
}


/* Definition Standard-Listen-Elemente */

LI {
margin: 0px 0px 0px 55px
}

UL {
vertical-align: middle;
line-height: 1.7em;
text-align: left;
list-style-image:url(http://www.clickworkx.de/de/pics/list.gif);
float:none
}


/* Definition des Button-Layouts (Main-Nav):*/
/*     Keine Borders links oder rechts!     */

LI.navigation  {
margin: 0px
}

UL.navigation {
color: #990000;
background-color:  #fff;
width: 100%  !important;
list-style-image: none;
padding-top: 20px  /* Abstand der Buttons vom oberen Rand des Navigaionsfeldes */
/* border-top: 2px solid #666 ; /* Abstand der Buttons vom oberen Content*/
/* border-bottom: 2px solid #666 ; /* Abstand der Buttons vom unteren Content*/
} /* Navigationsfeld um alle Buttons */

UL.navigation LI {
list-style: none;
/* background-color: #ccc ;  Button-Zwischenraumfarbe*/
width: 100% !important;
padding: 1px

}/* Abstände der Buttons, Zwischenraumfarbe */

UL.navigation A {
text-decoration: none;
font-weight: 500;
font-size: 1.4em;
letter-spacing: 0.04em;
padding-left: 5%;
color: #aecf14; /* Button Schrift Farbe */
background-color: #fff; /* Button inkl Versatz Farbe */
width: 100%  !important;
min-width: 130px;
/* height: 22px !important; */
/* height: 18px ; */
padding-top: 2px; /* Fläche über Beschriftung */
padding-bottom: 4px; /* Fläche unter Beschriftung */
/* border-top: 1px solid #ddd  ; /* innerer Button-Rahmen */
/* border-bottom: 1px solid #bbb  ; /* innerer Button-Rahmen */
/* border: 1px solid #5b6b12 ; */
display: block
}
 
UL.navigation A:hover {
color: #7b930e;
background-color: #f1ffb0 /* Button-Leuchtfarbe */
}

/* Definition spezieller Formatierungen: */

.cent {
width: 100%;
text-align: center
}

.serif {
font-family: "Courier New", Courier, "Times New Roman", Times, serif, monospace
}

.rahmen {
border: 1px solid #999
}

.vert {
vertical-align: text-bottom
}

.mid {
vertical-align: middle
}

.stat_view {
color: #767676;
background-color: #bfe50f;
background: url(http://www.clickworkx.de/de/pics/stat.gif) left repeat-x;
text-align: center;
float: left;
border-top: 1px solid #7b930e;
border-right: 1px solid #7b930e;
border-bottom: 1px solid #7b930e
}

.info_icon {
padding-left: 25px;
color: #767676;
background-color: #fff
}

.contact {
margin: auto;
width: 450px
}

.pageview {
min-width: 300px;
max-width: 570px;
min-height: 500px;
width: 90%;
border-top: 5px solid #bfe50f;
border-left: 1px solid #eee;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
color: #282828;
background-color: #fff;
padding: 20px 15px 25px 40px
}

.pageinput {
min-width: 300px;
max-width: 575px;
height: 100%;
width: 90%;
border: 1px solid #bfe50f;
color: #282828;
background-color: #f1ffb0
}

.pagefoot {
padding-top: 5px;
width: 100%;
text-align: center;
float: right
}

.abs {
margin: 60px 0px 0px 25px;
float: none
}

.brief {
padding-top: 5%;
width: 100%;
text-align: left;
float: none;
}

.info {
padding-left: 10px
}

.agb {
list-style-image: none;
list-style-type: lower-latin;
}

.warning {
color: #282828;
background-color: #e0fb00;
border: 3px solid #bfe50f;
padding: 15px
}

.shadow_pic {
width: 120px;
height: 90px;
color: #767676;
background-color: #fff;
padding: 5px;
border: 1px solid #bfe50f
}


/* Definition des Seiten-Layouts (DIV-Container): */

.head {
height: 70px !important;
color: #767676;
background-color: #fdfff1;
background:url(logo.gif) top left no-repeat;
width: 100%;
float: right;
text-align: center;
border-top: 5px solid #bfe50f
}

.right {
color: #767676;
background-color: #fff;
width: 20%;
float: right;
padding: 0px 30px 0px 10px
}

.main {
color: #767676;
background-color: #fdfff1;
padding: 0px 0px 20px 0px;
width: 70%;
min-height: 380px;
float: right
}

.inhalt {
padding: 20px 40px 30px 40px
}

.foot {
width: 100%;
color: #767676;
background-color: #fff;
margin-top: 5%;
padding-top: 30px;
text-align: center;
float: right
}

.spalten {
width: 100%;
text-align: center
}


.pic_l {
text-align: center;
margin: 0em 1em 0em 0em;
float: left
}

.pic_r {
text-align: center;
margin: 0em 0 0em 1em;
float: right
}

.pic_Bildschirm {
text-align: center;
width: 125px;
height: 125px;
background: url("http://www.clickworkx.de/de/umfragen/screen/big_Bildschirm.gif") no-repeat;
margin: 0em 0 0em 1em;
float: right
}

.shadow_div {
background: url("http://www.clickworkx.de/de/pics/schatten.gif") no-repeat;
width: 130px;
height: 105px;
float: left;
padding: 0px 20px 20px 0px
}

.imp {
width: 80%;
margin: auto
}

.up {
height: 65px;
width: 65px;
padding-right: 10%;
float: right
}


/* Positionierung der (Teaser-) Bilder: */

.fix {
position: absolute;
clear: both
}

.fix#logo {
top: 35px;
left: 7%;
height: 31px;
width: 251px
}

.fix#lang {
top: 15px;
right: 13px;
height: 50px;
width: 50px
}


}



@media print {

HTML,BODY,* {
line-height: 1.5em;
font-weight: 500
}


/* Links und Bilder */

A:link {
color: #bfe50f;
background-color: #fff;
outline: none;
text-decoration: none
}

A:focus {
outline: none
}

IMG {
border: 0px none;
outline: none;
float: right
}


/* Text-Absaetze: */

P {
page-break-inside: avoid;
color: #767676;
background-color: #fff;
padding-top: 0.5em;
padding-bottom: 1.5em
}

H1, H2, H3, H4, H5, H6 {
padding-top: 1.5em;
padding-bottom: 1em;
page-break-after: avoid;
color: #bfe50f;
background-color: #fff
}

.right {
display: none
}

.foot {
display: none
}

.fix#lang  {
display: none
}

}



@media aural {

HTML, BODY, * {
speak: normal;
speech-rate: faster;
voice-family:"young female", female;
}

A {
volume: medium;
pause-before: 100%;
pause-after: 200%;
pitch-range: 55;
stress: 65;
richness: 75;
speak-numeral: digits
}

A:visited {
volume: soft;
pause-before: 100%;
pause-after: 200%;
pitch-range: 55;
stress: 45;
richness: 55;
speak-numeral: digits
}

/* Text-Absaetze: */

P {
volume: medium;
pause-before: 200%;
pause-after: 300%;
pitch-range: 55;
stress: 55;
richness: 75;
speak-numeral: digits
}

H1, H2, H3, H4, H5, H6 {
volume: medium;
pause-before: 400%;
pause-after: 400%;
pitch-range: 55;
stress: 55;
richness: 85;
speak-numeral: digits ;
}

}
