/* CSS-Datei ASB-Ruhr, Aufteilung: Seitenlayout, allgemeine Formatierungen,
Bilderformatierungen, Formatierungen für spezielle Bereiche. */


html {
font-size: 11px;
margin: 0;
padding: 0;
}

/* Seitenlayout */

#mitte {
height: 150%;
margin-top: -14;
margin-bottom: -14;
margin-right: 13%;
margin-left: 15%;
padding: 1.2% 1% 1% 1%;
background: url(blaukl2.gif) repeat-x;
color: darkblue;
}

#mitteeck {
position: relative;
float: left;
left: -4;
margin: 0;
padding: 3;
bottom: 1px;
font-size: smaller;
}

#mitteeckr {
position: relative;
height: 20px;
width: 25px;
float: right;
background: url(libaer.gif) no-repeat;
margin: 2;
padding: 0;
top: -5;
}

/* Seitenlayout  speziell Besuchshunde */

#mitteb {
margin-top: -22;
margin-bottom: -14;
margin-right: 14%;
margin-left: 15%;
padding: 1% 1%;
background-image: url("../graf/gestgraf/higr_besuchsh2.jpg");
}

/* Seitenlayout */

#links {
position: fixed;// position: absolute;
top: 0;
left: 0;
padding: 1;
width: 16%;
height: 120%;
overflow: hidden;
background-image: url("leire2.jpg");
}

#rechts {
position: absolute;
z-index: 3;
top: 0;
width: 14%;
height: 200%;
margin-left: 85%;
right: 0px;
padding: 0 0%;
background-image: url("leire3.jpg");
background-repeat: no-repeat;
}

/*Boxenlayout*/

#mitteu {
position: relative;
z-index: 1;
top: 55;
}

#mittabl {
position: relative;
}

#mitteo {
position: fixed;
top: 5%;
left: 17%;
z-index: 2;
font-size: smaller;
}

#mitteob {
margin-left: 1%;
position: fixed;
z-index: 2;
}

#mitteor {
top: 5%;
left: 17%;
position: fixed;
z-index: 2;
font-size: smaller;
}

#mitteorb {
Top: 10%;
position: fixed;
z-index: 2;
font-size: 80%;
margin-left: 15%;
margin-top: -10;
}

#rechtsb {
position: relative;
top: 80;
margin: 2;
width: 120px;
font-size: 110%;
font-weight: bolder;
background: darkblue;
text-align: center;
}

#rechtsbu {
position: relative;
top: 150px;
margin: 2px;
width: 95%;
font-size: 70%;
font-weight: bolder;
background: darkblue;
text-align: center;
overflow: auto;
}

#rechtsak {
position: relative;
top: 100px;
right: 2px;
left: 2px;
border: 5px groove black;
margin: 0px;
padding: 0px;
width: 120px;
font-weight: bolder;
background-image: url(logkl.gif);
color: black;
}

#rechtsu {
position: fixed;// position: absolute;
bottom: 2px;
margin: 2px;
width: 120px;
height: 80px;
font-size: 70%;
font-weight: bolder;
text-align: center;
}

#linksa {
position: relative;
background-image: url("asblog.gif");
background-repeat: no-repeat;
height: 50;
top: 5;
margin: 2;
}

#linksb {
position: relative;
top: 10;
margin: 2;
height: 100%;
width: 100%;
font-size: 80%;
}

#mit2 {
border: 1px solid blue;
background: blue;
padding-left: 5px;
}

#mit3 {
border: 10px groove blue;
background: silver;
padding-left: 5px;
padding-bottom: 5px;
}

#mitsim {
position: relative;
z-index: 1;
top: 30;
padding-left: 5px;
padding-bottom: 5px;
margin-bottom: 14px;
}

#mithn {
position: relative;
background-image: url(../graf/hn/backgr.jpg);
background-repeat: no-repeat;
background-position: center;
}

#bic {
text-align: center;
padding-top: 10px;
}

#bicind {
top: 0;
float: right;
width: 400px;
text-align: center;
padding-top: 10px;
margin-right: 10px;
}

/*Boxenlayout Tabellen*/

#tabm {
position: relative;
left: 200;
}

#tabm1 {
position: relative;
left: 200;
}

#tabm2 {
position: relative;
left: 100;
}

#tabmpsy {
position: relative;
left: 100;
}

/* Allgemeine Formatierungen */

body {
font-family: Tahoma, Arial, sans-serif;
color: black;
}

