/* =========== Body =========== */
body {
    font-family: "Karla";
    font-size: 14px;
    color:#4d4d4d;
}

p {
	margin: 0px;
}

#wrapper{
    max-width: 1200px;
    margin:0 auto;
    position: relative;
    z-index: 3;
    background-color:transparent;
    padding: 12px 12px 0 12px;
}

/* =========== Header ============= */

header {
	width:100%;
	background-color:#fff;
}

/* =========== Navigation =========== */

#top-menu {
    float: left;
    padding-top: 4px;
    width: 70%;
}

.top-menu-item {
    float: right;
    text-align: center;
    margin: 0 0 0 30px;
}

@media (min-width: 768px) {

    /* === Header styles === */
    header {
        height: 195px;
    }

    /* === Footer styles === */
    .footer-text {
        width: 920px;
    }

    .navbar-toggle {
        background-color:#4d4d4d;
    }

    .navbar.navbar-inverse{
        background: #fff;
        border-color: transparent;
        /*float: left;*/
    }
    .navbar.navbar-inverse .navbar-collapse{
        border-color: transparent;
        padding-top: 0px;
    }
    .navbar.navbar-inverse .navbar-nav>li>a{
        color: #4d4d4d;
        text-transform: uppercase;
        font-weight: bold;
        font-size: 14px;
	background-color:transparent;
        /*padding: 5px 12px 5px 12px;
        margin-left:10px;
        -moz-border-radius:10px;
        -webkit-border-radius:10px;
        border-radius:6px;
        border:1px solid #8b8988*/
        padding: 13px 20px;
    }
    .navbar.navbar-inverse .navbar-nav>li:hover>a{
        color: #4d4d4d;
        background-color:#fff;
        border-bottom:2px solid #0099c7;
    }
    .navbar.navbar-inverse .navbar-nav>.active>a, 
    .navbar.navbar-inverse .navbar-nav>.active>a:hover, 
    .navbar.navbar-inverse .navbar-nav>.active>a:focus {
        background: #fff;
        color: #4d4d4d;
        border-bottom:2px solid #0099c7;

    }
    
    .navbar.navbar-inverse .navbar-nav>.active> a:before {
        /*content: "";
        width: 0;
        height: 0;
        font-size: 0;
        border: 5px solid transparent;
        border-right: 5px solid #f26622;
        border-bottom: 5px solid #f26622;
        position: absolute;
        margin-top: 4px;
        left: -10px;*/
		
		display: block;
		height: 20px;
    	width: 20px;
    	background-image: url('../images/white_down_arrow.png');
    	background-repeat: no-repeat;
    	background-position: center -1px;
    	position: absolute;
    	right: 15px;
    	z-index: 9999;
    }
	.navbar-header {
        width:100%;
    }
	
    .menu-item-arrow {
    	display: none;
		height: 20px;
    	width: 20px;
    	background-image: url('../images/white_down_arrow.png');
    	background-repeat: no-repeat;
    	background-position: center -1px;
    	position: absolute;
    	right: 15px;
    	z-index: 9999;
    }
    
    ul.dropdown-menu {
    	background: #fff;
	}
	
	ul.dropdown-menu > li > a {
		color: #4d4d4d;
	}
	
	ul.dropdown-menu > li > a:hover, ul.dropdown-menu > li > a.active-subitem {
		color: #913B8E;
		background: #fff;
	}
}

.navbar-inverse {
    background-color: #fff!important;
    border-color: #fff!important;
}

.navbar-inverse button.navbar-toggle {
    background-color: #0098c7;
    border: none;
    margin-top: 20px;
}

.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
    background-color: #913b8e;
}

.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus,
li:hover ul.dropdown-menu li a:hover {
    color: #0098c7;
}

#mobile-logo {
    float: left;
    margin-left: 15px;
}

#mobile-logo img {
    height: 75px;
}

@media (max-width: 768px) {

    #top-menu {
        width: auto;
        padding-top: 2px;
        height: 24px;
    }

    li:hover .menu-item-arrow, li:hover ul.dropdown-menu {
        display: block;
        background-color: #fff;
    }

    li:hover .menu-item-arrow, li:hover ul.dropdown-menu a {
        color: #999;
    }

    li:hover .menu-item-arrow, li:hover ul.dropdown-menu a:hover {
        background-color: #fff;
    }

    .dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        padding-left: 20px;
    }

    .nav > li {
        overflow: hidden;
    }

    .navbar-collapse.in {
        overflow-y: unset;
    }

    .footer-column	{
        padding-bottom:25px;
    }

}

a.top-button	{padding:4px 8px;
		background-color:#74c442;
                color:#fff;			
}

