/*---------------------------------- Initialisierung -------------------------*/

html {
    height: 100%;
    /* force v-scrollbar to keep pages centered */
}

body {
    background-image: url(../images/00_01.jpg);
    color: #3c0d35;
    margin: 1% auto 0;
    width: 910px;
    height: 100%;
    /* force v-scrollbar to keep pages centered */
    padding-bottom: 1px;
    /* force v-scrollbar to keep pages centered */
}


/*---------------------------------- Typografie -------------------------*/

h1 {
    color: #3c0a40;
    float: left;
    font-size: 1.3em;
    font-style: normal;
    font-weight: 700;
    padding: 0 0 0 .4em;
}

h2 {
    color: #212B34;
    font-size: 1.2em;
    font-style: normal;
    font-weight: 700;
    padding: 1em .9em 2em 1.4em;
    text-align: center;
}

h3 {
    /* Ãœberschriften in Impressum */
    color: #3c0a40;
    font-size: 1em;
    font-style: normal;
    font-weight: 700;
    margin: 2em 0 .6em;
}

h4 {
    /* Seminarüberschriften */
    color: #212B34;
    font-size: 1em;
    font-style: normal;
    font-weight: 700;
    text-decoration: underline;
    margin: 1em 0 .6em;
}

blockquote {
    font-style: italic;
}


/*----------------------------------- Header ---------------------------------*/

header {
    background-color: black;
    border: 3px solid white;
    text-align: center;
    display: block;
    height: 11.7em;
    width: 100%;
}

header div {
    float: left;
    font-weight: 700;
    text-align: center;
}

header div a img {
    margin-bottom: 0.2em;
}

header div p.first {
    color: white;
}

header div p.second {
    color: #bab0b0;
    font-size: .8em;
}


/*--------------------------------- Navigation -------------------------------*/

nav {
    clear: both;
    text-align: center;
}

nav#top {
    border-left: 3px solid #fff;
    border-right: 3px solid #fff;
    width: 100%;
}

nav#top ul {
    background-color: #fff;
    border: 1px solid #ccc;
}

nav#top ul li {
    display: inline;
    font-size: .85em;
    padding: 0 .4em;
    vertical-align: middle;
}

nav#top ul li a:link,
nav#top ul li a:visited,
nav#top ul li a:active {
    color: #3c3b37;
}

nav#top ul li a:hover {
    color: #e144b9;
    text-decoration: underline;
}

nav#top ul li span {
    color: #03b403;
    font-weight: 500;
    text-shadow: 1px 1px grey;
}

nav#top ul img {
    vertical-align: middle;
}

nav#bottom ul {
    background-color: transparent;
    list-style-type: none;
}

nav#bottom ul li {
    color: #fff;
    display: inline;
    font-size: .85em;
    padding: 0 .5em;
}

nav#bottom ul li a {
    color: #fff;
    font-weight: 500;
}

nav#bottom ul li a:hover {
    color: #e97ece;
    text-decoration: underline;
}

nav#bottom ul li span {
    color: #80aa42;
    text-shadow: 1px 1px #06791d;
}


/*---------------------------------- Section ---------------------------------*/

section {
    background-image: url(../images/background.jpg);
    background-repeat: repeat;
    border-bottom: 3px solid #fff;
    border-left: 3px solid #fff;
    border-right: 3px solid #fff;
    display: block;
    font-size: .875em;
    min-height: 50em;
    padding: 2em 0 0;
    width: 100%;
}

section .h1-bullet img {
    margin-left: .5em;
}

section>img,
section .picture-index img {
    border-radius: 2%;
    border-style: solid;
    border-width: 5px;
    box-shadow: 15px 15px 30px #123;
    filter: progid: DXImageTransform.Microsoft.Shadow(Strength=13, Direction=135, Color='#394651');
    /*IE8 und IE9*/
    margin: 1em auto 4em;
    color: #dfd4cc;
    display: block;
    clear: both;
}

section .picture-index img {
    display: inline-block;
    margin: 3em 0 5em 4.5em;
}

section img.picture00 {
    -moz-transform: rotate(-8deg);
    /* Firefox 3.5-15 */
    -ms-transform: rotate(-8deg);
    /* IE 9 */
    -o-transform: rotate(-8deg);
    /* Opera 10.50-12.00 */
    -webkit-transform: rotate(-8deg);
    /* Chrome, Safari 3.1+ */
    transform: rotate(-8deg);
    /* Firefox 16+, IE 10+, Opera 12.50+ */
    filter: /* IE8 und IE9 */
    /* Schatten */
    progid: DXImageTransform.Microsoft.Shadow(Strength=11, Direction=135, Color='#394651')
    /* Rotieren */
    progid: DXImageTransform.Microsoft.Matrix( M11=.99, M12=.13917, M21=-.13917, M22=.99, sizingMethod='auto expand');
}

