*{margin: 0px; padding: 0px;}

html, body{overflow: auto;
    background-image: url('images/gradient_Header.jpg');
    background-repeat: repeat-x;
    font-size: 14px;
    color: #3c3c3c;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    line-height: 170%;
    background-color: #32231b;
}

/*Links*/
a{color: #973e09; font-weight: bold; font-size: 14px; line-height: 120%; text-decoration: none; transition: color .3s;}
a:link {color: #973e09; text-decoration: underline;} 
a:visited {color: #973e09; text-decoration: underline;}
a:active {color: #973e09; text-decoration: underline;}
a:hover {color: #3a2a22; text-decoration: underline;} 

p.orange{font-weight: bold; font-style: italic; color: #973e09; margin: 20px 0px 20px 0px;}

a.orangeU{color: #973e09; font-size: 14px; line-height: 120%; text-decoration: underline; transition: color .3s;}
a.orangeU:link {color: #973e09; text-decoration: underline;} 
a.orangeU:visited {color: #973e09; text-decoration: underline;}
a.orangeU:active {color: #973e09; text-decoration: underline;}
a.orangeU:hover {color: #3a2a22; text-decoration: underline;}

a.white{color: #FFFFFF; font-size: 14px; line-height: 120%; text-decoration: underline; transition: color .3s;}
a.white:link {color: #FFFFFF; text-decoration: underline;} 
a.white:visited {color: #FFFFFF; text-decoration: underline;}
a.white:active {color: #FFFFFF; text-decoration: underline;}
a.white:hover {color: #dcbf75; text-decoration: underline;} 

/*NAVIGATION */
#navDiv{margin-top: 53px; float: right; margin-right: 10px;}

#navDiv ul {
  list-style: none;
  text-align: center;
  padding: 0;
  margin: 0;
}

#navDiv li {
  width: auto;
  height: auto;
  display: inline-block;
  padding: 5px 8px;
  margin-right: -4px;
}

#navDiv li.navMobile{ /*only show these links on mobile menu*/
  display: none;
}

/*subnav*/

#navDiv li ul {
  position: absolute;
  margin-top: 7px;
  margin-left: -20px;
  padding: 0px;
  display: none;
  width: auto;
  background-color: #5d4131; z-index: 100;
}

#navDiv li ul li{
  display: block;
  padding: 0px;
}


/* nav - white 
.navDiv{float: left; padding: 8px 6px 6px 6px; cursor: pointer; cursor: hand;}
*/
a.nav{color: #FFFFFF; font-size: 14px; font-weight: normal; line-height: 120%; text-decoration: none; margin-right: 10px; transition: color .2s;}
a.nav:link {color: #FFFFFF; text-decoration: none;} 
a.nav:visited {color: #FFFFFF; text-decoration: none;}
a.nav:active {color: #FFFFFF; text-decoration: none;}
a.nav:hover {color: #eb7a36; text-decoration: none;}

a.navA{color: #eb7a36; font-size: 14px; font-weight: normal; line-height: 120%; text-decoration: none; margin-right: 10px; transition: color .2s;}
a.navA:link {color: #eb7a36; text-decoration: none;} 
a.navA:visited {color: #eb7a36; text-decoration: none;}
a.navA:active {color: #eb7a36; text-decoration: none;}
a.navA:hover {color: #eb7a36; text-decoration: none;}

/* SUB NAV */

#sNavDiv{border-radius: 0px 0px 6px 6px; overflow: hidden;}

a.sNav{display: block; padding: 12px 12px; color: #efe7d4; font-size: 13px; font-weight: bold; line-height: 120%; background-color: #973e09; color: #efe7d4;  border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #32231b; text-decoration: none; transition: all .4s;}
a.sNav:visited {color: #efe7d4; text-decoration: none;}
a.sNav:link {color: #efe7d4; text-decoration: none;} 
a.sNav:active {color: #efe7d4; text-decoration: none;}
a.sNav:hover {color: #efe7d4; background-color: #ac470a; text-decoration: none;}

a.sNavA{color: #efe7d4; font-size: 14px; font-weight: normal; line-height: 120%; text-decoration: none; margin-right: 10px;}
a.sNavA:link {color: #efe7d4; text-decoration: none;} 
a.sNavA:visited {color: #efe7d4; text-decoration: none;}
a.sNavA:active {color: #efe7d4; text-decoration: none;}
a.sNavA:hover {color: #efe7d4; text-decoration: none;}

/*NAV MOBILE*/
#menuDiv{display: none; position: absolute; cursor: pointer; cursor: hand; }
.homeMenu{right: 20px; top: 55px;}
.pageMenu{right: 20px; top: 20px;}



#menuDiv div {
  width: 35px;
  height: 5px;
  background-color: black;
  margin: 6px auto;
  box-shadow: 0px 3px 5px rgba(0,0,0,0.3);
  transition: all .3s;
}
#menuDiv:hover div.stroke{
  background-color: #333333;
  transform: translateY(1px);
}
#menuDiv:active div.stroke{
  background-color: #333333;
  transform: translateY(-1px);
  box-shadow: 0px 1px 3px rgba(0,0,0,0.3);
}

/*a.popup__link:hover span.popup__link--details{*/

#navClose{display: none; position: absolute; right: 10px; top: 10px; width: 30px; height: 30px; border-radius: 50%; background-color: #ded5c4; cursor: pointer; cursor: hand; transition: background-color .4s;}
#navClose p{margin-top: 50%; transform: translateY(-50%); color: #32231b; font-size: 22px; text-align: center; line-height: 1; }
#navClose:hover{background-color: #efe5d3;}


/*HEADER*/

/*header background and logo */
#headerDiv{position: absolute; width: 100%; z-index: 10;} /*min-width: 484px;*/
#leftHeaderBG{float: left; width: 45%; height: 99px;  background-image: url('images/gradient_Curve.jpg'); background-repeat: repeat-x;} /*min-width: 430px;*/
#logo{margin-left: 30px;} /*float: right;*/
#logoMobile{display: none; margin-left: 10px;}
#curve{float: left; display: block;}

#headerNavTxtDiv{position: absolute; width: 100%; z-index: 41;}

/* social media - home top */
.socialmediaDiv{position: absolute; top: 14px; right: 320px;}
.socialmediaDiv img{vertical-align: middle;}
.socialmediaDiv a{border-style: none; outline: none;}
.socialmediaDiv img.iconFB{margin-right: 3px; margin-bottom: 3px; transition: .3s;}
.socialmediaDiv img.iconFB:hover{opacity: 0.7;}

/* slide show */    
.fadein {position: absolute; top: 90px; width: 100%; height: 400px; z-index: 0; overflow: hidden;} /*min-width: 960px;*/
.fadein img {position:absolute; width: 100%; left:0; top: 0px;}

/* SLIDE SHOW
https://frontendscript.com/css-background-image-slideshow-fade*/
.crossfade{position: absolute; top: 90px; width: 100%; height: 600px;  z-index: 0;}
.crossfade > figure {
  animation: imageAnimation 30s linear infinite 0s;
  backface-visibility: hidden;
  background-size: cover;
  background-position: center center;
  color: transparent;
  height: 100%;
  left: 0px;
  opacity: 0;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: 0;
}

.crossfade > figure:nth-child(1) {
  background-image: url('images/pic_Namibia2.jpg');
}
.crossfade > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('images/pic_4x4carHire2.jpg');
}
.crossfade > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('images/pic_Landscape2.jpg');
}
.crossfade > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('images/pic_Desert.jpg');
}
.crossfade > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('images/pic_Desert2.jpg');
}


@keyframes imageAnimation {
  0% {
    animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    opacity: 1
  }
  25% {
    opacity: 0
  }
  100% {
    opacity: 0
  }
}



/*buttons - top */
.buttonDiv{position: absolute; margin-top: 10px; right: 10px; overflow: none;}
.buttonDiv p{text-align: center; padding-top: 5px;}
.button{float: left; height: 32px; width: 110px; background-image: url('images/gradient_Button.jpg'); background-repeat: repeat-x; background-color: #ded5c5; background-position: bottom;  border-radius: 14px; padding: 0px 10px 0px 10px; cursor: pointer; cursor: hand;}

.buttonO{float: left; height: 32px; width: 110px; background-image: none; background-color: #efe7d4; background-position: bottom;  border-radius: 14px; padding: 0px 10px 0px 10px; cursor: pointer; cursor: hand;}

.buttonA{float: left; height: 32px; width: 110px; background-image: url('images/gradient_Button.jpg'); background-repeat: repeat-x; background-color: #ded5c5; background-position: bottom; border-style: solid; border-color: #973e09; border-width: 1px; border-radius: 14px; padding: 0px 10px 0px 10px; cursor: pointer; cursor: hand;}


a.buttonNav {
  display: block;
  float: left;
  font-size: 12px;
  color: #973e09;
  text-decoration: none;
  background-color: #ded5c5; 
  border-radius: 10px; 
  padding: 10px 20px 10px 20px;
  margin-left: 5px;
  box-shadow: 0px 2px 5px rgba(0,0,0,0.1);
  transition: all .5s;
}
a.buttonNav:link {color: #973e09; text-decoration: none;} 
a.buttonNav:visited {color: #973e09; text-decoration: none;}
a.buttonNav:active {color: #973e09; text-decoration: none;}
a.buttonNav:hover {color: #973e09; text-decoration: none;}

a.buttonNav:hover{background-color: #efe7d4; box-shadow: 0px 2px 4px rgba(0,0,0,0.2);}


a.orange{color: #973e09; font-size: 12px; font-weight: bold; line-height: 120%; text-decoration: none; }
a.orange:link {color: #973e09; text-decoration: none;} 
a.orange:visited {color: #973e09; text-decoration: none;}
a.orange:active {color: #973e09; text-decoration: none;}
a.orange:hover {color: #973e09; text-decoration: none;}




/*floating text - home page */
#txtDiv{position: absolute; margin-top: 90px; margin-left: 40px;} /*125*/
#txtP{font-size: 32px; color: #eae1d2; text-shadow: 1px 1px 1px #000; line-height: 160%;}
#txtSpan{font-size: 18px; color: #eae1d2; text-shadow: 1px 1px 1px #000; font-style: italic;}

/*floating text - other pages */
#txtDivPages{position: absolute; right: 10px; margin-top: 125px; margin-left: 20px;}

.buttonRates{background-color: #e5b63c; background-image: url('images/arrow_Button.gif'); background-repeat: no-repeat; background-position: right center;  width: 90px; padding: 0px 25px 5px 10px; border-radius: 8px;  font-size: 13px; cursor: pointer; cursor: hand; box-shadow: 3px 3px 5px rgba(0,0,0,.3); transition: all .3s;} /*padding: 5px 25px 5px 10px;*/
.buttonRates:hover{background-color: #ffd359;  box-shadow: 3px 3px 3px rgba(0,0,0,.3); transform: scale(101%);}
/*.buttonRatesO{background-color: #ffd359; background-image: url('images/arrow_Button.gif'); background-repeat: no-repeat; background-position: right center;  width: 120px; padding: 5px 25px 5px 10px; border-radius: 8px; font-size: 13px; cursor: pointer; cursor: hand;}*/


/*floating Vehicle - home page */
#vehicleWrapper{position: absolute; display: inline-block; top: 170px; right: 40px; z-index: 35;} /*100*/



/*CONTENT */
#contentWrapperHome{position: absolute; top: 370px; width: 100%; z-index: 25;} /*270*/
#contentWrapper{position: absolute; top: 370px; width: 100%; z-index: 25;} /*270*/

/*MAIN STRUCTURAL DIVS*/
.innerWrapper {position: relative; width: 1120px; margin-left: auto; margin-right: auto; background-color: #FFFFFF; background-image: url('images/gradient_Content.jpg'); background-repeat: repeat-x;   border-radius: 15px;}
.innerWrapper2{position: relative; width: 1120px; margin-left: auto; margin-right: auto;}
.innerPadding {padding: 15px 20px 15px 20px;}


/* COLUMNS*/
.colLeft{width: 48%; float: left;}
.colRight{float: right; width: 48%;}
.colLeftWide{width: 49%; float: left;}
.colRightWide{width: 49%;float: right;}
.colFull{position: relative; clear: both; width: 100%; height: auto;}
.colFullPad{position: relative; clear: both; width: 100%; height: auto; padding-top: 0px;}

/* FOOTER */
#footer{margin-top: 20px; padding-bottom: 100px;}
#footer .FBDiv{float: left; margin-right: 20px; margin-left: 15px;}
#footer .FBDiv img{vertical-align: middle;}
#footer .FBDiv a{border-style: none; outline: none;}
#footer .FBDiv img.iconFB{margin-right: 3px; margin-bottom: 3px; transition: .3s;}
#footer .FBDiv img.iconFB:hover{opacity: 0.8;}
#footer .FBDiv img.pay{margin-left: 25px;}
#footer .DisclaimerDiv{float: right; margin-right: 15px;}

/* GENERAL*/
h1{font-size: 18px; color: #3b2a20; margin: 14px 0px 0px 0px; text-align: center;}
#tabDiv{position: absolute; width: 100%; top: 323px; z-index: 25; overflow: hidden;} /*top: 223px;*/
div.tabH1{display: inline-block; margin-left: 20px; height: 45px; background-image: url('images/gradient_Tab.png'); background-repeat: repeat-x; background-position: bottom; border-style: solid; border-width: 2px 2px 0px 2px; border-color: #e4b53c; border-radius: 15px 15px 0px 0px; padding: 0px 25px;}

h2{display: inline-block; height: 36px; background-color: #3a2a22;  margin: 30px 0px 0px 5px; border-radius: 10px 10px 0px 0px;  padding-right: 30px; } /*background-image: url('images/shadow2.jpg'); background-repeat: no-repeat; background-position: right top;*/
h2.brown{margin-top: 50px; background-image: url('images/shadowB.jpg'); background-repeat: no-repeat; background-position: right top;}
h2 span{display: block; padding: 6px 17px 3px 17px; color: #FFFFFF; font-size: 18px; font-weight: normal;}
.h2D{margin: 0px; height: 10px; border-style: solid; border-color: #3a2a22; border-width: 1px 0px 0px 0px; margin-bottom: 20px;}
.h2D2{margin: 0px; height: 1px; border-style: solid; border-color: #3a2a22; border-width: 1px 0px 0px 0px; margin-bottom: 0px;}

h3{font-weight: bold; font-size: 20px; color: #e0a91d; margin-top: 30px; margin-bottom: 15px;}
h3.grey{font-weight: bold; font-size: 18px; color: #7d7d7d; margin-top: 30px; margin-bottom: 15px;}
h3.dark{font-weight: bold; font-size: 18px; color: #3f2c22; margin-top: 30px; margin-bottom: 15px;}
h3.tab{width: 220px; font-weight: bold; font-size: 18px; color: #e0a91d; margin-top: 20px; margin-bottom: 15px; margin-left: -15px; background-color: #FFFFFF; padding: 8px 10px 8px 15px; box-shadow: -3px 3px 5px #888888;}

h4{font-size: 15px; font-weight: bold; margin-top: 30px; margin-bottom: 10px;}

h5{font-size: 14px; font-weight: bold; color: #919191; margin-top: 30px; margin-bottom: 10px;}

p{line-height: 170%; text-align: justify; margin-bottom: 10px;}
    
p.list{background-image: url('images/bullet2.gif'); background-repeat: no-repeat; background-position: 0px 6px; margin-left: 10px; padding-left: 25px;} /*width: 700px;*/
    
p.orange{font-weight: bold; font-style: italic; color: #973e09; margin: 30px 0px 20px 0px;}
p.smallW{font-size: 12px; color: #FFFFFF;}

.transWhite{margin-top: 0px; padding: 35px; background-color:rgba(255,255,255,0.8); box-shadow: 0px 1px 5px rgba(0,0,0,0.2); transition: all .32s ease-in;}

.small{font-size: 12px; text-align: left; line-height: 100%;}
    
.center{position: relative; width: 960px; margin-left: auto; margin-right: auto;}

.absCenter {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

div.divider{height: 1px; border-style: dotted; border-color: #d78b10; border-width: 1px 0px 0px 0px; margin: 30px 0px 30px 0px;}

div.clear{clear: both; height: 1px;}

a img{border-style: none; outline: none;}

img.content2{margin: 10px 0px 10px 0px;}
img.content100{width: 100%; margin: 10px 0px 10px 0px;}

.divImages2 img{width: 49%; margin: 15px 0px;}
.divImages2 img.imgLeft{float: left;}
.divImages2 img.imgRight{float: right;}

.colRight img.content{float: right; margin-bottom: 10px;}

div.brownDiv{background-color: #e9e0d0; height: auto; overflow: hidden; padding: 30px 10px 30px 10px;}
div.brownDivRates{background-color: #e9e0d0; height: auto; overflow: hidden; padding: 60px 10px 30px 10px;}
div.brownDivBG{background-image: url('images/SUVWindhoek.jpg'); background-size: cover; background-position: center; padding-top: 30px; background-color: #e9e0d0; height: auto; overflow: hidden; padding: 30px 10px 30px 10px;}

ul.content{padding-left: 15px;}
ul.content li{padding-left: 8px;}

td{vertical-align: top; font-size: 14px; color: #240502; line-height: 170%;}

/* home page services block */
.homeBlock{margin-top: 70px; width: 437px; height: 295px; background-image: url('images/bg_HomeBlock.jpg'); background-repeat: no-repeat;}


/*home page SERVICES BLOCS */

.colServicesLeft{width: 49%; float: left;}
.colServicesRight{float: right; width: 49%;}

.servicesBloc{width: 100%; height: auto; margin-right: 15px; margin-bottom: 15px; background-color:rgba(255,255,255,0.8); border-style: solid; border-color: #3f2c22; border-width: 5px 0px 0px 0px; box-shadow: 0px 1px 5px rgba(0,0,0,0.2); cursor: pointer; cursor: hand; transition: all .32s ease-in;}
.servicesBloc:hover{transform: scale(101%); box-shadow: 0px 3px 5px rgba(0,0,0,0.2);} /*background-color: #f7f4ee; */
.servicesBlocInner{padding: 0px 20px 20px 20px;  height: auto; overflow: hidden;}
.buttonOrange{margin-top: 10px; margin-bottom: 20px; float: right; width: 120px; height: 36px; background-image: url('images/gradient_ButtonOrange.jpg'); background-repeat: repeat-x; background-position: bottom; background-color: #ac470a; border-style: solid; border-color: #b84c0b; border-width: 1px; border-radius: 10px; box-shadow: 3px 3px 5px #888888; color: #FFFFFF; font-size: 12px; cursor: pointer; cursor: hand;}
.buttonOrangeO{width: 120px; height: 36px; background-image: none; background-color: #ac470a; border-style: solid; border-color: #b84c0b; border-width: 1px; border-radius: 10px; box-shadow: 3px 3px 5px #888888; color: #FFFFFF; font-size: 12px; cursor: pointer; cursor: hand;}
.buttonOrangeD{float: right; height: 36px; width: 33px; background-image: url('images/bg_arrowOrange.gif'); background-repeat: no-repeat;}
p.buttonOrangeP{margin: 0px; padding: 6px 0px 0px 8px;}

.tbl_Items{width: 94%; color: #FFFFFF; font-size: 14px;}
.tbl_Items td{vertical-align: top; line-height: 130%; padding-bottom: 4px;}

a.sWhite{color: #FFFFFF; font-size: 13px; font-weight: normal; line-height: 120%; text-decoration: none; margin: 0px;}
a.sWhite:link {color: #FFFFFF; text-decoration: none;} 
a.sWhite:visited {color: #FFFFFF; text-decoration: none;}
a.sWhite:active {color: #FFFFFF; text-decoration: none;}
a.sWhite:hover {color: #FFFFFF; text-decoration: none;}

/* SCROLL TO TOP */
.scrollToTop{display: none; width: 35px; position: fixed; right: 0px; bottom: 0px; background-color: #983e0a; color: #FFFFFF; padding: 3px; border-style: solid; cursor: pointer; cursor: hand; z-index: 100;}
.scrollToTop:hover{background-color: #b84b0c;}


/* FACEBOOK */
#FBWrapper{margin: 25px 0px; text-align: center;}

/*Orange block
.orangeBloc{margin-top: 20px; width: 439px; height: auto; background-image: url('images/bg_HomeBlock2.jpg'); background-repeat: no-repeat; background-color: #973e09;}
.orangeBlocBottom{width: 439px; height: 41px; margin-bottom: 15px; background-image: url('images/HomeBlockBottom.jpg'); background-repeat: no-repeat;}
.oHeader{font-weight: bold; color: #FFFFFF; font-style: italic; font-size: 14px; line-height: 180%;}

.orangeBloc .tbl_Items td{color: #FFFFFF; font-weight: normal; font-style: normal;}*/

.orangeHeader{padding-top: 20px; padding-left: 35px; font-size: 20px; color: #FFFFFF;}
.orangeHeader2{padding-top: 20px; padding-left: 5px; text-align: left; line-height: 130%; font-size: 20px; color: #FFFFFF;}
span.small{font-size: 13px;}
p.tick{background-image: url('images/tick.gif'); background-repeat: no-repeat; padding-left: 25px; line-height: 135%; text-align: left;}


/* RED BLOCK */
.redBlockWrapperHome{position: relative; overflow: none; margin-top: 50px; background-color: #d5d5d5; color: #FFFFFF; border-radius: 15px; padding-bottom: 100px;}
.redBlock{background-color: #973e09; background-image: url('images/bg_redBlock.jpg'); background-repeat: repeat-x; border-style: 2px solid #b84c0b; padding: 30px 30px 30px 30px; border-radius: 15px;
  -webkit-box-shadow: 0px 10px 5px -6px rgba(0,0,0,0.31);
-moz-box-shadow: 0px 10px 5px -6px rgba(0,0,0,0.31);
box-shadow: 0px 10px 5px -6px rgba(0,0,0,0.31);}
.redBlockHeader{padding-top: 0px; padding-left: 20px; font-size: 18px; line-height:140%; color: #FFFFFF; text-align: left;}
.redBlock p{color: #FFFFFF;}

.carFloat_DC{position: absolute; bottom: 0px; left: 10px;}
.carFloat_Combi{position: absolute; bottom: 40px; left: 50%; transform: translateX(-40%);}
.carFloat_LC{position: absolute; right: 10px; bottom: 0px;}

/* INCLUDED ITEMS*/
.redHeader{padding-top: 0px; margin: 0px; font-size: 20px; color: #FFFFFF;}
.redHeader2{padding-top: 0px; margin: 0px; text-align: left; line-height: 130%; font-size: 20px; color: #FFFFFF;}
.redHeaderSmall{font-weight: bold; color: #FFFFFF; font-style: italic; font-size: 14px; line-height: 180%;}

.includedItems{margin: 10px 0px;}
ul.includedList{margin-left: 30px; column-count: 2; column-gap: 50px;} /*increase column gap if bullet cut off*/
ul.includedList li{list-style-type: none;
list-style-image: url('images/tick.gif'); color: #240502; line-height: 150%;}
ul.includedList {
  -webkit-column-break-inside: avoid;
            page-break-inside: avoid;
                 break-inside: avoid;
  }


/* CAR RATES */
#converter{display: none;}

.vehicleBlocsWrapper{position: relative; padding: 0px; margin: 0px; overflow: none;}

.vehicleBloc{width: 49%; height: 280px; overflow: hidden; margin: 0px 0px 20px 0px; background-color: #FFFFFF; border-style: solid; border-color: #3f2c22; border-width: 0px 0px 5px 0px; background-image: url('images/bg_gradientRates.jpg'); background-repeat: repeat-x; background-position: bottom; transition: border-color .5s;} /*font-size: 90%;*/

.vehicleBloc--left{float: left;}
.vehicleBloc--right{float: right;}

.vehicleBlocInner{position: relative; padding: 0px 20px 20px 20px; height: auto; background-image: none; background-repeat: no-repeat; background-size: 85%; background-position: bottom; transition: background-size .5s;}
.vehicleBlocInner:hover{background-size: 88%; cursor: pointer;}

.vehicleBloc:hover{border-color: #973e09;}

.vehicleBloc_car{width: auto; transition: transform .4s;}

.vehicleBloc:hover .vehicleBloc_car{transform: scale(105%);}

.vehicleBloc h3{margin-top: 15px;}
.vehicleBloc .buttonOrange{position: absolute; right: 20px; top: 200px; margin: 0px; padding: 0px; z-index: 1000;}

.selectGroups{max-width: 200px;}

ul.ratesList{ margin: 15px 15px;}
ul.ratesList li{list-style-type: none; 
  list-style-image: url('images/bulletW.gif'); text-align: left; color: #240502;}

.carFloat{position: absolute; right: 20px; top: 0px; margin-top: -20px;}

.campingOptions{float: right; margin: 10px 0px 0px 10px;}

.tbl_RatesHead{padding: 5px; font-size: 10pt; background-color: #54453b; color: #FFFFFF; font-weight: bold; text-align: center;}
.tbl_Rates{float: left; margin-bottom: 11px; background-color: #FFFFFF; border-style: solid; border-width: 1px 0px 0px 1px; border-color: #3a2a22;} /* clear: both; */
.tbl_Rates--insure{width: 20%;}
.tbl_Rates--excess{width: 43%;}
.tbl_Rates--rates{width: 37%;}
.tbl_Rates td{border-style: solid; border-width: 0px 1px 1px 0px; padding: 3px 5px 3px 5px; border-color: #3a2a22;}

.tbl_RatesInner{width: 250px; font-size: 7pt; margin-left: 15px; margin-top: 5px;}
.tbl_RatesInner td{border-style: none;}

td.head{font-size: 10pt; background-color: #54453b; color: #FFFFFF;}    /* AE740F */
td.dark{color: #111111; font-weight: bold; text-align: center; background-color: #dcbf75; padding-left: 6px;}/*dcbf75*/
td.ldark{color: #111111; font-weight: normal; text-align: center; background-color: #dcbf75; padding-left: 6px;}
td.lhead{background-color: #eccd7e; text-align: center;}
td.lhead img{vertical-align: middle;}

td.light{color: #111111; font-weight: bold; text-align: center; background-color: #eae2ce; padding-left: 6px;}
td.light2{background-color: #eee7d2;}
td.numbersL{text-align: center; background-color: #eee7d2;}

td.orangeBG{color: #111111; font-weight: bold; text-align: center; background-color: #b0734f;}
td.orangeBG2{background-color: #b07959;}

td.small{font-size: 14px; margin-left: 5px; margin-right: 15px; text-align: justify; line-height: 120%;}
td.numbers{text-align: center;}

td.noborder{border-width: 0px 1px 0px 0px;}
tr.heightOption{height: 86px;}
tr.heightOption2{height: 340px;}


/* SAFETY */
.colTxt2{margin: 10px 0px; column-count: 2; column-gap: 30px;}
.elephantRight{margin-top: 50px; float: right;}

/* FLEX */
/*https://codepen.io/lis186/pen/azNOOp*/

.flex-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: stretch;
  padding: 0px;
}

/* Create four equal columns that sits next to each other */
/*.column {
  flex: 33.33333332%;
  max-width: 33.33333332%;
  padding: 0 4px;
  box-sizing: border-box;
}*/

.flex-container img {
  display: block;
  float: left;
  flex: 0 0 auto; /*shorthand property for the flex-grow, flex-shrink, and flex-basis*/
  padding: 4px;
  width: calc(100%/3 - 8px);
}

/* CONTACT US */
.contact{margin-left: 30px;}
.ntbDiv{width: 200px; text-align: center; margin: 0px auto;}
.ntbDiv p{text-align: center}

/*QUOTE FORM */

.formBloc{position: relative; height: auto; padding: 15px; margin: 20px 40px 40px 40px; background-color: #FFFFFF; border-style: solid; border-color: #3f2c22; border-width: 0px 0px 5px 0px; background-image: url('images/gradient_FormBloc.jpg'); background-repeat: repeat-x; background-position: bottom;}
.formBloc--bottomPad{position: relative; height: auto; padding: 15px 15px 100px 15px; margin: 20px 40px 40px 40px; background-color: #FFFFFF; border-style: solid; border-color: #3f2c22; border-width: 0px 0px 5px 0px; background-image: url('images/gradient_FormBloc.jpg'); background-repeat: repeat-x; background-position: bottom;}
.submitBloc{position: relative; margin: 20px 40px 40px 40px;}

.red{color: #973e09; font-size: 10px;}
.red2{color: #973e09;}

fieldset{border-style: none; margin: 20px 0px;}

.fField{margin-bottom: 10px;}
label{float: left; width: 170px; margin-right: 10px; text-align: right;}
.inputDiv{margin-left: 220px; border-style: none;}

input, select, textarea{box-sizing: border-box; width: 100%; border-radius: 8px; padding: 8px 12px; color: #666666; font-size: 14px; border: 1px solid #999999; outline: none; box-shadow: 0x 3px 5px rgba(0,0,0,0.3);
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  transition: all 0.30s ease-in-out;}

input[type="radio"], input[type="checkbox"]{width: auto;}

textarea:focus, input:focus, option:focus{
  box-shadow: 0 0 5px rgba(220, 191, 117, 1);
  padding: 9px 12px;
  border: 1px solid rgba(220, 191, 117, 1);}

option{font-size: 12px; border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #e3e3e3;}
option.shade{background-color: #e3e3e3; border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #FFF;}

.nobreak{white-space: nowrap;}


.button_Submit2{float: right; width: auto; font-family: 'Open Sans', sans-serif; text-transform: uppercase; background-color: #32231b; color: #dcbf75; font-size: 18px; padding: 8px 18px; border-style: solid; border-color: #674838; border-width: 1px; border-radius: 5px; box-shadow: 0px 3px 5px rgba(0,0,0,0.3); cursor: pointer; cursor: hand; transition: all linear 0.2s;}
.button_Submit2:hover{background-color: #51392c; box-shadow: 0px 3px 3px rgba(0,0,0,0.3);}

#refresh{color: #983e0a; font-size: 12px; text-align: left; cursor: pointer; cursor: hand;}
#refresh:hover{color: #bc4d0c;}


#selfDiv{position: relative; width: auto; padding: 10px; background-color: #b0a898; cursor: pointer; cursor: hand;}
.barDiv{margin-top: 4px; margin-left: 20px; margin-right: 60px; color: #FFFFFF; text-align: center;}
#selfArrow{position: absolute; right: 15px; top: 10px;} /* margin-left: 70px; margin-right: 20px; vertical-align: middle;*/
#selfPanel{display: none;}
td.tblPlaces-gutter{width: 50px;}

p.dropDownHead{display: inline-block; padding-right: 15px; color: #973e09; font-size: 14px; font-weight: bold; line-height: 120%; text-decoration: none;  cursor: hand; cursor: pointer; transition: .3s;}
p.dropDownHead:hover{color: #c9530d;}
p.dropDownHead-up{background-image: url('images/arrow2_Up.png'); background-repeat: no-repeat; background-position: right;}
p.dropDownHead-down{background-image: url('images/arrow2_Down.png'); background-repeat: no-repeat; background-position: right;}


div.panel{display: none; padding: 4px;}
div.divideH{padding-top: 10px; padding-bottom: 10px; border-style: dotted; border-width: 0px 0px 1px 0px;}

#costWrapper{position: relative; display: inline-block; margin: 30px 0px; padding: 0px 35px; height: 55px; border-radius: 25px; border-style: solid; border-color: #dcbf75; border-width: 4px; background-color: #32231b; box-shadow: 0px 2px 5px rgba(0,0,0,0.3);}
#costWrapper::before{
  content: "N$";
  position: absolute;
  top: -15px;
  left: -15px;
  display: block;
  height: 35px;
  width: 35px;
  border-radius: 50%;
  background-color: #FFFFFF;
  color: #54453b;
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  text-align: center;
  box-shadow: 0px 2px 5px rgba(0,0,0,0.3);

}
#Cost{padding: 0px; margin: 0px; line-height: 55px; text-align: center; color: #FFFFFF; font-size: 24px; font-weight: bold;}

#SpecialInform{margin: 15px 0px 0px 0px; font-weight: bold; color: #983e0a;}


/* CONTINUE FORM BUTTON - NEXT */
.phaseButton{position: absolute; right: -20px; bottom: -30px; padding: 20px 25px; height: auto; border-radius: 20px; border-style: solid; border-color: #dcbf75; border-width: 4px; background-color: #983e0a; color: #FFFFFF; font-size: 16px; font-weight: bold; box-shadow: 0px 2px 5px rgba(0,0,0,0.3); z-index: 100; cursor: pointer; cursor: hand; transition: all .3s;}
.phaseButton:hover{background-color: #ca520d; box-shadow: 0px 2px 3px rgba(0,0,0,0.3);}

#formPhase2 .phaseButton{right: auto; left: -20px;}


#formPhase1{display: block;}
#formPhase2{display: none;}

.error2{text-align: left; color: #bc4d0c; font-size: 10px; margin: 0px; padding: 0px;}



/*Flights Form*/
#flightForm {color: #FFFFFF;}

#flightForm .fField{margin-bottom: 10px;}
#flightForm label{float: left; width: 120px; margin-right: 10px; text-align: left;}
#flightForm .inputDiv{margin-left: 150px; border-style: none;}

#flightForm label.error{float: none; width: auto; text-align: left; color: #FF0000; font-size: 10px; margin: 0px; padding: 0px;}

/*
#flightForm .fField{margin-bottom: 0px;}
#flightForm label{display: block; clear: both; float: left; color: #FFFFFF; width: 100px; text-align: left; padding-left: 10px;}
#flightForm label.error{float: none; width: auto; text-align: left; color: #FF0000; font-size: 10px; margin: 0px; padding: 0px;}*/

#flightForm div.xtra {margin-top: 5px; margin-left: 5px;}
#flightForm .small{margin-top: 5px; margin-bottom: 0px;}

#flightForm #captcha_div{float: left; vertical-align: top; background-color: #000000; padding: 6px 6px 6px 22px; text-align: center; width: 100px; height: 50px;}
#flightForm #captcha_label{line-height: 100%; text-align: left;}

.throw_error{font-size: 12px; color: #bc4d0c; text-align: left; margin: 0px; padding: 10px; margin: 10px;}
#message{font-size: 14px; color: #FFFFFF; text-align: center; margin: 0px 0px 0px 15px; padding: 10px; border: 2px solid #dcbf75; border-radius: 12px; background-color: #983e0a; }
#message p{text-align: center; margin: 0px;}
img.checkmark{clear: both; display: block; margin: 0px auto;}

#tbl_FForm{margin-left: 20px;}
#tbl_FForm td{color: #FFFFFF; padding: 1px 1px 3px 1px;}
#tbl_FForm td.num{color: #FFFFFF; font-weight: bold;}


/* Self Drive page */
.driveBloc{float: left; width: 402px; height: auto; overflow: hidden; margin: 0px 20px 20px 20px; background-color: #FFFFFF; border-style: solid; border-color: #3f2c22; border-width: 0px 0px 5px 0px; background-image: url('images/gradient_FormBloc.jpg'); background-repeat: repeat-x; background-position: bottom;}

.driveBlocInner{padding: 0px 20px 20px 20px;  height: auto; overflow: hidden;}

.tbl_selfDrive{ border-style: solid; border-width: 1px 0px 0px 1px; border-color: #3a2a22;}
.tbl_selfDrive td{padding: 3px 8px 3px 8px; border-style: solid; border-width: 0px 1px 1px 0px; padding: 3px 5px 3px 5px; border-color: #3a2a22;}
.tbl_selfDrive td.light{color: #111111; font-weight: normal; text-align: left; background-color: #eae2ce; padding-left: 6px;}

#fb-back { display: none; background: rgba(0,0,0,0.8);   width: 100%; height: 100%; position: fixed; top: 0;   left: 0; z-index: 99999;}
#fb-exit { width: 100%; height: 100%; }
.fb-box-inner { width:300px; position: relative; display:block; padding: 20px 0px 0px; margin:0 auto; text-align:center; }
#fb-close { cursor: pointer; position: absolute; top: 15px; right: 0px; font-size: 36px; font-weight:700; color: #000; z-index: 99999; display:inline-block; line-height: 18px; height:36px;width:36px; }
#fb-close:hover { color:#06c; }
#fb-box { min-width: 340px; min-height: 360px; position: absolute; top: 50%; left: 50%; margin: -220px 0 0 -170px; -webkit-box-shadow: 0px 0px 16px #000; -moz-box-shadow: 0px 0px 16px #000; box-shadow: 0px 0px 16px #000; -webkit-border-radius: 8px;-moz-border-radius: 8px; border-radius: 8px;
background: #fff; /* pop up box bg color */
border-bottom: 40px solid #f0f0f0;  /* pop up bottom border color/size */
}
.fb-box-inner h3 { line-height: 1; margin:0 auto; text-transform:none;letter-spacing:none;
font-size: 30px!important;  /* header size */
color:#06c!important; /* header color */
}
.fb-box-inner p { line-height: 1; margin:0 auto 20px;text-transform:none;letter-spacing:none;
font-size: 16px!important; /* header size  */
color:#333!important; /* text color */
}
a.fb-link { position:relative;margin: 0 auto; display: block; text-align:center; color: #333; /* link color */
bottom: -30px;
}
#fb-box h3,#fb-box p, a.fb-link { max-width:290px; padding:0; }

/*POPUP2*/

#popupButtonPages{position: absolute; top: 130px;}

.popup{
    background-color: rgba(0,0,0,0.8);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*height: 100vh; /*100%*/;
    z-index: 2000;
  
    opacity: 0;
    visibility: hidden;
    transition: all .3s;
  }
  
  .popup__content{
    background-color: #000000;
    height: auto;
    width: 80%;
    max-width: 960px;
    border-radius: 3px;
    position: absolute;
    z-index: 2001;
    top: 50%;
    left: 50%;
    box-shadow: 0 12px 20px rgba(0,0,0,.2);
    opacity: 0;
    transform: translate(-50%, -50%) scale(.5);
    transition: all .5s .2s;
  }
  
  /*url gets the #target on it - pseudo class then available*/
  .popup:target{
    opacity: 1;
    visibility: visible;
  }
  
  /*when the popup becomes the target, we style the child element of the popup*/
  .popup:target .popup__content {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }

 .popup__Image{width: 100%;}
  
  
  a.popup__close:link, a.popup__close:visited{
    color: #666666;
    position: absolute;
    width: 30px;
    height: 30px;
    text-align: center;
    top: 20px;
    right: 20px;
    font-size: 30px;
    line-height: 85%;
    text-decoration: none;
    display: inline-block;
    background-color: #FFFFFF;
    border-radius: 50%;
    padding: 0px;
    transition: all .2s;
  }
  a.popup__close:hover{
    color: #983e0a;
  }
  
  
  a.popup__link:link, a.popup__link:visited{
    position: relative;
    color: #983e0a; /*e5ba79*/
    font-size: 16px;
    font-weight: normal;
    text-align: right;
    display: inline-block;
    margin: 10px 0px 0px 0px;
    text-decoration: none;
    transition: all .2s;
  }


  /* a.popup__link:link::before, a.popup__link:visited::before{
    content: "40% OFF";
    color: #FFFFFF;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    line-height: 120%;
    display: block;
    padding: 8px;
    position: absolute;
    top: 0;
    left: -4px;
    transform: rotate(20deg);
    width: 60px;
    height: 60px;
    background-color: #983e0a;
    border: 3px solid white;
    border-radius: 50%;
    z-index: 100;
  } */

  span.popup__link--more{
    font-size: 12px;
    text-align: right;
    letter-spacing: 0px;
    font-weight: bold;
    color: #983e0a;;
  }

  span.popup__link--head{
    font-size: 30px;
    font-weight: bold;
    line-height: 90%;
    color: #983e0a;
    display: block;
    margin-left: 80px;
  }

  span.popup__link--details{
    display: block;
    margin: 4px 0px 4px 10px;
    padding: 5px;
    padding-left: 80px;
    border-radius: 3px;
    background-color: #242424;
    color: #FFFFFF;
    text-transform: uppercase;
    font-size: 15px;
  }

  /* a.popup__link:hover{
    color: #ffcf87;
  } */

  a.popup__link:hover{
    transform: translateX(-5px);
  }

  /* a.popup__link:hover span.popup__link--more{
    color: #000000;;
  }

  a.popup__link:hover span.popup__link--details{
    transform: translateX(5px);
    background-color: #000000;
  } */

  a.popup__link:link:hover::before, a.popup__link:visited:hover::before{
    transform: rotate(30deg);
  }
  
  

