/* @override 
https://yourpeihome.ca/wp-content/themes/yourpeihome/style.css
https://yourpeihome.ca/wp-content/themes/yourpeihome/css/style-min.css
 */

/*
Theme Name: Your PEI Home
Theme URI: https://vizou.com
Author: Dana Whittle
Author URI: https://vizou.com
Description: Custom theme for Marsha Weeks
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: yourpeihome.ca
*/

/*FONTS--------------------*/

/* Googlefonts
Raleway - 300,300i,400,500,600
*/

/*RALEWAY*/

.bootstrap-realtypress {
	font-family:inherit !important;
	font-size:inherit !important;
	line-height: inherit !important;
}

/*300*/
h1 {
	font-family: Raleway !important;
	font-style: normal !important;
	font-weight: 300 !important;
}

/*italic*/
em {
	font-family: Raleway !important;
	font-style: italic !important;
	font-weight: 300i !important;
}

/*400*/
h2,
.footer,
.wp-caption-text {
	font-family: Raleway !important;
	font-style: normal !important;
	font-weight: 400 !important;
}

/*500*/
h3,
h4,
h5,
h6,
.location,
label,
.button,
.copyright,
#cookie-notice {
	font-family: Raleway !important;
	font-style: normal !important;
	font-weight: 500 !important;
}

/*600*/
.price,
.sold,
.sold-details,
strong,
blockquote em,
.url,
.listing-link,
.pagination .current,
a.page-numbers,
.cn-button,
label,
.button,
nav ul li a,
.branding,
.toggle-nav,
.subscribe,
.meta,
.meta a,
a.post-edit-link {
	font-family: Raleway, sans-serif !important;
	font-style: normal !important;
	font-weight: 600 !important;
}

/*VARIABLES --------------------*/
:root {
	--overlay: rgba(255, 255, 255, 0.6);
	--white: #fff;
	--black: #000;
	--gray: #b6b9b2;
	--dusty: #e0e2df;
	--red: #cc2137;
	--green: #63b590;
	--mint: #f6faf3;
	--darkblue: #164f88;
	--babyblue: #e4f1ff;
	--blue: #4685c4;
	--yellow: #f0e7b5;
	--pale: #edefec;
	--border: 1px solid var(--pale);
}

/*BASICS --------------------*/

.which-template {
	display: none;
	color: var(--gray);
}

.screen-reader-text {
	display: none;
}

html {
	font-size: calc(16px + 6 * ((100vw - 900px) / 1280));
	width: 100%;
	height: 100%;
	padding: env(safe-area-inset-top) env(safe-area-inset-right)
		env(safe-area-inset-bottom) env(safe-area-inset-left);
}

*,
*:after,
*:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	font: normal 100% Raleway, Helvetica, Arial, sans-serif;
	font-weight: 300;
	line-height: 26px;
	color: #333;
	background: var(--white);
	overflow-x: hidden;
	overflow-y: auto;
	display: grid;
	width: 100%;
	min-height: 100%;
	margin: 0 auto;
}

p {
	margin: 5px 0 15px 0;
}

strong {
	color: var(--darkblue);
}

small {
	font-size: 0.8em;
}

em {
	font-style: italic;
}

/*links*/

a,
a:visited {
	color: var(--darkblue);
	text-decoration: none;
}

a:hover {
	color: var(--gray);
	text-decoration: none;
}

/*HOLDING --------------------*/

/*holding page*/

.holding {
	color: var(--white);
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	text-align: center;
}

.holding .grid {
	padding: 0 2em;
	height: 100vh;
}

.holding a,
.holding .footer a {
	color: #fff;
}

.holding a:hover {
	color: var(--bright);
}

/*BG, BRANDING, HEADER --------------------*/

.container {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}

.header {
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1000;
	margin: 2em 3em;
}

.branding {
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 80px;
}

.branding a img:hover {
	opacity: 1;
}

img.quilt {
	width: 75px;
}

img.signature {
	width: 400px;
	height:auto;
	padding: 0 15px;
}

img.realtor {
	width: 250px;
}

/*NAVIGATION --------------------*/

nav ul li.nav-home,
.nav-branding,
.toggle-nav {
	display: none;
}