section img.picture01,
section img.picture02 {
    -moz-transform: rotate(8deg);
    /* Firefox 3.5-15 */
    -ms-transform: rotate(8deg);
    /* IE 9 */
    -o-transform: rotate(8deg);
    /* Opera 10.50-12.00 */
    -webkit-transform: rotate(8deg);
    /* Chrome, Safari 3.1+ */
    transform: rotate(8deg);
    /* Firefox 16+, IE 10+, Opera 12.50+ */
    filter: /* Schatten */
    progid: DXImageTransform.Microsoft.Shadow(Strength=11, Direction=135, Color='#394651')
    /* Rotieren */
    progid: DXImageTransform.Microsoft.Matrix( M11=.99, M12=-.13917, M21=.13917, M22=.99, sizingMethod='auto expand');
}

section img.picture02 {
    border-width: 7px;
    margin: 0 0 0 48em;
}

section img#person_lucky {
    border: 6px double black;
    box-shadow: 10px 8px 5px #888080;
    filter: progid: DXImageTransform.Microsoft.Shadow(Strength=13, Direction=135, Color='#394651');
    /*IE8 und IE9*/
    float: left;
    margin: 0em 2em 1em 0em;
}

section div.impressum {
    font-size: .85em;
    text-align: center;
}

section table {
    margin-left: 3em;
    table-layout: fixed;
    text-align: justify;
}

section table td {
    font-size: 1em;
    padding: 0 0 .5em 3em;
}

section table td a {
    font-style: italic;
    color: #e247bc;
}

section table td a:hover {
    text-decoration: underline;
    font-style: normal
}

section ul {
    list-style: none;
    margin: 1em 0 1em;
    padding-left: 13em;
    text-align: left;
}

section ul li {
    background-image: url(../images/pfote.gif);
    background-position: left center;
    background-repeat: no-repeat;
    padding: .2em 0 .2em 1.7em;
}

section ul#kommunikation li {
    background-image: url(../images/hufeisen.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding: .2em 0 .2em 1.5em;
}

section article ul {
    padding-left: 4em;
}

section article table {
    margin: 0.5em 0 0 0;
}

section article table td {
    padding: 0 1em 0.4em 0;
}

section .section-footer {
    font-weight: 600;
    margin: auto;
    width: 80%;
    text-align: center;
}


/*----------------------------- Article, Impressum ---------------------------*/

article {
    display: block;
    padding: 0em 2em;
    text-align: justify;
}

section article ul {
    padding-left: 2em;
}

article .seminar-rechts {
    width: 70%;
    margin-left: 22em;
    margin-top: 3em;
}

article.impressum,
article.datenschutz {
    font-size: .85em;
    line-height: 1.25em;
    margin-top: 1em;
}

article.datenschutz>h4 {
    font-weight: 500;
}

.no-indent li,
.rights li,
.glossary li {
    background: none;
    padding-left: 0;
    padding-right: 2em;
    text-align: justify;
}


/*--------------------------------- Newsflash --------------------------------*/

section.newsflash {
    border: none;
    padding: 0;
    margin-bottom: 2em;
}

.newsflash {
    font-size: 100%
}

.newsflash h2 {
    margin: 2em 0 1em;
    padding-bottom: 1em;
    background-color: #edaded;
}

.newsflash h3 {
    padding-bottom: 0.5em;
    margin: 1em 0 0em;
}

.newsflash img {
    background-color: #edaded;
    border: none;
    border-radius: 0px;
    width: 100%;
    box-shadow: none;
    margin: 0em 0em 1em;
}

.newsflash-aktuelles {
    min-height: 0px;
    margin-top: 1em;
}

.newsflash-presse {
    min-height: 0px;
}

.newsflash table,
.newsflash td {
    font-weight: 700;
    margin-left: 0;
    padding-left: 0;
    padding-right: 5em;
}

article a,
.newsflash a {
    color: #e247bc;
    font-style: italic;
}

article a:hover,
.newsflash a:hover {
    text-decoration: underline;
    font-style: normal
}

#audioplayer {
    width: 20%;
    height: 100px;
    margin: 2em;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: url(/images/audio.svg) no-repeat left center;
    background-color: rgba(0, 0, 0, 0.7);
}

#pButton {
    margin: 20% 70%;
    background-color: transparent;
}

.play {
    width: 0px;
    height: 0px;
    padding: 0px;
    border-style: solid;
    border-width: 18px 0px 18px 36px;
    border-color: transparent transparent transparent #35b19b;
}

