/**
 *  Reset
 */

* { margin:0; padding:0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box; }
ul { margin-bottom:0; }
li { margin-left:1.25em; }

table caption { display:none; }
th { text-align:left; vertical-align:top; }
td { vertical-align:top; }
fieldset { border:0; }

iframe { border:0; }

address { margin-bottom:0; font-style:normal; }

hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }

/* CSS for Adaptive Images */
img, embed, object, video { max-width:100%; height:auto; }

::-webkit-input-placeholder { /* WebKit browsers */ color:#a0a0a0; }
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:#a0a0a0; opacity:1; }
::-moz-placeholder { /* Mozilla Firefox 19+ */ color:#a0a0a0; opacity:1; }
:-ms-input-placeholder { /* Internet Explorer 10+ */ color:#a0a0a0; }

::-moz-selection { background:#b3d4fc; text-shadow:none; }
::selection { background:#b3d4fc; text-shadow:none; }



/**
 *  General helper classes
 *
 *
 */

.hidden { display:none !important; visibility: hidden; }

.visuallyhidden { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto; }

.invisible { visibility: hidden; }

.clearfix:before,
.clearfix:after { content:" "; display:table; }

.clearfix:after { clear:both; }

.clearfix { *zoom: 1; }

.cursor-pointer { cursor:pointer; }

.debug-info { display:inline-block; position:fixed; top:40px; left:20px; border:1px solid gray; padding:3px; background-color:white; opacity:0.5; font-size:11px; z-index:9999;}

.navi li { list-style:none; margin-left:0; }
.navi-horizontal { display:flex; }

/* Modernizr */
.browserupgrade { margin:0.2em 0; background:#ccc; color:#000; padding:0.2em 0; }

/* Mediaqueries */
html { font-family:"default-screen"; }
body:after { content:"default-screen"; display:block; visibility:hidden; position:fixed; top:10px; left:20px; z-index:900;  border:1px solid #8a8a8a; padding:3px; background-color:white; opacity:0.75;  color:#8a8a8a; font-size:11px; }
body.debug:after { visibility:visible; }






/**
 *  The Layout
 *
 *  contains layout related style definitions
 */
.contentWrapper { width:100%; max-width:1440px; margin:0 auto; padding-left:2em; padding-right:2em; }
.contentWrapper.outer { max-width:1600px; }
.contentWrapper.inner { max-width:1000px; }

.pageHeader .contentWrapper { position:relative; display:flex; justify-content: space-between; }

.mainnavi { display:flex; justify-content: space-between; width:100%; padding: 0.5em 0; }



.pageContent .contentWrapper { display:flex;}
.pageContent .contentWrapper > div.main { flex:1 1 75%; max-width:75%; min-height:800px; padding-left:2em; }
.pageContent .contentWrapper > aside { flex:1 1 25%; width:25%; padding-left:2em; padding-right:2em; }

.pageFooter { margin-top:3em;}
.footernavi { display:flex; justify-content: center; width:100%; padding: 0.5em 0; }
.footernavi > li { margin:0 2em; }

#toggleMainnavi { position:absolute; right:1%; top:65px; z-index:120; width:31px; height:31px; color:transparent; background:#4d6b7b url('../Icons/mainnavi-toggleMainnavi-inverse.png') center center no-repeat; cursor:pointer; }
#toggleMobilenavi { display:none; position:absolute; right:2em; bottom:1em;  }
#toggleMobilenavi i { font-size:2em; cursor:pointer; }

.scrollToTop { position:fixed; left:0; bottom:2em; z-index: 90;  }

/**
 * Styling
 */
body { background-color:white; color:black; font-family:sans-serif; font-size:17px; font-weight:400; line-height:1.3; }

/*
Gelb: R 241, G 195, B 0
Rot: R 197, G 7, B 60
Lila: R 142, G 69, B 118
Orange: R 238, G 127, B 4
Hellgrün: R 134, G 181, B 87
Dkl.grün: R 69, G 152, B 82
Grau: 70 % Schwarz
*/
.fgcolor-yellow { color:rgb(241,195,0); }
.fgcolor-red { color:rgb(197,7,60); }
.fgcolor-lila { color:rgb(142,69,118); }
.fgcolor-orange { color:rgb(238,127,4); }
.fgcolor-lightgreen { color:rgb(134,181,87); }
.fgcolor-darkgreen { color:rgb(69,152,82); }
.fgcolor-gray { color:rgb(0,0,0,0.3); }

.bgcolor-yellow { background-color:rgb(241,195,0); }
.bgcolor-yellow-light { background-color:rgb(241,195,0,0.3); }
.bgcolor-red { background-color:rgb(197,7,60); }
.bgcolor-red-light { background-color:rgb(197,7,60,0.3); }
.bgcolor-lila { background-color:rgb(142,69,118); }
.bgcolor-lila-light { background-color:rgb(142,69,118,0.3); }
.bgcolor-orange { background-color:rgb(238,127,4); }
.bgcolor-orange-light { background-color:rgb(238,127,4,0.3); }
.bgcolor-lightgreen { background-color:rgb(134,181,87); }
.bgcolor-darkgreen { background-color:rgb(69,152,82); }
.bgcolor-gray { background-color:rgb(0,0,0,0.3); }



.mainnavi { background:white url('https://handbuch-klimaschutz.de/assets/images/Web_Navi_Line.png') bottom center no-repeat; }

.logo figure a { display:block; }
.mainnavi > li { margin:0 2em; padding:0.5em 0; line-height:1.0; }
.mainnavi > li a { color:black; font-weight:700; text-decoration:none; text-transform:uppercase; }
.no-touchevents .mainnavi > li a:hover,
.mainnavi > li.active a { color:rgb(0,168,194); }

.anchornavi { margin-top:1em; margin-bottom:2em; }
.anchornavi > li { padding:0.125em 1em; border-right:1px solid rgb(0,168,194); }
.anchornavi > li:first-child { padding-left:0; }
.anchornavi > li:last-child { border-right:none; }
.anchornavi a { color:rgb(0,168,194); text-decoration:none; }

.anchorsubnavi a { text-transform:uppercase; text-decoration:none; font-weight:700; }

h1 { margin-top:2em; margin-bottom:2em; color:rgb(0,168,194); font-size:1.1764705em; font-weight:700; text-transform:uppercase; }
.frame-type-anchor h1 { font-weight:400; text-transform:none; }
h2 { margin-top:2em; margin-bottom:2em; font-size:1.1764705em; font-weight:700; }
.headline-no-margin-bottom { margin-bottom:0.25em;}
.headline-no-margin-top { margin-top:0;}
h3 { margin-top:1em; margin-bottom:1em; font-size:1em; font-weight:700; }

p,li { line-height:1.8; }
p { margin-bottom:1em;  }
li { margin-bottom:0.25em;  }
aside p { line-height:2.0; }
.frame ul { list-style-image:url('https://handbuch-klimaschutz.de/assets/icons/Icon_Arrow-Right.png'); }
.frame ul li { margin-left:2.0em; }
button { padding:0.5em 2em; color:black; font-size:1.1764705em; font-weight:700; border-radius:20px; border:0px solid rgb(194,214,125); background-color:rgb(194,214,125); cursor:pointer;
    -ms-transition:0.4s; -moz-transition:0.4s; -webkit-transition:0.4s; -o-transition:0.4s; transition:0.4s;
}

.no-touchevents button:hover { color:white; }

a { color:rgb(0,168,194); -ms-transition:0.4s; -moz-transition:0.4s; -webkit-transition:0.4s; -o-transition:0.4s; transition:0.4s; }
a.external-link { font-weight:700; text-decoration:none; }
a.download { display:inline-block; padding-top:0.25em; padding-left:2em; font-weight:700; background:url('https://handbuch-klimaschutz.de/assets/icons/Icon_Arrow-Right.png') left top no-repeat; text-decoration:none;}


.frame { overflow:hidden; }
.frame.padding { padding:2em; }

.frame-space-before-extra-small { margin-top:1em; }
.frame-space-before-small { margin-top:2em; }
.frame-space-before-medium { margin-top:3em; }
.frame-space-before-large { margin-top:4em; }
.frame-space-before-extra-large { margin-top:5em; }
.frame-space-after-extra-small { margin-bottom:1em; }
.frame-space-after-small { margin-bottom:2em; }
.frame-space-after-medium { margin-bottom:3em; }
.frame-space-after-large { margin-bottom:4em; }
.frame-space-after-extra-large { margin-bottom:5em; }

.frame-type-textmedia .media { display:flex; }
.ce-flexwrap .media { flex-wrap:wrap; }
.frame-type-textmedia .media[data-cols="3"] figure { flex: 1 1 25%; max-width:25%; margin-bottom:2em; }
.frame-type-textmedia .media[data-cols="3"] figure:nth-child(3n-1) { margin-right:calc(50% - 1.5 * 25%) }
.frame-type-textmedia .media[data-cols="3"] figure:nth-child(3n-2) { margin-right:calc(50% - 1.5 * 25%) }
.frame-type-textmedia .media[data-cols="3"] figure img { width:100%; }
.ce-left { display:flex; flex-wrap:wrap; }
.ce-left header { flex:1 1 100%; }
.ce-left .media { flex: 1 1 calc(128px + 2.5em); max-width: 128px; margin-right:2.5em; padding-top:0.25em; }
.ce-left .text { flex: 1 1 calc(100% - 1238px - 4.5em); max-width: calc(100% - 128px - 4.5em); }

.ce-top { display:flex; flex-direction: column; }
.ce-top .media { padding-top:2em; padding-bottom:2em; }
.ce-top .media.no-padding-bottom { padding-bottom:0; }

.ce-center .media figure { margin:0 auto; }
.ce-bottom { display:flex; flex-direction: column-reverse; }
.ce-bottom .media { padding-top:2em; padding-bottom:2em; }
figcaption { font-weight:700; }

.frame-type-textillustrated .icon img { display:block; margin:0 auto; }
.frame-type-textillustrated.frame-with-bgcolor { position:relative; padding-top:5em; }
.frame-type-textillustrated.frame-with-bgcolor .icon { position:absolute; top:0; left:calc(50% - 100px) }
.frame-type-textillustrated.frame-with-bgcolor .icon figure { margin:0 auto; }
.frame-type-textillustrated.frame-with-bgcolor .text { padding:2em; }
.frame-type-textillustrated h2 { text-transform:uppercase; }

.frame-type-columns[data-cols="2"] { display:flex; }
.frame-type-columns[data-cols="2"] > div { flex:1 1 50%; }


.form-fieldwrap { margin:1em 0; }
input[type=text],
input[type=email] { min-width:400px; padding:0.5em 1.0em; border:none; background-color:#f0f0f0; font-size:1.125em; font-weight:700; border-radius:20px; }
input[type=text]:focus,
input[type=email]:focus { border:1px solid rgb(0,168,194); }
input[type=submit] { padding:0.5em 2em; color:black; font-size:1.1764705em; font-weight:700; border-radius:20px; border:0px solid rgb(194,214,125); background-color:rgb(194,214,125); cursor:pointer;
    -ms-transition:0.4s; -moz-transition:0.4s; -webkit-transition:0.4s; -o-transition:0.4s; transition:0.4s; }
.no-touchevents input[type=submit]:hover { color:white; }

hr { margin-left:-2.5em; border:none; border-top:1px solid black; }

.scrollToTop { border:none; border-bottom-right-radius:20px; border-top-right-radius:20px; padding:0.5em 1em; background-color:#00a8c2; color:black; font-weight:700; text-decoration: none; }

.pageFooter .contentWrapper { padding-top:0.5em; padding-bottom:2em; background:url('https://handbuch-klimaschutz.de/assets/images/Web_Navi_Line.png') top center no-repeat; }

.footernavi > li { padding:0.5em 0; line-height:1.0; }
.footernavi > li a { color:black; font-weight:700; text-decoration:none; text-transform:uppercase; }
.no-touchevents .footernavi > li a:hover,
.footernavi > li.active a { color:rgb(0,168,194); }
.footernavi > li.no-padding-top { padding-top:0; }

/* mfp */
.mfp-white-popup { padding:20px; background:url('https://handbuch-klimaschutz.de/assets/images/bg_overlay.png'); }
.magnificpopup-ajax { display:block; position:relative; }
.layer-above { position:absolute; top:0; left:0; width:250px; height:250px; }
.mfp-container { padding: 0 2em;  }
.mfp-white-popup .mfp-content { max-width:960px; padding-bottom:2em; padding-left:2em; padding-right:2.5em; padding-top:2.5em; border-radius:5px; background-color:white; }
button.mfp-close { top:1em; right:1em; z-index:100; border:1px solid #ddd; box-shadow: 0 0 2px 2px #ddd; background-color:#00a8c2; }
.mfp-top { display:flex; align-items: end; }
.mfp-left { flex:1 1 250px; }
.mfp-right { flex:1 1 58%; margin-left:2em; margin-bottom:2em; padding-bottom:1.2em; background:transparent url('https://handbuch-klimaschutz.de/assets/icons/Icon_fuer-Sprechblase.png') 10% bottom no-repeat; }
.mfp-right p { padding:1em; border-radius:20px; background-color:#00a8c2; color:white; line-height:1.6; }
.mfp-left img { width:250px; height:auto; }
.mfp-left figcaption { font-weight:400; }
.mfp-bottom { width:75%; margin-top:2em; }

/* cookieconsent banner */
.cc-compliance { flex-direction:row-reverse; }
.cc-window.cc-floating { padding:2em; max-width:100%; }
.cc-revoke { padding:0.5em 2em; }
.cc-window .cc-message { padding-right:2em; }
.cc-window .cc-message,
.cc-revoke { left:auto !important; right:3em; font-size:0.875em; }
.cc-btn { max-width:200px; min-width:120px; padding:0.25em 0.8em; line-height:1; }
.cc-dismiss { position: relative; left:1.0em; display:inline-block; min-width:auto; margin-left:1em; }
.cc-highlight .cc-btn.cc-dismiss { background-color:#b0b3b5; }
.no-touch .cc-highlight .cc-btn.cc-dismiss:hover { background-color:#808385; }

/* change 21.2.2020: disable dismissing */
.cc-btn.cc-dismiss { display:none; }
.cc-revoke { display:none; }


@media only screen and (max-width:1000px ) {
    .mainnavi > li { margin:0 1em; }
    .mainnavi > li,
    .anchornavi > li { font-size:0.82353em; }

    .cc-window.cc-banner { -ms-flex-direction:column; flex-direction:column; }
    .cc-window.cc-floating { max-width:100%; }
    .cc-window .cc-message { margin-bottom:2em; padding-right:0; }
    .cc-window.cc-banner { -ms-flex-align:unset; align-items:unset }
    .cc-window .cc-message,
    .cc-revoke { font-size:1.0em; }
}
