
/* Button cookiebar hover */
.contao-cookiebar .cc-btn.success:hover {
    background-color:#ffffff;
    border-color:#ff4488;
    font-weight:bold;
    color:#ff4488;
}

/* Button cookiebar */
.contao-cookiebar .cc-btn.success {
    background-color:#ff4488;
    border-color:#ff4488;
    color:#ffffff;
}
body {
    background-color:#339933;
    font-family:"Ubuntu", sans-serif;;
    color:#252427;
}
#header {
    background-color:#339933;
    border-color:#ff4488;
}
#container {
    background-color:#ffffff;
}
#footer {
    background-color:#ffcc33;
    color:#252427;
}
#header-bar {
    background-color:rgba(255, 255, 255, 0.5);
    transition: all .5s ease-in-out;
}
#header-bar.headroom--not-top {
    background-color:rgba(255,255,255, 0.95);
    transition: all .5s ease-in-out;
}

/* Max. 20%. If larger, the width of #nav has to be adjusted accordingly */
#logo {
    width:20%;
}

/* Mobile Navigation */
.nav-side {
    background-color:#ff4488;
}
.hero {
    background-color:#ffcc33;
    color:#fff;
    text-transform:uppercase;
    letter-spacing:.2em;
    background-attachment:fixed;
    background-size: 100%;
}
a {
    color:#ff4488;
}
a:hover {
    color:#252427;
}
p.info,
p.time {
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight:400
}
h1 {
    font-family:"Ubuntu", sans-serif;;
}
h2 {
    font-family:"Ubuntu", sans-serif;;
    font-weight:bold;
}
h3 {
    font-family:"Ubuntu", sans-serif;;
}
h4 {
    font-family:"Ubuntu", sans-serif;;
}
h5 {
    font-family:"Ubuntu", sans-serif;;
}
h6 {
    font-family:"Ubuntu", sans-serif;;
}
#main h1:after,
#main h2:after,
.masonry_news h4:after {
    border-color:#ffcc33;
}
#main h3:before {
    background-color:#ffcc33;
}
blockquote,
q {
    color:#252427;
}
*::selection {
    background-color:#ffcc33;
}
mark {
    padding:2px;
    background-color:#ff4488;
    border-radius:3px;
}
figcaption {
    background-color:rgba(255,255,255, 0.8);
    color:#252427;
}
.light {
    color:#fff;
    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
}
.box {
    border-color:#252427;
}
.infobox {
    background-color:#198991;
}
.mod_article .ce_text.intro {
    font:1.8rem "Homemade Apple", cursive;
    font-weight:normal;
}
td.weekend {
    background-color:#C1CEDC;
}

/* Button normal */
*[class*="btn"] a,
a.btn,
a.btn-large,
a.btn-small,
input[type="submit"],
button [type="submit"] {
    border-color:#252427;
    color:#252427;
}
*[class*="btn"] a:hover,
a.btn:hover,
a.btn-large:hover,
a.btn-small:hover,
input[type="submit"]:hover,
button.submit:hover {
    border-color:#ff4488;
    color:#ff4488;
}

/* Button inverted */
*[class*="btn"].invert a,
a.btn.invert,
a.btn-small.invert,
a.btn-large.invert {
    background-color:#252427;
    color:#fff;
}
*[class*="btn"].invert a:hover,
a.btn.invert:hover,
a.btn-small.invert:hover,
a.btn-large.invert:hover {
    background-color:#198991;
}

/* Button light */
.light *[class*="btn"] a,
.light a.btn,
.light a.btn-large,
.light a.btn-small,
.light input[type="submit"],
.light button[type="submit"],
*[class*="btn"].light a,
.light.btn-large a,
.light.btn-small a,
.light button[type="submit"] {
    border-color:#fff;
    color:#fff;
}
.light *[class*="btn"].invert a,
*[class*="btn"].light.invert a {
    color:#252427;
}
.light *[class*="btn"] a:hover,
a.btn:hover,
a.btn-large:hover,
a.btn-small:hover,
*[class*="btn"].light a:hover,
a.btn.light:hover,
a.btn-large.light:hover,
a.btn-small.light:hover,
.light button[type="submit"]:hover {
    border-color:#ff4488;
    color:#ff4488;
}

