
/*
Projektname:    zeb/
Funktion:           Formate fuer die Suchergebnisseite
Erstellt am:      18.12.2007 von FV    
Bearbeitet am:   18.12.2007 von FV 
QS am:             xx.xx.2007 MKue 
Freigabe am:      xx.xx.2007 MKue 
*/

/* = ----------------------------------------------- = */
/* = ----------------------------------------------- = */
/* = ----- Inhalt CSS -------------------------------- */
/* = ----- 1. Allgemeine Seiteneinstellungen 	----- */
/* = ----- 2. Definition der verschiednen Links ---- */
/* = ----- 3. Boxmodell ---- */
/* = ----- 4. Header ---- */
/* = ----- 5. Alternative Suchbergriffe ---- */
/* = ----- 5. Blaetternavigation ---- */
/* = ----  6. You could also try ---- */
/* = ----- 7. Alternative Suche am Ende der Seite ---- */
/* = ----- 8. Space ---- */
/* = ----- 9. Synonyme Search Appliance -----*/
/* = ----- 10. spezielle Stilanpassungen -----*/
/* = ----- 11. zeb anpassungen -----*/
/* = ----------------------------------------------- = */
/* = ----------------------------------------------- = */

/* = ----- 1. Allgemeine Seiteneinstellungen 	----- */

#box img {
margin: 0;
padding: 0;
border: none;
}

#box ul, #box li {
margin: 0;
padding: 0;
list-style-type: none;
}

#box h1, #box h2, #box h3, #box h4, #box h5, #box h6 {
margin: 0;
padding: 0;
}

#box p {
margin: 0 0 1em 0;
padding: 0;
}

#box table {
margin: 0;
padding: 0;
}

/* = ----- 2. Definition der verschiednen Links ---- */

.blaettern {
font-weight: normal !important;
}

.blaettern-aktiv {
font-weight: bold;
}

/* = ----- 3. Boxmodell ---- */

#box {
width: 610px;
margin: 0 0 15px 0;
padding: 0 0;
overflow: hidden;
}

#container {
margin: 0 0;
padding: 0 0;
width: 100%;
}

/* = ----- 4. Header ---- */
/* = Firmenlogo, Googlelogo, Formular und Alternative Suchbegriffe ----- */

#gsa-header {
margin: 0;
padding: 0 0 10px 0;
width: 100%;
background-color: #FFF;
}

/* ----- IE6 ---- */
* html #gsa-header {
padding: 8px 0 10px 0;
}

/* ----- IE7 ---- */
* + html #gsa-header {
padding: 8px 0 10px 0;
}

#logos {
background-color: #ff6600;
float: left;
width: 100%;
}

.firmen-logo {
float: left;
margin: 5px 0 5px 5%;
width: 223px;
height: 25px;
display: none;
}

.google-logo {
display: none;
float: right;
margin-right: 5%;
margin-top: 17px;
width: 76px;
height: 25px;
border: none;
}

#suchformular-box {
margin-top: 0;
margin-left: 0;
border: none;
}

#suchformular-box p {
clear: both;
float: left;
width: 200px;
border: none;
}


/*_____FormularEinstellungen_____*/

.formularzeile {
margin: 0;
padding: 10px;
background: #D5E4F6;
border: none;
}

#gsa-header form {
margin: 0 0;
padding: 0 0;
border: none;
}

#gsa-header legend {
margin: 0 0;
padding: 11px 0 4px 0;
color: #000;
font-size: 1.3em;
font-weight: bold;
}

#box input.normale-suche {
border: 0;
width: 190px;
height: 14px;
margin: 0;
padding: 2px 0 2px 4px;
}

#box select {
border: solid 1px #545454;
}

/*____Alternative Suchbegriffe_____*/ 
/* Hier drin sind die alternativen Suchbegriffe, die in einer Liste ausgegeben werden. 
Jeder Listenpunkt hat ein Hintergrundbild. */

#alternative-suchbegriffe {
margin-bottom: 10px;
width: 100%;
float: left; 
}

#alternative-suchbegriffe h4 {
font-size: 1.3em;
font-weight: bold;
width: 200px;
border: none;
}

#alternative-suchbegriffe ul{
width: 95%;
line-height: 1.8em;
}

