@charset "UTF-8";
/* oodoo by Digiblox & Boinx */


/* Responsife */
* {
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
}

.topnav {
    overflow: hidden;
    background-color: #333;
    position: relative;
}
.topnav a {
    color: white;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
    display:block;
}
.topnav a.icon {
    display:block;
    position: relative;
    right: 0;
    top: 0;
}
.topnav a.active {
    border-right: 1px #3870b6 solid;
    border-left: 1px #3870b6 solid;
    background-image: linear-gradient(180deg, rgba(73, 168, 232, 1), rgba(32, 120, 216, 1));
    color: #ffffff;
}

#menuMobile {
    display:none;
}

/* Instellinegn */
.setting-container {
    font-weight: bold;
}

.setting-titel H1 {
    margin-top: 40px;
}

.setting-titel H1:first-child {
    margin-top: 0;
}

.setting-titel H1 {
    font-size: 18px;
    text-align: right;
}

.setting-box {
    margin-bottom: 20px;
}

.setting-box:last-child {
    margin-bottom: 5px;
}

.setting-text {
    margin-bottom: 10px;
}

.setting-item input[type=text], .setting-item input[type=password], .setting-item input[type=tel], .setting-item input[type=date], .setting-item input[type=email], .setting-item textarea, .setting-item select {
    background-color: #f2f6fa;
}

.setting-titel {
    margin-top: 20px;
}

.setting-titel:first-child {
    margin-top: 0;
}

/* body */
body {
    background: #f3f1eb;
    color: #362e26;
    margin: 0;
    padding: 0;
    cursor: default;
    overflow-y: scroll;
}

a {
    color: #362d26;
    text-decoration: none;
}

a:hover {
    color: #93c92d;
}

.menu-container {
    display: flex;
    justify-content: center;
    /* background-image: linear-gradient(180deg, rgba(188, 221, 90, 1), rgba(147, 201, 45, 1));*/
    /*background-image: linear-gradient(180deg, rgb(18, 47, 110), rgba(221, 235, 247, 1));*/
    /*border-bottom: 10px #362e26 solid;*/
    background-image: linear-gradient(180deg, rgba(4, 35, 102, 1), rgba(79, 91, 117,1));

}

.knop-vca i, .h1_vca, #addItemRow i, #addItemRowTekort i, #addEmptyItemRow i, #addTermijnItemRow i, .facattachment-icon i {
    color:#3870b6 !important;
}

.inkooporder-container input[type=button] {
    background-color: #3870b6 !important;
}

.button_next {
    background-color: #3870b6 !important;
}

.onjuist_form {
    border: 1px #e40000 solid !important;
}

.onjuist-text {
    color: #e40000 !important;
    margin-bottom: 3px;
}

legend {
    color: #3870b6;
    font-size: 20px;
    letter-spacing: 0.1em;
    cursor: pointer;
}


.menu-container .logo {
    top:0;
    left:0;
    right: 0;
    bottom: 0;
    text-align: center;
    color: #ffffff;
    position: absolute;
}

.logo > a {
    color: #01A6EC;
}

.menu-container > div {
    /*color: #423a33;*/
    color:white;
    width: 100px;
    text-align: center;
    line-height: 75px;
    font-size: 25px;
    border-right: 1px #ffffff solid;
    cursor: pointer;
}

.add-container {
    display: flex;
    flex-wrap: wrap;
}
.add-container > div {
    width: 50%;
}

.add-container-full-width {
    display: flex;
    flex-wrap: wrap;
}

.add-container-full-width > div {
    width: 100%;
}


.menu-container > div:first-child {
    border-left: 1px #ffffff solid;
}

.menu-container > div:hover, .menu-container > div.active {
    border-right: 1px #3870b6 solid;
    border-left: 1px #3870b6 solid;
    background-image: linear-gradient(180deg, rgba(73, 168, 232, 1), rgba(32, 120, 216, 1));
    color: #ffffff;
}

fieldset {
    padding: 20px;
    border: 1px #362e26 solid;
    margin-top: 15px;
    margin-bottom: 15px;
}


/* login */
.center-login {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 150px 0;
    background: #FFFFFF;
    border-left: 7px #e6decb solid;
    border-right: 7px #e6decb solid;
    width: 1400px;
}

