/*
Theme Name: Bridge Child
Theme URI: http://demo.qodeinteractive.com/bridge/
Description: A child theme of Bridge Theme
Author: Qode Interactive
Author URI: http://www.qodethemes.com/
Version: 1.0.0
Template: bridge
*/
@import url("//www.ra-bruehl.de/wp-content/themes/bridge/style.css");

/* Show only the home icon in the desktop navigation; keep the label available
 * to screen readers and search engines. */
nav.main_menu li.menu-item-home > a > span:not(.plus) {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/*
 * Keep the regular brand logo reliable on desktop subpages. Bridge leaves
 * the logo link hidden and widthless until JavaScript has measured the image;
 * if that initialization is delayed or skipped, the whole logo disappears.
 */
@media only screen and (min-width: 1001px) {
	body:not(.home) header .q_logo a {
		display: inline-block;
		visibility: visible !important;
		width: 456px;
		max-width: 100%;
	}

	body:not(.home) header:not(.sticky) .q_logo img.normal {
		display: block !important;
		opacity: 1 !important;
	}

	body:not(.home) header:not(.sticky) .q_logo img.light,
	body:not(.home) header:not(.sticky) .q_logo img.dark {
		opacity: 0 !important;
	}
}

@media only screen and (min-width: 1001px) and (max-width: 1500px) {
	body:not(.home) header .q_logo a {
		width: 400px;
	}

	body:not(.home) header .q_logo img.normal {
		max-width: 400px;
	}
}

/*
 * Mobile layout refinements
 *
 * Bridge uses fixed content widths at its smaller breakpoints (600/420/300px).
 * Fluid widths keep the text readable without wasting valuable screen space.
 */
@media only screen and (max-width: 768px) {
	html,
	body,
	.wrapper,
	.wrapper_inner {
		overflow-x: hidden;
	}

	.content .container_inner,
	.content .grid_section .section_inner,
	.title .container_inner {
		width: calc(100% - 48px);
	}

	.home .content .grid_section .section_inner {
		width: calc(100vw - 48px);
	}

	.content .container .container_inner.page_container_inner {
		padding-top: 60px !important;
	}

	.content .vc_column-inner[class*="vc_custom_"] {
		padding-right: 24px !important;
		padding-left: 24px !important;
	}

	.content img,
	.content video,
	.content iframe {
		max-width: 100%;
		height: auto;
	}

	.content p,
	.content li,
	.content h1,
	.content h2,
	.content h3,
	.content h4,
	.content a {
		overflow-wrap: anywhere;
	}

	.content table {
		display: block;
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/*
 * Staff cards use a -25px desktop offset to align text beside portraits.
 * Once the columns stack, that offset would pull the heading into the image.
 */
@media only screen and (max-width: 767px) {
	.content .wpb_text_column.vc_custom_1649869699100,
	.content .wpb_text_column.vc_custom_1646775310434,
	.content .wpb_text_column.vc_custom_1649866908899,
	.content .wpb_text_column.vc_custom_1649866914067,
	.content .wpb_text_column.vc_custom_1649869659561 {
		margin-top: 0 !important;
	}
}

@media only screen and (max-width: 600px) {
	.content .container_inner,
	.content .grid_section .section_inner,
	.title .container_inner {
		width: calc(100% - 40px);
	}

	.home .content .grid_section .section_inner {
		width: calc(100vw - 40px);
	}

	.content .container .container_inner.page_container_inner {
		padding-top: 45px !important;
	}

	.content .vc_column-inner[class*="vc_custom_"] {
		padding-right: 20px !important;
		padding-left: 20px !important;
	}

	.content [style*="text-align: justify"],
	.content [style*="text-align:justify"] {
		text-align: left !important;
	}

	/* Keep the centered mobile logo inside the available header space. */
	.logo_wrapper {
		left: 45px;
		width: calc(100% - 90px);
	}

	.q_logo {
		width: 100%;
		text-align: center;
	}

	.q_logo a {
		left: 0;
		max-width: 100%;
	}

	header .q_logo img.mobile {
		max-width: 100%;
		height: auto !important;
	}

	.q_masonry_blog_post_text {
		padding-right: 14px;
		padding-left: 14px;
	}
}

/*
 * Friendly Captcha remains visible and touch-friendly. Hiding it until a form
 * submission prevented the verification button from appearing on mobile.
 */
.wpcf7-form .frc-captcha,
.wpcf7-form .frc-captcha.frc-captcha-hidden {
	display: block !important;
	width: 316px !important;
	max-width: 100% !important;
	margin: 14px 0 0;
}

.wpcf7-form .frc-captcha iframe {
	width: 100% !important;
	max-width: 100% !important;
}

@media only screen and (max-width: 600px) {
	.wpcf7-form .frc-captcha,
	.wpcf7-form .frc-captcha.frc-captcha-hidden {
		width: 100% !important;
		margin-top: 12px;
	}
}
