/*
	Theme Name:  Dutchland Playbook
	Theme URI:   http://www.########.com/
	Description: A nice little theme for Dutchland Inc.
	Version:     1.0
	Author:      Lance Williams
	Author URI:  https://sovierro.com/
*/

* {margin: 0; padding: 0; border: 0;}
*, *:after, *:before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
* html .clearfix,*:first-child+html .clearfix{zoom:1}
html {font-size:16px;}
a {text-decoration: none; color:red;}
body {background: #fff;}
body, html {height: 100%}

/*========================================================================================
Colors

#18ac5f Green
#13688b Blue
#304450 Dark Blue
#202020 Black

/*========================================================================================
Backgrounds
========================================================================================*/

.white-back {background: #fff;}
.grey-back {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eeeeee+0,d2d8dd+100 */
background: #eeeeee; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #eeeeee 0%, #d2d8dd 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #eeeeee 0%,#d2d8dd 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #eeeeee 0%,#d2d8dd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#d2d8dd',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}

.home-background {
	background: url(img/grade-four.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
	margin-bottom: -150px;
	}

.home-background-two {
	background: url(img/bw-back.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
	}

.background-img-one {
	background: url(img/bg-one.jpg) center center no-repeat;
	background-size: cover;
	}


/*========================================================================================
Type
========================================================================================*/

@font-face {
    font-family: 'libre_baskervillebold';
    src: url('fonts/librebaskerville-bold-webfont.woff2') format('woff2'),
         url('fonts/librebaskerville-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	}


@font-face {
    font-family: 'source_sans_probold';
    src: url('fonts/sourcesanspro-bold-webfont.woff2') format('woff2'),
         url('fonts/sourcesanspro-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'source_sans_proitalic';
    src: url('fonts/sourcesanspro-italic-webfont.woff2') format('woff2'),
         url('fonts/sourcesanspro-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'source_sans_proregular';
    src: url('fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
         url('fonts/sourcesanspro-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'montserratmedium';
    src: url('fonts/montserrat-medium-webfont.woff2') format('woff2'),
         url('fonts/montserrat-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'montserratregular';
    src: url('fonts/montserrat-regular-webfont.woff2') format('woff2'),
         url('fonts/montserrat-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	}

/*======================================================================================== */

h1,h2,h3,h4,h5, .paginate-links {
	font-family: 'libre_baskervillebold','Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
	}

h1 {
	font-size: 3.3rem;
	line-height: 5rem;
	letter-spacing: -.05rem;
	color: #304450;
	margin: 20px 0;
	}

h2 {
	font-size: 2.4rem;
	line-height: 3rem;
	letter-spacing: -.01rem;
	color: #304450;
	margin: 0;
	}

h3 {
	font-size: 1.9rem;
	line-height: 2.4rem;
	color: #304450;
	margin: 20px 0 5px;
	}

h4 {
	font-size: 1.4rem;
	line-height: 2.2rem;
	color: #304450;
	margin: 20px 0;
	}

h5 {
	font-size: 1.2rem;
	line-height: 1.2rem;
	letter-spacing: .02em;
	color: #304450;
	margin: 20px 0;
	}

p, ul, ol, blockquote p, figcaption, .para_caption {font-family: 'source_sans_proregular', 'Helvetica Neue', Helvetica, Arial, sans-serif;}
i, em, figcaption, .para_caption {font-family: 'source_sans_proitalic', 'Helvetica Neue', Helvetica, Arial, sans-serif;}
b, strong {font-family: 'source_sans_probold', 'Helvetica Neue', Helvetica, Arial, sans-serif;}


p {
	font-size: 1.15rem;
	line-height: 1.8rem;
	font-weight: 400;
	font-style: normal;
	color: #506670;
	margin: 15px 0;
	}

b, strong {
	font-weight: 700;
	font-style: normal;
	color: #506670;
	}

i, em {
	font-weight: 400;
	font-style: italic;
	color: #506670;
	}

blockquote p, article blockquote p {
	font-size: 1.8rem;
	line-height: 2.4rem;
	font-weight: 700;
	font-style: italic;
	color: #506670;
	margin: 60px 0;
	}

ul, ol {
	font-size: 1.05rem;
	line-height: 1.6rem;
	font-weight: 400;
	font-style: normal;
	color: #506670;
	margin: 15px 20px 25px 45px;
	}

ul li, ol li {margin: 5px 0;}

.swot ul {margin: 20px 10px 15px 20px;}
ul.lesser {margin: 20px 10px 25px 16px;}

hr {
	height: 2px;
	background: #ddd;
	margin: 40px 0;
	}

.center-text {text-align: center; margin-left: auto; margin-right: auto;}
.light-text {color: #eee;}
.content-light-text h1, .content-light-text h2, .content-light-text h3, .content-light-text h4, .content-light-text h5, .content-light-text p, .content-light-text ul, .content-light-text ol, .content-light-text b {color: #eee;}

/*========================================================================================
Layout
========================================================================================*/

.full_screen {
	position: relative;
	display: grid;
	width: 100%;
	height: 100vh;
	align-content: center;
	}

.full_screen_home {
	position: relative;
	display: grid;
	width: 100%;
	height: calc(100vh - 80px);
	align-content: start;
	}

.first_full {margin-top: -76px;}

.col1, .col2, .col2_right, .col2_left, .col3, .col4 {
	position: relative;
	display: grid;
	width: 100%;
	margin: 0 auto;
	}

.col1 {grid-template-columns: 1fr;}
.col2 {grid-template-columns: 1fr 1fr;}
.col2_right {grid-template-columns: 2.9fr 1.1fr;}
.col2_left {grid-template-columns: 1.1fr 2.9fr;}
.col3 {grid-template-columns: 1fr 1fr 1fr;}
.col4 {grid-template-columns: 1fr 1fr 1fr 1fr;}

.wrapper {width: 100%; padding-left:20px; padding-right: 20px; max-width: 1400px; margin: 0 auto;}
.maxwidth {width: 96%; max-width: 860px;}

.gridgap {grid-gap: 25px;}
.pad {padding: 20px 35px;}
.seperation {padding-bottom: 21px;}

.large_pad {padding-top: 60px !important; padding-bottom: 75px !important;}
.extra_large_pad {padding-top: 160px !important; padding-bottom: 165px !important;}
.super_extra_large_pad {padding-top: 220px !important; padding-bottom: 225px !important;}
.nopad {padding: 0 !important;}
.sidepad {padding-left: 80px; padding-right: 80px;}

.fit_img {width: 100%; height: auto;}
.center {margin-left: auto !important; margin-right: auto !important; float: none !important;}
.vertical_align {margin:auto;}
.roundy {border-radius: 10px;}
.ontop {
	z-index: 1000;
 	position: absolute;
	top: 49%;
	left: 50%;
	transform: translate(-51%, -50%);
	}

/*========================================================================================
Buttons
========================================================================================*/

a.button {
	display: inline-block;
	padding: 18px 31px;
	background: steelblue;
	color: #eee;
	border-radius: 5px;
	margin: 30px auto;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	}

a.button.big {padding: 20px 45px;}
a.button:hover {background: red; color: #fff;}

a.button p,
a.button h1,
a.button h2,
a.button h3,
a.button h4,
a.button h5 {margin: 0;}

.two_button_left {margin: 0 0 0 auto;}
.two_button_right {margin: 0 auto 0 0;}

/*========================================================================================
Header
========================================================================================*/

header {
	position: relative;
	top: 0;
	width: 100%;
	z-index: 99;
	}

nav {
	display: grid;
	grid-template-columns: 240px auto 70px;
	margin: 0 auto;
	}

#menu-icon {display: none;z-index: 100;}

.head_logo {
	padding: 3px 0;
	margin: auto auto auto 0;
	}

.mobile_logo {display: none;}

#primary_nav_wrap {display: grid;}

#primary_nav_wrap #nav, #primary_nav_wrap ul {
	position: relative;
	list-style: none;
	text-align: center;
	margin: auto;
	font-family: 'montserratregular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: .85rem;
	}

#primary_nav_wrap ul li {display: inline-block; margin: 0;}

#primary_nav_wrap ul li a {
	padding: 31px 20px;
	margin: 0 -3px 0 -2px;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	color: #506670;
	}

#primary_nav_wrap ul li a:hover {
	color:white; 
	background: #304450;
	}

/* Use this if you need a drop down menu */

#primary_nav_wrap ul li ul {
	display: none;
	position: absolute;
	top: 100%;
	margin: 27px 0 0 -2px;
	text-align: left;
	}

#primary_nav_wrap ul li ul li {
	width: 150%;
	background: #fff;
	border-left: 2px solid #13688b;
	}

#primary_nav_wrap ul li ul li a {
	display: block;
	padding: 15px 15px;
	margin: 0;
	color: #506670;
	}

#primary_nav_wrap ul li:hover > ul {display: grid;}

#primary_nav_wrap ul li span {display: none;}


/* Social Icons */

.social {
	font-family: 'iconies_socialregular';
	font-size: 2.2em;
	margin: auto 0 auto auto;
	}

.social a {
	background: #ff6b9d;
	color: #fff;
	padding: 1px 6px 10px;
	border-radius: 2px;
	-webkit-transition: background .2s ease-in-out;
	-moz-transition: background .2s ease-in-out;
	-o-transition: background .2s ease-in-out;
	-ms-transition: background .2s ease-in-out;
	transition: background .2s ease-in-out;
	}

.social a:hover {background: #9695dd;}

/* Header Search Bar */

#site_search {margin: auto 0 auto auto;}

#site_search form {
	background: none;
	padding: 0;
	margin: 10px 72px 0 auto !important;
	}

#search_icon {
	position: relative;
	width: 60px;
	height: 60px;
	background: url(img/spy.png) center center no-repeat;
	background-size: 42px 42px;
	z-index: 900;
	-webkit-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	}

#search_box {
	position: fixed;
	display: none;
	right: 0;
	left: 0;
	top: 0;
	width: 97%;
	max-width: 1400px;
	margin: 0 auto;
	height: 75px;
	z-index: 800;
	}

#s {
	border-radius: 3px;
	font-weight: 400;
	width: 100%; 
	margin: 2px auto;
	}

#back_to_top {
	display: none;
	width: 0;
	height: 0;
	position: fixed;
	bottom: 12px;
	right: 10px;
	border-radius: 3px;
	z-index: 98;
	background: #ccc;
	background: rgba(200,200,200,.7);
	}

#back_to_top {width: 45px;height: 45px;padding: 6px;}
#back_to_top img {width: 100%; height: auto; margin: 0 auto;}

/*========================================================================================
Sticky Header
========================================================================================*/

header.sticky {
	display: none;
	position: fixed;
	top:0;
	background: #fff;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
	border-top: none;
	-webkit-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	}

header.nav-up {top:-60px;}

header.sticky .head_logo {
	width: 160px;
	margin: 1px 0 0 0;
	}

header.sticky #primary_nav_wrap ul {
	margin: auto 0 auto auto;
	font-size: .85rem;
	}

header.sticky #primary_nav_wrap ul li a {
	padding: 21px 20px 22px;
	}

header.sticky #primary_nav_wrap ul li ul {margin: 16px 0 0 -2px;}

header.sticky #primary_nav_wrap ul li ul li a {
	padding: 12px 20px 13px;
	}

/* Sticky Header Search Bar */

header.sticky #site_search form {margin: 5px 75px 0 auto !important;}

header.sticky #search_icon {
	width: 40px;
	height: 40px;
	background-size: 33px 33px;
	}

header.sticky #search_box {height: 51px;}

header.sticky #site_search form input#s {padding: 7px;}

/*========================================================================================
Article Styles
========================================================================================*/

article {
	width: 86%;
	max-width: 900px;
	margin: 0 auto;
	}

/*=========== Text ============*/

article p {
	line-height: 2rem;
	margin: 25px 0;
	}

article h2, article h3, article h4, article h5 {margin: 60px 0 -10px;}

blockquote {
	position: relative;
	margin: 50px 0;
	}

article p a:hover, article h2 a:hover, article h3 a:hover, article h4 a:hover, article h5 a:hover {border-bottom: 2px solid #f00;}

article a.button:hover {border-bottom: none;}

/*=========== Photos ============*/

article img,
figure.aligncenter,
img.aligncenter {
	width: 100%;
	height: auto;
	margin: 20px auto;
	}

figure.alignleft, img.alignleft {
	float: left;
	margin: 0 30px 20px 0;
	width: 45% !important;
	height: auto;
	}

figure.alignright, img.alignright {
	float: right;
	margin: 0 0 20px 30px;
	width: 45% !important;
	height: auto;
	}

figure img {width: 100% !important; margin: 0;}

figcaption {
	position: relative;
	font-size: .95rem;
	line-height: 1.2rem;
	font-weight: 400;
	font-style: normal;
	color: #eee;
	margin: -43px auto 6px;
	padding: 10px;
	text-align: center;
	background: rgba(0,0,0,.7);
	}

/*=========== Galleries ============*/

.gallery {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-box-pack: flex-left;
	-ms-flex-pack: flex-left;
	justify-content: flex-left;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-ms-flex-line-pack: stretch;
	align-content: stretch;
	margin: 0 auto;
	width: 100%;
	align-items: center;
	}

article.gallery {margin: 50px -5%; width: 110%;}

.gallery dd {display: none;}

.gallery.gallery-columns-1 .gallery-item {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 0 1 100%;
	flex: 0 1 100%;
	margin: .5% .65%;
	flex-grow: 1;
	}

.gallery.gallery-columns-2 .gallery-item {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 0 1 48%;
	flex: 0 1 48%;
	margin: .5% .65%;
	flex-grow: 1;
	}

.gallery.gallery-columns-3 .gallery-item {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 0 1 31%;
	flex: 0 1 31%;
	margin: .5% .65%;
	flex-grow: 1;
	}

.gallery.gallery-columns-4 .gallery-item {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 0 1 23.7%;
	flex: 0 1 23.7%;
	margin: .5% .65%;
	}

.gallery .gallery-item img {width: 100%; height: auto; margin: 0;}
.jp-carousel-light .jp-carousel-info h2 {text-align: center !important; font-size: 1.4rem !important;}
.jp-carousel-left-column-wrapper {display: none !important;}
.jp-carousel-image-meta {display: none !important;}
.jp-carousel-light .jp-carousel-close-hint span {font-size: 40px !important; margin: -16px 0 0 0;}


/*=========== Slide Show ============*/

.slideshow-window {
	background-color: #fff !important;
	border: none !important;
	border-radius: 0 !important;
	margin: 50px -10%;
	height: 180px !important;
	}

.slideshow-slide-caption {display: none;}

.slideshow-controls {opacity: 0 !important;}
.slideshow-window:hover .slideshow-controls {opacity: 1 !important;}

/*=========== Video ============*/

article .fluid-width-video-wrapper {margin: 8% auto 14%;}
.fluid-width-video-wrapper iframe {width: 100% !important; height: 100% !important; border: 10px solid #eee; border-radius: 5px; box-shadow: 0 0 40px rgba(0,0,0,.2);}


/*=========== Share Daddy ============*/

div.sharedaddy {
	text-align: center;
	margin: -20px auto;
	}

div.sharedaddy h3.sd-title {
	font-size: 1.2em !important;
	text-transform: uppercase;
	color: #ddd;
	}

div.sharedaddy h3.sd-title:before {border: none !important;}
div.sharedaddy h3.sd-title::after {
	content: "";
	display: block;
	width: 130%;
	min-width: 30px;
	margin: 10px 0 0 -15%;
	border-bottom: 2px solid #dfdfdf;
	}

.sd-content ul li {margin: 0 4px 5px !important;}
.sd-social-icon .sd-content ul li[class*='share-'] a {border-radius: 0 !important; -webkit-border-radius: 0 !important;}
.sd-content ul li a.sd-button:before {font: normal 27px/1 'social-logos' !important;}
li.share-end {display: none;}

/*=========== Next Post Links ============*/

.next {width: 100%; padding: 15px 20px;}
.prev {margin: auto auto auto 0;}
.nex {margin: auto 0 auto auto;}
.prev a h4, .nex a h4 {color:#fff; margin: 0;}
.prev a h4:hover, .nex a h4:hover {color: #ff9895;}

/*=========== Comments ============*/

#comments h3 {margin: 20px 0;}
.comment-respond form {margin: auto auto auto 0;}
p.logged-in-as {margin: 10px 0;}
#comments form input[type="submit"] {margin: 20px 0 -17px auto;}

ol.commentlist, ol.children {list-style: none; margin: 0;}
li.comment {
	position: relative;
	background: #ddd;
	padding: 30px;
	margin: 15px 0;
	}

li.comment.depth-2 {background: rgba(255,255,255,.5);}
li.comment.depth-3 {background: rgba(255,255,255,.5);}

.comment-author img {width: 50px; height: auto; float: left; margin: 0 10px 10px 0;}
.comment-author cite.fn {font-size: 22px; line-height: 31px; font-style: normal;}
.comment-author cite.fn a {color:#333;}
.comment-author span.says {display: none;}
.comment-meta {font-size: 15px;line-height: 15px;}
.comment-meta a {color: #aaa;}
li.comment p {font-size: 20px; line-height: 24px;}
.reply {text-align: right; margin:-5px 0 0 0;}
.reply a {
	display: inline-block;
	padding: 10px 20px;
	background:#13688b;
	color: #fff;
	border-radius: 3px;
	-webkit-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	}
.reply a:hover {background: #18ac5f;} 

form#commentform {padding: 20px;}
form#commentform p {font-size:1rem; line-height: 1.6rem; margin: 15px 0;}
form#commentform textarea#comment {height: 200px;}
form#commentform input[type="text"] {padding:10px;}
form#commentform p.comment-form-url {display: none;}
form#commentform label {margin:-5px 0 0 0;}

/*=========== aside ============*/

aside {width: 100%;}

.related {
	display: block;
	padding: 10px;
	margin: 0 auto 15px;
	border-radius: 3px;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	transition: all .4s ease-out;
	background: #fff;
	}

.related:hover {background: #ddd;}

.related_posts_img {height: 150px; border-radius: 3px;}

.related .divider {border-top: 1px dotted #ccc; margin: -10px 0 10px;}

.related_post_text {padding: 10px !important;}

.related_post_text h4 {
	font-size: 1.2em;
	font-weight: 400;
	letter-spacing: .02em;
	margin: 5px 0;
	}

/*========================================================================================
Portfolio Page
========================================================================================*/

.portfolio {
	position: relative;
	min-height: 235px;
	height: 22vh;
	max-height: 330px;
	}

.portfolio_overlay {
	display: grid;
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height:100%;
	padding: 5px 0 0 0;
	text-align: center;
	background: rgba(0,0,0,.6);
	opacity: 0;
	-webkit-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	}

.portfolio_overlay:hover {opacity: 1;}

.portfolio_overlay:hover a {
	opacity: 1;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	transition: all .4s ease-out;
	}

.portfolio_overlay a {
	display: table;
	margin: 20px auto;
	opacity: 0;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	transition: all .4s ease-out;
	}

.portfolio_overlay:hover h2 {
	margin: auto auto 0;
	opacity: 1;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	transition: all .4s ease-out;
	}

.portfolio_overlay h2 {
	font-size: 2rem;
	text-transform: uppercase;
	color: #fff;
	margin: auto auto -20px;
	opacity: 0;
	-webkit-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	transition: all .4s ease-out;
	}

/*========================================================================================
Content
========================================================================================*/

/* ============ Parallax Section ============= */

.parallax {
	display: grid;
	position: relative;
	background-attachment: fixed;
	background-position: center 0;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
	}

/* ============ Video Background ============= */

video {
	position: relative;
	-o-object-fit: cover;
	   object-fit: cover;
	width: 100%;
	height: auto;
	z-index: -2;
	margin: auto;
	}

.full_screen video {
	width: 100%;
	height: 100vh;
	}

/* ============ Flex Slider ============= */

ul.slides {max-width: none;}
ul.slides li p {text-align: center; margin: 20px auto;}
ul.flex-direction-nav {line-height: 2.5em;}

.caption {
	background: #eee;
	background: rgba(225,225,225,.9);
	background: red;
	padding: 15px 25px;
	text-align: center;
	margin: -60px auto 0;
	border-radius: 10px 10px 0 0;
	}

/* ============ DIY ============= */

.reduce_bottom_margin {margin-bottom: -4px;}


/*========================================================================================
Forms
========================================================================================*/

form {
	width: 100%;
	max-width: 500px;
	margin: auto;
	padding: 30px;
	background: #eee;
	font-family: 'source_sans_proregular','Helvetica Neue', Helvetica, Arial, serif;
	font-size: 1rem;
	line-height: 1.5em;
	font-weight: 400;
	color: #304450;
	border-radius: 5px;
	}

form .nf-field-label label, label {
	display: block;
	font-family: 'libre_baskervillebold','Helvetica Neue', Helvetica, Arial, serif;
	font-size: 1rem;
	margin: 10px 0 0 0;
	color: #304450;
	}

input[type="text"],input[type="email"],input[type="password"], select, textarea {
	width: 100%;
	padding: 15px;
	margin: 0 auto 10px;
	border-radius: 3px;
	border: 1px solid #ccc;
	}

form select {
	width: 50%;
	height: 40px;
	}

form textarea {
	height: 250px;
	border-radius: 3px;
	}

form .field-wrap input[type=button], #submit, form #searchsubmit, #wp-submit {
	display: block;
	padding: 17px 30px;
	margin: 30px 0;
	border-radius: 3px;
	background: #304450;
	color: #eee;
	font-family: 'source_sans_proregular','Helvetica Neue', Helvetica, Arial, serif;
	font-size: 1.1em;
	-webkit-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	}

form .field-wrap input[type=button]:hover, #submit:hover, #wp-submit:hover {background: #18ac5f;}

.nf-field-container {margin-bottom: 0 !important;}
form .field-wrap input[type=button] {margin-bottom: 0;}

/*========================================================================================
Footer
========================================================================================*/

footer {
	display: grid;
	grid-template-columns: 1fr;
	height: 75px;
	background: #304450;
	z-index: 97;
	margin: 0 auto;
	}

p.credits {
	font-size: 1rem;
	text-align: center;
	color: #bbb;
	margin: auto;
	padding: 0 15px;
	}

p.credits span {color: #777; padding: 0 15px;}

p.credits a {color: #bbb;}
p.credits a:hover {color: #eee;}

.answers {
	display: none;
	padding: 10px 0;
	margin: 10px 0 0;
	border-bottom: 2px solid #d1d1d1;
	}

.claim {cursor: pointer;}

/*========================================================================================
Responsive
========================================================================================*/

@media only screen and (min-width: 1290px) {

	.related_posts_img {height: 200px;}
}

@media only screen and (max-width: 1100px) {

	.col2_right {grid-template-columns: 1fr;}
	.col2_left {grid-template-columns: 1fr;}
	aside {margin: 50px auto 20px;}
	.related {width: 50%; float: left;}
	.related_posts_img {height: 220px;}

}

@media only screen and (max-width: 975px) {

	#menu-icon {display: block; padding: 13px;}
	nav {grid-template-columns: 0 auto 120px; padding: 0 !important;}
	.head_logo img {display: none;}
	#primary_nav_wrap {grid-template-columns: 70px 200px;}
	.mobile_logo {position: relative; display: block; padding: 7px 19px 0 3px; z-index: 101;}
	#primary_nav_wrap #nav {background: #13688b; padding: 65px 0; display: none; position: fixed; width: 50%; height: 100%; z-index: 99; max-width: 980px;}
	#primary_nav_wrap #nav li {display: block; margin:0; font-size: 1rem;}
	#primary_nav_wrap #nav li a {display: block; padding: 20px 10px; margin: 0; color: #fff;}
	#primary_nav_wrap #nav li ul {top: auto; left: 100%; margin: -65px 0 0 0; padding: 0; width: 100%; height: auto; align-content: start; font-size: 1em;}
	#primary_nav_wrap #nav li ul li a {display: block; padding: 20px 20px; color: #506670;}
	.social {font-size: 2em; margin: auto;}
	.social a {padding: 0 5px 8px;}
	#search_box {width: 85%;}
	#site_search form {margin: 8px 0 0 auto !important;}

	input[type="text"],input[type="email"],input[type="password"], select, textarea {padding: 12px;}
	.sticky {visibility: hidden;}

	.pad {padding: 16px 14px;}
	.wrapper {padding-left:35px; padding-right: 35px;}
	.seperation {padding-bottom: 16px;}

	.col4 {grid-template-columns: 1fr 1fr;}
	.sidepad {padding-left: 45px; padding-right: 45px;}
	.gallery.gallery-columns-4 .gallery-item {-ms-flex: 0 1 32%; flex: 0 1 32%;}


}


@media only screen and (max-width: 865px) {

	h1 {font-size: 3.1rem; line-height: 4rem;}
	h2 {font-size: 2.2rem; line-height: 2.9rem;}
	h3 {font-size: 2rem; line-height: 2.2rem;}
	h4 {font-size: 1.5rem; line-height: 1.8rem;}

	.col2 {grid-template-columns: 1fr;}
	.col3 {grid-template-columns: 1fr 1fr;}
	.col3 div:nth-child(3) { grid-column: 1 / span 2;}

	.extra_large_pad {padding-top: 120px !important; padding-bottom: 125px !important;}
	.gridgap {grid-gap: 20px;}
	.super_extra_large_pad {padding-top: 150px !important; padding-bottom: 155px !important;}
	.next {grid-template-columns: 1fr 1fr !important;}
	.gallery.gallery-columns-3 .gallery-item {-ms-flex: 0 1 47%; flex: 0 1 48.7%;}
	.gallery.gallery-columns-4 .gallery-item {-ms-flex: 0 1 47%; flex: 0 1 48.7%;}

}


@media only screen and (max-width: 740px) {
	.col4 {grid-template-columns: 1fr 1fr;}
	.big_button {font-size: 1.1em;padding: 15px 35px;}
	.related_posts_img {height: 170px;}
	.gallery .gallery-item {-webkit-box-flex: 1;-moz-box-flex: 1;-webkit-flex: 1;-ms-flex: 0 1 100%;flex: 0 1 100%;}

}


@media only screen and (max-width: 650px) {

	nav {grid-template-columns: 0 auto 120px;}
	#primary_nav_wrap #nav {font-size: 1.3rem; width: 100%;}
	#primary_nav_wrap ul li {position: relative;}
	#primary_nav_wrap ul li span {position: absolute; display: block; width: 30px; height: 30px; right: 22px; top: 22px;}
	#primary_nav_wrap #nav li ul {position: relative; display: block; top: 0; padding: 0; margin: 0; height: 0; -webkit-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease;}
	#primary_nav_wrap #nav li ul.show__me {left:0; height: 100%;}
	.col3 {grid-template-columns: 1fr;}
	.col3 div:nth-child(3) { grid-column: 1 / span 1;}
	.sidepad {padding-left: 40px; padding-right: 40px;}
	#search_box {width: 71%; margin: 0 auto;}
	.gridgap {grid-gap: 20px;}

}


@media only screen and (max-width: 550px) {

	#primary_nav_wrap {grid-template-columns: 70px 160px;}
	.mobile_logo {padding: 12px 15px 0 3px;}
	h1 {font-size: 2.7rem; line-height: 3rem;}
	h2 {font-size: 2rem; line-height: 2.4rem;}
	h3 {font-size: 1.8rem; line-height: 2.1rem;}
	h4 {font-size: 1.4rem; line-height: 1.8rem;}
	footer span.break {display: block; height: 0; opacity: 0; margin: -5px 0;}

	.col4 {grid-template-columns: 1fr;}
	.large_pad {padding-top: 40px !important; padding-bottom: 55px !important;}
	.extra_large_pad {padding-top: 100px !important; padding-bottom: 105px !important;}
	.big_button {padding: 13px 25px;}
	.related {width: 100%; float: none;}
	.related_posts_img {height: 220px;}

}


/*========================================================================================
IE Fix
========================================================================================*/


@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

	.head_logo {width: 160px; float: left;}
	.social {float: right; margin:20px 0;}
	#primary_nav_wrap {display: inline-block; margin: 24px 0 0 0;}
	.col3 div {display: inline-block; width: 32%; vertical-align: top;}
	.col2 div, .col2 article {display: inline-block; width: 49.5%; vertical-align: top;}
	.col2_right div:first-of-type, .col2_right article {width: 66%; float:left; margin-left: 4%;}
	.col2_right div:nth-of-type(2), .col2_right aside {width: 30%; float: left;}
	.col2_right::after {content: ""; clear: both; display: table;}
	#comments, #comments div {width: 100%; float: none; margin-left: 0;}
	[class^="nf-"] {width: 100% !important;}
	form div {width: 100% !important;}
	.nf-form-cont {width: 49.5% !important; margin: 0 auto;}
	.nf-after-field {display: none !important;}
	.iewidth {max-width: 850px;}
	.gridgap {margin: .5%;}
	footer {padding: 30px 0 0;}
	.maxwidth {margin-right: auto; margin-left: auto;}
	.portfolio_overlay {width: 100% !important; padding-top: 80px;}
	.related_posts_img {width: 100% !important;}
	.related_post_text {width: 100% !important; text-align: center;}

}
@media only screen and (max-width: 1100px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.col2_right div:first-of-type, .col2_right article {width: 100%; float:none; margin-left: auto;}
	.col2_right div:nth-of-type(2), .col2_right aside {width: 100%; float: none;}

}

@media only screen and (max-width: 975px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {

	#menu-icon {width: 70px; float: left; position: relative; z-index: 100;}
	.head_logo {display: none;}
	.mobile_logo {width: 120px; float: left; margin:7px 0 0 0;}
	#primary_nav_wrap {width: 50%; margin:0;}
	.col3 div {width: 31.5%;}
	.social {float: right; margin: 20px 20px 0 0;}

}

@media only screen and (max-width: 865px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.col3 div {width: 48.5%;}
	.col2 div, .col2 article {display: block; width: 100%;}
	.nf-form-cont {width: 100% !important;}
}

@media only screen and (max-width: 865px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.col3 div {width: 100%;}
}

@media only screen and (max-width: 600px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.related {width: 100%; float: none;}
}

/*========================================================================================
End
========================================================================================*/