/* custom.css -- site-wide overrides for the lawyer-theme.
   Loaded last, after every theme stylesheet, so these rules win.
   Shared by all 20 pages; edit here once instead of per page. */

/* Footer overrides: this page uses a 2-column footer, but style.css is
   tuned for the 3-column col-md-3 layout used by the other pages and
   pulls the logo and address up with mismatched negative margins. */
#footer-sec .row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

#footer-sec .footer-text {
	float: none !important;
	text-align: right !important;
	margin-top: 0 !important;
	line-height: 1.6;
	/* No rule sets a size on .footer-text, so it inherited body's 14px.
	   Bumped 2 points; line-height is unitless so it scales with it. */
	font-size: 16px;
}

#footer-sec #logof img {
	margin-top: 0 !important;
}

#copyright #fc {
	position: static !important;
	width: 100% !important;
	margin: 0 !important;
	text-align: center !important;
	/* #copyright sits outside #footer-sec, so it misses the
	   font-family:Garamond that styles the footer above it and falls back
	   to body's Taprom. Match the footer, and drop 18px (style.css:410)
	   down 2 points. */
	font-family: Garamond !important;
	font-size: 16px !important;
}

/* style.css nudges every footer column 4px left, which would throw the
   centred copyright line off by the same amount. */
#copyright [class*="col-md-"] {
	margin: 0 !important;
}

@media (max-width: 991px) {
	#footer-sec .row {
		display: block;
	}

	#footer-sec .footer-text {
		text-align: left !important;
	}
}

/* The homepage slider is the only full-bleed element on the site; every
   other page constrains content to Bootstrap's .container. The band stays
   full width and carries the site colour, while the slider inside it is
   capped to the content widths (750/970/1170px) -- otherwise the gutters
   either side fall through to the browser's default white, since neither
   body nor .wrapper sets a background. */
.cs-banner {
	width: 100%;
	background-color: #2D5E75;
	overflow: hidden;
}

/* Inline style on the wrapper hardcodes background-color:#E9E9E9, which
   shows as a pale strip behind the slide; !important is needed to beat it. */
.cs-banner .fullwidthbanner-container,
.cs-banner .forcefullwidth_wrapper_tp_banner {
	background-color: #2D5E75 !important;
	max-width: 100% !important;
	left: auto !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

@media (min-width: 768px) {
	.cs-banner .fullwidthbanner-container {
		width: 750px !important;
	}
}

@media (min-width: 992px) {
	.cs-banner .fullwidthbanner-container {
		width: 970px !important;
	}
}

@media (min-width: 1200px) {
	.cs-banner .fullwidthbanner-container {
		width: 1170px !important;
	}
}

/* Mobile burger menu. responsive.css gives the open panel
   background-color:#fff (:34 and :106), but nothing sets a colour on
   .navigation .navbar-nav > li > a, so the links inherit white -- white
   on white. Use the same teal/white pairing the site already uses for its
   dropdown panels. Scoped to <=990px: above that responsive.css sets no
   panel background, so colouring it would paint the desktop nav. */
@media (max-width: 990px) {
	.navbar-collapse {
		background-color: #2d5e75 !important;
	}

	.navbar-collapse .navbar-nav li a {
		color: #ffffff !important;
	}

	.navbar-collapse .navbar-nav > li + li {
		border-top: 1px solid rgba(255, 255, 255, 0.15);
	}
}