/* STYLES FOR Babboes.nl */

body {
    background-image: url("../../../images/backgrounds/achtergrond_algemeen.jpg");
    background-size: cover;
    background-attachment: fixed;

    font-family: 'Trebuchet ms', Trebuchet, sans-serif;
    font-size: 1rem;
    text-align: left;
    color: #424228;
    letter-spacing: 0.05em;
}


a:not([class]) {
    text-decoration: none;
}

a {
    color: #da251d;
}

a:hover,
a:active {
    color:#e67814;
}


.container-header {
    background-image: none;
    background-color: #ffffff;
}

.container-header .topbar {
    background-image: url("../../../../../images/backgrounds/babboes_bovenrand_verbreed_gespiegeld.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 134px;
    background-color: transparent;
}


.container-footer {
    background-image: url("../../../../../images/backgrounds/babboes_onderrand_verbreed.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 130px;
    background-color: transparent;
}

.footer-onderrand {
    background-color:#e67814;
    height: 134px;
}

.debug.footer-onderrand .mod-menu{
    width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.debug.footer-onderrand .mod-menu li{
    text-align:center;
}

.debug.footer-onderrand .mod-menu li a,
.debug.footer-onderrand .mod-menu li a:hover{
    color:#ffffff;
}

.site-grid {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.grid-child.container-component {
    padding: 0 15px;
    background-color:#ffffff;
}

@media screen and (min-width:992px) {
    .navbar.navbar-expand-lg {
        margin-left: auto;
        margin-right: auto;
    }
}

/* weergave menu-ikoontjes in off-canvas menu */
.navbar .menu-img-home {
    max-width: 100px;
}
.navbar .menu-img-verteller,
.navbar .menu-img-docent,
.navbar .menu-img-auteur,
.navbar .menu-img-contact {
    max-width: 120px; /* 80px; */
}

@media screen and (min-width:992px) {
    /* weergave in horizontaal menu */
    .navbar .menu-img-home {
        max-width:150px; /* 100px; */
    }

    .navbar .menu-img-verteller,
    .navbar .menu-img-docent,
    .navbar .menu-img-auteur,.navbar .menu-img-contact {
        max-width: 120px; /* 80px; */
    }
}

.view-article .item-page {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.container-header .navbar-toggler {
    color: #e67814;
    border: 1px solid #e67814;
    margin-left: 24px;
}

.itemid-101.home .com-content-categories__item {
    border-top: 10px solid #e67814;
    border-bottom: none;
    float:none;
    clear: both;
}

.itemid-101.home .com-content-categories__item-title-wrapper .com-content-categories__item-title {
    display:none;
}

.itemid-101.home .com-content-categories__item img{
    float:left;
    width:38%;
    margin-right:16px;
}

.itemid-101.home .com-content-categories__description category-desc {
    float:right;
    width:58%;
}

.itemid-101.home .com-content-categories__item.item-16 .custom-readmore {
    /* hide readmore button of first item */
    display:none;
}

.itemid-101.home .com-content-categories__item.item-16 img {
    margin-bottom: 16px;
}

.logo-kleine-schermen img {
    width:100px;
    float: right;
    margin-right:16px;
}


.view-category.layout-blog .category-desc .img-container {
    width: 100%;
    text-align: center;
}

.com-content-category-blog.blog .category-desc img {
    display:block;
    float:none;
    margin-left:auto;
    margin-right:auto;
}

.blog-item .item-image img,
.mod-articles-items .item-image img,
.com-tags__items .list-group-item img {
    object-fit: cover;
    transition: transform .5s;
    height: 100%;
    width: 100%;
}


.tags a.btn {
    border: 1px solid #ffffff;
    background-color: #e67814;
}

.tags a.btn:hover {
    border: 1px solid #424228;
    color: #424228;
}

.no-card.tags-list ul {
    list-style-type:none;
}

.no-card.tags-list li {
    display: block;
    float: left;
    margin-right: 7px;
    text-decoration: none;
    border: 1px solid #e67814;
    padding: 4px 8px;
}


.mod-breadcrumbs.breadcrumb {
    background-color: transparent;
    border-top: 1px solid #e67814;
    border-bottom: 1px solid #e67814;
}

.breadcrumbs .divider.icon-location {
    display:none;
}

.breadcrumbs a,
.breadcrumb-item.active
{
    font-size:0.9em;
    color:#888888;
}

.breadcrumb-item.active span {
    display: inline-block;
    padding-top: 0.1em;
}