/*
Theme name: Greencross Vets
Description: Custom Theme
*/

/*
	Source post-css styles are located in the postcss directory.
	The compiled bundle is in assets/bundle.css; The README.md
	file contains instructions how to get the compilation
	process up & running.

	If you need to make a quick fix, feel free to add CSS
	below this comment. It will override bundle.css styles.
*/

#gxv-booking { display: flex; flex-wrap: wrap;}
#gxv-booking-logo img { max-width: 260px; transform: translateY(-5px); }
#gxv-booking-link a {
	margin-right: 0;
    min-width: 180px;
    height: 50px;
    line-height: 50px;
    font-size: 11px;
    color: #fff;
    background-color: #00A651;
    font-family: Montserrat,sans-serif;
    font-weight: 700;
    appearance: none;
    border: none;
    border-radius: 25px;
    text-transform: uppercase;
    letter-spacing: 0;
    transition: .2s;
    display: inline-flex;
    justify-content: center;
    text-decoration: none;
	margin: 0 10px;
}
#gxv-booking-link a:hover {
	background: #001939;
}
#gxv-booking-link, #gxv-booking-logo {
	display: flex;
    align-items: center;
    flex: 1;
    justify-content: center;
}

@media(min-width: 1023px){
	.slider-intro .slider__slide-content h2 { font-size: 72px;  }
}

.slider-intro .slider__slide-content h2 { line-height: 1.1; color: #fff; }

.intro.intro--hpp .btn { margin-top: 25px; margin-left: 70px; }
.slider-intro--clinic .btn { margin-top: 25px; }
.bio__image { min-height: 430px; }
.intro--promise .btn { display: inline-block; vertical-align: middle; min-width: 260px; height: 42px; padding: 0 20px; border: 2px solid #00a651; background: transparent; text-decoration: none; font-size: 10px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-weight: 900; line-height: 40px; color: #006a56; text-align: center; cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; border-radius: 27px; letter-spacing: 0.2em; color: #fff; }
.intro--promise .btn:hover { background: #00a651; }
.blog .section-news { padding-top: 150px; }

.map-holder { position: relative; }
.loader-holder { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); pointer-events: none; opacity: 0; transition: opacity .3s; }
.loading .loader-holder { opacity: 1; }
.loader-holder .cssload-thecube { top: 50%; transform: translateY(-50%) rotateZ(45deg) !important; }
#map .gmnoprint[style="margin: 10px; z-index: 0; position: absolute; cursor: pointer; left: 0px; top: 0px;"] { bottom: 5px !important; top: initial !important; }
#map div[style="margin-left: 5px; margin-right: 5px; z-index: 1000000; position: absolute; left: 0px; bottom: 0px;"]  { left: 130px !important; bottom: 10px !important; }

.instafeed .instafeed__entry::before{left: 50%; top: 50%; width: 200px; height: 200px; transform: translate(-50%, -50%);}
.instafeed .instafeed__entry p{font-size: 21px !important;}
.instafeed .instafeed__entry i { width: 70px; height: 70px;}

.cssload-thecube {
	width: 73px;
	height: 73px;
	margin: 0 auto;
	margin-top: 49px;
	position: relative;
	transform: rotateZ(45deg);
		-o-transform: rotateZ(45deg);
		-ms-transform: rotateZ(45deg);
		-webkit-transform: rotateZ(45deg);
		-moz-transform: rotateZ(45deg);
}
.cssload-thecube .cssload-cube {
	position: relative;
	transform: rotateZ(45deg);
		-o-transform: rotateZ(45deg);
		-ms-transform: rotateZ(45deg);
		-webkit-transform: rotateZ(45deg);
		-moz-transform: rotateZ(45deg);
}
.cssload-thecube .cssload-cube {
	float: left;
	width: 50%;
	height: 50%;
	position: relative;
	transform: scale(1.1);
		-o-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
}
.cssload-thecube .cssload-cube:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #00A651;
	animation: cssload-fold-thecube 2.76s infinite linear both;
		-o-animation: cssload-fold-thecube 2.76s infinite linear both;
		-ms-animation: cssload-fold-thecube 2.76s infinite linear both;
		-webkit-animation: cssload-fold-thecube 2.76s infinite linear both;
		-moz-animation: cssload-fold-thecube 2.76s infinite linear both;
	transform-origin: 100% 100%;
		-o-transform-origin: 100% 100%;
		-ms-transform-origin: 100% 100%;
		-webkit-transform-origin: 100% 100%;
		-moz-transform-origin: 100% 100%;
}
.cssload-thecube .cssload-c2 {
	transform: scale(1.1) rotateZ(90deg);
		-o-transform: scale(1.1) rotateZ(90deg);
		-ms-transform: scale(1.1) rotateZ(90deg);
		-webkit-transform: scale(1.1) rotateZ(90deg);
		-moz-transform: scale(1.1) rotateZ(90deg);
}
.cssload-thecube .cssload-c3 {
	transform: scale(1.1) rotateZ(180deg);
		-o-transform: scale(1.1) rotateZ(180deg);
		-ms-transform: scale(1.1) rotateZ(180deg);
		-webkit-transform: scale(1.1) rotateZ(180deg);
		-moz-transform: scale(1.1) rotateZ(180deg);
}
.cssload-thecube .cssload-c4 {
	transform: scale(1.1) rotateZ(270deg);
		-o-transform: scale(1.1) rotateZ(270deg);
		-ms-transform: scale(1.1) rotateZ(270deg);
		-webkit-transform: scale(1.1) rotateZ(270deg);
		-moz-transform: scale(1.1) rotateZ(270deg);
}
.cssload-thecube .cssload-c2:before {
	animation-delay: 0.35s;
		-o-animation-delay: 0.35s;
		-ms-animation-delay: 0.35s;
		-webkit-animation-delay: 0.35s;
		-moz-animation-delay: 0.35s;
}
.cssload-thecube .cssload-c3:before {
	animation-delay: 0.69s;
		-o-animation-delay: 0.69s;
		-ms-animation-delay: 0.69s;
		-webkit-animation-delay: 0.69s;
		-moz-animation-delay: 0.69s;
}
.cssload-thecube .cssload-c4:before {
	animation-delay: 1.04s;
		-o-animation-delay: 1.04s;
		-ms-animation-delay: 1.04s;
		-webkit-animation-delay: 1.04s;
		-moz-animation-delay: 1.04s;
}



@keyframes cssload-fold-thecube {
	0%, 10% {
		transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-o-keyframes cssload-fold-thecube {
	0%, 10% {
		-o-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-o-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-o-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-ms-keyframes cssload-fold-thecube {
	0%, 10% {
		-ms-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-ms-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-ms-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-webkit-keyframes cssload-fold-thecube {
	0%, 10% {
		-webkit-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-webkit-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-webkit-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}

@-moz-keyframes cssload-fold-thecube {
	0%, 10% {
		-moz-transform: perspective(136px) rotateX(-180deg);
		opacity: 0;
	}
	25%,
				75% {
		-moz-transform: perspective(136px) rotateX(0deg);
		opacity: 1;
	}
	90%,
				100% {
		-moz-transform: perspective(136px) rotateY(180deg);
		opacity: 0;
	}
}
body {
    background: #f5f5f5;
}

.slider-intro .slider__slide {
	background-color: #001939 !important;
}