/*
Formatvorlage  std.css  Stand 24.11.2008
Website www.alpha-biocare.ch
****************************************
Formatvorlage für Standardseiten. Gilt nicht für Navigationsseiten.
*/


/* ###### Anfang  Basisformate ###### */

/* Bei allen Browsern die rechte Scrollbar immer zeigen (nicht nur IE), damit lange Inhaltsseiten nicht "nach rechts springen" */
/* CSS3-Elemente overflow: (beide) / overflow-y: (vertikal) / overflow-x: (horiz.).  Attribute :auto / :scroll / :hidden */
html {
        overflow-y:scroll;
        overflow-x:auto;
}

body, p, h1, h2, h3, h4, b, strong, i, table, tr, td, th, caption, form, li, ul, ol, option, input, textarea, select, div, pre, sub, sup {
        font-size:11px;
        font-family: Verdana, Arial, Helvetica, SansSerif;
        font-weight : normal;
        line-height : 1.3em;
}

b, strong {
	font-weight : bold;
}

body {
	background-color : rgb(255, 255, 255);
}

p, h3, ul, ol {
	margin-top : 10px;
	margin-bottom : 10px;
	margin-left : 0px;
	margin-right : 0px;
}

h1, h2, h3, caption {
	font-weight : bold;
}

h1 {
	color : green;
	font-size : 15px;
	margin-top : 27px;
	margin-bottom : 10px;
	letter-spacing : 2px;
}

/* Oben optisch gleicher Abstand wie Bilder in der Bildspalte rechts (siehe .bild-bildspalte) */
h2 {
	color : green;
	font-size : 13px;
	margin-top : 16px;
	margin-bottom : 20px;
}

h3 {
	color : green;
	letter-spacing : 1px;
}

h4, caption {
	color : black;
}

.einzug-links {
	margin-left : 30px;
}

sub, sup {
	font-size : 92%;
}
/* ###### Ende  Basisformate ####### */




/* ###### Anfang  Tabellen ###### */

/* Tabellenrahmen (margin nicht verwenden oder "=0", weil von Nicht-IE-Browsern sehr unterschiedlich interpretiert) */
table {
	border-collapse : collapse;
	empty-cells : show;
}

/* Tabellenzellen */
td, th {
	vertical-align : top;
}

/* Überschriftzellen */
th {
	text-align : left;
	padding-top : 3px;
	padding-bottom : 3px;
	padding-left : 4px;
	padding-right : 4px;
}

/* Tabellentitel (für IE im Text davor immer Abschlusstag </p> verwenden*/
caption {
	text-align : left;
}
/* ###### Ende  Tabellen ####### */




/* ###### Anfang  Elementformate ###### */

/* Horizontallinie (heigt inkl. 2x border / background-color gleich wie color / Alternative zu margin ist width) */
/* optional height : 3px; und border : 1px */
hr {
	height : 1px;
	color : gray;
	background-color : gray;
	border : 0px solid gainsboro;
	noshade : noshade;
	text-align : left;
	margin-left : 0px;
	margin-right : 0px;
	margin-top : 1ex;
	margin-bottom : 1ex;
}

/* Links */
a, a:link, a:visited {
	color : rgb(70, 70, 70);
	text-decoration : underline;
}

/* Links und Mauseffekte */
a:hover {
	color : green;
	text-decoration : underline;
}

/* Link zuoberst rechts im Seiteninhalt: Gleiche Grösse wie .subnav in nav.css + margin-bottom gleich wie h1 */
.topnav, .imgchange {
	font-size : 10px;
	font-weight : normal;
	letter-spacing : 0px;
	margin-bottom : 10px;
}
.topnav a, .topnav a:link, .topnav a:visited, .topnav a:hover, .topnav a:active,
.imgchange a, .imgchange a:link, .imgchange a:visited, .imgchange a:hover, .imgchange a:active {
	border-style : solid;
	border-width : 1px;
	padding : 0px;
    color : gray;
    text-decoration : none;
	border-color : white;
}
.topnav a:hover {
	border-color : green;
}
.imgchange a:hover {
	border-color : mediumvioletred;
}


/*  L i s t e n  */
ul, ol {
	padding-left : 0px;
	list-style-position : outside;
	margin-top : 0px;
	margin-bottom : 0px;
}

/* Zeilen- bzw. Absatzabstand der Listenpunkte */
li {
	margin-top : 0px;
	margin-bottom : 5px;
}

/* Aufzählungsliste */
ul {
	margin-left : 17px;
	list-style-image : url('../images/layout/listenquadrat-p10px-grau.gif');
}

/* Listentext Aufzählungsliste */
ul li {
	padding-left : 4px;
}

/* Zahlenliste */
ol {
	margin-left : 22px;
	list-style-type : decimal;
}

/* Listentext Zahlenliste */
ol li {
	padding-left : 0px;
}

