/**
 * Color classes and default styling are in /assets/main.css, focus your efforts there
 * @import external fonts at top of this page before default.css
 * remove comment for dark-mode.css if you want to enable that -- will not be 100%, you will need to fix minor things
 */
@import url("./assets/default-settings.css");
/** @import url("assets/dark-mode.css"); */

.wp-block-quote { padding-left: 1rem; font-size: 2.25rem; color: rgb(var(--bs-primary-rgb)); border-left: 3px solid rgb(var(--bs-primary-rgb)); }
.wp-block-quote p { font-size: 1.25rem; }
.bg-primary * { color: rgb(var(--jwbs-text-on-primary-bg-color)); }
.no-ul a { text-decoration: none; }
.no-ul a:hover { text-decoration: underline; }

#header-wrap { display: flex; flex-direction: column; background-color: #fff; }
#header-wrap img { transition: all 1000ms linear; }
#header-row .wp-block-column { flex-basis: fit-content; }
#header-row #toggle-col { min-width: 50px; }
#header-row #toggle-col nav { position: absolute;	bottom: 20px; }

#block-8 { display: none; }
#block-8 .btn, .navbar.bg-light .btn { color: #fff; background-color: transparent; border: 1px solid #fff; }
#block-8 .btn:hover, .navbar.bg-light .btn:hover { color: #0e4ba0; background-color: #fff; }
#block-10 { font-size: 1.125rem; }
#block-10 .wp-block-columns { gap: 0; }
#block-10 #logo-col { text-align: center; }
figure.site-logo { aspect-ratio: 4 / 1; max-width: 100%; overflow: hidden; display: grid; place-content: center; }

.nav-link { padding: 0.5rem 1.5rem !important; font-weight: 500; color: #212529; }
.navbar-collapse { margin: 0 -1.5rem; padding: 0 1.5rem; background-color: #e3e9e9; }
.navbar-toggler { border: 1px solid #fff; }
.navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,<svg viewBox='0 0 20 30' xmlns='http://www.w3.org/2000/svg' version='1.1'><g stroke='rgba(255,255,255,1)'><line x1='0' y1='25' x2='20' y2='5' stroke-width='2' /><line x1='0' y1='5' x2='20' y2='25' stroke-width='2' /></g></svg>"); }
.collapsed .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }

.navbar.bg-light { background-color: #0e4ba0 !important; }
.dropdown-item.active, .dropdown-item:active { background-color: rgb(var(--bs-primary-rgb)); }

.carousel-caption { top: 0; right: 0; bottom: 0; left: 0; }
.carousel-caption span { display: inline-block; padding: 0.5rem 1rem; max-width: 500px; background-color: rgba(0, 0, 0, 0.75); }

/* projects */
.row-project figure { position: relative; cursor: pointer; }
.row-project figure figcaption { position: absolute; margin: 0; padding: 0.25rem 0 0.25rem 1rem; right: 0; bottom: 0; left: 0; font-size: 1.5rem; color: #fff; background-color: rgba(var(--bs-primary-rgb), 0.6); }
.row-project figure figcaption a { color: #fff; text-decoration: none; }
.row-project figure:hover figcaption a { text-decoration: underline; }

main footer { background-color: #e3e9e9; }
main footer a { color: #212529; text-decoration: none; }
main footer a:hover { text-decoration: underline; }
main footer .menu { margin: 0; padding: 0; list-style: none; }
#menu-footer-nav-3 { margin-bottom: 1.75rem; }

/** media queries */
/** Small devices (landscape phones, 576px and up) [-sm] */
@media only screen and (min-width : 576px) {
}

/** Medium devices (tablets, 768px and up) [-md] */
@media only screen and (min-width : 768px) {
	#block-8 { display: block; }
	#block-10 #logo-col { text-align: left; }
	.navbar.bg-light { background-color: #e3e9e9 !important; }
	.carousel-caption { left: 12%; right: 50%; }
	.jwbs-banner .carousel-caption .container > span { padding: 0.5rem 2rem; }
	.home .wp-block-quote h1 { font-size: 2.25rem; font-weight: 400; }
}

/** Large devices (desktops, 992px and up) [-lg] */
@media only screen and (min-width : 992px) {
}

/** X-Large devices (large desktops, 1200px and up) [-xl] */
@media only screen and (min-width : 1200px) {
}

/** larger desktops, 1400px and up [-xxl] */
@media only screen and (min-width : 1400px) {
}