/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

body {
  font-family: 'Roboto', sans-serif;
  background-color: #d3d3d3;
  margin: 0;
  overflow: hidden !important; }

a {
  text-decoration: none;
  cursor: pointer; }

select {
  text-align-last: center;
  text-align: center;
  -ms-text-align-last: center;
  -moz-text-align-last: center;
  outline: 0px;
  cursor: pointer; }

input {
  background: none;
  border: none;
  outline: 0px;
  cursor: pointer; }

button {
  outline: 0px; }

.section {
  text-align: center;
  height: 100%;
  width: 100%; }

.hide {
  display: none !important; }

.fp-controlArrow {
  display: none; }

#fp-nav {
  display: none; }

/*-----------------------Menu ------------------------*/
#menu li {
  display: inline-block;
  margin: 10px;
  margin-top: 20px;
  color: #000;
  background: #fff;
  background: rgba(255, 255, 255, 0.5);
  -webkit-border-radius: 10px;
  border-radius: 10px; }

#menu li.active {
  background: #666;
  background: rgba(0, 0, 0, 0.5);
  color: #fff; }

#menu li a {
  text-decoration: none;
  color: #000; }

#menu li.active a:hover {
  color: #000; }

#menu li:hover {
  background: rgba(255, 255, 255, 0.8); }

#menu li a,
#menu li.active a {
  padding: 9px 18px;
  display: block; }

#menu li.active a {
  color: #fff; }

#menu {
  position: fixed;
  top: 0;
  left: 0;
  height: 40px;
  z-index: 70;
  width: 100%;
  padding: 0;
  margin: 0; }

/*-----------------------Loading screen ------------------------*/
.loadingscreen {
  background-color: #3cbfff;
  font-size: 100%;
  margin: 0;
  text-align: center;
  position: absolute;
  z-index: 99999;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%; }

.wrapper {
  height: 50px;
  margin-top: calc(50vh - 25px);
  margin-left: calc(50vw - 100px);
  width: 180px; }

h2 {
  color: #716b6b;
  font-size: .8vw;
  font-weight: 400;
  letter-spacing: 0.01em;
  margin: 7.5vw auto;
  text-transform: uppercase; }

.vignette {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 1000px rgba(30, 80, 138, 0.71) inset; }

.vansmall {
  position: absolute;
  top: 26.5vw;
  left: 41.5vw;
  z-index: 3; }

img.vanimgsmall {
  width: 17vw; }

img.vanwheel1small {
  position: absolute;
  top: 5vw;
  left: 11.3vw;
  width: 2.1vw;
  z-index: -1; }

img.vanwheel2small {
  position: absolute;
  top: 5vw;
  left: 3.1vw;
  width: 2.1vw;
  z-index: -1; }

.loadinglogo {
  position: absolute;
  top: 13vw;
  left: 41vw;
  z-index: 3;
  width: 18vw; }
  .loadinglogo img {
    width: 100%; }

@keyframes strikes {
  from {
    left: 25px; }
  to {
    left: -80px;
    opacity: 0; } }
.strikes {
  position: absolute;
  top: 3vw; }

.strike {
  position: absolute;
  width: 11px;
  height: 1px;
  background: #fff;
  animation: strikes .2s linear infinite; }

.strike2 {
  top: 11px;
  animation-delay: .05s; }

.strike3 {
  top: 22px;
  animation-delay: .1s; }

.strike4 {
  top: 33px;
  animation-delay: .15s; }

.strike5 {
  top: 44px;
  animation-delay: .2s;
  left: 82px; }

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

h1 {
  font-weight: 100;
  color: #333;
  margin: 0;
  text-align: center;
  float: left;
  margin-top: 30px;
  margin-left: 30px; }

/*-----------------------Bullseye plugin ------------------------*/
.bsContent {
  padding-top: 100px;
  padding-bottom: 100px; }

.buttonHolder {
  margin-top: 30px;
  text-align: center; }

.button {
  display: inline-block;
  color: #999;
  text-decoration: none;
  padding: 5px 10px;
  border: 5px solid #ccc;
  border-radius: 20px; }