a.inschrijfbutton	{padding:4px 8px;
			background-color:0099c7;
                	color:#fff;}



/* =========== Carousel =========== */
.carousel{
    margin: 0 0 10px 0;
}

.carousel img	{/*-moz-border-radius:10px;
        -webkit-border-radius:10px;
        border-radius:6px;
        border:1px solid #A73798;*/}


/* =========== Headings =========== */
h1, h2, h3, h4, h5, h6 {
    font-family: Calibri, "Open Sans", "Arial";
}

h1 {
    font-size: 20px;
    line-height: 24px;
    word-break: normal;
    font-weight: bold;
    margin-top: 10px;
    padding: 12px 0;
    color: #4d4d4d;
}


h2 {
    font-size: 20px;
    line-height: 24px;
    word-break: normal;
    font-weight: bold;
    margin-top: 10px;
    border-bottom: 2px solid #eee;
    padding: 12px 0;
    color: #fa9f24;
}

h3  {
    font-size: 20px;
    line-height: 24px;
    word-break: normal;
    font-weight: bold;
    margin-top: 10px;
    border-bottom: 2px solid #eee;
    padding: 12px 0;
    color: #74c442;
    text-align:center;
}


h4 {
    font-size: 20px;
    line-height: 24px;
    word-break: normal;
    font-weight: bold;
    margin-top: 10px;
    border-bottom: 2px solid #eee;
    padding: 12px 0;
    color: #009ac8;
}

/* =========== Logo =========== */

.logo{
    width: 225px;
	position: absolute;
	left: -38px;
	top: 0px;
}

.logo a {
    background: url("../images/logo-transparent.png") no-repeat;
    background-size: 100% 100%;
    width: 225px;
    height: 121px;
    display: block;
    float: left;
}

@media (min-width: 1200px) { 
    .logo{
        position: absolute;
        left: -38px;
        top: 0px;
        width: 225px;
    }
    
    .logo a{
        width: 225px;
        height: 121px;
    }
    
    .logo h2 {
        text-align: right;
    }
}

/* =========== Box =========== */
.box {
	float:left;
    background: #fff;
    padding: 0 20px 15px 0;
    margin-bottom: 35px;
    position: relative;
    min-height: 190px;
    text-align: left;
}

.box img {
	max-width: 200px;
	height: auto;
	float: right;
	margin: 0 0 10px 10px;
}

table.style1 {
	table-layout: fixed;
}

td.style4 {
	word-wrap: break-word;
}

/* =========== Sidebar =========== */
.inlogbox {
	float:left;
    background: #eee;
	color: #fff;
    font-weight: bold;
    padding: 15px 15px 0 15px;
    text-align: justify;
    width: 280px;
}

.inlogbox li {
	list-style:none;
    text-indent:none;
	
}
               
.inlogbox a {
    color: #fff;
    text-decoration: none;
}

.inlogbox a:hover {
	color:#fff;
	text-decoration:underline;
}
								
div.search input {
	margin: 0;
	width: 170px;
	font-weight:normal;
	color: #000;
	border: 13px #0098c7 solid;
}

#header-search-form {
    float: left;
    display: none;
}

.sidebar-widget {
	background: transparent;
	float: left;
	padding-bottom: 15px;
        margin-bottom:15px;
        width:100%;
        overflow: scroll;
        overflow-x: hidden;
        height:280px;
}

.sidebar-widget2 {
	background: transparent;
	float: left;
        width:100%;
}

.widget-item {
	float: left;
	width: 100%;
	padding: 5px 10px;
	background: transparent;
}

.agenda-block, .agenda-block-old {
	display: none;
}

.agenda-block-show {
	display: block;
}

.agenda_month {
	display: block;
	float: left;
	padding: 3px 8px;
	margin-left: 5px;
	width: 40px;
	text-align: center;
	background-color: #74C442;
	color: #fff;
	border-radius: 5px;
}

.agenda_month.hidden_month {
	display: none;
}

.agenda_month:hover, .agenda_month.active_month {
	background-color: #999;
	color: #000;
	text-decoration: none;
}

.agenda_month_prev, .agenda_month_next {
	display: block;
	float: left;
	padding: 3px 5px;
	margin-left: 5px;
	background-color: #999;
	color: #000;
	text-decoration: none;
	border-radius: 5px;
}

.agenda_month_prev:hover, .agenda_month_next:hover,
.agenda_month_prev:visited, .agenda_month_next:visited,
.agenda_month_prev:active, .agenda_month_next:active,
.agenda_month_prev:link, .agenda_month_next:link
{
	color: #fff;
	text-decoration: none;
}

.agenda_month_prev.disabled, .agenda_month_next.disabled
{
	color: #777;
}

