/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html{
    color: #222;
    font-size: 1em;
    line-height: 1.4;
    font-family:'f_r';
}
::-moz-selection{
    background: #b3d4fc;
    text-shadow: none;
}
::selection{
    background: #b3d4fc;
    text-shadow: none;
}
hr{
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
audio,
canvas,
iframe,
img,
svg,
video{
    vertical-align: middle;
}
fieldset{
    border: 0;
    margin: 0;
    padding: 0;
}
textarea{
    resize: vertical;
}
body{
    background:#fafafa;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

.box{
    padding: 10px;
    margin-bottom: 5px;
    border-radius:5px;
}
.box-error,
.box-valid,
.box-info{
    color: #FFF;
}
.box-warning{
    color: #FFF;
}
.box-error{
    background: #FF7474;
}
.box-valid{
    background: #2FB592;
}
.box-info{
    background: #00aced;
}
.box-warning{
    background: #FFAC74;
}
.box a{
    color:#FFF;
}
.box a:hover{
    text-decoration: none;
}
.box img{
    margin:5px 15px 5px 5px;
    box-shadow:2px 2px 2px rgba(0,0,0,0.2);
}
a{
    color:#fe5d47;
}
a:hover{
    color:#002637;
}
h1,
h2,
h4{
    padding:0;
    font-family:'f_b';
    font-size:1.5em;
    color:#002637;
}
h3{
    padding:0;
    font-family:'f_b';
    font-size:1.2em;
}
h1{
    margin:0 0 0 0;
}
h2{
    margin:0 0 3px 0;
}
h3{
    margin:0 0 5px 0;
}
h4{
    margin:0 0 8px 0;
}

.vet{
    font-family:'f_b';
}

a.button{
    text-decoration: none;
}
.button{
    padding:5px 8px 5px 5px;
    color:#FFF;
    font-size:1em;
    cursor: pointer;
    border-radius:5px;
    font-size:13px;
}
.button-disabled{
    opacity:.25;
    cursor:no-drop;
}
.button:not(.button-groen):not(.button-rood):not(.button-blauw):not(.button-oranje):not(.privacy):not(.button-wit){
    background:#062535;
    border:1px solid #062535;
}
.button:not(.button-groen):not(.button-rood):not(.button-blauw):not(.button-oranje):not(.button-disabled):not(.privacy):not(.button-wit):hover{
    color:#062535 !important;
    background:#b3e5fc;
    border:1px solid #062535;
}
.button-groen{
    background:#2FB592;
}
.button-groen:not(.button-disabled):hover{
    background:#217F65;
    color:#FFF !important;
}
.button-rood{
    background:#FF7474;
}
.button-rood:not(.button-disabled):hover{
    background:#B35151;
    color:#FFF !important;
}
.button-blauw{
    background:#00aced;
}
.button-blauw:not(.button-disabled):hover{
    background:#0074A6;
    color:#FFF !important;
}
.button-oranje{
    background:#FFAC74;
}
.button-oranje:not(.button-disabled):hover{
    background:#B37851;
    color:#FFF !important;
}
.button-small{
    padding:2px;
    color:#FFF !important;
    font-size:12px;
    cursor:pointer;
}
.button-wit{
    background:#FFF !important;
    color:#062535;
}
.button-wit:hover{
    background:#00aced !important;
    color:#000 !important;
}
input[type=text],
input[type=password],
textarea{
    padding:5px;
    font-size:13px;
    font-family:'f_r';
    border:1px solid rgba(0,0,0,0.08);
}
input[type=text]:hover,
input[type=password]:hover,
textarea:hover{
    border:1px solid rgba(0,0,0,0.2);
}
input[type=text]:focus,
input[type=password]:focus,
textarea:focus{
    border:1px solid #00aced;
}
select{
    padding:2px 2px 2px 0px;
    font-size:13px;
    font-family:'f_r';
    border:1px solid rgba(0,0,0,0.08);
}
option{
    font-size:13px;
    font-family:'f_r';
    padding:3px;
}
input[type=submit]{
    border:none;
}

@media all and (max-width:600px){
    .navigatie{
        width:100% !important;
    }
}
.navigatie{

}
.pagina{
    font-family:'f_b';
    padding-right:5px;
}
.nummer,
.selected,
.punten{
    width:25px;
    text-align:center;
    height:25px;
}
.nummer a,
.selected a,
.punten a{
    color:#FFF;
    text-decoration: none;
    display:inline-block;
    width:100%;
}
.nummer{
    background:#062535;
}
.selected{
    background:#279bdd;
}
.punten{
    background:#062535;
}
.nummer:hover,
.punten:hover{
    background:#FFF;
}
.nummer:hover a,
.punten:hover a{
    color:#062535;
}

input.has-value{
    border:1px solid #2FB592;
    color:#2FB592;
}
input.has-value:hover{
    border:1px solid #217F65;
    color:#217F65;
}
input.w100{
    width:calc(100% - 10px);
}
.bold{
    font-family:'f_b';
}
.groen{
    color:#2FB592;
}
.rood{
    color:#e53935;
}
.blauw{
    color:#1e88e5;
}
.oranje{
    color:#fb8c00;
}

.icon-preview{
    display:inline-block;
    width:100px;
    background:#fff7f6;
    border-radius:5px;
    margin:0 5px 5px 0;
    font-size:10px;
    text-align:center;
    padding:5px;
}

/* ==========================================================================
   Content
   ========================================================================== */

#container{
    margin:0;
    padding:0;
}
#container-blank{
    padding:15px;
}

