/*
Theme Name: Lefebvre Chambers
Theme URI: n/a
Author: Raffaele Malanga / Els van Bloois
Author URI: https://farstudios.com/
Description: Theme for LefebvreChambers.com
Version: 1.0
License: no license, use a theme from https://wordpress.org/themes/ instead.
License URI: n/a
Tags: n/a
Text Domain: lefebvrechambers
*/

html,body,h1,h2,h3,h4,h5,h6,p,ul,li,form{
	padding:0;
	margin:0;
}
html,body{
	height:100%;
}
#page{
	min-height:100%;
}
.screen-reader-text{
	position:absolute;
	top:-40000px;
	left:-40000px;
}
.skip-link:focus{
	top:40px;
	left:40px;
	background:white;
	color:black;
	padding:10px 20px;
	border:2px solid black;
	text-decoration:none;
	text-transform:uppercase;
	font-size:100%;
}
.menu-toggle{
	display:none;
}
a{
	color:inherit;
}
a:focus,
a:hover,
a:active{
	color:#40B1E1;
}
img,
iframe{
	display:block;
	max-width:100%;
}
body{
	background:#bbb;
	color:#070E31;
	font-family:Arial,sans-serif;
	font-size:100%;
	line-height:1;
}
h2,
h3,
.button a,
.site-nav ul{
	font-family:'Times',serif;
}
#page{
	/* max-width:1600px; */ /* no max width, designer wants full width always */
	margin:0 auto;
	background:#070E31; /* to avoid white showing behind top nav after scrolling */
	color:#fff;
	padding-top:90px;
}
#masthead{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	background:#070E31;
	color:#fff;
	padding:15px 0;
	min-height:60px;
	z-index:1000;
}
.admin-bar #masthead{
	top:32px;
}
@media(max-width:782px){
	.admin-bar #masthead{
		top:46px;
	}
}
#masthead,
#masthead .site-title img,
#masthead .site-nav,
#masthead .site-nav ul{
	transition:all .6s ease-in-out 0s;
}
.scrolled #masthead{
	padding:10px 0;
	min-height:32px;
}
.scrolled #masthead .site-title img{
	height:32px;
}
.scrolled #masthead .site-nav{
	padding-top:0;
}
.scrolled #masthead .site-nav ul{
	font-size:18px;
	line-height:32px;
}

#colophon{
	background:#070E31;
	color:#fff;
	height:90px;
	box-sizing:border-box;
	padding:25px 0;
}
.site-branding{
	float:left;
}
.site-title{
	margin-bottom:0 !important;
}
.site-title img{
	height:64px; /* so that the height doesn't jump on scroll */
}
.site-nav{
	float:right;
	padding-top:25px;
}
.site-nav ul{
	list-style:none;	
	font-size:22px;
	line-height:1.2;
	margin-bottom:0;
}
.site-nav ul li{
	display:inline-block;
	padding-left:54px;
}
.site-nav a{
	text-decoration:none;
}
.site-nav a:focus,
.site-nav a:hover,
.site-nav a:active,
.site-nav li.current-menu-item a{
	color:#40B1E1;
}
.inner{
	padding:0 40px;
	overflow:hidden;
}
.biobox .inner{
	max-width:550px;
	padding:0 10%;
	margin:0 auto;
}
.inner.grey{
	background:#F1F1F1;
}
.banner{
	height:0;
	padding-top:47%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
}
.section{
	overflow:hidden;
	position:relative;
	display:table;
	width:100%;
	background:#fff;
	color:#070E31;
}
.section.acf_double_block_bio{
	background:#D7D7D7;
}
.section.acf_single_block_bio{
	background:#cdcdcd;
}
img.square{
	width:100%;
}
.blockleft,
.blockright{
	width:50%;
	position:relative;
	display:table-cell;
	vertical-align:middle;
}
.biobox{
	vertical-align:top;
	text-align:center;
	padding:60px 0;
}
.biobox img{
	border-radius:400px;
	margin:0 auto 25px auto;
}
.imageside{
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
}
.makethissquare{
	height:0;
	padding-top:100%;
}
.mapbox iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.textbox,
.textbox2{
	padding:50px 0;
}
h2{
	font-size:46px;
	font-weight:normal;
	line-height:1;
	margin-bottom:.7em;
}
h3{
	font-size:34px;
	font-weight:normal;
	line-height:1;
	margin-bottom:1em;
}
ul,ol,p{
	font-size:19px;
	line-height:1.4;
	margin-bottom:1.4em;
}
.textbox ul li{
	margin-left:1em;
}
.button{
	padding-top:2em;
}
.button a{
	color:inherit;
	font-size:17px;
	letter-spacing:2px;
	text-transform:uppercase;
	text-decoration:none;
	padding:15px 20px;
	border:1px solid #070E31;
	border-radius:5px;
}
.button a:focus,
.button a:hover,
.button a:active{
	border-color:#40B1E1;
	background:#40B1E1;
	color:#fff;
}
.phone{
	padding-left:38px;
	line-height:26px;
	background:url(img/phone.png) transparent no-repeat left top;
}