.login-container {
    max-width: 550px;
}

.login-form input[type=text], input[type=password] {
    margin: 8px 0;
    max-width: 550px;
}

.top-login {
    margin-bottom: 25px;
}

@media screen and (max-width: 1050px) {
    .knop-container input {
        width: 100%;
        margin-bottom: 10px;
    }
	.spaneel-left, .spaneel-right {
		width: 100%;
	}
}


@media screen and (max-width: 1200px) {
    .center-login {
        padding: 80px 0;
    }
}

@media screen and (min-width: 601px) {
    .knop-container input {
        margin-right: 15px;
    }
}

@media screen and (max-width: 600px) {
    .center-login {
        padding: 30px 10px;
        border: 0;
    }
}

/* pagina */
main {
    display: flex;
    justify-content: center;
}

.center-container {
    background: #FFFFFF;
    border-left: 7px #e6decb solid;
    border-right: 7px #e6decb solid;
    padding: 25px;
    width: 1400px;
}

@media screen and (max-width: 600px) {
    .center-container {
        padding: 20px 10px;
        border: 0;
    }
}

.ui-tooltip {
    box-shadow: none;
}

/* Tabs */
.tab-container {
    display: flex;
    margin-top: 20px;
    justify-content: left;
    background-image: linear-gradient(180deg, rgba(4, 35, 102, 1), rgba(79, 91, 117,1));
    color: #ffffff;
    sborder-bottom: 10px #362e26 solid;
}

.tab-container > div {
    color: #ffffff;
    swidth: 205px;
    width: fit-content;
    text-align: center;
    line-height: 35px;
    font-size: 15px;
    border-right: 1px #ffffff solid;
    cursor: pointer;
    padding-left: 5px;
    padding-right: 5px;
    min-width: 200px;
}

.tab-container > div.tab-arrow {
    width: 50px !important;
    padding: 0 !important;
    min-width: 50px !important;
}

.tab-container > div:first-child {
    border-left: 1px #ffffff solid;
}

.tab-container > div:hover, .tab-container > div.active {
    border-right: 1px #3870b6 solid;
    border-left: 1px #3870b6 solid;
    background-image: linear-gradient(180deg, rgba(73, 168, 232, 1), rgba(32, 120, 216, 1));
    color: #ffffff;
}

/*overlay */
.overlayCenter {
    width: 50%;
    height: 50%;
    position: fixed;
    top: 25%;
    left:25%;
    z-index: 1000;
    text-align: center;
    display:none;
    background-image: url('/images/loading_animated.gif');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-blend-mode: darken;
}

.overlayCenter p {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 30px;
    font-weight: bold;
    color:red;
}

p.addProjectMoney {
    margin: 0;
    position: relative;
    top: 50%;
    font-size: 20px;
    font-weight: bold;
    text-align: left;
    color:#4785d4;
}
/* Header */
.info-box {
    right: 10px;
}
header {
    /*background-image: linear-gradient(180deg, rgba(4, 35, 102, 1), rgba(79, 91, 117,1));*/
    /*background-color: rgb(4, 35, 102);*/
    padding: 10px;
    text-align: center;
    color: #000000;
    position: relative;
}

header > img {
    max-height: 75px;
}

header > div {
    position: absolute;
    font-size: 12px;
    letter-spacing: 1px;
    color: #000000;
}

header a {
    color: #000000;
}



/* zoeken en nieuwe items */
.top-container {
    display: flex;
    flex-wrap: wrap;
}

.top-left {
    flex: 50%;
    padding-top: 10px;
}

.top-right {
    flex: 50%;
    text-align: right;
	position: relative;
}

.top-right i {
    cursor: pointer;
    position: absolute;
    right: 12px;
    top: 10px;
	font-size: 24px;
}

.top-right i:hover {
    color: #89c02b;
}

.add-item i, .select-container i {
    padding-right: 10px;
    padding-left: 10px;
    /* color: #93c92d;*/
    color: #4785d4;
    font-size: 30px;
    vertical-align: middle;
}
.add-item:nth-child(odd) {
    padding-right: 20px;
}