/* Dropdown Navigation primary color */
#nav li ul,
#nav > ul > li:hover > a,
#nav > ul:not( :hover ) > li.active > a,
#nav ul.level_1 li.trail {
    background-color:#ffcc33;
}

/* Dropdown Navigation secondary color */
#nav li ul li a:hover,
#nav li ul:not( :hover ) li.active a,
#nav ul li.active {
    background-color:#ffcc33;
}
#nav li.trail ul.level_2 a {
    color:#ff4488;
}
#nav li.trail ul.level_2 a:hover {
    color:#fff;
}

/* Dropdown Navigation link color */
#nav li a {
    color:#252427;
}

/* Dropdown Navigation active link color (visible on click) */
#nav li a:active {
    background-color: #198991 !important;
}

/* Dropdown Navigation background level 2 */
#nav li ul {
    background-color:#ffcc33;
}

/* Dropdown Navigation background level 2 */
#nav li ul.level_2 li.active {
    background-color:rgba(0,0,0, 0.2);
}

/* Dropdown Navigation font size level 1 */
#nav > ul > li > a,
#nav > ul.level_1 > li > span.active,
#nav > ul.level_1 >li > span.forward,
#nav > ul.level_1 > li > strong.active,
#nav > ul.level_1 >li > strong.forward {
    font:1.6rem/7rem "Ubuntu", sans-serif;;
    font-weight:bold;
    color:#ff4488;
}

/* Dropdown Navigation font size level 2 */
#nav li ul.level_2 a,
#nav ul.level_2 li span.active,
#nav ul.level_2 li strong.active {
    color:#ff4488;
}

/* Dropdown Navigation hover level 2 */
#nav li ul li a:hover,
#nav li ul:not( :hover ) li.active a {
    background-color:#ff4488;
}

/* Dropdown Navigation expand arrow */
#nav a.submenu:after,
#nav span.submenu:after,
#nav strong.submenu:after {
    border-top-color:#ff4488;
}

/* Subnavigation */
.mod_navigation.subnav > ul > li a:hover,
.mod_navigation.subnav > ul > li.active span,
.mod_navigation.subnav > ul > li.active strong {
    background-color:rgba(255, 68, 136, 0.1);
}
.color-1 {
    background-color:#252427;
}
.color-2 {
    background-color:#ff4488;
}
.color-3 {
    background-color:#198991;
}
.color-4 {
    background-color:#9933ff;
}
.color-5 {
    background-color:#ff9900;
}
.color-6 {
    background-color:#ffcc33;
}
.color-7 {
    background-color:#C1CEDC;
}
.color-8 {
    background-color:#648EBE;
}
.color-9 {
    background-color:#dedede;
}
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
    background-color:rgba(255, 68, 136, 0.1);
    border-top:0px solid #252427;
    border-right:0px solid #252427;
    border-bottom:1px solid #252427;
    border-left:0px solid #252427;
    color:#252427;
}

/* Cards */
.card,
.two-cards,
.three-cards,
.four-cards,
.five-cards,
.six-cards {
    background-color:#fff;
    border:1px solid rgba(37, 36, 39, 0.1);
    border-radius:3px;
    -webkit-transition: all .5s;
     transition: all .5s;
}
.mod_eventlist .layout_upcoming .info-block {
    background-color:rgba(255, 68, 136, 0.1);
}
.mod_eventlist .layout_upcoming .more a {
    background-color:#ff4488;
}
.mod_eventlist .layout_upcoming .more a:hover {
    background-color:rgba(255, 68, 136, 0.8);
}
.mod_eventlist .layout_upcoming .more a:before {
    color:#fff;
}
.mod_eventlist .layout_upcoming .more a:hover:before {
    color:rgba(255,255,255, 0.4);
}
.mod_eventlist .layout_upcoming p.info {
    border-color:#ff4488;
}

