/**
 * SolarMap - Pluggable app for the SolarMap Project
 * @version v2.3.9
 * @license Copyright © 2017 GIM
 */

/*----------------------------------------*/
/* open layers styles */
/*----------------------------------------*/

html, body, #map {
    font-family: 'Flanders Art Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}
/* Uw selectie popup on the map desingating the selected building */
.ol-popup {
    background-color: white;
    border-color: #cccccc;
}

/*----------------------------------------*/

/* copyright notice */
#map .ol-attribution {
    background: rgba(0,0,0,0) !important;
}

/* copyright symbol */
#map .ol-attribution ul {
    font-size: .8em !important;
    color: #fff !important;
}

/* link to VEA Information Vlaanderen VITO website*/
#map .ol-attribution ul a,
#map .ol-attribution ul a:HOVER {
    color: cornflowerblue !important;
}


/* scale text for main map, selectionmap and plaatsingmodulemap */
.ol-scale-line-inner {
    color: #eee !important;
    font-size: 10px !important;
}
/* color of scale line for main map, selectionmap and plaatsingmodulemap*/
.ol-scale-line-inner {
    border-color: #eee !important;
}


/* color of the locate symbol */
#map .find-me-control .find-me-icon {
    color: white;
}
/* color of + and - zoom buttons on map */
.ol-control button {
    color: white;
}

/* Address search, error popup and layer manager */
md-card.md-vea-theme-theme {
    background-color: rgb(255,255,255) ;
}


/* background-color of loading squares */
#splash { background-color: #ddd; }


