/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
forms.css / SP-CH-2007
(Alle Formular-Formatierungen)
Version: 2007-03-13 HTML-E
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +  */

/* !!! Alle Formulare (ausser dem Select-Feld Kantonskarte) !!!
==================================================================================== */

#btnShowForm{display:none;}

#contentMain form {
margin: 10px 10px 20px 10px;
width: 450px;
padding:0;
}
#contentMain form fieldset{
border:0px solid #fff;
}


#contentMain #contentCanvas form h3{
margin:15px 0 0 0;padding:0;
font-size: 120%;
font-weight: bold;
}
#contentMain form p{
margin:5px 0;padding:0;
}
#contentMain form p.radioBtns{
margin:5px 0;padding:0;
}
#contentMain form p.radioBtns span{
margin:0 30px 0 5px;
}


#contentMain form:after {
content: ".";
display:block;
height:0;
clear: both;
visibility: hidden;
}

#contentMain form label{
display:block;
margin:15px 0 0 0;padding:0;
font-size: 120%;
font-weight: bold;
}
#contentMain form label span.details,
#contentMain form h3 span.details{
font-weight: normal;
}

#contentMain form label.simpleText{
display:inline;
padding:0 20px 0 0;
font-weight: normal;
font-size: 100%;
}



#contentMain form input.inputField,
#contentMain form textarea,
#contentMain form select{
border:1px solid #999;
margin:5px 0;
padding: 2px;
width:444px;
}
#contentMain form select{
width:220px;
}
#contentMain form input.inputField:focus,
#contentMain form textarea:focus,
#contentMain form select:focus{
background-color:#EDEDED;
}



#contentMain form input.sendButton {
float:right;
color: #d2021a;
background:transparent url(../images/pfeil_rot_transp_up.png) no-repeat right;
border:none; font: bold 120%/120% Verdana, Arial, Helvetica, sans-serif;
text-transform: uppercase; padding:6px 25px 6px 0; margin:8px 0; cursor:pointer;
}

#contentMain form input.sendButton:hover,
#contentMain form input.sendButton:focus {
background:transparent url(../images/pfeil_2_rollover_weiss_weiss.gif) no-repeat right;
text-decoration:underline;
}



#contentMain form p.legalNote{
margin:10px 0;
}
#contentMain form p.legalNote #legal{
margin:2px 0 0 2px;
float:left;
}
#contentMain form p.legalNote span{
display:block;
margin-left:30px;
}




#contentMain #contentCanvas form table.layoutTable{
margin:0;padding:0;border:none !important;
border-collapse:collapse;
}
#contentMain #contentCanvas form table.layoutTable td{
margin:0;padding:0;background-color:#fff;
}
#contentMain #contentCanvas form table.layoutTable td label{
font-size:100%;
}


#contentMain #contentCanvas form table.layoutTable td.width50 input.inputField{
width:220px;
}

#contentMain #contentCanvas form table.layoutTable td.width25{
padding-left:5px;
}
#contentMain #contentCanvas form table.layoutTable td.width25 input.inputField{
width:101px;
}

#contentMain #contentCanvas form table.layoutTable td.width16{
padding-right:5px;
}
#contentMain #contentCanvas form table.layoutTable td.width16 input.inputField{
width:66px;
}



#contentMain #contentCanvas form ul{
margin:10px 0 20px 0;padding:0;
list-style-type:none;
list-style-image:none;
}
#contentMain #contentCanvas form ul li input{
margin-right:5px;
}
#contentMain #contentCanvas form ul li{
margin:0 0 10px 0;padding:0;
}
#contentMain #contentCanvas form ul ul{
margin:10px 0 0 20px;list-style-image:none;
font-size:100%;
}


/* !!! Seite weiterempfehlen und Blog-Kommentar !!!
==================================================================================== */

#contentMain #tellAFriend,
#contentMain #sendTestimonial,
#contentMain #blogComment{
background-color:#EDEDED;
padding:5px 15px;
width: 420px;
}

#contentMain #tellAFriend legend,
#contentMain #sendTestimonial legend,
#contentMain #blogComment legend{
background:transparent url(../images/icon_tellafriend.gif) no-repeat left;
border:none; font: bold 120%/120% Verdana, Arial, Helvetica, sans-serif;
text-transform: uppercase;
margin:0 0 10px 0;padding:6px 0 6px 20px;
color:#585858;
}

