/*
Theme Name: Farma Service
Template: karuna
Theme URI: https://wordpress.com/themes/karuna/
Description: The Farma Service team is based off Automattic's Karuna.
Version: 0.1
Author: Jan Boddez
Author URI: https://janboddez.be/
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: karuna
*/

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

.site-description {
	visibility: hidden;
	height: 0;
	margin-bottom: 0;
}

.farma-custom-header {
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
	padding: 3.6em 0;
}

/* ==========================================================================
    Main Navigation
   ========================================================================== */

.main-navigation {
	letter-spacing: 1px;
}

.main-navigation .active > a,
.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current_page_parent > a,
.main-navigation a:hover,
.main-navigation a:focus,
.main-navigation a:visited:hover,
.main-navigation a:visited:focus {
    /* Prevents 1px jiggle in certain browsers */
	color: #999;
	opacity: 1;
}

.main-navigation ul ul {
	top: 2em;
	margin-left: -1em;
}

.main-navigation ul ul li {
	padding-left: 0;
}

.main-navigation ul ul a,
.main-navigation ul ul a:visited {
	padding: 0.6em 1.2em;
}

/* ==========================================================================
    Main
   ========================================================================== */

.site-content {
	/* Remove whitespace below 'Recent Posts' section on front page and elsewhere */
	padding-bottom: 0;
}

/* If enabled through the Yoast SEO plugin */
#breadcrumbs {
	margin-bottom: 2.4em;
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation,
.comments-area {
	/* And add some it back to navigation sections */
	margin-bottom: 4em; /* A little less than 1.6em + 3.2em */
}

/* ==========================================================================
    Homepage
   ========================================================================== */

.page-template-front-page .site-main > .hentry:first-of-type {
	margin-bottom: 3.2em;
}

.page-template-front-page .site-main > .hentry:first-of-type .entry-footer {
	margin-bottom: 1.6em;
}

.page-template-front-page .site-main > .hentry:first-of-type .entry-title {
	text-align: inherit;
}

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

.top-bar {
	background: #2350a9;
	text-transform: none;
}

.menu-toggle {
	color: #2350a9;
}

.site-footer {
	background: #2350a9;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	border-color: #2350a9;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
#infinite-handle span {
	border-color: #2350a9;
	color: #2350a9;
}

.comment-navigation a,
.comment-navigation a:visited,
.posts-navigation a,
.posts-navigation a:visited,
.post-navigation a,
.post-navigation a:visited,
a,
a:visited {
	color: #2350a9;
}

.footer-widgets-wrapper {
	background: transparent;
}

/* Reset colors affected by the rules above */
a:hover,
a:focus,
a:active {
	color: #85cc36;
}

.top-bar a,
.footer-widgets-wrapper a {
	color: #fff;
}

.site-title a,
.entry-title a {
	color: #333;
}

.site-footer {
	background-color: transparent;
}

.site-info {
	/*height: 4.85em;*/
	background-color: #2350a9;
	color: rgba(255, 255, 255, 0.8);
	padding-bottom: 1.7em; /* Smallest tweak ever */
}

.site-info a:link,
.site-info a:visited {
	color: #fff;
}

.footer-widgets {
	background: rgba(0, 135, 93, 0.9);
}

.footer-widgets-wrapper {
	padding-top: 2em;
	padding-bottom: 2em;
}

.footer-widgets .widget-area:last-child .widget,
.footer-widgets .widget-area:last-child .widget p:last-child {
	margin-bottom: 0;
}

.footer-widgets .widget-title {
	color: rgba(255, 255, 255, 0.8);
}

.entry-meta,
.entry-footer {
	font-size: 16px;
	font-size: 1rem;
	text-transform: none;
}

.entry-meta a,
.entry-footer a {
	color: #999;
	text-transform: none;
}

/* ==========================================================================
    Typography
   ========================================================================== */

body,
button,
input,
select,
textarea {
	font-family: "PT Sans", sans-serif;
	color: #444;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "PT Sans", sans-serif;
	color: #999;
	text-transform: none;
	clear: none;
	margin-bottom: 0.2em;
}

.site-content h3,
.site-content h4,
.site-content h5,
.site-content h6 {
	font-size: 26px;
	font-size: 1.625rem;
	letter-spacing: 1px;
	color: #2350a9;
}

ul,
ol {
	margin-top: 0.8em;
}

hr {
	margin-top: 1.6em;
}

blockquote {
	font-family: "PT Serif", Georgia, serif;
	font-weight: normal;
	font-style: italic;
}

blockquote p {
	margin: 0.2em 0;
}

blockquote.aligncenter {
	width: 85%;
	margin: 0 auto;
}

.alignleft {
	margin: 0 1.6em 0.4em 0;
}

.alignright {
	margin: 0 0 0.4em 1.6em;
}

