body {
    background-image: none;background-size: 100% auto;overflow: hidden;background-color:#333 !important;
  }

body.vmo_brown .footer__color {
    background: rgba(110, 89, 50, 0.5);
}

.spotlight-single p {
  padding: 0;
  line-height: 200%;
  font-size: 19px;
  margin:0 auto 20px auto;max-width:1600px;
  color: #fff;  font-family: 'Merriweather', serif;
}
.spotlight-single p.elite {font-family: 'Special Elite', cursive;}
.spotlight-single p.shrikhand {font-family: 'Shrikhand', cursive;}
@media (max-width: 1500px) {
  .spotlight-single p {font-size:17px}
}   
@media (max-width: 1000px) {
  .spotlight-single p {font-size:15px}
} 
@media (max-width: 550px) {
  .spotlight-single p {font-size:13.5px;line-height:200%}
}  
@media (max-width: 400px) {
  .spotlight-single p {font-size:12.5px;line-height:200%}
}   
 

.crafted__header p {
  padding: 0 10%;
}

.global__footer {z-index: 5}

.landing {
  background: #2b2323 url(/wp-content/themes/visitmo/library/static/highlights/route66/landing.jpg) center center;
  background-size: cover;z-index: 2;
  height: 100vh !important;
}
@media (max-width: 800px) {
    .landing {height: 90vh !important;}
}
@media (max-width: 500px) {
    .landing {height: 85vh !important;}
}
.landing div {
  width: 100%;
  text-align: center;
  display: inline-block;
}
.sharing {color:#fff;font-weight: bold;}
.sharing i {
  color: #fff;cursor: pointer;
  font-size: 25px;
  margin: 0 10px;
}
.landing .sharing i:hover {
  -webkit-transform: scale(1.05) translateY(-2px);
  transform: scale(1.05) translateY(-2px);
}
.landing div p {
  color: #fff;
  font-size: 15px;
  font-style: italic;
  position: relative;
  padding: 0;
  font-family: Montserrat, sans-serif !important;
}
.landing div div {
  width: auto;
}
.landing .logo {
  height: 70%;
  vertical-align: bottom;
  margin-top: 50px;
  margin-bottom: 30px;
}
.landing .logo img {
  height: 85%;
  margin-top: 5%;
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
}

@media (max-width: 1250px) {
    .landing .logo {margin-bottom: 0;margin-top:100px}
    .landing .logo img {margin-top:3%;max-width:800px;width:85%;height:auto;}
}   
@media (max-width: 992px) {
  .landing .logo img {margin-top:10%}
  .landing .sharing {
    width: 100%;
    text-align: center;
    display: inline-block;
  }
}
@media (max-width: 600px) {
  .landing .logo img {margin-top:25%}
  .landing .sharing {
    width: 100%;
    text-align: center;
    display: inline-block;
  }
}
@media (max-width: 500px) {
    .landing .logo img {margin-top:50%}
    .landing .sharing {
    padding-top:15px;
  }
}
@media (max-height: 650px) {
    .landing .logo img {max-width:600px}
} 
.landing h1 {
  color: #fff;
  font-family: 'rift-soft', sans-serif;
  font-size: 5.65em;
  text-transform: uppercase;
  text-align: center;
  font-weight: bold;
  line-height: 40%;
  margin-top: 8%;
  text-shadow: 1px 3px 5px #333333;
}
.landing h1 span {
  font-size: 15px;
  font-family: Montserrat, sans-serif;
}
@media (max-width: 550px) {
  .landing h1 span {
    font-size: 12px;
  }
}
@media (max-width: 350px) {
  .landing h1 span {
    font-size: 9.5px;
  }
}
@media (max-width: 768px) {
  .landing h1 {
    font-size: 4.25em;
  }
}
@media (max-width: 550px) {
  .landing h1 {
    font-size: 3em;
    line-height: 50%;
  }
}
@media (max-width: 350px) {
  .landing h1 {
    font-size: 2.5em;
  }
}

.line__stretch {
  height: 1px;
  width: 100% !important;
  background-color: #fff;
  display: inline-block;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
}

.left {
  -webkit-transform: translateX(-50%);transform: translateX(-50%);float:none !important;
}
.right {
  -webkit-transform: translateX(50%);transform: translateX(50%);float:none !important;
}
.fadein {
  opacity: 0;
}
.scaleZero {
  -webkit-transform: scale(0);transform: scale(0);
}
.fixed {position:fixed!important}

.content_wrapper {width: 100%;position: relative;margin:auto}
.content-section {
  position: relative;
  padding:0;-webkit-transform: translate3d(0,0,0);
  width: 100%;
  margin: auto;  height: auto;
}

#car {padding:0;position: relative;z-index: 2}
#car #intro {position: absolute;background:url(/wp-content/themes/visitmo/library/static/highlights/route66/yellow-bg.png) center bottom;background-size: 100% 100%;background-repeat: no-repeat;
top:0;left:0;width:100%;height:550px;text-align: center;} 
#car #intro p {padding:7% 15%;color:#333;}
#car .car {width:100%;position:relative}
#car #quote {position: absolute;bottom:8%;height:100%;width:100%}
#car #quote table,#car #quote td {height:100%;width:100%;vertical-align: middle;text-align: center}
#car #quote p {font-size:40px;text-align: center;line-height: 120%}
#car #quote .name {font-family: Montserrat,sans-serif;font-size:14px;letter-spacing:2px}
@media (max-width: 1650px) {
    #car #quote {bottom:2%}
}   
@media (max-width: 1500px) {
    #car #quote {bottom:0}
    #car #intro p {padding:10% 15%}
}   
@media (max-width: 1300px) {
    #car .car {padding-top:100px}
    #car #intro {height:450px}
    #car #quote p {font-size:35px}
}    
@media (max-width: 1000px) {
    #car #quote p {font-size:27px}
    #car #intro {background-size: auto 100%;height:390px}
    #car #quote {height:95%}
    #car #quote .name {font-size:12px}
}    
@media (max-width: 700px) {
    #car .car  {width:130%;margin-left:-15%}
    #car #quote p {font-size:20px}
} 
@media (max-width: 525px) {
    #car #quote {height:75%}
    #car #intro p {padding:10%}
    #car #quote img {width:30px}
    #car #quote p {font-size:16px}
}   
@media (max-width: 400px) {
    #car .car {padding-top:200px}
    #car #quote p {font-size:12px;text-shadow: 2px 1px 5px rgba(0,0,0,.95)}
    #car #quote .name {font-size:8px;text-shadow: 2px 1px 5px rgba(0,0,0,.95)}
}       

