@media (max-width: 1550px) {
}

@media (max-width: 1350px) {
  /*MAIN STRUCTURAL DIVS*/
  #logoWrapper {
    left: 1rem;
  }

  .innerWrapper {
    width: 100%;
  }

  #headerOverlay {
    width: 50rem;
  }

  /* GENERAL */
  h1 {
    font-size: 7rem;
  }
  h2 {
    font-size: 4.8rem;
  }

  h3 {
    font-size: 2.2rem;
  }

  /*SLIDE*/
  /*home page slide*/
  #slideTextWrapper {
    left: 1rem;
  }
  #slideText {
    width: 55%;
  }
  .slideText-block {
    padding: 2.5rem;
  }
  .slideText-block p {
    font-size: 1.7rem;
  }
}

@media (max-width: 1280px) {
}

@media only screen and (max-width: 1220px) {
  /* NAVIGATION */
  #menuIcon {
    display: block;
  }
  #navClose {
    display: block;
  }

  #menuWrapper {
    /* Wrapper */
    position: absolute;
    margin-top: 0px;
    top: 0rem;
    left: -2rem;
    /* height: auto; */
    height: 100vh;
    width: 0px;
    padding: 1rem 1rem 1rem 1rem;
    background-color: rgba(188, 171, 147, 0.95);
    overflow-x: hidden;
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
    z-index: 2010;
  }

  #navDiv {
    position: relative;
    background-color: transparent;
    width: 100%;
    margin-top: 5rem;
    margin-right: 0rem;
    margin-left: 1rem;
    float: none;
    text-align: center;
  }

  #navButton {
    position: relative;
    clear: both;
    display: block;
    float: none;
    margin: 1rem;
  }

  a.nav {
    display: block;
    float: none;
    padding: 1rem;
    margin-bottom: 2rem;
    margin-right: 1rem;
    color: #ffffff;
    font-size: 1.7rem;
    text-decoration: none;
    border-style: dotted;
    border-width: 0px 0px 1px 0px;
    border-color: #ffffff;
    transition: 0.3s;
    line-height: 120%;
  }
  a.nav:hover {
    text-decoration: none;
  }

  a.nav:after {
    content: none;
  }

  a.navLive {
    display: block;
    float: none;
    padding: 1rem;
    margin-bottom: 2rem;
    margin-right: 1rem;
    font-size: 1.7rem;
    font-family: var(--font-bold);
    text-decoration: none;
    border-style: dotted;
    border-width: 0px 0px 1px 0px;
    border-color: #ffffff;
    transition: 0.3s;
    line-height: 120%;
  }

  div.main {
    display: block;
    width: 100%;
    float: none;
    padding: 1rem;
    margin-bottom: 2rem;
    margin-right: 1rem;
    color: #ffffff;
    border-style: dotted;
    border-width: 0px 0px 1px 0px;
    font-size: 1.7rem;
  }
  div.main:hover {
    /* color: var(--color-blue); */
    color: #ffffff;
  }

  div.mainLive {
    display: block;
    width: 100%;
    float: none;
    padding: 1rem;
    margin-bottom: 2rem;
    margin-right: 1rem;
    color: #ffffff;
    font-family: var(--font-bold);
    border-style: dotted;
    border-width: 0px 0px 1px 0px;
    font-size: 1.7rem;
  }

  /* CONTENT LINKS sub links  */
  .dropDown {
    position: relative;
    display: none;
    top: 0rem;
    padding: 0rem;
    margin-top: 10px;
    background: rgba(220, 220, 220, 1);
  }
  .dropDown-products {
    width: 100%;
    margin-left: 0px;
  }

  a.sub {
    display: block;
    font-size: 1.5rem;
    color: var(--color-charcoal);
    font-family: var(--font-medium);
    line-height: 120%;
    text-align: center;
    padding: 12px 10px;
    border-style: dotted;
    border-color: var(--color-charcoal);
    border-width: 0px 0px 1px 0px;
    text-decoration: none;
    transition: 0.2s;
  }
  a.sub:hover {
    color: var(--color-red);
    font-size: 1.5rem;
    text-decoration: none;
    background-color: #ffffff;
  }

  /* GENERAL */

  h1 {
    font-size: 6rem;
  }

  h2 {
    font-size: 4rem;
  }

  h3 {
    font-size: 2rem;
  }

  p,
  li,
  td {
    font-size: 1.5rem;
  }

  p.caption {
    text-align: center;
    font-size: 1.3rem;
  }

  /* ul li {
    font-size: 1.6rem;
  } */

  /* CONTENT LINKS */
  a {
    font-size: 1.5rem;
  }

  /* BUTTONS */
  a.buttonRedMain {
    font-size: 1.7rem;
    padding: 2.5rem 2.5rem;
    margin: 1.5rem 0rem;
    border-radius: 1.5rem;
  }

  /* Map - Home */

  .mapGraphic {
    text-align: center;
    margin: 0px auto;
  }

  .map-colLeft {
    width: 80%;
    float: none;
    text-align: center;
    margin: 0px auto;
  }
  .map-colRight {
    width: 80%;
    float: none;
    text-align: center;
    margin: 0px auto;
  }

  #placesWrapper {
    max-width: none;
  }

  /*PANEL DROP */

  .panelHead {
    padding: 1.5rem 5rem 1.2rem 1.4rem;
    font-size: 1.5rem;
    min-height: 5rem;
  }
  .panelArrow {
    width: 1.2rem;
    height: 1.2rem;
  }

  /* ITINERARY - tours */
  #tourItineraryWrapper {
    width: 80%;
    padding: 1rem 1rem 12rem 1rem;
  }

  #tourItineraryWrapper .panelHead {
    color: white;
    border-width: 0px 0px 1px 0px;
  }

  #tourItineraryWrapper .panel {
    background-color: rgba(255, 255, 255, 1);
  }

  #tourItineraryWrapper .panel p {
    font-size: 15px;
  }

  /*INFO*/
  #infoWrapper .panel p {
    font-size: 15px;
  }

  #infoWrapper .panel li {
    font-size: 15px;
  }
}

