* {margin: 0;  padding: 0;}
/*example of inline coding: style="color:blue;text-align:center"
colors used: gold#f4ad03 -rgb(244, 173, 3);maroon#800000 rgb(128, 0, 0); navy#000066 rgb(0, 0, 102); light-blue#485ef4*/
@media only screen and (min-width: 100px)  {
html {font-size: 62.5%;}
body{color:#000066;font-family:'Volkhov', serif;font-size:11px;background:#f4ad03;margin:0;}
h1, h2, h3, h4, h5{font-family:'Vast+Shadow';text-align:center;}
h1{font-size:2.4rem;text-shadow:2px 2px 2px #ffffff;}
h2{font-size:2.0rem;text-shadow:2px 2px 2px #ffffff;text-align:center;}
h3{font-size:1.6rem;}
h4{font-size:1.4rem;margin-top:1rem;}
h5{font-size:1.2rem;font-style:italic;color:#000066;line-height:1.2;}
h6{font-size:1rem;}
p{font-size:12px; margin:1vw 4vw 2vw 4vw;padding:1vw;line-height:1.2; text-align:left;}
a:link{color:#000066;text-decoration:none;}
a:visited{color:#485ef4;background-color:transparent;text-decoration:none;}
a:hover{color:#800000;text-decoration:underline;}
a:active{color:#800000;text-decoration:none;}
li a:hover{color:#800000;text-decoration:underline;}
.link-underline{text-decoration:underline;color:#800000;}
.links {font-style: italic; color:#000066; font-weight: bold;}
.links a:visited{color:#485ef4;}
.underscore{color:#800000;/*text-decoration:underline*/;font-weight:bolder;display: inline;}
.float-r{clear:both;float:right;position:relative;text-align:right;}
#business{display:inline-block;position:absolute;margin:0;width:100%;max-height:1.6rem;}
#business-logo{position:absolute;display:inline-block;width:36%;top:0;}
#business-logo a img{position:relative;border-radius:1.8em;border-color:#f4ad03;margin:0 auto 0.1rem 0.1rem;width:10rem;display:inline-block;float:left;}
#business-name{top:0.1rem;display:inline-block;visibility:visible;position:absolute;margin-left:44%;right:0.6rem;}
#business-name h2{position:relative;text-align:right;float:right;font-size:1.8rem;color:#800000;font-style:italic;margin:0 auto;padding:0;text-shadow:2px 2px 2px #f4ad03;}
header{background:#000066;width:100%;margin:2rem 0 0 0;border-top:medium solid #800000;display:inline-block;}
#logo{display:none;visibility:hidden;}
#logo img{visibility:hidden;display:none;}
#name{visibility:hidden;display:none;}
#name h2{text-shadow:2px 2px 2px #800000;}
#phrase{display:none;visibility:hidden;}
#phrase h1{display:none;visibility:hidden;}
#phone{margin-right:36%;margin-left:6vw;min-width:18%;display:block;}
#phone h2{font-size:1.1vw;margin:0.1em 0 0 0;position:relative;padding-top:0.3rem;color:#f4ad03;}
#phone h2 a{color:#f4ad03;text-decoration:none;}
#phone h2 a:hover{color:#fff;text-decoration:none;}
nav {/*width: 100%;*/}
#menu-wrapper {position: absolute; right: 0; background-image: url('https://www.mauibnbguide.com/images/bkg-blue.jpg');width: 100%;}
#menu-wrapper ul {margin: 0;width: 100%; overflow: hidden; text-align: center;}
#menu-wrapper ul a {color:#800000;}
#menu-wrapper ul a:visited {color:#000066;}
#menu-wrapper ul a:hover {color:#f4ad03; font-weight:bolder;}
#menu-wrapper ul li {/*margin: 0.25rem 0.1rem 0.2rem 0; max-height: 1.3rem;*/}
#menu-wrapper ul a li {/*font-size: 1.6rem; text-decoration:none; text-align:center; font-weight:bold; vertical-align: 9%; display: inline-block;*/}
/*#menu-wrapper ul li a:visited {color:#485ef4;}
#menu-wrapper ul li a:hover {color: #f4ad03; font-weight: bolder;}*/
.bubble {border: thin solid #f4ad03; border-radius: 30%; background-color: #fff; display: inline-block; padding:4px 5px 6px 5px; font-size:14px ;font-weight: bold;}
#slider-space {height:1.2rem;}
#slider-space img{height:0.3rem;width:100%;}
#rental-jump {text-align: center; display: block; margin-top: 0.8rem;}
#rental-jump a {font-size: 10px; font-style:italic; color:#f4ad03; text-align: center; background-color: #800000;}
#rental-jump a:hover {background-color: #000066; color: #fff;}
#haiku-slide1 {display:block; visibility: visible;}
#haiku-slide2 {visibility: hidden; display: none;}
#haiku-slide3 {visibility: hidden; display: none;}
#haiku-slide4 {visibility: hidden; display: none;}
#title {text-align: center; display: block; margin:70px auto 24px auto;}
#title a {color: #f4ad03; margin: 0 auto 0; text-align: center; font-weight: bolder;}
#title a:hover {background-color: #000066; color: #fff;}
#title h1{text-align: center; display: block; margin: 3rem 1rem 1rem 1rem;}
#title h2{font-size: 3rem; }
#title h4 {margin-top: 0;}
.message {margin:0 auto;background-color: #fff; border: solid medium #800000; border-radius:3rem; width:62%; padding: 1rem;}
.wrapper {position:relative; margin:0 auto 0 2vw; width:100%;  -webkit-transform-style: preserve-3d;  -moz-transform-style: preserve-3d;  transform-style: preserve-3d;}
.wrapper-l {margin:0 8vw 0 4vw; width:90%; text-align:left;  -webkit-transform-style: preserve-3d;  -moz-transform-style: preserve-3d;  transform-style: preserve-3d;}
.squeeze-up {line-height:2.2; margin-top: -1vw; margin-bottom: -0.3vw;}
.just-center {text-align:center; margin: 0 2vw;}
#map {overflow: hidden; background-color:#fff; border: solid medium #800000; border-radius:3rem;}
#map img {width: 90%; }
#map-west img {width: 90%;}
#map h3 {margin:2vw 6vw;}
#map h4 {margin:1vw 5vw;}
.area-map {margin:4vw 4vw; background-size: 100% 100%; background-repeat:no-repeat; border: solid medium #000066; border-radius:3rem;}
.places {width: 80%; margin-left: 12%;}
.intro {margin:1rem auto 0 auto; width:94%;}
#intro {margin:4rem auto 1rem; width:94%;}
.content-head {text-align: center; font-style: italic;}
.content-head h2{text-align: center; font-style: italic; padding: 0.4rem; color: #000066; margin: 2rem auto 2rem auto;}
.content-head h1 {text-align: center;}
.content-head h4 {text-align: center;}
.content-head h2 a{color: #000066;}
.content-aside {display: block; text-align: center; background-color: #fff; border: solid medium #800000; border-radius:3rem; padding: 1rem;}
.content-below {display: block; background-color: #fff; border: solid medium #800000; border-radius:3rem; margin-bottom: 2rem;} 
.content-below h3 {line-height: 2rem; margin-top: 1.4rem; text-align: center;}
.content-below h3 a {color:#000066;}
.content-below h3 a:hover {color:#800000;}
.content-wide {width:94%; margin:0 auto;}
.content-wide h2 {line-height: 3rem; text-align: center;}
.content-wide h3 {text-align: center;}
.middle {vertical-align:middle; display:inline-block;}
.middle img {display:inline-block; vertical-align:middle;}
.middle span {display:inline-block; overflow:visible; width:96%;}
.middle span h3 {margin: 1.3rem; display:block; overflow:visible; padding-bottom:2vh;}
img.center {display: block; margin-left: auto;  margin-right: auto;}
.photo-c {margin: 2rem auto; border: solid medium #000066; border-radius:3rem; display:block; vertical-align:middle; max-width:90%;}
.photo-l {margin:2vw 0 3vw 2vw; border: solid medium #000066; border-radius: 3rem; width:44%;float:left;}
.photo-r {margin:4vw auto 0 auto; border: solid medium #000066; border-radius: 3rem; width:98%;}
.big-pic-center {margin: 3rem 1rem 3rem 1rem; border: solid medium #000066; border-radius: 3rem; max-width: 100%; height: auto;}
#restaurant {padding-top: 2.6rem; text-align: justify; overflow: hidden; border-radius:3rem; padding: 1rem;}
.maui-towns { border-bottom: thin solid #000066; padding: 0.8rem;}
.shops{ margin:6vw; text-align:center;}
#gallery {margin: 2rem auto 5rem auto; text-align: center; overflow: hidden; background-color: #fff; border: solid medium #800000; border-radius: 3rem; width:94%;}
#gallery p {text-align: center; margin: 3%;}
.gal-l{position:relative; margin: 0 auto;}
.pic-l { border: solid medium #000066; border-radius: 3rem; width:96%;}
.h3-left {float:left;  position: relative; top: 50%; transform: translateY(-50%); left: 0.5%;}
.p-left {float: left; position: relative; text-align: center; top: 50%;
  transform: translateY(-50%); display:inline-block; padding: 0.4%;}
.em {font-style: oblique; font-weight: bold; padding:0.6rem;}
.p-right {float:left; position: relative; top: 50%; transform: translateY(-50%); right: 2%;}
#feature {width:100%; margin: 0 auto;}
#feature a {color: #000066; text-decoration:none;}
#feature a:hover {color: #800000;}
#feature td {border-right: thin solid #000066; text-transform: capitalize;padding: 0.6rem;}
#feature2 {width:100%; margin: 0 auto;}
#feature2 a {color: #000066; text-decoration:none;}
#feature2 a:hover {color: #800000;}
#feature2 td {border-right: thin solid #000066; text-transform: capitalize;padding: 0.6rem;}
.col-first {width:30%; line-height: 0.8; padding: 1rem; text-align: center;}
.col-second {width: 30%; text-align: center;}
.col-town {width:14%; text-align: center;}
.col-three{width: 26%; text-align: center; border-right:0;}
.up-date{border-bottom: medium groove #800000;font-size:small; text-align:center;}
.list {margin: 0 auto; text-align:center;}
.listings {margin: 2rem auto; border: solid medium #000066; border-radius:3rem; display:block; vertical-align:middle; width:94%;}
.inn-words{color:#800000; background-color:#dcf3ff; border-bottom: medium groove #fff; font-size: small; text-align: center;}
#aside {margin:0.8rem;}
#aside img {width: 80%;}
#aside ul {list-style: none inside; margin-right: 0; background: #fff;}
#aside h4 {text-align:center; line-height:1.6rem; color:#800000; margin-top:2rem;}
.ads {border: solid medium #000066; border-radius:3rem; margin-top: 2vw;}
.ads2{padding:1rem 0 2rem 0;}
.small{font-style: oblique; font-size:0.9rem; font-weight:bolder; margin: 0 auto; text-align:center;}
.big-bkg-pics {height:40vw; margin: 2rem auto; width:70vw; background-size: 100% 100%; background-repeat:no-repeat; border: solid medium #000066; border-radius:3rem;}
.top-photo {height:60vw; margin:2vw 3vw; background-size: 100% 100%; background-repeat:no-repeat; border: solid medium #000066; border-radius:3rem;}
.gal-pics {height:36vw; margin:0 1vw; background-size: 100% 100%; background-repeat:no-repeat; border: solid medium #000066; border-radius:3rem;}
.aside-pics {height:50vw; margin:0 auto; max-width:90%; background-size: 100% 100%; background-repeat:no-repeat; border: solid medium #000066; border-radius:3rem;}
#adventure {background-image: url('https://www.mauibnbguide.com/images/w-maui-mts.jpg');}
#iao {background-image: url('https://www.mauibnbguide.com/images/iao-valley-slide.jpg');}
#sprecklesville {background-image: url('https://www.mauibnbguide.com/images/awesome-sprecklesville-maui.jpg');}
#canoe {background-image: url('https://www.mauibnbguide.com/images/northshore-ocean-canoeing.jpg');}
#surf {background-image: url('https://www.mauibnbguide.com/images/northshore-ocean-surfing-maui.jpg');}
#central {background-image: url('https://www.mauibnbguide.com/images/kanaha-wind-surfing.jpg');}
#baldwin{ background-image: url('https://www.mauibnbguide.com/images/baldwin-beach-paia.jpg');}
#sugar-beach {background-image: url('https://www.mauibnbguide.com/images/kihei-sugar-beach-maui.jpg');}
#purouse {background-image: url('https://www.mauibnbguide.com/images/la-purouse-bay.jpg');}
#kihei {background-image: url('https://www.mauibnbguide.com/images/makena-wailea-beach-sunset-pic.jpg');}
#south-shore { background-image: url('https://www.mauibnbguide.com/images/maalaea-maui-big.jpg');}
#banyan{background-image: url('https://www.mauibnbguide.com/images/lahaina-banyan-tree.jpg');}
#oluwalu{background-image: url('https://www.mauibnbguide.com/images/olowalu-sunset-lahaina.jpg'); width:90%;}
#kaanapali {background-image: url('https://www.mauibnbguide.com/images/lahaina-west-maui.jpg');}
#lahaina {background-image: url('https://www.mauibnbguide.com/images/lahaina-road.jpg');}
#hula {background-image: url('https://www.mauibnbguide.com/images/dinner-show-hula.jpg');}
#waterfall {background-image: url('https://www.mauibnbguide.com/images/haiku-maui-waterfall.jpg');}
#haiku {background-image: url('https://www.mauibnbguide.com/images/haiku-thistle-northshore.jpg');}
#red-sunset {background-image: url('https://www.mauibnbguide.com/images/upcountry-sunset694.jpg');}
#upcountry-map{background-image: url('https://www.mauibnbguide.com/images/upcountry-maui-map.jpg'); height:110vw;}
#kula{background-image: url('https://www.mauibnbguide.com/images/kula-forest-maui.jpg');}
#upcountry{background-image: url('https://www.mauibnbguide.com/images/kula-sunset-kihei.jpg');}
#hiking{background-image: url('https://www.mauibnbguide.com/images/hiking-maui-upcountry.jpg');}
#hana-map{background-image: url('https://www.mauibnbguide.com/images/map-maui-regions.jpg'); height: 50vw;}
#hana-maui{background-image: url('https://www.mauibnbguide.com/images/hana-red-ginger-maui.jpg');}
#hana-waterfall{background-image: url('https://www.mauibnbguide.com/images/hana-road-waterfall.jpg');}
#bamboo{background-image: url('https://www.mauibnbguide.com/images/hana-road-huelo-bamboo.jpg');}
#passion{background-image: url('https://www.mauibnbguide.com/images/pinkpassion-flower-maui.jpg'); /*width: 86vw; height: 56vw;*/}
#waianapanapa{background-image: url('https://www.mauibnbguide.com/images/waianapanapa-park-hana.jpg');height:40vw;}
#hyacinth {background-image: url('https://www.mauibnbguide.com/images/maui-water-hyacinth.jpg');}
#dining{background-image: url('https://www.mauibnbguide.com/images/maui-beach-dining-bkg.jpg');}
#koi-fish{background-image: url('https://www.mauibnbguide.com/images/hawaii-koi-fish.jpg'); margin-top:0.6rem;}
#baby-gecko{background-image: url('https://www.mauibnbguide.com/images/baby-gecko.jpg'); margin-top:0.6rem; height:7rem;}
#gecko{background-image: url('https://www.mauibnbguide.com/images/hawaii-gecko.jpg');}
#events{background-image: url('https://www.mauibnbguide.com/images/maui-swap-meet.jpg');}
#art{background-image: url('https://www.mauibnbguide.com/images/maui-artist-rik-fitch.jpg');}
#bnb-art{background-image: url('https://www.mauibnbguide.com/images/bed-and-breakfast-maui.jpg');}
#sunset{background-image: url('https://www.mauibnbguide.com/images/sunglass-sunset.jpg');}
#haiku-sunset{background-image: url('https://www.mauibnbguide.com/images/haiku-sunset-rentals.jpg');}
.packet {margin: 0 auto 0 7vw; display: inline-block;  text-align: center; overflow: hidden;
 padding: 1.4vw;}
.video {max-width:96%; margin: 2%;}
.element { position: relative; top: 50%; transform: translateY(-50%);}
.contact {font-size: 84%; font-weight: bold; color: #800000; padding-bottom: 12px;}
.contact a:hover {color: #000066;}
.maui-map {position: relative; padding-bottom: 75%; height: 0; overflow: hidden; margin: 4rem;}
.fifty {width: 60%;}
/* Expanding photo formatting */
/*a.p2 {text-decoration: none;position: relative;display: inline; text-align: left;top:-2vw;left:5vw; color: #f4ad03; font-size: 1.6rem;}*/
a.p2 {position: relative; left:1vw; }
a.p2 img {/*position: relative;*/ /*left: 5vw;*/}
a.p2 span{ /*display: block;*/}
a.p2:hover {color:#800000; z-index: 500;}
a.p2 b {display: block; position: absolute; left: -9999px; opacity: 0; border-radius: 3rem; transition: opacity 0.2s ease-in-out;}
a.p2:hover b {bottom:2.9rem; left:7rem; padding:5px; opacity: 1.0; transition-delay: 0.3s;}
a.p2:hover b img {width:70vw; margin-left: -7rem;border-radius: 3rem; border: solid medium #000066;}
/*expanding text box*/
a.fly2 {position: relative; left:9vw; top: -1.6vw; display: inline-block; text-align: left; color: #485ef4;}
a.fly2 span {/*font-size:1.6rem;*/}
a.fly2:hover {color:#800000; z-index: 500;}
/* Show the flyout text when you mouse over the flyout container */
a.fly2 b {display: block; position: absolute; width:200px; font-size:14px; left: -9999px; opacity: 0; border-radius:4rem; transition: opacity 0.2s ease-in-out;}
a.fly2:hover b {background-color:#000066;color:#f4ad03; text-align: center; bottom:2.9rem; left:0; opacity: 1.0; padding:6px 0 6px 0;}
.flyout {display: inline-block; margin-top:-1.2vw; } /*margin-left:4vw; width: 100%;*/
.flyout p{ }/*margin-left: 0;*/

.flyout2 {display: none; margin-top:-2vw; margin-left:4vw; width: 100%;}
.flyout2 p{ margin-left: 0;}
.inn-highlight{ margin: -0.2rem 0.8rem 0 0; display: none;}
.ad-inn-highlight{display: none;}
/*for the wide display*/
 .ad-choices {display: block; border: solid medium #800000; border-radius:3rem; margin:4vw; padding:4vw; text-align: left;}
/*narrow display*/
 .ad-choices2{display: block; border: solid medium #800000; border-radius:3rem;  padding: 3rem; text-align: left; margin:4vw 2vw;}
/* thin box*/
.ad-box{ display: block; border: solid medium #000066; border-radius:3rem; margin:0vw 8vw 4vw 8vw; text-align:center; background-color:#fff;}
.ad-box a{ color:#000066; font-weight: bold;} 
.grinds {margin: -0.2rem 0.8rem 0 0; width: 5rem;}
.biz-ad{margin:0 auto;width: 90%;}
.p-num{visibility: hidden; display:none;}
.note {font-style: italic; font-size: 90%; width:80%; text-align: center;}
.get-listed{width:20vw;border:medium solid #800000; border-radius:2rem; display: inline-block; padding: 0.1rem;margin-top:2vw;}
#form{margin:5vw auto 1vw auto; text-align:center; width: 96%;}
#yelp li {list-style: none;}
#bottom {margin:1rem auto;border: thin solid #000066; border-radius: 3rem; text-align:center; font-weight: bold; background: #fff; width:80%; padding:1rem;}
#bottom h5 {line-height: 1.6rem; text-align: center;}
#footer-ad {text-align: center; font-style: italic; line-height: 3;}
#footer {background: #f4ad03; width: 96%; display: block; padding-top:1vh; margin-left: auto; margin-right: auto; text-align: center; vertical-align:middle;}
#footer h3 { display: block; color: #800000;}
#footer h4 { display: block; color: #000066; font-size: 0.8em;}
#footer a{color: #800000;text-decoration:underline;}
.b-logo{width:50vw; height:10vw; border:thin solid #000066; border-radius:2rem; margin:2vw;}
#top a {color: #ffffff;}
#top a:visited {color:#485ef4; background-color:transparent; text-decoration:none;}
#top a:hover {font-weight: normal;}
.top {position: fixed; bottom:0.8vw; left:0.3rem; height: auto; z-index: 300; border: thin solid #800000; font-size: 1.6rem;}
#page-top{color: #000; font-weight: bold;}
}
@media (min-width: 500px) {
#business{display: none; visibility: hidden;}
#business-name{display: none; visibility: hidden;}
#business-logo{display: none; visibility: hidden;}
header {position:absolute; margin:3px 0 0 0; height:34px; overflow:hidden;}
#logo {display: inline-block; visibility:visible; float: left;}
#logo a img {border-radius: 1.8em; display: inline-block; visibility:visible;height:32px; }
#name h2 {font-size:30px;}
nav {position: relative;right:6px;}
#menu-wrapper {background-color: transparent; background-image: none; width:84%;}
#menu-wrapper ul {/*right:0; vertical-align:middle;*/ display: inline-block; /*float:right;*/}
#menu-wrapper ul li a {/*vertical-align:60%;*/ top: 0.2vw;}
.bubble {padding:5px; margin-top: 2px; font-size: 16px;}
#rental-jump {margin:1rem auto 0 auto;}
#title {margin-top:0rem; padding-top:4rem;}
.wrapper {margin:0 auto;}
#message {display: inline-block;}
#feature h3 {line-height: 2rem;}
#feature2 h3 {line-height: 2rem;}
.aside-pics {height:66vw;}
a.p2 img {width: 50px; float:left; margin:0.2vw 1vw auto 9vw;}
a.p2 span{display:inline-block; margin-left:2vw; vertical-align:-8px; text-align:right;}
.p-num{ visibility: visible; display: inline-block;}
.inn-highlight{width:90px; display: inline-block;}
.ad-inn-highlight{ /*margin: 0 2rem 0 2.6rem; */display: inline-block; width:90px; vertical-align: middle;}
}
@media (min-width: 690px) {
body{font-size:1.6rem;}
p{text-align:justify;}
#logo {/*left:-3vw;*/}
/*nav{width: 99%;}*/
#menu-wrapper{}
#menu-wrapper ul {text-align:right;}
/*.big-bkg-pics {height: 60vh;}*/
#map h3 {margin:2rem auto; font-size: 2.2rem; width: 84%;}
#map img { width:46%;}
#map-west img {width:42vw; margin:5vw 5vw 2vw 4vw;}
#upcountry-map{width:40vw; height:68vw;}
.area-map {float:right; position: relative;}
#aside {float: right; width:34%;}
.aside-pics {height:30vw;}
#aside ul {margin-top:0; position:relative; line-height: 1}
#aside ul li {max-width:96%}
#slider-space {height:1.6rem;}
#ad-section {margin: 1rem;}
#gallery {float:left; width:58%; margin: 1vw;}
.gal-l{ margin:3vw 3vw 4vw 3vw; }
.pic-l {}
#feature td {text-align:center; padding:0.4rem;}
#feature2 td {text-align:center; padding:0.4rem;}
.photo-c {width:90%;}
.photo-r {width: 60%;}
.content-wide {margin: 0 auto; display: block; overflow: hidden; width: 97%;}
a.p2:hover b img {width:60vw; margin-left: -7rem;}
.flyout p {width:84%;}
.b-logo{width:30vw; height:6vw; border-radius: 3rem;}
#bottom p {margin-bottom:-1rem;}
#hana-map{width:50vw;height:34vw;}
}
@media (min-width: 890px) {
html {font-size: 0.8rem;}
#logo {/*top: -0.4rem;*/ z-index: 10;}
/*#logo a img{margin:0.3rem 0 auto 5rem;width:16rem;height:2.5rem;}*/
#phrase{visibility: hidden; display: none;}
#name {display:inline-block; visibility: visible; margin-left:6px;}
#name h2 {visibility: visible; font-style: italic; display:inline-block; color: #f4ad03;/*font-size:24px; */}
#menu-wrapper {top:-32px;}
#menu-wrapper ul {/*margin-right:1vw;*/}
#menu-wrapper ul li{text-align: center; margin: 0;/*max-height:1.6rem;*/}
#menu-wrapper ul li a {font-size:1.3rem;}
.bubble{padding:3px 4px 5px 4px;}
#haiku-slide1 {visibility: hidden; display: none;}
#haiku-slide2 {display:block; visibility: visible;}
#rental-jump {margin:0.2rem auto 0 auto;}
/*#map img {float: right; margin:1vw 6vw 1vw 4vw; width:46%;}*/
#map-west img {/*width:38%;*/}
#title{width: 84%; margin: 0 auto;}
#mid-section {width: 80vw; margin: 0 auto;}
#aside {width:20%;margin-top: 2.4rem;}
#aside ul{position:relative; vertical-align: top; list-style: none inside;}
#aside h4{font-size:1.1em; line-height:0.8em;}
.aside-pics {height:12vw;}
.content-head {text-align: center; font-style: italic;}
.content-head h1 {text-align: center;}
.content-head h2 {font-size:3rem;}
.content-head h4 {text-align: center;}
.content-below p {margin: 1vw 6vw;}
.content-r {margin: 0 auto 5vh 4vw; display: inline-block;  text-align: center; overflow: hidden;background-color: #fff; border: solid medium #800000; border-radius:3rem; padding: 1.4vw;}
.wrapper {left: 1vw; width: 90%;  -webkit-transform-style: preserve-3d;  -moz-transform-style: preserve-3d;  transform-style: preserve-3d;}
.maui-towns {margin-bottom: 4rem;}
#gallery {width: 70%; float: left; margin: 2.4rem 0 2rem 1rem; padding: 3rem 0;}
#passion{width:52vw; height:40vw;}
.photo-c {width:76%;}
.photo-r {margin:1vw 5vw; width:50%;float: right;}
/*.big-bkg-pics {height:60vh;}*/
.top-photo {margin: 0.6rem 5vw;}
/*.gal-l{width: 94%;}*/
.col-first {width:26%;text-align:left;}
.col-second {width:32%;}
.col-town {width:18%;}
.col-three{width:24%;}
/*.inn-highlight{display:inline-block;}*/
#bottom p {margin-bottom:-2rem;}
}
@media (min-width: 1020px) {
#logo{/*left:-1.6vw; *//*top:-0.1vw;*/}
#logo a img{margin-left:1rem;}
#name{margin-top:0; margin-left:40px;}
#name h2{font-size: 30px;}
nav{top:0; right:8px;}
#menu-wrapper { width:80%;}
/*.bubble {font-size: }*/
#title {padding: 80px 0px 20px 0px;}
#title h2{font-size:4rem;}
#title h3{font-size:2.2rem;}
#rental-jump a {font-size: 12px;}
#map {vertical-align:top; }
#map h4 {margin:2vw 4.6vw;}
#map p {margin-top: 0;}
.area-map {margin:1vw 5vw 2vw 3vw;}
#hana-map {width:40vw; height:26vw;}
.top-photo {height:47vw; width:76vw; margin:2vw auto;}
#intro {width: auto; margin-top:2px;}
.content-wide {width:100%;}
a.p2 img{width: 66px;}
a.p2:hover b img {width:50vw; margin-left: -7rem;}
.ad-inn-highlight{/*left:7vw;*/position: relative;}
.ad-inn-span{position: relative; padding-top: 10px;}
.ad-choices {margin: 3vw 14vw; padding: 1vw 3vw; text-align: center;}
.ad-choices2{margin:2vw 10vw auto 10vw;}
.get-listed{width:12vw;margin-top:2vw;}
.b-logo{width:20vw; height:4vw}
.biz-ad{width:60%;}
.ad-box{width:60%; margin:1vw auto;}
.top {bottom:0.3vw; left:0.2rem; font-size:1.1rem;}
}
/*was (min-width: 1430px)*/
@media (min-width: 1670px) {
#logo a img{/*width: 120%;*/}
#menu-wrapper {/*top:-2.7rem;*/}
#haiku-slide2 {visibility: hidden; display: none;}
#haiku-slide3 {display:block; visibility: visible;}
#mid-section {width:76vw; margin: 0 auto;}
#aside {margin-right: 1.8rem;}
.photo-r {width:40%;}
a.p2:hover b img {width:30vw; margin-left: -7rem;}
.ad-inn-span{/*left:140px;*/}
/*.ad-choices{margin: 2rem 10rem;}*/
.ad-choices2{margin:2vw 46vw auto 5vw;}
#form{margin:3vw 0vw auto 1vw; width:45vw; float: right;}
#bottom{width:70vw;}
.inn-words{ font-size: smaller;}
.note {width:80%; margin:0 6vw; text-align: center;}
}
@media (min-width: 1910px) {
#logo a img{}
#name{ margin-top: -4px; margin-left: 180px;}
#name h2 {font-size:34px;}
#haiku-slide3 {visibility: hidden; display: none;}
#haiku-slide4 {display:block; visibility: visible;}
.top-photo {height:40vw; width:76vw; margin: 3vw 0 0 12vw;}
.big-bkg-pics {height:20vw; width:90%;}
#mid-section {width:70%;}
.ad-inn-highlight{margin-left:6rem;}
.ad-inn-span{left:190px;}
#aside {margin-top: 5rem;}
#bottom{width:70vw;}
.get-listed{width:9vw;margin-top:1vw;}
.b-logo{width:16vw; height:3vw;}
}