#show_agenda {
	display: block;
	visibility: hidden;
	width: 140px;
	text-align: center;
	background-color: #0098c7;
    border: 1px solid #5b5b5b;
    border-radius: 10px;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    padding: 5px 0px;
    margin: 0px auto;
    text-shadow: none;
}

#show_agenda:hover, #show_agenda:visited, #show_agenda:link, #show_agenda:active {
	text-decoration: none;
}

/* =========== Blog =========== */

.post-block {
	float: left;
	width: 100%;
	margin: 10px 0px 20px 0px;
	border-bottom: 1px solid #777;
}

.post-block-border {
	float: left;
	width: 270px;
	padding: 0 12px 12px 12px;
	border: 10px solid #913b8e;
}

.post-image {
	width: 100%;
	margin-bottom: 15px;
	border:0px;
}

.img-thumbnail {
	border: none!important;
	margin-bottom:12px;
	width: 100%;
	height: 220px;
	overflow: hidden;
	text-align: center;
	padding: 0px;
}

.img-thumbnail.top-post {
    height: 290px;
}

.img-thumbnail img.post-image {
	min-width: 270px;
	min-height: 220px;
}

.post-block iframe {
	margin-bottom: 15px;
}

.post-date {
	text-decoration: underline;
}

.post-date.top-post {
    display: block;
    margin-bottom: 10px;
}

.post-title {
	color: #666;
}

#homepage-blog-blocks .post-title {
    min-height: 98px;
}



#homepage-blog-blocks .post-block {
    border-bottom: none;
}

.post-content p {
	/*text-align: justify;*/
}

.post-block .post-content a.lees-meer-link,
.post-content.top-post a.lees-meer-link {
	clear: both;
	display: block;
	margin: 10px 0 20px 0;
	font-size: 14px;
}

@media (min-width: 991px) {

    #background {
        background-image: url("../images/nieuw-223/background-bottom-gray.png");
        background-position: left bottom;
        background-color: #fff;
        background-repeat: repeat-x;
        /*position: fixed;*/
        height: 100%;
        width: 100%;
    }

    #homepage-blog-blocks .post-content {
        min-height: 300px;
    }

    #homepage-blog-blocks .post-content a.lees-meer-link {
        position: absolute;
        bottom: 15px;
    }
}

@media (max-width: 990px) {
    footer {
        background-color: #DDD;
    }

}
/*.post-block .post-content a[target=_blank]:after,*/
.item-content a[target=_blank]:after {
	content: ' >> ';
}

.post-block .post-content a:hover {
	color: #9f218c;
}

.clear {
	width: 100%;
	clear: both;
}

.post-space {
	width: 1px;
	height: 30px;
	float: left;
}

.item-content img {
	margin: 6px 12px;
}

/* = Footer = */
footer {
    position: relative;
	margin: 20px -15px 0 -15px;
}

.footer-inner{
    background-color: transparent;
    min-height: 150px;
    padding:20px 0px 15px 0px;
}

.footer-text	{color: #4d4d4d;
    font-weight:bold;
    font-size: 14px;
    line-height: 16px;
    padding:14px;
}

footer a {
    color: #4d4d4d;
	font-weight:normal;
    text-decoration: none;
}

footer a:hover {
	color:#4d4d4d;
	font-weight:normal;
	text-decoration:underline;
}

.footerwidth-1	{width:22%;}
.footerwidth-2	{width:18%;}
.footerwidth-3	{width:14%;}
.footerwidth-4	{width:26%;}
.footerwidth-5	{width:22%;}


.col-md-8, .col-md-12	{padding-left:16px!important;}

.col-md-6 {padding-left:0px!important;}

/* = Login block = */
.login-button-link {
    margin-left: 60px;
}

img.login-button {
    height: 30px;
    margin-top: 8px;
}

p.login-data {
    margin-top: 14px;
	text-align:right;
    color: #FFF;
}

p.login-data a {
    color: #fff;
	font-weight:bold;
    text-decoration: none;
}

p.login-data a:hover {
    color:#74c442;
	font-weight:bold;
}

/* = Modal block = */
.modal-body {
    background: none repeat scroll 0 0 #EEEEEE;
    margin: 0 auto;
    width: 350px;
}

.modal-header {
    background: none repeat scroll 0 0 #CCCCCC;
    margin: 200px auto 0;
    width: 350px;
}

/* = Newsletter block = */
.newsletter-block b {
    color: #666;
}

.newsletter-block input[type=text] {
    width: 145px;
    height: 20px;
    font-size: 13px;
}

.newsletter-block input.btn {
    background-color: #0098c7;
    width: 80px;
    margin-left: 5px;
	margin-top:10px;
    height: 20px;
    color: #FFF;
    padding: 0;
    border-radius: inherit;
    font-size: 13px;
}

/* = Profile page = */
.btn-profile {
    margin: 3px;
}

