/*
Theme Name: GeneratePress Child
Theme URI: https://adayin.se
Description: Child theme for GeneratePress
Author: A Day In
Template: generatepress
Version: 1.0.0
Text Domain: generatepress-child
*/

.mobile-ul {
	margin-left: 1em;
}
.mobile-ul li {
	margin-bottom: 1em;
}
@media (max-width: 767px) {
	.mobile-ul {
		margin-left: 0.5em;
	}
	.mobile-ul li {
		margin-bottom: 0.5em;
	}
}

/* I'm setting overflow hidden to the first page, due to the districts grid. Without this it will span more than 100% of the viewport (since it seems to also include the width of the vertical scrollbars) which in turn leads to the districts grid being a few pixels wider, and because of this causing a horizontal scroll. */
body.home {
	overflow-x: hidden;
}

/* 
 * kill the space only on the front page
 * everywhere else keeps its default spacing.
 * The footer spacing is set in Appearance > Elements > Site Footer
 */
.home .site-footer .site-footer-inner {
  margin-top: 0;
}

/* This is a hack. It hides the fact that some columns, are missing a pixel at the bottom --> this only happens in certain viewport widths, due to the calculation of the 7 column grid. This can probably be done in a better way, since the current way hides the problem instead of fixing it. */
.grid-districts {
	overflow: hidden;
	margin-bottom: -1px;
}

/* The outer container is set to "width: 1280px". By setting "max-width: 100%", we override this in order to make it span the full width of the viewport. The reason we need this, is so that we can let some background elements span the full width of the viewport. (This is for example used for the districts elements, at the bottom of the first page – right above the footer.) */
/*.grid-container {
	max-width: 100%;
}*/

/* width of the top header (that holds the top menu). With this rules the logo and menu spans slightly outside of the 1280px max-width of the remaining content. */
.inside-header {
	max-width: 1440px
}


/* Utility: no-style links inside any card pattern */
.card-module a,
.list-module .gb-container a {
	text-decoration: none;
	color: inherit;
}
.list-module p {
	margin-bottom: 0;
}
.card-module figure{
	overflow: hidden;
}
.card-module-1 figure {
	border-radius: 3px;
}
.card-module-1 h3 {
	font-size: 24px;
}
.card-module-2 h3 {
	font-size: 40px;
	font-weight: 700;
}
.card-module-3 h3 {
	font-size: 30px;
	font-weight: 700;
}
.card-module .gb-grid-column img.main {
	transition: all .4s ease-in-out;
}
.card-module .gb-grid-column:hover img.main,
a.gb-container:hover img.main
/*,
.card-module .gb-grid-wrapper:hover img.main*/ {
	transform: scale(1.05);
}
.card-module-1 .gb-grid-column h3.main {
	padding: 15px 20px 0;
}
.card-module-2 .gb-grid-column h3.main,
.card-module-3 .gb-grid-column h3.main {
	position: absolute;
	bottom: 1px;
	left: 20px;
	color: #fff;
	padding: 0;
	margin: 0 0 9px;
}


.card-module-2 .gb-grid-column h3.main.centered,
.card-module-3 .gb-grid-column h3.main.centered {
		position: absolute;
		bottom: unset;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);   /* pull it back half its own size */
    color: #fff;
    margin: 0;
    text-align: center;      /* nice for multi-line headings */
}


.feature-panel .eyebrow {
	color: #757575;
	font-size: 20px;
	font-weight: bold;
	font-style: italic;
	margin-bottom: 10px;
}
a.gb-container:hover h3 {
	color: #777;
}

/* horizonatal list without bullet points */
.list_horizontal ul {
	display: inline-block;
	margin: 0;
}
.list_horizontal ul li {
	float: left;
	list-style: none;
	margin-right: 40px;
}

/* site-footer is the main footer */
.site-footer a {
	color: #fff;
}

/* list item with green bullets */
.module-green-rounded-box li {
	font-size: 20px;
	color: #498267;
}
.module-green-rounded-box ul a {
	color: #000;
}
.module-green-rounded-box ul a:hover {
	color: #669966;
}