/* Huisstijl van Stichting Woekerpolisproces (woekerpolisproces.nl), zodat hun deelnemers de omgeving
   herkennen. Geldt alleen onder body.stichting: een dossier van de stichting of de link
   ?dossier=woekerpolisproces.
   Kleuren uit hun template: koraal #d45f4a (koppen), #c4513c voor vlakken met witte tekst (zelfde
   koraal, iets dieper voor leesbaarheid), donker #ac3d28, blauwgrijs #d8e5eb; Source Sans Pro. */

@font-face {
    font-family: 'sourcesanspro';
    src: url('../fonts/sourcesanspro/SourceSansPro-Light-webfont.woff') format('woff');
    font-weight: 300;
}

@font-face {
    font-family: 'sourcesanspro';
    src: url('../fonts/sourcesanspro/SourceSansPro-Regular-webfont.woff') format('woff');
    font-weight: 400;
}

/* Pagina */
body.stichting,
body.stichting #wrapper {
    background-color: #d8e5eb;
}

/* main.css zet het lettertype ook op form, en die omvat de hele pagina */
body.stichting,
body.stichting form {
    color: #666;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
    font-size: 15px;
}

body.stichting h1,
body.stichting h2,
body.stichting h3,
body.stichting h4 {
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif !important;
    font-weight: 300;
    color: #d45f4a;
}

body.stichting h1 {
    font-size: 34px;
}

body.stichting .maincontent a,
body.stichting .main-leftsidemenuelement a,
body.stichting .PersonalInfo a,
body.stichting .PersonalInfoMobile a {
    color: #c4513c;
}

body.stichting .maincontent a:hover,
body.stichting .main-leftsidemenuelement a:hover,
body.stichting .PersonalInfo a:hover,
body.stichting .PersonalInfoMobile a:hover {
    color: #ac3d28;
}

/* Kop: het logo op de blauwgrijze achtergrond, de gegevens van het dossier in een licht vlak */
body.stichting .headerFix {
    border-bottom-color: transparent;
}

/* Zoals op woekerpolisproces.nl staat hun logo rechts, gelijk met het inhoudsvlak eronder (dat laat
   rechts één kolom vrij); links het varken vóór het inloggen en de gegevens van het dossier daarna */
body.stichting .headerFix .logo {
    float: right;
    text-align: right;
    margin-right: 8.333%;
}

body.stichting .header-search {
    float: left;
    padding-right: 15px;
}

body.stichting .header-search ul {
    padding-left: 0;
}

/* Breder mag, zodat het oude nummer achter het dossiernummer op één regel past */
body.stichting .PersonalInfo {
    float: left;
    margin-top: 26px;
    margin-right: 0;
    width: auto;
    min-width: 226px;
    padding-right: 10px;
}

body.stichting .PersonalInfo,
body.stichting .PersonalInfoMobile {
    background-color: rgba(255, 255, 255, 0.6);
    border: 0;
    border-radius: 3px;
    color: #666;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
}

body.stichting .PersonalInfo strong,
body.stichting .PersonalInfoMobile strong {
    color: #ac3d28;
    font-weight: 400;
}

body.stichting .lidmaatschaap {
    color: #d45f4a;
}

/* Menubalk, met het menu van woekerpolisproces.nl. De masterpage heeft beide menu's en de class op body
   kiest; !important omdat het mobiele menu inline open klapt. Zo ook teksten die per dossier verschillen
   (stichting: gebruikersnaam of e-mailadres). */
body:not(.stichting) .menu-stichting,
body:not(.stichting) .tekst-stichting,
body.stichting .menu-vereniging,
body.stichting .tekst-vereniging {
    display: none !important;
}

/* Zoals op woekerpolisproces.nl: geen balk maar grijze tekst, rechts gelijk met het logo en het
   inhoudsvlak; het actieve item koraal, bij aanwijzen een koraal vlak met witte tekst */
body.stichting #headerContainer,
body.stichting #MobileHeaderContainer {
    background-color: transparent;
}

body.stichting div.navigation {
    display: block;
    max-width: 1170px;
    padding: 0 15px;
}

/* min de marge en de binnenruimte van het laatste item, zodat de tekst eindigt waar het logo eindigt */
body.stichting div.navigation ul.menu {
    float: right;
    margin-right: calc(8.333% - 20px);
}

body.stichting div.navigation ul.menu li {
    height: 40px;
    margin: 5px 5px 5px 0;
    padding: 0;
}

body.stichting div.navigation ul.menu li a,
body.stichting div.navigation ul.menu li a:hover {
    height: 40px;
    color: #888;
}

body.stichting div.navigation ul.menu li a span {
    float: none;
    padding: 0 5px;
    line-height: 40px;
    font-size: 18px;
}

body.stichting div.navigation ul.menu li a span,
body.stichting .navigationMobile .menuMobile li {
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
    font-weight: 400;
}

body.stichting div.navigation ul.menu li.active {
    background-color: transparent;
}

body.stichting div.navigation ul.menu li.active a {
    color: #d45f4a !important;
}

body.stichting div.navigation ul.menu li:hover,
body.stichting .menuMobile li:hover,
body.stichting .menuMobile li:hover a {
    background-color: #d45f4a;
}

body.stichting div.navigation ul.menu li:hover a,
body.stichting .menuMobile li:hover a {
    color: #fff !important;
}

body.stichting .navigationMobile .menuMobile li a {
    color: #888;
}

body.stichting .navigationMobile .menuMobile li.active a {
    color: #d45f4a;
}