blockquote.alignleft {
	width: 45%;
}

blockquote.alignright {
	width: 45%;
}

code, kbd, tt, var, pre {
	background-color: rgba(0, 0, 0, 0.05);
	font-family: "Inconsolata", "Courier 10 Pitch", Courier, monospace;
}

.wp-caption {
	width: auto !important;
}

.wp-caption .wp-caption-text {
	font-size: 16px;
	font-size: 1rem;
}

.button,
.menu-toggle,
input[type="submit"] {
	border-radius: 1.4375em;
	/* padding: 0.75em 1.6em 0.85em; /* Tiniest of tweaks */
}

.widget {
	margin: 0 0 0.8em;
}

.site-content .widget-area .widget {
	background-color: #e5e5f5;
	padding: 1.6em;
}

.widget div > ul li,
.widget > ul li {
	border-top: 1px solid rgba(153, 153, 153, 0.5);
}

form.contact-form {
	margin: 2.4em 0 0;
}

form.contact-form label span {
	color: #444;
	margin-left: 0.33em;
}

p.contact-submit {
	margin-top: 0.4em;
}

.col-left,
.col-right {
	float: none;
	width: 100%;
}

/* ==========================================================================
    Google Maps
   ========================================================================== */

#gmaps-map {
    height: 360px;
    margin-top: 2em;
    margin-bottom: 5.6em;
}

.page-id-30 .entry-content { /* Contact Page */
    margin-bottom: 0;
}

/* ==========================================================================
    Larger Screens
   ========================================================================== */

@media screen and (min-width: 768px) {
	/* 'Two-column' shortcodes */
	.col-left {
		float: left;
		width: 47%;
	}

	.col-right {
		float: right;
		width: 47%;
	}

	form.contact-form {
		/* Less margin on larger screen (where the form's likely in its own, right-floating column) */
		margin: 0.8em 0 0;
	}

	.site-content {
		padding-top: 4em;
	}

	.farma-custom-header-inner {
		font-size: 20px;
		font-size: 1.25rem;
	}

	.front-testimonials,
	.footer-widgets-wrapper,
	.recent-posts-wrapper,
	.site-branding-wrapper,
	.top-bar-wrapper,
	.site-content,
	.page-template-front-page .site-main > .hentry:first-of-type,
	.page-template-full-width-page-php .site-content,
	.site-content .full-width-widget-area,
	.header-widget-area .header-widget-area-wrapper {
		/* Make the entire site a bit narrower */
		max-width: 920px;
	}

	.site-branding {
		min-width: 0;
	}

	.custom-logo-link {
		display: block;
	}

	.custom-logo {
		margin-right: 0;
	}

	.site-description {
		visibility:  inherit;
		height: 1.5em;
		width: 60%; /* Slightly larger prevents some wrapping issues */
	}

	.jetpack-social-navigation {
		width: 30%; /* Slightly smaller prevents all wrapping issues */
	}

	.main-navigation ul ul {
		background-color: #2350a9;
	}

	.main-navigation li {
		/* Move left padding from <a> to <li> */
		padding-left: 2.4em;
	}

	.main-navigation li > a {
		/* Move left padding from <a> to <li> */
		padding-left: 0;
	}

	.page-template-default .content-area,
	.post-template-default .content-area {
		float: none;
		margin: 0;
	}

	.page-template-default .site-main,
	.post-template-default .site-main {
		/* Make all pages and single posts full-width */
		margin-right: 0;
	}

	.page-template-front-page .site-main > .hentry:first-of-type .entry-content,
	.page-template-front-page .site-main > .hentry:first-of-type .entry-content > p:first-of-type,
	.entry-content,
	.entry-summary,
	code, kbd, tt, var, pre {
		font-size: 20px;
		font-size: 1.25rem;
	}

	.recent-posts {
		/* Add a little padding to the 'Recent Posts' section */
		padding-bottom: 3.2em;
	}

	.recent-posts .hentry {
		margin-bottom: 1.6em;
	}

	.footer-widgets-wrapper {
		padding-top: 3.2em;
		padding-bottom: 3.2em;
	}

    .farma-custom-header {
    	padding: 12em 0;
    }

    #gmaps-map {
        height: 480px;
        /*margin-bottom: 3.2em;*/
    }
}

/* ==========================================================================
    Even Larger Screens
   ========================================================================== */

@media screen and (min-width: 1100px) {
	body {
		padding-top: 7.75em;
	}

	.sticky-header {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 8;
	}

	.sticky-wrapper {
		box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
		position: static;
	}

	.sticking.sticky-wrapper {
		box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
	}

	.sticking.sticky-wrapper .site-branding,
	.sticking.sticky-wrapper .main-navigation {
		position: static;
		/* Less padding on sticky header */
		padding: 0.8em 0;
	}

	.farma-custom-header {
		padding-top: 8em;
	}
}