@media all and (min-width:901px){
    #navigatie{
        width:220px;
        min-height:100vh;
        box-shadow:0 0 50px rgba(0,0,0,0.1);
        position:fixed;
        padding:15px;
        background:#FFF;
    }
        #navigatie ul{
            list-style-type:none;
            padding:0;
            margin:0;
        }
        #navigatie ul a li{
            padding:5px 5px 5px 10px;
            background:#fff7f6;
            margin-bottom:5px;
            border-radius:5px;
        }
        #navigatie ul a{
            font-family:'f_sb';
            text-decoration: none;
        }
        #navigatie ul a:hover li{
            background:#f7f9fc;
        }
        #navigatie ul a li i{
            color:#002637;
            padding:0 5px 0 0px;
        }
        #navigatie ul a li .svg-icon{
            padding-right:5px;
        }
    #content{
        position:absolute;
        left:250px;
        top:0;
        padding:15px;
        width:calc(100% - 280px);
        height:calc(100vh - 30px);
    }
    #navigatie-sluiten{
        display:none;
    }
    #navigatie-toggle{
        display:none;
    }
}
@media all and (max-width:900px){
    #navigatie{
        width:calc(100% - 30px);
        min-height:100vh;
        position:fixed;
        padding:15px;
        z-index:100;
        background:#FFF;
        display:none;
    }
        #navigatie ul{
            list-style-type:none;
            padding:0;
            margin:50px 0 0 0;
        }
        #navigatie ul a li{
            padding:5px 5px 5px 10px;
            background:#fff7f6;
            margin-bottom:5px;
            border-radius:5px;
        }
        #navigatie ul a{
            font-family:'f_sb';
            text-decoration: none;
        }
        #navigatie ul a:hover li{
            background:#f7f9fc;
        }
        #navigatie ul a li i{
            color:#002637;
            padding:0 5px 0 0px;
        }
        #navigatie ul a li .svg-icon{
            padding-right:5px;
        }
    #content{
        padding:15px;
        background:#f1f1f1;
        width:calc(100% - 30px);
        min-height:calc(100% - 30px);
        z-index:0;
    }
    #navigatie-sluiten{
        position:absolute;
        right:5px;
        top:5px;
        background:rgba(0,0,0,0.05);
        font-size:24px;
        padding:10px;
        cursor:pointer;
    }
    #navigatie-sluiten:hover{
        background:rgba(244, 67, 54, 0.05);
        color:rgb(244, 67, 54);
    }
    #navigatie-toggle{
        display:block;
        position:fixed;
        right:5px;
        top:5px;
        z-index:100;
        color:#000;
        font-size:24px;
        background:rgba(0,0,0,0.1);
        border-radius:5px;
        cursor:pointer;
    }
    #navigatie-toggle:hover{ 
        background:rgba(244, 67, 54, 0.05);
        color:rgb(244, 67, 54);;
    }
}