#road {margin-top:-750px;z-index: 3}
#road .road-bg {width:130%;-webkit-transform:translateX(0%);transform:translateX(0%)}
#road .road {position:absolute;top:0;left:0;height:100%;width:100%;background-size:100% 100%;
background-position: 0 0;}
#road .photos {height:43%;margin-top:15%;width:100%;position: relative}
#road .photos img {position: absolute;width:70%;top:-50%;border:9px solid #fff;}
#road .photo1 {-webkit-transform:rotate(-5deg);transform:rotate(-5deg);left:-5%}
#road .photo2 {-webkit-transform:rotate(5deg);transform:rotate(5deg);left:35%}
#road .photo3 {left:15%}
#road .caption {text-align:center;max-width:350px}
#road table {height:100%;width:100%;position: absolute;top:7%;}
#road table td {width:50%;vertical-align: top;text-align: left;padding:10%}
#road table p {line-height: 150%}
@media (max-width: 1650px) {
    #road {margin-top:-600px}
}   
@media (max-width: 1500px) {
    #road {margin-top:-500px}
}   
@media (max-width: 1300px) {
    #road {margin-top:-400px}
}   
 
@media (max-width: 1100px) {
    #road {margin-top:-300px}
}    
@media (max-width: 768px) {
    #road {margin-top:-250px}
    #road table {top:0}
    #road table td {vertical-align: middle;width:100%}
    #road table td:nth-of-type(1) {display:none}
    #road .road-bg {width:180%}
}  
@media (max-width: 525px) {
    #road {margin-top:-150px}
    #road .road-bg {width:250%}
}  
@media (max-width: 400px) {
    #road {margin-top:-130px}
    #road table p {font-size:12px}
    #road .road-bg {width:320%}
}  

/*#highlights {margin-top:-250px;z-index: 1;background-color:#000;}*/
#highlights {z-index: 1;background-color:#000;position: fixed;top:0px;height:100vh}
#lodging,#eats,#attractions,#museums {position: absolute;top:0;width:100%;height:100%;background-size: cover;background-position:center center;}
#lodging,#eats,#attractions {display:none;}
#attractions {background-image:url(/wp-content/themes/visitmo/library/static/highlights/route66/sinclair-gas-station.jpg)}
#museums {background-image:url(/wp-content/themes/visitmo/library/static/highlights/route66/museum.jpg)}
#eats {background-image:url(/wp-content/themes/visitmo/library/static/highlights/route66/ted-drewes.jpg)}
#lodging {background-image:url(/wp-content/themes/visitmo/library/static/highlights/route66/lodging.jpg)}
#highlight-triggers {width:100%;position: relative;z-index: 0;}
.highlight-triggers {width:100%;height:100%;position: absolute;top:0;overflow: hidden}
.highlight-triggers div:nth-child(1) {width:100%;height:1px;opacity: 0;position: absolute;top:33%}
.highlight-triggers div:nth-child(2) {width:100%;height:1px;opacity: 0;position: absolute;top:66%}
.highlight-triggers div:nth-child(3) {width:100%;height:1px;opacity: 0;position: absolute;top:100%}
#highlights .bg {width:100%;display:none}
#highlights table {height:70%;width:100%;position: absolute;top:25%;}
#highlights table td {width:100%;vertical-align: middle;text-align: center;}
#highlights table p {padding:5% 15%;text-shadow: 2px 1px 5px rgba(0,0,0,.95)}
#lodging table p {text-shadow: 0,0,0,transparent;}
#attractions table a {color:#b700ff;}
#eats table a {color:#00b500;}
#lodging table a {color:#074eb5;}
#museums table a {color:#ca0000;}
#highlights div .credit {position: absolute;bottom:5%;right:5%;color:#fff;font-size: 11px}
/*#highlights table img {-webkit-transform:translateY(-120%);transform:translateY(-120%)}*/
@media (max-width: 1450px) {
    #museums table img,#lodging table img {width:40%}    
    #eats table img {width:25%}    
    #attractions table img {width:46%}
}    
@media (max-width: 1250px) {
    #attractions table img {width:57%}
}
@media (max-width: 1050px) {
    #highlights table {top:25%}
}    
@media (max-width: 900px) {
    #highlights .bg {width:130%;margin-left:-15%}
}  
@media (max-width: 800px) {
    #highlights {top:0px}
    #highlights table {top:20%}
}  
@media (max-width: 700px) {
    #highlights .bg {width:155%;}
    #highlights table {top:15%}
    #highlights table p {padding:3% 10%}
    #attractions table img, #museums table img,#lodging table img {width:70%}    
    #eats table img {width:45%}    
}   
@media (max-width: 400px) {
    #highlights .bg {width:250%;margin-left:-50%}
    #highlights table {top:15%}
    #highlights table p {font-size:11px}
}

