/* ---- RESET - Resets default browser CSS.  --------------- */

html {
  margin:0;
  padding:0;
  border:0;
  scroll-behavior: smooth;
}

body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, nav, section {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
article, aside, details, figcaption, figure, dialog,
footer, header, hgroup, menu, nav, section {
    display:block;
}
body {
  line-height: 1.5;
  background: white;
}
table {
  border-collapse: separate;
  border-spacing: 0;
}
caption, th, td {
  text-align: left;
  font-weight: normal;
  float:none !important;
}
table, th, td {
  vertical-align: middle;
}
blockquote:before, blockquote:after, q:before, q:after { content: ''; }
blockquote, q { quotes: "" ""; }
a img { border: none; }
:focus { outline: 0; }

/* END Reset */




/* ----------   ///// WHIZZZ /////  ---------------- */




/* ///// LOGO ///// */

/*
.logo {
    max-width: 300px;
    width: 30%;
    float: left;
}

.logo img {
    width: 100%;
}

#logo {
    position: relative;
    display: block;
    float: left;
    max-width: 420px;
    z-index: 999;
    transition: all ease .5s;
}

#logo img {
    width: 100%;
}
*/


.logo-responsive {
    display: none;
}

#logo {
    position: absolute;
    display: block;
    float: left;
    z-index: 10000;
    transition: all ease .5s;
    background: #f8e800;
    padding: 30px 15px 30px 50px;
    height: 66px;
}

#header-fadein #logo {
    padding: 18px 15px 12px 50px;
    height: 40px;
}

#logo img {
    width: 291px;
	transition: all ease .5s;
    margin: -1px;
}

#logo:before {
    content: "";
    position: absolute;
    top: 0;
    right: -79px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 127px 80px 0 0;
    border-color: #f8e700 transparent transparent transparent;
    transition: all ease .5s;
}

#header-fadein #logo:before {
    right: -45px;
    border-width: 70px 45px 0 0;
}


@media all and (-ms-high-contrast:none), all and (-ms-high-contrast:active) {


#logo img {
    width: inherit;
}

}



#logo p {
    margin: 0;
}







/* ///// SWITCHER ZUR SCHULE ///// */

#switcher {
    position: absolute;
	left: 220px;
	top: 0;
    width: 420px;
	padding: 0 0 0 0;
    height: 40px;
    z-index: 12;
background: rgba(0,123,224,1);
background: -moz-linear-gradient(left, rgba(0,123,224,1) 0%, rgba(0,187,255,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,123,224,1)), color-stop(100%, rgba(0,187,255,1)));
background: -webkit-linear-gradient(left, rgba(0,123,224,1) 0%, rgba(0,187,255,1) 100%);
background: -o-linear-gradient(left, rgba(0,123,224,1) 0%, rgba(0,187,255,1) 100%);
background: -ms-linear-gradient(left, rgba(0,123,224,1) 0%, rgba(0,187,255,1) 100%);
background: linear-gradient(to right, rgba(0,123,224,1) 0%, rgba(0,187,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007be0', endColorstr='#00bbff', GradientType=1 );
}

#switcher a {
    position: absolute;
    top: 50%;
    left: 0;
    width: calc(100% - 8px);
    height: auto;
    text-decoration: none;
    color: #fff;
    transform: translate(0,-50%);
    cursor: pointer;
    font-family: "saira";
}

#switcher p {
    color: #000;
    text-align: right;
    text-transform: uppercase;
    font-size: 13px;
}

#switcher:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    top: 0;
    right: -27px;
    border-style: solid;
    border-width: 40px 27px 0 0px;
    border-color: #00bbff transparent transparent transparent;
    z-index: 1;
}

#header #switcher {
    margin: 0 0 0 0;
}

#footer #switcher {
    margin: -40px 0 0 -200px;
    left: 0;
}

#footer #switcher:before {
    right: -27px;
    border-style: solid;
    border-width: 40px 7px 0px 20px;
    border-color: transparent transparent transparent #00bbff;
}





/* ///// SUCHE ///// */

#suche {
    background: #000;
    height: 40px;
    display: block;
    float: right;
    width: 100%;
	transition: all ease .5s;
    z-index: 9999;
}

#suche-responsive form.form-inline {
    visibility: visible;
}

#suche-responsive input[type="search" i] {
    width: calc(100% - 55px);
}

form.form-inline {
    position: relative;
    display: block;
    visibility: hidden;
}

form.form-inline.aktiv {
    visibility: visible;
	position: absolute;
    right: 53px;
    top: 5px;
}

#header-fadein form.form-inline.aktiv {
	top: 0px;
}

#suche-icon {
    position: relative;
    background-image: url(../images/suche-weiss.svg);
    width: 18px;
    height: 18px;
    float: right;
    background-size: contain;
    margin-right: 20px;
	margin-top: 10px;
	transition: all ease 0.5s;
}

#suche-icon.aktiv {
	background-image: url(../images/search-close.svg);
	-webkit-animation: flip-horizontal-top 0.3s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
	        animation: flip-horizontal-top 0.3s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
	width: 30px;
    height: 30px;
    top: -5px;
    right: 0px;
}

#header-fadein #suche-icon {
    top: 15px;
}

#header-fadein #suche-icon.aktiv {
	background-image: url(../images/search-close.svg);
	-webkit-animation: flip-horizontal-top 0.3s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
	        animation: flip-horizontal-top 0.3s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
	top: 60px;
	right: 0;
}

button.button.btn.btn-primary {
    background: #838383;
    color: #fff;
    border: solid 0px;
    height: 30px;
    margin: 0;
    padding: 0 7px;
}

input[type="search" i] {
    background: #ededed;
    border: solid 0px;
	padding: 2px 10px;
    height: 30px;
    width: 200px;
}

/* ///// FACEBOOK ///// */
#facebook {
    position: absolute;
    display: block;
    right: 50px;
    z-index: 0;
    float: left;
}


#facebook img {
    height: 20px;
}

/* ///// FACEBOOK ///// */
#instagram {
    position: absolute;
    display: block;
    right: 90px;
    z-index: 0;
    float: left;
}


#instagram img {
    height: 20px;
}


/* ///// NAVIGATION ///// */

#navigation {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    float: right;
    width: 100%;
    right: 0;
    height: 86px;
    background: rgba(0,0,0,0.6);
    z-index: 1;
}

#navigation-unterseiten {
    position: relative;
    display: block;
    top: 0;
    left: 0;
    float: right;
    width: 73%;
    padding-left: 27%;
    height: 86px;
    background: rgba(0,0,0,0.8);
    z-index: 1;
}

#header-fadein #navigation-unterseiten {
	height: 70px;
}


/* ///// INFOBUTTON ///// */

#infobutton, #infobutton-fadein {
    position: absolute;
    display: block;
    float: left;
    width: 200px;
    right: -250px;
    left: auto;
    top: 36%;
    background: #a78159;
    color: #fff;
    padding: 12px 25px 12px 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    z-index: 100005;
}

#infobutton-fadein {
    top: 16%;
}

#infobutton:before, #infobutton-fadein:before {
    content: "";
    position: absolute;
    width: 40px;
    height: 40px;
    background-image: url(../images/info-icon.svg);
    background-size: cover;
    left: -40px;
    top: 0;
}

#infobutton.aktiv, #infobutton-fadein.aktiv {
    right: 0;
}

#infobutton.aktiv:before, #infobutton-fadein.aktiv:before {
    background-image: url(../images/closeX.svg);
}

#infobutton a {
    font-size: 14px;
    color: #fff;
    text-transform: none;
}

#infobutton span {
    font-size: 1.4em;
}


/* ///// SLIDER ///// */

#slider {
    position: relative;
    display: block;
	float: left;
    width: 100%;
}

#slider .introtext {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    z-index: 2;
    width: 30%;
}


/* ///// TOP POSITION ///// */

#top-position {
    position: relative;
    display: block;
    width: 100%;
	float: left;
}


/* ///// STARTSEITE NEUIGKEITEN TERMINKALENDER ///// */

#startseite {
    position: relative;
    display: block;
	float: left;
    width: 90%;
    padding: 5% 5% 0 5%;
}



#terminkalenderuebersicht {
   	display: block;
	float: left;
    width: 90%;
    padding: 2% 5% 2% 5%;
    background: #fafafa;
	margin-top: 4%;
	font-size: 15px;
	font-weight: 300;
    line-height: 1.5;
}

#monatssicht {
	position: relative;
	display: block;
	float: left;
	width: 49%;
	padding-left: 1%;
}


#neuigkeiten {
	position: relative;
	display: block;
	float: left;
	width: 100%;
}

#neuigkeiten .newsflash {
    flex-wrap: nowrap;
}

#neuigkeiten h3 {
    text-align: center;
    margin-bottom: 50px;
}

#neuigkeiten p {
    display: inline;
    font-family: inherit;

}


#neuigkeiten h4.newsflash-title {
    min-height: 54px;
}





/* ///// NEWS 2021 ////// */

#news {
    position: relative;
    display: block;
    float: right;
    width: 59%;
    padding: 5% 8% 20%;
}

#news .newscontent:nth-child(1) {
    flex: 0 100%;
}

#news .newsflash {
    justify-content: flex-start;
}

#news .beitrag {
    position: relative;
    overflow: hidden;
}

#news h2.newsflash-title {
    width: calc(100% - 6em);
    margin-left: 1em;
    margin-bottom: 1em;
    float: left;
    padding-right: 5em;
    line-height: 1.2;
    hyphens: auto;
}

#news .introtext, #news .introtext-zeichenlimit {
    position: relative;
    display: block;
    width: calc(100% - 4em);
    margin-left: 2em;
    margin-right: 2em;
    float: left;
}