h2 .svg-icon{
    position:relative;
    top:-5px;
    padding-right:5px;
}

table.login tr td:nth-child(1){
    padding-right:15px;
}
table.login tr td:nth-child(2) input[type=text],
table.login tr td:nth-child(2) input[type=password]{
    width:200px;
}

.rekeningen{
    margin:10px 0 10px 0;
    background:#FFF;
    border-radius:10px;
}
.spaarrekening{
    width:100%;
    border-spacing: 0;
    border-collapse: collapse;
}
.spaarrekening-item td{
    cursor:pointer;
}
.spaarrekening tr td:nth-child(1){
    width:40px;
    text-align:center;
}
.spaarrekening tr:nth-child(1) td{
    color:#ff4939;
    font-family:'f_sb';
    font-size:18px;
}
.spaarrekening tr:nth-child(1) td:nth-child(3){
    text-align:right;
    font-family:'f_sb';
}
.spaarrekening tr td{
    padding:5px 10px 5px 10px;
    border-bottom:2px solid #f1f1f1;
}
.spaarrekening-icon,
.spaarrekening-titel,
.spaarrekening-bedrag{

}
.spaarrekening-bedrag{
    text-align:right;
}
.spaarrekening-icon{
    padding:5px 10px 0 0;
}
.spaarrekening-titel{
    font-family:'f_b';
}
.spaarrekening-info{
    font-family:'f_l';
    font-size:12px;
}
.spaarrekening tr.spaarrekening-item:hover td{
    background:#f7f9fc;
}
.spaarrekening tr:last-child td:nth-child(3){
    text-align:right;
    font-family:'f_sb';
}

div.afschriften{
    margin:10px 0 10px 0;
    background:#FFF;
    border-radius:10px;
    box-shadow:0 0 10px rgba(0,0,0,0.1);
    z-index:10;
}
table.afschriften:not(.afschrift-labels-bedragen){
    width:100%;
    border-spacing: 0;
    border-collapse: collapse;
}
table.afschriften tr td{
    padding:5px 10px 5px 10px;
}
table.afschriften tr:not(.item-no-border) td{
    border-bottom:2px solid #f1f1f1;
}
table.afschriften tr:last-child td{
    border:none !important;
}
table.afschriften tr:nth-child(1) td{
    color:#ff4939;
    padding:10px;
    font-family: 'f_sb';
    font-size:18px;
}

table.afschriften tr.afschriften-datum td{
    border-bottom:none;
    padding:10px;
    color:#464646;
    font-family:'f_l';
    background:#f1f1f1;
}
table.afschriften tr.afschriften-maand td{
    border-bottom:none;
    padding:10px;
    color:#464646;
    font-family:'f_l';
    background:#f1f1f1;
    font-family:'f_b';
    font-size:18px;
}
table.afschriften tr.item td{
    padding:10px 10px 15px 10px;
    cursor:pointer;
}
table.afschriften tr.item.ui-droppable-hover td{
    background:#fbe9e7;
}
table.afschriften tr.item td.afschriften-icon{
    text-align:center;
    width:60px;
    padding:10px 0 15px 5px;
    vertical-align: top;
}
table.afschriften tr.item td.afschriften-bedrag{
    text-align:right;
}
.afschrift-labels-bedragen{
    width:100%;
}
.afschrift-labels-bedragen td{
    border:none !important;
}
.afschrift-labels-bedragen tr td:nth-child(2){
    color:#000 !important;
}
.afschrift-labels-bedragen tr td:nth-child(1){
    padding-right:20px !important;
    width:150px;
    color:#000 !important;
    font-family: 'f_sb';
}
.afschrift-labels-bedragen tr td{
    font-size:12px !important;
    padding:3px !important;
}
.afschrift-labels-bedragen tr td input[type=text]:not([name=omschrijving_custom]){
    width:50px;
    text-align:right;
}
.afschriften-bedrag-groen{
    background:#e8f5e9;
}
.afschriften-bedrag-rood{
    background:#ffebee;
}
.afschriften-bedrag-groen,
.afschriften-bedrag-rood{
    padding:5px;
    border-radius:5px;
    white-space: nowrap; 
}
.afschrift-omschrijving{
    margin:5px -5px -5px -10px;
    padding:5px 10px 5px 10px;
    background:#fff7f6;
    border-radius:5px;
    font-family:'f_l';
    font-size:12px;
    cursor:default !important;
}