#contentMain #tellAFriend input.inputField,
#contentMain #tellAFriend textarea,
#contentMain #sendTestimonial input.inputField,
#contentMain #sendTestimonial textarea,
#contentMain #blogComment input.inputField,
#contentMain #blogComment textarea{
width:414px;
}
#contentMain #tellAFriend input.sendButton,
#contentMain #sendTestimonial input.sendButton,
#contentMain #blogComment input.sendButton{
background:transparent url(../images/pfeil_2_normal_rot_ededed.gif) no-repeat right;
}

#contentMain #tellAFriend input.sendButton:hover,
#contentMain #tellAFriend input.sendButton:focus,
#contentMain #sendTestimonial input.sendButton:hover,
#contentMain #sendTestimonial input.sendButton:focus,
#contentMain #blogComment input.sendButton:hover,
#contentMain #blogComment input.sendButton:focus {
background:transparent url(../images/pfeil_2_rollover_rot_ededed.gif) no-repeat right;
text-decoration:underline;
}












/* !!! Fehlermeldungen auf Formularseiten !!!
==================================================================================== */

#contentMain form p.errorMessage{
background:transparent url(../images/icon_errorMessage.gif) no-repeat left;
margin:0;padding:3px 0 0 10px;
color:#D2001A;font-weight:bold;
}

#contentMain form span.errorMessage label{
background:transparent url(../images/icon_errorMessage.gif) no-repeat left;
padding:0 0 0 10px;
color:#D2001A;
}
#contentMain form span.errorMessage input.inputField,
#contentMain form span.errorMessage textarea{
border:1px solid #D2001A;
}






/* - - - Shop Formular - - -
==================================================================================== */



.shopForm h2{
margin:0 0 20px 0;padding:0;
}



.shopForm div.shopItem{
width:450px;height:1%;
margin:10px 0 40px 0;padding:0;
}
.shopForm div.shopItem:after{
content: ".";
display:block;
height:0;
clear: both;
visibility: hidden;
}

.shopForm div.shopItem img{
float:left;border-right:15px solid #fff;
margin-bottom: 5px;
}
.shopForm div.shopItem h3{
margin:0 !important;padding:0; /* !important fuer IE */
}
.shopForm div.shopItem p{
margin-top:0;
}

#contentMain .shopForm div.shopItem p.preisAnzahl{
margin-top:15px;
height:3.2ex;
background-color:#EDEDED;
}
#contentMain .shopForm div.shopItem p.preisAnzahl span.floatLeft{
padding:2px 0 0 10px;
}
#contentMain .shopForm div.shopItem p.preisAnzahl label{
display:inline;font-size:100%;
}
#contentMain .shopForm div.shopItem p.preisAnzahl input{
margin:1px 10px 1px 1px;text-align:right;padding:0 3px;
}
#contentMain .shopForm div.shopItem p.preisAnzahl input:focus{
margin:1px 10px 1px 1px;text-align:right;padding:0 3px;
}



#contentMain .shopForm input.sendButton {
float:right;
color: #d2021a;
background:transparent url(../images/icon_warenk_normal_rot_weiss.gif) no-repeat right;
border:none; font: bold 120%/120% Verdana, Arial, Helvetica, sans-serif;
text-transform: uppercase; padding:6px 25px 6px 0; margin:8px 0; cursor:pointer;
}

#contentMain  .shopForm input.sendButton:hover,
#contentMain .shopForm input.sendButton:focus {
background:transparent url(../images/icon_warenk_rollover_weiss_weiss.gif) no-repeat right;
text-decoration:underline;
}


#contentAdditional h3.conditions{
padding-left:20px;
margin:13px 0 5px 0;
background:transparent url(../images/icon_shop_conditions.gif) no-repeat 0 0;
font-size:140%;
}
#contentAdditional p.conditions{
margin:0;padding:0;

}

/* E-Card-Versende-Formular
==================================================================================== */
#contentMain #contentCanvas #eCardForm {
margin-bottom:0;
}

#contentMain form#eCardForm input.sendButton {
padding-right: 27px;
text-align: right;
font-size: 130%;
}