#news #beitrag p {
    display: inline;
}


#neuigkeiten a.button {
    position: relative;
    border: solid 1px #f7e903;
    color: #3c3d42;
    background-color: #f7e903;
    padding: 5px 14px 5px 14px;
    margin: 5px 15px 5px 0;
    transition: all ease .5s;
    display: table;
    font-weight: bold;
    font-size: 1rem;
    letter-spacing: 0;
    line-height: 1;
    float: none;
    text-decoration: none;
}


#neuigkeiten .col-2.beitrag {
    padding: 0 2% 0 0;
    margin: 0 1% 0 0;
}


a.button.neuigkeitenunterseite {
    position: relative;
    border: solid 1px #f7e903;
    color: #3c3d42;
    background-color: #f7e903;
    padding: 5px 40px 5px 14px;
    margin: 5px 15px 5px 0;
    transition: all ease .5s;
    display: table;
    font-weight: bold;
    font-size: 1rem;
    letter-spacing: 0;
    line-height: 1;
    float: none;
    text-decoration: none;
}

.newsflash dd.field-entry.feldgallery {
    display: none;
}


/* ///// PFARREI ////// */

.gottesdienst-section td {
    vertical-align: top;
    padding-right: 14px;
}

.gottesdienst-section td p:first-child {
    margin-top: 0;
}

.familiengottesdienst-section {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 2rem;
}

.download-section.pfarrei-aktuell {
    width: 50%;
}

.pfarrei-aktuell a.pdf, .pfarrei-aktuell a.ipdf, .pfarrei-aktuell a.link, .pfarrei-aktuell a.internlink, .pfarrei-aktuell a.word, .pfarrei-aktuell a.excel, .pfarrei-aktuell a.formular, .pfarrei-aktuell a.download {
    height: auto;
}

.pfarrei-left-right {
    display: revert;
    float: left;
    width: 100%;
    display: flex;
    flex-direction: row;
}

/* ///// BILD 2021 ////// */

.bild {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    height: 22vw;
    background-size: cover;
    background-position: center center;
    margin: 0;
    transition: all ease 0.5s;
}

.srcbild img {
    height: 9em;
    width: auto;
}

.bild-frame {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    height: clamp(12rem, 16vw, 16rem);
    overflow: hidden;
}

.item-page .bild-frame {
    width: 45%;
    margin-right: 5%;
    margin-bottom: 2%;
    float: left;
}

.item-page.no-image-margin .bild-frame {
    margin: 0% 0;
}

.bild-frame .bild {
    height: 100%;
}

.bild-frame:hover .bild {
    transform: scale(1.05);
}


.bild-overlay {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: 2;
    background: rgba(0,0,0,0.08);
    transition: all ease 0.5s;
}

.bild-frame:hover .bild-overlay {
    background: rgba(0,0,0,0.0);
}

.newsflash.schulnewsunterseite .bild-frame {
    height: 14vw;
}
.beitrag .bild-frame {
    height: 14vw;
}


a.fancybox {
    position: absolute;
    z-index: 3;
    width: 2em;
    height: 2em;
    right: 2em;
    bottom: 2em;
    background-image: url(../images/plus.svg);
    background-size: contain;
    background-repeat: no-repeat;
    left: auto;
    cursor: pointer;
    transition: all ease 0.5s;
}

a.fancybox:hover {
    transform: scale(1.1);
}

.hero-half {
    width: 45%;
    clear: both;
}

.hero-half img {
    margin-bottom: 0!important;
}

/* DOWNLOADS 2021 */

#downloads {
    position: relative;
    display: block;
    float: left;
    width: 100%;
}

#downloads h4 {
    margin: 1em 0 1em;
    color: #aea355;
    border-bottom: solid 1px;
}

#downloads .beitrag {
    padding: 2% 2% 2% 0;
    margin: 2px 0;
    width: 98%;
    border-bottom: solid 1px #e2e2e2;
}

#downloads p {
    margin: 8px 0;
}

#downloads span {
    display: block;
    margin: 8px;
    font-size: 0.8rem;
}

.download-section {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    margin: 40px 0;
}

.gemeindeversammlung .download-section {
    margin-top: 0;
}

/*
#downloads a.pdf, #downloads a.link {
    background: #e0e0e0;
    height: 2em;
    transition: all ease .5s;
    flex-direction: row-reverse;
}

#downloads a.pdf:hover, #downloads a.link:hover {
    background: #d4d4d4;
}

#downloads a.pdf.col-2, #downloads a.link.col-2 {
    width: calc(50% - 2px);
    margin: 0 2px 0 0%;
}
*/

#downloads a.pdf, #downloads a.link {
    width: 40%;
    clear: both;
}

a.pdf, a.ipdf, a.link, a.internlink, a.word, a.excel, a.formular, a.download {
    position: relative;
    display: flex;
    align-items: center;
    float: left;
    width: 100%;
    height: calc(100% - 1px);
    background: #d1ccc3;
    border-bottom: solid 1px #fff;
    transition: all ease .5s;
}

a.pdf:hover, a.ipdf:hover, a.link:hover, a.internlink:hover, a.word:hover, a.excel:hover, a.formular:hover, a.download:hover {
    text-decoration: none;
    color: #333333;
    background: #e4e4e4;
}

a.pdf:hover .download-icon, a.ipdf:hover .download-icon, a.link:hover .download-icon, a.internlink:hover .download-icon, a.word:hover .download-icon, a.excel:hover .download-icon, a.formular:hover .download-icon, a.download:hover .download-icon {
    background: #323e47;
}

#downloads a.pdf:hover .download-icon {
    background: #323e47;
}

a.pdf:hover .download-icon:before, a.ipdf:hover .download-icon:before, a.link:hover .download-icon:before, a.internlink:hover .download-icon:before, a.word:hover .download-icon:before, a.excel:hover .download-icon:before, a.formular:hover .download-icon:before, a.download:hover .download-icon:before {
    transform: translate(-50%,-50%) scale(1.1);
}



.onlineschalter-titel {
    display: flex;
    align-items: center;
    width: calc(100% - 120px);
    padding: 10px 60px 10px 60px;
    float: left;
    font-size: 1rem;
    line-height: 1.5;
    color: #323e47;
}


.download-icon {
    position: absolute;
    width: 40px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    float: right;
    background: #45443d;
    height: 100%;
    color: #fff;
    text-align: center;
    font-size: 0.6rem;
    line-height: 2.5;
    transition: all ease 0.5s;
}

#downloads .download-icon {
    background: #414e57;
}

.pdf-icon {
    position: absolute;
    width: 18px;
    height: 20px;
    background-image: url(../images/downloads/download-pdf-dark.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
    top: 50%;
    left: 7px;
    transform: translate(0, -50%);
}

.link-icon {
    position: absolute;
    width: 18px;
    height: 15px;
    background-image: url(../images/downloads/download-link-dark.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
    top: 50%;
    right: 7px;
    transform: translate(0, -50%);
}


a.pdf .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-pdf.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}

#downloads a.pdf .download-icon:before {
    width: 18px;
    height: 18px;
}

a.ipdf .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-ipdf.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}

a.link .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-link.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}

a.internlink .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-internlink.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}

a.word .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-word.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}

a.excel .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-excel.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}

a.download .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-download.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}

a.formular .download-icon:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 20px;
    height: 20px;
    background-image: url(../images/downloads/download-form.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease 0.5s;
}


/* ///// ---- Newsflash Abstimmungen 2021 ---- ////// */
.moduletable.abstimmungenpadding {
    padding-top: 5%;
}

#beitrag_abstimmungen {
    width: 100%;
}

/* ///// ---- Newsflash Personen 2021 ---- ////// */
.newsflash.personen .col-3.beitrag {
    background: #ececec;
}

h4.newsflash-title.personen {
    font-size: 20px;
    margin: 0;
    padding: 10px 0 0 10px;
}

.newsflash.personen span.field-value {
    margin: 8px 0;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 1px;
}

.moduletable.personen {
    width: 100%;
    position: relative;
    float: left;
    display: block;
    margin-bottom: 2rem;
}

.moduletable.personalbild {
    position: relative;
    float: left;
    width: 100%;
}

/* ///// ---- end 2021 ---- ////// */

.pull-left.item-image {
    width: 45%;
    margin-right: 5%;
    margin-bottom: 2%;
    float: left;
}

/* .pull-left.item-image img {
    display: block !important;
} */

#terminkalender {
	position: relative;
	display: block;
	float: right;
	width: 43%;
	padding-left: 1%;
}

span.dp-date.dp-time {
    font-style: normal;
}

span.fc-title {
    color: #fff;
}

.tippy-tooltip {
    background: rgba(0,187,255,1);
    background: -moz-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,187,255,1)), color-stop(100%, rgba(0,123,224,1)));
    background: -webkit-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -o-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -ms-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: linear-gradient(to right, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bbff', endColorstr='#007be0', GradientType=1 );
}

.dp-event-tooltip__link {
    color: #000!important;
    text-decoration: none!important;
    font-weight: 800;
}

span.status {
    position: relative;
    margin-left: 1em;
    display: none;
    padding: 1px 12px;
    font-style: normal;
    color: white;
    white-space: pre;
    font-size: 0.8rem;
    line-height: 1.2;
}

span.status.abgesagt {
    display: inline;
    background: #c54c4a;
}

span.status.inabklaerung {
    display: inline;
    background: #FF851B;
}

span.status.findetstatt {
    display: inline;
    background: #67b994;
}

.legende {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 4em!important;
}

.legende li {
    width: 100%;
    position: relative;
    float: left;
    list-style: none;
}