span.geen-omschrijving{
    color:rgba(0,0,0,0.5);
    font-family:'f_l';
    font-style:italic;
    font-size:12px;
}
span.geen-omschrijving a{
    color:rgba(0,0,0,0.5);
}
span.geen-omschrijving a:hover{
    color:#ff4939;
}
table.afschriften tr.item:hover td{
    background:#f7f9fc;
} 

.huidig-saldo{
    font-family:'f_l';
    margin:10px;
}
.huidig-saldo-bedrag{
    font-family:'f_sb';
    background:#FFF;
    padding:5px;
    border-radius:5px;
    box-shadow:0 0 5px rgba(0,0,0,0.1);
    margin:0 5px 0 5px;
    cursor:pointer;
    text-decoration: none;
    color:#002034;
}
.huidig-saldo-bedrag:hover{
    background:#f7f9fc;
}
.afschriften-instellingen{
    font-family:'f_sb';
    background:#002034;
    color:#FFF;
    padding:5px;
    border-radius:5px;
    box-shadow:0 0 5px rgba(0,0,0,0.1);
    margin:0 5px 0 5px;
    cursor:pointer;
}
.afschriften-instellingen:hover{
    background:#f7f9fc;
    color:#002034;
}

.afschriften-labels{
    background:#FFF;
    padding:10px;
    font-size:12px;
    position:relative;
    box-shadow:0 0 5px rgba(0,0,0,0.1);
    border-radius:15px;
}
.afschriften-labels-nieuw{
    position:absolute;
    top:calc(100% + 5px);
    left:0;    
    background:#FFF;
    border-radius:10px;
    padding:5px;
    box-shadow:0 0 5px rgba(0,0,0,0.1);
    z-index:20;
}
.afschriften-labels-container{
    display:inline-block;
}
.afschriften-labels-nieuw table tr td:nth-child(1){
    font-family:'f_sb';
    padding-right:10px;
}
.afschriften-labels-nieuw .button-small{
    padding:5px;
    border-radius:0;
}
.afschriften-labels-nieuw input[name=label-kleur]{
    width:50px;
}
.afschrift-label{
    padding:2px 5px 2px 5px;
    font-size:12px;
    font-family:'f_l';
    position:relative;
    border-radius:5px;
    cursor:pointer;
    display:inline-block;
    margin:1px 3px 2px 3px;
}

.afschrift-label-verwijderen{
    background:#e53935 !important;
    color:#ffebee !important;
}

.tegenrekening-item{
    padding:2px 5px 2px 5px;
    font-size:12px;
    font-family:'f_sb';
    position:relative;
    border-radius:5px;
    display:inline-block;
    margin:1px 3px 2px 3px;
    background:#EEE;
    white-space: nowrap;
    border:1px solid rgba(0,0,0,0.5);
}

.grafiek{
    background:#FFF;
    width:calc(100% - 30px);
    padding:15px 0 0 0;
    margin:0;
    box-shadow:0 0 10px rgba(0,0,0,0.1);
}
.grafiek-keuze{
    background:#FFF;
    box-shadow:0 0 10px rgba(0,0,0,0.1);
    margin-bottom:10px;
}
.grafiek-keuze tr td{
    padding:5px;
}
.grafiek-keuze tr td:nth-child(1){
    font-family: 'f_sb';
    font-size:13px;
}
.grafiek-keuze tr td select{
    padding:5px;
}
select option{
    font-family:'Arial';
    font-size:13px;
}