/* Formular (input für Benutzereingaben) */
input, textarea {
	color : green;
}
/* ###### Ende  Elementformate ####### */




/* ###### Anfang Benutzerdefinitionen ###### */

/* Grüner Hintergrund (Schrift oder Tabellenzelle) */
.hgrund-gruen {
	background-color : rgb(240, 255, 240);
}

/* Grauer Hintergrund (Schrift oder Tabellenzelle) */
.hgrund-grau
{
	background-color : rgb(240, 240, 240);
}

/* Grauer Rahmen umlaufend */
/* Optionale Einzelattribute |element : oben rechts unten links;| */
.rahmen {
	border-style : solid;
	border-color : gray;
	border-width : 1px;
	padding : 2px;
}

/* Element/Bild vertikal in Textmitte  */
/* für Inline-Elemente wie img */
.bild-mitte img {
	vertical-align : middle;
	margin-left : 0px;
	margin-right : 0px;
}

/* Bestellbutton ist optisch oberkant h2 und Bild */
/* class="bestellen" manuell in img-Tag einfügen (damit nur auf img und nicht auf h2 angewendet) */
/* (Alternative mit vertical-align:-40%;) */
.bestellen {
    margin-bottom:-4px;
}


/* Titelbild ist rechts und vom Text links umflossen  */
.bild-titel img {
	float : right;
	margin-top : -33px;
	margin-left : 30px;
	margin-bottom : 15px;
	border-width: 1px;
	border-color: #B0B0B0;
}

/* Bilder rechts in Bildspalte: Randabstände steuern Seiten-Layout */
/* Oben optisch oberkant Text (unter Titel h2) */
.bild-bildspalte img {
	margin-top : 10px;
	margin-left : 30px;
	margin-right : 0px;
	margin-bottom : 5px;
}

/* Überschrift 3 mit neuem Abschnitt und Bild (oben optisch oberkant h3) */
/* horizontale Positionierung auf der Webeite vor img mit mit style="margin-left/right : ..px;" */
/* permanenter Border von 1px wichtig (white/farbig), damit bei a:hover kein Zeilenumbruch/Verschiebung möglich */
.bild-bildspalte-h3 img {
	margin-top : 0px;
	margin-left : 0px;
	margin-right : 0px;
	margin-bottom : 0px;
}
.bild-bildspalte-h3 a img, .bild-bildspalte-h3 a:link img, .bild-bildspalte-h3 a:visited img,
.bild-bildspalte-h3 a:hover img {
	border-style : solid;
	border-width : 1px;
	padding : 0px;
	border-color : white;
}
.bild-bildspalte-h3 a:hover img {
	border-color : green;
}


/* Bild ist rechts-oben und vom Text links umflossen  */
/* margin-top : 15px; falls Bild mitten im Text */
.bild-rechts img {
	float : right;
    margin-top : 4px;
	margin-left : 30px;
	margin-bottom : 15px;
}
/* Bild links-oben und vom Text rechts umflossen  */
/* margin-top : 15px; falls Bild mitten im Text */
.bild-links img {
	float : left;
	margin-top : 4px;
	margin-right : 30px;
	margin-bottom : 15px;
}
/* Wichtige Hinweise: Damit die Eigenschaft 'Textfluss um Bilder' nicht
   auf alle Bilder eines Abschnitts angewandt wird, sondern nur auf das
   betreffende Bild, muss im HTML-Code der span-Tag manuell eingefügt werden (Beispiel):
   <p>Text... <span class="bild-rechts"><img src="bild1.jpg"></span> ...Text</p>
   Um bei Bedarf das Umfliessen von Bildern an einer bestimmten Stelle
   abzubrechen und unterhalb des Bildes weiterzufahren, folgenden Tag einfügen:
   <div style="clear:both"> oder <p style="clear:both">
*/

/* ###### Ende Benutzerdefinitionen ####### */




/* ###### Anfang Inaktiv orange-markiert ###### */
h5, h6, address, dir, menu, dl, dt, dd {
	color : rgb(250, 150, 50);
	background-color : rgb(255, 240, 240);
	font-size : 15px;
}

/* Trennlinie im CSS-Editor */
p.-------------------- {
	color : rgb(250, 150, 50);
	background-color : rgb(255, 240, 240);
	font-size : 15px;
}

/* Rahmen als Trennlinie (Rahmenhöhe= font-size mit &nbsp; als Zeichen / Problem mit Opera) */
/* .trennlinie {
	font-size : 1px;
	background-color : green;
	border-style : solid;
	border-color : gainsboro;
	border-width : 1px;
	margin-left : 0px;
	margin-right : 0%;
	margin-top : 30px;
	margin-bottom : 10px;
	padding : 0px;
} */

/* ###### Ende Inaktiv orange-markiert ###### */