/*
2025
sustainable-v1.css
Partner pages:
*/
@font-face {font-family: 'ProximaNova'; src: url(/good_includes/fonts/ProximaNovaRegular.otf) format('opentype');}
html {
    --color-wit:#fff;
	--color-standaardgrijs:#ccc;
    --color-lichtergrijs:#d0d0d0; 
	--color-grijsblauw:#73AFB7;
    --color-donkerblauw:#0D4B5B;
}
body .main.txt {font-size: 16px;}

/* email en socials /email/solar2025/ */
body.BodySolar2025 {background: #ebebeb}
.topContainer {background: var(--color-wit);}
.CompMailWrapper {position: relative; border: 0 !important; box-shadow: 0 0 10px var(--color-lichtergrijs) !important; border-radius: 2em;  }
.CompMailWrapper:before {content:'Example of the invitation email'; position: absolute; top: 0; left: 0; width: 100%; height: 3em; line-height: 3em; text-align: center;  font-size: 1.5em; font-weight: bold; color: var(--color-wit); background: var(--color-donkerblauw);  border-top-left-radius: 2rem; border-top-right-radius: 2rem; }
.German .CompMailWrapper:before {content:'Beispiel Einladungs-E-Mail';}
.CompMailContent {padding-top: 5em;}
.CompMailContent .wepButton {background: var(--color-grijsblauw);}
.CompMailContent h2 {line-height: 1em;}
.CompMailContent p a {color: var(--color-donkerblauw);}
.CompMailContent p a:hover {color: var(--color-grijsblauw);}
.CompMailContent .wepArticle {border-radius: 2em; box-shadow: 0 0 10px #aaa !important; }
.CompMailContent .wepArticle .wepContent {padding: 1em 0 2em 0;}
.CompMailContent .wepArticle .wepContent .txtCopy.btnCopyTxt {margin: 1em 1em 0 0;}

.innerWrapper {max-width: 1800px}

.sectionBg:not(.section100) .eenkolom .main.txt {flex-basis: calc(100% - 2vw); max-width: 1220px; flex-shrink: 0; margin: 0 auto 2vw auto; padding: 0 0 1em 0; align-self:top;  }
.sectionBg.section100 .eenkolom .main.txt {text-align: left;}
.tweeKolommen.tekstTekst .main.txt {flex-basis: calc(50% - 2vw); flex-shrink: 0; margin: 0 1vw 2vw 1vw; padding: 0 0 1em 0 !important; align-self:top; text-align: left; }
.tweeKolommen.tekstTekstTekst .main.txt {flex-basis: calc(33% - 2vw); flex-shrink: 0; margin: 0 1vw 2vw 1vw;padding: 0 0 1em 0; align-self:top; text-align: left;}
.eenkolom .main.txt, .tweeKolommen.tekstTekst .main.txt, .tweeKolommen.tekstTekstTekst .main.txt {background: var(--color-wit); border-radius: 2rem; padding: 0 0 20px 0; filter: drop-shadow(0px 0px 10px var(--color-lichtergrijs));}
/* back to Dashboard */ .section100 .eenkolom .main.txt {width: 100%; background: none; filter: none; padding: 2vw 0 0 0;}

.main.txt h1 {width: 100%; font-size: 1.5625em; text-align: center; padding: 1em 1.43em; margin:0 0 1em 0; color: var(--color-wit); background:var(--color-donkerblauw); border-top-left-radius: 2rem; border-top-right-radius: 2rem; }
.main.txt h2 {width: 100%; font-size: 1.5625em; text-align: center; padding: 1em 1.43em; margin:0 0 1em 0; color: var(--color-wit); background:var(--color-donkerblauw); border-top-left-radius: 2rem; border-top-right-radius: 2rem;}
    .eenkolom .main.txt h2 {all: unset; font-family: 'ProximaNova', sans-serif; font-weight: bold; display: inline-block; font-size: 1.43em;  padding:0.75em 1.5em; margin: 1em; color: var(--color-wit); background: var(--color-donkerblauw); border-radius: 1.5em;}

.main.txt h3 {color: var(--color-tekst);font-size: 1.375em; padding: 0 1em; margin-bottom: 0.5em; }
.main.txt p {font-size: 1em; padding: 0 1.43em}
.main.txt a {font-weight: normal; color: var(--color-donkerblauw); text-decoration: none; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word;}
.main.txt p a:hover {color: var(--color-grijsblauw)}
.main.txt ul {font-size: 1em; padding: 0em 1.43em 2em 4em; margin: 0;}
.main.txt ul li {font-size: 1em;}
.main.txt ul li:before {color: var(--color-tekst)}
.main.txt table td {vertical-align: top;}

a.wepButton {background: var(--color-grijsblauw); font-family: 'ProximaNova', sans-serif; font-weight: bold !important; font-size: 1em; color: var(--color-wit) !important; border: solid 0px var(--color-basis); white-space:nowrap; width:fit-content; max-width: calc(30vw - 3em); overflow: hidden; text-overflow: ellipsis; padding: 5px 30px; margin: 0 auto; /*left: 50%; transform: translate(-50%,0%);*/}
a.wepButton:after {content: none;}
a.wepButton:hover {font-family: 'ProximaNova', sans-serif; font-weight: bold !important; border: solid 0px var(--color-basis); background: var(--color-donkerblauw); color: var(--color-wit);}
/* back to Dashboard */ .section100 a.wepButton {margin: 0 auto 0 0px; left: 0%; transform: translate(0%,0%);}
/* back to Dashboard */ .section100 a.wepButton:before {content:"\f053 \f053"; font-family: "FontAwesomeSolid"; padding-right: 10px; }

/* form */
iframe {border: 0}
/* kan weg in layout form: http://dusseldorf.solarsolutions.hetwep.nl/good-solar-solutions-de/_Formulieren/adressen-verzenden/css/form_v2.css */
.uploadBox {all: unset; }
.FormClass p {color:var(--color-tekst); margin-bottom: 0.5em;}
.FormClass input[type="text"] {font-family: 'Montserrat-Regular', sans-serif; font-size: 1em; height: 2em; padding-left: 20px; text-transform: none; border: none; border-radius: 1.5em; -webkit-box-shadow: 0 0 5px var(--color-standaardgrijs); -moz-box-shadow: 0 0 5px var(--color-standaardgrijs); box-shadow: 0 0 5px var(--color-standaardgrijs); }
.inputfile + label { width: calc(100% - 30px); height: 1.5em; font-family: 'Montserrat-Regular', sans-serif; font-size: 1em; text-transform: none; color:var(--color-wit); background-color:var(--color-grijsblauw); border-radius: 1.5em; margin-bottom: 0.5em;}
.inputfile:hover + label {background: var(--color-donkerblauw)}
.inputfile + label svg {fill:var(--color-wit);}
.FormClass #Verzenden {width: auto; font-family: 'Montserrat-Regular', sans-serif; font-size: 1em; text-transform: none; color: var(--color-wit); background: var(--color-grijsblauw);border-radius: 1.5em; } 
.FormClass:hover #Verzenden {color: var(--color-wit); background: var(--color-donkerblauw)} 

.uploadBox {all: unset; }
.FormClass p {color:var(--color-tekst); margin-bottom: 0.5em;}
.FormClass input[type="text"] {font-family: 'Montserrat-Regular', sans-serif; font-size: 1em; height: 2em; padding-left: 20px; text-transform: none; border: none; border-radius: 1.5em; -webkit-box-shadow: 0 0 5px var(--color-standaardgrijs); -moz-box-shadow: 0 0 5px var(--color-standaardgrijs); box-shadow: 0 0 5px var(--color-standaardgrijs); }
.inputfile + label { width: calc(100% - 30px); height: 1.5em; font-family: 'Montserrat-Regular', sans-serif; font-size: 1em; text-transform: none; color:var(--color-wit); background-color:var(--color-grijsblauw); border-radius: 1.5em; margin-bottom: 0.5em;}
.inputfile:hover + label {background: var(--color-donkerblauw)}
.inputfile + label svg {fill:var(--color-wit);}
.FormClass #Verzenden {width: auto; font-family: 'Montserrat-Regular', sans-serif; font-size: 1em; text-transform: none; color: var(--color-wit); background: var(--color-grijsblauw);border-radius: 1.5em; } 
.FormClass:hover #Verzenden {color: var(--color-wit); background: var(--color-donkerblauw)} 

footer .main.txt ul {padding: 0; margin: 0;}
footer li.smChannel#smChLI {padding: 0; margin: 0 0 0 1.43em;}
footer li.smChannel#smChLI:after {font-size: 2em;}

@media screen and (max-width:1700px){
    .main.txt table td {display: block}
}
@media screen and (max-width:1240px){
    .eenkolom .main.txt {flex-shrink: 0; margin: 0 1vw 2vw 1vw;};
    .tweeKolommen.tekstTekstTekst .main.txt {flex-basis: calc(50% - 2vw);}
	.tweeKolommen.tekstTekstTekst .main.txt:last-of-type {flex-basis: calc(100% - 2vw); max-width: calc(50% - 2vw); margin: 2vw auto;}
    a.wepButton {max-width: calc(50vw - 5em); }
}
@media screen and (max-width:840px){
    .tweeKolommen.tekstTekstTekst .main.txt {flex-basis: calc(100% - 2vw); max-width: calc(100% - 2vw);}
	.tweeKolommen.tekstTekstTekst .main.txt:last-of-type {flex-basis: calc(100% - 2vw); max-width: calc(100% - 2vw);}
    a.wepButton {max-width: calc(100vw - 3em); }
    .tweeKolommen.tekstTekst .main.txt h2 {font-size: 1.5625em;}
}