span.color {
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    display: inline-block;
    height: 15px;
    width: 15px;
}

span.legenden-text {
    margin-left: 2em;
    display: inline-block;
}

.color.abgesagt {
    background: #c54c4a;
}

.color.inabklaerung {
    background: #FF851B;
}

.color.findetstatt {
    background: #67b994;
}


#monatssicht span.fc-title {
    color: #fff;
}


a.fc-day-grid-event.fc-h-event.fc-event.fc-not-start.fc-end,
a.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-not-end,
a.fc-day-grid-event.fc-h-event.fc-event.fc-not-start.fc-not-end {
    text-decoration: none;
    height: 45px;
    display: flex;
    align-items: center;
    padding-left: 5px;
}



/* Adapt font color if the background is light or dark  */
.dark-color { color: #1D1A1A!important;}
.light-color { color: #EDEDED!important;}




.fc-day-grid-event .fc-time {
    font-weight: normal;
    color: #fff;
}



/* ///// HINWEIS ///// */

/*
#hinweis #beitrag {
    position: absolute;
    float: right;
    top: 20%;
    background: #f8e801;
    border-radius: 50%;
    z-index: 999;
    display: block;
    left: 75%;
    width: 200px;
    height: 200px;
    -ms-transform: rotate(7deg);
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
    padding: 1%;
    z-index: 1;
}*/

div#hinweis {
    position: absolute;
    right: 0;
    top: 20%;
}

#hinweis #beitrag {
    position: relative;
    float: left;
    background: #f8e801;
    z-index: 999;
    display: block;
    right: 0;
    width: auto;
    min-height: clamp(2rem, 4vw, 4rem);
    min-width: clamp(8rem, 12vw, 12rem);
    max-width: clamp(10rem, 16vw, 16rem);
    padding: clamp(2rem, 3vw, 3rem) clamp(1.5rem, 2vw, 2rem) clamp(1rem, 1.5vw, 1.5rem);
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}

#hinweis p {
    padding: 31% 0px 0px 0px;
    font-size: 25px;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    line-height: 1;
    font-weight: 600;
}

#hinweis h4 {
    color: #fff;
    text-align: left;
    text-transform: uppercase;
    line-height: 100%;
    font-weight: 600;
    font-size: min(max(0.8rem, 0.9vw), 1rem);
    line-height: 1.25;
}

#hinweis h4.newsflash-title {
    position: relative;
    hyphens: auto;
}

#hinweis .showtime-image {
    display: none;
}

#hinweis h4.newsflash-title a {
    text-decoration: none;
}

#hinweis a.readmore {
    background: transparent !important;
    border: solid 1px;
    line-height: 45px;
    transition: all 200ms ease-in;
    -webkit-border-radius: 7px 7px 7px 7px;
    padding: 5px 20px 5px 20px;
}

#hinweis a.readmore:hover {
    background: #000 !important;
    border: solid 1px #000;
}

#hinweis h4.newsflash-title a {
    text-decoration: none;
    color: #1d1d1a;
    -moz-hyphens: auto;
    hyphens: auto;
}

#hinweis h4.newsflash-title a:hover {
    color: #3c3d42;
}

#hinweis .introtext {
    margin: 0;
}

/*

#hinweis #beitrag:before {
    content: "Hinweis";
    position: absolute;
    background: #d64444;
    color: #fff;
    padding: 6%;
    border-radius: 13%;
    top: -2%;
    left: 10%;
    font-size: 14px;
    font-weight: 600;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 800;
    font-family: "Open Sans";
    transform: rotate(-21deg);
}

*/

#hinweis .hinweis-label {
    position: absolute;
    background: #3c3d42;
    color: #fff;
    padding: 0px 6px 0px 18px;
    border-radius: 0;
    top: 0;
    left: 0;
    font-size: 14px;
    font-weight: 600;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 800;
    font-family: "Open Sans";
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#hinweis .hinweis-label:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    top: 0;
    right: -20px;
    border-style: solid;
    border-width: 32px 20px 0 0px;
    border-color: #3c3d42 transparent transparent transparent;
    z-index: 1;
}

/* ///// Neuigkeiten ///// */
#neuigkeiten .image {
    min-height: 275px;
    position: relative;
    width: 100%;
    float: left;
    height: 16vw;
    overflow: hidden;
    display: flex;
    justify-content: center;
    transition: all ease .5s;
    align-items: center;
}

#neuigkeiten .image img {
    object-fit: cover;
    min-height: -moz-available;          /* WebKit-based browsers will ignore this. */
    min-height: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    min-height: fill-available;
}


.newsflash.neuigkeitenunterseite .image, .newsflash #beitrag .newsflash-title.neuigkeitenunterseite+.image {
    min-height: 275px;
    position: relative;
    width: 100%;
    float: left;
    height: 16vw;
    overflow: hidden;
    display: flex;
    justify-content: center;
    transition: all ease .5s;
    align-items: center;
}

.newsflash.neuigkeitenunterseite img {
    /* max-width: -webkit-fill-available; */
    object-fit: cover;
    min-height: -webkit-fill-available;
}



@media all and (-ms-high-contrast:none), all and (-ms-high-contrast:active) {


#neuigkeiten .image img {
    width: 200%;
    transform: translate(-20%);
}


 #attinghausen-content .image img {
    width: 200%;
    transform: translate(-20%);
}



}



/**** Elemente bei DP CALENDAR UPCOMING ausblenden ***/
.mod-dpcalendar-upcoming-default__description,
.mod-dpcalendar-upcoming-default__description .readmore {
    display: none;
}




.terminkalenderstartseite .mod-dpcalendar-upcoming-default__event:nth-child(odd) {
   /* background: #eeeeee;*/
    margin-top: inherit;
    padding: 0.7rem;
}

.terminkalenderstartseite .mod-dpcalendar-upcoming-default__event:nth-child(even) {
    background: #eeeeee;
    margin-top: inherit;
    padding: 0.7rem;
}

.terminkalenderstartseite span.dp-flatcalendar__month {
    color: #fff!important;
    font-size: 14px;
    margin: -5px 0 0 0;
    box-shadow: 0 0px 0 #fe7301!important;
}


.mod-dpcalendar-upcoming-default .dp-flatcalendar {
    float: left;
    font-size: 0.7em;
    display: inline-block;
    position: relative;
    width: 4.4em;
    height: 4.4em;
    background-color: #fff;
    margin: 0 0.7em 0 0;
    border-radius: 3px;
    box-shadow: none;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: rotate(0deg) skewY(0deg);
    -webkit-transform-origin: 50% 10%;
    transform-origin: 50% 10%;
}


.fc-event {
    border-radius: 0;
    border: none;
}

/*
span.fc-title {
    color: #000;
}
*/
a.dp-event-url.dp-link {
    color: #000;
    text-decoration: none;
}

a.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end {
    text-decoration: none;
}

a.fc-daygrid-event.fc-daygrid-block-event.fc-h-event.fc-event {
    text-decoration: none;
}

span.fc-time {
    color: #000;
}

a.mod-dpcalendar-upcoming-default__url.dp-link {
    color: #000;
    text-decoration: none;
}

.kalendermini tr:nth-child(odd) td:nth-child(even) {
	background: #eeeeee;
}

.readmore a.btn {
	font-size: 14px;
    color: #000;
    background: #dedede;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6ec21', endColorstr='#fff75e',GradientType=1 );
    margin: 0;
    text-decoration: none !important;
    transition: all ease .5s;
    padding: 1% 2%;
}

.readmore a.btn:hover {
	background: #000;
	color: #fff;
}



/*
.kalendermini tr:nth-child(even) td:nth-child(odd) {
	background: tomato;

}
*/


td.fc-day-top.fc-mo,
td.fc-day-top.fc-tue,
td.fc-day-top.fc-wed,
td.fc-day-top.fc-thu,
td.fc-day-top.fc-fri,
td.fc-day-top.fc-sat,
td.fc-day-top.fc-sun {
    background: #e4e4e4!important;
}

.fc th, .fc td {
    border-width: 0;
}

.fc-icon {
    overflow: visible;
}

/*
.fc button .fc-icon {
    position: relative;
    top: 0;
    margin: 0 .2em;
    vertical-align: middle;
    width: 20px;
    height: 6px;
}

*/


.mod-dpcalendar-mini .fc-button-primary {
    padding: 5px;
    border: 0px solid #c0c0c0;
    border-radius: .1rem;
    font-weight: 400;
    background-color: #f7e800;
    color: #fff;
    background-image: none;
    box-shadow: 0 0px 0px rgba(0,0,0,0.1);
}


.fc-icon-left-single-arrow:after {
    position: absolute;
    content: "";
    top: -7px;
    left: 0;
	background-image: url(../images/left-arrow.svg);
	background-size: cover;
    width: 18px;
    height: 15px;
}

.fc-icon-right-single-arrow:after {
    position: absolute;
    content: "";
    top: -7px;
    left: 0;
    background-image: url(../images/right-arrow.svg);
    background-size: cover;
    width: 18px;
    height: 15px;
}

.fc-state-default {
    background-color: #e4e4e4;
    background-image: inherit;
    background-repeat:  inherit;
    border-color:  inherit;
    /* color: #333; */
    text-shadow:  inherit;
   	box-shadow: inherit;
    border: 3px solid #f5f5f5;
}

.fc-toolbar .fc-center {
    display: inherit;
}

.fc h2 {
    font-size: 19px;
}

.mod-dpcalendar-upcoming-default .dp-date__start, .mod-dpcalendar-upcoming-default .dp-date__end, .mod-dpcalendar-upcoming-default .dp-time__start, .mod-dpcalendar-upcoming-default .dp-time__end {
	font-weight: normal;
    color: #000;
}

