@CHARSET "UTF-8";

/* body */
body {
	background-color: #F4F4F4;
	font-size: 16px;
}

.pad {
	padding-top: 50px;
}


.myscroll-250 {
    overflow: scroll;
    height: 250px;
	left: 0px;
}

.divagenda {
	width: 250px;
	height: 250px;
	position: left;
	border: 0px solid black;
	overflow: scroll;
}


hr { 
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
	border-top: 1px solid #F26F29;
}
.lightblue {
	color: #2ECCFA;
}

.groen {
	color: #088A29;
}

.paars {
	color: #C900FF;
}

.red {
	color: #FF0000;
}

.orange{
	color: #F26F29;
}

.background-orange{
	background-color: #F26F29;
	color: white;
}


.blauw {
	color: #00007F;
}

.grijs {
	color: #6E6E6E;
}

.lightgreen {
	color: #00EE05;
}

/* nieuws blokken */
.news-blok {
    border: 1px solid #F26F29;
    padding: 10px;
	background-color: white;
	
}

.img1 {
    float: right;
	width: 250px;
	height: auto;
	margin-left :15px;
}

.img2 {
    float: auto;
	width: 210px;
	height: auto;
	margin-left :1px;
}

.img3 {
	float: auto;
	width: 150px;
	height: auto;
	margin: 15px;
}

.well {
	min-height: 300px;
}

.clearfix {
    overflow: auto;
}

/* navbar */
.navbar-default {
	background-color: #00007f;
   	margin-bottom: 0;
   	border-radius: 0;
}

/* navbar icon */
   .navbar-toggle, .icon-bar {
   	border:1px solid #F26F29;
}

/* title */
.navbar-default .navbar-brand {
    color: #F26F29;
   	font-size: 60px;
    left: 0;
    margin:0 auto;	
}

/* mouseover */
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
	color: #F26F29;
}

/* link */
.navbar-default .navbar-nav > li > a {
	color: #F26F29;
}

/* link on mouseover */
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #00007f;
	background-color: #F26F29;
}

/* active */
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #F4F4F4;
    background-color: #F26F29;
}

/* dropdown auto open */
.dropdown:hover .dropdown-menu {
   display: block;
}

/* drop-menu on open */
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: #121266;
    background-color: #DFEFFF;
}

/* link on mouseover */
.navbar-default .navbar-nav .drop-menu > li > a:hover,
.navbar-default .navbar-nav .drop-menu > li > a:focus {
    color: red;
	background-color: #DFEFFF;
} 

/* caret */
.navbar-default .navbar-nav > .dropdown > a .caret {
    border-top-color: #F26F29;
}

/* Set height of the grid so .sidenav can be 100% (adjust as needed) */
.row.content {height: 400px}

/* Set light blue background color and 100% height */
.sidenav {
  padding-top: 20px;
  height: 100%;
}

/*specific button alignment*/    
.button-align-left {
   text-align: left;
}

p.text {
   	padding: 0cm 1cm;
	text-align: justify;
}
    
.bg-image {
   	position: relative;
}

.bg-image img {
   	display: block;
   	width: 100%;
   	max-width: auto; /* corresponds to max height of 450px */
   	margin: 0 auto;
}

.container {
	width: 100%;
	position: relative;
}

.item {
   	position: relative;
}

.item img {
   	display: block;
   	width: 50%;
   	max-width: auto; /* corresponds to max height of 450px */
   	margin: 0 auto;
}

/* Set blue background color, light blue text and some padding */
.footer {
  		/* position: fixed; */
  		left: 0px;
  		bottom: 0px;
  		width: 100%;
  		background-color: #00007f;
  		color: #F26F29;
  		text-align: center;
}

/* extra carousel zoom */
@-webkit-keyframes zoom {
  from {
    -webkit-transform: scale(1, 1);
  }
  to {
    -webkit-transform: scale(1.5, 1.5);
  }
}

@keyframes zoom {
  from {
    transform: scale(1, 1);
  }
  to {
    transform: scale(1.5, 1.5);
  }
}

.carousel-inner .item > img {
  -webkit-animation: zoom 20s;
  animation: zoom 20s;
}


.carousel-inner img {
    width: 100%; /* Set width to 100% */
    margin: auto;
    max-height: 350px;
}
   
/* On small screens, set height to 'auto' for sidenav and grid */
@media screen and (max-width: 767px) {
  .sidenav {
    height: auto;
    padding: 15px;
  }
  .row.content {height:auto;} 
}