/*
Theme Name: 	Archer 2019
Author: 		CMS Web Solutions
Author URI: 	http://cmswebsolutions.com
*/

/* lato-regular - latin */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 400;
	src: local('Lato Regular'), local('Lato-Regular'),
		 url('fonts/lato-v16-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
		 url('fonts/lato-v16-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* lato-700 - latin */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 700;
	src: local('Lato Bold'), local('Lato-Bold'),
		url('fonts/lato-v16-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
		url('fonts/lato-v16-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

* {
	box-sizing: border-box;
}

html {
	font-size: 110%;
}

body {
	margin: 0 auto;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	position: relative;
	color: #363636;
    background-color: #fefefe;
    line-height: 1.5;
}

article, aside, details, embed, figcaption, figure, footer, header, iframe, main, nav, section, summary {
	display: block;
	position: relative;
	margin: 0 auto;
}

header, nav, main, footer {
	max-width: 1400px;
}

.inner {
	margin: 0 auto;
	padding: 0 2em;
	max-width: 50em;
}

.hidden {
	position: absolute;
	left: -1000em;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	margin: -1px;
	padding: 0;
	border: 0;
}

.clearfix {
	overflow: hidden;
	content: "";
	visibility: hidden;
	display: block;
	height: 1px;
	width: 1px;
	clear: both;
}

a.skip {
	position: absolute;
	top: 0;
	left: -1000em;
	background-color: #354c65;
	color: #fff;
	text-decoration: none;
	border-radius: 0 0 3px 3px;
}

a.skip:focus,
a.skip:hover {
	left: 1em;
	top: 0;
	padding: .5em 1em;
}

h1 {
    margin: 2em 0 1em;
	color: #000;
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 1.4em;
	font-weight: 400;
	text-transform: uppercase;
	position: relative;
	line-height: 1.3;
}

h1::before {
	content: '';
	display: block;
	margin-bottom: 1em;
	width: 10ch;
	height: 3px;
	background-color: #561229;
	position: relative;
	left: -1em;
}

h2 {
    margin: 1.5em 0 .75em;
	color: #000;
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-weight: 400;
	text-transform: uppercase;
}

h2::before {
	content: '';
	display: block;
	margin-bottom: 1em;
	width: 10ch;
	height: 3px;
	background-color: #561229;
	position: relative;
	left: -1em;
}

h1 + h2 {
    margin: .25em 0 .75em;
}

h2 a {
	color: #010101;
	-webkit-text-decoration-color: #aaa;
	text-decoration-color: #aaa;
}

h2 a:hover,
h2 a:focus {
	color: #561229;
	-webkit-text-decoration-color: #222;
	text-decoration-color: #222;
}

h3 {
	color: #000;
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-weight: 400;
	margin: 1.5em 0 .75em;
}

h4 {
	color: #000;
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-weight: 400;
	margin: 1.5em 0 .75em;
}

p, li, dt, dd {
	line-height: 1.5;
}

li, p + p, dt, dd {
	margin-top: 0;
}

p * {
	margin-top: 0;
}

ul {
	padding-left: 0;
}

ul:not([class]) {
	padding-left: 1.5em;
}

ul li {
	list-style: none;
}

ul:not([class]) li {
	list-style: disc;
}


img {
	max-width: 100%;
	height: auto;
	border-style: none;
}

a {
	color: #000;
	transition: color .1s;
}

a[href^="tel:"] {
	text-decoration: none;
}

a:hover,
a:focus {
	color: #561229;
}

a:active {
	transition: color 2s;
	color: blue;
}

:focus:not(:focus-visible) {
	outline: none;
}

a img {
	border: none;
	outline: none;
}

iframe,embed {
	margin: 1em 0;
	max-width: 100%;
}

button,input,select,textarea {
	font: inherit;
	margin: 0;
}

header {
	padding: 1em;
}

.logo {
	display: block;
	margin: 0 auto;
}

.tag {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 1.1em;
	text-align: center;
}

.tag br {
	display: none;
}

.vcard {
	color: #757575;
	text-align: center;
}

.tag,
.vcard {
	margin: .5em 0;
}

.vcard span {
	display: block;
}

.vcard a {
	display: block;
	color: #757575;
	text-decoration: none;
}

.vcard a:hover,
.vcard a:focus {
	color: #561229;
	text-decoration: underline;
}

nav {
	background-color: #ebebeb;
	box-shadow: 0px 3px 7px -7px rgba(0,0,0,.35);
}

nav button {
	transition: none;
	cursor: pointer;
	text-transform: uppercase;
	display: block;
	background: transparent;
	width: 100%;
	color: #000;
	margin: 0 auto;
	padding: .25em 0;
	font-size: 1.25em;
	font-weight: 700;
	text-align: center;
	border: none;
	border-radius: 0;
}

nav button:hover,
nav button:focus {
	color: #561229;
}

nav ul {
	width: 100%;
	margin: 0;
	display: none;
}

nav li {
	display: block;
	width: 100%;
	max-width: none;
	margin: 0;
}

nav a {
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	color: #282828;
	padding: .5em 0;
}

nav a:hover,
nav a:focus {
	color: #561229;
	font-weight: 700;
}

.current-menu-item:not(.menu-item-home) a,
.current-page-ancestor a {
	color: #561229;
}

nav .open + ul {
	display: block;
}

nav .open + ul li {
	padding: .5em;
	text-align: center;
	color: 
}

nav .open + ul li:hover,
nav .open + ul li:focus {
	background-color: #f2f2f2;
}

.button {
    text-decoration: none;
    margin: 1em auto;
    padding: 0.2em 1em;
    border: 2px solid #103b68;
    border-radius: 2px;
    background: none;
    color: #103b68;
    font-weight: 700;
    font-family: inherit;
    letter-spacing: 0.05%;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.2s;
}

.button:hover,
.button:focus {
    color: #666;
}

.alignleft,img.alignleft {
	float: left;
	margin: 0 1.5em 1.5em 0;
}

.alignright,img.alignright {
	float: right;
	margin: 0 0 1.5em 1.5em;
}

.aligncenter,img.aligncenter {
	display: block;
	clear: both;
	margin: 1.5em auto;
}

.hero {
	color: #fff;
	background: url(img/office.jpg) center center no-repeat;
	background-size: cover;
}

.home .hero {
	background: url(img/courtroom_small.jpg) center center no-repeat;
	background-size: cover;
	text-align: center;
}

.brand {
	padding: 1em 0;
}

.brand p {
	line-height: 1.2;
}

.brand p:first-child {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 1.75rem;
	text-transform: uppercase;
}

.brand p:first-child span {
	font-size: 2.25rem;
	display: block;
}

.home .brand p:first-child {
	font-size: 2.25rem;
}

.home .brand p:first-child span {
	font-size: 2.75rem;
}

.brand br {
	display: none;
}

.buttons {
	padding-bottom: 1em;
}

.buttons li {
	margin: 1em 0;
}

.home .buttons li {
	display: inline-block;
	margin: 1em;
}

.buttons a {
	display: block;
	padding: .5em 2em;
	text-decoration: none;
	text-transform: uppercase;
	border: 1px solid #fff;
}

.buttons :first-child a,
.buttons :last-child a:hover,
.buttons :last-child a:focus {
	color: #561229;
	background-color: #fff;
}

.buttons :first-child a:hover,
.buttons :first-child a:focus,
.buttons :last-child a {
	color: #fff;
	background-color: rgba(0,0,0,.1);
}

main img {
	-webkit-filter: drop-shadow(3px 5px 3px rgba(0,0,0,.4));
	        filter: drop-shadow(3px 5px 3px rgba(0,0,0,.4));
}

.intro,
.contact {
	margin: 2em 0;
	padding: 1em;
}

.intro h1 {
	font-family: "Lato", sans-serif;
}

.home .intro h1 {
	font-family: initial;
}

.mapp-layout {
	border: none;
}

.main {
	padding: 1em;
	background-color: #f9f9f9;
}

footer {
	color: #d7d7d7;
	background-color: #282828;
}

footer {
	margin-top: 2em;
	padding: 2em;
}

footer h3,
footer h4 {
	color: #fff;
	font-family: "Lato", sans-serif;
	text-transform: uppercase;
}

footer p {
	margin: .1em 0;
}

footer .vcard,
footer .vcard a {
	color: #d7d7d7;
	text-align: left;
}

footer .inner + p {
	margin: 1.5em 0 .5em;
	text-align: center;
}

@media screen and (min-width: 37.5em) {

	.hero .inner {
		display: flex;
		justify-content: space-between;
	}
	
	.home .hero .inner {
		height: 100%;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.brand {
		padding: 0;
	}

	.columns {
		-webkit-columns: 2 auto;
		        columns: 2 auto;
	}
}

@media screen and (min-width: 52em) {

	header {
		padding: 1em 0;
	}

	header .inner {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.logo {
		margin: 0;
	}

	.tag,
	.vcard {
		text-align: right;
	}

	.tag br, 
	.vcard span,
	.vcard a {
		display: inline-block
	}

	.vcard span {
		margin-right: .5em;
	}

	nav button {
		display: none;
	}

	nav ul {
        display: inline-block;
        display: flex;
        justify-content: space-between;
	}

	nav li {
		width: auto;
		max-width: none;
	}

	nav a {
		display: block;
	}

	.home .hero {
		height: 600px;
		background: url(img/courtroom.jpg) center center no-repeat;
		background-size: cover;
		text-align: center;
	}
	
	.brand br {
		display: inline-block;
	}

	.intro,
	.contact {
		padding: 0;
	}

	.intro,
	.contact .inner {
		display: flex;
		justify-content: space-between;
	}

	.intro img {
		float: right;
		margin-left: 3em;
	}

	.mapp-layout {
		margin: 2em 0 0 2em;
	}

	.main .inner,
	.location .inner {
		display: flex;
		align-items: flex-start;
	}

	.main .inner > *,
	.location .inner > * {
		flex-grow: 1;
	}
	  
	.main .inner img {
		margin: 4.5em 2em 0 0;
		flex-basis: 100%;
	}

	.home .main {
		background: #f9f9f9 url(img/gavel_small.png) bottom left no-repeat;
	}

	.home .main .inner > *{
		margin-left: 25em;
		background: #f9f9f9;
	}

	.columns {
		-webkit-columns: 3 auto;
		        columns: 3 auto;
	}

	footer .inner {
		display: flex;
		justify-content: space-between;
	}
}


@media screen and (min-width: 64.25em) {

	.home .main {
		background: #f9f9f9 url(img/gavel.png) bottom left no-repeat;
	}
}