#alternative-suchbegriffe li {
padding-right: 23px;
background: url(../images/li-bg-trennstrich.gif) no-repeat right;
text-decoration: none;
color: #000000;
float: left;
}

/* = --- Suche einnschraenken ---------- */

#suche-einschraenken-box {
clear: both;
float: left;
margin: 0 0;
padding: 0 0;
width: 100%;
background-color: #f7f7f7;
border-bottom: 1px solid #CCC;
}

#suche-einschraenken-content {
padding: 0 0;
border: none;
}

#suche-einschraenken-content legend {
margin: 0 0;
padding: 20px;
font-size: 16px;
line-height: 20px;
font-weight: bold;
}

.mit-office-icon { /* Mit Office-Icon */
padding: 5px 0 0 20px;
font-size: 1.3em;
background-image: url(../images/icon/office.gif);
background-repeat: no-repeat;
background-position: left center;
font-weight: bold;
}

.mit-datum-icon { /* Mit Office-Icon */
padding: 5px 0 0 20px;
font-size: 1.3em;
background-image: url(../images/icon/kalender.gif);
background-repeat: no-repeat;
background-position: left center;
font-weight: bold;
}

.mit-stift-icon { /* Mit Office-Icon */
padding: 5px 0 0 20px;
font-size: 1.3em;
background-image: url(../images/icon/stift.gif);
background-repeat: no-repeat;
background-position: left bottom;
font-weight: bold;
}

.ohne-icon { /* Mit Office-Icon */
font-size: 1.3em;
font-weight: bold;
margin-left: 20px;
line-height: 20px;
}

.fakelabel-radio-box-l {
width: 216px;
border: none;
float: left;
margin-left: 20px;
padding-bottom: 20px;
}

.fakelabel-radio-box-s {
width: 156px;
border: none;
float: left;
}

.fakelabel-radio {
clear: left;
margin: 0 0;
padding: 0 0;
border: none;
}

.suchfilter {
margin-left: 25px;
padding: 0 0;
}

.big {
font-weight: bold;
}

#hauptergebnisse {
clear: left;
float: left;
border: none;
width: 100%;
}

#zusatzergebnisse {
float: right;
padding-right: 5%;
padding-top: 20px;
width: 25%;
border: none;
}

* html #zusatzergebnisse {
margin-right: 2.5%;
}

/* = ----- suchergebnis-sortierung-box enthaelt: Sortierung der Suchergebnisse nach Datum u. Relevanz / Suchergebnisanzahl / Suchdauer ----- */
/* = ----- Sollten '.datum-relevanz', '.suchergebnis-anzahl' oder '.suchdauer' einen Rahmen bekommen, muessen sie kleiner gemacht werden, das sie ohne Rahmen genau 100% breit sind */

#suchergebnis-sortierung-box li {
float: left;
}

.space-datum-relevanz { /* Abstand zwischen datum- und elevanz */
padding-left: 10px;
}

.datum-relevanz {
width: 45%;
border: 0px;
}

/* ie6 */
* html .datum-relevanz {
width: 40%;
border: 0px;
}

/* ie7 */
* + html .datum-relevanz {
width: 40%;
border: 0px;
}

.suchergebnis-anzahl { 
width: 55%;
border: none;
text-align: left;
border: 0px;
}

.suchdauer {
width: 22%;
border: none;
text-align: right;
border: 0px;
}

/*_____Ergbenisbox-Mit-Tabs_____*/
/* = ----- top-trefferbox setzt sich zusammen aus : top-trefferbox-tabnavi /top-trefferbox-header / top-trefferbox-content / top-trefferbox-footer ---------- */
/* = Die Breite der ist dynamisch und richtet sich nach der Laenge des Links. Fest ist nur am Anfang(reiter-start) und am Ende(reiter-ende) des Reiters ein Hintergrundbild. Die Hoehe des Reiters ist immer gleich! */

#top-trefferbox {
clear: both;
float: left;
width: 100%;
border: none;
}

#top-trefferbox-tabnavi { /* optional - je nach Kunde, kann diese auch wegfallen */
clear: left;
float: left;
width: 100%;
border: none;
}

/*---- IE6 ----*/
* html #top-trefferbox-tabnavi {
margin-left: 0;
padding: 0 0;
}