.mod-dpcalendar-upcoming-default__description {
    font-size: 16px;
    margin: 2px 0 0 55px;
}

.mod-dpcalendar-upcoming-default .dp-flatcalendar__day {
    color: #000000;
    font-weight: normal;
}

a.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end {
    padding: 5%;
    word-break: break-word;
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

p.MsoNormal, li.MsoNormal, div.MsoNormal, div.MsoNormal span, .mod-dpcalendar-upcoming-default__description span {

    font-size: 15px !important;
    font-family: "Open Sans" !important;
    font-weight: 300 !important;
}



/*
tr:nth-of-type(odd) td:nth-of-type(odd){
	background-color: tomato;
}

tr:nth-of-type(even) td:nth-of-type(even){
	background-color: tomato;
}

*/



.newsdatum {
    width: 46%;
    display: block;
    position: relative;
    float: left;
    background: #f4f4f4;
    font-size: 16px;
    padding: 2%;
	height: 18px;
    font-weight: 300;
}


#neuigkeiten a.readmore,
#attinghausen-content a.readmore {
    width: 44%;
    height: 18px;
    display: block;
    position: relative;
    float: left;
	font-size: 16px;
	font-weight: 300;
    padding: 2%;
	color: #000;
    background: #f6ec21;
 background: -webkit-linear-gradient(left, #f6ec21 0%, #fff75e 100%);
 background: -o-linear-gradient(left, #f6ec21 0%, #fff75e 100%);
 background: linear-gradient(to right, #f6ec21 0%, #fff75e 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6ec21', endColorstr='#fff75e',GradientType=1 );
    margin: 0 0% 0% 2%;
	text-decoration: none !important;
	transition: all ease 0.5s;
}

#neuigkeiten a.readmore:hover,
#attinghausen-content a.readmore:hover {
	background: #000;
	color: #fff !important;
}

#neuigkeiten .introtext,
#attinghausen-content .introtext{
    min-height: 145px;
}

.newsflash.gemeindeversammlung {
    position: relative;
    float: left;
    margin-bottom: 5%;
    width: 100%;
}

#attinghausen-content .gemeindeversammlung .introtext{
    min-height: 0!important;
}

#neuigkeiten .image {
	    min-height: 275px;
}

/* ///// Attinghausen Content für Module ///// */
#attinghausen-content {
	position: relative;
	display: block;
}

#attinghausen-content #beitrag {
    /* width: 22%!important; */
    display: flex;
    flex: 0 29%;
    flex-wrap: wrap;
    margin: 2%;
}

#beitrag.kachel {
    background: #ececec;
    width: 22%!important;
    display: flex;
    flex: 0 29%;
    flex-wrap: wrap;
    margin: 2%;
}

#beitrag.kachel .introtext {
    margin: 10px;
}

#attinghausen-content h3 {
font-family: "saira";
    color: #000;
    font-size: 36px;
    letter-spacing: 1px;
    line-height: 1.5;
}

.halbebreite {
    width: 40%;
    float: left;
    padding: 5% 5%;
}

/* ///// Newsflash 3 Blöcke ///// */
.newsflash.dreierblock #beitrag {
    flex: 0 26%;
    background: #ececec;
}

.introtext {
    width: 100%;
    margin-bottom: 5%;
}

.newsflash.dreierblock #beitrag h4 {
    font-family: "saira";
    color: #000;
    font-size: 18px;
    letter-spacing: 1px;
    line-height: 1.5;
    font-size: 20px;
    margin: 0;
    padding: 10px 0 0px 0;
}

.leitbild h4 {
    font-size: 30px!important;
}

.newsflash.dreierblock #beitrag dl.fields-container, .newsflash.dreierblock #beitrag ul.fields-container {
    margin: 8px 0;
    font-size: 15px;
    font-weight: 300;
    line-height: 2;
    letter-spacing: 1px;
}

.klassenlehrer #beitrag:first-child {
    background: rgba(0,187,255,1);
    background: -moz-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,187,255,1)), color-stop(100%, rgba(0,123,224,1)));
    background: -webkit-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -o-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -ms-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: linear-gradient(to right, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bbff', endColorstr='#007be0', GradientType=1 );
}

/* ///// Firmen & Vereine ///// */

.firmenvereine .nspArt.nspCol3 {
    flex: 0 33%;
    background: #ececec;
    border: 10px solid #ffffff;
    padding: 0px 0px 0px 10px!important;
	min-height: 236px;
}

.nspArtPage.active {
    display: flex;
    flex-wrap: wrap;
}


/* ///// FOOTER ///// */

#footer {
    position: relative;
    display: block;
    float: left;
    width: 80%;
    padding: 2% 10% 2% 10%;
	background: #fafafa;

}

#footer-1 {
    position: relative;
    display: block;
    float: left;
    width: 33%;
}

#footer-2 {
    position: relative;
    display: block;
    float: left;
    width: 33%;
}


#footer-3 {
    position: relative;
    display: block;
    float: left;
    width: 33%;
}

#footer-1 img,
#footer-2 img,
#footer-3 img{
    min-width: 115px;
}

#footer-2 img {
    /* width: clamp(12rem, 18vw, 18rem); */
    max-width: 275px!important;
    margin-top: 100px;
}

.custom.footergemeinde img {
	width: 350px!important;
	margin-top: 100px;

}

/*
#footer-3 {
    position: relative;
    display: block;
    float: left;
    width: 25%;
}

#footer-4 {
    position: relative;
    display: block;
    float: left;
    width: 25%;
}
*/

/* ///// COPYRIGHT ///// */


#copyright {
    position: relative;
    display: flex;
	justify-content: center;
    float: left;
    width: 80%;
    padding: 2% 10% 7% 10%;
    text-transform: uppercase;
	background: #fff;
}

#copyright a {
	color: #007ec6;
	text-decoration: none;
}

#copyright p {
	color: #000000;
	font-size: 12px;
}

#copyright-1 {
    position: relative;
    display: block;
    float: left;
    width: auto;
	margin: 0 10px;
}

#copyright-2 {
    position: relative;
    display: block;
    float: left;
    width: auto;
	margin: 0 10px;
}

#copyright-3 {
    position: relative;
    display: block;
    float: left;
    width: auto;
	margin: 0 10px;
}


/* ///// Einzelperson ///// */


.portraitbeschreibung {
    position: relative;
    display: block;
    float: left;
    width: 50%;
}

.item-page.col-1 .portraitbeschreibung {
    width: 100%;
}

.portraitbild {
    position: relative;
    display: block;
    float: right;
    width: 50%;
}


/* ///// SCROLL TO TOP BUTTON ///// */

#scrolltotop {
    display: none;
    position: fixed;
    background-image: url(../images/scrolltotop.svg);
	background-size: cover;
    bottom: 37px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
    width: 50px;
    height: 40px;
    transition: all 100ms ease-in;
}

#scrolltotop:hover {
    background-image: url(../images/scrolltotop-hover.svg);
}




/* ///// JOOMLA NEWSFLASH ///// */

.newsflash {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

#beitrag {
    display: flex;
    flex: 0 98%;
    flex-wrap: wrap;
    margin: 2%;
}

.col6 #beitrag {
  display: flex;
  flex: 0 14%;
  flex-wrap: wrap;
  margin: 2%;
}

.col4 #beitrag {
  display: flex;
  flex: 0 21%;
  flex-wrap: wrap;
  margin: 2%;
}

.col3 #beitrag {
  display: flex;
  flex: 0 30%;
  flex-wrap: wrap;
  margin: 2%;
}

.col2 #beitrag {
  display: flex;
  flex: 0 46%;
  flex-wrap: wrap;
  margin: 2%;
}

@media screen and (max-width: 1600px) {
.col6 #beitrag {
  flex: 0 30%;
}
}

@media screen and (max-width: 1200px) {
.col6 #beitrag, .col4 #beitrag, .col3 #beitrag {
  flex: 0 47%;
}
}

@media screen and (max-width: 600px) {
.col6 #beitrag, .col4 #beitrag, .col3 #beitrag, .col2 #beitrag {
    flex: 0 98%;
}
}

.image {
    width: 100%;
    float: left;
}

.image img {
	width: 100%;
}

figure.newsflash-image img {
    width: 100%;
}


/* ////// Personal ////// */

.left2personal {
    display: block;
    float: left;
    width: 48%;
	padding-right: 2%;
    position: relative;
}

.right2personal {
    display: block;
    float: left;
    width: 50%;
    position: relative;
}

.right2personal img {
	height: auto;
	width: -moz-available;
}


/* ///// JOOMLA BLOG ///// */

.blog {
    display: flex;
    flex-wrap: wrap;
}

.row-fluid {
    width: 100%;
}

.items-row {
    display: flex;
    flex: 0 98%;
    flex-wrap: wrap;
    margin: 2%;
}

.col6 .items-row {
  display: flex;
  flex: 0 14%;
  flex-wrap: wrap;
  margin: 2%;
}

.col4 .items-row {
  display: flex;
  flex: 0 22.5%;
  flex-wrap: wrap;
  margin: 2%;
}

.col3 .items-row {
  display: flex;
  flex: 0 30%;
  flex-wrap: wrap;
  margin: 2%;
}

.col2 .items-row {
  display: flex;
  flex: 0 47%;
  flex-wrap: wrap;
  margin: 2%;
}


@media screen and (max-width: 1600px) {
.col6 .items-row {
  flex: 0 30%;
}
}


@media screen and (max-width: 1400px) {
.col5 #beitrag {
    display: flex;
    flex: 0 29%;
}
}