hr {
clear: both;
color: iceblue;
border-color: blue;
border-style: solid;
border-width: 2px;
width: 300;
height: 7px;
}

strong {
color: indigo;
letter-spacing: 2px;
}

h1 {
color: blue;
font-size: x-large;
text-align: center;
}

#rechtsbu h1 {
color: white;
font-weight: bolder;
text-align: center;
font-size: 14px;
}

#bic h2 {
font-size: 90%;
color: dimgrey;
}

#rechtsbu h2 {
color: lightgray;
font-size: 10px;
}

h3 {
color: darkgray;
text-align: center;
font-size: large;
}

h3:first-letter {
color: blue;
font-weight: bolder;
font-size: 140%;
}

#mitteb h3 {
color: black;
}

#mittek h3 {
color: green;
}

h4 {
color: black;
font-size: 85%;
text-align: right;
margin: 0;
}

#rechts h4 {
padding-right: 5px;
}

#mittek h4 {
padding-top: 5px;
}

h5 {
font-size: 100%;
}

h5:first-letter {
color: blue;
font-weight: bolder;
font-size: 110%;
}

h6 {
font-size: 120%;
color: darkgray;
text-align: right;
}

h6:first-letter {
color: blue;
font-weight: bolder;
font-size: 110%;
}

h4 i {
color: yellow;
}

#mittek h4 i {
color: green;
}

#mithn h6 {
padding: 0px;
margin: 0px;
}


#mitsim li {
list-style: none;
margin-top 0px;
margin-bottom:0px;
padding-top: 0px;
padding-bottom: 0px;
bottom: 0px;
}

li h2 {
color: darkblue;
font-weight: bolder;
font-size: 110%;
margin-bottom:0px;
padding-top: 0px;
padding-bottom: 0px;
background-color: lightskyblue;
}

li h3 {
text-align: left;
font-size: 100%;
margin-top: 0px;
margin-bottom:0px;
padding-top: 0px;
padding-bottom: 0px;
font-style: italic;
background-color: lightskyblue;
}

li h3:first-letter {
color: darkblue;
font-weight: 100%;
font-size: 100%;
}

li h4 {
color: darkgray;
text-align: left;
font-size: 100%;
margin-left: 160px;
margin-top: 0px;
margin-bottom:0px;
padding-top: 0px;
padding-bottom: 0px;
font-style: italic;
background-color: lightskyblue;
}

li h5 {
color: darkgray;
text-align: left;
font-size: 100%;
margin-left: 200px;
margin-top: 0px;
margin-bottom:0px;
padding-top: 0px;
padding-bottom: 0px;
font-style: italic;
background-color: lightskyblue;
}

p {
color: black;
margin-left: 0;
}

#rechtsbu h5 {
color: yellow;
font-size: 12px;
}

#rechtsbu h5:first-letter {
color: white;
font-weight: bolder;
font-size: 120%;
}

#mit2 p {
color: white;
font-weight: bold;
}

td p {
font-size: 90%;
}

td h4 {
color: yellow;
font-size: 70%;
text-align: center;
margin: 0;
}

th p {
background: blue;
color: yellow;
}

td h3 {
background: lightskyblue;
}

th h4 {
background: green;
color: white;
font-size: 100%;
text-align: center;
}


a img {border: none;}
a:link {color: blue; font-weight: bolder;}
a:visited {color: navy; font-weight: bolder;}
a:hover {font-size: 100%; color: gray;}
a:active {color: gray; font-weight: bolder;}
a[href^="http:"] {background: url(comp_world.gif) left center no-repeat; padding-left: 25px;}

.liso a:link {color: blue; font-weight: bolder;}
.liso a:visited {color: navy; font-weight: bolder;}
.liso a:hover {font-size: 100%; color: gray;}
.liso a:active {color: gray; font-weight: bolder;}
.liso a[href^="http:"] {background: white;}

.sond {
background-image: url(bloli.gif);
background-repeat: no-repeat;
float: left;
width: 210px;
margin: 0 0 20 0;
padding: 15px 0 0 20px;
font-family: optima, arial, sans-serif;
font-style: italic;
font-weight: bolder;
}

.sond p {
margin: 0;
padding: 0px 10px 15px 0px;
width: 190px;
text-align: justify;
line-height: 1.1em;
background-image: url(blore.gif);
background-repeat: no-repeat;
background-position: bottom right;
}

/* Klassenselektoren */