.add-item input, .add-item select {
    margin-bottom: 15px;
}

.add-dollar-item {
    padding-right: 10px;
    color:#4785d4;
    font-size: 15px;
    vertical-align: middle;
}

.select-container {
    padding: 20px;
    /*display: none;*/
}

/* het paneel */
.paneel {
    border-top: 1px #e4d9c4 solid;
    background: #fbf9f4;
    display: flex;
}

@media screen and (min-width: 1201px) {
    .paneel {
        flex-wrap: wrap;
    }
}

.select-container a {
    padding-right: 30px;
    white-space: nowrap;
}

@media (max-width: 1000px) {
    .select-container a {
        padding-bottom: 10px;
        display: block;
    }
}

@media (max-width: 800px) {
    .top-right, .top-left {
        flex: 100%;
    }

    .top-right {
        text-align: left;
    }

    .top-left {
        padding-bottom: 20px;
    }
}

/* Standaard tabel */
.stabel {
    border-top: 1px #e4d9c4 solid;
    font-size: 16px;   
    display: flex;
    align-items: stretch;
}

.stabel th {
    text-align: left;
}

table {
    border-collapse: collapse;
}

table tr {
    height: 50px;
    border-top: 1px #e4d9c4 solid;

}

table.calcTable tr {
    height: fit-content !important;
    border-top: 1px #e4d9c4 solid;

}

.titleRow {
    background-image: linear-gradient(180deg, rgba(73, 168, 232, 1), rgba(32, 120, 216, 1));
    color: #FFFFFF;
}

.titleRow:hover {
    background-image: linear-gradient(180deg, rgba(73, 168, 232, 1), rgba(32, 120, 216, 1)) !important;
    color: #FFFFFF;
}

.vakantieplanning tr {
    height: 15px;
}
.vakantieplanning {
    font-size: 12px;
    font-weight: normal;
}

.vakantieplanning td {
    border-right: 1px #e4d9c4 solid;
}

.calDay {
	width: 100px;
}

.calName {
    font-size: 16px;
	width:300px;
}

.calGroter {
    font-size: 16px;
}

.stabel tr:hover {
    background: #fbf9f4;
}

/* tabel opbouw */
.tabel, .tabel-sub {
    border-top: 1px #e4d9c4 solid;
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: stretch;
}

.tabel:hover {
    background: #fbf9f4;
}

.selected {
    background: #edf5fe;
}

.selected:hover {
    background: #deedfd;
}

.tabel-sub {
    background: #f9fdf1;
}

.tabel-sub:hover {
    background: #ebf8d1;
}

.tabel:first-of-type {
    /* border-top: 5px #362e26 solid;*/
    background: #f3f1ea;
    font-weight: bold;
    cursor: default;
    /* margin-top: 25px;*/
}

.tabel > div, .tabel-sub > div {
    padding: 10px 0;
}

.tabel > div:first-child, .tabel-sub > div:first-child {
    padding-left: 12px;
}

section {
    margin-top: 20px;
}

.info-container {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background: #2c86da;
    color: #ffffff;
    text-align: center;
    font-size: 18px;
    padding: 10px 0;
    border-bottom: 1px #2d5a83 solid;
    z-index: 1000;
    display: none;
}

.info-container a {
    color: #ffffff;
    font-size: 22px;
    margin-right: 10px;
}

.info-container a:hover {
    color: #362e26;
}

.knop-container {
    margin-top: 20px;
}

/* medical */
.fa-briefcase-medical {
    color: red;
    font-size: 40px;
}
/* VCA-GPI verlopen */
.vca-gpi-verlopen {
    color: red;
    font-size: 40px;
}

/* tabel weekstaat toevoegen */
.kost-01 { flex: 0 1 290px} /* Monteur */
.kost-02 { flex: 0 1 340px} /* Project */
.kost-03 { flex: 0 1 340px} /* Kostenplaats */
.kost-04 { flex: 0 1 100px} /* Uren */
.kost-05 { flex: 0 1 20px} /* Minus */
.kost-06 { flex: 0 1 50px} /* Minus */