/* color of the 4 loading squares */
@keyframes blink {
    0% { background-color: #777; }
    70% { background-color: #aaa; }
    100% { background-color: #777; }
}
@-webkit-keyframes blink2 {
    0% { background-color: #777; }
    70% { background-color: #aaa; }
    100% { background-color: #777; }
}
@-moz-keyframes blink3 {
    0% { background-color: #777; }
    70% { background-color: #aaa; }
    100% { background-color: #777; }
}
@-o-keyframes blink3 {
    0% { background-color: #777; }
    70% { background-color: #aaa; }
    100% { background-color: #777; }
}

/* background-color of the map */
body{
    background-color: #bfbfbf !important;
}

/*----------------------------------------*/
/* RESPONSIVE DESIGN
*/
/* address in the uwselectie block on details page*/

.responsive-uwselectie-left .responsive-uwselectie-adr div.adr-block {
    font-weight: normal;
    font-size: 20px;
}



/**
* MEDIUM DEVICE
*/
@media all and (max-width: 1140px) {
    /* address in the uwselectie block on details page*/
    .responsive-uwselectie-left .responsive-uwselectie-adr div.adr-block {
        margin-top: 20px !important;
        font-size: 18px;
    }
    /* explanatory italic text right under Zonnepanelen en Zonneboiler */
    .ital { font-size: 13px !important; }
    /* size of icon of Ideaal on the uwSelectie */
    .icon-xxl { font-size: 50px !important; }
    /* font size of the use class span so "Ideaal" text */
    .use-class span { font-size: 28px !important; }
    /* color line delimiter between result item of Zonnepanelen or Zonneboiler */
    li.li-result {
        border-color: #ddd;
    }
    /* result item value (the numbers) of Zonnepanelen or Zonneboiler */
    li.li-result .li-result-value {
        font-size: 20px;
    }
    /* section titles for calculations of Zonnepanelen or Zonneboiler in edit mode */
    h4.calcul-section {
        font-size: 14px !important;
    }
}

/**
* SMALL DEVICE
*/
@media all and (max-width: 780px) {
    /* Button text on the uw selectie image to switch between Gebouw, Dakdeel and Zoninstraling*/
    button.rotator {
        font-size: 11px !important;
    }

    li.li-result .li-result-value {
        font-size: 20px;
    }

    /* font size of the use class span so "Ideaal" text */
    .use-class span { font-size: 28px !important; }

    /* all titles on details page: Ontwerp op uw dak, Bekijk rapport, Vind een installateur, Zonnepanelen, Uw selectie
       title of layer manager on map page */
    .pane-top {
        font-size: 18px !important;
    }
}



/* links for installateurs, address-popup */
a:HOVER { color: #105269 !important; }
a.underlined-link { color: #6b6c6d; text-decoration: underline; }
a.underlined-link:HOVER { color: #105269; text-decoration: none; }




/*--------------------------------*/
/* primary button theme so Bereken uw zonnewinst on map, Personaliseer berekening etc on details page
*/
button.md-primary:NOT(.primary-button-pristine) { background-color: #728f9b !important; }
button.md-primary[disabled] { background-color: #B8C7CD !important; }

/* responsive design configuration of pm-show-toolbar: color of cogs */
.white { color: #fff !important; }


/* Background-switcher on responsive design transparant backgound */
.responsive-map-wmts {
    background-color: rgba(0,0,0,0.6);
}


/* popup for info message on the map
eg. selecting 2 buildings from a different parcel or select a building
*/
.footer-popup > md-card {
    border: solid 1px #105269;
    color: #105269;
}
/* exclamation icon on error popup */
.footer-popup md-icon {
    font-size: 36px;
    color: #105269;
}

/*----------------------------------------*/
/* address search on the map
*/

/* address search on map as part of the layer manager line between x and (?)  */
.map-layers form { border-color: #ddd; }
/* background-color of the autocomplete of the search */
.map-layers form > md-autocomplete { background-color: #fff; }


/*----------------------------------------*/
/* base map
 */

/* background of unselected basemap background switcher*/
.baseMap {
    border: 3px solid #fff;
    background: #3498db;
    background-color: transparent;
}
.baseMap.selected {
    border-color: #0080c0;
}

.baseLabel {
    background-color: rgba(0, 0, 0, 0.4);
    color: #fff;
}

/*----------------------------------------*/
/* address popup as first screen
*/
/* background color on which the popup should show up */
#popup-address {
    background-color: rgba(0,0,0,.5);
}
/* background-color of the popup and the border-color*/
.popupaddress-body {
    border-color: #105269;
    background-color: #fff;
}
/* color of the address pop faq link */
.popupaddress-body .pa-faq {
    background-color: #105269;
}
/* title of the popup Welkom!*/
.popupaddress-body .pa-header {
    font-size: 20px;
    font-weight: bold;
    color: #105269;
}
/* red text warning under search address*/
.quickSearchWarning {
    color: #c83c22;
    font-size: 13px;
}
/* footer of the address popup with direct link to map */
.popupaddress-body .pa-footer {
    color: #105269;
    font-size: 11px;
}

/*----------------------------------------*/
/* collapsible elements of layer manager
*/


/* color of the layermanager titles: Toon geschiktheid per gebouw*/
.collapsible-header {
    background-color: rgba(220,220,220,.4);
}
/* color of the layermanager titles on hovering */
.collapsible-header:hover {
    background-color: rgba(220,220,220,.8);
}
/* color of the layermanager titles that is active*/
.collapsible-header.active {
    font-weight: bold;
    background-color: rgba(220,220,220,.8);
}
/* layout of chevron-down icon */
.collapsible-header i {
    width: 2rem;
    font-size: 0.8em;
}

/*----------------------------------------*/
/* notifications
*/

/* Text color of notifications */
.vea-notification {
    color: #fff;
}
/* info notifications */
.vea-notification.notif-info {
    border-left: 6px solid #105269;
    background-color: #728F9B;
}
/* warning notifications */
.vea-notification.notif-warn {
    border-left: 6px solid #c83c22;
    background-color: #eba285;
}
/* success notifications */
.vea-notification.notif-success {
    border-left: 6px solid #4aa832;
    background-color: #9ccf90;
}

/* x icon on notification */
.vea-notification.notif-info md-icon { color: rgba(16, 82, 105, .7); }
.vea-notification.notif-info md-icon:HOVER { color: rgba(16, 82, 105, 1); }
.vea-notification.notif-warn md-icon { color: rgba(200, 60, 34, .7); }
.vea-notification.notif-warn md-icon:HOVER { color: rgba(200, 60, 34, 1); }
.vea-notification.notif-success md-icon { color: rgba(74, 168, 50, .7); }
.vea-notification.notif-success md-icon:HOVER { color: rgba(74, 168, 50, 1); }

/*----------------------------------------*/
/* details page - Uw selectie
*/

.ital {
    font-style: italic;
}



#details button.backToMap {
    font-size: 16px;
}
/* on a wrong address*/
.negative,
.negative:VISITED {
    font-size: 14px;
    color: lightsteelblue;
}
.negative:HOVER {
    color: #fff !important;
}

/* form on wrong address*/
.adr-container {
    font-size: small;
}
/* text next to Ideaal icon */
.use-class span {
    font-size: 40px;
}

.use-class p {
    font-size: 12px !important;
}
/* size of Ideaal icon*/
.icon-xxl {
    font-size: 70px;
    display: table;
}

/* navigation pane on the map page
and different pane on the details page like Zonnepanelen, Zonneboiler, Uw selectie...*/
.pane {
    background-color: #fff;
}
/* title of the panes */
.pane-top {
    background-color: #105269;
    color: white;
    font-size: 24px;
    font-weight: bold;
}
.pane-top.blocked {
    background-color: #728f9b;
    color: rgba(255,255,255,0.87);
}
.pane-top span {
    line-height: 3rem;
}
.pane-top-error {
    background-color: #c83c22;
}

.green {
    background-color: #4aa832;
    color: #fff;
}
/* color of text and background from a pane */
.pane-body {
    color: #6b6c6d;
    background-color: #f2f2f2;
    position: relative;
}



.collapsible.discrete > li.pane > .collapsible-header:HOVER,
.collapsible.discrete > li.pane > .collapsible-header.active {
    background-color: #105269;
}


/* meer info on right hand side of the title of the pane*/
.more-info {
    font-weight: normal;
    font-size: 16px;
}
/*----------------------------------------*/
/*REPORT
 */

/* result of Zonnepanelen as li-items separated by line*/
li.li-result {
    border-top: solid 1px #ddd;
}
/* numeric value of result*/
li.li-result .li-result-value {
    font-size: 22px;
}
/* report button*/
.report-btn {
    border: solid 1px #ccc;
}


/*----------------------------------------*/
/* plaatsingmodule section
*/

/* placingmodule map*/
#map-placingmodule {
    border: 1px solid #bbb;
    background-color: #eee;
}

/* Explanation Box on placingmodule while hovering dakdeel*/
.hovered-rs-properties {
    background-color: #555;
    color: #fff;
}

/* right form panel of the placingmodule */
.sidenav-pmtoolbar > md-content {
    background-color: #f2f2f2;
}

/* cogwheel on placingmodule  for responsive design*/
.pm-show-toolbar {
    background-color: #555;
}

/* loading bar on placingmodule when running the optimised placement*/
.determinate-loading-bar {
    background-color: #728f9b;
}

/* calculate sections captions on ZP, ZB, PM panel */
h4.calcul-section {
    font-weight: bold;
    font-size: 16px !important;
    text-transform: uppercase;
}