
/* Site variables 

ww-green:	#4B6B39;
ww-lgreen:	#C0E965;
ww-grey:	#625857;
ww-orange:	#E26C14;
ww-purple:	#5D1932;

*/
:root {
	--color1: rgba(42, 45, 52, 1);
	--color2: rgba(226, 108, 20, 1);
	--color3: rgba(0, 157, 220, 1);
	--color4: rgba(103, 97, 168, 1);
	--color5: rgba(0, 155, 114, 1);
	--color6: rgba(196, 95, 17, 1);
	--color7: rgba(70, 66, 114, 1);
	--color8: rgba(0, 111, 155, 1);
}

/* global settings */
a {
	color: var(--color1);
}
a:hover {
	text-decoration: none;
	color: var(--color2);
}
.btn-orange {
	background-image: linear-gradient(to bottom,var(--color6) 0,var(--color2) 100%);
	background-color: var(--color2);
	border-color: var(--color6);
}
.btn-orange:hover {
	background-color: var(--color2);
	border-color: var(--color6);
}
.btn-orange:active {
	background-color: var(--color2);
	border-color: var(--color6);
}
.btn-purple {
	background-image: linear-gradient(to bottom,var(--color8) 0,var(--color3) 100%);
	background-color: var(--color3);
	border-color: var(--color8);
	color: #fff;
}
.btn-purple:hover {
	background-image: linear-gradient(to bottom,var(--color6) 0,var(--color2) 100%);
	background-color: var(--color2);
	border-color: var(--color6);
	color: #fff;
}
.btn-purple:active {
	background-color: var(--color3);
	border-color: var(--color8);
}



/* top menu */
div.title-bar {
	background-color: #fff	;
}
div.main-menu {
	margin-top: 5px;
}

/* navigation items */

.container-fluid {
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}

.navbar-default {
	background-color: #fff;
	background-image: linear-gradient(to bottom,#fff 0,#fff 100%);
	border-color: #fff;
	box-shadow: none;
}
/* active items */
#navbar-topmenu .navbar-nav>.active>a, #navbar-topmenu .navbar-nav>.open>a {
	background-color: var(--color2);
	background-image: linear-gradient(to bottom,var(--color6) 0,var(--color2) 100%);
	color: #fff;
}
#navbar-topmenu .navbar-nav>.active>a:hover, #navbar-topmenu .navbar-nav>.open>a:hover {
	background-color: var(--color3);
	background-image: linear-gradient(to bottom,var(--color8) 0,var(--color3) 100%);
	color: #fff;
}
/* normal items */
#navbar-topmenu .navbar-nav>li>a {
	background-color: #fff;
	background-image: linear-gradient(to bottom,#fff 0,#fff 100%);
	color: #000;
}
#navbar-topmenu .navbar-nav>li>a:hover {
	background-color: var(--color3);
	background-image: linear-gradient(to bottom,var(--color8) 0,var(--color3) 100%);
	color: #fff;
}



/* top title */
span.title_woorden {
	color: var(--color2);
	font-size: 30px;
	font-weight: bold;
}

span.title_wijzer {
	color: var(--color3);
	font-size: 30px;
	font-weight: bold;
}
span.subtitle_woorden {
	color: var(--color2);
	font-size: 15px;
	font-weight: bold;
}


/* main content */
html {
	position: relative;
	min-height: 100%;
}
body {
	margin-bottom: 60px; /* Margin bottom by footer height */
}
div.main-content {
	padding-top: 10px;
}

/* Floating woorden lijst */




/* table with themas */
.first-letter {
	font-size: 16px;
	font-weight: bold;
}
.thema-letters {
	margin-bottom: 20px;
}

/* nieuwelijst form */
div.nieuwelijst_cohort {
	height: 30px;
}
div.nieuwelijst_cohort input.form-control{
	display: block;
    float: left;
    margin: -7px 0px 0px 0px;
	width: 24px;
}

/* woorden lijst */
.icon-red {
	color: red;
}

.icon-green {
	color: green;
}

/* gebruikers lijst */
.table-header{
	background-color: var(--color1);
	color: #ffffff;
	font-weight: bold;
}


/* footer */
.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 60px; /* Set the fixed height of the footer here */
	line-height: 60px; /* Vertically center the text there */
	background-color: var(--color3);
}

.footer-content-row #footer-content{
	height: 30px;
	margin-top: 15px;
}