/* tabel inkoop toevoegen */
.fab-01 { flex: 0 1 200px} /* Aantal */
.fab-02 { flex: 0 1 800px} /* Artikel */
.fab-03 { flex: 0 1 300px} /* Prijs */
.fab-04 { flex: 0 1 20px} /* Minus */
.fab-05 { flex: 0 1 20px} /* Minus */

/* tabel observatie/tekortkoming toevoegen */
.audit-fab-01 { flex: 0 1 1300px} /* Aantal */
.audit-fab-04 { flex: 0 1 20px} /* Minus */
.audit-fab-05 { flex: 0 1 20px} /* Minus */

/* tabel inkoop toevoegen */
.addst-01 { flex: 0 1 200px} /* Aantal */
.addst-02 { flex: 0 1 800px; align-self: center;} /* Artikel */
.addst-03 { flex: 0 1 500px} /* Prijs */
.addst-04 { flex: 0 1 20px} /* Minus */
.addst-03 img { max-height: 30px;}

.fab-04 i, .fab-05 i, .kost-05 i, .addst-04 i {
    padding-right: 10px;
    padding-top: 5px;
    color: #c90808;
    font-size: 30px;
    vertical-align: middle;
    cursor: pointer;
}

.form_table {
	margin-bottom: 15px;
	display: flex;
	align-items: stretch;
}

.form_table div {
	margin-right: 10px;
}

/* tabel projecten */
.prj-01 { flex: 0 1 50px} /* select */
.prj-02 { flex: 0 1 100px} /* Nr */
.prj-03 { flex: 0 1 150px} /* Datum */
.prj-04 { flex: 0 1 600px} /* Naam */
.prj-05 { flex: 0 1 400px} /* Werkvoorbereider */
.prj-06 { flex: 0 1 250px} /* Status */
.prj-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel project planning */
.planning-01 { flex: 0 1 50px} /* select */
.planning-02 { flex: 0 1 500px} /* Project */
.planning-03 { flex: 0 1 400px} /* Projectleider */
.planning-04 { flex: 0 1 150px} /* Personeel */
.planning-05 { flex: 0 1 150px} /* Startdatum */
.planning-06 { flex: 0 1 150px} /* Einddatum */
.planning-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel Gebruikers */
.usr-01 { flex: 0 1 50px} /* select */
.usr-02 { flex: 0 1 500px} /* Naam */
.usr-03 { flex: 0 1 450px} /* Email */
.usr-04 { flex: 0 1 150px} /* Datum */
.usr-05 { flex: 0 1 250px} /* Status */
.usr-compleet { flex: 0 1 1400px} /* geen resultaten */
.usr_rechten input[type=checkbox] { 
    margin-top: auto !important;
    margin-bottom: auto !important;
    vertical-align: middle;
}


/* tabel wpi */
.wpi-01 { flex: 0 1 50px} /* select */
.wpi-02 { flex: 0 1 500px} /* Naam */
.wpi-03 { flex: 0 1 450px} /* Projectleider */
.wpi-04 { flex: 0 1 150px} /* Datum */
.wpi-05 { flex: 0 1 250px} /* Status */
.wpi-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel nen lijsten */
.nen-01 { flex: 0 1 50px} /* select */
.nen-02 { flex: 0 1 400px} /* Gebruiker naam */
.nen-03 { flex: 0 1 300px} /* Lijst Naam */
.nen-04 { flex: 0 1 250px} /* Type lijst */
.nen-05 { flex: 0 1 100px} /* Groepen */
.nen-06 { flex: 0 1 150px} /* Datum */
.nen-07 { flex: 0 1 150px} /* Status */
.nen-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel pakbon lijsten */
.pakbon-01 { flex: 0 1 50px} /* select */
.pakbon-02 { flex: 0 1 400px} /* Gebruiker naam */
.pakbon-03 { flex: 0 1 350px} /* Leverancier */
.pakbon-04 { flex: 0 1 150px} /* Order nummer */
.pakbon-05 { flex: 0 1 150px} /* Leverdatum */
.pakbon-06 { flex: 0 1 150px} /* Datum */
.pakbon-07 { flex: 0 1 150px} /* Status */
.pakbon-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel kvv */
.kvv-01 { flex: 0 1 50px} /* select */
.kvv-02 { flex: 0 1 500px} /* Type */
.kvv-03 { flex: 0 1 275px} /* Periode */
.kvv-04 { flex: 0 1 150px} /* Datum */
.kvv-05 { flex: 0 1 250px} /* Status */
.kvv-06 { flex: 0 1 175px} /* Nummer */
.kvv-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel site visit */
.svisit-01 { flex: 0 1 50px} /* select */
.svisit-02 { flex: 0 1 500px} /* Project */
.svisit-03 { flex: 0 1 275px} /* Soort */
.svisit-04 { flex: 0 1 150px} /* Datum */
.svisit-05 { flex: 0 1 425px} /* Naam */
.svisit-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel weekstaat */
.weekstaat-01 { flex: 0 1 50px} /* select */
.weekstaat-02 { flex: 0 1 550px} /* Project */
.weekstaat-06 { flex: 0 1 500px} /* Omschrijving */
.weekstaat-05 { flex: 0 1 150px} /* Week */
.weekstaat-03 { flex: 0 1 150px} /* Van */
.weekstaat-04 { flex: 0 1 150px} /* Tot */

