@charset "UTF-8";
/*
* Stylesheet f�r Formatierung der Newsletter f�r "aRES" und "cseTools"
* Das Stylsheet soll sowohl f�r den Newsletterversand per E-Mail
* als auch zum Einbinden des Artikels auf der Joomla-Website verwendet werden.
*
* Erstellt von Peter M�ller f�r aRES Datensysteme
*
* -------------------------
* REGELN
* -------------------------
* 1. keine Fonts-Angaben!
* --> Fonts k�nnen beim Mailing nicht lokal eingebunden werden. Alternative
* --> w�ren googlefonts, die wir aus Datenschutzgr�nden nicht benutzen.
*
* 2. IMMER prefix "nl_" verwenden!
* --> damit die Deklarationen exklusiv f�r den Newsletter bleiben. Ansonsten
* --> w�rde beim Einbinden das gesamte Aussehen der Website ver�ndert werden.
*
* 2.a Bei der definition der Selektoren unten ist der bisher verwendete Name
* als Kommentar dahinter geschrieben.
*
* 3. So detailliert wie m�glich!
* --> Sonst kann es sein, dass beim Einbinden in die Website nicht gesetzte
* --> Eigenschaften durch das Stylesheet der Website ein anderes Aussehen
* --> bewirken
*
* 4. Das Stylesheet wird extern eingebunden!
* --> Sowohl beim Versand des Newsletters, als auch bei Ver�ffentlichung
* --> als Artikel auf den Joomla-Websites
*
*
* //ggf. als statische URL
*
*
*
* 5. Hirarchie
* --> HTML-TAG -> Klasse -> id
* --> nach
*
* 6. HTML-TAG 0. Type
* --> sind Deklarationen zu Elementen die es im HTML sowieso gibt
* --> Beispiel: "table" oder "p"
*
* 7. Klassen 1. Type
* --> sind Deklarationen die mit einem Punkt anfangen
* --> Beispiel: .nl_einleitung
*
* 8. id's 2. Type
* --> sind Deklarationen die alle �bergeordneten Eigenschaften �berschreiben
* --> beginnen mit einer Raute
* --> Beispiel: #sonderfall
*
* 9. Selektoren
* --> Bewirkt, dass eine Klasse nur im Zusammenhang mit ihrem HTML-Tag wirkt
* --> Beispiel: p.nl_einleitung (wichtig: ohne Leerzeichen!)
*
*
* -------------------------
* WAS WIR BRAUCHEN
* -------------------------
h1
h2
textlink prim�r
textlink sekund�r
button prim�r
button sekund�r
p
p teasertext
p fu�zeile
span txt_rot
span txt_gruen
img
img logo
*/
body.nl { /*alt: ohne Klasse*/
Margin: 0;
padding: 0;
min-width: 100%;
-webkit-font-smoothing: antialiased;
mso-line-height-rule: exactly;
}
table.nl { /*alt: ohne Klasse*/
border-spacing: 0;
}
table.nl_einspaltig {
border-spacing:0;
border:1px solid #e8e7e5;
}
.nl_wrapper { /*alt: wrapper*/
width: 100%;
table-layout: fixed;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
.nl_webkit { /*alt: webkit*/
max-width: 800px;
}
.nl_outer { /*alt: outer*/
Margin: 0 auto;
width: 100%;
max-width: 800px;
}
.nl_inner { /*alt: inner*/
padding: 10px;
}
p.nl_einleitung {
font-size:16px;
text-align:center;
line-height:22px;
color:#161616;
}
td.nl {
border:1px solid #e8e7e5;
font-size:14px;
line-height:19px;
color:#555555;
}
td.nl_fuss {
font-size:14px;
line-height:19px;
color:#555555;
}
p.nl_normal { /*alt: ohne Klasse*/
Margin: 0;
font-size:14px;
text-decoration:none;
text-align:left;
line-height:19px;
padding-bottom: 10px;
color:#555555;
}
p.nl_kleingedrucktes { /*alt: .kleingedrucktes*/
font-size:10px !important;
text-align:left;
line-height:16px;
color:#868686;
}
p.nl_bildcopy {
Margin: 0;
font-size:10px;
text-decoration:none;
text-align:right;
line-height:15px;
color:#868686;
}
p.nl_fusszeile {
font-size:12px;
text-align:left;
line-height:16px;
color:#868686;
}
h1.nl { /*alt: ohne Klasse*/
font-size: 32px !important;
font-weight: normal;
Margin-top: 15px;
text-decoration:none;
line-height:40px;
color:#040303;
-webkit-font-smoothing: antialiased;
}
h2.nl { /*alt: ohne Klasse*/
font-size: 22px !important;
font-weight: normal;
Margin-top: 15px;
Margin-bottom: 5px !important;
text-decoration:none;
line-height:30px;
color:#161616;
-webkit-font-smoothing: antialiased;
}
h3.nl { /*alt: ohne Klasse*/
font-size: 18px !important;
font-weight: normal;
Margin-top: 15px;
Margin-bottom: 5px !important;
text-decoration:none;
line-height:24px;
color:#161616;
-webkit-font-smoothing: antialiased;
}
a.nl_fusszeile {
color:#868686;
text-decoration: underline;
text-decoration-style: dotted;
}
a.nl_txtlink_1st { /*alt: link-rot*/
color:#B81D21;
text-decoration: underline;
text-decoration-color: #B81D21;
text-decoration-style: dotted;
}
a.nl_txtlink_2nd { /*alt: link-blau*/
color:#26A2D4;
text-decoration: underline;
text-decoration-color: #26A2D4;
text-decoration-style: dotted;
}
a.nl_button_1st { /*alt: call2rot*/
background-color:#B81D21;
color:#FFFFFF !important;
padding-bottom:5px;
padding-left:14px;
padding-right:14px;
padding-top:5px;
text-decoration:none;
}
a.nl_button_2nd { /*alt: call2blau*/
background-color:#26A2D4;
color:#FFFFFF !important;
padding-bottom:5px;
padding-left:14px;
padding-right:14px;
padding-top:5px;
text-decoration:none;
}
ul.nl { /*alt: ohne Klasse*/
font-size:14px;
margin:unset;
}
ol.nl { /*alt: ohne Klasse*/
font-size:14px;
}
li.nl { /*alt: ohne Klasse*/
padding-bottom:2px;
font-size:14px;
text-decoration:none;
text-align:left;
line-height:19px;
color:#555555;
}
img.nl_normal {
border: 0;
border-width:0;
}
img.nl_social {
border-width:0;
max-width:24px;
max-height:24px;
height:auto;
display:block;
}
.nl_one-column .nl_contents { /*alt: .one-column .contents*/
text-align: left;
-webkit-font-smoothing: antialiased;
}
.nl_one-column p.nl_normal { /*alt: .one-column p*/
font-size: 14px;
-webkit-font-smoothing: antialiased;
}
.nl_two-column { /*alt!*/
text-align: center;
font-size: 0;
}
.nl_2spaltig { /*alt: .two-column*/
text-align: center;
font-size: 0;
}
.nl_two-column .nl_column { /*alt: .two-column .column*/
width: 100%;
max-width: 400px;
display: inline-block;
vertical-align: top;
}
.nl_contents { /*alt: .contents*/
width: 100%;
}
.nl_two-column .nl_contents { /*alt: .two-column .contents*/
font-size: 14px;
text-align: left;
}
.nl_two-column img.nl_normal { /*alt: .two-column img*/
width: 100%;
max-width: 280px;
height: auto;
}
@media only screen and (max-device-width: 480px) {
table.nl[class=hide], img.nl_normal[class=hide], td[class=hide] {
display: none;
}
.nl_contents1 { /*alt: contents1*/
width: 100%;
}
}