#top-trefferbox-tabnavi span {
float: left;
padding: 0.2em 0 0 0;
margin: 0;
background-color: #F2F2F2;
margin-top: 7px;
min-height: 2.1em;
}

/*---- IE7 ----*/
* + html #top-trefferbox-tabnavi span {
padding: 0.2em 0 0 0;
}

/*---- IE6 ----*/
* html #top-trefferbox-tabnavi span {
height: 2.0em;
}

#top-trefferbox-tabnavi span.aktiv {
float: left;
padding: 0.2em 0 0 0;
margin: 0 0;
background-color: #E2E2E2;
min-height: 2.65em;
}

/*---- IE6 ----*/
* html #top-trefferbox-tabnavi span.aktiv {
height: 33px;
}

.tabnavi-start-hintergundbild-inaktiv {
margin: 0 0;
padding: 0 0;
float: left;
width: 15px;
min-height: 2.85em;
background-image: url(../images/reiter/reiter-start-inaktiv.gif);
background-repeat: no-repeat;
}

/*---- IE6 ----*/
* html .tabnavi-start-hintergundbild-inaktiv  {
height: 2.8em;
}

/*---- IE7 ----*/
* + html .tabnavi-start-hintergundbild-inaktiv  {
min-height: 37px;
}

.tabnavi-ende-hintergundbild-inaktiv {
margin: 0;
padding: 0;
float: left;
width: 15px;
min-height: 2.85em;
background-image: url(../images/reiter/reiter-ende-inaktiv.gif);
background-repeat: no-repeat;
}

/*---- IE6 ----*/
* html .tabnavi-ende-hintergundbild-inaktiv  {
height: 2.8em;
}

* + html .tabnavi-ende-hintergundbild-inaktiv  {
min-height: 37px;
}

.tabnavi-start-hintergundbild-aktiv {
margin: 0;
padding: 0;
float: left;
width: 15px;
min-height: 2.85em;
background-image: url(../images/reiter/reiter-start-aktiv.gif);
background-repeat: no-repeat;
}

/*---- IE6 ----*/
* html .tabnavi-start-hintergundbild-aktiv {
height: 2.8em;
}

/*---- IE7 ----*/
* + html .tabnavi-start-hintergundbild-aktiv  {
min-height: 37px;
}

.tabnavi-ende-hintergundbild-aktiv {
margin: 0;
padding: 0;
float: left;
width: 15px;
min-height: 2.85em;
background-image: url(../images/reiter/reiter-ende-aktiv.gif);
background-repeat: no-repeat;
}

/*---- IE6 ----*/
* html .tabnavi-ende-hintergundbild-aktiv {
height: 2.8em;
}

/*---- IE7 ----*/
* + html .tabnavi-ende-hintergundbild-aktiv {
min-height: 37px;
}

#top-trefferbox-tabnavi li {
float: left;
}

#top-trefferbox-tabnavi a { 
color: #ff6600;
background: #F2F2F2;
text-decoration: underline;
}

#top-trefferbox-tabnavi a:link { 
color: #ff6600;
background: #F2F2F2;
text-decoration: underline;
}

#top-trefferbox-tabnavi a:visited { 
color: #545454;
background: #F2F2F2;
text-decoration: underline;
}

#top-trefferbox-tabnavi a:hover { 
color: #000000; 
background: #F2F2F2;
text-decoration: underline;
}

#top-trefferbox-tabnavi a:active { 
color: #000000;
background: #F2F2F2;
text-decoration: underline;
}

#top-trefferbox-tabnavi a:focus {
color: #000000;
background: #F2F2F2;
text-decoration: underline;
}

#onebox-ruhrsite th {
color: #ffffff;
padding-left: 1%;
}

#onebox-ruhrsite thead {
background-color: #566AAB;
}

#onebox-ruhrsite tr td {
padding: 6px 0 6px 1%;
}

#onebox-ruhrsite tr.odd td {
background-color: #ffffff;
}

#onebox-ruhrsite tr.even td {
background-color: #F0F5FB;
border-top: 1px solid #AACCEE;
border-bottom: 1px solid #AACCEE;
}

#onebox-ruhrsite tr.even td.emp {
background-color: #CFDFEE;
}

.onebox-ruhrsite-seitenauswahl {
float: right;
padding-right: 1%;
}

/* rechte onebox - businessportraits */
#businessportraits {
background-color: #AFCAE2;
}