.right-sidebar {
    background-color:#eee;
	height:100%;
    width: 280px;
}

/* Loop Tables: Start */
/* Loop uses empty <tr> at start and begin of table, it is trick to add [CAT_LOOP:] - need to hide this <tr> */
table.loop >tbody>tr:first-child>td, table.loop >tbody>tr:last-child>td{
	display: none;
}

table.loop{
	width: 100%;
	border-collapse: collapse;
}
table.loop thead td{
	font-weight: bold;
	background: #0098C7;
	color: #fff;
	padding:8px;
}

table.loop td{
	text-align: left;
	border: 1px solid #000;
	padding: 3px;
}

table.loop td a{
	color: #0098C7;
}

table.act-table td {
	max-width: 300px;
	word-wrap: break-word;
}
/* Lopp Tables: End */

#opl-table {
	width: 600px;
	table-layout: fixed;
}

#opl-table td{
	word-wrap: break-word;
}

#questionnarieForm .label{
	color: #000;
	font-size: 100%;
}

td.invalid-parent input, td.invalid-parent textarea, .radioBlock td.invalid-parent {
	border: 1px solid #f00;
}

.optional, input, select {
    margin-bottom: 8px;
}

/* Profiel form */
#ui-datepicker-div {
    z-index: 100;
}

#ui-datepicker-div select {
    color: #000;
}

.panel-heading {
	overflow: hidden;
	display: block;
}

.panel-heading:hover {
	background-color: #74c442;
	color: #fff;
	cursor: pointer;
}

.panel-heading.headers, .panel-heading.headers:hover {
	background-color: #0098c7;
	color: #fff;
	cursor: default;
}

.data-column-naam {
	float: left;
	width: 34%;
	min-height: 20px;
}

.data-column-agb {
	float: left;
	width: 40%;
	min-height: 20px;
}

.data-column-pc {
	float: left;
	width: 24%;
	min-height: 20px;
}

/* form attachemnts */
input[type=file] {
	float: left;
}
input[type=file] + a {
	float: left;
	margin-top: 3px;
	display: block;
}

table.loop td.act-actions {
	width: 67px;
	padding: 5px 10px;
}

a.edit-pencil {
	display: block;
	height: 20px;
	width: 20px;
	float: left;
	background: url(../images/pencil-20x20.png);
}

a.edit-pencil:hover, a.delete-bin:hover {
	background-color: #eee;
	text-decoration: none;
	cursor: pointer;
}

a.delete-bin {
	display: block;
	height: 20px;
	width: 20px;
	float: left;
	margin-left: 5px;
	background: url(../images/recycle_bin.png);
}

.answer	{margin-left: 8px;}

input[type=checkbox] {margin-right:20px;}

.valign-top {
	vertical-align: top;
}

a.btn-info2	{color:#fff;
			background-color:#0098c7;
			border-color:#0098c7;
}

a.btn-info3	{color:#fff;
			background-color:#f9a533;
			border-color:#f9a533;
			}
			
a:hover.btn-info2	{color:#fff;
			background-color:#0488b1;
			border-color:#0488b1;
}

a:hover.btn-info3	{color:#fff;
			background-color:#f6991c;
			border-color:#f6991c;
			}
			
a.btn-info4	{color:#fff;
			background-color:#f9a533;
			border-color:#f9a533;
			}
			
a:hover.btn-info4	{color:#fff;
			background-color:#f6991c;
			border-color:#f6991c;
			}
			
a.btn-info5	{color:#fff;
			background-color:#913b8e;
			border-color:#913b8e;
			}
			
a:hover.btn-info5	{color:#fff;
			background-color:#913b8e;
			border-color:#913b8e;
			}

.agenda-widget-table td {
	vertical-align: top;
}

.agenda-widget-table td:first-child {
	color: #7EB02E;
	width: 55px;
}

.screen-tab {
	display: block;
	float: left;
	border: 1px solid #269abc;
	background-color: #39b3d7;
	color: #fff;
	padding: 2px 10px;
	margin: 0 5px 5px 0;
}

#pageTabs, .pageTabs {
	clear: both;
	overflow: auto;
}

.logicare-circle-symbol {
	font-size: 140px!important;
}

.logicare-circle {
	width: 210px !important;
	height: 210px !important;
	border-radius: 50%;
	font-size: 30px;
	color: #ffffff;
	text-align: center;
	background: #0098c7;
	display: table-cell;
	vertical-align: middle;
	font-weight: bold;
	line-height: 40px;
	font-family: droid-sans, sans-serif;
}

.layout_container p {
	margin: 16px 0;
}

.radioBlock	td {text-align:left!important;}

.pageBlock table td	{padding:2px 0 2px 0;}
.pageBlock table td.header {font-style:italic;}