.pause {
    width: 0px;
    height: 0px;
    padding: 0px;
    border-style: solid;
    border-width: 18px 18px 18px 18px;
    border-color: #35b19b;
}


/*------------------- Kontaktformular und Gästebuchformular ------------------*/

h2.error,
h2.normal {
    margin-top: -1em;
    padding: 0;
}

h2.error {
    color: red;
}

form {
    clear: both;
    margin: 2em auto 1em;
    text-align: center;
}

form .kopfzeile {
    text-align: left;
    margin: 4em 2em 5em 3em;
}

form p {
    width: 100%;
}

fieldset {
    border: none;
    padding: 0;
    margin: 0 auto;
    width: 56%;
}

#gbform fieldset {
    width: 90%;
    padding: 0 1em 0 .5em;
}

fieldset input,
textarea {
    border: 2px inset;
    border-color: #bfb1b1 #ebe7e7 #ebe7e7 #bfb1b1;
    font-family: inherit;
    font-size: 1em;
    padding: 1px;
}

fieldset label {
    float: left;
    text-align: left;
    width: 11em;
    margin: .3em 0;
}

#fname,
#femail,
#gbname,
#gbemail,
#gbhp {
    width: 68%;
    margin: .2em 0
}

fieldset textarea {
    height: 12em;
    overflow: auto;
    margin: .5em 0 .5em;
    resize: none;
    width: 99%;
}

.fsum {
    font-weight: bold;
    width: 2em;
}

fieldset p.remark {
    /* Hinweis in Klammern) */
    font-size: small;
}

.lte9 #fsubmit,
.lte9 #fcancel {
    font-weight: 700;
}