#businessportraits th {
background-color: #5A517E;
}

.onebox-businessportraits-seitenauswahl {
padding-left: 1%;
}

#top-trefferbox-header {
clear: left;
float: left;
width: 100%;
background-color: #e4e4e4;
}

#top-trefferbox-content {
clear: left;
float: left;
padding-left: 1px;
width: 100%;
color: #545454;
border: none;
height: 180px;
overflow: auto;
}

#top-trefferbox-content table{
width: 99%;
}

/*---- IE6 ----*/
* html #top-trefferbox-content table{
width: 97%;
}

/*---- IE7 ----*/
* + html #top-trefferbox-content table{
width: 97%;
}

#top-trefferbox-content strong{
font-size: 1.3em;
display: block;
}

#top-trefferbox-content img {
float: left;
width: 92px;
padding-top: 10px;
padding-bottom: 20px;
padding-left: 20px;
}

#top-trefferbox-content .daten {
float: left;
padding-left: 20px;
padding-top: 10px;
width: 200px;
border: none;
}

#top-trefferbox-footer {
float: left;
width: 100%;
background-color: #e4e4e4;
}

/*_____Ergebnisse, die in der Reitern tabellarisch ausgelesen werden_____*/
/*_____Formatierung der Tabellen_____*/

#top-trefferbox-content table td {
margin: 0 0;
vertical-align: top; 
}

#box th {
text-align: left;
}

#box td.s { /* Tabellenzelle klein */
padding-left: 30px;
width: 350px;
}

#box td.m { /* Tabellenzelle mittel */
width: 400px;
}

#box td.l { /* Tabellenzelle gross */
width: 246px;
float: right;
text-align: right;
padding-right: 30px;
}

#box table.trefferbox {
margin: 0 0 0 20px;
padding: 0 0;
border: none;
width: 95%;
}

#box table.refferbox td ,th{
padding-top: 5px;
border-bottom: 2px solid #FFF;
padding-bottom: 5px;
}

.spalte-eins {
width: 30%;
font-weight: bold;
font-size: 12px;
border: none;
}

.spalte-zwei {
width: 40%;
margin-left: 20px;
border: none;
}

.spalte-drei {
width: 30%;
border: none;
}

.abstand {
margin-left: 10px;
}

/*____Ergebnisse in der Liste_____ */
/* Hier drin sind die Hauptergebnisse, die in einer ul-li-Liste ausegegeben werden.
Die Liste hat keine Unterlisten. Listenpunkte, die aufgrund eines Suchtreffers in einem Unterverzeichnis sind, werden nur durch CSS weiter eingerueckt. */

#ergebnisliste h2 {
padding-bottom: 2px !important;
}

#ergebnisliste {
float: left;
width: 100%;
border: none;
margin-bottom: 15px;
}

#ergebnisliste ul li h2 {
padding-bottom: 100px;
font-size: 1.645em !important;
}

#ergebnisliste h2 a { 
color: #71bc61;
font-weight: normal;
text-decoration: none;
background: none;
padding: 0;
}

#ergebnisliste h2 a:visited { 
color: #71bc61;
text-decoration: none;
}

#ergebnisliste h2 a:hover { 
color: #71bc61; 
text-decoration: underline;
}

#ergebnisliste h2 a:active { 
color: #000000;
text-decoration: none;
}

#ergebnisliste h2 a:focus {
color: #000000;
text-decoration: none;
}

#ergebnisliste ul {
padding: 0;
margin: 0;
}

#ergebnisliste ul li ul { /* Unterverzeichnis */
padding: 0;
margin: 0; /* oben-abstand vom ersten li */
}

#ergebnisliste ul li {
list-style-type: none;
padding: 0 0 0 0;
margin: 30px 0 0 0; /* abstand zwischen li s */
background-repeat: no-repeat;
}

#ergebnisliste ul li.doc { /* hintergrundbild bei bedarf */
background: url(../images/doc.gif) no-repeat 0px 4px;
}

#ergebnisliste ul li.xls { /* hintergrundbild bei bedarf */
background: url(../images/xls.gif) no-repeat 0px 4px;
}

#ergebnisliste ul li.ppt { /* hintergrundbild bei bedarf */
background: url(../images/ppt.gif) no-repeat 0px 4px;
}

