/*
Theme Name: Hoi Utrecht
Theme URI: https://www.webmandesign.eu/portfolio/michelle-wordpress-theme/
Template: michelle
Author: High Teck
Author URI: https://high-teck.com
Description: Hoi Utrecht theme is based on the Solgu.nl implementation of the michelle theme by Webman.
It has been modified to work with the content structure of this site.
*/

body.tag-verhaal .site-main {
    max-width:1400px;
}
/*.site-header-section {*/
/*    padding: 0 2vw;*/
/*}*/
/*.site-header-content {*/
/*    max-width: calc(100% - 2vw);*/
/*}*/
body.tag-verhaal .entry-content-singular {
    display:flex;
    gap:1rem;
}
body.tag-verhaal .entry-content-singular .verhaal {
    flex:3;
}
/* Sidebar */
body.tag-verhaal aside {
    flex:1;
    background-color: #f4f4f4;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Optional for some visual styling */
}

/* Responsive styles for tablets (medium screens) */
@media (max-width: 1024px) {
    body.tag-verhaal .entry-content-singular {
        flex-direction: column; /* Stack content vertically */
    }

    body.tag-verhaal .entry-content-singular .verhaal,
    body.tag-verhaal aside {
        flex: none; /* Reset flex-grow behavior */
        width: 100%; /* Take full width */
    }
	body.tag-verhaal aside img.wp-post-image {
		width:100%;
	}
}

/* Responsive styles for mobile (small screens) */
@media (max-width: 768px) {
    body.tag-verhaal .site-main {
        padding: 0 1rem;
    }

    body.tag-verhaal aside {
        background-color: #ffffff; 
        padding: 15px;
        box-shadow: none;
    }

    body.tag-verhaal .entry-content-singular .verhaal {
        padding-bottom: 1rem; /* Add spacing below main content */
    }
}
.sui.sui-location-arrow {
    color:#522c7f !important;
}
hoiquote {
    text-align: center;
    font-size: 20px;
    line-height: 1.62em;
    color: #777;
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 5%;
    display: block;
}

.wp-post-navigation a {
    text-decoration:none;
    line-height: 22px;
}

#menu-primary .sub-menu a:hover {
    color:pink;
}
#menu-primary .sub-menu a {
    border-bottom: solid 1px white;
}