.button:hover {
  color: #00a3e0;
  border-color: #00a3e0; }

.cloud {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 260s linear infinite;
  z-index: -1; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.shakey {
  animation: shakey 1s linear infinite; }

@keyframes shakey {
  20%, 80% {
    transform: translate3d(0, 1px, 0); }
  40%, 60% {
    transform: translate3d(0, -2px, 0); } }
.wobble {
  animation: wobble 2s linear infinite; }

@keyframes wobble {
  20%, 80% {
    transform: translate3d(6px, 0, 0); }
  40%, 60% {
    transform: translate3d(-6px, 0, 0); } }
.floating {
  animation: floating 2s linear infinite; }

@keyframes floating {
  10%, 90% {
    transform: translate3d(-2px, 0, 0); }
  20%, 80% {
    transform: translate3d(0, 2px, 0); }
  30%, 50% {
    transform: translate3d(0, -2px, 0); }
  40%, 60% {
    transform: translate3d(-2px, 0, 0); } }
.floating2 {
  animation: floating2 3s linear infinite; }

@keyframes floating2 {
  10%, 90% {
    transform: translate3d(-2px, 0, 0); }
  20%, 80% {
    transform: translate3d(0, 2px, 0); }
  30%, 50% {
    transform: translate3d(0, -2px, 0); }
  40%, 60% {
    transform: translate3d(-2px, 0, 0); } }
.loading {
  -webkit-animation: rotation 5s infinite linear; }

@keyframes rotation {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(359deg); } }
.loading2 {
  -webkit-animation: rotation2 5s infinite linear; }

@keyframes rotation2 {
  from {
    transform: rotate(359deg); }
  to {
    transform: rotate(0deg); } }
.slide1 {
  position: relative; }

.bgsection1s1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/bgsection1s1.png);
  background-size: cover;
  z-index: 6; }

.s1sign {
  position: absolute;
  z-index: 8;
  top: 16vw;
  left: 6.5vw;
  width: 27vw; }
  .s1sign img {
    width: 100%; }

.s1signform {
  position: absolute;
  z-index: 9;
  top: 22.2vw;
  left: 8.5vw;
  width: 23vw; }

.s1signform select {
  background: none;
  border: none;
  font-size: 2.2vw;
  font-weight: 700;
  text-align: center;
  color: #fff;
  margin-bottom: 1.8vw;
  height: 3.7vw; }
  .s1signform select option {
    color: black;
    text-align: center; }

.langsign {
  position: absolute;
  z-index: 8;
  top: 17vw;
  left: 81.5vw;
  width: 9.5vw; }
  .langsign img {
    width: 100%; }

.langform {
  position: absolute;
  z-index: 9;
  top: 27.5vw;
  left: 75.7vw;
  width: 21vw; }

.langform select {
  background: none;
  border: none;
  font-size: 1vw;
  font-weight: 550;
  text-align: center;
  color: #000000;
  margin-bottom: 1.8vw;
  width: 8.7vw;
  height: 3vw; }
  .langform select option {
    color: black;
    text-align: center; }

#dropoff {
  margin-bottom: 4vw; }

#button0 {
  font-size: 2.2vw;
  font-weight: 700;
  text-align: center;
  color: #000;
  padding: 1.3vw 8vw; }

.s1van {
  position: absolute;
  z-index: 9;
  left: 43vw;
  width: 26vw;
  top: 25vw; }
  .s1van img {
    width: 100%; }

.stopsign {
  position: absolute;
  z-index: 7;
  left: 34vw;
  top: 27vw; }
  .stopsign img {
    width: 43%; }

.dirsign {
  position: absolute;
  z-index: 8;
  left: 62vw;
  top: 31vw; }
  .dirsign img {
    width: 53%; }

.locationoutput {
  margin-top: 5px; }

.cloud1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 200s linear infinite;
  z-index: 8; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.planefly {
  animation: planefly 30s linear infinite; }

@keyframes planefly {
  from {
    transform: translate3d(0px, 0, 0); }
  to {
    transform: translate3d(5900px, 0, 0); } }