nav ul {
	padding: 0 0 0 20px;
	margin: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

nav ul li {
	list-style: none;
	margin: 0;
	padding: 0;
}

nav ul li a {
	text-transform: uppercase;
	font-size: 0.9em;
	margin: 0 4px;
	color: var(--darkblue);
	transform: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

nav ul li a:hover,
nav ul li a i:hover,
nav ul li.current-menu-item a {
	color: var(--gray);
}

nav ul li a i {
	font-size: 18px;
	padding: 0 2px;
	color: var(--red);
}

.featured img.featured-img {
	min-width: 100%;
}

.featured img {
	min-width: 100%;
	filter: none;
}

.services,
.testimonials {
	text-align: center;
	line-height: 1.3em;
}

.services .block:nth-of-type(odd) {
	background: var(--dusty);
}

.testimonials {
	background: var(--pale);
	padding-bottom: 2em;
}

.testimonials strong {
	color: var(--blue);
}

/*GRIDS --------------------*/

/*named grid areas*/
.content {
	grid-area: content;
}
.left {
	grid-area: left;
}
.right {
	grid-area: right;
}
.center {
	grid-area: center;
}

.single .bootstrap-realtypress {
	padding: 1em 3em;
}

.grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-template-areas: '. . content content content content content content content content . .';
	grid-column-gap: 0;
	margin: 0 auto;
}

.grid.page {
	padding: 3em 0;
}

.grid.listings {
	grid-template-columns: repeat(1, 1fr);
	grid-template-areas: 'content';
	padding: 3em;
}

/*featured sections --------------------*/

.grid-blocks {
	width: 100%;
	display: grid;
	grid-template-columns: 33% auto 33%;
	grid-column-gap: 0;
}

.content-inner {
	padding: 1.5em 2em 2em 2em;
}

.block img.wp-post-image,
.post img.wp-post-image {
	width: 100%;
	height: 300px;
	object-fit: cover !important;
}

.block i.fa-heart {
	font-size: 24px;
	color: var(--blue);
	margin-bottom: 10px;
}

.testimonials .block:nth-of-type(2n) {
	border-right: 2px solid var(--white);
	border-left: 2px solid var(--white);
}

/*listings --------------------*/

.grid-posts {
	padding: 2em;
	column-gap: 1em;
	-webkit-columns: 3;
	-moz-columns: 3;
	columns: 3;
}

.post {
	margin: 0 0 2em 0;
	line-height: 1.3em;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
	background: var(--pale);
	position: relative;
}

.listing-link a {
	text-transform: uppercase;
	font-size: 1.1em;
}

.details {
	background: var(--dusty);
	padding: 1em;
	text-align: center;
	margin: -8px 0 8px 0;
	position: relative;
}

.details-single .details {
	background: none;
}

.details p {
	margin: 5px 0;
}

.price {
	font-size: 1.2em;
}

.url {
	font-size: 0.8em;
	text-transform: uppercase;
}

.url img {
	width: 50px;
	position: absolute;
	right: 20px;
	top: -35px;
}

.url i {
	margin: 0 5px;
}

.sold {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.2em;
	text-transform: uppercase;
	color: var(--white);
	width: 90px;
	height: 90px;
	border-radius: 50%;
	background: var(--green);
	position: absolute;
	top: 30px;
	left: 30px;
	transform: rotate(-7deg);
}

.sold-details {
	display: inline-block;
	font-size: 0.8em;
	text-transform: uppercase;
	color: var(--white);
	padding: 2px 8px;
	background: var(--green);
}

/*news --------------------*/

.grid-horiz {
	display: grid;
	grid-gap: 0;
	grid-template-columns: 33% auto;
	grid-template-areas: 'left right';
}

.grid-horiz:nth-of-type(odd) {
	background: var(--pale);
}

.news-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover !important;
}

/*single --------------------*/

.grid-split {
	display: grid;
	grid-template-columns: 60% auto;
	grid-template-areas: 'left right';
	grid-column-gap: 2em;
	padding: 0 0 0 3em;
}

.grid-split .right {
	width: 100%;
}

.grid-split .content-inner {
	padding: 0 2em 0 0;
}

.grid-split .details {
	margin-bottom: 2em;
}