#fsubmit,
#fcancel {
    margin: 1.5em 1em .7em;
    padding: .4em .5em .5em;
    border-top: .1em solid #dff0e6;
    border-right: none;
    border-bottom: none;
    border-left: .1em solid #dff0e6;
    -webkit-border-radius: .4em;
    -moz-border-radius: .4em;
    border-radius: .4em;
    background: #495932;
    background: -webkit-gradient(linear, left top, left bottom, from(#81a841), to(#495932));
    background: -webkit-linear-gradient(top, #81a841, #495932);
    background: -moz-linear-gradient(top, #81a841, #495932);
    background: -ms-linear-gradient(top, #81a841, #495932);
    background: -o-linear-gradient(top, #81a841, #495932);
    filter: /*IE( und IE9 */
    progid: DXImageTransform.Microsoft.gradient(startColorstr='#81a841', endColorstr='#495932', gradientType='0') progid: DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#495932');
    -webkit-box-shadow: 1px 0px 2px 1px #495932;
    -moz-box-shadow: 1px 0px 2px 1px #495932;
    box-shadow: 1px 0px 2px 1px #495932;
    text-shadow: rgba(0, 0, 0, .4) 0 1px 0;
    color: white;
    vertical-align: middle;
}

#fsubmit:hover,
#fsubmit:active,
#fsubmit:focus,
#fcancel:hover,
#fcancel_active,
#fcancel:focus {
    border-top: .1em solid #dfc9d4;
    border-left: .1em solid #dfc9d4;
    background: #8b3381;
    background: -webkit-gradient(linear, left top, left bottom, from(#ef84e2), to(#8b3381));
    background: -webkit-linear-gradient(top, #ef84e2, #8b3381);
    background: -moz-linear-gradient(top, #ef84e2, #8b3381);
    background: -ms-linear-gradient(top, #ef84e2, #8b3381);
    background: -o-linear-gradient(top, #ef84e2, #8b3381);
    filter: /*IE8 und IE9*/
    progid: DXImageTransform.Microsoft.gradient(startColorstr='#ef84e2', endColorstr='#8b3381', gradientType='0') progid: DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#8b3381');
    -webkit-box-shadow: 1px 0px 2px 1px #8b3381;
    -moz-box-shadow: 1px 0px 2px 1px #8b3381;
    box-shadow: 1px 0px 2px 1px #8b3381;
    cursor: pointer;
}


/*------------------------------------ Tabelle -------------------------------*/

table {
    border-collapse: collapse;
    border-spacing: 0;
}

table caption {
    display: none;
}

th {
    font-size: 1em;
    font-style: normal;
    font-weight: 400;
    text-align: left;
}


/*----------------------- Direct Email and business card----------------------*/

#direct-email {
    text-align: center;
}

.vcard a,
#direct-email a {
    color: #e144b9;
    font-style: italic;
    text-align: center;
}

.vcard a:hover,
#direct-email a:hover {
    text-decoration: underline;
    font-style: normal
}

.vcard .content {
    float: left;
    padding-top: 3.5em;
}

.vcard .content p {
    margin: 0 1em 1.5em 0;
}


/*----------------------------------- Footer ---------------------------------*/

footer {
    text-align: center;
    margin: 0 3px;
    padding: .6em 0;
    width: inherit;
}

#final {
    margin-top: .6em;
    height: 1.2em;
}

#final p {
    color: #fff;
    display: inline;
    font-size: small;
}

#final a {
    color: #fff;
    font-size: small;
}

#final a:hover {
    color: #e97ece;
    text-decoration: underline;
}


/*--------------------------- Wrapper Gästebuchanzeige -----------------------*/

.guestbook {
    display: inline-block;
    margin: -7em 2em 0 3em;
    width: 41em;
    height: 50em;
    border: 8px ridge #7a5e26;
    background-image: url(../images/papier_bg.jpg);
}


/*---------------------------- Anzeige der Posts -----------------------------*/

.post-wrap {
    padding-top: 1.2em;
}

.post {
    /* Einzelner Eintrag */
    margin: 2em auto;
    width: 33em;
}

.titel {
    font-size: .9em;
    font-weight: 600;
}

.post p {
    overflow-y: scroll;
    -ms-overflow-y: auto;
    /* IE8 und IE9 */
    padding-top: .5em;
    height: 7em;
    border-top: 1px solid #362e10;
    border-right: 2px solid white;
    border-bottom: 2px solid white;
}

.post .kommentar {
    color: green;
}


/* ----------------------------- Linkbutton Menue --------------------------- */

aside {
    display: inline-block;
    width: 16em;
}

aside #navigation {
    margin: 0 auto;
    text-align: center;
    height: 29em;
    width: 10em;
}


/* Schriftstärke für IE 8 anpassen */

.lte9 aside a,
.lte9 aside .lb_disabled {
    font-weight: 700;
}

aside a {
    display: block;
    margin: .8em auto;
    width: 3em;
    border-top: .1em solid #dff0e6;
    border-left: .1em solid #dff0e6;
    background: #495932;
    background: -webkit-gradient(linear, left top, left bottom, from(#81a841), to(#495932));
    background: -webkit-linear-gradient(top, #81a841, #495932);
    background: -moz-linear-gradient(top, #81a841, #495932);
    background: -ms-linear-gradient(top, #81a841, #495932);
    background: -o-linear-gradient(top, #81a841, #495932);
    filter: /*IE( und IE9 */
    progid: DXImageTransform.Microsoft.gradient(startColorstr='#81a841', endColorstr='#495932', gradientType='0') progid: DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#495932');
    padding: .5em .5em;
    -webkit-border-radius: .4em;
    -moz-border-radius: .4em;
    border-radius: .4em;
    -webkit-box-shadow: 1px 0px 2px 1px #495932;
    -moz-box-shadow: 1px 0px 2px 1px #495932;
    box-shadow: 1px 0px 2px 1px #495932;
    text-shadow: rgba(0, 0, 0, .4) 0 1px 0;
    color: #f4f4f4;
}

aside a:hover,
aside a:active {
    border-top: .1em solid #dfc9d4;
    border-left: .1em solid #dfc9d4;
    background: #8b3381;
    background: -webkit-gradient(linear, left top, left bottom, from(#ef84e2), to(#8b3381));
    background: -webkit-linear-gradient(top, #ef84e2, #8b3381);
    background: -moz-linear-gradient(top, #ef84e2, #8b3381);
    background: -ms-linear-gradient(top, #ef84e2, #8b3381);
    background: -o-linear-gradient(top, #ef84e2, #8b3381);
    filter: /*IE8 und IE9*/
    progid: DXImageTransform.Microsoft.gradient(startColorstr='#ef84e2', endColorstr='#8b3381', gradientType='0') progid: DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#8b3381');
    -webkit-box-shadow: 1px 0px 2px 1px #8b3381;
    -moz-box-shadow: 1px 0px 2px 1px #8b3381;
    box-shadow: 1px 0px 2px 1px #8b3381;
    text-shadow: rgba(0, 0, 0, .4) 0 1px 0;
    color: #f4f4f4;
}

aside .lb_disabled {
    margin: .8em auto;
    padding: .5em .5em;
    width: 3em;
    border-top: .1em solid #ccddb3;
    border-radius: .4em;
    background-color: rgba(0, 0, 0, .1);
    border-color: rgba(0, 0, 0, .1);
    color: rgba(0, 0, 0, .3);
    filter: /* IE8 und IE9 */
    progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#c5c5c5', endColorstr='#c5c5c5') alpha(opacity=30);
}

aside .bigbutton {
    width: 4.5em;
}

aside .current {
    font-weight: 900;
    margin: .8em auto;
    width: 3em;
}

.eintragen {
    text-align: center;
    position: relative;
    top: 4em;
    width: 10em;
}