@media (max-width:1180px){
	.banner{
		padding-top:550px;
	}
}
@media (max-width:1040px){
	.site-nav ul li{
		padding-left:40px;
	}
	h2{
		font-size:42px;
	}
	ul,ol,p{
		font-size:18px;
	}
	.button a{
		font-size:16px;
	}
}
@media (max-width:960px){
	h2{
		font-size:38px;
	}
	ul,ol,p{
		font-size:16px;
	}
	.button a{
		font-size:15px;
	}
}
@media (max-width:880px){
	.inner{
		padding:0 25px;
	}
	.site-nav ul li{
		padding-left:30px;
	}
	h2{
		font-size:36px;
		margin-bottom:.5em;
	}
	ul,ol,p{
		font-size:15px;
	}
	.button{
		padding-top:1em;
	}
	.button a{
		font-size:14px;
		padding:10px 15px;
	}
}
@media (max-width:768px){
	h2{
		font-size:32px;
	}
}
@media (max-width:750px){
	.menu-toggle{
		position:absolute;
		right:0;
		top:-45px;
		display:block;
		height:28px;
		width:37px;
		background:url(img/menu.png) black no-repeat right center;
		background-size:contain;
		padding:0;
		border-width:0;
		margin-bottom:0;
		cursor:pointer;
	}
	.menu-toggle span{
		position:absolute;
		left:-4000px;
	}
	.scrolled .menu-toggle{
		height:22px;
		top:-27px;
	}
	#site-navigation .nav-menu{
		display:none;
	}
	#masthead.toggled-on{
		height:100%;
	}
	#site-navigation.toggled-on .nav-menu{
		padding-top:25px;
		display:block;
	}
	.site-nav{
		clear:both;
		float:none;
		position:relative;
		padding-top:0;
	}
	.site-nav ul{
		font-size:22px !important;
		border-bottom:1px solid #40B1E1;
	}
	.site-nav ul li{
		display:block;
		text-align:center;
		border-top:1px solid #40B1E1;
		padding:0;
	}
	.site-nav ul li a{
		display:block;
		padding:20px 0;
	}
	
	.section,
	.hideonnarrow,
	.blockleft,
	.blockright{
		width:100%;
		display:block;
	}
	.imageside{
		display:none;
	}
	.mapbox{
		display:block;
		height:0;
		padding-top:100%;
	}
	.textbox,
	.textbox2{
		height:auto;
	}
}
@media (max-width:600px){
	h2{
		font-size:28px;
	}
}
@media (max-width:420px){
	.banner{
		padding-top:140%;
	}
}
@media (max-width:380px){
	.site-title img{
		height:53px; /* so that the height doesn't jump on scroll */
	}
	.menu-toggle{
		display:block;
		height:21px;
		width:28px;
		top:-35px;
	}
	.scrolled .menu-toggle{
		top:-27px;
	}
}
