html {
	image-rendering: optimizeQuality; 
	-ms-interpolation-mode:bicubic;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

body {
	font-family: 'Roboto', sans-serif;
	margin: 0px;
	padding: 0px;
	width: 100%;
}

#Header {
	width: 100%;
	padding: 0px;
	margin: 0px;
}

#Header .Menu {
	display: block;
	background-color: rgba(255,255,255,1);
	width: 100%;
	min-height: 72px;
}

#Header .Menu:hover {
	background-color: rgba(255,255,255,1);
}

#Header .Panel {
	padding: 1vw 10% 1vw 10%;
}

#Header .Background {
	display: block;
	position: relative;
	top:0px;
	left:0px;
	width: 100%;
	height: auto;
}

#Header .Photo1 {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: auto;
}

#Header .Photo2 {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: auto;
}

#Header .Photo2 {
	animation-name: fade;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: 15s;
	animation-direction: alternate;
}

@keyframes fade {
	0% {
		opacity: 1;
	}
	25% {
		opacity: 1;
	}
	75% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}

#Header .Attract {
	display: block;
	position: absolute;
	top: 72px;
	left: 0px;
	width: 100%;
	z-index: 100;
	padding: 0px;
}

#Header .Attract h1 {
	font-family: 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: 4vw;
	font-style: italic;
	letter-spacing: -0.1vw;
	color: white;
	background-color: rgba(165,17,67,0.8);
	display: inline-block;
	padding: 0.8vw 3vw 0.8vw 10%;
	-webkit-border-top-right-radius: 15px;
	-webkit-border-bottom-right-radius: 15px;
	-moz-border-radius-topright: 15px;
	-moz-border-radius-bottomright: 15px;
	border-top-right-radius: 15px;
	border-bottom-right-radius: 15px;
}

#Header .Leads h2 {
	display: block;
	position: relative;
	text-align: center;
	top: 40vw;
	font-family: 'PT Sans', sans-serif;
	font-weight: 500;
	font-size: 2vw;
	font-style: italic;
	letter-spacing: 0vw;
	color: white;
	background-color: rgba(165,17,67,0.8);
	display: inline-block;
	padding: 0.8vw 10% 0.8vw 10%;
}

.article {
	clear: both;
	font-family:'Roboto',sans-serif;
	font-size: calc(12px + 0.8vw);
	font-weight: 500;
	line-height: 150%;
	letter-spacing: 0px;
	padding: 0px 10% 0px 10%;
}

.article h1,
.article h2, 
.article h3, 
.article h4 {
	font-family: 'Roboto', sans-serif;
	line-height: 120%;
}

.article blockquote {
	font-family: 'PT Sans', sans-serif;
	font-size: calc(11px + 1.0vw);
	float: right;
	max-width: 22vw;
	margin: 0px;
	padding: 0px 0px 4vw 4vw;
	font-weight: 400;
	font-style: normal;
	text-align: left;
}

.article strong {
	font-weight: 600;
}

#gallery {
	padding-left: 10%;
	padding-right: 10%;
	font-size: calc(12px + 0.8vw);
	font-weight: 500;
	line-height: 150%;
	letter-spacing: 0px;

}

.grid-container {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	grid-gap: 1px 1px;
	grid-template-areas: "left1 right1" "left2 right2";
}

.top { grid-area: top; }

.left1 { grid-area: left1; }

.right1 { grid-area: right1; padding: 3vw;}

.left2 { grid-area: left2; padding: 3vw;}

.right2 { grid-area: right2; }

.bottom { grid-area: bottom; }

.vignette {
	box-shadow: inset 0 0 100px black;
}


.image-container {
	position: relative;
	overflow:hidden;
}

.image-container:after {
	content: '';
	position: absolute;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
	width: 120%;
	padding-bottom: 120%;
	box-shadow: inset 0px 0px 150px 60px rgba(0,0,0,0.8);
	border-radius: 50%;
}

.txt1 {
	padding: 0.5vw 5vw 0.5vw 5vw;
	margin: 0px;
	font-family: 'Varta', sans-serif;
	font-size: calc(12px + 0.8vw);
	font-weight: 400;
	line-height: 150%;
	letter-spacing: 0px;
}

.lightbox {
	position: relative;
	overflow: hidden;
}

.lightbox:after {
	content: '';
	position: absolute;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
	width: 150%;
	padding-bottom: 150%;
	box-shadow: inset 0px 0px 10vw 4vw rgba(0,0,0,0.2);
	border-radius: 50%;
}

.image-box {
	position: relative;
	margin: auto;
	overflow: hidden;
}

.image-box img {
	max-width: 100%;
	transition: all 0.3s;
	display: block;
	width: 100%;
	height: auto;
	transform: scale(1);
}

