/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
modified by Ulrich Schwebinghaus
*/

{ margin: 0; padding: 0; } 
body { margin: 10px 0; background: #FFFFFF; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; color: #333; } 
h1, h2, h3 { font-weight: normal; color: #3B3B3B; } 
h1 { font-size: 182%; } 
h2 { font-size: 122%; } 
h3 { font-size: 100%; } 
p, ul, ol { margin-bottom: 20px; line-height: 167%; font-size: 90%; } 
a:link { color: #3333BB; } 
a:hover { text-decoration: none; color: #ED2024; } 
a:visited { color: #3B3BBB } 

#header { width: 850px; height: 80px; margin: 0 auto; } 

#logo { float: left; width: 210px; } 
#logo h1 { padding: 20px 0 0 0; text-align: center; margin: 0} 
#logo h1 a { font-weight: normal; font-size: 24px; color: #3B3B3B; } 
#logo h2 { text-align: center; text-transform: uppercase; font-size: 10px; } 
#logo h2 a { color: #B3A7A0; } #logo a { text-decoration: none; } 

#menu { float: left; width: 635px; } 
#menu ul { margin: 0; padding: 0; list-style: none; } 
#menu li { display: inline; } 
#menu a { display: block; float: left; height: 50px; padding: 30px 25px 0 25px; background: url(images/img1.gif) no-repeat; text-decoration: none; font-size: 114%; color: #3B3B3B; } 
#menu a:hover { color: #ED2024; } 
#actual a { color: #ED2024; } 

#splash { width: 800px; height: 130px; margin: 0 auto; background: url(images/start.png) no-repeat; overflow: none } 
#plogo { width: 800px; height: 130px; margin: 0 auto; background: url(images/porto.png) no-repeat; overflow: none } 
#ilogo { width: 800px; height: 130px; margin: 0 auto; background: url(images/about.png) no-repeat; overflow: none } 
#stlogo { width: 800px; height: 130px; margin: 0 auto; background: url(images/steine.png) no-repeat; overflow: none } 
#slogo { width: 800px; height: 130px; margin: 0 auto; background: url(images/news.png) no-repeat; overflow: none } 
#qlogo { width: 800px; height: 130px; margin: 0 auto; background: url(images/quilt.png) no-repeat; overflow: none } 
#flogo { width: 800px; height: 130px; margin: 0 auto; background: url(images/fashion.png) no-repeat; overflow: none } 
#domain { width: 800px; height: 20px; margin: 0 auto; text-align: left; padding-left: 10px; margin-top: -10px }
#domain a { text-decoration: none; font-weight: bold; color: #3B3B3B; }
#domain a:visited { color: #3B3B3B;}
#page { width: 800px; margin: 0 auto; } 
#page h1, 
#page h2 { margin-bottom: 20px; } 
#content h2, #w_content h2 { border-left: 5px solid #999; padding-left:5px; }
#content h2.wall-title, #w_content h2.wall-title { border-left: 5px solid #e00 !important; }
#content, #w_content { float: left; width: 530px; padding: 0px 0px 10px 20px; margin-top: 0px } 
#w_content { width:750px } #content h2, #w_content h2 { margin-bottom:8px; } 
#content ol, #content ul, #w_content ol, #w_content ul { margin-left: 3em; } 

#sidebar { float: left; width: 200px; padding-left: 30px; margin-top: 0px } 
#sidebar h2 { padding-top: 6px; font-weight: bold; } 
#sidebar ul { margin: 0; padding: 0; list-style: none; } 
#sidebar li { margin: 0 0 5px 0; padding: 0 0 5px 0; border-bottom: 1px dashed #CCCCCC; } 
#sidebar h3 { height: 20px; padding: 0px 10px 0px 3px; background: #888; color: #FFFFFF; margin: 0 } 
#sidebar h3 a:link { text-decoration: none; color: white; } 
#sidebar h3 a:visited { text-decoration: none; color: white; } 
#sidebar h3 a:hover { text-decoration: none; color: #CCCCCC; } 

#footer { clear: both; width: 770px; height: 50px; margin: 10px auto; padding-top: 5px; border-top: 5px solid #3B3B3B; } 
#footer p { margin: 0 10px; padding: 0; line-height: normal; font-size: 77%; } 
#legal { float: right; } 
#links { float: right; } 
.block { text-align: justify; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } 
.center { text-align: center; margin: auto; } 
p.imgtitle, p.imgtoptitle, p.imgbottomtitle { text-align:center; font-family:Tahoma, Verdana, sans-serif; } 
p.imgtitle { margin:2px; padding:0px; }

.accordion {
    width: 100%;
    max-width: 800px;
    margin: 2px auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
}

/* Header-Stile */
.accordion-header {
    display: flex;
    align-items: center;
    background-color: #f5f5f5;
    cursor: pointer;
    padding: 4px 8px;
    margin: 0;
}

.accordion-title {
    margin: 0;
    padding: 0;
    flex-grow: 1;
}

/* Gemeinsame Pfeilstile */
.accordion-arrow {
    font-size: 14px;
    padding:5px;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

/* Standard-Pfeilrichtung */
.accordion-header .accordion-arrow {
    transform: rotate(0deg); /* ▼ */
}

/* Content-Bereich */
.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    padding: 0 12px;
    background-color: white;
}

/* Footer-Stile */
.accordion-footer {
    display: none;
    justify-content: flex-start;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    cursor: pointer;
    padding: 4px 8px;
}

/* Aktiver Zustand */
.accordion.active .accordion-header .accordion-arrow {
    transform: rotate(180deg); /* ▲ */
}

.accordion.active .accordion-content {
    max-height: 3000px;
    padding: 12px;
}

.accordion.active .accordion-footer {
    display: flex;
}

.accordion.active .accordion-footer .accordion-arrow {
    transform: rotate(0deg); /* ▼ */
}

.email { 
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  -webkit-user-select: text;
  user-select: text;
}

.email .at {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  font-family: inherit;
  font-size: inherit;
  line-height: inherit;

  display: inline;     
  margin: 0;           
  padding: 0;          
  letter-spacing: 0;  
}