@media screen and (max-width: 1200px) {
.col6 .items-row, .col4 .items-row, .col3 .items-row {
  flex: 0 46%;
}
}

@media screen and (max-width: 600px) {
.col6 .items-row, .col4 .items-row, .col3 .items-row, .col2 .items-row {
    flex: 0 98%;
}
}

.column-1, .column-2, .column-3 {
    padding: 0;
}

.blog img {
    width: auto;
}




/* ////// SLIDER ////// */

.slick-slider span.slide_title {
    color: #f6ec21;
    margin: 0px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0px !important;
    line-height: 132% !important;
    text-shadow: none !important;
    display: block;
    font-weight: 700 !important;
    font-size: 3.8em !important;
    text-align: center;

}

span.slide_small_title {
    font-weight: 500;
    font-size: 2.1em;
    display: block;
    line-height: 30px;
    text-align: center;
}


.slide_small_title {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1px;
    padding: 5px;
}


/* ///// VIDEO-BOX ///// */


#video-box {
	position: relative;
    display: inline-block;
    width: 90%;
    left: 50%;
    transform: translate(-50%, 0);
    margin-top: -160px;
    z-index: 0;
	-webkit-box-shadow: 4px 4px 14px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: 4px 4px 14px 2px rgba(0,0,0,0.1);
	box-shadow: 4px 4px 14px 2px rgba(0,0,0,0.1);
}


.videohintergrund {
    position: absolute;
    display: block;
    width: 100%;
    height: 30vw;
    background-size: cover;
    top: 0;
    left: 0;
    background-position: center center;
}

/* ///// BOXEN ///// */



/* /// BOXES STARTSEITEN /// */

#boxesA {
    float: right;
    width: 50%;
    margin-right: 0%;
    display: block;
    box-sizing: content-box;
}

#boxesA h3 {
    font-size: 18px;
    line-height: 1.5;
    font-weight: 800;
    color: #000;
    text-transform: uppercase;
    hyphens: auto;
    font-family: inherit;
}

#boxesA .custom {
    width: 100%;
    display: flex;
    align-items: center;
}

#boxesA p {
    line-height: 1.5;
    font-family: "Open Sans";
}

#boxesA a {
	color: #000!important;
}


div#boxA1 a {
    color: #8A8A8A!important;
}

div#boxA2 a {
    color: #8A8A8A!important;
}

div#boxA3 a {
    color: #8A8A8A!important;
}

div#boxA4 a {
    color: #8A8A8A!important;
}

#boxA-left {
    float: left;
    width: 39.55%;
	padding: 20px 5%;
	height: 170px;
    display: flex;
    align-items: center;
    font-size: 17px;
    font-family: "saira";
    border-bottom: 1px solid #DDD;
    border-right: 1px solid #DDD;
    background: rgba(245,245,245,1);
}

#boxA-left:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

#boxB-left {
    float: left;
    width: 39.55%;
    font-size: 17px;
	padding: 20px 5%;
	height: 170px;
    display: flex;
    align-items: center;
    font-family: "saira";
    border-bottom: 0px solid #DDD;
    border-right: 1px solid #DDD;
    background: rgba(245,245,245,1);
}

#boxB-left:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

#boxA-right {
    float: left;
    width: 40.3%;
    padding: 20px 5%;
	height: 170px;
    display: flex;
    align-items: center;
    font-size: 17px;
    font-family: "saira";
    border-bottom: 1px solid #DDD;
    background: rgba(245,245,245,1);
   transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

#boxA-right:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

#boxB-right {
    float: left;
    width: 40.3%;
	padding: 20px 5%;
	height: 170px;
    display: flex;
    align-items: center;
    font-size: 17px;
    font-family: "saira";
    border-bottom: 0px solid #DDD;
    background: rgba(245,245,245,1);
   transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

#boxB-right:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}



.boxicon {
    display: block;
    position: relative;
    float: left;
    width: 20%;
}

.boxicon img {
	width: 2vw;
    max-width: 45px;
}

.boxtext {
    display: block;
    position: relative;
    float: left;
    width: 80%;
}


/* /// BOXES TOP UNTERSEITEN /// */

#boxes-top {
    width: 100%;
    background: rgb(247, 247, 247);
    float: left;
}

#boxes-top img {
	width: 1.5vw;
    max-width: 30px;
}

div#boxes-top td {
    background: none;
}

#boxes-top h3 {
    font-size: 1.0vw;
    color: #000;
}

#boxes-top p {
    margin: 0;
	line-height: 1;
}



div#box-top1 a {
    color: #8A8A8A!important;
}

div#box-top2 a {
    color: #8A8A8A!important;
}

div#box-top3 a {
    color: #8A8A8A!important;
}

div#box-top4 a {
    color: #8A8A8A!important;
}

#box-top1 {
    float: left;
	display: flex;
	align-items: center;
    width: calc(15% - 1px);
    height: 20px;
    font-size: 14px;
    padding: 20px 2% 20px 2%;
	margin-left: 26%;
    font-family: "saira";
    border-bottom: 0px solid #DDD;
    border-right: 1px solid #DDD;
    background: rgba(247,247,247,1);
}

#box-top1:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

#box-top2 {
    float: left;
	display: flex;
	align-items: center;
    width: calc(16% - 1px);
    height: 20px;
    font-size: 14px;
    padding: 20px 2% 20px 2%;
    font-family: "saira";
    border-bottom: 0px solid #DDD;
    border-right: 1px solid #DDD;
    background: rgba(245,245,245,1);
}

#box-top2:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

#box-top3 {
    float: left;
	display: flex;
	align-items: center;
    width: calc(14% - 1px);
    height: 20px;
    padding: 20px 0px 20px 2%;
    font-size: 14px;
    font-family: "saira";
    border-bottom: 0px solid #DDD;
    border-right: 1px solid #DDD;
    background: rgba(240,240,240,1);
}

#box-top3:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

#box-top4 {
    float: left;
	display: flex;
	align-items: center;
    width: 17%;
    height: 20px;
    padding: 20px 0px 20px 2%;
    font-size: 14px;
    font-family: "saira";
    border-bottom: 0px solid #DDD;
    background: rgba(235,235,235,1);
}

#box-top4:hover {
    color: #000;
    background: #f6ec21;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}


.boxicon_unterseite {
    display: block;
    float: left;
    width: 2.5vw;
    position: relative;
}

.boxtitel_unterseite {
    display: flex;
    float: left;
    position: relative;
    align-items: center;
}

.boxtext_unterseite {
    position: relative;
    display: block;
    width: 100%;
    float: left;
}

.box_unterseite {
    display: flex;
}

.boxtext_unterseite p {
    font-size: 13px;
}


/* ///// VIDEO ///// */

#video-home {
    position: relative;
    float: left;
    padding: 0px 0px 0px 0%;
    width: 50%;
    height: 421px;
    margin-left: 0%;
    overflow: hidden;
    display: block;
    box-sizing: content-box;
}

img.video-border {
    width: 150%;
    transform: translate(-25%,-25%);
}

.video-home p {
    padding: 0px;
}

.video-border {
    padding-left: 1px;
    padding-bottom: 2px;
}

div.video-overlay {
	position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}


div.video-overlay:before {
    font-size: 60px;
    text-align: center;
    position: absolute;
    padding: 0% 0% 0% 0%;
    width: 100px;
    height: 60px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 1;
    display: block;
    float: left;
    color: #fff;
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    content: "\f144";
    line-height: 1;
}

#video-home:hover .video-overlay {
    background: rgba(0, 0, 0, 0.6);
   transition: .5s ease-in-out;
   -moz-transition: .5s ease-in-out;
   -webkit-transition: .5s ease-in-out;
}


/* ///// NEUIGKEITEN ///// */

.nspArts {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    padding: 0px 0px 40px 0px;
}

.s5_outer.neuigkeiten {
    padding: 0px 0px 0px 0px;
}
.newsflash.neuigkeiten {
    padding: 10px 10px 10px 0px;
    background: #fff;
    border-right: solid 1px rgb(218, 207, 0);
}
.weitere-neuigkeiten {
    padding: 10px 0px 0px 4px;
    background: #fff;
}


/* - - - ONLINESCHALTER - - - */

table.onlineschalter {
    width: 100% !important;
    background: #d1ccc3;
    color: #000;
}
td.onlineschalter-text {
    padding: 5px 5px 5px 14px;
    border: 1px solid #fff;
    width: auto;
    font-size: 1em;
}
td.onlineschalter-link {
    padding: 5px 5px 5px 14px;
    border: 1px solid #fff;
    width: 50px;
    font-size: 1em;
}
td.onlineschalter-icon {
    padding: 0px;
    border: solid 1px #fff;
    width: 40px;
}
.onlineschalter a {
	display: block;
	height: 40px;
    text-decoration: none;
    font-weight: 800;
}
.onlineschalter tr:hover {
    background: #c5c1b8;
}
.onlineschalter img:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: width .5s ease-in-out; /* Safari 3.1 to 6.0 */
    transition: width .5s ease-in-out;
	-webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.15);
	-moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.15);
	box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.15);
}

.zum-onlineschalter a {
    display: inline-block;
    text-decoration: none;
    color: #000;
    background: #f6ec21;
    position: relative;
    padding: 10px 30px;
}

.zum-onlineschalter a:hover {
    color: #000;
}



/* - - - Download - - - */


#attinghausen-download {
    position: relative;
    width: 86%;
    display: block;
    float: left;
    background: #eaeaea;
    padding: 0% 7% 7% 7%;
}

#attinghausen-download-titel {
    position: relative;
    width: 86%;
    display: block;
    float: left;
    background: #eaeaea;
    padding: 7% 7% 0% 7%;
}