/* Event-Liste Datum erster Tag */
.mod_eventlist .layout_upcoming .month {
    color:#252427;
}

/* Event-Liste Datum erster Tag */
.mod_eventlist .layout_upcoming .day {
    color:#ff4488;
}

/* Datums-Label Highlights (Hintergrund) */
.mod_eventlist .highlights .date-label {
    background-color:#fff;
    -webkit-box-shadow:3px 3px 5px 0 rgba(0,0,0, 0.6);
    box-shadow:3px 3px 5px 0 rgba(0,0,0, 0.6);
}

/* Datums-Label Highlights */
.mod_eventlist .highlights .day {
    color:#ff4488;
}

/* Datums-Label Highlights */
.mod_eventlist .highlights .month {
    color:#ff4488;
}

/* Kalender – Events farblich hinterlegen */
.mod_calendar .event {
    margin-bottom:1px;
    padding-right:5px;
    padding-left:5px;
    border-radius:3px;
}

/* Kalender 1 */
.mod_calendar .event.cal_1 {
    background-color:rgba(37, 36, 39, 0.5);
}

/* Kalender 2 */
.mod_calendar .event.cal_2 {
    background-color:rgba(255, 68, 136, 0.5);
}

/* Kalender 3 */
.mod_calendar .event.cal_3 {
    background-color:rgba(25, 137, 145, 0.5);
}

/* Kalender 4 */
.mod_calendar .event.cal_4 {
    background-color:rgba(153, 51, 255, 0.5);
}

/* Kalender 5 */
.mod_calendar .event.cal_5 {
    background-color:rgba(255, 204, 51, 0.5);
}

/* Section Style 1 */
.style-1 {
    background-color:#9933ff;
    color:#ffffff;
}

/* Section Style 2 */
.style-2 {
    background-color:#C1CEDC;
    color:#648EBE;
}

/* Section Style 3 */
.style-3 {
    background-color:#ffcc33;
    color:#ffffff;
}

/* Section Style 4 */
.style-4 {
    background-image:url("files/school/images/header/Foerderverein_header.jpg");
    background-position:right center;
    background-repeat:no-repeat;
    background-attachment: fixed; background-size: cover; /*creates parallax effect (sort of). Disabled for tablet and small screens. */
}

/* Section Style 5 */
.style-5 {
    background-image:url("files/school/images/illustration/i5.jpg");
    background-position:center top;
    background-repeat:no-repeat;
    background-attachment: fixed; background-size: cover; /*creates parallax effect (sort of). Disabled for tablet and small screens. */
}

/* You can create complex gradients p.e. under http://angrytools.com/gradient */
.overlay-1:before {
    background-color:rgba(37, 36, 39, 0.9);
}
.overlay-2:before {
    background-color:rgba(255, 68, 136, 0.9);
}
.overlay-3:before {
    background-color:rgba(25, 137, 145, 0.9);
}
.overlay-4:before {
    background-color:rgba(153, 51, 255, 0.9);
}
.overlay-5:before {
    background-color:rgba(255, 153, 0, 0.9);
}
.overlay-6:before {
    background-color:rgba(255, 204, 51, 0.9);
}
.overlay-7:before {
    background-color:rgba(255,255,255, 0.4);
}
a.cboxElement:after {
    background-color:rgba(255, 204, 51, 0.7);
    background-image:url("files/school/css/files/icon-scale03.png");
}
a.linked_image:after {
    background-color:rgba(255, 204, 51, 0.7);
    background-image:url("files/school/css/files/icon-scale01.png");
}
.masonry_news a.teaser-text {
    color:#252427;
}
.more a:after,
p a:after,
a.hyperlink_txt:after {
    background-color:#ffcc33;
}