.afschriften-zoeken{
    background:#FFF;
    padding:10px;
    font-size:12px;
    position:relative;
    box-shadow:0 0 5px rgba(0,0,0,0.1);
    border-radius:15px;
    margin-bottom:15px;
}
.afschriften-zoeken table{
    width:100%;
}
.afschriften-zoeken table tr td:first-child{
    font-family:'f_sb';
    padding-right:10px;
    text-align:right;
    vertical-align: top;
    padding-top:3px;
    width:160px;
}
.afschriften-zoeken table tr td input[name=tegenrekening],
.afschriften-zoeken table tr td input[name=omschrijving]{
    width:calc(100% - 20px);
}
.afschriften-zoeken table tr td input[name=bedrag-van],
.afschriften-zoeken table tr td input[name=bedrag-tot]{
    width:50px;
    text-align:right;
}
.afschriften-zoeken table tr td input[type=radio],
.afschriften-zoeken table tr td input[type=checkbox]{
    margin-right:5px;
}

.afschrift-iban{
    color:#999;
    font-size:10px;
    font-family:'f_l';
    font-style:italic;
}

.filter-form{
    margin:10px 0 10px 0;
    background:#FFF;
    border-radius:10px;
    padding:5px;
    width:calc(100% - 20px);
}
.filter-tegenrekening-toevoegen{
    background:#fff7f6;
    border-top:1px solid #ff4939;
    border-bottom:1px solid #ff4939;
}
.filter-titel td{
    font-family:'f_sb';
    color:#ff4939;
    font-size:18px;
    padding:5px;
}
.filter-form tr:not(.filter-titel) td{
    padding:5px;
    font-size:13px;
}
.filter-form tr td:nth-child(1){
    width:150px;
    font-family:'f_sb';
}
.filter-form tr td:nth-child(3){
    width:50px;
}
.filter-form tr td:nth-child(1) select{
    width:100%;
}
.filter-form tr td:nth-child(2) input[type=text]{
    width:calc(100% - 20px);
}
label.filter-toepassen{
    background:#FFF;
    border-radius:5px;
    margin:5px 0 5px 0;
    font-size:14px;
    padding:5px;
}

div.filters{
}
table.filters{
    background:#FFF;
    padding:5px;
    width:100%;
    border-collapse: collapse;
    border-radius:15px;
    box-shadow:0 0 15px rgba(0,0,0,0.1);
}
table.filters tr td{
    vertical-align: top;
    font-size:14px;
    padding:5px;
}
table.filters tr td:first-child{
    width:50px;
    padding-left:10px;
}
table.filters tr:first-child td{
    color:#ff4939;
    font-size:16px;
    font-family:'f_sb';
    border-bottom:2px solid #f1f1f1;
}

table.filters tr td:nth-child(4){
    width:150px;
}
table.filters tr.item:nth-of-type(odd) td{
    background:#f7f9fc;
}

.item-opties td{
    background:#FFF;
    padding:0;
}
.item-bijlagen span.niks{
    font-family:'f_r' !important;
    color:#9DA2A9;
}
.item-bijlage-item{
    background:#FFF;
    padding:3px 5px 3px 5px !important;
    margin:3px;
    box-shadow:0 0 5px rgba(0,0,0,0.3);
    display:inline-block;
    font-size:13px;
    font-family:'f_l';
    color:#000;
}
.item-bijlage-item i{
    color:#d81b60;
}
.item-bijlage-item:hover{
    background:#dfe9f2;
    color:#0097fc;
}
.verwijder-bijlage{
    background:#e53935 !important;
    color:#FFF;
    padding:5px 3px 3px 3px;
}
.verwijder-bijlage:hover{
    background:#b71c1c !important;
}
.item .fa-paperclip{
    color:#ff4939;
}

.afschriften-item-bijlage-koppel-container{
    margin:10px 0 10px 0;
    padding:5px;
    background:#FFF;
    box-shadow:0 0 5px rgba(0,0,0,0.2);
}