.planes1 {
  position: absolute;
  z-index: 7;
  top: 3vw;
  right: 101vw;
  width: 10vw; }
  .planes1 img {
    width: 100%; }

.tadacustom {
  animation: tadacustom 2s linear infinite; }

@keyframes tadacustom {
  from {
    transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -1deg); }
  50% {
    transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 1deg); }
  100% {
    transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -1deg); } }
.logo {
  position: absolute;
  top: 2vw;
  left: 37vw;
  z-index: 7;
  width: 26vw; }
  .logo img {
    width: 18vw; }

img.kiwiana {
  width: 14vw; }

img.transportbooking {
  width: 12vw; }

.slide2 {
  position: relative; }

.background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/bgsection1s2.png);
  background-size: cover;
  z-index: -1; }

.dirsign2 {
  position: absolute;
  z-index: 6;
  left: 50vw;
  top: 21vw;
  width: 31.2vw; }
  .dirsign2 img {
    width: 100%; }

/*-----------------------VW KOMBI------------------------*/
.van {
  position: absolute;
  top: 25vw;
  left: 8vw;
  z-index: 3; }

img.vanimg {
  width: 50vw; }

img.vanwheel1 {
  position: absolute;
  top: 15vw;
  left: 33.2vw;
  width: 6vw;
  z-index: -1; }

img.vanwheel2 {
  position: absolute;
  top: 15vw;
  left: 9.2vw;
  width: 6vw;
  z-index: -1; }

.date {
  background: none;
  padding: 1vw 1vw;
  z-index: 6;
  border: none;
  font-size: 1.4vw;
  text-transform: uppercase;
  color: #000;
  font-weight: 600;
  width: 13.3vw;
  text-align: center; }

input::placeholder {
  color: #000; }

#date1 {
  position: absolute;
  top: 25.1vw;
  left: 51.5vw; }

#date2 {
  position: absolute;
  top: 31.1vw;
  left: 51.5vw; }

#button1 {
  position: absolute;
  top: 28vw;
  left: 66vw;
  background: none;
  padding: 1vw 3vw;
  z-index: 6;
  font-size: 1.4vw;
  text-transform: uppercase;
  color: #fff;
  font-weight: 600;
  width: 13.3vw;
  text-align: center; }

.dateoutput {
  font-size: .5vw;
  font-weight: 300;
  margin-top: .1vw;
  width: 8vw; }

.vandr {
  animation: vandr 40s;
  z-index: 4; }

@keyframes vandr {
  from {
    transform: translate3d(0px, 0, 0); }
  to {
    transform: translate3d(2500px, 0, 0); } }
.cloud2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 200s linear infinite;
  z-index: 0; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.infoclick {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0; }

/*-----------------------Mini------------------------*/
.cardr img {
  width: 100%; }

.cardr {
  position: absolute;
  top: 32vw;
  right: 65vw;
  width: 37vw;
  animation: cardr 15s linear infinite;
  z-index: 4; }

@keyframes cardr {
  from {
    transform: translate3d(5000px, 0, 0); }
  to {
    transform: translate3d(-1000px, 0, 0); } }
img.miniwheel1 {
  position: absolute;
  top: 10vw;
  left: 3.4vw;
  width: 6vw;
  z-index: 0; }

img.miniwheel2 {
  position: absolute;
  top: 10vw;
  left: 26.5vw;
  width: 6vw;
  z-index: -1; }

.slide3 {
  position: relative; }

.bgsection1s3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/bgsection1s3.png);
  background-size: cover;
  z-index: 3; }

.cloud3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 200s linear infinite;
  z-index: 7; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.slide4 {
  position: relative; }

.bgsection1s4 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/bgsection1s4.png);
  background-size: cover;
  z-index: 8; }

.s1s4van {
  position: absolute;
  z-index: 9;
  left: 27.8vw;
  top: 21.5vw;
  width: 33vw; }
  .s1s4van img {
    width: 100%; }

.pullin {
  animation: pullin 1s linear; }

@keyframes pullin {
  from {
    transform: translate3d(0, 40px, 0);
    width: 92%; }
  to {
    transform: translate3d(0, 0, 0);
    width: 100%; } }
