body {margin:0; padding:0; background:#C0E3EA; font-family: 'Lato', sans-serif; color:#333333; text-align:center;}

.container-fluid {max-width:1000px;}

#header {top:0; left:0; width:100%; z-index:99999;}

.navbar-default {background:#FFFFFF; border:0; padding:0; margin:0px 0 0px 0; border-bottom:1px solid #ececec;}
.navbar-brand {height: 100%; padding-top: 10px; padding-bottom: 10px;}
.navbar-right {margin: 0 0 0 0;}
.navbar-collapse {background:none; text-align:center;}
.navbar-collapse li {border-bottom:0px !important;}
.navbar-collapse a {color: #00273F !important; font-weight: normal; font-family: 'Merriweather', serif; margin:20px 0 20px 2px; padding:10px 11px 10px 11px !important;}
.navbar-collapse a:hover, .navbar-collapse a:active {background: #2289ab !important; color: #ffffff !important; font-weight: normal; border-radius:2px;} 
.navbar-collapse .book a {background:#fdfaf4; border-radius:2px;}

#banner-img {background-image:url(images/banner.jpg); background-size:cover; background-position:center; background-repeat:no-repeat; padding:100px 20px 300px 20px;}
#banner-img h1, #banner-img h3 {color:#08102A; text-align:center; font-weight:bold;}
#banner-img hr {border-color:#FFD700; width: 50%; margin-top:0; margin-bottom:0;}
.banner-box {background:rgba(255, 255, 255, 0.85); padding:10px 20px 10px 20px;}

.box {margin:30px; padding:50px; background:#FFFFFF;}

h1, h2, h3, h4, h5, h6 {color:#2289ab; font-family: 'Merriweather', serif;}
a {color:#2289ab;}
a:hover, a:focus {color:#0d5d77;}

.footer {border-top:2px solid #5b8c95; background:#75b4bf; margin:20px 0 0 0; padding:0 0 10px 0; }
.footer .row {margin:0 30px 0 30px;}
.footer .col-sm-4 {text-align:left; padding:5px 25px 5px 25px;}
.footer h5 {padding-bottom:5px !important; margin-bottom: 8px !important; border-bottom:1px solid #9bd3dd; color:#08102A;}
.footer a {font-weight:normal; color:#273c3f; font-weight:bold;}
.footer a:hover, .footer a:focus {color:#607175;}

.btn.btn-primary {background-color:#2289ab; border:none; border-bottom: 2px solid #0d5d77; text-align: center;}
.btn.btn-primary:hover, .btn.btn-primary.active {background-color: #a2adb7;}

img {margin-bottom:10px;}

.callbox {background:#00273F !important; border-radius:10px; color:#FFFFFF; padding:20px; margin:20px;}
.callbox a {color:#FFFFFF; font-weight: normal;}
.callbox h2, .callbox h3 {color:#FFFFFF;}

#directions p {text-align:left; font-size:95%;}
.indent {padding-left:40px; font-style:italic; color:#6c737a; font-size:90%;}
span.mile {background-color:#dff1f4; color:#6c737a !important; font-weight:bold; font-style:italic;}

.reviewbox .carousel-control.left, .reviewbox .carousel-control.right {width:25px; height:25px; color:#ffffff; background:#2289ab; opacity:1; text-shadow:none; margin:10px; border-radius:3px;}
.reviewbox .carousel-inner {padding: 0 55px 0 55px;}

.carousel-caption p {font-size:16px;}
.carousel-inner img {width: 100%;}
.slidebox {padding:0 25px 0 25px;}

thead {font-weight:bold; color:#2289ab;}

ul.locations {list-style:none; margin-bottom:30px; padding:0; background:#FFFFFF; border:1px solid #f4f4f4; font-size:12px;}
li.header {margin:0px; padding:10px; font-size:14px; color:#ffffff;}
li.details {margin:0px 20px 0px 20px; padding:8px 0px 10px 0px;}
li:not(:last-child){border-bottom: 1px solid #f9f9f9;}

#beach li.header {background:#87b5d7;}
#sidewalk li.header {background:#a9d174;}
#street li.header {background:#87a2d7;}
#other li.header {background:#87d7bc;}
#beyond li.header {background:#ffd381;}



.multi-item-carousel {
  overflow: hidden;
}
.multi-item-carousel img {
  height: auto;
  width: 100%;
}

.item__third:first-child, 
.item__third:last-child {
  display: none;
}

@media (min-width: 500px) {
  .multi-item-carousel .carousel-control.left, 
  .multi-item-carousel .carousel-control.right {
    background: rgba(255, 255, 255, 0.3);
    width: 25%;
  }
  .multi-item-carousel .carousel-inner {
    width: 150%;
    left: -25%;
  }
  .carousel-inner > .item.next, 
  .carousel-inner > .item.active.right {
    -webkit-transform: translate3d(33%, 0, 0);
    transform: translate3d(33%, 0, 0);
  }
  .carousel-inner > .item.prev, 
  .carousel-inner > .item.active.left {
    -webkit-transform: translate3d(-33%, 0, 0);
    transform: translate3d(-33%, 0, 0);
  }
  .item__third {
    display: block !important;
    float: left;
    position: relative;  /* captions can now be added */
    width: 33.33333333%;
  }
}