.related-posts {
	display: grid;
	grid-gap: 10px;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
	padding: 0 2em 2em 0;
}

.related-posts a img {
	display: inline-block;
}

/*footer --------------------*/

.footer {
	background: var(--gray);
	padding: 2.5em 3em 1em 3em;
	position: relative;
}

.grid-footer {
	display: grid;
	grid-template-columns: 33% auto;
	grid-template-areas: 'left right';
	grid-gap: 1em;
}

.footer .left {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.footer .right {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.logos img {
	padding: 0 20px;
	margin: 0;
}

.footer p {
	margin: 5px 0;
}

.footer i {
	font-size: 16px;
	padding: 0 5px;
	color: var(--red);
}

.footer a {
	color: var(--white);
}

p.copyright {
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin: 4em 0 1em 0;
}

/* pagination -------------------- */

nav.navigation.pagination {
	text-align: center;
	color: var(--bright);
	width: 100%;
	font-size: 1em;
	padding-bottom: 2em;
}

.nav-links:before {
	content: 'Pages ';
}

.pagination a {
	color: var(--green);
}

.page-numbers.current,
.pagination a:hover {
	color: var(--red);
}

.page-numbers {
	padding: 0 10px;
}

/*HEADERS --------------------*/

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.1em;
	color: var(--darkblue);
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
}

h1,
h2,
h3 {
	letter-spacing: -0.02em;
}

h1 {
	font-size: 4em;
	line-height: 1em;
	margin: 0 0 20px 0;
	color: var(--gray);
}

.footer h1 {
	color: var(--dusty);
	font-size: 2.5em;
	margin-bottom: 40px;
	text-align: center;
}

.testimonials h1 {
	padding: 2rem 1rem 0 1rem;
}

h2 {
	font-size: 2em;
	line-height: 1.1em;
	margin: 0 0 15px 0;
}

h3 {
	font-size: 1.1em;
	margin: 10px 0;
	text-transform: uppercase;
}

h4 {
	font-size: 1em;
}

h2 a,
h3 a,
h4 a {
	color: var(--darkblue);
}

h5 {
	font-size: 0.9em;
	margin: 5px 0;
	text-transform: uppercase;
}

h6 {
	font-size: 0.8em;
	margin: 5px 0;
}

/*CONTENT --------------------*/

blockquote {
	font-size: 1.1em;
	line-height: 1.5em;
	margin: 20px 0;
	padding: 20px;
}

blockquote em {
	font-size: 0.75em;
	text-transform: uppercase;
	color: var(--darkred);
}

/*meta --------------------*/

a.post-edit-link {
	color: var(--gray);
	display: block;
	font-size: 0.8em;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-align: right;
	margin: 0 0 10px 0;
}

a.post-edit-link:hover {
	color: var(--lavender);
}

/*lists --------------------*/

ul {
	padding: 0 0 10px 20px;
	margin: 0 0 20px 10px;
	list-style-position: outside;
}

ul li {
	list-style-type: disc;
	padding: 5px 0;
}

ol {
	list-style-type: decimal;
	list-style-position: outside;
	margin: 0 0 0 15px;
	padding: 0 0 0 15px;
}

ol li {
	padding: 3px 0;
	margin: 0;
}

/*IMAGES, ALIGN --------------------*/

iframe {
	max-width: 100%;
	border: 0;
	margin: 10px 0;
}

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

a img:hover {
	filter: brightness(110%);
}

.alignnone {
	margin: 20px 0;
}

.alignleft {
	float: left;
	margin: 0 30px 15px 0;
}

.alignright {
	float: right;
	margin: 0 0 15px 30px;
}

.aligncenter {
	text-align: center;
}

.rl-gallery-container {
	margin: 20px 0;
}

.rl-gallery-item-caption,
.wp-caption-text {
	display: block;
	margin: 10px 0;
	font-size: 0.75em;
	line-height: 1rem;
	color: var(--black);
}

.featured .wp-caption-text {
	padding-left: 2em;
}

/*PLUGINS --------------------*/

/*realtypress*/
.rps-add-favorite {
	display:none !important;
}

/*cookie notice*/

#cookie-notice {
	bottom: 80px;
	background: none !important;
	font-size: 20px !important;
	line-height: 1.3em !important;
}

