:root {
    --bg: #efefef;
    --txtcolor: #282728;
    --orange: #de4f2d;
    --darkerorange: #b03c1e;
    --blue: #07395e;
    --green: #08ab00;
    --red: #e60000;
    --lightgrey: #f5f5f5;
}

html, body {
    background: var(--bg);
}

nav {
    margin-bottom: 15px; 
}

h3 {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    color: var(--txtcolor);
}

.logo {
    border: 0px;
    width: auto;
    height: 50px;
}

.offcanvas-top {
    height: 35vh !important;
}

a {
    text-decoration: none !important;
}

textarea {
    background: #efefef;
    min-height: 150px; 
    background: #eee;
}

.labelWhite {
    background: #fff;
    width: 100%;
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    border: 1px solid #ced4da;
    border-top: 0px !important;
    text-align: center;
    line-height: 40px;
}

.fa-chevron-right {
    color: #888;
    padding-right: 10px;
    line-height: 50px;
}




.btn-login {
font-family: 'Roboto Condensed', sans-serif;
font-weight: 400;
font-size: 16pt;
text-transform: uppercase;
background: var(--blue);
border: 1px solid var(--blue);
display: block;
border-radius: 4px;
height: 8vh;
line-height: 8vh;
width: 100%;
color: #fff;
text-align: center;
}

a.btn-score {
font-family: 'Roboto Condensed', sans-serif;
font-weight: 400;
font-size: 16pt;
text-transform: uppercase;
color: var(--txtcolor);
display: block;
border-radius: 4px;
height: 8vh;
line-height: 8vh;
width: 100%;
background: #fff;
text-align: left;
padding-left: 2rem;
}

a.btn-transparent {
background: var(--bg);
color: var(--orange);
border: 0px;

}

.shadow {
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}


.form-control {
padding: 0.575rem 1rem !important;
border-top: 0px;
}

.btn-primary {
background: var(--orange);
color: #fff;
border: 0px;
height: 50px;
line-height: 40px;
font-size: 16pt;
}

.btn-primary:hover {
background: var(--darkerorange);
}

.w100 {
width: 100%;
}

.input-group-text {
font-family: 'Roboto Condensed', sans-serif;
font-weight: 400;
font-size: 13pt;
color: var(--blue);
min-width: 174px !important;
text-transform: capitalize;

background: #fff !important;
border-radius: 0px;
border-top: 0px;
}

input[type="text"], input[type="password"] {
padding-left: 5px;
}

.reden {
font-family: 'Roboto Condensed', sans-serif;
font-weight: 400;
font-size: 16pt;
text-transform: uppercase;
color: var(--txtcolor);
display: block;
border-radius: 4px;
height: 5vh;
line-height: 5vh;
width: 100%;
background: #fff;
text-align: center;
margin-bottom: 0.5rem;
}

.actie {
font-family: 'Roboto Condensed', sans-serif;
font-weight: 400;
font-size: 16pt;
text-transform: uppercase;
color: var(--txtcolor);
display: block;
border-radius: 4px;
height: 5vh;
line-height: 5vh;
width: 100%;
background: #fff;
text-align: center;
margin-bottom: 0.5rem;
}

.prospect {
font-family: 'Roboto Condensed', sans-serif;
font-weight: 400;
font-size: 14pt;
text-transform: uppercase;
color: var(--txtcolor);
display: block;
border-radius: 0px;
border-bottom: 1px solid var(--bg);
height: 50px;
line-height: 50px;
width: 100%;
background: #fff;
text-align: left;
margin-bottom: 0rem;
padding-left: 1rem;
cursor: pointer;
border-left: 3px solid var(--green);
}

#qa {
width: 80px;
height: 80px;
background: var(--orange);
border-radius: 888px;
text-align: center;
line-height: 80px;
position: fixed;
bottom: 5vh;
right: 5vw;
}

#qa i, #qa .fa {
color: #fff !important;
font-size: 21pt;
line-height: 80px;
}

#qa:hover {
background: var(--darkerorange);
}

table tr td {
text-align: left;
background: #fff;
}

a.addnote {
color: var(--orange);
}

a.addnote2 {
color: #fff;
}

textarea {
padding: 0.5rem 1rem !important;
line-height: normal;
}

.nav-item {
margin-bottom: 11px;
}

.navbar-light .fa {
color: var(--orange);
}

.navbar-light .navbar-nav .nav-link {
color: var(--blue);
}

.navStyleWF {
border: 1px solid #eee;
border-radius: 6px;
padding: 5px 15px;
}

.navStyleWF .fa {
padding-right: 11px;
}

.navStyleWF:hover {
background: var(--lightgrey)
}

.redText {
color: var(--red) !important;
}

.redBackground {
background: var(--red) !important;
}

.redBorder {
border: 1px solid var(--red) !important;
}

.show {
    display: inline-block !important;
}

.hide {
    display: none !important;
}