#attinghausen-download .newsflash {
    display: flex;
    flex-wrap: wrap;
    margin-top: 25px;
    margin-bottom: 25px;
}

#attinghausen-download #beitrag {
    flex: 0 48%;
    position: relative;
    background: #ffffff;
    margin-bottom: 0.5%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#attinghausen-download .introtext {
    padding: 2% 0% 1% 5%;
    width: 75%;
    min-height: 50px;
}

#attinghausen-download dl.fields-container {
    position: absolute;
    right: 0%;
    top: 0;
    height: 100%;
    width: 20%;
    z-index: 2;
    transition: all ease .5s;
	background: rgba(0,187,255,1);
    background: -moz-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,187,255,1)), color-stop(100%, rgba(0,123,224,1)));
    background: -webkit-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -o-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -ms-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: linear-gradient(to right, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bbff', endColorstr='#007be0', GradientType=1 );
}

#attinghausen-download dl.fields-container:hover {
    transform: scale(1.05);
	background: rgba(0,187,255,1);
    background: -moz-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,187,255,1)), color-stop(100%, rgba(0,123,224,1)));
    background: -webkit-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -o-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -ms-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: linear-gradient(to right, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bbff', endColorstr='#007be0', GradientType=1 );
}

#attinghausen-download .field-value a {
    width: 100%;
    height: 5vw;
    display: block;
    font-size: 0;
}

#attinghausen-download dl.fields-container .icon-download:after {
    content: "";
    position: absolute;
    background-image: url(../images/download.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download dl.fields-container .icon-download:before {
    content: "DOWNLOAD";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}


#attinghausen-download dl.fields-container .icon-link:after {
    content: "";
    position: absolute;
    background-image: url(../images/link.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}


#attinghausen-download dl.fields-container .icon-link:before {
    content: "LINK";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}

#attinghausen-download dl.fields-container .icon-ipdf:after {
    content: "";
    position: absolute;
    background-image: url(../images/ipdf.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download dl.fields-container .icon-ipdf:before {
    content: "iPDF";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}




#attinghausen-download dl.fields-container .icon-word:after {
    content: "";
    position: absolute;
    background-image: url(../images/docx-file-format.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download dl.fields-container .icon-word:before {
    content: "WORD";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}


#attinghausen-download dl.fields-container .icon-excel:after {
    content: "";
    position: absolute;
    background-image: url(../images/xlsx-file-format.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download dl.fields-container .icon-excel:before {
    content: "EXCEL";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}

#attinghausen-download dl.fields-container .icon-kontaktformular:after {
    content: "";
    position: absolute;
    background-image: url(../images/browser.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download dl.fields-container .icon-kontaktformular:before {
    content: "FORMULAR";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}






#attinghausen-download ul.fields-container .icon-download:after {
    content: "";
    position: absolute;
    background-image: url(../images/download.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download ul.fields-container .icon-download:before {
    content: "DOWNLOAD";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}


#attinghausen-download ul.fields-container .icon-link:after {
    content: "";
    position: absolute;
    background-image: url(../images/link.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}


#attinghausen-download ul.fields-container .icon-link:before {
    content: "LINK";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}

#attinghausen-download ul.fields-container .icon-ipdf:after {
    content: "";
    position: absolute;
    background-image: url(../images/ipdf.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download ul.fields-container .icon-ipdf:before {
    content: "iPDF";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}




#attinghausen-download ul.fields-container .icon-word:after {
    content: "";
    position: absolute;
    background-image: url(../images/docx-file-format.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download ul.fields-container .icon-word:before {
    content: "WORD";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}


#attinghausen-download ul.fields-container .icon-excel:after {
    content: "";
    position: absolute;
    background-image: url(../images/xlsx-file-format.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download ul.fields-container .icon-excel:before {
    content: "EXCEL";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}

#attinghausen-download ul.fields-container .icon-kontaktformular:after {
    content: "";
    position: absolute;
    background-image: url(../images/browser.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px;
    width: 100%;
    height: 80%;
    top: 0;
    z-index: -1;
}

#attinghausen-download ul.fields-container .icon-kontaktformular:before {
    content: "FORMULAR";
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 11px;
}









#attinghausen-download h3 {
	font-size: 18px;
    color: #4a4644;
}

#attinghausen-download .acc-titel.active h3, #attinghausen-download .acc-titel:hover h3 {
    color: #fff;
}

#attinghausen-download-titel h2 {
    color: #12796a;
    font-size: 3vw;
    letter-spacing: 5px;
    line-height: 4vw;
    text-transform: uppercase;
    font-family: "light";
    border-bottom: solid 0px #fff;
    margin-bottom: 50px;
    text-align: center;
}


/* ///// Download Spezialfarben nur Gemeinde ///// */
.acc-titel:hover {
  z-index: 2;
 /* background: #99b5ad;*/
  color: #fff;
  cursor: pointer;
  transform: scale(1.01);
  box-shadow: 1px 3px 4px rgba(0,0,0,0.2);
background: #E7E100;
background: -webkit-linear-gradient(top left, #E7E100, #F5EC21);
background: -moz-linear-gradient(top left, #E7E100, #F5EC21);
background: linear-gradient(top left, #E7E100, #F5EC21);
}

.acc .active {
    background: #F5EC21;
	color: #000
}


/* ///// Gemeindepersonal ///// */
#attinghausen-content .moduletable.gemeindepersonal #beitrag {
    /* width: 22%!important; */
    display: block;
    flex: inherit;
    flex-wrap: inherit;
}

.gemeindeportraitbild {
    display: block;
    position: relative;
    float: right;
    width: 50%;
}


.gemeindepersonalbeschreibung {
    display: block;
    position: relative;
    float: left;
    width: 50%;
}


#attinghausen-content .moduletable.gemeindepersonal #beitrag span.field-value {
    margin: 8px 0;
    font-size: 15px;
    font-weight: 300;
    line-height: 2;
    letter-spacing: 1px;
}

/* ///// Personal ///// */

#attinghausen-content .moduletable.personalbild #beitrag {
    /* width: 22%!important; */
    display: block;
    flex: inherit;
    flex-wrap: inherit;
}


#attinghausen-content .moduletable.personalbild .introtext {
    min-height: inherit;
}


/* ///// NEWS SHOW PRO ///// */

.nspArt h4.nspHeader {
    font-size: 20px;
    margin: 0;
    padding: 10px 0 0px 0;
}

dd.field-entry.zustaendigfuer {
    margin: 5% 0 0 5px;
}
ul.fields-container{margin: 0; list-style: none;}
ul.fields-container li {list-style: none;}
/* ///// Attinghausen in Zahlen ///// */
dd.field-entry.attinghausen_in_zahlen,li.field-entry.attinghausen_in_zahlen {
    background: #F7E800;
    padding: 1% 0% 5% 0%;
    border-bottom: solid 1px #c6c6c6;
    margin: 2%;
    width: 43%;
    float: left;
}

.attinghausen_in_zahlen span.field-label {
    color: #fff!important;
    text-transform: uppercase;
    font-size: 25px;
    text-align: center;
    display: block;
    min-height: 64px;
    line-height: 1.2;
}

.attinghausen_in_zahlen span.field-value {
    font-size: 33px;
    text-align: center;
    display: block;
    padding: 3% 0 0 0;
}

/* ///// Fotos ///// */
/*#cwgallery-1 .masonry .cwgitem {
    display: inline-block;
}
*/

#cwgallery-3 .masonry .cwgitem {
    float: left;
}

#cwgallery-2 .masonry .cwgitem {
    float: left;
}

.cwgallery {
    display: inline-block;
}
#cwgallery-6 .masonry .cwgitem {
    float: left;
}


/* ///// Redaktion Dorfzeitung ///// */
.nspArt.nspCol3 {
    flex: 0 26%;
    width: 100%;
    background: #ececec;
    border: 10px solid #ffffff;
    padding: 0px 0px 0px 10px!important;
}

/* ///// Lehrpersonal ///// */

.blog.lehrpersonal .span12 {
    background: #ececec;
    border: 10px solid #ffffff;
    padding: 5%;
}

.blog.lehrpersonal h2 {
    font-family: "saira";
    color: #000;
    letter-spacing: 1px;
    line-height: 1.5;
    font-size: 20px;
    margin: 0;
}

dd.field-entry.funktion, dd.field-entry.abteilungen, dd.field-entry.mail {
    line-height: 2;
}


/* ///// Abteilungen ///// */


#abteilungen {
    position: relative;
    width: 86%;
    display: block;
    float: left;
    background: transparent;
    padding: 0% 7% 7% 7%;
}

#abteilungen .newsflash.dreierblock #beitrag {
    flex: 0 41%;
    background: #ffffff;
    border: 10px solid #ffffff;
    padding: 0px 0px 0px 10px!important;
}

#abteilungen .klassenlehrer #beitrag:first-child {
    background: rgba(0,187,255,1);
    background: -moz-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,187,255,1)), color-stop(100%, rgba(0,123,224,1)));
    background: -webkit-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -o-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: -ms-linear-gradient(left, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    background: linear-gradient(to right, rgba(0,187,255,1) 0%, rgba(0,123,224,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bbff', endColorstr='#007be0', GradientType=1 );
    color: #fff;
}

#abteilungen .klassenlehrer #beitrag:first-child h4.newsflash-title.personen.firmenvereine.dreierblock.klassenlehrer.abteilungen_acc {
    color: #fff!important;
}

#abteilungen .klassenlehrer #beitrag:first-child span.field-value a {
    color: #fff!important;
}

.acc-titel.active h3 {
    color: #fff;
}