.image-box:hover img {
	transform: scale(1.1);
	filter: brightness(40%);
}

.message {
	position: absolute;
	z-index: 200;
	top: 0px;
	left: 0px;
	display: block;
	color: white;
	background-color: transparent;
	text-align: center;
	width: 75%;
	height: 75%;
	padding: 12.5%;
}

.message p {
	font-size: calc(14px + 0.6vw);
	font-weight: 500;
	letter-spacing: 0px;
	line-height: 120%;
}

.message span {
	display: block;
	font-family: 'PT Sans', sans-serif;
	font-size: calc(14px + 0.9vw);
	font-weight: 700;
	letter-spacing: -0.01vw;
	line-height: 100%;
	text-shadow: 0.5vw 0.5vw 2vw rgba(0,0,0,0.95);
}

.fadein {
	transition: all 0.5s ease;
	opacity: 0;
	top: 50px;
}


.fadein:hover {
	opacity: 1;
	top: 0px;
}


#Panel {
	font-family: 'PT Sans', sans-serif;
	font-size: calc(11px + 1.0vw);
}

#Panel .Instep {
	padding: 3vw 3vw 3vw 10%;
}

#Panel blockquote {
	margin: 0px;
	padding: 0px 0px 0vw 0vw;
	font-weight: 400;
	font-style: normal;
	text-align: left;
	line-height: 150%;
}


#Panel .Vignette {
	box-shadow: inset 0 0 100px rgba(20,20,20,0.2);
}

#Panel .Gradient {
	background: -moz-linear-gradient(top,  rgba(230,230,235,0.95) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top,  rgba(230,230,235,0.95) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom,  rgba(230,230,235,0.95) 0%,rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6e6e6eb', endColorstr='#00000000',GradientType=0 );
}

#Header .Attract2 {
	display: block;
	position: absolute;
	top: 72px;
	left: 0px;
	width: 100%;
	z-index: 100;
	padding: 0px;
	text-align: center;
}

#Header .Attract2 h1 {
	font-family: 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: 10vw;
	letter-spacing: -0.1vw;
	text-transform: uppercase;
	color: white;
	padding: 0px 15% 0px 15%;
	text-shadow: 0vw 0vw 4vw rgba(0,0,0,1);
	mix-blend-mode: screen;
	margin-bottom: 0.5vw;
	line-height: 8vw;
}

#Header .Attract2 .Rubberstamp {
	display: inline-block;
	padding: 0.3vw 4vw 0.7vw 4vw;
	font-family: 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: 8vw;
	letter-spacing: -0.1vw;
	text-transform: uppercase;
	color: white;
	background: darkred;
	mix-blend-mode: multiply;
	transform: rotate(-5deg); 
	text-shadow: 0.5vw 0.5vw 2vw rgba(255,64,64,0.95); 
	-webkit-border-radius: 1vw;
	-moz-border-radius: 1vw;
	border-radius: 1vw;
}

#Header .Backphoto1 {
	background-image:url(/images/home/supascootas.jpg);
}

#Header .Backphoto2 {
	background-image:url(/images/home/diblasi-caravan.jpg);
}

@keyframes wiggle {
    0% { transform: rotate(-5deg); }
   80% { transform: rotate(-5deg); }
   85% { transform: rotate(0deg); }
   95% { transform: rotate(-10deg); }
  100% { transform: rotate(-5deg); }
}

.wiggle {
	display: inline-block;
	animation: wiggle 1.5s infinite;
}

a.button {
	display: inline-block;
	padding: 0.35em 1.2em;
	border: 0.1em solid #FFFFFF;
	margin: 0 0.3em 0.3em 0;
	border-radius: 0.12em;
	box-sizing: border-box;
	text-decoration: none;
	font-family:'Roboto',sans-serif;
	font-weight: 300;
	letter-spacing: 0px;
	color: #FFFFFF;
	text-align: center;
	transition: all 0.2s;
	background-color: rgba(0,0,0,0.5);
}

a.button:hover {
	color: #000000;
	background-color: #FFFFFF;
}

@media all and (max-width:30em){
	a.button {
		display: block;
		margin: 0.4em auto;
	}
}

.Overmessage {
	display: block; 
	position: absolute; 
	z-index: 300; 
	bottom: 2.5vw; 
	left: 0px; 
	width: 100%;
	background-color: transparent; 
	color: white;
	text-align: center;
}

.Overmessage a.button {
	display: inline-block;
	padding: 0.35em 1.2em;
	border: 0px;
	margin: 0px;
	padding: 0.6vw 2vw 0.7vw 2vw;
	border-radius: 0.12em;
	box-sizing: border-box;
	text-decoration: none;
	color: #000000;
	background-color: #FFFFFF;
	text-align: center;
	transition: all 0.2s;
	font-family: 'PT Sans', sans-serif;
	font-size: calc(14px + 1vw);
	font-weight: 800;
	letter-spacing: -0.01vw;
	line-height: 100%;
}

