/* plaats je maatwerk CSS hieronder */
:root {
    --border-color: var(--grey-200) !important;
    --card-border-color: var(--grey-200) !important;
    --card-border-color-hover: var(--grey-200) !important;
    --card-shadow-hover: var(--shadow-xl) !important;
    --border-color-transparent-light: rgba(255,255,255,.15);
}

.site-header-searchbar .btn-secondary {
    /*--btn-secondary-bg-color: var(--supporting-500);
    --btn-secondary-bg-color-hover: var(--supporting-400);*/
    --btn-secondary-border-color: var(--supporting-500);
    --btn-secondary-border-color-hover: var(--supporting-400);
}

@media screen and (min-width: 992px) {

    /********global******/
    .site-nav {
        border-top: solid 1px var(--border-color-transparent-light);
    }

    .topmenu {
        border-bottom: solid 1px var(--border-color-transparent-light);
    }

    #column_left {
        border: var(--border);
        border-radius: var(--border-radius);
    }

    #column_left {
        margin-inline-end: var(--gutter);
        padding: .5rem var(--gutter);
        background-color: var(--card-background-color);
    }

    .wrapper.content #content.col_left,
    .wrapper.content #content.col_right {
        width: calc(100% - (var(--sidebar-width) + var(--gutter)));
    }

    #tabs {
        --tabs-tab-bg-color: var(--card-background-color) !important;
        --tabs-tab-bg-color-active: var(--card-background-color) !important;
    }
}

/*------ Utilities ------*/
.buttons-centered .btn-group {
 	 justify-content: center;
}

.card-transparent {
 	background-color: transparent; 
  	border: none;
}

.card-transparent:hover,
.card-transparent:focus {
 	border: none; 
}

.card-dark-transparent > * {
  	color: var(--grey-50);
}

.card-title-underline .card-title {
 	text-decoration: underline; 
}

.card-title-size-xl .card-title {
 	font-size: var(--text-size-xl); 
}

.card-image-border-radius img {
 	 border-radius: var(--border-radius);
}
/*------ widgets ------*/
.widget-card {
    --card-border-color: var(--grey-200) !important;
    --card-border-color-hover: var(--grey-200) !important;
}

.card-shadow-hover:hover,
.card-shadow-hover:focus {
    box-shadow: var(--shadow-xl);
}

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

.widget-card .card-title {
    margin-block-end: 0;
}