/* Mobiel: de menuknop los op de achtergrond, het opengeklapte menu in een licht vlak zoals de andere blokken */
body.stichting .responsiveMenuIcon {
    color: #c4513c;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
}

body.stichting .menuPaneel {
    overflow: hidden;
    margin: 0 15px 10px;
    padding-bottom: 0;
    background-color: rgba(255, 255, 255, 0.6);
    border-top: 0;
    border-radius: 3px;
}

/* Het menu links heeft zelf een licht vlak; in het paneel zou dat er dubbel op liggen */
body.stichting .menuPaneel .dossiermenu {
    background-color: transparent;
}

body.stichting .menuKop {
    color: #d45f4a;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
}

body.stichting .navigationMobile .menuMobile li,
body.stichting .menuPaneel #leftsidemenu ul li ul li {
    border-bottom-color: rgba(212, 95, 74, 0.2);
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
}

body.stichting .navigationMobile .menuMobile li:last-child {
    border-bottom: 0;
}

/* Zelfde grijs als de links naar de website */
body.stichting .menuPaneel #leftsidemenu a {
    color: #888 !important;
}

body.stichting .menuPaneel #leftsidemenu ul li ul li:hover {
    background-color: #d45f4a;
}

body.stichting .menuPaneel #leftsidemenu ul li ul li:hover a {
    color: #fff !important;
}

/* Inhoud en menu links in lichte vlakken, zoals de blokken op woekerpolisproces.nl */
body.stichting .maincontent,
body.stichting .sidemenuwidth,
body.stichting .sidemenuwidthsmall {
    background-color: rgba(255, 255, 255, 0.6);
    border: 0;
    border-radius: 3px;
}

body.stichting .maincontent {
    padding: 6px 25px 25px;
}

body.stichting .main-leftsidemenu p {
    color: #d45f4a;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif !important;
    font-weight: 300 !important;
    font-size: 22px !important;
    letter-spacing: 0;
}

body.stichting ul li ul li a {
    color: #c4513c !important;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
}

body.stichting #leftsidemenu ul li ul li {
    border-bottom-color: rgba(212, 95, 74, 0.2);
}

body.stichting ul li ul li:hover,
body.stichting ul li ul li.active {
    background-color: rgba(212, 95, 74, 0.07);
}

/* Formulieren */
body.stichting div.login,
body.stichting div.aanmelden {
    background-color: #fff;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}

body.stichting .control-label {
    color: #666;
    font-weight: 400;
}

body.stichting .form-control {
    border-color: #c9d9e1;
    box-shadow: none;
}

body.stichting .form-control:focus {
    border-color: #d45f4a;
    box-shadow: 0 0 0 3px rgba(212, 95, 74, 0.15);
}

body.stichting input[type="radio"],
body.stichting input[type="checkbox"] {
    accent-color: #d45f4a;
}

body.stichting input.submitButton {
    background-color: #c4513c;
    border-color: #c4513c;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 400;
    padding: 6px 16px;
}

body.stichting input.submitButton:hover {
    background-color: #ac3d28;
}

body.stichting .alert-info {
    background-color: #fbf3f0;
    border-color: #ebbcb4;
    color: #ac3d28;
}

body.stichting .help-block {
    color: #8a8a8a;
}

body.stichting .vw-upload-dropzone {
    border-color: #c4513c;
    color: #c4513c;
}

body.stichting .vw-upload-dropzone-text {
    color: #c4513c;
}

body.stichting .vw-upload-dropzone.vw-upload-dragover {
    background-color: #fbf3f0;
}

body.stichting .vw-upload-select {
    border-color: #c4513c;
    color: #c4513c;
}

body.stichting .vw-upload-select:hover {
    background-color: #c4513c;
    color: #fff;
}

/* Footer: licht, zoals op woekerpolisproces.nl, met de koppen in hun koraal. Het logo van de vereniging
   onderaan staat op een eigen lichtgrijs vlak en valt hier weg; de copyrightregel blijft. */
body.stichting #footerContainer {
    background-color: #c5d6de;
}

body.stichting #footerContainer .footer-container-section,
body.stichting #footerContainer .footer-container-section * {
    color: #4c5c65 !important;
}

body.stichting #footerContainer .footer-container-section h5,
body.stichting #footerContainer .footer-container-section h5 span {
    color: #c4513c !important;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif !important;
    font-weight: 300;
    font-size: 20px;
}

body.stichting #footerContainer .footer-container-section a {
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif;
    font-size: 13px;
}

body.stichting #footerContainer .footer-container-section a:hover {
    color: #c4513c !important;
}

body.stichting #footerContainer svg path {
    fill: #8a9ba4;
}

body.stichting .mk-shape-divider polygon {
    fill: #d8e5eb;
}

body.stichting .footerContainer2 {
    background-color: #d8e5eb;
}

body.stichting .footerContainer2 img {
    display: none;
}

body.stichting .copright span {
    color: #888 !important;
    font-family: 'sourcesanspro', Arial, Helvetica, sans-serif !important;
}

/* Het varken van woekerpolisproces.nl linksboven, voor de herkenning bij het inloggen; na het inloggen
   laat de masterpage het weg, en bij de vereniging staat het er niet */
.stichting-varken {
    display: none;
}

body.stichting .headerFix {
    position: relative;
}

/* links gelijk met het menublok eronder */
body.stichting .stichting-varken {
    display: block;
    position: absolute;
    top: 2px;
    left: 30px;
    width: auto;
    height: 126px;
}

@media screen and (max-width: 767px) {
    body.stichting .headerFix .logo {
        margin-right: 0;
    }

    body.stichting .stichting-varken {
        top: 12px;
        left: 10px;
        height: 72px;
    }
}