.sorry {
  position: absolute;
  z-index: 9;
  left: 26vw;
  top: 12vw;
  width: 13vw; }
  .sorry img {
    width: 100%; }

.opps {
  position: absolute;
  z-index: 9;
  left: 26vw;
  top: 12vw;
  width: 13vw; }
  .opps img {
    width: 100%; }

.oppsboth {
  position: absolute;
  z-index: 9;
  left: 26vw;
  top: 12vw;
  width: 13vw; }
  .oppsboth img {
    width: 100%; }

.busstopside {
  position: absolute;
  z-index: 9;
  left: 66vw;
  top: 6vw;
  width: 26vw; }
  .busstopside img {
    width: 100%; }

.signpeople {
  position: absolute;
  z-index: 9;
  left: 7vw;
  top: 13vw;
  width: 17.8vw; }
  .signpeople img {
    width: 100%; }

#people {
  position: absolute;
  top: 32.1vw;
  left: 9.6vw;
  text-transform: uppercase;
  font-weight: 600;
  padding: 1vw 2vw;
  z-index: 9;
  font-size: 1.5vw;
  background: none;
  border: none; }
  #people select {
    text-align-last: center; }

#button {
  position: absolute;
  top: 37.1vw;
  left: 8.4vw;
  text-transform: uppercase;
  padding: 1.1vw 4.7vw;
  z-index: 10;
  font-size: 1.5vw;
  font-weight: 500;
  color: #fff;
  background: none;
  border: none; }

#peoplecount {
  position: absolute;
  z-index: 10;
  left: 64vw;
  top: 23vw;
  height: 27.5vw; }

.peopleoutput {
  position: absolute;
  z-index: 10;
  top: 39.6vw;
  left: 12.2vw;
  font-size: 12px;
  font-weight: 300;
  color: #fff;
  text-transform: uppercase; }

.cloud4 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 200s linear infinite;
  z-index: 8; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.slides2s1 {
  position: relative; }

.bgsection1s2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/garage1.png);
  background-size: cover;
  z-index: 12; }

/*------------slider------------*/
.swiper-wrapper img:hover {
  cursor: pointer;
  opacity: 0.8;
  animation: bounce 1s; }

@keyframes bounce {
  0%, 20%, 60%, 100% {
    transform: translateY(0); }
  40% {
    transform: translateY(-20px); }
  80% {
    transform: translateY(-10px); } }
.swiper-container {
  width: 62vw;
  height: 42vw; }

img.items {
  width: 100%; }

.item {
  width: 42vw;
  margin: 0 auto;
  height: 100vw; }

.swiper-button-prev {
  background-image: url(../img/left-arrow.png) !important;
  background-size: 100% !important;
  width: 6.8vw !important;
  height: 5vw !important; }

.swiper-button-next {
  background-image: url(../img/right-arrow.png) !important;
  background-size: 100% !important;
  width: 6.8vw !important;
  height: 5vw !important; }

.vehicle {
  float: right;
  font-size: 0.7vw;
  margin-right: 14vw; }

.dayprice {
  margin-right: 14vw;
  float: right;
  margin-top: 9.5vw;
  font-weight: 500;
  margin-bottom: .1vw; }

.pricetotal {
  text-align: left;
  font-weight: 500;
  margin-top: 9.5vw;
  float: left;
  margin-left: 14vw; }

.pricetotal span {
  font-size: .6vw;
  font-weight: 400; }

.slides2s2 {
  position: relative; }

.roadlarge {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/background1.png);
  background-size: cover;
  animation: animate 60s linear infinite;
  z-index: 6; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
/*-----------------------VW KOMBI------------------------*/
.vans5 {
  position: absolute;
  top: 25vw;
  left: 44vw;
  z-index: 6; }

img.vanimgs5 {
  width: 50vw;
  z-index: 5; }

img.vanwheel1s5 {
  position: absolute;
  top: 15vw;
  left: 33.2vw;
  width: 6vw;
  z-index: -1; }

img.vanwheel2s5 {
  position: absolute;
  top: 15vw;
  left: 9.2vw;
  width: 6vw;
  z-index: -1; }