.cookie-notice-container {
	position: relative;
	background: var(--darkblue);
	width: 400px !important;
	padding: 30px !important;
	margin: 0 auto;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

#cn-close-notice {
	display: none;
}

.cn-button {
	background: var(--bright) !important;
	color: var(--white) !important;
	text-transform: uppercase !important;
	padding: 10px !important;
	margin: 20px !important;
}

.cn-button:hover {
	background: var(--white) !important;
	color: var(--red) !important;
}

/*Google Maps Widget*/

h2.widgettitle {
	display: none;
}

/*FORMS --------------------*/

form {
	width: 100%;
	margin: 1em 0;
	border: 0;
}

label {
	font-size: 0.8em !important;
}

.required {
	color: var(--bright) !important;
}

a.btn-primary {
	color:var(--white)!important;
	background:var(--darkblue) !important;
}

a.btn-primary:hover {
	color:var(--white)!important;
	background:var(--gray) !important;
	border: 0;
}

a.btn strong {
	color:var(--white);
	text-transform:uppercase;
}

.button {
	display: inline-block;
	font-size: 0.8em !important;
	text-transform: uppercase !important;
	color: var(--white) !important;
	border: 0 !important;
	box-shadow: none !important;
	background: var(--bright) !important;
	padding: 5px 12px 8px 12px !important;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px !important;
}

.button:hover {
	background: var(--gray) !important;
	color: var(--white) !important;
}

@media only screen and (max-width: 767px) {
	body {
		display: block;
	}
	.header {
		position: fixed;
		background: var(--white);
		display: block;
		padding: 20px 0 0 0;
		margin: 0;
		min-height: 220px;
		width: 100%;
		text-align: center;
		-webkit-filter: drop-shadow(0px 0px 50px #ddd);
		filter: drop-shadow(0px 0px 50px #ddd);
	}
	.branding {
		display: none;
	}
	.nav-branding {
		display: block;
		width: 100%;
	}
	.branding img {
		height: auto;
	}
	img.quilt {
		width: 50px;
		display: inline-block;
		margin: 0 auto;
	}
	img.signature {
		max-width: 80%;
	}
	img.properties {
		max-width: 50%;
	}
	a.toggle-nav {
		display: block;
		padding: 10px 0;
		font-size: 30px;
		text-align: center;
		color: var(--red);
	}
	.toggle-nav:hover {
		color: var(--gray);
	}
	nav ul li.nav-home {
		display: block;
	}
	nav.nav-main ul {
		flex-direction: column;
		align-items: center;
		padding: 0;
		background: var(--pale);
	}
	nav ul.nav-active {
		display: none;
	}
	nav ul li {
		padding: 10px 0;
		text-align: center;
		width: 100%;
		border-top: 1px solid #ddd;
	}
	nav ul li a,
	nav ul li a:hover {
		font-size: 1.2em;
	}
	nav ul li:hover,
	nav ul li.current-menu-item {
		background: var(--dusty);
	}
	.grid,
	.grid-split,
	.grid-blocks,
	.grid-horiz,
	.grid-footer,
	.post,
	.block,
	.left,
	.right {
		display: block;
	}
	.grid.page {
		padding: 0 2em;
	}
	.grid-split,
	.featured,
	.grid-horiz:first-of-type {
		padding: 220px 0 2em 0;
	}
	.grid-posts {
		columns: 1;
		padding-top: 220px;
	}
	.left,
	.right {
		padding: 1em 3em;
	}
	.footer {
		text-align: center;
	}
	.footer h1 {
		font-size: 2rem;
		line-height: 1.2em;
		text-align: center;
	}
	.logos img {
		padding: 20px;
	}
	.rl-gallery-container {
		margin: 0 !important;
	}
	#cookie-notice {
		bottom: 20px;
	}
	.cookie-notice-container {
		width: auto !important;
		padding: 30px !important;
		margin: 0 auto;
	}
	.alignleft,
	.alignright {
		display: block;
		float: none !important;
		margin: 10px 0 !important;
	}
	.alignnone,
	iframe,
	.post img {
		display: block;
		max-width: 100%;
		height: auto;
	}
}