/*
 Theme Name:     Greenshift Child Theme
 Theme URI:      https://www.phss.cc
 Description:    Pure Heart Sunshine Theme 
 Author:         W.T. Poon
 Author URI:     https://www.phss.cc
 Template:       greenshift
 Version:        1.0.0
*/
 
/* =Theme customization starts here
------------------------------------------------------- */

body {
	background : #FFF;
	background: url(https://lh3.googleusercontent.com/d/1GRP3JIR9mxxSBocevcz-0igH1I6WbIJ0?authuser=1) repeat-x;
	padding:0;
	margin:0;
	background-size: cover;
	background-position: center center;
	background-attachment: fixed;
	animation: scroll 200s linear infinite;
 }

@media (max-width: 768px) {
	.reverse-mobile {
		flex-direction: column-reverse;
	}
}

.circle-image img {
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
}

/* shadow outline for text with light color */
.outline {
	text-shadow: 2px 2px 0 #4074b5, 2px -2px 0 #4074b5, -2px 2px 0 #4074b5, -2px -2px 0 #4074b5, 2px 0px 0 #4074b5, 0px 2px 0 #4074b5, -2px 0px 0 #4074b5, 0px -2px 0 #4074b5;
}


.slide-div {
	position: relative;
	text-align: center;
}

.slide-title {
	font-size: calc(0.5em + 1vmin);
	background : #000;
	color : #fff;
	width : 100%;
	position: absolute;
	bottom: 0%;
	left: 50%;
	transform: translate(-50%, 0%);
}

.slide-img {
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	-o-border-radius: 20px;
}


/* overwrite query loop template for https://phss.cc/sdgroup/ */
.wp-block-query-pagination, .wp-block-post-template {
	padding : 10px 20px 10px 20px !important;
	margin : 10px 20px 10px 20px !important;
	background-color : #FFF;
	opacity : .7;
	font-weight : bolder;
	border: 1px solid;

}

#fly {
	motion-path: path("M18.45,58.46s52.87-70.07,101.25-.75,101.75-6.23,101.75-6.23S246.38,5.59,165.33,9.08s-15,71.57-94.51,74.56S18.45,58.46,18.45,58.46Z");
	offset-path: path("M18.45,58.46s52.87-70.07,101.25-.75,101.75-6.23,101.75-6.23S246.38,5.59,165.33,9.08s-15,71.57-94.51,74.56S18.45,58.46,18.45,58.46Z");
	width : 60px;
	position: absolute;
	animation: move 20s linear infinite;
}
@keyframes move {
	0% { 
		motion-offset: 0%;
		offset-distance: 0%;
		opacity : 0.2;
	}
	50% { 
		motion-offset: 50%;
		offset-distance: 50%;
		opacity : 1;
	}
	100% { 
		motion-offset: 100%;
		offset-distance: 100%;
		opacity : 0.2;
	}
}