body {
    font-size: 100%;
    margin: 0;
    font-size: calc(1em + 9 * (100vw - 320px) / 1600);
    font-size: -webkit-calc(100% + 9 * (100vw - 320px) / 1600);
    font-family: 'Fjalla One', sans-serif;
    /* background: black url("/siteart/hero-img-5.jpg") no-repeat center center; */
    background-size: cover;
}
html, body {height:100%;}

.content-body {
    background: black ;
}

.home-div {
    height:auto; min-height:100%;
    position: relative;
    width: 100%; background:#333;
}


/* SLIDESHOW */
article {width:100%; padding:60px 0; position:relative;}

.page-content {width:100%; position:relative; display:block; z-index:9;}

.cycle-slideshow {width:100%; height:100%; position:absolute; top:0; left:0; overflow:hidden; z-index:3;}
.cycle-slideshow .slide {width:100%; height:100%; position:absolute; top:0; left:0; background-size:cover; background-repeat:no-repeat; background-position:center;}

.slideshow, .slideshow:after {
    position:absolute;
    width:100%;
    height:100%;
    /* padding: 20% 0; */
    margin: 0;
    top:0px;
    left:0px;
    z-index:0;
    overflow:hidden;
}
.slideshow:after {content:'';}
ul.slideshow {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
ul.slideshow li {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.slideshow li span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
	-webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 36s linear infinite 0s;
    -moz-animation: imageAnimation 36s linear infinite 0s;
    -o-animation: imageAnimation 36s linear infinite 0s;
    -ms-animation: imageAnimation 36s linear infinite 0s;
    animation: imageAnimation 36s linear infinite 0s;
}
.slideshow li:nth-child(1) span { background-image:url('../siteart/hero-img-a.jpg');}
.slideshow li:nth-child(2) span {
    background-image:url('../siteart/hero-img-a.jpg');
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
.slideshow li:nth-child(3) span {
    background-image:url('../siteart/hero-img-b.jpg');
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.slideshow li:nth-child(4) span {
    background-image:url('../siteart/hero-img-b.jpg');
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}

.slideshow li:nth-child(2) div {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
.slideshow li:nth-child(3) div {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.slideshow li:nth-child(4) div {
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}
/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -webkit-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -webkit-transform: scale(1.05);
	    -webkit-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -webkit-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -webkit-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-moz-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -moz-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -moz-transform: scale(1.05);
	    -moz-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -moz-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -moz-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-o-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -o-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -o-transform: scale(1.05);
	    -o-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -o-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -o-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-ms-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -ms-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -ms-transform: scale(1.05);
	    -ms-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -ms-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -ms-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation { 
	0% {
	    opacity: 0;
	    -webkit-transform: translateY(200px);
	}
	8% {
	    opacity: 1;
	    -webkit-transform: translateY(0px);
	}
	17% {
	    opacity: 1;
	    -webkit-transform: scale(1);
	}
	19% { opacity: 0 }
	25% {
	    opacity: 0;
	    -webkit-transform: scale(10);
	}
	100% { opacity: 0 }
}
@-moz-keyframes titleAnimation { 
	0% {
	    opacity: 0;
	    -moz-transform: translateY(200px);
	}
	8% {
	    opacity: 1;
	    -moz-transform: translateY(0px);
	}
	17% {
	    opacity: 1;
	    -moz-transform: scale(1);
	}
	19% { opacity: 0 }
	25% {
	    opacity: 0;
	    -moz-transform: scale(10);
	}
	100% { opacity: 0 }
}
@-o-keyframes titleAnimation { 
	0% {
	    opacity: 0;
	    -o-transform: translateY(200px);
	}
	8% {
	    opacity: 1;
	    -o-transform: translateY(0px);
	}
	17% {
	    opacity: 1;
	    -o-transform: scale(1);
	}
	19% { opacity: 0 }
	25% {
	    opacity: 0;
	    -o-transform: scale(10);
	}
	100% { opacity: 0 }
}
@-ms-keyframes titleAnimation { 
	0% {
	    opacity: 0;
	    -ms-transform: translateY(200px);
	}
	8% {
	    opacity: 1;
	    -ms-transform: translateY(0px);
	}
	17% {
	    opacity: 1;
	    -ms-transform: scale(1);
	}
	19% { opacity: 0 }
	25% {
	    opacity: 0;
	    -webkit-transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	8% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	17% {
	    opacity: 1;
	    transform: scale(1);
	}
	19% { opacity: 0 }
	25% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
/* Show at least something when animations not supported */
.no-cssanimations .slideshow li span{
	opacity:1;
}
.hero-spacer {padding:19% 0;}


.nav {position:relative; z-index:9; background:#fff;}

.nav-ul {
    padding: 0;
    margin: 0;
    border-bottom: 3px solid #ffc700;
    text-align: center;
}

.nav-li {
    display: inline-block;
    padding: 0.25em 0.5em;
    border-left: 1px solid #ffc700;
    border-right: 2px solid #ffc700;
}

.nav-li-lifts,
.nav-li-handlers,
.nav-li-contact,
.nav-li-about {
    display: none;
}

.nav-li-mobile {
    display: inline-block;
}

.mobile-nav-li-home,
.mobile-nav-li-yard,
.mobile-nav-li-lifts,
.mobile-nav-li-handlers,
.mobile-nav-li-about,
.mobile-nav-li-contact {
    display: block;
    margin-bottom: 0.25em;
}

.mobile-nav-a {
    color: #FFC72D;
}

@media screen and (min-width: 405px) {

    .nav-li-home,
    .nav-li-yard,
    .nav-li-lifts {
        display: inline-block
    }

    .mobile-nav-li-home,
    .mobile-nav-li-yard,
    .mobile-nav-li-lifts {
        display: none;
    }

}

@media screen and (min-width: 660px) {

    .nav-li-home,
    .nav-li-yard,
    .nav-li-lifts,
    .nav-li-handlers {
        display: inline-block
    }

    .mobile-nav-li-home,
    .mobile-nav-li-yard,
    .mobile-nav-li-lifts,
    .mobile-nav-li-handlers {
        display: none;
    }

}

@media screen and (min-width: 750px) {

    .nav-li-home,
    .nav-li-yard,
    .nav-li-lifts,
    .nav-li-handlers,
    .nav-li-about,
    .nav-li-contact {
        display: inline-block
    }

    .mobile-nav-li-home,
    .mobile-nav-li-yard,
    .mobile-nav-li-lifts,
    .mobile-nav-li-handlers,
    .mobile-nav-li-about,
    .mobile-nav-li-contact {
        display: none;
    }

    .nav-li-mobile {
        display: none;
    }
}

.nav-li:first-child {
    border-left: 3px solid #ffc700;
}

.nav-li:last-child {
    border-right: 3px solid #ffc700;
}

.nav-a {
    color: #ffc700;
    text-decoration: none;
    font-size: 1em;
    text-transform: uppercase;
    text-shadow: 2px 2px 2px #111;
}

.nav-a:hover {
    color: white;
}

.tingle-modal-box__content {
    border: 3px solid white;
    background-color: black;
}

.tingle-modal__close {
    background-color: black;
}

.header {
    background: #153540 url("/siteart/bg.jpg") no-repeat center center;
    background-size: cover;
    text-align: center;
    padding: 0 0 0.25em 0;
}

.header-h1 {
    color: white;
    text-transform: uppercase;
    font-size: 1.602em;
    font-family: 'Fjalla One', sans-serif;
    margin: 1em 0 0.5em 0;
}

.header-h2 {
    color: white;
    text-transform: uppercase;
    font-size: 1.125em;
    font-family: 'Fjalla One', sans-serif;
    margin: 1em 0 0.5em 0;
}

.home-content {
    margin-top: 1.5em;
}


.home-img {
    width: 20em;
    display: block;
    margin: 0 auto 2.5em auto;
}

.home-content-ul {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}

.home-h1 {
    color: white;
    color: #ffc700;
    text-transform: uppercase;
    font-size: 1.602em;
    font-family: 'Fjalla One', sans-serif;
    margin: 0 0 0.5em 0;
    text-shadow: 2px 2px 2px #111;
}

.home-h2 {
    color: white;
    text-transform: uppercase;
    font-size: 1.266em;
    font-family: 'Fjalla One', sans-serif;
    margin: 0 0 0.5em 0;
    text-shadow: 2px 2px 2px #111;
}

.home-h3 {
    color: white;
    font-family: 'Roboto Condensed', sans-serif;
    font-style: italic;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.889em;
    margin: 0;
    text-shadow: 2px 2px 2px #111;
}

.home-h4 {
    margin: 0 auto 2em auto;
}

.home-h4-a {
    color: white;
    font-size: 0.889em;
    font-family: 'Roboto Condensed', sans-serif;
    font-style: italic;
    text-decoration: none;
    text-shadow: 2px 2px 2px #111;
}

.home-inv-btn {
    color: black;
    background-color: #ffc700;
    font-size: 1.424em;
    font-family: 'Fjalla One', sans-serif;
    text-transform: uppercase;
    text-align: center;
    padding: 0.5em 2em;
    display: inline-block;
    margin: 0 0 5em 0;
    text-decoration: none;
}

.home-inv-btn:hover {
    cursor: pointer;
    text-decoration: none;
}


.copyright {
    width: 100%;
    text-align: center;
    color: white;
    background-color: black;
     position:relative; bottom:0;
}

.footer .copyright {
    position: relative;
    width: 100%;
    text-align: center;
    color: white;
}
.copyright-p {
    font-size: 0.555em;
    width: 28em;
    margin: 0 auto;
    font-weight: 300;
    font-style: italic;
    padding: 15px 0;
    font-family: 'Roboto Condensed', sans-serif;
}

.full-search-div {
    padding: 1em 0 0 0;
    text-align: left;
}

.full-tops-select-box {
    display: inline-block;
    vertical-align: top;
    width: 97%;
    margin: 0 1%;
    border: none;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 0.79em;
    text-transform: uppercase;
    color: #404040;
    margin-bottom: 1em;
    padding: 0.555em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

@media screen and (min-width: 1010px) {
    .full-tops-select-box {
        width: 23%;
    }
}

.full-search {
    display: inline-block;
    width: 100%;
}

@media screen and (min-width: 1010px) {
    .full-search {
        width: 75%;
    }
}

.full-input {}

.full-form-top-row {
    width: 100%;
}

.full-form-input {
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    width: 97%;
    margin: 0 1%;
    border: none;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 0.79em;
    text-transform: uppercase;
    color: #404040;
    margin-bottom: 1em;
    padding: 0.555em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

@media screen and (min-width: 650px) {
    .full-form-input {
        width: 31%;
    }
}

.full-form-mid-row {
    width: 100%;
}

@media screen and (min-width: 650px) {
    .full-form-mid-row {
        width: 132.75%;
        margin-left: -33.3%;
    }
}

@media screen and (min-width: 1010px) {
    .full-form-mid-row {
        width: 132.6%;
        margin-left: -33.3%;
    }
}

.full-form-mid-input {
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    width: 97%;
    margin: 0 1%;
    background-color: white;
    border: none;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 0.79em;
    text-transform: uppercase;
    color: #404040;
    margin-bottom: 1em;
    padding: 0.555em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

@media screen and (min-width: 650px) {
    .full-form-mid-input {
        width: 23%;
    }
}

.full-form-bottom-row {
    margin-left: 0;
}

@media screen and (min-width: 650px) {
    .full-form-bottom-row {
        margin-left: -33.3%;
    }
}

::placeholder {
    color: #404040;
}

.full-search-button {
    background-color: #FFC72D;
    color: black;
    width: 97%;
    margin: 0 1% 1em 1%;
    border: none;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 0.79em;
    text-transform: uppercase;
    padding: 0.555em;
}

@media screen and (min-width: 650px) {
    .full-search-button {
        width: 72.75%;
    }
}

@media screen and (min-width: 1010px) {
    .full-search-button {
        width: 23%;
    }
}

.full-search-button:hover {
    cursor: pointer;
}

.about {
    background: white;
}

.about-div {
    width: 98%;
    margin: 0 auto;
    padding: 1.5em 0 1.5em 0;
}

@media screen and (min-width: 650px) {
.about-div {
    width: 35em;
}
}

.about-h3 {
    margin: 0 0 1em 0;
    color: black;
}

.about-p {
    margin: 0 0 2em 0;
    color: black;
}

/** CONTACT **/
.content-body-div {
    padding: 1em 0;
}

.contact-form {
    width: 96%;
    margin: 0 auto;
}

.contact-form-body {}

.contact-input {
    display: block;
    width: 96%;
    border: none;
    border-bottom: 1px solid #FFC72D;
    padding: 0.5em;
    box-sizing: border-box;
    margin: 0 auto 1em auto;
    font-size: 0.79em;
    font-family: 'Oswald', sans-serif;
    background-color: #f2f2f2;
}

.contact-textarea {
    font-family: 'Oswald', sans-serif;
    width: 96%;
    margin: 0 auto;
    box-sizing: border-box;
    font-size: 0.79em;
    margin-top: 1em;
    display: block;
    padding: 0.5em;
    border: 1px solid #FFC72D;
    background-color: #f2f2f2;
}

#CaptchaAnswer {
    display: block;
    width: 96%;
    border: none;
    border-bottom: 1px solid #FFC72D;
    padding: 0.5em;
    box-sizing: border-box;
    margin: 0 auto 1em auto;
    font-size: 0.79em;
    font-family: 'Oswald', sans-serif;
    max-width: 180px;
    background-color: #f2f2f2;
}

@media screen and (min-width: 700px) {

    .contact-input,
    .contact-textarea,
    #CaptchaAnswer {
        width: 46em;
    }
}

.CaptchaWhatsThisPanel a {
    color: #FFC72D;
}

.contact-submit {
    display: block;
    margin: 0 auto;
    border: none;
    font-family: 'Oswald';
    font-size: 1em;
    padding: 0.5em;
    text-transform: uppercase;
    background-color: #FFC72D;
    color: black;
}

.contact-div {
    text-align: center;
}

.thankyou-p {
    margin: 0;
    
}