#map {margin-top:900px;z-index: 6;opacity: 0}
#map .bg {width:100%}
#map a {
  color:#333;
}
#map .credit {
  display: none;
}
.map {width:100%;position: absolute;top:220px}
.map .trail {width:100%;}
.map .label {text-align: center;position: absolute;}
.map .circle {background-color:#d4a151;height:30px;width:30px;border-radius: 50%;opacity:.8; margin:auto;}
.map p {width:100%;color:#333;font-size:11px}
.map .label1 {left:3%;top:63%;}
.map .label1 .circle {width:20px;height:20px;}
.map .label2 {left: 25%;top: 92%;}
.map .label3 {left:58.75%;top:53%;}
.map .label3 .circle {width:20px;height:20px;}
.map .label4 {left: 89%;top:17.5%;}
.map .marker {position: absolute;width:3.5%;margin-top:-35px;opacity:0}
.map .marker img {width:100%}
.map .marker1 {top:48%;left:4%;}
.map .marker2 {top:43%;left:8%;}
.map .marker3 {top:42%;left:8.75%;}
.map .marker4 {top:55%;left:22%;}
.map .marker5 {top:76%;left:27%;}
.map .marker6 {top:77%;left:28%;}
.map .marker7 {top:38%;left:41%;}
.map .marker8 {top:38%;left:52.5%;}
.map .marker9 {top:34%;left:58%;}
.map .marker10 {top:31%;left:66%;}
.map .marker11 {top:30%;left:67%;}
.map .marker12 {top:7%;left:83%;}
.map .marker13 {top:5%;left:90%;}
#map table {height:52%;width:100%;position: absolute;top:45%;}
#map table td {width:100%;vertical-align: middle;text-align: center;}
#map table p {padding:7% 15% 5% 15%;color:#333;margin-bottom:0}
#map table img {border:0;outline:none}
#map table .credit {position: absolute;left:50%;font-size:11px;bottom: -22px;margin-left:-29px}
#map .compass {position: absolute;top:70%;left:67%;opacity: .5;}
@media (max-width: 1800px) {
    #map {margin-top:800px}
}
@media (max-width: 1600px) {
    #map {margin-top:700px}
    .map {top:180px}
}
@media (max-width: 1420px) {
    #map {margin-top:600px}
    .map {top:150px}
}
@media (max-width: 1250px) {
    #map {margin-top:530px;}
    #map table {height:58%;}
    #map table p {padding:7% 15% 2% 15%}
    .map p {font-size:10px}
    .map .circle {width:25px;height:25px}
}   
@media (max-width: 1100px) {
    #map .bg {width:130%}
    .map .label1 {left:3%;top:60%;}
    .map .label2 {left:24%;top:90%;}
    .map .label3 {left:58.5%;top:51%;}
    .map .label4 {left:88%;top:15.5%;}    
    #map .compass {width:20%}
}   
@media (max-width: 900px) {
    #map .bg {width:150%}
}   
@media (max-width: 768px) {
    #map table img {width:300px}
    .map p {font-size:9px}
    .map .circle {width:20px;height:20px}
}
@media (max-width: 700px) {
    #map {margin-top:750px;}
    #map .bg {width:200%;margin-left:-50%}
    #map .compass {top:120%}
    #map table p {padding:7% 10% 2% 10%}
}  
@media (max-width: 550px) {
    #map {margin-top:930px;}
    #map table {top:40%;}
    #map table img {width:240px}
    .map .marker {width:5%;margin-top:-10px}
    .map .label {margin-top:-5px;margin-left:-10px}
    .map .circle {width:14px !important;height:14px !important;}    
}
@media (max-width: 400px) {
    #map .bg {width:300%;margin-left:-100%}
    .map .marker {width:6%;}
    #map table p {padding:5% 10% 4% 10%}
}