.Overmessage a.button:hover {
	color: #FFFFFF;
	background-color: rgba(0,0,0,0.5);
}

.BoxPad {
	padding: 0.5vw;
}

@keyframes cf4FadeInOut {
	0% {
		opacity:1;
	}
	17% {
		opacity:1;
	}
	25% {
		opacity:0;
	}
	92% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}

#cf4a img:nth-of-type(1) {
	animation-delay: 36s;
}
#cf4a img:nth-of-type(2) {
	animation-delay: 24s;
	position: absolute;
}
#cf4a img:nth-of-type(3) {
	animation-delay: 12s;
	position: absolute;
}
#cf4a img:nth-of-type(4) {
	animation-delay: 0;
	position: absolute;
}

#cf4a {
	display: block;
	position: relative;
	max-width: 100%;
	width: 100%;
	height: auto;
	margin: 0 auto;
}

#cf4a img {
	-webkit-animation-name: cf4FadeInOut;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 48s;
	-moz-animation-name: cf4FadeInOut;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 48s;
	-o-animation-name: cf4FadeInOut;
	-o-animation-timing-function: ease-in-out;
	-o-animation-iteration-count: infinite;
	-o-animation-duration: 48s;
	animation-name: cf4FadeInOut;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: 48s;
}

#cf4a img {
	left: 0;
	max-width: 100%;
	width: 100%;
	height: auto;
	vertical-align: middle;
	border: 0;
}

#Header .pure-g {
	letter-spacing: 0px;;
}

#Header .MenuPanel {
	z-index: 999;
	background-color: transparent;
	padding: 0vw 10% 0vw 10%;
	font-family:'Roboto',sans-serif;
	font-weight: 600;
}

#Header .Upper {
	text-transform: normal;
}

.Telephone {
	font-family: 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: calc(14px + 3.2vw);
	font-weight: 800;
	letter-spacing: -0.01vw;
	line-height: 100%;
	white-space: nowrap;
}

.SocialMedia {
	text-align: center;
}

.SocialMedia img {
	display: inline-block; 
	padding: 0px 4px 0px 0px;
}

.centered {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	text-align: left;
}

#Footer {
	margin-top: 0px;
	margin-bottom: 0px;
	background-color: rgb(32,32,32);
	color: rgb(235,235,235);
	font-size: calc(11px + 0.1vw);
	font-weight: 400;
	letter-spacing: 0px;
	text-align: center;
	padding-bottom: 7.5vw;
}

#Footer .Copyright {
	padding: 1rem 25% 0px 25%;
}

#Footer p {
	line-height: 120%;
	text-transform: uppercase;
	margin-top: 0px;
	margin-bottom: 0px;
}

#Footer .Copyright a {color:rgb(235,235,235);}

@media only screen and (max-width: 767px) {
	.ResizeLogo {
		text-align: center;
	}
	.ResizePhone {
		text-align: center;
		padding-top: 2vw;
		padding-bottom: 1vw;
	}
}

@media only screen and (min-width: 768px) {
	.ResizePhone {
		padding-top: 0.2vw;
		text-align: right;
	}
}

.CallToAction {
	font-family:'Roboto',sans-serif;
	font-weight: 600;
}

.CallToAction button, 
.CallToAction select, 
.CallToAction input {
	font-size: 1rem;
}

.CallToAction button {
	margin-top: 0.5vw;
}

.CallToAction strong {
	font-weight: 800;
}


.ClipRecaptcha {
	display: block; 
	overflow: hidden;
}

@media only screen and (min-width: 768px) {
	.ClipRecaptcha {
		width: 20vw; 
	}
}

span.nogap {
	white-space: nowrap;
}

.AlignLeft { text-align: left; }
.AlignCenter { text-align: center; }
.AlignRight { text-align: right; }

.HeaderContainer { display: block; }

.HeaderTag {
	width: 100%; 
	padding-left: 10%; 
	padding-right: 10%; 
	padding-top: 1vw;
}

#Header .Phone {
	font-weight: 600; 
	font-family: 'PT Sans', sans-serif;
}

.pure-menu-children {
	-webkit-box-shadow: 3px 3px 5px -2px rgba(0,0,0,0.75);
	-moz-box-shadow: 3px 3px 5px -2px rgba(0,0,0,0.75);
	box-shadow: 3px 3px 5px -2px rgba(0,0,0,0.75);
}