.kopf {
color: white;
}

.clear {
clear: both;
}

.rechts {
float: right;
}

.wichtig {
font-weight: bolder;
}

.wichtigh {
background-image: url(kontakt.gif);
background-repeat: no-repeat;
font-weight: bolder;
}

.wichtr {
color: darkred;
font-weight: bolder;
}

.wichts {
color: deepskyblue;
font-weight: bolder;
}

.wichtp {
color: indigo;
font-weight: bolder;
}

.wichtj {
color: darkgreen;
font-weight: bolder;
}

.somau {
cursor: help;
}

.spezif {
height: 480px;
width: 700px;
}

.speziind {
float: right;
height: 480px;
width: 700px;
}

.speziv {
height: 300px;
width: 400px;
float: right;
}

.spezik {
height: 1200px;
width: 700px;
border: none;
}

.wichtzent {
color: dimgray;
text-align: center;
font-weight: bolder;
background-image: url("asbaut.jpg");
}

/* Klassenselektoren für Navigation */

.aktuell {
color: black;
background-color: lightskyblue;
margin-bottom: 4px;
}

.aktuelln {
margin-left: 2px;
margin-top: 2px; 
background-image: url(haken.gif);
background-repeat: no-repeat;
}

.aktuellt {
background-image: url(kibaer.gif);
background-repeat: no-repeat;
}

.aktuellth {
background-image: url(hnger.gif);
background-repeat: no-repeat;
}

.aktuelltr {
background-image: url(ktw.gif);
background-repeat: no-repeat;
}

.aktuellts {
background-image: url(eule.gif);
background-repeat: no-repeat;
}

.aktuelltc {
background-image: url(seniorin_pc.gif);
background-repeat: no-repeat;
}

.aktuelltf {
background-image: url(behu.gif);
background-repeat: no-repeat;
}

.aktuellk {
color: darkgreen;
background-color: lightgreen;
margin-bottom: 4px;
}


/* Bilderselektoren*/

.bir {
float: right;
margin: 5px;
}

.bil {
float: left;
margin: 5px;
border: 1;
}

.bilk {
float: left;
margin: 5px;
border: 1;
width: 150px;
}

.bilkl {
float: left;
margin: 5px;
border: 1;
width: 100px;
}

.birm {
width: 300;
float: right;
margin: 5px;
}

.birlo {
width: 80;
float: right;
border: none;
}

/* Selektoren für Tabellenteile*/

.spezt {
background: gray;
}

.spezl {
background: lightgray;
}

.spezv {
background: lightskyblue;
}

.spezr {
background: red;
}

/* Selektoren für Listen*/

.ulrett {
list-style-type: disc;
list-style-image: url(liktw.jpg);
}

.ulkit {
list-style-type: disc;
list-style-image: url(libaer.gif);
}

.ulju {
list-style-type: disc;
list-style-image: url(lixue.jpg);
}

.uldown {
list-style-type: disc;
list-style-image: url(lihand.jpg);
}

.uldowne {
list-style-type: disc;
list-style-image: url(licomp.jpg);
}

/* Formatierungen für spezielle Bereiche */

#links td {
width: 300;
background-color: blue;
background-repeat: no-repeat;
text-align: right;
padding: 10 10 0 5;
}

#links a {text-decoration: none;font-size: 120%;}
#links a:link {color: gold; font-weight: bolder;}
#links a:visited { color: darkgrey; font-weight: bolder;}
#links a:hover {color: yellow;}
#links a:focus {color: yellow;}
#links a:active {color: gray; font-weight: bolder;}

#links img {
margin-top: 4;
margin-bottom: 40;
}

#rechtsbu a {font-size: 140%;}
#rechtsbu a:link {color: gold; font-weight: bolder;}
#rechtsbu a:visited { color: linen; font-weight: bolder;}
#rechtsbu a:hover { color: gold;}
#rechtsbu a:active {color: gray; font-weight: bolder;}

#rechtsbu p {
color: white;
}

#rechtsbu strong {
color: yellow;
font-size: 120%;
font-weight: bolder;
}

#mitte ul {
color: black;
margin-bottom: 0.2;
margin-top: 0.2;
}

#mitteo ul {
padding: 3px 0;
margin-left: 0;
border-bottom: 4px solid black;
font: bold 12px Verdana, sans-serif;
}

#mitteo ul li {
list-style: none;
margin: 0;
display: inline;
}