.afschriften-item-bijlage-url{
    text-decoration: none;
}

.rapporten-navigatie{
    margin:10px 0 10px 0;
}
.rapporten-navigatie ul{
    list-style-type: none;
    padding:0;
}
.rapporten-navigatie ul li{
    display:inline-block;
    padding:5px 7.5px 5px 7.5px;
    background:#FFF;
    margin:0 5px 0 5px;
    box-shadow:0 0 10px rgba(0,0,0,0.1);
    border-radius:10px;
}
.rapporten-navigatie ul a{
    color:#ff4939;
    font-weight:700;
}
.rapporten-navigatie ul a:hover{
    color:#FFF;
}
.rapporten-navigatie ul a:hover li{
    background:#ff4939;
}
.rapporten-navigatie ul a.rapporten-navigatie-geselecteerd li{
    background:#ffa096;
}
.rapporten-navigatie ul a.rapporten-navigatie-geselecteerd{
    color:#000;
}

.rapporten-elementen-item{
    width:calc(100% - 30px);
    background:#FFF;
    border:2px dashed #CCC;
    padding:10px;
    margin-bottom:10px;
    position:relative;
}
.rapporten-elementen-item-opties{
    position: absolute;
    right:10px;
    top:10px;
}
.rapporten-elementen-item-opties i.fa-trash-o{
    background:#e53935;
    padding:5px 2px 5px 2px;
    color:#FFF;
    cursor:pointer;
}
.rapporten-elementen-item-opties i.fa-trash-o:hover{
    background:#ff4939;
}
.rapporten-elementen-item-opties i.fa-pencil{
    background:#002033;
    padding:5px 2px 5px 2px;
    color:#FFF;
    cursor:pointer;
}
.rapporten-elementen-item-opties i.fa-pencil:hover{
    background:#29b6f6;
}

.rapporten-elementen-item table tr td{
    vertical-align: top;
    font-size:14px;
    padding:5px;
}
.rapporten-elementen-item table tr td:nth-child(1){
    font-weight:700;
    width:150px;
}

/* ==========================================================================
   Autocomplete
   ========================================================================== */

/* ====
    Autocomplete
    ==== */


div.autocomplete-container{
    position:relative;
    background:none;
}
div.autocomplete{
    position:absolute;
    left:0;
    width:100%;
    border:1px solid #FFF;
    background:#FFF;
    z-index:2000;
    top:28px;
    box-shadow:0px 0px 10px rgba(0,0,0,0.3);
}
div.autocomplete-top:hover{
    opacity:0.05;
}
div.fotoPersonen div.autocomplete{
    top:23px !important;
}
div.autocomplete-divider{
    background:#062535;
    color:#FFF;
    font-weight:700;
    width:calc(100% - 10px);
    padding:5px;
}
div.autocomplete-item{
    width:calc(100% - 10px);
    padding:5px;
    cursor:pointer;
}
div.autocomplete-item-odd{
    background:#FFF;
}
div.autocomplete-item-even{
    background:rgba(230,247,255,0.5);
}
div.autocomplete-item-nieuw{
    background:#e8f5e9;
    color:#2FB592;
    font-style:italic;
    font-family:'f_l';
}
div.autocomplete-item-selected.autocomplete-item-nieuw{
    background:#2FB592;
    color:#FFF;
}
div.autocomplete-item:hover{
    background:#00aced;
    color:#FFF;
}
div.autocomplete-item-selected{
    background:#00aced;
    color:#FFF;
}
div.autocomplete-item-selected:hover{
    background:#00aced;
    color:#FFF;
}
input.has-value{;
    color:#2FB592;
    font-family:'f_sb';
}
input.has-value:hover{
    border:1px solid #217F65;
    color:#217F65;
}
div.filter-tegenrekening-value{
    border:1px solid #2FB592;
    font-family:'f_sb';
    font-size:13px;
    padding:5px;
}
div.filter-tegenrekening-value:hover{
    border:1px solid #217F65;
    color:#217F65;
}

