/* Running Squiz Matrix Developed by Squiz - http://www.squiz.net Squiz, Squiz Matrix, MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd Page generated: 26 August 2023 04:33:31 */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* GOOGLE FONTS */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* light */ a, .homepageIntro span { font-family: 'Open Sans', sans-serif; font-weight: 300; } /* normal */ body, #footerContainer h2, .getActiveTextIntroContainer .smallText, #shopBasket #onlineShopCheckout tfoot td > span.chosenOnlineOrderPostageOption, .menu a { font-family: 'Open Sans', sans-serif; font-weight: 300; } /* semi-bold */ h2, .siteMenu li a, .siteMenu li a span, .largeSpotlight h2, .twitter h2, .smallSpotlight h2, .additionalInfo h2, .pageContent h2, .sideMenu li a, .standardLanding h3, .listingTemplate #eventsFilter .formTitle, .listingTemplate #eventsFilter .filterContainer label, .pageContent form input[type=submit], .postMetaContainer p > span, #contentContainer #shopListingItems .purchaseContainer p span, #contentContainer #shopListingItems .purchaseContainer p, #contentContainer #shopListingItems .purchaseContainer label, #shopBasket #onlineShopCheckout tbody .purchaseContainer label, #shopBasket #onlineShopCheckout tbody .price, #shopBasket #onlineShopCheckout tfoot label, #shopBasket #onlineShopCheckout tfoot span, #shopBasket #onlineShopCheckout tbody .purchaseContainer > span, #shopBasketWidget #basketSummary tfoot span.basketTotal, #shopBasketWidget #basketSummary tbody .price .priceValue, #shopBasket h2 { font-family: 'Open Sans', sans-serif; font-weight: 600; } /* bold - extra slidecontent style added by DH*/ h1, .twitter .greyContainer > a, #footerContainer .map p, .homepageIntro h1, .retailCarousel .retailSlides .slideContent h2, .retailCarousel .retailSlides .slideContent span, .retailCarousel .retailSlides .slideContent span a, .contentHeader h1, .openMobMenu, .closeMobMenu, .gridSpotlight .textContainer .spotlightTitle, .scroll-content-item .galleryOption .spotlightTitle, .getActiveTextIntroContainer .largeText, .greenTitle, .greyTitle, .blueTitle, .redTitle, .ctaLink .textContainer span.text, .listingTemplate #listing li .textContainer h3 a, .shopLanding .halfSpotlight .textContainer h3, .shopLanding .largeSpotlight .textContainer h3, #shopMenu .shopInfo span, #shopMenu .shopCheckoutBtn, #shopBasket #onlineShopCheckout tfoot span.basketTotal, #shopBasketWidget #basketSummary tfoot span.basketTotal .basketTotalCost { font-family: 'Open Sans', sans-serif; font-weight: 700; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Default global styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ ::-moz-selection { background: #8d395b; color: #fff; text-shadow: none; } ::selection { background: #8d395b; color: #fff; text-shadow: none; } /* old anchor colour with insufficient contrast at low font size a { color: #2e729f; display: inline-block; } */ a { color: #265D82; display: inline-block; } a:hover { color: #8f395c; } /* a:visited { color: #2f729f; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } */ h1 { } h2 { margin: 0 0 20px 0; } h3 { } h4 { } p { margin: 0 0 15px 0; line-height: 1.6em; } ul, ol { margin: 0; padding: 0; list-style-type: none; } ul li, ol li { margin: 0 0 5px 0; } input[placeholder], /*label.placeHolderHack { color: #949797; }*/ label.placeHolderHack { color: #333; } label.placeHolderHack { position: absolute; z-index: 100; top: 8px; left: 8px; } input:invalid, textarea:invalid { background-color: #fff; } input[type=text], textarea { -webkit-appearance: none; -webkit-border-radius: 0px; border: 1px solid #c9c9c9; } input[type=email] { border: 1px solid #c9c9c9; } /* input:focus { border: 0; } */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Helpers / reusable classes */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* mobile / desktop layouts */ .forMobile { display: block; } .forDesktop { display: none; } /* blocks */ .row { margin: 0 0 25px 0; clear: both; position: relative; overflow: hidden; } .imgContainer { } .imgContainer img { width: 100%; height: auto; margin: 0 !important; } .textContainer { } .homepage { } .internal { } /* spacing */ .mobileBottomMargin { margin-bottom: 25px; } .mobileRightMargin { margin-right: 10%; } /* positioning */ .floatLeft { } .mobileFloatLeft { float: left; } .floatRight { float: right; } .dockToBottom { position: absolute; bottom: 0px; right: 10px; margin: 0 0 10px 0 !important; } .relativeContainer { position: relative; } .hiddenLabel { display: none; } /* generic classes */ .hidden { display: none; } .show { display: block !important; } .overflow-visible { overflow: visible !important; } /* links */ .blueMoreLink { font-family: Arial, sans-serif; position: absolute; bottom: 20px; right: 15px; display: inline-block; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0041/98987/arrow-small-blue-right.png?v=0.0.2') 100% 3px no-repeat; padding: 0 15px 0 0; } .blueArrowLink { margin: 0; line-height: 1.6em; font-family: 'Open Sans', Arial, sans-serif; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0041/98987/arrow-small-blue-right.png?v=0.0.2') 100% 6px no-repeat; padding: 0 10px 0 0; } .twitterLink { position: relative; text-indent: -99999px; width: 22px; height: 22px; margin: 0 0 0 4px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0030/99039/icon-twitterLogo.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .twitterLink:hover { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0022/99040/icon-twitterLogo-hover.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .facebookLink { position: relative; text-indent: -99999px; width: 22px; height: 22px; margin: 0 0 0 4px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0020/99020/icon-facebookLogo.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .facebookLink:hover { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0021/99021/icon-facebookLogo-hover.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .googleplusLink { position: relative; text-indent: -99999px; width: 22px; height: 22px; margin: 0 0 0 4px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0022/99022/icon_googleplus_Logo.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .googleplusLink:hover { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0023/99023/icon_googleplus_Logo_hover.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .instagramLink { position: relative; text-indent: -99999px; width: 22px; height: 22px; margin: 0 0 0 4px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0024/99024/icon_instagram_Logo.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .instagramLink:hover { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0025/99025/icon_instagram_Logo_hover.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } /* list style types */ .standardLanding .blueBulletList { margin: 0; padding: 0; } .standardLanding .blueBulletList li { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0024/99015/icon-bullet-blue.png?v=0.0.1') 0 11px no-repeat; padding: 0 0 0 20px; margin: 0 0 0px 0; } .standardLanding .blueBulletList li a { text-decoration: underline; font-family: Arial, sans-serif; display: inline-block; line-height: 1.5em; } .standardLanding .blueBulletList li a:hover { } .standardLanding .documentDownloadList { margin: 0; padding: 0; } .standardLanding .documentDownloadList li { padding: 0 0 0 28px; margin: 0; } .standardLanding .documentDownloadList li.icon-pdf { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0021/99030/icon-pdf.png?v=0.0.1') 0 7px no-repeat; } .standardLanding .documentDownloadList li a { font-family: Arial, sans-serif; text-decoration: underline; line-height: 1.5em; display: inline-block; } .standardLanding .documentDownloadList li a:hover { } .standardLanding .documentDownloadList li span { display: inline-block; font-family: Arial, sans-serif; } .standardLanding .documentDownloadList li span.fileSize { color: #000; } #pageContainer .blueSubmit { padding: 9px 47px 8px 21px; border: none; font-weight: normal; font-size: 1em; margin: 0; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0021/99003/btn-basket.png?v=0.0.1') 100% 50% no-repeat; } #pageContainer .blueSubmit:hover { text-decoration: underline; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Header styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ #headerContainer { background: #fff; padding: 20px; position: relative; /* overflow: hidden; */ } .siteLogoLink { width:35%; } .siteLogo { width: 100%; height: auto; } .headerLinks { } .headerLinks li { display: inline-block; float: left; } .headerLinks li a { text-decoration: none; color: #747579; } .headerLinks li a:hover { text-decoration: underline; } #siteSearch { border: 1px solid #dddede; box-shadow: grey 0px 0px 6px -2px; } #siteSearch label { } #siteSearch label.placeHolderHack { top: 4px; left: 4px; } #siteSearch input[type=text] { border: 0; -webkit-appearance: none; line-height: 1.45em; padding: 3px; } #siteSearch input[type=submit] { background: #565656 url('https://www.peakdistrict.gov.uk/__data/assets/image/0024/99033/icon-search.png?v=0.0.1') 0 0 no-repeat; font-size: 0em; border: 0; height: 23px; width: 24px; padding: 0; margin: 0; vertical-align: top; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Top Nav styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ #topnav { background: #fff; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Content blocks */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Main Content area */ #contentContainer { background: #fff url('https://www.peakdistrict.gov.uk/__data/assets/image/0025/99007/content-bg-mobile.png?v=0.0.1') 100% 100% no-repeat;} #contentContainer.homepage { padding: 25px 25px 150px 25px; } #contentContainer.internal { padding: 0 0 140px 0; position: relative; overflow: hidden; } #contentContainer.internal .constraint { margin: 15px; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Homepage spotlight styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* carousel spotlight */ .carousel { position: relative; margin: 0 0 25px 0; } .spotLightCarousel { width: auto; margin: 1%; height: auto; position: relative; overflow: hidden; border: 1px solid #fff; box-shadow: grey 0px 0px 2px 0px; } .carouselSlide { width: 100%; height: auto; position: relative; } .carouselSlide > a { position: relative; display: block; text-decoration: none; } .carouselSlide > a p { text-decoration: none !important; } .carouselSlide .slideImgContainer { width: 100%; height: auto; } .carouselSlide .slideImgContainer img { width: 100%; height: auto; } .carouselSlide .slideTextContainer { position: absolute; bottom: 0; left: 0; width: 90%; padding: 5%; z-index: 200; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0020/99011/homepage-carousel-text-bg.png?v=0.0.1') 0 0 repeat; } .carouselSlide .slideTextContainer p { color: #fff; font-size: 1.2em; margin: 0 0 5px 0; } .carouselSlide .slideTextContainer span { color: #fff; text-decoration: none; } .carouselLink { text-decoration: underline !important; } .carouselPagination { position: absolute; top: 10px; right: 2px; overflow: hidden; width: 66px; margin: 0 auto; z-index: 100; } .carouselPagination a { width: 11px; height: 11px; position: relative; text-indent: -9999px; overflow: hidden; float: left; display: block; margin: 0 5px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0023/99005/carousel-nav-on.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .carouselPagination a:hover { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0023/99005/carousel-nav-on.png?v=0.0.1') 0 0 no-repeat; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } .carouselPagination a.cycle-pager-active { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0023/99005/carousel-nav-on.png?v=0.0.1') 0 0 no-repeat; } /* large spotlight */ .largeSpotlight { } .largeSpotlight .imgContainer { width: 100%; float: left; } .largeSpotlight .textContainer { width: auto; padding: 20px 20px 45px; float: left; } /* smallSpotlight */ .smallSpotlight { } .smallSpotlight .imgContainer { width: 30%; float: left; } .smallSpotlight .textContainer { float: left; width: 65%; padding: 0 0 20px 5%; } /* twitter spotlight */ .twitter { position: relative; margin: 0 0 25px 0; } .twitter h2 { display: inline-block; float: left; } .twitter .greyContainer { clear: both; } .twitter .greyContainer > a { font-size: 1.2em; color: #000; text-decoration: none; } .twitter .greyContainer > a span { font-size: 0.8em; color: #666 !important; } .tweet { margin: 15px 0 0 0; } .tweet .imgContainer { width: 10%; float: left; } .tweet .textContainer { float: left; width: 80%; padding: 0 0 0 7%; word-break: break-word; } .tweet .tweetMeta { display: block; clear: both; text-align: right; margin: 10px 0 0 0; } .tweet .tweetMeta span { display: inline-block; margin: 0 0 0 10px; } .twitterTail { margin: -1px 0 0 30px; position: relative; z-index: 100; width: 43px; height: 23px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0031/99049/twitter-tail.png?v=0.0.1') 0 0 no-repeat; } /* shared */ .smallSpotlight .greyContainer, .twitter .greyContainer { padding: 20px 15px; } .twitter h2, .smallSpotlight h2 { color: #8d395b; } .largeSpotlight .textContainer, .largeSpotlight .textContainer a, .smallSpotlight .textContainer, .smallSpotlight .textContainer a, .tweet .textContainer, .tweet .tweetMeta, .tweet .textContainer a { font-family: Arial, sans-serif; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Footer styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ #footerBackground {background: #8d395b; width: 100%;} #footerContainer { padding: 10px 0 50px; color: #fff; /* background: #8d395b; */ } #footerContainer a { color: #fff; text-decoration: none; display: inline; word-break: break-all; } #footerContainer a:hover { text-decoration: underline; } /* links */ #footerContainer .links { } /* address */ #footerContainer .address { padding: 15px; word-wrap:break-word; position: relative; } #footerContainer .address h2 { width: 126px; float: left; } #footerContainer .address .footerSocialLinks { float: left; } #footerContainer .address .footerSocialLinks li { float: left; margin: 0 5px; background: transparent !important; } #footerContainer .address .footerSocialLinks li a { display: block; width: 23px; height: 21px; position: relative; text-indent: -99999px; } #footerContainer .address .footerSocialLinks li.twitterLink a { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0027/99036/icon-social-footer-twitter.png?v=0.0.1') 0 0 no-repeat; } #footerContainer .address .footerSocialLinks li.facebookLink a { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0025/99034/icon-social-footer-facebook.png?v=0.0.1') 0 0 no-repeat; } #footerContainer .address .footerSocialLinks li.youtubeLink a { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0028/99037/icon-social-footer-youtube.png?v=0.0.1') 0 0 no-repeat; } #footerContainer .address .footerSocialLinks li.googleLink a { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0026/99035/icon-social-footer-googleplus.png?v=0.0.1') 0 0 no-repeat; } #footerContainer .address .footerSocialLinks li.instagramLink a { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0029/99038/icon-social-footer-instagram.png?v=0.0.1') 0 0 no-repeat; } #footerContainer .address .addressDetails { clear: both; } /* map */ #footerContainer .map { position: relative; } #footerContainer .map a { word-break: normal; } #footerContainer .map p { position: absolute; top: 113px; left: 121px; width: 100px; } #footerContainer .map img { position: absolute; top: -20px; left: 128px; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Homepage banner styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ #homepageBanner { border-bottom: 1px solid #c6c9cb; background: #ececec; overflow: hidden; position: relative; } #homepageBanner .constraint { position: relative; padding: 10px; } .backgroundBanner { width: 100%; height: auto !important; position: absolute; top: -23px; min-height: 350px; min-width: 527px; } .homepageIntro { position: relative; overflow: hidden; color: #fff; margin: 25px 0 15px 4%; width: 70%; padding: 10px 3%; /* border: 1px solid #514d4d; */ background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0039/98985/homepage-intro-bg.png?v=0.0.2') 0 0 repeat-x; box-shadow: #000 0px 0px 10px 0px; } .homepageIntro h1 { text-transform: uppercase; font-size: 1.3em; margin: 0; padding: 0; } .homepageIntro > span { text-transform: uppercase; font-size: 1.3em; } .homepageIntro p { margin: 10px 0 16px; font-family: Arial, sans-serif; } .homepageIntro a.cta { color: #fff; background: #984d6b; background: -moz-linear-gradient(top, #984d6b 0%, #7f3452 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#984d6b), color-stop(100%,#7f3452)); background: -webkit-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: -o-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: -ms-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: linear-gradient(to bottom, #984d6b 0%,#7f3452 100%); } .homepageIntro a.cta > span.text { padding: 10px; display: inline-block; width: 91px; } .homepageIntro a.cta > span.arrow { display: inline-block; padding: 10px 0; border-left: 1px solid #fff; background: #575757; background: -moz-linear-gradient(top, #575757 0%, #3d3d3d 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#575757), color-stop(100%,#3d3d3d)); background: -webkit-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: -o-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: -ms-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: linear-gradient(to bottom, #575757 0%,#3d3d3d 100%); } .homepageIntro a.cta > span.arrow > span { padding: 9px 17px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0036/98991/arrow-carousel-white-right.png?v=0.0.1') 50% 50% no-repeat; } .homepageIntro a.cta:hover .text { text-decoration: underline; } .bannerStripe { margin: -102px 0 0 0; height: 105px; background: #ececec; border-top: 1px solid #a5a6a5; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Homepage retail Carousel styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ .retailCarouselContainer { position: relative; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0021/99012/homepage-retail-carousel-bg.png?v=0.0.1') 0 0 repeat; margin: 0 auto; padding: 5px 3%; width: 94%; } .retailCarousel { } .retailCarousel .retailSlideGroup { position: relative; overflow: hidden; } .retailCarousel .retailSlides { float: left; margin: 3% 2%; width: 96%; height: auto; background: #fff; border: 1px solid #fff; position: relative; box-shadow: black 0px 0px 5px -1px; } .retailCarousel .retailSlides .imgContainer { } .retailCarousel .retailSlides .imgContainer img { } /*fix for carousel image links on mobile homepage DH*/ .retailCarousel .retailSlides .imgContainer a { width: 100%; height: auto; margin: 0 !important;} .retailCarousel .retailSlides .slideContent { padding: 10px; position: relative; } .retailCarousel .retailSlides .slideContent h2 { color: #8d395b; text-transform: uppercase; font-size: 1em; padding: 0 0 0 20px; margin: 0 0 5px 0; line-height: 1.6em; } /*additional line added for a - dh 3/10/14*/ .retailCarousel .retailSlides .slideContent span, .retailCarousel .retailSlides .slideContent span a { color: #231f20; font-size: 1.3em; text-decoration: none!important;} .retailCarousel .retailSlides .slideContent p { color: #231f20; font-family: Arial, sans-serif; } .retailCarousel .retailSlides .slideContent a { display: inline-block; font-family: Arial, sans-serif; } .retailCarousel .retailSlides .slideContent .socialContainer { position: absolute; top: 9px; right: 10px; } /* different icon headings */ .retailCarousel .retailSlides .slideContent h2.do { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0027/99018/icon-do.png?v=0.0.1') 0 50% no-repeat; } .retailCarousel .retailSlides .slideContent h2.visit { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0022/99031/icon-places.png?v=0.0.1') 0 50% no-repeat; } .retailCarousel .retailSlides .slideContent h2.events { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0028/99019/icon-events.png?v=0.0.1') 0 50% no-repeat; } .retailCarousel .retailSlides .slideContent h2.help { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0026/99026/icon-help.png?v=0.0.1') 0 50% no-repeat; } /*classes for new icons - DH 14/1/15*/ .retailCarousel .retailSlides .slideContent h2.news { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0026/99053/icon-news.png?v=0.0.1') 0 50% no-repeat; } .retailCarousel .retailSlides .slideContent h2.shop { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0027/99054/icon-shop.png?v=0.0.1') 0 50% no-repeat; } /* new donate metadata option awaiting new icon 22/9/15 DH */ .retailCarousel .retailSlides .slideContent h2.donate { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0028/99055/icon-donate.png?v=0.0.1') 0 50% no-repeat;} /* new draft cycle icon 28/10/15 DH */ .retailCarousel .retailSlides .slideContent h2.cycle { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0029/99056/icon-cycle.png?v=0.0.1') 0 50% no-repeat; } /* next /prev buttons */ .carouselNext, .carouselPrev { position: absolute; top: 124px; text-indent: -9999px; padding: 0 12px 10px; background: #984d6b; background: -moz-linear-gradient(top, #984d6b 0%, #7f3452 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#984d6b), color-stop(100%,#7f3452)); background: -webkit-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: -o-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: -ms-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: linear-gradient(to bottom, #984d6b 0%,#7f3452 100%); } .carouselNext { right: -12px; } .carouselPrev { left: -12px; } .carouselNext span, .carouselPrev span { display: block; width: 8px; height: 15px; margin: -5px 0 0 0; } .carouselNext span { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0036/98991/arrow-carousel-white-right.png?v=0.0.1') 0 0 no-repeat; } .carouselPrev span { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0035/98990/arrow-carousel-white-left.png?v=0.0.1') 0 0 no-repeat; } /*---------------------------------------------------------------------------------------------------------------------------------------*/ /* Internal page styles */ /*---------------------------------------------------------------------------------------------------------------------------------------*/ .bannerContainer { position: absolute; top: -60px; height: 780px; overflow: hidden; width: 100%; } .photoContainer { width: 100%; } .photoContainer img { width: 100%; min-height: 600px; min-width: 903px; } .photoStripe { height: 48px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0023/99041/internal-banner-stripe-bg.png?v=0.0.1') 0 0 repeat; position: absolute; top: 552px; width: 100%; } .contentWrapper { background: #fff; position: relative; overflow: hidden; padding: 10px; } .leftSide { float: left; } .rightside { } .contentHeader { margin: 0 0 20px 0; position: relative; } .contentHeader h1 { font-size: 2.6em; color: #8d395b; margin: 0 0 10px; } .contentHeader .imgContainer { width: 100%; overflow: hidden; } .pageContent { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0028/99046/sideNav-border.png?v=0.0.1') 0 100% repeat-x; padding: 0 0 20px 0; margin: 0 0 30px 0; } .pageContent.landingTemplates, .pageContent.shopLanding { background: none; padding: 0; } .additionalInfo { word-wrap:break-word; } .additionalInfo h2 { color: #8d395b; } .additionalInfo ul { margin: 0 0 30px 0; } .additionalInfo ul li { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0024/99015/icon-bullet-blue.png?v=0.0.1') 0 3px no-repeat; padding: 0 0 0 15px; font-family: Arial, sans-serif; } .additionalInfo ul li a { font-family: Arial, sans-serif; display: inline; word-break: break-all; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // resuable spotlights -----------------------------------------------------------------------------------------------------------------------------------------------------*/ /* grey border / white background */ .greyContainer { background: #ececec; border: 1px solid #d6d6d6; position: relative; overflow: hidden; } .greyContainer ul li { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0024/99015/icon-bullet-blue.png?v=0.0.1') 0 3px no-repeat !important; padding: 0 0 0 15px !important; } /* dark grey border / grey background */ .darkGreyContainer { border: 1px solid #d6d6d6; background: #ececec; padding: 1px; } /* grey border / grey background */ .whiteContainer { background: #fff; border: 1px solid #d6d6d6; position: relative; overflow: hidden; } /* grey border / red background */ .redContainer { background: #8d395b; border: 1px solid #d6d6d6; position: relative; overflow: hidden; } .redContainer p { color: #fff; } .redContainer ul { margin: 0 !important; } .redContainer ul li { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0025/99016/icon-bullet-white.png?v=0.0.1') 0 3px no-repeat !important; padding: 0 0 0 15px !important; margin: 0 0 5px 0 !important; } .redContainer ul li a { color: #fff; } .redContainer ul li a:hover { text-decoration: none; } /* colored titles */ .greenTitle { background: rgba(106, 134, 11, 0.8); } .blueTitle { background: rgba(21, 104, 159, 0.8); } .greyTitle { background: rgba(58, 61, 59, 0.8); } .redTitle { background: rgba(141, 57, 91, 0.8); } .ie8 .greenTitle { background: #6a860b; } .ie8 .blueTitle { background: #15689f; } .ie8 .greyTitle { background: #3a3d3b; } .ie8 .redTitle { background: #8d395b; } .inlineTitle { display: inline-block; } .fullWidthTitle { display: block; } .inlineTitle, .fullWidthTitle { padding: 10px 20px 10px 10px; color: #fff; /* text-transform: uppercase; */ font-size: 1.2em; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // breadcrumb nav -----------------------------------------------------------------------------------------------------------------------------------------------------*/ #breadcrumbContainer { position: relative; overflow: hidden; margin: 20px 0; width: 100%; } #breadcrumbContainer p { display: inline-block; float: left; margin: 0; padding: 0; font-weight: bold; } #breadcrumb { float: left; list-style-type: none; padding: 0; } #breadcrumb li { float: left; padding: 0 15px 0 0; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0041/98987/arrow-small-blue-right.png?v=0.0.2') 100% 50% no-repeat; margin: 0 11px 0 0; font-family: Arial, sans-serif; } #breadcrumb li.last { background: 0; } #breadcrumb li a { display: block; text-decoration: none; font-family: Arial, sans-serif; } #breadcrumb li a:hover { text-decoration: underline; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Page content styling overides -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .pageContent { font-family: Arial, sans-serif; } .pageContent h1 { color: #f0358c; border-bottom: 0; } .pageContent h2 { color: #8d395b; margin: 10px 0 15px 0; } .pageContent h3 { color: #666666; margin: 10px 0 15px 0; } .pageContent h4 { color: #666666; } .pageContent p { } .pageContent p a { display: inline; } .pageContent img { margin: 0 0 15px 0; /* 4/7/17 DH - img width fix for mobile */ max-width: 100%; height: auto; border: 0px solid red;} /* .pageContent a { display: block; margin: 5px 0; font-family: Arial, sans-serif; } */ .pageContent a { display: block; margin: 0; font-family: Arial, sans-serif; } .pageContent a:hover { text-decoration: underline; } /*.pageContent ul { clear: both; margin: 20px 0 10px 10px; padding: 0; list-style-type: none; position: relative; overflow: hidden; }*/ .pageContent ul { clear: both; margin: 20px 0 10px 10px; padding: 0; list-style-type: none; position: relative; } .pageContent ul > li { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0024/99015/icon-bullet-blue.png?v=0.0.1') 0 4px no-repeat; padding: 0 0 0 20px; margin: 0 0 10px 0; } .pageContent ul > li a { display: inline; } .pageContent ul > li img {vertical-align: text-top; } .pageContent ol { clear: both; margin: 20px 0 10px 0px; padding: 0 0 0 31px; position: relative; overflow: hidden; list-style-type: decimal; } .pageContent ol > li { padding: 0 0 0 5px; margin: 0 0 10px 0; } .pageContent ol > li a { display: inline; } .pageContent ol > li img {vertical-align: text-top; } .pageContent table { border-bottom: 1px solid #e5e5e5; margin: 20px 0; } .pageContent table th { } .pageContent table tr.odd { } .pageContent table tr.even { background: #e5eff8; } .pageContent table td { padding: 10px 20px; } .pageContent table td.left { } .pageContent table td.right { } .pageContent table tf { } .pageContent img.alignright, .pageContent img.alignleft, .pageContent img.aligncenter { padding: 11px; } .pageContent img.alignright { float: right; margin: 0; } .pageContent img.alignleft { float: left; margin: 0; } .pageContent img.aligncenter { display: block; clear: both; margin-left: auto; margin-right: auto; } .pageContent table.alignright { float: right; margin: 5px 0 5px 5px; } .pageContent table.alignleft { float: left; margin: 5px 5px 5px 0; } .pageContent table.aligncenter { clear: both; margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 5px; } .pageContent form { background: #f2f2f0; padding: 10px 10px 15px 10px; } .pageContent form label { display: inline-block; margin: 0 0 5px 0; } .pageContent form span { display: inline-block; margin: 0 0 0 5px; } .pageContent form select { display: block; margin: 0 0 20px 0; } .pageContent form textarea { display: block; margin: 0 0 20px 0; } .pageContent form input { display: block; margin: 0 0 20px 0; } .pageContent form input[type=text] { } .pageContent form input[type=submit] { clear: both; float: right; margin: 20px 0 0; outline: none; border: 1px solid #e0e1e0; color: #fff; font-weight: bold; font-size: 1.2em; background: #545454; box-shadow: 0px; -webkit-transition: background 0.1s, box-shadow 0.1s; -moz-transition: background 0.1s, box-shadow 0.1s; -o-transition: background 0.1s, box-shadow 0.1s; transition: background 0.1s, box-shadow 0.1s; } .pageContent form input[type=submit]:focus, .pageContent form input[type=submit]:hover { background: #8d395b; box-shadow: black 0px 0px 6px -2px; -webkit-transition: background 0.3s, box-shadow 0.3s; -moz-transition: background 0.3s, box-shadow 0.3s; -o-transition: background 0.3s, box-shadow 0.3s; transition: background 0.3s, box-shadow 0.3s; } /* validation required indicator */ .pageContent form .formRequiredIndicator { display: inline-block; color: red; font-weight: bold; margin: 0 0 0 10px; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Visiting landing -----------------------------------------------------------------------------------------------------------------------------------------------------*/ #cyclingSpotlight.marginRight { margin-right: 0; } #eventsSpotlight .textContainer .date { margin: 0 0 5px 0; display: block; font-family: Arial, sans-serif; font-style: italic; } #eventsSpotlight .textContainer .blueArrowLink { margin: 0; line-height: 1.6em; font-family: Arial, sans-serif; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // SPOTLIGHTS -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .twoThirdSpotlight { width: 100%; } .twoThirdSpotlight .imgContainer { width: 100%; } .twoThirdSpotlight .textContainer { padding: 20px; } .oneThirdSpotlight { width: 100%; } .oneThirdSpotlight .imgContainer { width: 99.5%; border: 1px solid #fff; } .oneThirdSpotlight .textContainer { padding: 0 20px 20px 20px; position: relative; overflow: hidden; } .fourGridSpotlights { position: relative; overflow: hidden; } .fourGridSpotlights > a { text-decoration: none; display: block; float: left; margin: 0; width: 50%; } .fourGridSpotlights > a:hover { text-decoration: none; } .gridSpotlight { border-right: 1px solid #fff; border-top: 1px solid #fff; } .gridSpotlight .imgContainer { width: 100%; } .gridSpotlight .textContainer .spotlightTitle { display: block; background: #414141 url('https://www.peakdistrict.gov.uk/__data/assets/image/0038/98993/arrow-large-white-right.png?v=0.0.1') 94% 50% no-repeat; padding: 10px; color: #fff; } .halfSpotlight { position: relative; } .halfSpotlight > a { margin: 0; } .halfSpotlight .imgContainer { width: 100%; } .halfSpotlight .imgContainer img { width: 100%; height: auto; } .halfSpotlight .textContainer { position: absolute; bottom: 1px; left: 1px; } .quarterSpotlight { position: relative; width: 43%; } .quarterSpotlight > a { margin: 0; } .quarterSpotlight .textContainer { width: 99%; position: absolute; bottom: 1px; left: 1px; } .ctaSpotlight { position: relative; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Get Active landing -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .getActiveTextIntroContainer { position: absolute; overflow: hidden; color: #fff; width: 86%; padding: 10px 3%; border: 1px solid #514d4d; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0039/98985/homepage-intro-bg.png?v=0.0.2') 0 0 repeat-x; top: 36%; left: 0%; } .getActiveTextIntroContainer span { display: block; color: #fff; text-transform: uppercase; } .getActiveTextIntroContainer .largeText { font-size: 1.2em; line-height: 1.1em; margin: 0 0 7px 0; } .getActiveTextIntroContainer .smallText { font-size: 1em; line-height: 1em; } .ctaLink { position: relative; overflow: hidden; height: 125px; margin: 0 !important; text-decoration: none; } .ctaLink:hover { text-decoration: none !important; } .ctaLink .imgContainer { position: absolute; top: 0; left: 0; z-index: 100; } .ctaLink .imgContainer img { width: 100%; height: auto; } .ctaLink .textContainer { position: relative; bottom: auto; left: auto; overflow: hidden; margin: 27px 0 0 65px; z-index: 50; } .ctaLink .textContainer span { display: block; } .ctaLink .textContainer span.text { border: 1px solid #c9c9c9; padding: 15px 15px 15px 38px; margin: 0 1px 0 0; color: #3a3d3a; text-transform: uppercase; font-size: 1em; background: #fff; background: -moz-linear-gradient(top, #fff 0%, #a2a2a2 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#a2a2a2)); background: -webkit-linear-gradient(top, #fff 0%,#a2a2a2 100%); background: -o-linear-gradient(top, #fff 0%,#a2a2a2 100%); background: -ms-linear-gradient(top, #fff 0%,#a2a2a2 100%); background: linear-gradient(to bottom, #fff 0%,#a2a2a2 100%); -webkit-transition: background 1s ease-out, color 1s ease-out; -moz-transition: background 1s ease-out, color 1s ease-out; -o-transition: background 1s ease-out, color 1s ease-out; transition: background 1s ease-out, color 1s ease-out; background-size: 1px 140px; } .ctaLink .textContainer span.arrow.forDesktop { display: none; } .ctaLink:hover .textContainer span.text { background-position:70px; color: #000; text-decoration: underline; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Standard landing template -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .standardLanding { background: none; } .standardLanding .oneThirdWidth h3 { color: #8d395b; font-size: 1.6em; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Listing templates -----------------------------------------------------------------------------------------------------------------------------------------------------*/ /* calendar filter - page_calendar_events_search_472569 */ .listingTemplate { background: none; padding: 0; } .listingTemplate #eventsFilter, .listingTemplate #page_calendar_events_search_472569 { } .listingTemplate #eventsFilter .formTitle, .listingTemplate #page_calendar_events_search_472569 .formTitle { font-size: 1.4em; margin: 0 0 10px 0; } .listingTemplate #eventsFilter .filterContainer, .listingTemplate #page_calendar_events_search_472569 .filterContainer { margin: 0 0 15px 0; } .listingTemplate #eventsFilter .filterContainer label { font-size: 1.1em; } .listingTemplate #eventsFilter .filterContainer select { width: 100%; margin: 0; } .listingTemplate #eventsFilter #searchEvents { margin: 0; } /* listing with images */ .listingTemplate #listing { margin: 10px 0; padding: 0; } .listingTemplate #listing li { position: relative; overflow: hidden; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0028/99046/sideNav-border.png?v=0.0.1') 0 100% repeat-x; padding: 0 0 30px 0; margin: 0 0 30px 0; } .listingTemplate #listing li .imgContainer { background: #fff; border: 1px solid #ddd; padding: 1px; } .listingTemplate #listing li .imgContainer img { width: 100%; height: auto; } .listingTemplate #listing li .textContainer { } .listingTemplate #listing li .textContainer h3 { font-size: 1.3em; } .listingTemplate #listing li .textContainer h3 a { margin: 5px 0 10px 0; color: #322e2f; font-size: 1em; text-decoration: none; } .listingTemplate #listing li .textContainer h3 a:hover { text-decoration: underline; } .listingTemplate #listing li .textContainer span { font-style: italic; margin: 0 0 10px 0; display: block; font-family: Arial, sans-serif; } .listingTemplate #listing li .textContainer p { } .listingTemplate #listing li .textContainer a.blueArrowLink { } /* listing meta */ .listingTemplate .listMeta { position: relative; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0028/99046/sideNav-border.png?v=0.0.1') 0 100% repeat-x; padding: 0 0 20px 0; margin: 0 0 20px 0; } .listingTemplate .listMeta p { margin: 10px 0 0 0; } /* listing pagination */ .pageNumbers { position: relative; overflow: hidden; margin: 10px 0 0 0!important; float: right; } .pageNumbers li { float: left; margin: 0 !important; padding: 0 !important; background: none !important; } .pageNumbers li a { display: block !important; text-decoration: none; padding: 5px !important; font-family: Arial, sans-serif; font-size: 1em; } .pageNumbers li a:hover { } .pageNumbers li a.active { color: #585858; cursor: default; } .pageNumbers li a.active:hover { text-decoration: none; } .pageNumbers li a.next, .pageNumbers li a.prev { position: relative; overflow: hidden; text-indent:-99999px; width: 5px; height: 9px; } .pageNumbers li a.next.disabled, .pageNumbers li a.prev.disabled { cursor: default; } .pageNumbers li a.next.enabled { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0041/98996/arrow-pagination-enabled-next.png?v=0.0.1') 50% 80% no-repeat; } .pageNumbers li a.next.disabled { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0039/98994/arrow-pagination-disabled-next.png?v=0.0.1') 50% 80% no-repeat; } .pageNumbers li a.prev.enabled { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0042/98997/arrow-pagination-enabled-prev.png?v=0.0.1') 50% 80% no-repeat; } .pageNumbers li a.prev.disabled { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0040/98995/arrow-pagination-disabled-prev.png?v=0.0.1') 50% 80% no-repeat; } /* listing header */ .listingTemplate h2 { font-size: 1.7em; margin: 10px 0 30px 0; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Post / shop templates -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .postMetaContainer { padding: 20px 30px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0020/99002/black-opaque-bg.png?v=0.0.1') 0 0 repeat; min-height: 134px; } .postMetaContainer h2, .postMetaContainer span, .postMetaContainer p { color: #fff; } .postMetaContainer .row { margin: 0; } .postMetaContainer h2 { font-size: 1.2em; margin: 0 0 10px 0; } .postMetaContainer span { } .postMetaContainer p { margin: 5px 15px 5px 0; display: inline-block; } .postMetaContainer p > span { font-weight: bold; } .postMetaContainer .row > span.eventType { display: inline-block; padding: 5px 20px; text-align: center; margin: 0 5px 10px 0; background: #8d395b; } .postMetaContainer a.cta.green { color: #fff; background: #2e8900; background: -moz-linear-gradient(top, #47a319 0%, #2e8900 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#47a319), color-stop(100%,#2e8900)); background: -webkit-linear-gradient(top, #47a319 0%,#2e8900 100%); background: -o-linear-gradient(top, #47a319 0%,#2e8900 100%); background: -ms-linear-gradient(top, #47a319 0%,#2e8900 100%); background: linear-gradient(to bottom, #47a319 0%,#2e8900 100%); } .postMetaContainer a.cta.red { color: #fff; background: #984d6b; background: -moz-linear-gradient(top, #984d6b 0%, #7f3452 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#984d6b), color-stop(100%,#7f3452)); background: -webkit-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: -o-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: -ms-linear-gradient(top, #984d6b 0%,#7f3452 100%); background: linear-gradient(to bottom, #984d6b 0%,#7f3452 100%); } .postMetaContainer a.cta > span.text { padding: 10px; display: inline-block; width: 91px; } .postMetaContainer a.cta > span.arrow { display: inline-block; padding: 10px 0; border-left: 1px solid #fff; background: #575757; background: -moz-linear-gradient(top, #575757 0%, #3d3d3d 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#575757), color-stop(100%,#3d3d3d)); background: -webkit-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: -o-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: -ms-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: linear-gradient(to bottom, #575757 0%,#3d3d3d 100%); } .postMetaContainer a.cta > span.arrow > span { padding: 9px 17px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0036/98991/arrow-carousel-white-right.png?v=0.0.1') 50% 50% no-repeat; } .postMetaContainer a.cta:hover .text { text-decoration: underline; } .postMetaContainer a.dockToBottom { position: static; bottom: 0; right: 0; margin: 10px 0 0 0 !important; } .postMetaContainer a.cta.moreBtn { margin: 15px 4px 0 0; } .postMetaContainer a.cta.bookBtn { margin: 15px 0 0 0; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Post booking form -----------------------------------------------------------------------------------------------------------------------------------------------------*/ #postBookingForm, #form_email_477456 { padding: 30px; } #postBookingForm a.cta, #form_email_477456 a.cta { color: #fff; margin: 0; background: #2e8900; background: -moz-linear-gradient(top, #47a319 0%, #2e8900 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#47a319), color-stop(100%,#2e8900)); background: -webkit-linear-gradient(top, #47a319 0%,#2e8900 100%); background: -o-linear-gradient(top, #47a319 0%,#2e8900 100%); background: -ms-linear-gradient(top, #47a319 0%,#2e8900 100%); background: linear-gradient(to bottom, #47a319 0%,#2e8900 100%); } #postBookingForm a.cta > span.text, #form_email_477456 > span.text { padding: 10px; display: inline-block; width: 91px; } #postBookingForm a.cta > span.arrow, #form_email_477456 > span.arrow { display: inline-block; padding: 10px 0; border-left: 1px solid #fff; background: #575757; background: -moz-linear-gradient(top, #575757 0%, #3d3d3d 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#575757), color-stop(100%,#3d3d3d)); background: -webkit-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: -o-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: -ms-linear-gradient(top, #575757 0%,#3d3d3d 100%); background: linear-gradient(to bottom, #575757 0%,#3d3d3d 100%); } #postBookingForm a.cta > span.arrow > span { display: inline; padding: 9px 17px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0036/98991/arrow-carousel-white-right.png?v=0.0.1') 50% 50% no-repeat; } #postBookingForm a.cta:hover .text. #form_email_477456 a.cta:hover .text { text-decoration: underline; } #postBookingForm input[type=email], #form_email_477456 input[type=email], #form_email_477456 input[type=text], #postBookingForm input[type=text] { width: 97%; padding: 1%; } #pageContainer .blueSubmit { margin: 0 0 20px 0; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Shop call to action widget - standard content pages -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .shopCTA { text-align: center; padding: 20px 0 0 0; } .shopCTA > a { text-decoration: none; } .shopCTA > a:hover { text-decoration: none; } .shopCTA .imgContainer { width: 100%; } .shopCTA .imgContainer img { } .shopCTA .textContainer { padding: 10px; background: #2e729f; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } .shopCTA .textContainer h2, .shopCTA .textContainer p { color: #fff; } .shopCTA .textContainer h2 { display: inline-block; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0038/98993/arrow-large-white-right.png?v=0.0.1') 94% 50% no-repeat; padding: 0 30px 0 0; margin: 0 0 5px 0; } .shopCTA .textContainer p { font-family: Arial, sans-serif; margin: 0; } .shopCTA > a:hover .textContainer { background: #1f4c6a; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Shop templates - Landing -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .shopTemplate .postMetaContainer h2 { font-size: 1.6em; } .shopLanding { } .shopLanding .row { margin: 0; } .shopLanding .halfSpotlight { overflow: hidden; clear: both; } .shopLanding .halfSpotlight .imgContainer { float: left; margin: 0 10px 0 0; } .shopLanding .halfSpotlight .textContainer { position: static; bottom: auto; left: auto; } .shopLanding .halfSpotlight .textContainer h3 { color: #322e2f; } .shopLanding .halfSpotlight .textContainer p { } .shopLanding .halfSpotlight .textContainer a { } .shopLanding .largeSpotlight { } .shopLanding .largeSpotlight .imgContainer { padding: 1px; width: 99.3%; } .shopLanding .largeSpotlight .textContainer { } .shopLanding .largeSpotlight .textContainer h3 { color: #322e2f; } .shopLanding .largeSpotlight .textContainer p { } /* shop menu */ #shopMenu { margin:15px 0 0 0; width:90%; padding:5px 5%; background: #efefef;} #shopMenu .shopInfo { text-decoration: none; color: #222; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0023/99014/icon-basket.png?v=0.0.1') 0 0 no-repeat; padding: 0 0 0 30px; margin: 0; line-height: 3em; } #shopMenu .shopInfo:hover { text-decoration: none; } #shopMenu .shopInfo span { color: #3f7ea7; } #shopMenu .shopCheckoutBtn { text-decoration: none !important; color: #3f7ea7; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0026/99017/icon-checkout.png?v=0.0.1') 0 0 no-repeat; padding: 0 0 0 30px; margin: 0; line-height: 3em; } #shopMenu .shopCheckoutBtn:hover { text-decoration: underline !important; } /* listing */ #contentContainer #shopListingItems { } #contentContainer #shopListingItems h2 { margin: 10px 0 5px 0 } #contentContainer #shopListingItems .imgContainer { border: 0; padding: 0; text-align: center; } #contentContainer #shopListingItems .imgContainer img { width: auto; height: auto; max-width: 100%; } #contentContainer #shopListingItems .textContainer { position: relative; } #contentContainer #shopListingItems .textContainer h3 { margin: 0 0 10px 0; } #contentContainer #shopListingItems .textContainer .blueArrowLink { } #contentContainer #shopListingItems .purchaseContainer { text-align: right; } #contentContainer #shopListingItems .purchaseContainer p { font-size: 1.2em; } #contentContainer #shopListingItems .purchaseContainer p span { font-size: 1.3em; color: #8d395b; display: inline-block; } #contentContainer #shopListingItems .purchaseContainer label { font-size: 1.2em; } #contentContainer #shopListingItems .purchaseContainer input[type=text] { width: 45px; text-align: right; border: 1px solid #c9c9c9; } #contentContainer #shopListingItems .purchaseContainer input[type=submit] { margin: 25px 0 0 0; color: #fff; } /* checkout */ #shopBasket .shopCheckoutTemplate, #shopBasketWidget .shopCheckoutTemplate { padding: 0 !important; margin: 0 !important; background: none !important; } #shopBasket #onlineShopCheckout, #shopBasketWidget #basketSummary { width:100%; text-align:left; border-collapse:collapse; margin: 0; } #shopBasket #onlineShopCheckout th, #shopBasketWidget #basketSummary th { padding:15px 10px 10px; font-family: Arial, sans-serif; font-weight: normal; } #shopBasket #onlineShopCheckout td, #shopBasketWidget #basketSummary td { padding:10px; } #shopBasket #onlineShopCheckout a, #shopBasketWidget #basketSummary a { font-family: Arial, sans-serif; text-decoration: none; } #shopBasket #onlineShopCheckout a:hover, #shopBasketWidget #basketSummary a:hover { text-decoration: underline; } #shopBasket #onlineShopCheckout tbody, #shopBasketWidget #basketSummary tbody { border:1px solid #dadada; } #shopBasket #onlineShopCheckout tbody td, #shopBasketWidget #basketSummary tbody td { border-top:1px dotted #747579; border-right: 1px solid #dadada; background: #fff; } #shopBasket #onlineShopCheckout tbody .imgContainer { width: 100%; max-width: 100%; text-align: center; } #shopBasket #onlineShopCheckout tbody .imgContainer img, #shopBasketWidget #basketSummary tbody .imgContainer img { width: auto; height: auto; max-width: 100%; } #shopBasket #onlineShopCheckout tbody .textContainer, #shopBasketWidget #basketSummary tbody .textContainer { } #shopBasket #onlineShopCheckout tbody .textContainer h2, #shopBasketWidget #basketSummary tbody .textContainer h2 { color: #322e2f; font-size: 1.2em; margin: 10px 0 0 0; } #shopBasket #onlineShopCheckout tbody .textContainer .removeFromBasket, #shopBasketWidget #basketSummary tbody .textContainer .removeFromBasket { display: inline-block; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0023/99032/icon-remove.png?v=0.0.1') 100% 3px no-repeat; padding: 0 10px 0 0; } #shopBasket #onlineShopCheckout tbody td.singleItemPrice, #shopBasketWidget #basketSummary tbody td.singleItemPrice { text-align: center; } #shopBasket #onlineShopCheckout tbody .price, #shopBasketWidget #basketSummary tbody .price { display: block; margin: 10px 0 30px 0; font-size: 1.2em; } #shopBasket #onlineShopCheckout tbody .price .priceValue, #shopBasketWidget #basketSummary tbody .price .priceValue { color: #8d395b; display: inline-block; } #shopBasket #onlineShopCheckout tbody .purchaseContainer, #shopBasketWidget #basketSummary tbody .purchaseContainer { text-align: right; margin: 10px 0 0 0; } #shopBasket #onlineShopCheckout tbody .purchaseContainer label, #shopBasketWidget #basketSummary tbody .purchaseContainer label { font-size: 1.2em; margin: 0 0 7px 0; display: block; } #shopBasket #onlineShopCheckout tbody .purchaseContainer input[type=text], #shopBasketWidget #basketSummary tbody .purchaseContainer input[type=text] { width: 45px; text-align: right; border: 1px solid #c9c9c9; } #shopBasket #onlineShopCheckout tfoot, #shopBasketWidget #basketSummary tfoot { background: #f2f2f0; border:1px solid #dadada; } #shopBasket #onlineShopCheckout tfoot td, #shopBasketWidget #basketSummary tfoot td { border-top:1px solid #dadada; text-align: right; } #shopBasket #onlineShopCheckout tfoot #submitOrder, #shopBasketWidget #basketSummary tfoot #submitOrder { color: #fff; } #shopBasket #onlineShopCheckout tfoot label, #shopBasketWidget #basketSummary tfoot label { font-size: 1.2em; margin: 0 10px 10px 0; display: inline-block; } #shopBasket #onlineShopCheckout tfoot td > span, #shopBasketWidget #basketSummary tfoot td > span { font-size: 1.2em; display: inline-block; margin: 0 20px 10px 0; } #shopBasket #onlineShopCheckout tfoot span, #shopBasketWidget #basketSummary tfoot span { margin: 0 20px 0 0; } #shopBasket #onlineShopCheckout tfoot span.basketTotal, #shopBasketWidget #basketSummary tfoot span.basketTotal { margin: 0; color: #8d395b; } #shopBasket #onlineShopCheckout tfoot span.formRequiredIndicator { color: red; } #shopBasket #onlineShopCheckout tfoot span.basketTotal .basketTotalCost, #shopBasketWidget #basketSummary tfoot span.basketTotal .basketTotalCost { color: #322e2f; display: inline-block; background: #fff; border: 1px solid black; padding: 5px 15px; margin: 0 0 0 10px; font-size: 1.2em; } #shopBasket #onlineShopCheckout tfoot span.basketTotal .basketTotalCostSuccess { color: #322e2f; display: inline-block; padding: 5px 15px 5px 0; margin: 0 0 0 10px; font-size: 1.2em; } .purchaseForm { background: #f2f2f0; padding: 30px; margin: 35px 0 0 0; font-family: Arial, sans-serif; } .purchaseForm .radioOption { margin: 0 0 5px 0; } .purchaseForm > .row > label { width: 80%; } .purchaseForm label { display: inline-block; margin: 0 0 5px 0; } .purchaseForm span { display: inline-block; margin: 0 0 0 5px; } .purchaseForm span.label { clear: both; display: inline-block; margin: 0 0 10px 0; } .purchaseForm select { display: block; margin: 0 0 20px 0; } .purchaseForm textarea { display: block; margin: 0 0 20px 0; } .purchaseForm input { display: block; margin: 0 0 20px 0; } .purchaseForm input[type=email], .purchaseForm input[type=text] { width: 97%; padding: 1%; } .purchaseForm input[type=radio], .purchaseForm input[type=checkbox] { display: inline-block; clear: both; float: left; margin: 0 5px 0 0; } .purchaseForm input[type=submit] { clear: both; float: right; margin: 20px 0 0; outline: none; border: 1px solid #e0e1e0; color: #fff; font-weight: bold; font-size: 1.2em; background: #545454; box-shadow: 0px; -webkit-transition: background 0.1s, box-shadow 0.1s; -moz-transition: background 0.1s, box-shadow 0.1s; -o-transition: background 0.1s, box-shadow 0.1s; transition: background 0.1s, box-shadow 0.1s; } .purchaseForm input[type=submit]:focus, .purchaseForm input[type=submit]:hover { background: #8d395b; box-shadow: black 0px 0px 6px -2px; -webkit-transition: background 0.3s, box-shadow 0.3s; -moz-transition: background 0.3s, box-shadow 0.3s; -o-transition: background 0.3s, box-shadow 0.3s; transition: background 0.3s, box-shadow 0.3s; } .purchaseForm .formRequiredIndicator { display: inline-block; color: red; font-weight: bold; margin: 0 0 0 10px; } #shopBasket h2 { color: #8d395b; margin: 35px 0 15px 0; font-size: 1.5em; } /* basket */ #shoppingBasket { display: none; position: absolute; top: 28px; right: -1px; z-index: 1000; background: rgba(255, 255, 255, 0.9); padding: 0 20px 30px 30px; width: 320px; } #shopBasketWidget #basketSummary tbody tr:hover td { background: #f2f2f0; cursor: pointer; } #shopBasketWidget #basketSummary tbody td { position: relative; } #shopBasketWidget #basketSummary tbody .imgContainer { width: 47px; max-width: 47px; text-align: center; float: left; margin: 0 15px 0 0; height: auto; max-height: none; } #shopBasketWidget #basketSummary tbody .textContainer .removeFromBasket { position: absolute; top: 5px; right: 11px; } #shopBasketWidget #basketSummary tbody .price { margin: 0 0 5px 0; } #shopBasketWidget #basketSummary tbody .textContainer h2 { font-size: 1em; margin: 10px 0; } #shopBasketWidget #basketSummary tfoot .clearBasketBtn { float: left; margin: 0; padding: 10px 0; } #shopBasketWidget .basketTail { display: block; position: relative; z-index: 1000; margin: 0 0 -1px 169px; width: 60px; height: 28px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0019/99001/basket-tail.png?v=0.0.1') 50% 0 no-repeat !important; } /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Mobile specific styles -----------------------------------------------------------------------------------------------------------------------------------------------------*/ .openMobMenu, .closeMobMenu { text-decoration: none; text-transform: uppercase; color: #666666; padding: 5px 28px 5px 5px; background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0029/99029/icon-mobile-menu.png?v=0.0.1') 100% 45% no-repeat; display: inline-block; font-size: 1.6em; margin: 15px 0 0 0; } .openMobMenu { } .closeMobMenu { } /* MOBILE MENU */ .menu { background: rgba(35, 31, 32, 0.8); top: 120px; position: absolute; width: 100%; height: 100%; min-height: 2047px; z-index: 2; display: none; } .ie8 .menu { background: url('https://www.peakdistrict.gov.uk/__data/assets/image/0027/99045/mobile-menu-bg-ie8.png?v=0.0.1') 0 0 repeat; } .menu .constraint { position: relative; height: 100%; overflow-x: hidden; overflow-y: visible; } .menu nav { background: #fff; } /*search*/ .menu .search { padding: 15px; border-bottom: 1px dotted #747579; position: relative; } #siteSearchMobile { width: 100%; position: relative; border: 1px solid #dddede; box-shadow: grey 0px 0px 6px -2px; } #siteSearchMobile label { } #siteSearchMobile label.hiddenLabel { display: none; } #siteSearchMobile input[type=text] { width: 96%; border: 0; -webkit-appearance: none; line-height: 1.95em; padding: 5px 2%; } .ie8 #siteSearchMobile input[type=text] { height: 23px; } #siteSearchMobile input[type=submit] { background: #565656 url('https://www.peakdistrict.gov.uk/__data/assets/image/0024/99033/icon-search.png?v=0.0.1') 50% 50% no-repeat; font-size: 0em; border: 0; height: 33px; width: 33px; padding: 0; margin: 0; vertical-align: top; position: absolute; right: 0; top: 0; } /*menu items*/ .menu ul { font-size: 1em; line-height: normal; } .menu ul li { margin: 0; } .menu a { display: block; padding: 6px 20px 6px; font-size: 1.3em; color: #444; border-bottom: 1px dotted #747579; position: relative; text-decoration: none; } .menu a.has-children { padding-right: 44px;} .menu a .arrow-red-right, .menu a .arrow-grey-right { background: #f2f2f0 url('https://www.peakdistrict.gov.uk/__data/assets/image/0043/98998/arrow-small-red-right.png?v=0.0.1') center center no-repeat; width: 28px; height: 28px; position: absolute; right: 7px; top: 50%; margin-top: -14px;} .menu a .arrow-red-right:hover { background-color: #D1D1D1;} .menu a .arrow-grey-right { background: #dadada url('https://www.peakdistrict.gov.uk/__data/assets/image/0043/98998/arrow-small-red-right.png?v=0.0.1') center center no-repeat; } .menu a .arrow-grey-right:hover { background-color: #c8c8c8;} .menu a:hover { background-color: #fafafa; text-decoration: none; } .menu a.active { color: #8d395b; background-color: #fafafa; } /*level 2*/ .menu .children { position: absolute; top: 66px; left: 100%; width: 100%; background: rgba(0, 0, 0, 0.7); z-index: 10; min-height: 277px; height: 96%;} .menu .children a { margin-left: 20px; } .menu .children a.back-to-main { background: #8d395b; color: #fff; } .menu .children a.back-to-main:hover { background: #762948; } .menu a .icon-back, .menu a:hover .icon-back { background-image: url('https://www.peakdistrict.gov.uk/__data/assets/image/0044/98999/arrow-small-white-left.png?v=0.0.1'); background-position: 0px 6px; background-repeat: no-repeat; padding-left: 16px; } .menu .children ul a { background: #ececec; color: #444; } .menu .children ul a:hover { background: #F1f1f1; } /*level 3*/ .menu .children .children { top: 0;} /*----------------------------------------------------------------------------------------------------------------------------------------------------- // Mobile smaller screen tidy up styles -----------------------------------------------------------------------------------------------------------------------------------------------------*/ @media screen and (max-width: 320px) { .siteLogoLink { width: 50%; } .siteLogo { width: 100%; } .contentHeader h1 { font-size: 1.8em; } .menu { top: 85px;} } @media screen and (max-width: 416px) { .fourGridSpotlights > a { width: 100%; } .menu { top: 85px;} } /* hide skipnav on mobile view */ .skipnav {display: none;}