@media only screen and (max-width: 1050px) {
  /*SLIDE*/
  /*home page slide*/
  #slideTextWrapper {
    top: 17rem;
  }
  #slide {
    height: 700px;
  }

  /* MAIN PIC */
  #mainPicWrapper {
    height: 65rem;
  }

  .mp-namibia {
    background-image: url("../images/pic_NamibiaSafari_M.jpg");
  }
  .mp-kunene {
    background-image: url("../images/pic_KuneneSafari_M.jpg");
  }
  .mp-etoshalions {
    background-image: url("../images/pic_EtoshaLions_M.jpg");
  }
  .mp-mobilecamp {
    background-image: url("../images/pic_MobileCamping_M.jpg");
  }
  .mp-rhinos {
    background-image: url("../images/pic_Rhinos_M.jpg");
  }
  .mp-zebra {
    background-image: url("../images/pic_Zebra_S.jpg");
  }

  /*gallery - no main pic */
  .sectionMainPic {
    height: 280px;
    padding-top: 150px;
    background-image: url("../images/bg_MainPic_m.jpg");
  }

  /* HOME */
  /*TOur SLIDER*/
  .slider {
    height: 40rem;
  }

  /* Map - Home */
  .sectionMap {
    background-image: url("../images/bg_Damaraland_m.jpg");
  }

  /* Our Story - Home */
  .sectionStory {
    background-image: url("../images/bg_Story_m.jpg");
  }
  .storyWrapper {
    width: 60%;
  }

  /* TOURs */
  .sectionSunset {
    background-image: url("../images/bg_Sunset_m.jpg");
  }
  .sectionGame {
    background-image: url("../images/bg_Game_m.jpg");
  }

  /*Info*/
  .sectionCrossing {
    background-image: url("../images/bg_GiraffeCrossing_m.jpg");
  }

  /* FOOTER */
  .sectionFooter {
    background-image: url("../images/bg_Footer_m.jpg");
  }
}

@media only screen and (max-width: 900px) {
  /*SLIDE*/
  /*home page slide*/
  #slideTextWrapper {
    top: 20rem;
  }
  .slideText-block {
    padding: 2rem;
  }
  .slideText-block p {
    font-size: 1.6rem;
  }

  /* BASIC */
  h1 {
    font-size: 5rem;
  }
  h2 {
    font-size: 3.6rem;
    margin: 2rem 0rem 3rem 0rem;
  }

  h3 {
    font-size: 1.8rem;
  }

  div.w60,
  p.w60 {
    width: 70%;
  }

  div.adventure {
    background-image: url("../images/stamp_Adventure_m.png");
  }

  /* BUTTONS */
  a.buttonRedMain {
    font-size: 1.6rem;
    padding: 2.5rem 2.5rem;
    margin: 1.5rem 0rem;
    border-radius: 1.5rem;
  }

  /* MAP - tours */
  #mapWrapper {
    width: 92%;
  }

  /*STORIES*/
  .story-img {
    width: 200px;
  }

  /*CONTACT*/
  .contact-block {
    height: 300px;
  }
  p.contact-head {
    font-size: 1.6rem;
  }
  p.contact-head img {
    width: 70px;
  }
}

