/* CSS Document by toberg - edv plan GmbH */
/* Themen CSS aus style.css */
/* *****************
Hintergrund Standard weiss
*********************/
.section-state0{
padding-top:4%;
padding-bottom:4%;
color:#333;
}
.section-state0 h0, .section-state0 h1 {
}
.section-state0 h2 a,
.section-state0 h3 a{
}
.section-state0 h3,
.section-state0 h4 { 
}
.section-state0 .frame.frame-textbutton a,
.section-state0 p a.frame-textbutton,
.section-state0 .powermail_fieldwrap_type_submit input.btn-primary,
.section-state0 .frame-infoboxweiss .frame.frame-textbutton a,
.section-state0 .frame-infoboxweiss p a.frame-textbutton,
.section-state0 .frame-infoboxweiss .powermail_fieldwrap_type_submit input.btn-primary  {
position:relative;
color:#fff !important;
border-color:#d33122 !important;
 background-color:#d33122;
}
.section-state0 .frame.frame-konturbutton a,
.section-state0 p a.frame-konturbutton,
.section-state0 .frame-infoboxweiss .frame.frame-konturbutton a,
.section-state0 .frame-infoboxweiss p a.frame-konturbutton {
color:#d33122 !important;
border-color:#d33122 !important;
 background-color:transparent;
}
.section-state0 .frame.frame-textbutton a:hover,
.section-state0 .frame.frame-textbutton a:active,
.section-state0 p a.frame-textbutton:hover,
.section-state0 p a.frame-textbutton:active,
.section-state0 .powermail_fieldwrap_type_submit input.btn-primary:hover,
.section-state0 .frame-infoboxweiss .frame.frame-textbutton a:hover,
.section-state0 .frame-infoboxweiss .frame.frame-textbutton a:active,
.section-state0 .frame-infoboxweiss p a.frame-textbutton:hover,
.section-state0 .frame-infoboxweiss p a.frame-textbutton:active,
.section-state0 .frame-infoboxweiss .powermail_fieldwrap_type_submit input.btn-primary:hover{
color:#fff !important;
border-color:#eec400 !important;
 background-color:#eec400 !important;
}
.section-state0 .frame-konturbutton a:hover,
.section-state0 .frame-konturbutton a:active,
.section-state0 p a.frame-konturbutton:hover,
.section-state0 p a.frame-konturbutton:active,
.section-state0 .frame-infoboxweiss .frame-konturbutton a:hover,
.section-state0 .frame-infoboxweiss .frame-konturbutton a:active,
.section-state0 .frame-infoboxweiss p a.frame-konturbutton:hover,
.section-state0 .frame-infoboxweiss p a.frame-konturbutton:active {
color:#848EB6 !important;
border-color:#848EB6 !important;
 background-color:transparent;
}
 .section-state0 .frame-ruler-after,
.section-state0 .frame-ruler-before {
border-color:#d33122;
  }  