.Undermenu {
	background: #F0F0F0;
	background: -webkit-linear-gradient(top, #F0F0F0, #FFFFFF);
	background: -moz-linear-gradient(top, #F0F0F0, #FFFFFF);
	background: linear-gradient(to bottom, #F0F0F0, #FFFFFF);
}

.article ul, 
.Bullets {
  list-style-image: url('/images/home/logo-bullet.png');
}

.article li {
	margin-bottom: 1.5vw;
}

#Panel a:link, 
.article a:link { 
	color: rgb(117,48,64); 
}

#Panel a:visited, 
.article a:visited { 
	color: rgb(29,73,148); 
}

#Panel a:hover, 
.article a:hover { 
	color: rgb(32,61,136); 
}

.zoom {
	overflow:hidden;
	image-rendering: auto;
}

.zoom img {
	-webkit-transition: all 0.5s ease; /* Safari and Chrome */
	-moz-transition: all 0.5s ease; /* Firefox */
	-ms-transition: all 0.5s ease; /* IE 9 */
	-o-transition: all 0.5s ease; /* Opera */
	transition: all 0.5s ease;
	position:relative;
	z-index: 0;
}

.zoom:hover img {
	-webkit-transform:scale(1.1); /* Safari and Chrome */
	-moz-transform:scale(1.1); /* Firefox */
	-ms-transform:scale(1.1); /* IE 9 */
	-o-transform:scale(1.1); /* Opera */
	 transform:scale(1.1);
}

.fullwidth { width: 100%; }

#Gallery {
	float: right;
	width: 50vw;
	max-width: 50%;
	padding-left: 2vw;
	padding-right: 0px;

}

#GalleryPhoto {
	width: 100%;

}




.TableSpec {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
    background-color: transparent;
    border-spacing: 0;
    border-collapse: collapse;
    display: table;
    box-sizing: border-box;
    border-spacing: 2px;
    border-color: grey;
}

.table-striped>tbody>tr:nth-of-type(odd) {
	background-color: #f9f9f9;
}

.table-bottom-gap {
	margin-bottom: 5vw;
}


#FooterBase.Footers {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 600 !important;
	font-size:calc(10px + 0.5vw);
	position: fixed;
	left: 0px;
	right: 0px;
	margin: 0px;
	padding: 0px;
	bottom: 0px;
	z-index: 9999;
}

#FooterBase.Footers p {
	display: block;	
	font-family: inherit;
	letter-spacing: 0px;
	font-style: normal;
	font-weight: 400;

	margin-block-start: 0em;
	margin-block-end: 0em;
}

.Footers .FtRed a {
	color: yellow;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px dotted yellow;
}

.Footers .FtGreen a {
	color: darkgreen;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px dotted darkgreen;
}

.Footers .FtAmber a {
	color: brown;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px dotted brown;
}

.Footers .FtBlue a {
	color: darkblue;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px dotted darkblue;
}

.Footers .FtDark a {
	color: yellow;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px dotted yellow;
}

#FooterBase.Footers a:hover {
	color: white;
	font-weight: 600;
	border-bottom: 1px dotted white;
}

.Footers .FtDefault {
	display: none;
}

.Footers .FtRed, .Footers {
	color: white;
	background-color: #f90017a3;
}

.Footers .FtGreen, .Footers {
	color: white;
	background-color: #66ff66a3;
}

.Footers .FtAmber, .Footers {
	color: white;
	background-color: #ffff00a3;
}

.Footers .FtBlue, .Footers {
	color: white;
	background-color: #7ecfe7a3;
}

.Footers .FtDark, .Footers {
	color: white;
	background-color: #202226a3;
}

.Footers .FtSpacing {
	padding: 0.6rem 2rem 0.6rem 2rem; 
}

.Footers .FtCancel {
	font-size: 11px;
	text-transform: uppercase;
	text-align: right;
	display: inline-block;
	float: right;
	padding: 6px 12px 6px 24px;
	border: 1px solid white;
	border-radius: 5px;
	margin-left: 20px;
	vertical-align: top;
	margin-top: 0.2rem;
	background-image: url(/images/no.png);
	background-repeat: no-repeat;
	background-position: 5px 4px;
}

.FtCancel:hover {
	background-color: white;
	color: black;
}

.Footers .FtText {
	display: inline-block; 
	width: 75%
	vertical-align: top;
	padding-top: 0.4rem;
	padding-bottom: 0.4rem;
}

.Footers .Clear {
	clear: both;
}

#moretext{
	display: none;
}

.toggleBtn {
	text-transform: uppercase;
	font-size:calc(10px + 0.5vw);
    background-color: #0078e7;
    color: #fff;
    padding: 0.5vw 1vw 0.5vw 1vw;
    border: 0px;
    cursor: pointer;
}

#Footer p.copyright a {
	color:white;
	text-decoration:none;

}