.weekstaat-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel Waarschuwingen */
.warning-01 { flex: 0 1 50px} /* select */
.warning-02 { flex: 0 1 400px} /* Naam */
.warning-03 { flex: 0 1 450px} /* Project */
.warning-04 { flex: 0 1 400px} /* Door */
.warning-05 { flex: 0 1 100px} /* Datum */
.warning-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel wpi */
.startwerk-01 { flex: 0 1 50px} /* select */
.startwerk-02 { flex: 0 1 500px} /* Naam */
.startwerk-03 { flex: 0 1 275px} /* Projectleider */
.startwerk-04 { flex: 0 1 150px} /* Datum */
.startwerk-05 { flex: 0 1 250px} /* Status */
.startwerk-06 { flex: 0 1 175px} /* Nummer */
.startwerk-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel toolbox */
.toolbox-01 { flex: 0 1 50px} /* select */
.toolbox-02 { flex: 0 1 500px} /* Naam */
.toolbox-03 { flex: 0 1 275px} /* Projectleider */
.toolbox-04 { flex: 0 1 150px} /* Datum */
.toolbox-05 { flex: 0 1 250px} /* Status */
.toolbox-06 { flex: 0 1 175px} /* Nummer */
.toolbox-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel coach */
.coach-01 { flex: 0 1 50px} /* select */

.coach-03 { flex: 0 1 200px} /* Type */
.coach-04 { flex: 0 1 350px} /* Door */
.coach-05 { flex: 0 1 350px} /* Naam */
.coach-02 { flex: 0 1 300px} /* Bedrijfsnaam */
.coach-06 { flex: 0 1 150px} /* Datum */
.coach-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel audit */
.audit-01 { flex: 0 1 50px} /* select */
.audit-02 { flex: 0 1 500px} /* Type */
.audit-03 { flex: 0 1 275px} /* Periode */
.audit-04 { flex: 0 1 150px} /* Datum */
.audit-05 { flex: 0 1 250px} /* Status */
.audit-06 { flex: 0 1 175px} /* Nummer */
.audit-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel inkoop */
.ink-01 { flex: 0 1 50px} /* select */
.ink-02 { flex: 0 1 150px} /* Nummer */
.ink-03 { flex: 0 1 500px} /* Project */
.ink-04 { flex: 0 1 300px} /* Leverancier */
.ink-05 { flex: 0 1 150px} /* Voltooid */
.ink-06 { flex: 0 1 250px} /* Status */
.ink-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel inkoop leveranciers */
.leverancier-01 { flex: 0 1 50px} /* select */
.leverancier-02 { flex: 0 1 350px} /* Naam */
.leverancier-03 { flex: 0 1 350px} /* Adres */
.leverancier-04 { flex: 0 1 150px} /* Postcode */
.leverancier-05 { flex: 0 1 300px} /* Plaats */
.leverancier-06 { flex: 0 1 200px} /* Status */
.leverancier-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel Registratie */
.reg-01 { flex: 0 1 50px} /* select */
.reg-02 { flex: 0 1 400px} /* Naam */
.reg-03 { flex: 0 1 400px} /* E-mail */
.reg-04 { flex: 0 1 150px} /* Verstuurd */
.reg-05 { flex: 0 1 150px} /* Voltooid */
.reg-06 { flex: 0 1 250px} /* Status */
.reg-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel Contracten */
.contract-01 { flex: 0 1 50px} /* select */
.contract-02 { flex: 0 1 200px} /* Nummer */
.contract-03 { flex: 0 1 400px} /* Project */
/*.contract-04 { flex: 0 1 400px} /* Onderaannemer */
.contract-04 { flex: 0 1 600px} /* Onderaannemer */
.contract-05 { flex: 0 1 200px} /* Type */
.contract-06 { flex: 0 1 150px} /* Gemaakt */
.contract-07 { flex: 0 1 250px} /* Status */
.reg-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel Contracten */
.contractnew-01 { flex: 0 1 50px} /* select */
.contractnew-02 { flex: 0 1 200px} /* Nummer */
.contractnew-03 { flex: 0 1 400px} /* Project */
/*.contract-04 { flex: 0 1 400px} /* Onderaannemer */
.contractnew-04 { flex: 0 1 600px} /* Onderaannemer */
.contractnew-05 { flex: 0 1 200px} /* Type */
.contractnew-06 { flex: 0 1 150px} /* Gemaakt */
.contractnew-07 { flex: 0 1 250px} /* Status */
.reg-compleet { flex: 0 1 1400px} /* geen resultaten */