/* TEXTLINK */
.section-state0 a {
font-weight:bold;
text-decoration: underline;
}
.section-state0 a:hover,
.section-state0 a:active{
font-weight:bold;
text-decoration: none;
}
/* Auswahl Hintergrundfarben */
.frame-containergelb {
float:left;
clear:left;
width:2600px !important;
padding:4em 0px 4em 0px;
color:#333 !important;
background: #EEE11F;
background: linear-gradient(to left, #EEE11F 0%, #FFF388 100%);
left: 50% !important;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
}
.frame-containergelb .spaltencontainer {
position:relative;
max-width:1200px;
width:100%;
float:left;
left: 50% !important;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
}
/* bildschirme kleiner als 1200px */
@media screen and (max-width: 1200px) {
  .frame-containergelb {
width:calc(100%) !important;
left: 0% !important;
-webkit-transform: translateX(-0%) !important;
-ms-transform: translateX(-0%) !important;
transform: translateX(-0%) !important;
}  
  .frame-containergelb .spaltencontainer{
width:calc(100%) !important;
}
}
.frame-containergelb h5:before{
color:#BB1A22;
}
.frame-containergelb .frame-containergelb a {
color:#fff;
}
.frame-containergelb .frame-containergelb a:hover {
color:#6D9983!important;
}
.frame-containergelb p a.frame-konturbutton,
.frame-containergelb .frame.frame-konturbutton a {
color:#fff;
border-color:#fff !important;
 background-color:transparent;
}
.frame-containergelb p a.frame-konturbutton:hover,
.frame-containergelb .frame.frame-konturbutton a:hover {
color:#72A5C0;

border-color:#72A5C0;
 background-color:#fff !important;
}
.frame-containergelb p a.frame-textbutton,
.frame-containergelb frame.frame-textbutton a {
color:#fff;
border-color:#6D9983 !important;
 background-color:#6D9983;
}
.frame-containergelb p a.frame-textbutton:hover,
.frame-containergelb .frame.frame-textbutton a:hover {
color:#eec400 !important;
border-color:#72A5C0;
 background-color:#fff !important;
}
.frame-containerrot {
float:left;
clear:left;
width:2600px !important;
padding:4em 0px 4em 0px;
color:#fff !important;
background: #BB1A22;
background: linear-gradient(to left, #BB1A22 0%, #D33122 100%);
left: 50% !important;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
}
.frame-containerrot .spaltencontainer {
position:relative;
max-width:1200px;
float:left;
left: 50% !important;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
}
/* bildschirme kleiner als 1200px */
@media screen and (max-width: 1200px) {
  .frame-containerrot {
width:calc(100%) !important;
left: 0% !important;
-webkit-transform: translateX(-0%) !important;
-ms-transform: translateX(-0%) !important;
transform: translateX(-0%) !important;
}  
  .frame-containerrot .spaltencontainer{
width:calc(100%) !important;
}
}
.frame-containerrot h5:before{
color:#fff;
}
.frame-containerrot .frame-containerrot a {
color:#fff;
}
.frame-containerrot .frame-containerrot a:hover {
color:#6D9983 !important;
text-decoration:underline;
}
.frame-containerrot p a.frame-konturbutton,
.frame-containerrot .frame.frame-konturbutton a {
color:#fff;
border-color:#fff !important;
 background-color:transparent;
}
.frame-containerrot p a.frame-konturbutton:hover,
.frame-containerrot .frame.frame-konturbutton a:hover {
color:#d33122;
border-color:#fff;
 background-color:#fff !important;
}
.frame-containerrot p a.frame-textbutton,
.frame-containerrot .frame.frame-textbutton a {
color:#d33122;
border-color:#fff !important;
 background-color:#fff;
}
.frame-containerrot p a.frame-textbutton:hover,
.frame-containerrot .frame.frame-textbutton a:hover {
color:#fff;
border-color:#fff;
 background-color:transparent !important;
}
.frame-bildbanner {
position:relative;
width:2600px !important;
width:100%;
float:left;
margin-top:0px;
color:#fff;
font-size:1em;
float:left;
left: 50%;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
}
/* bildschirme kleiner als 1920px */
@media screen and (max-width: 1920px) {
  .frame-bildbanner {
width:1920px !important;
}
}
@media screen and (max-width: 1200px) {
  .frame-bildbanner {
width:calc(100% + 100px) !important;
}
}
.frame-bildbanner .ce-gallery,
.frame-bildbanner .ce-gallery .ce-column,
.frame-bildbanner .ce-gallery .ce-row,
.frame-bildbanner .ce-gallery .ce-inner,
.frame-bildbanner .ce-gallery .ce-outer,
.frame-bildbanner .ce-gallery figure,
.frame-bildbanner .ce-gallery figure img{
width:100% !important;
height:auto;
border-radius:0px;
}
.frame-bildbanner .ce-textpic .ce-bodytext {
position:absolute;
width:440px;
padding:30px;
bottom:10vh;
color:#333;
background-color:#fff;
border-radius: 10px;
left: calc(50% - 350px);
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
}
.frame-bildbanner .ce-textpic .ce-bodytext h0,
.frame-bildbanner .ce-textpic .ce-bodytext h1 {
font-size:2em;
}
/* Breite des Inhalts - 0 = 80% */
@media screen {
.frame-layout-1,
.frame-layout-1-content .contentcolumn {
position:relative;
float:left;
left: 50%;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
max-width:80%;
}
}
@media screen and (min-width: 1000px) {
.frame-layout-1,
.frame-layout-1-content .contentcolumn {
width:90% !important;
}
}
@media screen {
/* Breite des Inhalts max 50% */
.frame-layout-2,
.frame-layout-2-content .contentcolumn {
position:relative;
float:left;
left: 50%;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
max-width:50%;
}
}
@media screen and (min-width: 1000px) {
.frame-layout-2,
.frame-layout-2-content .contentcolumn {
width:41% !important;
}
}
@media screen {
/* Breite des Inhalts max 50% */
.frame-layout-3,
.frame-layout-3-content .contentcolumn {
position:relative;
float:left;
left: 49%;
-webkit-transform: translateX(-50%) !important;
-ms-transform: translateX(-50%) !important;
transform: translateX(-50%) !important;
max-width:50%;
}
}
@media screen and (min-width: 1000px) {
.frame-layout-3,
.frame-layout-3-content .contentcolumn {
width:24% !important;
}
}.frame-layout-6 {
position:relative;
float:left;
width:100%;
margin-top: -7em;
z-index:2;
}
.frame-layout-7 {
position:relative;
float:left;
width:100%;
margin-bottom: -7em;
z-index:2;
}
/***************
eigene Erscheinungsbilder 
****************/
/* Rundes Bild ohne Ecken*/
.frame-bildrund .ce-gallery figure img{
border-radius:0px;
}
.frame-bildrund .ce-gallery figure {
border-radius:0px;
}
/* Infoboxen 3 Farben */
.frame-infoboxgrau,
.frame-infoboxweiss {
 position:relative;
float:left;   
width:calc(100% - 50px) !important;
padding:25px 25px 20px 25px;
border-radius: 10px;
}
.frame-infoboxschatten {
 position:relative;
float:left; 
width:calc(100% - 62px);
margin:16px 16px 16px 16px;
border-radius:10px;
background-color:#fff;
color:#333;
padding:0px 15px 0px 15px;
box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.20);
}
.frame-infoboxschatten .ce-textpic.ce-center.ce-above{
width:calc(100% + 30px);
margin-left:-15px;
}
.frame-infoboxschatten .ce-textpic.ce-center.ce-above .ce-bodytext{
width:calc(100% - 30px);
margin-left:15px;
}
.frame-infoboxschatten a {
color:#694c49 !important;
font-weight:normal;
text-decoration:underline !important;
}
/* Infobox Schatten in Spaltencontainer */
.frame-containerflexbox .column .frame-infoboxschatten {
 position:relative;
z-index:1;
flex: 1;
float:left; 
border-radius:10px;
background-color:#fff;
color:#333;
padding:0px 15px 0px 15px;
box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.0);
}
.frame-containerflexbox .column .frame-infoboxschatten:before {
position:absolute;
z-index:0;
content:' ';
display:block;
left:0px;
right:0px;
top:0px;
bottom:0px;
border-radius:10px;
box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.20);
}
.frame-infoboxgrau {
background-color:#ddd;
color:#333;
}
.frame-infoboxgrau a {
color:#333 !important;
text-decoration:underline !important;
}
.frame-infoboxweiss {
background-color:#fff;
color:#333;
}
.frame-infoboxweiss a {
color:#333 !important;
text-decoration:underline !important;
}
/* Bild mit Textoverlay */
.frame-textoverlay {
 position:relative;
float:left;   
width:100%;
}
.frame-textoverlay .ce-gallery,
.frame-textoverlay .ce-gallery .ce-column,
.frame-textoverlay .ce-gallery .ce-row,
.frame-textoverlay.ce-gallery .ce-inner,
.frame-textoverlay.ce-gallery .ce-outer,
.frame-textoverlay .ce-gallery figure,
.frame-textoverlay .ce-gallery figure img{
margin:0px;
padding:0px;
}
.frame-textoverlay .ce-bodytext {
position:absolute;
width:55%;
padding:20px;
bottom:6vh;
left:4vh;
color:#333;
background-color:#fff;
border-radius: 10px;
}
.frame-textoverlay .ce-bodytext h0,
.frame-textoverlay .ce-bodytext h1,
.frame-textoverlay .ce-bodytext h2 {
font-family: 'Bahn', sans;
font-size:1.5em;
}
/***********
Accordion 
*************/
ul.tinyaccordion {
width:100%;
margin:0px !important;
padding:0px !important;
}

ul.tinyaccordion h4 {
background-image:none !important;
padding:6px 6px 6px 30px !important;
color:#000;
font-weight:normal;
text-transform:uppercase;
font-size:0.9em;
background-color: #9CCA5B;
border:3px solid #fff;
}
ul.tinyaccordion h4 .t-small {
display:none;
}
ul.tinyaccordion h4:hover,
ul.tinyaccordion h4.acc-selected {
text-decoration:none;
color:#fff;
background-color: #072242 !important;
}
ul.tinyaccordion .acc-section{
width:calc(100% - 6px);
padding-left:3px;
padding-right:3px;
}
.acc-section header h1 {
font-weight:normal;
margin-top:2%;
 margin-bottom: 0.5em;
font-size:1.2em;
line-height:1.1em;
text-transform:uppercase;
}
ul.tinyaccordion h4:after {
content: '►';
float:right;
}
ul.tinyaccordion h4:hover:after {
content: '►';
float:right;
transform: rotate(90deg);
}
ul.tinyaccordion h4.acc-selected:after {
content: '►';
float:right;
transform: rotate(-90deg);
}