/* = Framework
----------------------------------------------------------------------------------------------------------------- */
.main { margin: 20px 0; }
.footer { padding: 20px 0; color: #fff; background: #75a28b; }
.inner { margin: 0 15px; }

/* = Page Templates
----------------------------------------------------------------------------------------------------------------- */
.zoneBanner { display: none; }
.zoneTwo h2 { display: block; padding: 5px 10px; color: #fff; background: #75a28b; }
.zoneTwo h2 a { display: block; color: #fff; }
.zoneTwo h3 { display: none; }

/* = Logo
----------------------------------------------------------------------------------------------------------------- */
.logo { margin: 0 0 20px; font-size: 0; text-align: center; }
.logo a { width: 290px; height: 64px; display: inline-block; background: url(/_img/logo-small.gif) no-repeat left top; }

/* = Social
----------------------------------------------------------------------------------------------------------------- */
.social { margin: 0; list-style: none; }
.social li { margin: 0 3px 0 0; float: left; background-image: url(/_img/sprite.png); }
.social li a { float: left; width: 37px; height: 31px; font-size: 0; }
.social li.facebook { background-position: 0 0; }
.social li.facebook:hover { background-position: 0 -31px; }
/* .social li.twitter { background-position: -47px 0; }
.social li.twitter:hover { background-position: -47px -31px; } */
.social li.twitter { background-image: url(/ugc-1/1/4/0/instagram.png?v2); }
.social li.twitter:hover { opacity: 0.8; }
.social li.tripAdvisor { background-position: -94px 0; }
.social li.tripAdvisor:hover { background-position: -94px -31px; }
.social li.tripAdvisor a { width: 50px; }

/* =  Check availability
----------------------------------------------------------------------------------------------------------------- */
.bandb a { padding: 5px 10px 7px; }

/* = Menus
----------------------------------------------------------------------------------------------------------------- */
.menuMobile { background: #75a28b; }
.menuMobile .triggerMenu { float: right; margin: 0 5px 0 0; padding: 20px 15px; font-size: 0; background: url(/_img/mobile/menu.gif) no-repeat center center; }
.menuMobile .close { background: url(/_img/mobile/cross.gif) no-repeat center center; }
.active { background: #225137; }

.menu { max-height: 0; overflow: hidden; background: #75a28b; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.menu .inner { margin: 0 auto; }
.extended { max-height: 400px; }

.menu ul { margin: 0; list-style: none; }
.menu ul li { margin: 0; border-bottom: 1px solid #a6c4b5; }
.menu ul li a { display: block; padding: 10px 15px; color: #fff; font-size: 1.1em; font-weight: normal; }
.menu ul li ul { display: none; }

.triggerSection { display: block; padding: 5px 10px; color: #fff; font-size: 1.3em; cursor: pointer; font-weight: bold; text-transform: uppercase; background: #75a28b url(/_img/mobile/section-menu.gif) no-repeat right center; }
.triggerSection:hover { color: #fff; }
.close { background-color: #225137; background-image: url(/_img/mobile/section-cross.gif); }

.subMenu { margin: 0 0 40px; }
.subMenu .open { display: block; }
.subMenu ul { display: none; margin: 0; list-style: none; }
.subMenu ul li a { display: block; font-weight: normal; color: #565959; }
.subMenu ul li a:hover { color: #75a28b; }
.subMenu ul li a.on { font-weight: bold; color: #565959; }

.subMenu ul li ul { margin-left: 20px; list-style-image: url(/_img/menu/green-arrow.gif); }
.subMenu ul li ul li a.on { color: #75a28b; }

.subMenuHeader { display: none; }

/* = CTAs
----------------------------------------------------------------------------------------------------------------- */
.ctas p { margin-bottom: 10px; }
.ctas ul { margin: 0 0 20px; list-style: none; }

.ctas .image { position: relative; margin-bottom: 10px; }
.ctas .image img { max-width: 100%; }
.ctas .image h2 { position: absolute; top: 15px; left: 0; }
.ctas .image h2 a { display: block; color: #fff; padding: 5px 20px 5px 10px; background: #75a28b; }

/* = Flexslider
----------------------------------------------------------------------------------------------------------------- */
.flexslider { margin: 0 0 20px; position: relative; background: url(/_img/loader.gif) no-repeat center center; }
.flexslider .slides { margin: 0; list-style: none; }
.flexslider .slides li { margin: 0; display: none; position: relative; }
.flexslider .slides li img { width: 100%; }
.flexslider .slides li:first-child { display: block; }
.flexslider .slides li .content { padding: 10px; position: absolute; bottom: 15px; left: 15px; background: url(/_img/lens.png) repeat top left; }
.flexslider .slides li .content h2 { font-size: 1.2em; margin: 0; color: #e07e00; }
.flexslider .slides li .content p { margin: 0; color: #fff; }

.flexslider .flex-direction-nav { display: none; }

.flexslider .flex-control-paging { margin: 0; list-style: none; }
.flexslider .flex-control-paging li { display: inline; margin: 0 5px 0 0; font-size: 0; }
.flexslider .flex-control-paging li a { width: 10px; height: 10px; display: inline-block; cursor: pointer; background: #75a28b; border-radius: 10px; }
.flexslider .flex-control-paging li a:hover { background: #5b8a72; }
.flexslider .flex-control-paging li .flex-active { background: #5b8a72; }

/* = Side Gallery
----------------------------------------------------------------------------------------------------------------- */
.spinner { margin-bottom: 10px; background-position: top center; }

/* = Amenities
----------------------------------------------------------------------------------------------------------------- */
.amenities { margin: 0; list-style: none; }
.amenities li { display: block; padding: 8px 0 8px 40px; margin: 0 0 20px; background-repeat: no-repeat; background-image: url(/_img/sprite.png?v2); }
.amenities li.wireless { background-position: 0 -144px; }
.amenities li.flatscreen { background-position: 0 -186px; }
.amenities li.hairdryer { background-position: 0 -354px; }
.amenities li.teaandcoffee { background-position: 0 -228px; }
.amenities li.sharedminifridge { background-position: 0 -312px; }
.amenities li.freeparking { background-position: 0 -270px; }
.amenities li.creamtea { background-position: 0 -396px; }

/* = Twitter Feed
----------------------------------------------------------------------------------------------------------------- */
.twitterFeed p { margin: 0 0 10px; }
.twitterFeed .date { font-size: 0.9em; color: #999; font-style: italic; }

/* = Calendar
----------------------------------------------------------------------------------------------------------------- */
.navigation { position: relative; z-index: 9999; }
.navigation a { width: 28px; height: 28px; float: left; display: inline-block; margin: 0; font-size: 0; position: absolute; top: 9px; }
.navigation .prevMonth { right: 45px; background: url(/_img/calendar/left-arrow.png) no-repeat left top; }
.navigation .prevMonth:hover { background: url(/_img/calendar/left-arrow-hover.png) no-repeat left top; }
.navigation .nextMonth { right: 10px; background: url(/_img/calendar/right-arrow.png) no-repeat left top; }
.navigation .nextMonth:hover { background: url(/_img/calendar/right-arrow-hover.png) no-repeat left top; }

.calendar { margin: 0 0 40px; }
.calendar ul { margin: 0; list-style: none; }
.calendar ul li { margin: 0; }

.calendar .year h2 { display: block; padding: 10px 15px; color: #fff; background: #75a28b; }
.calendar .week { width: 100%; float: left; }
.calendar .week .day { margin: -1px 0 0; padding: 5px 8px; border: 1px solid #ddd; background: #f0f0f0; }
.calendar .week .day h3 { text-transform: none; }
.calendar .week .day h4 { display: block; color: #fff; font-size: 1.1em; margin: 0 0 10px; padding: 5px 10px; }
.calendar .week .day .BreweryHouseSuite h4 { background: #86273b; }
.calendar .week .day .CottageSuite h4 { background: #225137; }

.calendar .week .noData { background: #fff; }
.calendar .week .noData h3 { font-size: 0.8em; }
.calendar .week .filler { display: none; }
.calendar .week .filler h3 { display: none; }

.keyChart { margin: 0 0 20px; }
.keyChart ul { margin: 0; list-style: none; }
.keyChart ul li { display: inline-block; color: #fff; margin: 0 10px 0 0; padding: 5px 10px; }
.keyChart .BreweryHouseSuite { background: #86273b; }
.keyChart .CottageSuite { background: #225137; }

/* = Footer
----------------------------------------------------------------------------------------------------------------- */
.footer a { color: #fff; font-weight: normal; }
.footer a:hover { color: #c2dace; }
.footer .title { margin: 0 0 10px; }
.footer p { margin: 0; line-height: 1.4em; }

.address { margin-bottom: 25px; }
.openingTimes { margin-bottom: 25px; padding-top: 25px; padding-bottom: 25px; border-top: 1px dashed #fff; border-bottom: 1px dashed #fff; }
.reviews { width: 153px; height: 63px; float: left; font-size: 0; background-position: 0 -72px; background-image: url(/_img/sprite.png); }

/* == Gallery lightbox
----------------------------------------------------------------------------------------------------------------- */
#jquery-overlay { position: absolute; top: 0; left: 0; z-index: 9999; width: 100%; height: 500px; }
#jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0; }
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#lightbox-container-image { padding: 10px; }
#lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none; }
#lightbox-nav-btnPrev,
#lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; }
#lightbox-nav-btnPrev { left: 0; float: left; }
#lightbox-nav-btnNext { right: 0; float: right; }
#lightbox-container-image-data-box { background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; }
#lightbox-container-image-data { padding: 0 10px; color: #666; }
#lightbox-container-image-data #lightbox-image-details { float: left; text-align: left; }
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; }
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; }

/* == 404 Error
----------------------------------------------------------------------------------------------------------------- */
.error .logo { margin-top: 20px; text-align: left; }

/* = Map
----------------------------------------------------------------------------------------------------------------- */
#map { width: 100%; height: 300px; margin: 0 0 20px; background: #eeebe2 url(/_img/map/loader.gif) no-repeat center center; }


/* == Media Queries
----------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 480px) {
    .logo a { width: 450px; height: 99px; background-image: url(/_img/logo-large.gif); }

    .colsFourth .col { width: 47%; float: left; margin-right: 15px; }
    .colsFourth .col:nth-child(2n), .colsFourth .col:nth-child(4n) { float: right; }
    .colsFourth .move,
    .colsFourth .endCol { margin-right: 0; }

    .ctas ul { margin-bottom: 40px; }

    .galleryList li { width: 48%; float: left; margin-right: 14px; }
    .galleryList li:nth-child(2n) { float: right; margin-right: 0; }

    .address { padding: 0 0 0 95px; background: url(/_img/logo-footer.gif) no-repeat top left; }
}

@media screen and (min-width: 600px) {
    .main { margin-top: 0; }

    .zoneBanner { display: block; position: relative; margin-bottom: 30px; }
    .zoneBanner img { width: 100%; }
    .zoneBanner .msg { background: #75a28b; color: #fff; }

    .menuFull { margin: 0; }

    .strapline { margin-left: -165px; padding: 20px; text-align: center; position: absolute; top: 12%; left: 50%; background: url(/_img/lens.png?v2) repeat top left; }
    .strapline h1 { color: #fff; line-height: 1em; margin-bottom: 5px; }
    .strapline p { color: #fff; margin-bottom: 0; font-size: 1.2em; }
    .comingSoon { width: 129px; height: 59px; margin-left: -80px; font-size: 0; background: url(/_img/bb-open-small.png) no-repeat top left; }

    .colsHalf .col { width: 47%; float: left; }
    .colsHalf .endCol { float: right; margin-right: 0; }

    .medObj .articleContainer { float: left; width: 74%; }
    .medObj .image { display: block; width: 24%; float: right; margin: 0 0 20px 2%; }
    .medObj .image img { max-width: 100%; }

    .amenities li { width: 220px; float: left; }

    #map { height: 450px; }
}

@media screen and (min-width: 730px) {
    .triggerSection { display: none; }

    .subMenu .open { display: block; }
    .subMenu ul { display: block; }

    .subMenuHeader { display: none; color: #fff; background: #225137; }
    .subMenuHeader ul { margin: 0; list-style: none; text-align: center; }
    .subMenuHeader li { margin: 0 15px 0 0; display: inline; }
    .subMenuHeader li a { display: inline-block; color: #fff; padding: 10px 0; font-weight: normal; }
    .subMenuHeader li a:hover { color: #abd1be; }
    .subMenuHeader li .on { font-weight: bold; }
    .subMenuHeader li:last-child { margin: 0; }
}

@media screen and (min-width: 768px) {
    .header { position: relative; z-index: 9997; }
    .header .bandb { margin-bottom: 0; }

    .zoneTwo h3 { display: block; padding: 5px 10px; color: #fff; background: #75a28b; }

    .colsHalf .col { width: 48%; }
    .colsFourth .col { width: 23.4%; }
    .colsFourth .col:nth-child(2n), .colsFourth .col:nth-child(4n) { float: left; }
    .colsFourth .move { margin-right: 15px; }

    .ctas .image h2 { font-size: 1.1em; }

    .galleryList li { width: 23.5%; }
    .galleryList li:nth-child(2n) { float: left; margin-right: 15px; }
    .galleryList li:nth-child(4n) { float: right; margin-right: 0; }

    .address { margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px dashed #fff; }
    .openingTimes { float: left; margin-bottom: 0; padding-top: 0; padding-bottom: 0; border-top: 0; border-bottom: 0; }
    .reviews { float: right; }

    .calendar .week { margin: -1px 0 0; border-left: 1px solid #ddd; }
    .calendar .week .day { width: 11.9%; float: left; height: 115px; border-top: 1px solid #ddd; border-right: 1px solid #ddd; border-left: 0; }
    .calendar .week .filler { display: block; }
}

@media screen and (min-width: 960px) {
    .menuMobile { display: none; }

    .menu { max-height: none; }
    .menu .inner { text-align: center; }
    .menu ul li { display: inline-block; border-bottom: 0; }
    .menu ul li a { padding: 10px 20px; line-height: 1.4em; height: 22px; }

    .menu { overflow: visible; }
    .menu ul li { position: relative; }
    .menu ul li a:hover { background: #63967c; }
    .menu ul li a.on { font-weight: 700; }
    .menu ul li .arrow { position: absolute; top: -6px; left: 10%; width: 15px; height: 6px; text-indent: -9999px; background: url(/_img/menu/white-arrow.png) no-repeat top left; }

    .menu ul li ul { width: 245px; display: inline; position: absolute; top: 42px; left: -99999px; padding: 15px 20px; text-align: left; background: #fff; -moz-box-shadow: 2px 2px 5px #ccc; -webkit-box-shadow: 2px 2px 5px #ccc; box-shadow: 2px 2px 5px #ccc; }
    .menu ul li ul li { display: block; }
    .menu ul li ul li a { display: block; color: #565959; padding: 5px 0; }
    .menu ul li ul li a:hover { background-color: #fff; float: none; display: block; color: #75a28b; }
    .menu ul li ul li ul { width: auto; display: inline; position: static; padding: 0; background: none; -moz-box-shadow: 0 0 0 #fff; -webkit-box-shadow: 0 0 0 #fff; box-shadow: 0 0 0 #fff; }
    .menu ul li ul li ul li a { padding: 5px 10px 5px 25px; background: url(/_img/menu/green-arrow.gif) no-repeat 10px center; }
    .menu ul li ul li ul li a:hover { background: url(/_img/menu/green-arrow.gif) no-repeat 10px center; }
    .menu ul li ul li .arrow { display: none; }
    .menu ul li:hover ul { left: 0; }
}

@media screen and (min-width: 1024px) {
    .zoneOne { width: 67%; float: right; }
    .zoneTwo { width: 30%; float: left; }

    .colsFourth .col { width: 23.8%; }

    .splitLeft { width: 65%; float: left; }
    .splitRight { width: 153px; float: right; }

    .ctas .image h2 { font-size: 1.3em; }

    .address { float: left; margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
    .openingTimes { width: 40%; margin: 0 0 0 60px; }

    .flexslider .flex-direction-nav { display: block; margin: 5px 0 0 0; list-style: none; position: absolute; top: -50px; right: 0; }
    .flexslider .flex-direction-nav li { display: inline; margin: 0 10px 0 0; }
    .flexslider .flex-direction-nav li a { display: inline-block; color: #fff; }

    .galleryList li { width: 23.4%; }
    .galleryList li:nth-child(4n) { float: left; }

    .subMenuHeader li { margin-right: 25px; }

    .calendar .week .day { width: 11.6%; }

    .strapline { width: 172px; margin-left: -120px; padding: 50px 35px; top: -8%; background: url(/_img/strapline.png?v2) no-repeat top left; }
    .comingSoon { height: 142px; background: url(/_img/bb-open.png) no-repeat top left; }

    .sideGallery .slides li img { cursor: pointer; }

    .popoutImage { display: none; position: fixed; top: 50%; left: 50%; z-index: 9999; padding: 10px; background: #fff; -moz-box-shadow: 0 0 10px #333; -webkit-box-shadow: 0 0 10px #333; box-shadow: 0 0 10px #333; }
    .popoutImage img { height: 400px; }
    .popoutImage p { display: block !important; margin: 5px 0 0; font-weight: bold; }
    .popoutImage .close { width: 40px; height: 40px; font-size: 0; display: block; cursor: pointer; position: absolute; top: -10px; right: -10px; background: url(/_img/popup-close.png?v2) no-repeat top left; }
    .popoutImage .scan { width: 25px; height: 25px; display: block; cursor: pointer; position: absolute; top: 50%; left: -15px; margin-top: -20px; }
    .popoutImage .scanNext { left: auto; right: -15px; }

    #fadeWrap { display: none; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 9998; }
    #fade { background: #000; position: fixed; width: 100%; height: 100%; left: 0; z-index: 9999; filter: alpha(opacity=50); opacity: .50; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; }
}

@media screen and (min-width: 1212px) {
    .inner { width: 1200px; margin-right: auto; margin-left: auto; }
    .templatePlain { text-align: center; }
    .zoneTwo h3 { display: none; color: #75a28b; padding: 0 0 10px; border-bottom: 1px solid #75a28b; background: none; }
    .subMenu { display: none; }
    .logo { margin: -15px 0 10px; }
    .menuFull { width: 100%; margin: 0; }
    .strapline { top: 15%; }
    .mod h3 { color: #75a28b; padding: 0 0 10px; border-bottom: 1px solid #75a28b; background: none; }
    .amenities li { width: 225px; }
    .calendar .week .day { width: 12%; }
    .calendar .week .day:last-child { width: 13.1%; }
    .popoutImage img { height: auto; }
}