@media only screen and (max-width: 800px) {
  /*SLIDE*/
  /*home page slide*/

  #slide {
    height: auto;
  }

  #slideTextWrapper {
    top: 24rem;
  }
  .slideText-block {
    margin-top: 1rem;
  }
  .slideText-block p {
    font-size: 1.5rem;
  }

  /* SLIDE FEATURES - Home */

  .slideFeature-block {
    position: static;
    display: block;
    bottom: auto;
  }

  .feature {
    width: 220px;
    margin: 0.8rem;
  }

  .feature p {
    font-size: 1.3rem;
  }

  /* HOME */
  /*TOur SLIDER*/
  .slider {
    height: 30rem;
  }

  /* BASIC */
  div.div-centerTxt {
    width: 80%;
  }

  div.div-narrowTxt {
    width: 80%;
  }

  /* Map - Home */
  .map-colLeft {
    display: none;
  }
  .map-colRight {
    width: 90%;
  }

  /* INFORMATION */

  #infoWrapper {
    width: 100%;
    padding: 1rem 1rem 8rem 1rem;
  }
}

@media only screen and (max-width: 760px) {
  /* STORIES*/
  .storyDark_left {
    width: 100%;
    float: none;
  }
  .storyDark_right {
    width: 100%;
    float: none;
  }

  .storyMed_left {
    width: 100%;
    float: none;
  }
  .storyMed_right {
    width: 100%;
    float: none;
  }

  .story-img {
    margin-top: 0%;
    margin-bottom: 1rem;
  }

  /* FOOTER */
  .sectionFooter {
    padding-top: 3rem;
  }

  #footer-logo {
    width: 160px;
  }

  .sectionFooter-left {
    width: 100%;
    float: none;
    text-align: center;
  }
  .sectionFooter-right {
    width: 100%;
    float: none;
  }

  .sectionFooter-left--address p {
    text-align: center;
  }
}

@media only screen and (max-width: 720px) {
  /*MAIN STRUCTURAL DIVS*/
  .innerPadding {
    padding: 2.5rem 2rem 2.5rem 2rem;
  }
  .innerPadding2 {
    padding: 3rem 2rem 3.5rem 2rem;
  }

  /* CONTENT LINKS */
  a {
    font-size: 1.5rem;
  }
  a.nav {
    font-size: 1.5rem;
  }
  a.navLive {
    font-size: 1.5rem;
  }
  div.main {
    font-size: 1.5rem;
  }
  .mainLive {
    font-size: 1.5rem;
  }

  a.sub {
    font-size: 1.4rem;
  }
  a.sub:hover {
    font-size: 1.4rem;
  }

  /*BASIC*/
  div.w60,
  p.w60 {
    width: 85%;
  }

  div.adventure {
    background-image: url("../images/stamp_Adventure_2.png");
    background-position: right bottom -2rem;
  }

  /* THREE PIC FLEX */
  .threePicFlex {
    width: 90%;
    flex-wrap: wrap;
  }
  .threePicFlex-bloc,
  .threePicFlex-blocAlt {
    flex-basis: 90%;
    margin: 10px 10px;
  }
}

@media only screen and (max-width: 660px) {
  /*SLIDE*/
  /*home page slide*/
  #slideTextWrapper {
    top: 40rem;
    left: 0rem;
    text-align: center;
  }
  #slideText {
    width: 94%;
    margin: 0rem auto;
  }
  .slideText-block {
    width: 100%;
    padding: 1.5rem;
    margin: 1rem auto 0rem auto;
  }
  .slideText-block p {
    font-size: 1.4rem;
    text-align: center;
  }

  /* Map - Home */
  .places-img {
    width: 100%;
  }

  /*BASIC*/
  h1 {
    font-size: 4.5rem;
  }

  h2 {
    font-size: 3.2rem;
  }
  h3 {
    font-size: 1.6rem;
  }

  p,
  li,
  td {
    font-size: 1.5rem;
  }

  p.caption {
    font-size: 1.2rem;
  }

  /* CONTENT LINKS */
  a {
    font-size: 1.5rem;
  }

  /* TOUR FEATURES - tours*/

  .tourFeatures {
    padding: 1rem 0rem;
    margin: 0rem 0rem 0rem 0rem;
    text-align: center;
  }
  .tourfeature {
    display: inline-block;
    width: 120px;
    margin: 0px 1rem;
  }
  .tourfeature p {
    display: block;
    width: 120px;
    margin: 0px;
    padding: 0px;
    font-size: 1.4rem;
    text-align: center;
  }
  .tourfeature-icon {
    float: none;
    width: 120px;
    height: 60px;
    background-position: center;
  }

  /* Tour Intro */
  table#tbl_tourIntro td {
    display: block;
    padding: 0rem;
  }

  /*gallery - no main pic */
  .sectionMainPic {
    height: 200px;
    padding-top: 120px;
    background-image: url("../images/bg_MainPic_m.jpg");
  }
}