/* tabel klanten */
/*.tab-01 { flex: 0 1 50px} 
.tab-02 { flex: 0 1 200px} 
.tab-03 { flex: 0 1 600px} 
.tab-04 { flex: 0 1 100px} 
.tab-05 { flex: 0 1 100px} 
.tab-06 { flex: 0 1 150px} 
.tab-07 { flex: 0 1 100px} 
.tab-08 { flex: 0 1 100px} 
.tab-09 { flex: 0 1 150px} 
.tab-10 { flex: 0 1 100px} 
.tab-11 { flex: 0 1 150px} */

/* Zoek tabel */
.tab-12 { flex: 0 1 50px} 
.tab-13 { flex: 0 1 200px} 
.tab-14 { flex: 0 1 250px} 
.tab-15 { flex: 0 1 250px} 
.tab-16 { flex: 0 1 700px} 
.tab-17 { flex: 0 1 150px} 
.tab-18 { flex: 0 1 100px} 
.tab-19 { flex: 0 1 150px} 

/* Tab tabel */
.tab-01 { width: 50px; border-left: 1px #C7BDAB solid;} /* select */
.tab-02 { width: 200px; border-left: 1px #C7BDAB solid;} /* ArtNr */
.tab-03 { width: 600px; border-left: 1px #C7BDAB solid;} /* Omschrijving */
.tab-04 { width: 70px; border-left: 1px #C7BDAB solid;} /* Tarief */
.tab-05 { width: 70px; border-left: 1px #C7BDAB solid;} /* Aantal */
.tab-06 { width: 120px; border-left: 1px #C7BDAB solid;} /* Eenheid */
.tab-07 { width: 80px; border-left: 1px #C7BDAB solid;} /* Norm */
.tab-08 { width: 80px; border-left: 1px #C7BDAB solid;} /* Snit */
.tab-09 { width: 150px; text-align: right; border-left: 1px #C7BDAB solid;} /* Materiaal */
.tab-10 { width: 100px; text-align: right; border-left: 1px #C7BDAB solid;} /* Uren */
.tab-11 { width: 150px; text-align: right; border-left: 1px #C7BDAB solid;} /* Totaal arbeid */
.tab-12 { width: 150px; text-align: right; border-left: 1px #C7BDAB solid;} /* Totaal materiaal */
.tab-13 { width: 150px; text-align: right; border-left: 1px #C7BDAB solid; border-right: 1px #C7BDAB solid;} /* Subtotaal */
.tab-emptyrow { height: fit-content !important; font-weight: bold;}
.tab-emptycell { border-left: 1px #C7BDAB solid; border-right: 1px #C7BDAB solid; } 

/* form */
input[type=text], input[type=date], input[type=datetime-local], input[type=tel], input[type=file], input[type=email], input[type=password], input[type=number], input[type=submit], input[type=button], button, textarea, select { /*,input[type=checkbox]*/
    -webkit-appearance: none !important;
    font-size: 18px;
}

input[type=text], input[type=date], input[type=datetime-local], input[type=tel], input[type=file], input[type=email], input[type=date], input[type=datetime-local], input[type=password], input[type=number], select, textarea {
    width: 100%;
    padding: 10px 20px;
    border-radius: 4px;
    border: 1px #362e26 solid;
    color: #362e26;
    box-sizing: border-box;
}

input[type=submit], input[type=button], button {
    background-color: #92cb2e;
    color: white;
    padding: 12px 40px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

input[type=submit]:hover, input[type=button]:hover, button:hover {
    background-color: #4785d4;
}

#fontOptions {
    display:none; 
    background-color: skyblue;
    border-radius: 10px;
}

#fontOptions a {
    top:0; 
    right:0; 
    position: absolute;
    margin-right: 5px;
}

#fontOptions b {
    margin-left: 5px;
}

.form-container {
    display: flex;
    flex-wrap: wrap;
}

.form_table {
    margin-bottom: 15px;
	display: flex;
	align-items: stretch;
}

.form_left {
    width: 35%;
    text-align: right;
    line-height: 40px;
    padding-right: 20px;
    font-weight: bold;
    /*overflow-x:hidden; werkt niet? */
}

.form_right {
    align-self: center;
    width: 65%;
}


/* navigatie pagina's */
.nav_center {
    text-align: center;
    border-top: 5px #362e26 solid;
    border-bottom: 1px #362e26 solid;
    padding-top: 4px;
    background: #fbf9f4;
}

.nav-container {
    display: inline-block;
}

.nav-container a {
    color: #362e26;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    transition: background-color .3s;
    cursor: pointer;
}

.nav-container a.active {
    background-color: #92ca2d;
    color: white;
}

.nav-container a:hover:not(.active) {
    background-color: #f3f1ea;
}

.p-links > div, .p-rechts > div, .p-center > div {
    border: 1px #e4d9c4 solid;
    background: #ffffff;
    padding: 15px;
    margin-bottom: 20px;
}

.p-links > div:last-child, .p-rechts > div:last-child {
    margin: 0;
}

.p-links {
    flex: 30%;
    padding: 20px 0 20px 20px;
}

.p-rechts {
    flex: 70%;
    padding: 20px;
}

.p-center {
	padding: 0 20px 0 20px;
	flex: 100%;
}

.p-center-sub {
	margin: 0 20px 20px 20px;
	flex: 100%;
	border: 1px #e4d9c4 solid;
}

.p-nav, .p-func {
    cursor: pointer;
}

.p-nav div, .p-func div {
    display: inline-block;
    font-size: 22px;
    padding-right: 20px;
}

.p-maps img {
    width: 100%;
}

i.no-card {
    color: lightgray;
    font-size: 80px;
}
i.yellow-card {
    color:yellow;
    font-size: 80px;
}

i.orange-card {
    color:orange;
    font-size: 80px;
}

i.red-card {
    color:red;
    font-size: 80px;
}

.p-store > div {
    margin-bottom: 10px;
}

.p-store > div:last-child {
    margin-bottom: 0;
}

.p-store span {
    margin-right: 10px;
}

.p-store span:first-child {
    display: none;
}

.p-store span:last-child {
    margin-right: 0;
}

.p-store div:first-child {
    margin-bottom:10px;
}

.p-nav div:hover, .p-func div:hover {
    color: #2c86da;
}

.p-info {
    position: relative;
}

/* Project Money Container */
.pMoney_base {
    display: flex;
    background-color: #89c02b;
    justify-content: space-between;
    padding-bottom: 5px;
}

.pMoney_container {
    margin-bottom: 10px;
}

.pMoney_left {
    font-weight: bold;
    font-style: italic;
    text-align: left;
}

.pMoney_right {
    color: red;
    font-weight: bold;
    text-align: right;
}

/* footer */
footer {
    text-align: center;
    color: #2c86da;
}