/*-----------------------sky sign------------------------*/
.signsky {
  position: absolute;
  z-index: 7;
  top: 0vw;
  left: 34.8vw;
  width: 47vw; }
  .signsky img {
    width: 100%; }

.plane {
  position: absolute;
  z-index: 7;
  top: 3vw;
  right: 24vw;
  width: 12vw; }
  .plane img {
    width: 100%; }

/*-----------------------Trailer------------------------*/
.trailer {
  position: absolute;
  top: 32.5vw;
  left: 5.5vw;
  z-index: 7; }

img.trailerimg {
  width: 43vw;
  z-index: 3; }

img.trailerwheel1s5 {
  position: absolute;
  top: 8.5vw;
  left: 20.5vw;
  width: 4.5vw;
  z-index: 1; }

img.trailerwheel2s5 {
  position: absolute;
  top: 8.5vw;
  left: 15.6vw;
  width: 4.5vw;
  z-index: 1; }

#selectedcardiv {
  position: absolute;
  z-index: 6;
  left: 2%;
  top: 37%; }
  #selectedcardiv img {
    width: 45vw; }

.options {
  position: absolute;
  z-index: 7;
  left: -0.9vw;
  top: 11vw; }

.options a {
  padding: 1.5vw 2.5vw;
  color: #fff;
  font-size: 2.7vw;
  text-transform: uppercase;
  font-weight: 600; }

a.fuelcal {
  color: #1F3C73; }
  a.fuelcal span {
    font-size: .9vw;
    display: block;
    margin-left: 14.4vw; }

.vandr1 {
  animation: vandr1 40s linear;
  z-index: 7; }

@keyframes vandr1 {
  from {
    transform: translate3d(0px, 0, 0); }
  to {
    transform: translate3d(2700px, 0, 0); } }
.cloud5 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 60s linear infinite;
  z-index: 7; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.slides2s3 {
  position: relative; }

.bgsection2s3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/bgsection2s3.png);
  background-size: cover;
  z-index: 7; }

.travelcal {
  position: absolute;
  left: 0vw;
  top: 10vw;
  z-index: 5; }

#googleMap {
  position: absolute !important;
  width: 31vw;
  left: 35.5vw;
  top: 13vw;
  height: 31vw;
  margin: 10px auto;
  z-index: 7;
  border: .5vw solid white;
  box-shadow: 0 0 19px 0px rgba(0, 0, 0, 0.5); }

.fuelpump {
  position: absolute;
  z-index: 7;
  top: 18.7vw;
  left: 67vw;
  width: 23.5vw; }
  .fuelpump img {
    width: 100%; }

#outputpass {
  position: absolute;
  z-index: 8;
  top: 5.3vw;
  left: 8.8vw;
  font-size: 2.1vw;
  letter-spacing: .5vw;
  color: #fff;
  padding: 2vw 0 5vw 0;
  width: 10vw; }

#outputkm {
  position: absolute;
  z-index: 8;
  top: 10.2vw;
  left: 7.3vw;
  font-size: 1.2vw;
  letter-spacing: .1vw;
  color: #fff;
  padding: 2vw 0 5vw 1vw;
  width: 10vw; }

#outputfail {
  position: absolute;
  z-index: 8;
  top: 17.2vw;
  left: 4.1vw;
  text-transform: uppercase;
  font-size: .7vw;
  color: #000; }

.handleft {
  position: absolute;
  z-index: 7;
  left: 25vw;
  top: 31vw;
  width: 12vw; }
  .handleft img {
    width: 100%; }

.handright {
  position: absolute;
  z-index: 7;
  left: 64vw;
  top: 31vw;
  width: 11vw; }
  .handright img {
    width: 100%; }

.alert-info {
  text-align: right; }

.mapsigncontainer {
  position: absolute;
  z-index: 8;
  left: 6vw;
  top: 17vw;
  width: 22vw; }
  .mapsigncontainer img {
    width: 100%; }

.travelcal input::placeholder {
  color: #fff; }

#from {
  position: absolute;
  top: -8.3vw;
  left: 0vw;
  font-size: 1.5vw;
  color: #fff;
  text-align: center;
  padding: 1.6vw 0; }