@media only screen and (max-width: 600px) {
  /* BASIC */

  div.border,
  p.border {
    padding-left: 0rem;
    border-style: none;
  }

  /* Our Story - Home */
  .sectionStory {
    background-image: url("../images/bg_Story_s.jpg");
  }
  .storyWrapper {
    width: 85%;
  }
  .story-txt {
    border-style: none;
    padding-left: 0rem;
  }

  /*MAIN PIC*/
  #mainPicWrapper {
    height: 55rem;
  }
  .mp-namibia {
    background-image: url("../images/pic_NamibiaSafari_S.jpg");
  }
  .mp-kunene {
    background-image: url("../images/pic_KuneneSafari_S.jpg");
  }
  .mp-etoshalions {
    background-image: url("../images/pic_EtoshaLions_S.jpg");
  }
  .mp-mobilecamp {
    background-image: url("../images/pic_MobileCamping_S.jpg");
  }
  .mp-rhinos {
    background-image: url("../images/pic_Rhinos_S.jpg");
  }
  .mp-zebra {
    background-image: url("../images/pic_Zebra_S.jpg");
  }

  /* TOURs */
  .sectionSunset {
    background-image: url("../images/bg_Sunset_s.jpg");
  }
  .sectionSunset {
    background-image: url("../images/bg_Sunset_s.jpg");
  }

  /*Info*/
  .sectionCrossing {
    background-image: url("../images/bg_GiraffeCrossing_s.jpg");
  }

  /* ITINERARY - tours */
  #tourItineraryWrapper {
    width: 100%;
    padding: 0rem 2rem 12rem 2rem;
  }

  /*tabs*/
  #tabWrapper {
    margin-top: 1rem;
  }
  div.tourTab {
    font-size: 1.5rem;
    padding: 10px;
  }
  div.tourTabLive {
    font-size: 1.5rem;
    padding: 10px;
  }

  /*CONTACT*/
  .contact-block {
    height: 280px;
  }
  p.contact-head {
    font-size: 1.6rem;
  }
  p.contact-head img {
    width: 70px;
  }
}

@media only screen and (max-width: 550px) {
  /*MAIN STRUCTURAL DIVS*/
  #logoWrapper img {
    width: 150px;
  }
  /*SLIDE*/
  /*home page slide*/
  /* #slide {
    height: 600px;
  } */

  /*home page slide*/
  #slideTextWrapper {
    top: 26rem;
  }

  /* SLIDE FEATURES - Home */
  .feature p {
    padding: 10px 0px 0px 75px;
  }

  .feature-icon {
    width: 65px;
    height: 65px;
  }
  .feature-icon--lodge {
    background-image: url("../images/featureIcon_Lodge_s.png");
  }
  .feature-icon--nature {
    background-image: url("../images/featureIcon_Nature_s.png");
  }
  .feature-icon--track {
    background-image: url("../images/featureIcon_Track_s.png");
  }

  /* FOOTER */
  .sectionFooter {
    background-image: url("../images/bg_Footer_s.jpg");
  }
}

@media only screen and (max-width: 520px) {
  /*BASIC*/
  /* h1 {
    font-size: 3.5rem;
  }

  h2 {
    font-size: 2.8rem;
  } */

  /* BASIC */
  div.div-centerTxt {
    width: 100%;
  }

  /* THREE PIC FLEX */
  .threePicFlex {
    width: 100%;
    flex-wrap: wrap;
  }

  /* HOME */
  /*TOur SLIDER*/
  .slider {
    height: 25rem;
  }

  /* Map - Home */
  .sectionMap {
    background-image: url("../images/bg_Damaraland_s.jpg");
  }
  .map-colRight {
    width: 100%;
  }
}

@media only screen and (max-width: 480px) {
}

@media only screen and (max-width: 450px) {
  /*STORIES*/
  div.story-border {
    padding-left: 0rem;
    border-style: none;
    text-align: center;
  }
  .story-head {
    padding-left: 0rem;
    margin-bottom: 3rem;
  }
  .story-head p,
  .story-head h2 {
    text-align: center;
  }
}

@media only screen and (max-width: 400px) {
  /*BASIC*/
  /* h1 {
    font-size: 3.2rem;
  }
  h2 {
    font-size: 2.8rem;
  } */
}

@media only screen and (max-width: 360px) {
}

@media only screen and (max-width: 340px) {
}