div.filters-afschriften-items{
    width:100%;
    overflow-x:auto;
}
div.filters-afschriften-items table{
    width:100%;
    border-spacing: 0;
    border-collapse: collapse;
    table-layout:fixed;
}
div.filters-afschriften-items table td{
    vertical-align: top;
}
div.filters-afschriften-items table tr:first-child td{
    font-family:'f_b';
    border-bottom:2px solid #FFF;
    font-size:12px;
    padding:3px;
}
div.filters-afschriften-items table tr.item td{
    font-size:12px;
    padding:3px;
}
div.filters-afschriften-items tr td:nth-child(1){
    width:60px;
    text-align: center;
}
div.filters-afschriften-items tr td:nth-child(2){
    width:25px;
    text-align:right;
}
div.filters-afschriften-items tr td:nth-child(3){
    width:70px;
    text-align: right;
    padding-right:10px;
}
div.filters-afschriften-items tr td:nth-child(4){
    width:150px;
}
div.filters-afschriften-items tr td:nth-child(5){
    width:150px;
}
div.filters-afschriften-items tr td:nth-child(6){
    width:850px;
}
div.filters-afschriften-items tr:nth-of-type(even) td{
    background:#FFF;
}

.rapport{
    width:calc(100% - 30px);
    padding:10px 15px 15px 15px;
    background:#FFF;
    border-radius:10px;
    box-shadow:0 0 10px rgba(0,0,0, 0.1);
    font-size:14px;
}
.rapport-totalen{
    border-spacing: 0;
    border-collapse: collapse;
}
.rapport-totalen tr:nth-child(1) td{
    font-weight:700;
    padding-bottom:2px;
    border-bottom:1px solid #000;
}
.rapport-totalen tr td:first-child{
    padding:5px;
    font-weight:800;
}
.rapport-totalen tr td:nth-of-type(1) ~ td{
    text-align:right;
    padding:5px;
}
.rapport-totalen tr:nth-of-type(1) ~ tr td:nth-of-type(1) ~ td{
    font-size:13px;
}
.rapport-totalen tr:not(.rapport-kop):nth-of-type(even) td{
    background:#e3f2fd;
}
.rapport-totalen tr td:nth-child(1){
    width:250px;
}
.rapport-totalen tr td:nth-child(2) ~ td{
    width:100px;
}
.rapport-totalen tr.rapport-totaal td{
    font-weight:800;
    border-top:1px solid #000;
    background:#FFF !important;
}
.rapport-toon{
    font-size:11px; 
    padding:2px 5px 2px 5px;
    background:#0d47a1;
    color:#FFF;
    font-weight:700;
    opacity:0.3;
}
/* ==========================================================================
   Helper classes
   ========================================================================== */
.button{
    border:none;
}
.hidden,
[hidden]{
    display: none !important;
}
.sr-only{
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
    /* 1 */
}
.sr-only.focusable:active,
.sr-only.focusable:focus{
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    white-space: inherit;
    width: auto;
}
.invisible{
    visibility: hidden;
}
.clearfix::before,
.clearfix::after{
    content: " ";
    display: table;
}
.clearfix::after{
    clear: both;
}
@media only screen and (min-width: 35em){
  /* Style adjustments for viewports that meet the condition */
}
@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi){
  /* Style adjustments for high resolution devices */
}
@media print{
  *,
  *::before,
  *::after{
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited{
    text-decoration: underline;
  }
  a[href]::after{
    content: " (" attr(href) ")";
  }
  abbr[title]::after{
    content: " (" attr(title) ")";
  }
  a[href^="#"]::after,
  a[href^="javascript:"]::after{
    content: "";
  }
  pre{
    white-space: pre-wrap !important;
  }
  pre,
  blockquote{
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  thead{
    display: table-header-group;
  }
  tr,
  img{
    page-break-inside: avoid;
  }
  p,
  h2,
  h3{
    orphans: 3;
    widows: 3;
  }
  h2,
  h3{
    page-break-after: avoid;
  }
}