#mitteo ul li a{
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid black;
border-bottom: none;
background: green;
text-decoration: none;
color: white;
}

#mitteo ul li a:link:hover, #mitteo ul li a:visited:hover {
background: springgreen;
}

#mitteor ul {
padding: 3px 0;
margin-left: 0;
border-bottom: 4px solid black;
font: bold 12px Verdana, sans-serif;
font-size: 90%;
}

#mitteor ul li {
list-style: none;
margin: 0;
display: inline;
}

#mitteor ul li a{
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid black;
border-bottom: none;
background: darkblue;
text-decoration: none;
color: white;
}

#mitteor ul li a:link:hover, #mitteor ul li a:visited:hover {
background: blue;
}

#mitteorb ul {
padding: 3px 0;
margin-left: 0;
border-bottom: 4px solid black;
font: bold 12px Verdana, sans-serif;
font-size: 90%;
}

#mitteorb ul li {
list-style: none;
margin: 0;
display: inline;
}

#mitteorb ul li a{
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid black;
border-bottom: none;
background: darkblue;
text-decoration: none;
color: white;
}

#mitteorb ul li a:link:hover, #mitteor ul li a:visited:hover {
background: blue;
}

#mitteok ul {
padding: 3px 0;
margin-left: 0;
border-bottom: 4px solid black;
font: bold 12px Verdana, sans-serif;
font-size: 90%;
}

#mitteok ul li {
list-style: none;
margin: 0;
display: inline;
}

#mitteok ul li a{
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid black;
border-bottom: none;
background: green;
text-decoration: none;
color: white;
}

#mitteok ul li a:link:hover, #mitteok ul li a:visited:hover {
background: springgreen;
}

#mitteob ul {
padding: 3px 0;
margin-left: 0;
border-bottom: 4px solid black;
font: bold 12px Verdana, sans-serif;
font-size: 90%;
}

#mitteob ul li {
list-style: none;
margin: 0;
display: inline;
}

#mitteob ul li a{
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid black;
border-bottom: none;
background: darkblue;
text-decoration: none;
color: white;
}

#mitteob ul li a:link:hover, #mitteob ul li a:visited:hover {
background: blue;
}

#mit2 a {font-size: 100%;}
#mit2 a:link {color: white;}
#mit2 a:visited {color: darkgrey; font-weight: bolder;}
#mit2 a:hover {color: yellow;}
#mit2 a:active {color: gray; font-weight: bolder;}

#mit3 a {font-size: 100%;}
#mit3 a:link {color: blue; font-weight: bolder;}
#mit3 a:visited {color: darkred; font-weight: bolder;}
#mit3 a:hover {font-size: 110%; color: gray;}
#mit3 a:active {color: gray; font-weight: bolder;}

#mitsim a {color: darkblue; font-size: 100%;}
#mitsim a:link {font-weight: bolder;}
#mitsim a:hover {font-size: 110%;}
#mitsim a:active {color: gray; font-weight: bolder;}


#rechts h4 {
color: dimgray;
font-size: 70%;
text-align: right;
margin: 0;
}


#rechtsb p {
color: white;
}

#rechtsak a {font-size: 100%;}
#rechtsak a:link {color: black; font-weight: bolder;}
#rechtsak a:visited {color: black; font-weight: bolder;}
#rechtsak a:hover {background: gray;}
#rechtsak a:active {color: red; font-weight: bolder;}

#tabm table {
table-layout: fixed;
right: 100;
background: lightskyblue;
}

#tabm th, td {
width: 300;
vertical-align: top;
}

#tabm1 table {
table-layout: fixed;
right: 100;
background: yellow;
}

#tabm1 th, td {
width: 400;
padding-right: 25px;
vertical-align: top;
}

#tabm2 table {
table-layout: fixed;
right: 100;
}

#tabm2 th, td {
width: 150;
vertical-align: top;
}

#tabm2 a:link {color: black; font-weight: bolder;}
#tabm2 a:visited {color: indigo; font-weight: bolder;}
#tabm2 a:hover {font-size: 100%; color: blue;}
#tabm2 a:active {color: black; font-weight: bolder;}
#tabm2 a:[href^=*http:*] {background: url(comp_world.gif) left center no-repeat; padding-left: 10px;}

#tabmpsy table {
table-layout: fixed;
right: 60;
background: lightskyblue;
}

#tabmpsy td {
width: 300;
vertical-align: top;
}

#tabmpsy th {
width: 60;
vertical-align: top;
}