/*
 Theme Name:   Wanner GP
 Theme URI:    https://generatepress.com
 Description:  Wanner Associates Child Theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/* Flexbox Columns */

.flex-columns {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.justify-flexstart {
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.justify-center {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.justify-spacebetween {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.align-items-flexstart {
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.align-items-center {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.align-items-stretch {
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

/* align-content is for multiline columns */
.align-content-flexstart {
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
}

.align-content-center {
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
}

.align-content-spacebetween {
    -webkit-align-content: space-between;
    -ms-flex-line-pack: justify;
    align-content: space-between;
}

/* Individual Column Width */

.flexfallback { } /* ALWAYS include this in each column, plus an individual size below. */

.flexcol-auto {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: auto;
}

.flexcol-half {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: 48%;
}

.flexcol-third {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: 31%;
}

.flexcol-two-thirds {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: 66%;
}

.flexcol-fourth {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: 23%;
}

.flexcol-three-fourths {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: 75%;
}

.flexcol-fifth {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: 18%;
}

/* Custom Styles */

header#masthead {
	background-image:url("images/title-1-gray.jpg");
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 100% auto;
}


.home header#masthead {
	background-image:url("images/home-header-background.jpg");
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 100% auto;
}

header#masthead .inside-header {
	position: relative;
}

header#masthead .header-widget {
	display: inline-block;
	position: absolute;
	top: 17%;
	right: 0px;
}

#page.grid-container {
	background-color: var(--base-2);
	width: 100%;
	max-width: 100% !important;
}

.wanner-content-wrapper {
	background-color: var(--base-3);
	box-shadow: 0 0 36px rgba(0,0,0,.1);
	margin: 0 auto;
	padding: 0 18px;
	width: 100%;
	max-width: 1140px;
}

.wp-block-read-more {
  display: inline-block;
  width: auto;
}

.wanner-staff-email {
	margin: 2em auto;
	text-align: center;
}

.wanner-staff-email a {
	background-color: var(--contrast);
	border-radius: 100%;
	color: #FFF;
	display: inline-block;
	font-size: 30px;
	padding-top: 3px;
	width: 50px;
	height: 50px;
	text-align: center;
}

.wanner-staff-email a:hover, .wanner-staff-email a:focus {
	color: var(--global-color-10);
}

/* Responsive Styles */
@media (max-width: 1300px) {

	.home header#masthead {
	background-image:none;
}
	
}


@media (max-width: 768px) {
	
	/* Flexbox Columns */

	.flex-columns {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	/* Individual Column Width */

	.flexcol-auto {
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		width: auto;
	}

	.flexcol-half {
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		width: 100%;
	}

	.flexcol-third {
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		width: 100%;
	}

	.flexcol-two-thirds {
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		width: 100%;
	}

	.flexcol-fourth {
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		width: 100%;
	}

	.flexcol-three-fourths {
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		width: 100%;
	}

	.flexcol-fifth {
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		width: 100%;
	}

	.flexfallback {
		margin-bottom: 10px;
	}
	
	
	/* Custom Styles */
	
	header#masthead, .home header#masthead {
		background-image: none;
	}
	
	header#masthead .header-widget {
		display: none;
	}
	
	#site-navigation {
		position: absolute;
		top: 30px;
		right: 6px;
	}
	
	.admin-bar #site-navigation {
		top:76px;
	}
	
	.wanner-staff-container.flex-columns {
		-webkit-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
	
}