#ergebnisliste ul li.ps { /* hintergrundbild bei bedarf */
background: url(../images/icon/ps.gif) no-repeat 0px 4px;
}

#ergebnisliste ul li.pdf { /* hintergrundbild bei bedarf */
background: url(../images/pdf.gif) no-repeat 0px 4px;
}

#ergebnisliste ul li.rtf { /* hintergrundbild bei bedarf */
background: url(../images/rtf.gif) no-repeat 0px 4px;
}

#ergebnisliste ul li.text { /* hintergrundbild bei bedarf */
background: url(../images/office.gif) no-repeat 0px 4px;
}

#ergebnisliste ul li h2 {
width: 60%;
display: block;
font-weight: bold;
line-height: 25px;
float: left;
margin: 0;
padding: 0 0 0 25px; /* einrueckung fuer icon */
}

#ergebnisliste ul li span {
width: 30%;
display: block;
color: #545454;
float: left;
margin: 5px 0 1px 0;
padding: 0 0 0 25px; /* einrueckung fuer icon */
}

#ergebnisliste ul li p {
clear: both;
margin: 0 0 0 0;
padding: 10px 0 0 25px; /* einrueckung fuer icon */
border-top: 1px solid #A2C3EB; /* trennlinie zu h2 */
}

#ergebnisliste ul li p span {
display: inline !important;
float: none;
margin: 0;
padding: 0;
color: #71bc61;
}

#ergebnisliste ul li.ordner{ /* Unterverzeichnis*/
background-image: url(../images/icon/lock.gif);
background-position: 0px 30px;
padding: 30px 0 0 25px; /* anstand von oben/links damit */
margin: 0 0 0 0;
border: none;
}

#ergebnisliste ul li.ordner ul li {
margin: 0 0 0 -15px;
padding: 0 0 0 0;
}

#ergebnisliste ul li.ordner ul li p {
border-left: 1px solid #CCC;
clear: both;
margin: 0 0 0 0;
padding: 0; /* einrueckung fuer icon */
border-top: none;
}

#ergebnisliste ul li.ordner p.ende {
clear: both;
margin: 0 0 0 0;
border-top: 1px solid #CCC;
border-left: none;
padding-left: 35px;
}

#ergebnisliste ul li.ordner p {
clear: both;
margin: 0 0 0 0;
padding: 0 0 0 0; /* einrueckung fuer icon */
border-top: none;
}

#ergebnisliste ul li.ordner ul li {
background-position: 15px 32px;
}

#ergebnisliste ul li.ordner ul li h2 {
width: 60%;
border-left: 1px solid #CCC;
display: block;
font-weight: bold;
line-height: 25px;
float: left;
margin: 0 0px 0 0;
padding: 30px 0 0 35px; /* einrueckung fuer icon */
}

#ergebnisliste ul li.ordner ul li h2.pdf {
background: url(../images/icon/pdf.gif) no-repeat 10px 34px;
}

#ergebnisliste ul li.ordner ul li h2.text {
background: url(../images/icon/office.gif) no-repeat 10px 34px;
}

#ergebnisliste ul li.ordner ul li h2.doc {
background: url(../images/icon/doc.gif) no-repeat 10px 34px;
}

#ergebnisliste ul li.ordner ul li span {
width: 25%;
display: block;
float: left;
margin: 2px 0 1px 0;
padding: 28px 0 0 35px; /* einrueckung fuer icon */
}

#ergebnisliste ul li.ordner ul li p {
clear: both;
margin: 0 0 0 0;
padding: 10px 0 0 35px; /* einrueckung fuer icon */
border-top: 1px solid #CCC; /* trennlinie zu h2 */
}

#ergebnisliste ul li.ordner ul li p span {
display: inline !important;
float: none;
margin: 0;
padding: 0;
color: #71bc61;
}

/*_____weitere-treffer-box_____*/
/* Hier drin sind "weitere Suchtreffer" - in diesem Beipspiel Handbuecher und Autoren 
"Weitere-Treffer setzt sich immer aus einer 'head-box' und darunter den 'content-boxen'(im Beispiel immer 2) zusammen.
Die 'head-box' hat eine feste Groesse und ein Hintergrundbild.
Die 'content-box' hat eine feste Breite, die Hoehe ist dynamisch, je nach Inhalt. */