input#from {
  width: 22vw; }

#to {
  position: absolute;
  top: -2.1vw;
  left: 0vw;
  font-size: 1.5vw;
  color: #fff;
  text-align: center;
  padding: 1.6vw 0; }

input#to {
  width: 22vw; }

#calcRoute {
  position: absolute;
  text-align: center;
  top: 14vw;
  left: 0vw;
  font-size: 1.5vw;
  background: none;
  padding: 1.6vw 8.4vw;
  border: none;
  font-weight: 600; }

#calcRoute:hover {
  cursor: pointer; }

.buttonbook2 {
  position: absolute;
  z-index: 8;
  left: 8.2vw;
  top: 21.6vw;
  font-size: 2.1vw;
  font-weight: 800;
  color: #3B3B3D;
  padding: 1.2vw 2vw;
  text-transform: uppercase;
  letter-spacing: .5vw; }

#selectedcardivfuel {
  position: absolute;
  top: 9vw;
  left: -2.8vw;
  z-index: 7;
  width: 80vw;
  transform: scaleX(-1);
  filter: blur(2px); }
  #selectedcardivfuel img {
    width: 100%; }

.section3 {
  position: relative; }

.bgsection3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: url(../img/background1.png);
  background-size: cover;
  animation: animate 60s linear infinite;
  z-index: 0; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.reservation {
  position: absolute;
  top: 7vw;
  left: 34vw;
  z-index: 2;
  width: 32.2vw; }
  .reservation img {
    width: 100%; }

.cardswipe {
  position: absolute;
  top: 12.3vw;
  left: 72.3vw;
  z-index: 2;
  width: 15.9vw; }
  .cardswipe img {
    width: 100%; }

.swipe {
  animation: swipe 4s linear;
  z-index: 2; }

@keyframes swipe {
  from {
    transform: translate3d(0, 0px, 0); }
  to {
    transform: translate3d(0, 2000px, 0); } }
.reservationunder {
  position: absolute;
  top: 0vw;
  left: 31.2vw;
  z-index: 2;
  width: 57vw; }
  .reservationunder img {
    width: 100%; }

.reservationbooking {
  position: absolute;
  top: 15vw;
  left: 41.8vw;
  z-index: 3;
  width: 16.7vw; }

.cloud6 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 60s linear infinite;
  z-index: 0; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
/*-----------------------VW KOMBI------------------------*/
.vans6 {
  position: absolute;
  top: 25vw;
  left: 44vw;
  z-index: 1; }

img.vanimgs6 {
  width: 50vw;
  z-index: 5; }

img.vanwheel1s6 {
  position: absolute;
  top: 15vw;
  left: 33.2vw;
  width: 6vw;
  z-index: -1; }

img.vanwheel2s6 {
  position: absolute;
  top: 15vw;
  left: 9.1vw;
  width: 6vw;
  z-index: -1; }

/*-----------------------Trailer------------------------*/
.trailer2 {
  position: absolute;
  top: 32.5vw;
  left: 5.5vw;
  z-index: 1; }

img.trailerimg2 {
  width: 43vw;
  z-index: 1; }

img.trailerwheel1s3 {
  position: absolute;
  top: 8.5vw;
  left: 20.5vw;
  width: 4.5vw;
  z-index: 1; }

img.trailerwheel2s3 {
  position: absolute;
  top: 8.5vw;
  left: 15.6vw;
  width: 4.5vw;
  z-index: 1; }

/*-----------------------Trailer------------------------*/
#selectedcardivpay {
  position: absolute;
  z-index: 0;
  left: 2%;
  top: 37%; }
  #selectedcardivpay img {
    width: 45vw; }

.left {
  width: 9.8vw;
  float: left;
  text-align: left;
  font-size: .9vw;
  line-height: 1.7vw; }

.right {
  width: 6.5vw;
  float: right;
  text-align: left;
  font-size: .9vw;
  line-height: 1.7vw; }

.carselecttitle, .selectedoption {
  margin-bottom: 2.2vw; }