/* ///// Gemeinderat ///// */

/*.newsflash.personen.firmenvereine.dreierblock.gemeinderat #beitrag {
    display: flex;
    flex: 0 26%!important;
    flex-wrap: wrap;
    margin: 2%;
    padding: 0px 0px 0px 0px!important;
}*/


.introtext_gemeinderat {
    width: 100%;
}


/* ///// Gemeindepersonal ///// */

.newsflash.personen.firmenvereine.dreierblock.gemeindepersonal #beitrag {
    display: flex;
    flex: 0 26%!important;
    flex-wrap: wrap;
    margin: 2%;
    padding: 0px 0px 0px 0px!important;
}


.personen .newsflash.dreierblock #beitrag h4, .personen dl.fields-container, .personen ul.fields-container {
    padding: 0 0 0 4%;
}


.moduletable.personen.firmenvereine.dreierblock.gemeindepersonal_uebersicht #beitrag {
    display: flex;
    flex: 0 42%;
}

/* ///// Übersichtsseite Gemeindepersonal ///// */


.moduletable.personen.firmenvereine.dreierblock.gemeindepersonal_uebersicht #beitrag {
    display: flex;
		flex: 0 42%;
		flex-wrap: wrap;
		margin: 2%;
		padding: 0px 0px 0px 0px!important;
}

.newsflash.personen.firmenvereine.dreierblock.gemeindepersonal_uebersicht dl.fields-container {
    padding: 0 2%;
}

.newsflash.personen.firmenvereine.dreierblock.gemeindepersonal_uebersicht dd.field-entry.zustaendigfuer {
    display: none;
}

/* END WHIZ */



/* ----------   LAYOUT   ---------------- */

html {}

body {
    background: #f5f5f5;
	font-family: "Open Sans";
    font-weight: 400;
}

#attinghausenbox-wrapper {
    background: #ececec;
    position: relative;
    float: left;
	right: 0;
    width: 100%;
    display: flex;
    justify-content: center;
	transition: all ease .5s;
}

#attinghausenbox-wrapper.rollout {
    right: 80%;
	pointer-events: none;
	transition: all ease .5s;
}

#attinghausenbox-wrapper.rollout:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
	background: rgba(0,0,0,0.6);
}

#attinghausenbox {
    position: relative;
    display: block;
	float: left;
    width: 90%;
    background: #fff;
	-webkit-box-shadow: 0px 19px 57px 0px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 19px 57px 0px rgba(0,0,0,0.05);
    box-shadow: 0px 19px 57px 0px rgba(0,0,0,0.05);
    margin: 2% 5%;
    max-width: 1800px;

}

#headeroben {
    background: #3d3d3d;
    height: 40px;
	position: relative;
}

#mainWrapper {
    display: inline;
    float: left;
    width: 100%;
	background:#FFFFFF;
-moz-box-shadow:0 0px 26px rgba(0, 0, 0, 0.07);
-webkit-box-shadow: 0 0px 26px rgba(0, 0, 0, 0.07);
box-shadow:0 0px 26px rgba(0, 0, 0, 0.07);
    overflow: hidden;
}


#container {
    display: inline;
    float: left;
    width: 86%;
    margin-left: 7%;
    margin-right: 7%;
}

#container-header {
    display: block;
    float: left;
    width: 100%;
}

#header {
	position: relative;
    display: block;
    float: left;
    width: 100%;
    z-index: 3;
}

#header #container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#header-fadein {
    position: fixed;
    top: -200px;
    left: 0;
    display: block;
    float: left;
    width: 90.1%;
	height: 54px;
    max-width: 1800px;
    left: 50%;
    transform: translate(-50%,0);
    padding: 0;
    z-index: 6;
    -webkit-box-shadow: 0px 5px 14px 0px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 5px 14px 0px rgba(0,0,0,0.05);
    box-shadow: 0px 5px 14px 0px rgba(0,0,0,0.05);
	transition: all ease .5s;
}

#header-fadein.display {
	top: 0;
}

#header-fadein #navigation {
    height: 70px
}

#header-fadein #logo img {
    width: 161px;
}

@media all and (-ms-high-contrast:none), all and (-ms-high-contrast:active) {


#header-fadein #logo img {
    width: 55%;
}

}

#header-fadein #suche {
    background: rgba(0,0,0,0.8);
    right: 0;
    padding-right: 0;
    position: absolute;
    z-index: 0;
    top: 70px;
	visibility: hidden;
}

#header-fadein #suche.aktiv {
	visibility: visible;
}

#header-fadein.fade-in {
	visibility: visible;
	top: 0;
}



.wideWrap {
    display: inline;
    float: left;
    width: 90%;
    padding: 5%;
}

.item-page {
    float: left;
    margin: 5% 0;
        width: 100%;
}

#startseite .wideWrap {
    display: none;
    float: left;
    width: 90%;
    padding: none!important;
}


#top {
    background: none repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    width: 100%;
}

#topLeft {
    background: none repeat scroll 0 0 transparent;
    float: left;
}

#topRight {
    background: none repeat scroll 0 0 transparent;
    float: right;
}

#rowA, #rowB, #rowC, #rowD, #rowE, #rowF, #rowG {
    background: none repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    width: 100%;
}


#NavWrapper {
    background: none repeat scroll 0 0 #DDDDDD;
    display: inline;
    float: left;
    margin: 0 0 5px;
    padding-bottom: 0;
    width: 100%;
}

#Nav {
    float: left;
    padding: 5px 0;
}

ul.menu {
    margin-left: 0;
}

ul.menu li {
    background: none repeat scroll 0 0 transparent;
    float: left;
    list-style: none outside none;
    margin: 0 10px 0 3px;
    padding: 0 4px;
}

ul.menu a {
    color: #666666;
    font-size: 18px;
    text-decoration: none;
	transition: all ease .5s;
}

ul.menu a:hover {
    text-decoration: none;
}

ul.menu li.active {
    text-decoration: none;
	color: red;
}


ul.menusideMenu {
    color: #666666;
    font-size: 20px;
    line-height: 25px;
    margin-left: 23px;
}

ul.menusideMenu li.active {
    text-decoration: none;
	color: red;
}


#breadcrumb {
    background: none repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    width: 100%;
}

ul.menu li ul.nav-child.unstyled.small li.deeper.parent.active a {
    background: #a7a7a7;
}

#left-col-cont ul.menu li ul.nav-child.unstyled.small li.deeper.parent.active a {
    background: #fff!important;
}

.breadcrumbs {
    font-size: 12px;
    font-style: italic;
    margin-left: 10px;
}

#breadcrumbLeft {
    background: none repeat scroll 0 0 transparent;
    float: left;
}

#breadcrumbRight {
    background: none repeat scroll 0 0 transparent;
    float: right;
    text-align: right;
}

#mainrow {}

#left-col {
	float: left;

}

#left-col-cont {
}

#left-col-cont .moduletable {
	padding-bottom: 30px;
	margin-bottom: 20px;
}

#main-col {
    background: none repeat scroll 0 0 transparent;
    float: left;
}

#main-col-cont {
    background: none repeat scroll 0 0 transparent;
    padding: 0;
}

#main-col-cont img {
    max-width: -webkit-fill-available;
    width: 100%;
    /* float: left; */
    display: block;
    margin-top: 1rem;
    margin-bottom: 2rem;
    object-fit: contain;
    object-position: center top;
}

dd.field-entry.feldgallery img {
    max-width: inherit!important;
}

.newsflash.neuigkeitenunterseite .feldgallery,
div#neuigkeiten .feldgallery {
    display: none;
}

#right-col {
	float: right;
	width: 25%;
}

#right-col-cont .moduletable {
	padding-bottom: 30px;
	margin-bottom: 20px;
}

#right-col-cont {
}

#adverttop {
    margin: 0 0 10px;
}

#advertBottom {
    margin: 10px 0 0;
}

#footWrapper{
    background: none repeat scroll 0 0 #DDDDDD;
    display: inline;
    float: left;
    width: 100%;
}

#debugRow {
    display: inline;
    float: left;
}

#topLeft, #topRight {
    width: 470px;
}

#topRight {
    text-align: right;
}


#breadcrumb {
}

.cols-1 {
    display: block;
    float: none !important;
    margin: 0 !important;
}
.cols-2 .column-1 {
    float: left;
    width: 46%;
}
.cols-2 .column-2 {
    float: right;
    margin: 0;
    width: 46%;
}
.cols-3 .column-1 {
    float: left;
    margin-right: 4%;
    padding: 0 5px;
    width: 29%;
}
.cols-3 .column-2 {
    float: left;
    margin-left: 0;
    padding: 0 5px;
    width: 29%;
}
.cols-3 .column-3 {
    float: right;
    padding: 0 5px;
    width: 29%;
}
.items-row {
    margin-bottom: 10px !important;
    overflow: hidden;
}
.column-1, .column-2, .column-3 {
    padding: 10px 5px;
    width: -webkit-fill-available;
}