#weitere-treffer-box {
float: right;
width: 100%;
margin: 0 0;
padding: 0 0;
border: none;
}

.weitere-treffer-box-kopf {
float: left;
width: 100%;
height: 33px;
background-image: url(../images/hintergrund-linke-spalte.gif);
}

.weitere-treffer-box-kopf h2 {
float: left;
padding: 10px 0 10px 25px;
}
 
.weitere-treffer-box-kopf p {
float: right;
padding: 14px 10px 8px 0;
}

.abstand-zur-oberen-treffer-box { /* Bei mehreren Boxen wird hier der Abstand nach oben zur nchsten Box nach oben definiert */
margin-top: 20px;
}

.weitere-treffer-box-inhalt {
float: left;
margin-top: 2px;
width: 100%;
border: 1px dotted #CCC;
background-color: #f7f7f7;
}

.weitere-treffer-box-inhalt img {
float: right;
padding: 10px 10px 10px 0;
}

#box p.inhalt {
margin: 10px 10px 10px 25px;
border: none;
}

.untertitel {
color: #666;
padding-left: 20px;
}

.ueberschrift-inhahlt {
font-size: 12px;
}

/* = ---- 5. Blaetternavigation ---- */
/* = Blaetternavigation, die einmal ueber den Hauptsuchergebnisssen erscheint (bzw. kann) und am Ende der Seite. Wird dargestellt mir Hilfe einer Definitionslite ----- */

.blaetternavigation {
clear: both;
float: left;
width: 100%;
padding-top: 10px;
padding-bottom: 10px;
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
text-align: center;
}

.blaetternavigation-box-unten { /* am ende der Seite */
margin: 0px auto;
border: none;
width: 700px;
}

#box dl {
font-size: 1.1em;
margin: 0 0;
}

#box dt {
float: left;
margin: 0 0;
padding: 0 0;
color: #545454;
}

#box dd {
float: left;
margin-left: 10px;
padding: 0 0;
}

/* = ---- 6. You could also try ---- */
#ycat {
clear: both;
float: left;
width: 100%;
margin-top: 10px;
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
padding-top: 1em;
}

#ycat p {
font-size: 1.3em;
}

.vorschlaege {
font-size: 13px;
color: #000;
}

/* = ---- 7. Alternative Suche am Ende der Seite ---- */

#suchfeld-seitenende-box {
clear: both;
float: left;
width: 100%;
text-align: left;
padding: 10px;
background: #D5E4F6;
}

* html #suchfeld-seitenende-box {
margin-left: 0;
}

/* = ----8. SPACE ---- */
/* = Div mit 20px Hoehe, das zwischen den Elementen liegt, damit diese kein margin-top haben und so benutzerdefiniert eingesetzt werden koennen */
.space {
clear: both;
float: left;
margin: 0 0;
padding: 0 0;
width: 100%;
height: 20px;
border: 0px solid;
}

/* = ----- 9. Synonyme Search Appliance -----*/
#sgsa {
clear: both;
float: left;
width: 90%;
margin-left: 5%;
border: 1px dotted #e7e7e7;
background-color: #f7f7f7;
}

* html #sgsa {
margin-left: 2.5%;
}

#sgsa h3 {
padding-top: 2%;
padding-left: 2%;
}

#sgsa p {
padding-left: 2%;
padding-bottom: 2%;
}

/* = ----- 10. spezielle stilanpassungen fuer die suchergebnisausgabe -----*/

#box p {
font-size: 1.3em !important;
}

#box #ergebnisliste p {
font-size: 1em !important;
}

/* = ----- 11. zeb anpassungen -----*/

.formularzeile input {
border: 0;
}

#suchfeld-seitenende-box input {
border: 0;
}

.sendenbutton {
height: 18px !important;
padding: 0 4px 2px 10px;
width: auto;
font-weight: bold;
color: #fff;
background: #71BC61 url(../images/pfeil_weiss_gross.gif) no-repeat scroll 6px;
}

/* ie6 */
* html .sendenbutton {
padding: 2px 4px 2px 10px;
}

/* ie7 */
* + html .sendenbutton {
padding: 2px 4px 2px 10px;
}

* html .sendenbutton {
padding: 0 0 0 7px;
}

* + html .sendenbutton {
padding: 0 0 0 6px;
}