.dropofflocationtitle, .dropofflocation {
  margin-bottom: 3.1vw; }

.daystitle, .daystotal {
  margin-bottom: 3.4vw; }

.priceinfotitle, .totalprice {
  font-weight: 600;
  font-size: 2vw;
  margin-bottom: 4.4vw; }

.triggerul {
  position: absolute;
  z-index: 7;
  left: 69.8vw;
  top: 18.3vw;
  width: 7vw;
  cursor: pointer; }
  .triggerul img {
    width: 100%; }

.trigger {
  position: absolute;
  z-index: 8;
  left: 69.8vw;
  top: 18.3vw;
  width: 7vw;
  cursor: pointer; }
  .trigger img {
    width: 100%; }

/*-----------MODAL START-----------*/
.modal {
  position: absolute;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  opacity: 0;
  visibility: hidden;
  transform: scale(1.1);
  transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s; }

.modal-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 1.5rem 1.5rem;
  width: 21.4vw;
  height: 26vw;
  border-radius: 0.5rem;
  text-align: center; }

.close-button {
  float: right;
  width: 1.5rem;
  line-height: 1.5rem;
  text-align: center;
  cursor: pointer;
  border-radius: 0.25rem;
  background-color: lightgray; }

.close-button:hover {
  background-color: darkgray; }

.show-modal {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s; }

/*-----------MODAL END-----------*/
.credit-card form {
  margin: 30px; }

.credit-card img {
  width: 9vw;
  margin-bottom: 1vw; }

.credit-card input {
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 5px; }

.form-body {
  padding: 1vw 1.5vw; }
  .form-body label {
    float: left;
    font-size: .8vw;
    margin-bottom: .3vw; }
  .form-body input::placeholder {
    color: #5e6977; }

.title {
  clear: both;
  font-size: .9vw;
  color: #5e6977;
  margin-bottom: .5vw;
  padding-top: .7vw; }

.card-number,
.name,
.email {
  width: 15.9vw;
  padding: .3vw;
  font-size: .7vw;
  margin-bottom: .5vw; }

.expiry,
.cvv {
  padding: .3vw;
  font-size: .7vw;
  width: 6.8vw;
  margin-bottom: .9vw; }

.expiry {
  clear: both;
  float: left; }

.cvv {
  float: right; }

.proceed-btn {
  cursor: pointer;
  font-size: .9vw;
  width: 15.9vw;
  padding: 1vw;
  border-color: transparent;
  border-radius: .4vw; }

.proceed-btn {
  margin-bottom: 10px;
  background: #23c77c;
  color: #fff;
  text-transform: uppercase; }

.ccvlabel {
  float: none !important; }

.section4 {
  position: relative; }

.roadend {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background-size: cover;
  z-index: 2; }

.s4van {
  position: absolute;
  z-index: 6;
  left: 24vw;
  top: 24vw;
  width: 26vw; }
  .s4van img {
    width: 100%; }

.thanks {
  position: absolute;
  top: 8.5vw;
  left: 47vw;
  width: 22vw;
  font-size: 1.3vw;
  line-height: 1.5vw;
  text-transform: uppercase;
  font-weight: 600; }

.s4sign {
  position: absolute;
  z-index: 4;
  top: 18vw;
  left: 71.5vw;
  width: 21vw; }
  .s4sign img {
    width: 100%; }

.cloud7 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/clouds.png);
  background-size: cover;
  animation: animate 60s linear infinite;
  z-index: 2; }

@keyframes animate {
  0% {
    background-position: 0%; }
  100% {
    background-position: 100%; } }
.roadline {
  position: absolute;
  top: 81%;
  left: 0;
  width: 100%;
  height: 40%;
  z-index: 2;
  text-align: center;
  animation: roady 1s linear infinite; }

@keyframes roady {
  from {
    transform: translate3d(0, 0%, 0); }
  to {
    transform: translate3d(0, 100%, 0); } }
.roadline img {
  animation: roadye 1s linear infinite; }

@keyframes roadye {
  from {
    height: 20%; }
  to {
    height: 50%; } }

/*# sourceMappingURL=stylesheet.css.map */