.span12 {
	width: 940px;
}
.span11 {
	width: 860px;
}
.span10 {
	width: 780px;
}
.span9 {
	width: 700px;
}
.span8 {
	width: 620px;
}
.span7 {
	width: 540px;
}
.span6 {
	width: 460px;
}
.span5 {
	width: 380px;
}
.span4 {
	width: 300px;
}
.span3 {
	width: 220px;
}
.span2 {
	width: 140px;
}
.span1 {
	width: 60px;
}
.offset12 {
	margin-left: 980px;
}
.offset11 {
	margin-left: 900px;
}
.offset10 {
	margin-left: 820px;
}
.offset9 {
	margin-left: 740px;
}
.offset8 {
	margin-left: 660px;
}
.offset7 {
	margin-left: 580px;
}
.offset6 {
	margin-left: 500px;
}
.offset5 {
	margin-left: 420px;
}
.offset4 {
	margin-left: 340px;
}
.offset3 {
	margin-left: 260px;
}
.offset2 {
	margin-left: 180px;
}
.offset1 {
	margin-left: 100px;
}
.row-fluid {
	width: 100%;
	*zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
	display: table;
	content: "";
	line-height: 0;
}
.row-fluid:after {
	clear: both;
}
.row-fluid [class*="span"] {
	display: block;
	width: 100%;
	min-height: 28px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	margin-left: 2.127659574%;
	*margin-left: 2.0744680846383%;
}
.row-fluid [class*="span"]:first-child {
	margin-left: 0;
}
.row-fluid .controls-row [class*="span"] + [class*="span"] {
	margin-left: 2.127659574%;
}
.row-fluid .span12 {
	width: 99.99999999%;
	*width: 99.946808500638%;
}
.row-fluid .span11 {
	width: 91.489361693%;
	*width: 91.436170203638%;
}
.row-fluid .span10 {
	width: 82.978723396%;
	*width: 82.925531906638%;
}
.row-fluid .span9 {
	width: 74.468085099%;
	*width: 74.414893609638%;
}
.row-fluid .span8 {
	width: 65.957446802%;
	*width: 65.904255312638%;
}
.row-fluid .span7 {
	width: 57.446808505%;
	*width: 57.393617015638%;
}
.row-fluid .span6 {
	width: 48.936170208%;
	*width: 48.882978718638%;
}
.row-fluid .span5 {
	width: 40.425531911%;
	*width: 40.372340421638%;
}
.row-fluid .span4 {
	width: 31.914893614%;
	*width: 31.861702124638%;
}
.row-fluid .span3 {
	width: 23.404255317%;
	*width: 23.351063827638%;
}
.row-fluid .span2 {
	width: 14.89361702%;
	*width: 14.840425530638%;
}
.row-fluid .span1 {
	width: 6.382978723%;
	*width: 6.3297872336383%;
}
.row-fluid .offset12 {
	margin-left: 104.255319138%;
	*margin-left: 104.14893615928%;
}
.row-fluid .offset12:first-child {
	margin-left: 102.127659564%;
	*margin-left: 102.02127658528%;
}
.row-fluid .offset11 {
	margin-left: 95.744680841%;
	*margin-left: 95.638297862277%;
}
.row-fluid .offset11:first-child {
	margin-left: 93.617021267%;
	*margin-left: 93.510638288277%;
}
.row-fluid .offset10 {
	margin-left: 87.234042544%;
	*margin-left: 87.127659565277%;
}
.row-fluid .offset10:first-child {
	margin-left: 85.10638297%;
	*margin-left: 84.999999991277%;
}
.row-fluid .offset9 {
	margin-left: 78.723404247%;
	*margin-left: 78.617021268277%;
}
.row-fluid .offset9:first-child {
	margin-left: 76.595744673%;
	*margin-left: 76.489361694277%;
}
.row-fluid .offset8 {
	margin-left: 70.21276595%;
	*margin-left: 70.106382971277%;
}
.row-fluid .offset8:first-child {
	margin-left: 68.085106376%;
	*margin-left: 67.978723397277%;
}
.row-fluid .offset7 {
	margin-left: 61.702127653%;
	*margin-left: 61.595744674277%;
}
.row-fluid .offset7:first-child {
	margin-left: 59.574468079%;
	*margin-left: 59.468085100277%;
}
.row-fluid .offset6 {
	margin-left: 53.191489356%;
	*margin-left: 53.085106377277%;
}
.row-fluid .offset6:first-child {
	margin-left: 51.063829782%;
	*margin-left: 50.957446803277%;
}
.row-fluid .offset5 {
	margin-left: 44.680851059%;
	*margin-left: 44.574468080277%;
}
.row-fluid .offset5:first-child {
	margin-left: 42.553191485%;
	*margin-left: 42.446808506277%;
}
.row-fluid .offset4 {
	margin-left: 36.170212762%;
	*margin-left: 36.063829783277%;
}
.row-fluid .offset4:first-child {
	margin-left: 34.042553188%;
	*margin-left: 33.936170209277%;
}
.row-fluid .offset3 {
	margin-left: 27.659574465%;
	*margin-left: 27.553191486277%;
}
.row-fluid .offset3:first-child {
	margin-left: 25.531914891%;
	*margin-left: 25.425531912277%;
}
.row-fluid .offset2 {
	margin-left: 19.148936168%;
	*margin-left: 19.042553189277%;
}
.row-fluid .offset2:first-child {
	margin-left: 17.021276594%;
	*margin-left: 16.914893615277%;
}
.row-fluid .offset1 {
	margin-left: 10.638297871%;
	*margin-left: 10.531914892277%;
}
.row-fluid .offset1:first-child {
	margin-left: 8.510638297%;
	*margin-left: 8.4042553182766%;
}
[class*="span"].hide,
.row-fluid [class*="span"].hide {
	display: none;
}
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
	float: right;
}

.item-image img {
   width: 100%;
}


/* END LAYOUT */


/* ----------   TYPOGRAPHY  ---------------- */

body {
	color: #000;
	font-size: 14px;
	line-height:18px;
	font-family: "Open Sans";
}

a {
    color: #444444;
    text-decoration: underline;
	cursor: pointer;
    transition: all ease .5s;
}

a:hover {
    text-decoration: none;
    color: #f6ec22;
}

.readmore a {
    text-decoration: none;
}

a.button, p.button {
    color: #fff;
    border: solid 1px #fff;
    padding: 10px;
    transition: all ease .5s;
    display: table;
    margin-left: auto;
    margin-right: auto;
}

a.button:hover {
    background: #ffce4a;
    color: #fff;
    border: solid 1px #ffce4a;
}

p, .introtext-detail {
	margin: 8px 0;
	font-size: 15px;
	line-height: 2;
	letter-spacing: 1px;
}

.leitbild p {
    font-size: 19px;
}

li {
	margin: 8px 0;
	font-size:16px;
	line-height: 1.5;
	list-style: square;
}

h1, .componentheading {
    font-family: "saira";
    color: #000;
    font-size: 48px;
    letter-spacing: 1px;
	line-height: 1.5;
}

h2, .contentheading, h2 a {
    font-family: "saira";
    color: #000;
    font-size: 36px;
    letter-spacing: 1px;
	line-height: 1.5;
}

h3, .moduletable h3, #attinghausen-content .moduletable h3 {
    font-family: "saira";
    color: #000;
    font-size: 24px;
    letter-spacing: 2px;
	line-height: 1.5;
}

h4 {
    font-family: "saira";
    color: #000;
    font-size: 18px;
    letter-spacing: 1px;
	line-height: 1.5;
}

h5 {color: #ffffff;background: #333333;padding: 2px 0 2px 4px}
h6 {color: #ffffff;background: #999999;padding: 2px 0 2px 4px}

.breadcrumbs {font-size: 12px;font-style: italic; margin-left: 0;}

/* END TYPOGRAPHY */


/* ----------   MISC ELEMENTS ---------------- */

label {
    float: left;
    /*min-width: 122px;*/
}

ul {
    margin-left: 14px;
}

ul.actions {
    margin-left: 0;
}

ul.actions li {
    display: inline;
    list-style: none outside none;
    padding: 0;
}

 #system-message dd.error ul {
    margin-left: 0;
	background-position: 5px 40%;
}

th {
    padding: 3px;
}

caption, th, td {
    padding: 2px 10px 2px 2px;
    text-align: left;
}

td {
    font-size: 15px;
    line-height: 2;
    letter-spacing: 1px;
}

#video-home caption, th, td {
    padding: 0;
    text-align: left;
}

thead tr {
    background: none repeat scroll 0 0 #e4e4e4;
}


fieldset.filters {margin: 10px 0;}

div.current {
    border: 1px solid #CCCCCC;
    clear: both;
    padding: 10px;
}

dl.tabs dt {
    background: none repeat scroll 0 0 #F0F0F0;
    border-left: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    color: #666666;
    float: left;
    margin-right: 3px;
    padding: 4px 10px;
}

dl.tabs dt.open {
    background: none repeat scroll 0 0 #F9F9F9;
    border-bottom: 1px solid #F9F9F9;
    color: #000000;
    z-index: 100;
}

.panel {
    border: 1px solid;
    margin-top: -1px;
}


.contentpane {
	margin:10px;
}

/* END MISC ELEMENTS */


/* ----------   DEVELOPER  ---------------- */


.moduletable.greybox {
    background: none repeat scroll 0 0 #dddddd;
    color: #FFFFFF;
    height: 100%;
    padding: 5px;
    width: auto;
}

.custom.greybox {
	padding: 5px;
	min-height: 140px;

}

.custom.greybox p {
    color: #666666;
    line-height: 18px;
    margin: 0;
}

.greybox2 {
    background: none repeat scroll 0 0 #DDDDDD;
    color: #FFFFFF;
    height: auto;
    padding: 0 3px;
    width: auto;
}

.greybox2 p {
    color: #666666;
    margin: 0;
    padding: 0;
}

p.righleftheight {height: 206px; }

.moduletablegreybox {
    background: none repeat scroll 0 0 #DDDDDD;
    min-height: 140px;
    padding: 5px;
    width: auto;
}

.moduletablegreybox p {
    color: #666666;
    line-height: 18px;
    margin: 0;
    padding: 5px;
}

li.field-entry.zustaendig-fuer.zustaendigfuer {
    display: none;
}
/* END DEVELOPER */