/* @override http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1428592718 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484608154 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484644290 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484646648 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484654848 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484654961 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484666125 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484668949 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484669296 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484681505 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484694600 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484694740 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484695179 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484696800 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484733430 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484738351 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484752796 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484759075 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484759238 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484761932 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484765176 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484772611 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484827304 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484836006 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1484836090 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484836896 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484837991 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484839096 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484839310 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1484836937 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1484841952 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1484844105 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1484847995 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1484851821 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485107999 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485109854 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485113592 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485115366 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485119604 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485119739 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485195373 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485195740 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485202241 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485276609 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485279934 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485281641 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485282802 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485335817 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485337393 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485338701 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485339822 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485340253 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485341247 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485342388 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485345326 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485345880 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485358035 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485385817 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485386318 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485423722 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485387055 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485439842 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485442883 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485447027 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485446940 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485456424 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485460418 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485460633 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485785790 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485787605 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485790473 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1485876901 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485905779 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485944895 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1485967814 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486036662 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486036616 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486041616 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486041703 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486057439 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486057465 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486075885 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486117911 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486122764 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486123405 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486125117 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486142994 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486202230 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486204545 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486205302 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486231510 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486296646 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486293978 http://www.test.pinkpoliceman.com/themes/ckrock/css/layout.css?m=1486312549 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1486332197 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1512171268 http://localhost:8888/ckrock/themes/ckrock/css/layout.css?m=1512306628 http://www.ckrock.com/themes/ckrock/css/layout.css?m=1512389058 http://www.ckrock.com/themes/ckrock/css/layout.css?* http://ckrock.com/themes/ckrock/css/layout.css?* */ /** ---------------------------------------------------------- * * Contains the main layout of the page and the individual styles. * Acts as the main stylesheet for theme. * * Include your notes or table of contents below.... * Include color hex's or values of your grid * * 1. OOCSS GRID * 2. MAIN LAYOUT * 3. HEADER * - Brand * - Search Form * 4. Navigation * - Primary Navigation * - tablet Navigation * - Secondary Navigation * - Secondary Nav 2-5 Levels deep * 5. Mixed * 6. Footer * 7. Page Specific Layout * - Homepage * - Search Results * 8. Device and Responsive Layout * - Breakpoint 960px * - Breakpoint 640px * - Search Form * - Main Content * 9. Print Styles * - Simple Theme custom print styles * * @author Your Name * ------------------------------------------------------- */ /* OOCSS Grid * https://github.com/stubbornella/oocss/wiki/grids */ .line, /* line - Groups units on one horizontal line. Note: for mobile layout units may be stacked to avoid horizontal scrolling. */ .lastUnit { overflow:hidden; *overflow:visible; *zoom:1; padding: 0 10px; } .TEST2 .unit, .TEST .unit { padding: 0; } .unit { /* unit - Base class which divides a line into sections (columns). */ float:left; padding: 0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; /* box-sizing:border-box; creates a box-model where padding and border are NOT added onto the width - they are included in the width, so a 200px wide element with 20px padding will be 200px, NOT 240px wide */ } .unitRightv { /* Use this class if you want to offset a column eg: |--content(.unit)--|--content(.unit)--|--no-content--|--no-content--|--content(.unitRighttv)--| */ float:right; } /* sizeXofY - Extends unit. Indicates the fractional width of the unit, for example size3of4 would take up three quarters, or 75%, of the horizontal space. The following fractions are supported: 1, 1/2, 1/3, 2/3, 1/4, 3/4, 1/5, 2/5, 3/5, 4/5 */ /* It is possible to add more columns if you wish you will just have to add the fractions that are missing eg: .size1of6 {width:16.66666%;} */ .size1of1 { float:none; } .size1of2 { width:50%; } .size1of3 { width:33.33333%; } .size2of3 { width:66.66666%; } .size1of4 { width:25%; } .size3of4 { width:75%; } .size1of5 { width:20%; } .size2of5 { width:40%; } .size3of5 { width:60%; } .size4of5 { width:80%; } .lastUnit { /* lastUnit - Extends unit. Applied to the last child of every line. */ float:none; width:auto; _position:relative; /* Bug fix for IE6 - Internet Explorer 6 and below wouldn't fail on properties that were prefixed with non-alphanumeric characters. meaning that anything prefixed with _ wouldn't be picked up by any other browsers */ _left:-3px; _margin-right:-3px; } /* MAIN LAYOUT */ body { margin: 0; min-width: 240px; -webkit-text-size-adjust: none; text-align: center; background-color: #f7f7f8; } body.TEST2 { background-color: #f7f7f8; } .ie7 body, .ie8 body { min-width: 860px; /* media queries are not supported in ie7/8 without a polyfill */ } .main { // padding: 13px 0 35px; min-height: 300px; padding-top: 0; padding-bottom: 0; } .TEST2 .main{ padding-top: 0px; padding-bottom: 0px; } .inner { max-width: 1100px; margin: 0 auto; //padding: 0 30px; background-color: white; padding-right: 0; padding-left: 0; padding-top: 0; } .Gallery .main .inner{ background: #f7f7f8; } .footer .inner { max-width: 4100px; width: 100%; margin: 0 auto; //padding: 0 30px; background-color: white; padding-right: 0; padding-left: 0; padding-top: 0; } .TEST .inner { max-width: 100%; margin: 0 auto; padding: 0 0px; } .ie6 .inner { width: 960px; } .no-sidebar .content-container { float: left; width:100%; /* makes content container full width when there is no sidebar */ } .sidebar { /* this is the sidebar element */ margin-top: 12px; } .no-sidebar .sidebar { display: none; } /* SERVICES */ #sphotos img { float: left; width: 100%; } div.set2 { margin-bottom: 3.25%; float: left; width: 48.5%; } #ser1 { } #ser2 { float: right; } div.set1 { width: 100%; margin-right: auto; margin-left: auto; overflow: auto; padding-bottom: 50px; border-bottom: 1px solid rgba(161,162,169,0.5); } div#sphotos.services { width: 88%; overflow: auto; border-top: 1px solid rgba(161,162,169,0.5); padding-top: 80px; margin-right: auto; margin-left: auto; } /* contact */ .TopImagePage #topimage { margin-bottom: 53px; } .TopImagePage div.content { background-color: #f7f7f7; padding-bottom: 138px; } div#colourwrap { background-color: white; max-width: 65.5%; padding-top: 73px; padding-bottom: 116px; margin-right: auto; margin-top: 23px; margin-left: auto; } .TopImagePage h1 { margin-bottom: 17px; font-size: 13px; } /* RATES */ div#topimage { width: 100%; margin-bottom: 53px; display: block; clear: both; overflow: auto; } .RatesPage div.content { background-color: white; margin-right: auto; margin-left: auto; padding-bottom: 50px; clear: both; padding-top: 50px; width: 65.5%; } .RatesPage article { background-color: #f2f2f3; padding-bottom: 86px; } div#topimage img{ width: 100%; float: left; } /* GALLERY */ #gallerycontainer div.gallery-item { margin-bottom: 26px; width: 85%; margin-right: auto; margin-left: auto; overflow: auto; } div.gallery-item.last { padding-bottom: 80px; } div#galtop { width: 100px; position: relative; background-color: transparent; margin-right: auto; margin-left: auto; overflow: hidden; height: 50px; } #topper a.top { position: relative; top: 7px; width: 100%; display: block; z-index: 5; } span#topper { position: relative; width: 100px; height: 100px; display: block; border-radius:50px ; background-color: white; bottom: -18px; } #gallerycontainer div.gallery-item img{ width: 100%; float: left; } div#ex-holder { width: 90%; margin-right: auto; margin-left: 5%; margin-bottom: 0; height: auto; overflow: auto; float: left; position: relative; } div#ex-holder.last{ margin-bottom: 130px; } div.ex-gallery-item.odd { float: left; } div.ex-gallery-item.info.odd { width: 50%; position: absolute; background-color: #fff; margin: 0; top: 0; right: 0; bottom: 0; } div.ex-gallery-item.info.even { width: 50%; position: absolute; background-color: #fff; margin: 0; top: 0; bottom: 0; left: 0; } span#topperbut { max-width: 1100px; position: relative; top: 0; letter-spacing: 1px; z-index: 2; background-color: white; display: block; color: #6e757f; margin-right: auto; margin-left: auto; } span#topperbut a{ color: #6e757f; } div#gallerycontainer { position: relative; overflow: auto; margin-bottom: 0; background-color: #f7f7f8; padding-top: 68px; } div.ex-gallery-item.even { float: right; } div.ex-gallery-item.info span.exinfo { position: absolute; width: 90%; top: 50%; left: 5%; -ms-transform: translateY(-50%); /* IE 9 */ -webkit-transform: translateY(-50%); /* Safari */ transform: translateY(-50%); } span#exinfo, span#exinfo p { clear: both; display: block; font-size: 14px; margin-bottom: 0; } span#exinfo a, span#exinfo p a{ font-style: italic; } div#more { position: absolute; width: 100%; bottom: 20%; font-size: 17px; } #gallerycontainer div.ex-gallery-item { margin-bottom: 20px; width: 50%; margin-bottom:0px; } #gallerycontainer div.ex-gallery-item img{ width: 100%; float: left; } /* HEADER */ .header { } .header .inner { padding-top: 45px; position: relative; min-height: 72px; max-width: 4000px; width: 100%; } .TEST2 div.inner { background-color: white; padding-right: 0; padding-left: 0; padding-top: 12px; } /* Brand */ header .brand, header .brand:hover { color: #fff; display: block; clear: both; } div#logo { margin-right: auto; margin-left: auto; max-width: 80%; width: 110px; } .brand h1 { margin: 0; padding: 0; font-size: 48px; font-family: "HelveticaNeueLTPro-Bd", "Helvetica Neue LT Pro Bold", "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue LT Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 600; font-stretch: normal; /* default value. No font stretching */ line-height: 1em; } .brand p { color: #6e757f; margin-bottom: 22px; } /* calendar */ .abBox13 { width: 31.5% !important; margin-right: 1% !important; margin-left: 1% !important; } .abCalendarMonthNext { border: 1px solid #e0dfde !important; } .abCalendarMonth { border-bottom: 1px solid #e0dfde !important; } .abCalendarWeekDay { border-top: 1px solid #e0dfde !important; } .abCalendarMonthNext:hover,.abCalendarMonthPrev:hover { background: white !important; } ul li.abMenuNavNext { float: right !important; } .abWrapper .abMenuList{ margin: 0; padding: 0; list-style: none; width: 100% !important; } .abLoader{ min-height: 100px; overflow: hidden; background-color: #fff !important; text-align: center; } #abWrapper_1 { position: relative; top: -14px; } @media (max-width: 767px){ #abWrapper_1.abWrapper13 .abBox13{ width: auto !important; height: auto; float: none; margin: 0 0 15px; } } /* Search form */ .search-bar { position: absolute; right: 13px; top: 12px; } .search-bar .field { margin: 0; padding: 0; } .search-bar form input.text { width: 155px; padding: 5px 34px 5px 15px; color: #6e757f; margin: 0; border: none; -moz-border-radius: 14px; border-radius: 14px; background: #fff; } .search-bar form input.action { /* positions the search button icon over the top of the search input */ font-size: 14px; position: absolute; right: 5px; top: 0; cursor: pointer; border: none; padding: 5px; background: none; font-family: 'WebSymbolsRegular'; color: #848484; border-radius: 0; margin: 0; } .search-bar form input.active, .search-bar form input.action:hover { color: #000; } .search-bar form input:focus, .header textarea:focus { outline: none; /* removes default browser outlining on focus */ } .search-dropdown-icon { display: none; /* hides search-dropdown-icon when site is at full width - media queries set it to display:block when at mobile/tablet width */ } /* NAVIGATION */ /* Primary navigation */ .header .inner .unit { position: relative; /* used to position the main navigation */ } nav.primary { } .header .primary ul { position: relative; bottom:0; right:0; width: 100%; text-align: center; margin-top: 19px; border-top: 1px solid rgba(161,162,169,0.5); padding-top: 10px; } .header .primary li { padding-bottom: 0px; margin: 0 5px; position: relative; white-space: nowrap; display: inline-block; } .TEST a{ color: #404040 !important; } .header .primary li a { color: #6e757f; padding: 6px 9px 0; display: block; font: 10px/12px adobe-garamond-pro, Georgia, "Times New Roman", Times, serif; text-transform: uppercase; word-spacing: 4px; letter-spacing: 2px; } span#topperbut a:hover, .header .primary li a:hover { color: #a1a2a9; } .header .primary li.section a, .header .primary li.current a { color: #a1a2a9; } /* Tablet Navigation */ /* When navigation and logo overlap tablet-nav is initialized */ .tablet-nav .brand p { margin-bottom: 0; } .tablet-nav .header .inner { padding-top: 34px; } .tablet-nav .header .primary ul { float: left; clear: both; position: relative; margin: 17px 0 0; white-space: nowrap; right: auto; padding-top: 15px; padding-bottom: 17px; } /* sticky */ nav#sticky.primary.clone { position:fixed; top: -75px; left: 0; right: 0; z-index:999; transition:0.5s top cubic-bezier(.3,.73,.3,.74); background-color: white; } body.down nav#sticky.primary.clone { top:0; opacity: 1; } body.down nav#sticky.primary.clone ul{ margin-top: 0; } .tablet-nav .header .primary ul li { white-space: nowrap; } .tablet-nav .header .primary ul li a { /* there is no hover on touch devices so no transition on hover is necessary */ -moz-transition: none; -webkit-transition: none; transition: none; } .tablet-nav .footer .right { float: left; width: 100%; } /* Secondary navigation */ .main .secondary h3 { font-size: 20px; margin: 0 0 8px 0; font-family: "CamboRegular", Georgia, "Times New Roman", Times, serif; font-weight: normal; } .main .secondary { border-bottom: 1px solid #a1a2a9; } .main .secondary ul { padding: 0; margin: 0; } .main .secondary li { border-top: 1px solid #a1a2a9; position: relative; list-style-type: none; margin-bottom: 0; } .main .secondary li .arrow { color: #b80000; padding-right: 5px; display: block; font-size: 15px; line-height: 20px; position: absolute; left: 2px; top: 7px; -moz-transition: 0.2s; /* this transition moves the arrow from left:2px to left:6px */ -webkit-transition: 0.2s; transition: 0.2s; } .main .secondary li a:hover .arrow { left: 6px; /* this sets the final position for the arrow transition */ } .main .secondary li a { /* side nav link styling */ padding: 10px 0; display: block; text-transform: uppercase; letter-spacing: 2px; font-size: 11px; color: #333; line-height: 17px; border-bottom: none; font-family: 'Lucida Sans', 'Lucida Grande', Arial, Helvetica, sans-serif; } .main .secondary li .text { padding-left: 28px; display: block; } .main .secondary li.current a.current { color: #b80000; background-color: #EDEDED; } .main .secondary li.section, .main .secondary li.current { background-color: #F3F3F3; } .main .secondary li.section a, .main .secondary li.current a { color: #000; } /* Secondary navigation 2-5 levels deep */ .main .secondary ul ul { display: none; } .secondary ul li.current ul, .secondary ul li.section ul { /* Only show child pages from selected parent */ display: block; } .secondary li.current ul ul { display: none; } .main .secondary ul ul li a { padding-left: 10px; } /* Indent all sidebar navigation levels*/ .main .secondary ul ul li a .arrow { left: 12px; } .main .secondary ul ul li a:hover .arrow { left: 16px; } .main .secondary ul ul ul li a { padding-left: 20px; } .main .secondary ul ul ul li a .arrow { left: 22px; } .main .secondary ul ul ul li a:hover .arrow { left: 26px; } .main .secondary ul ul ul ul li a { padding-left: 30px; } .main .secondary ul ul ul ul li a .arrow { left: 32px; } .main .secondary ul ul ul ul li a:hover .arrow { left: 36px; } .main .secondary ul ul ul ul ul li a { padding-left: 40px; } .main .secondary ul ul ul ul ul li a .arrow { left: 32px; } .main .secondary ul ul ul ul ul li a:hover .arrow { left: 36px; } .main .secondary li a:hover, .main .secondary li.section a:hover, .main .secondary li.current a:hover { color: #b80000; } div#bodyimage { max-width: 70.7%; margin-right: auto; margin-left: auto; } #bodyimage img { width: 100%; margin-top: 50px; } /* HOME LINKS */ .accomlink { display: inline-block; width: 48%; max-width: 467px; margin-bottom: 30px; } .extralinkmenu .accomlink, .AccomodationPage .accomlink{ width: 104px; padding: 4px 10px 3px; letter-spacing: 1px; margin-left: 6px; margin-right: 6px; border: 1px solid rgba(161,162,169,0.5); font-size: 10px; text-transform: uppercase; } #accom1 { margin-right: 3%; } .ServicePage div#acomlinks{ border-bottom: 0px solid rgba(161,162,169,0.5); } div#acomlinks { margin-top: 65px; border-bottom: 1px solid rgba(161,162,169,0.5); padding-bottom: 40px; max-width: 87.8%; margin-right: auto; margin-left: auto; text-align: center; } #qdetails span#title { text-transform: uppercase; display: inline-block; width: 100%; } #qdetails span#title h3{ margin-bottom: 15px; } #qdetails span#title h2{ margin-bottom: 10px; } .AccomodationPage span#subtitle{ font-style:normal; } span#subtitle { font-style: italic; font-size: 10px; display: block; margin-bottom: 10px; line-height: 25px; letter-spacing: 0.5px; } .accomlink img{ opacity: 1; width: 100%; margin-bottom: 13px; -moz-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; } .accomlink img:hover{ opacity: 0.8; } div#acomholder { padding-bottom: 35px; border-bottom: 1px solid rgba(161,162,169,0.5); padding-top: 24px; width: 88%; margin-right: auto; margin-left: auto; } .availability { width: 57.5%; margin-right: auto; margin-left: auto; background: white; padding-bottom: 20px; padding-right: 4%; padding-left: 4%; } .abCalendarMonth { text-transform: uppercase; font-size: 12px !important; font-weight: bold !important; letter-spacing: 1px; } /* QUICK MENU */ .TEST #quickmenu ul { max-width: 1100px; margin-right: auto; margin-left: auto; padding: 0 30px 20px; margin-bottom: 0; } .AccomodationPage #quickmenu { border-bottom: 0px solid; } div#quickmenu { padding-top: 54px; border-bottom: 1px solid rgba(161,162,169,0.5); padding-bottom: 55px; width: 88%; margin-right: auto; margin-left: auto; } #quickmenu ul li.quickmenu a img:hover { opacity: 0.8; } span#quicktitle { display: block; margin-top: 12px; font-size: 12px; letter-spacing: 2px; } #quickmenu ul li.quickmenu a img { -moz-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; } /* MIXED */ header:after, .main:after, #Root:after, .search-bar:after, header .inner:after, footer:after { /* clearfix */ height: 0; content: "."; display: block; clear: both; visibility: hidden; } .search-bar form input.action, .header .primary li a, .footer a { /* adds color transition when links/inputs on hover */ -moz-transition: color 0.2s; -webkit-transition: color 0.2s; transition: color 0.2s; } .footer a.brand { margin-left: 0; } .footer a.brand:hover { color: #a1a2a9; } /* FOOTER */ .footer { //padding: 14px 0 20px; font-size: 11px; line-height: 22px; text-align: center; padding-top: 0; padding-bottom: 0; max-width: 1100px; margin-right: auto; margin-left: auto; } .footer .inner{ padding-top: 40px; } .TEST2 .footer{ padding-top: 0px; padding-bottom: 0; } .TEST2 .footer div.inner { padding-top: 47px; } .footer a { color: #6e757f; } .footer a:hover { } .footer .left { float: left; display: block; margin-bottom: 10px; } .footer .right { float: right; display: block; margin-bottom: 10px; } .footer span { padding: 0 3px; } div#footercontact { margin-bottom: 32px; } span.contact { margin-right: 5px; margin-left: 5px; font-size: 15.5px; line-height: 26px; } div#social { margin-top: 10px; margin-bottom: 20px; } #social span.socialicon img { width: 18px; -moz-transition: 0.2s; /* this transition moves the arrow from left:2px to left:6px */ -webkit-transition: 0.2s; transition: 0.2s; } #social span.socialicon img:hover { opacity: 0.8; } span.divide { width: 35px; display: inline-block; border-bottom: 1px solid rgba(161,162,169,0.5); margin-bottom: 10px; } span.exinfo span.divide { width: 20px; display: inline-block; margin-bottom: 10px; border-bottom: 1px solid #6e757f; } .footer span.divide{ margin-bottom: 10px; } #quickmenu ul { margin-top: 28px; } li.quickmenu { width: 30.9%; display: inline-block; vertical-align: top; } .middle{ margin-right: 3%; margin-left: 3%; } .footer .primary, .footer .primary ul { display: inline; margin: 0; padding: 0; } .footer .primary li { display: inline; } .ie6 .footer .primary li, .ie7 .footer .primary li { /* this is a bugfix for ie6/7 */ display: inline; zoom: 1; margin-right: 10px; } .footer .primary li:after { /* adds '/' to separate the footer navigation items */ padding: 0 3px 0 5px; content: '/'; color: #999; } .footer .primary li:last-child:after { content: ''; /* makes sure last nav item doesn't have a '/' following it */ } .footer .arrow { padding: 0 8px 0 5px; color: #b80000; font-size: 13px; } .footer .primary .nav-open-button { display: none; /* the footer includes the primary nav include - this makes sure the nav open close button doesn't show up */ } /* PAGE SPECIFIC LAYOUT */ /* Homepage */ /* currently no Hompage specific styles - feel free to add your own */ /* Search Results */ .typography .searchResults h1 { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .searchResults p.searchQuery { margin-bottom: 10px; font-size: 15px; font-weight: bold; } .searchResults ul#SearchResults { padding: 0; border-bottom: 1px solid #e5e5e5; margin:0; } .searchResults ul#SearchResults li { border-top: 1px solid #e5e5e5; padding: 20px 0; list-style-type: none; } .searchResults ul#SearchResults p { margin-bottom: 10px; } .searchResults #PageNumbers a { padding: 0 5px; } .searchResults #PageNumbers .pagination { border-bottom: 1px solid #e5e5e5; padding: 20px 0; display:table; /* displays the pagination as a table so that elements stay inline and the middle column adjusts its size to accomodate and the right arrow stays to the right */ width:100%; } .searchResults #PageNumbers .pagination span{ display:table-cell; /* each element in the pagination div displays as a table cell */ } .searchResults #PageNumbers p { text-align: center; padding:20px 0; } .searchResults #PageNumbers .next, .searchResults #PageNumbers .prev { font-size: 14px; padding: 0 20px; display:table-cell; /* each element in the pagination div displays as a table cell */ vertical-align: middle; border-bottom:0 !important; } .searchResults #PageNumbers .next { margin-left: 15px; } .searchResults #PageNumbers .prev { margin-right: 15px; } /* DEVICE & RESPONSIVE LAYOUT */ .header .nav-open-button { display: none; /* removes the nav toggle button for desktop site */ } #media-query-trigger { /* instead of detecting the width of the window in simple/javascript/script.js it detects the visibility of this element (which is set using media queries) instead to trigger the hiding/showing of nav and search in mobile mode */ display: none; visibility: hidden; } @media only screen and (max-width: 1099px) { //div.clm.typography { -webkit-column-count: 2; /* Chrome, Safari, Opera */ -moz-column-count: 2; /* Firefox */ column-count: 2; -webkit-column-gap: 50px; /* Chrome, Safari, Opera */ -moz-column-gap: 50px; /* Firefox */ column-gap: 50px; margin-top: 35px; margin-bottom: 80px; padding-right: 15%; padding-left: 15%; max-height: 1000px !important; } } /* BREAKPOINT 960px */ @media only screen and (max-width: 960px) { .content img { max-width: 100%; height: auto; } .header .primary ul { -webkit-padding-start: 0px; /* removes default webkit padding on ul items */ } .typography h1, .typography h2, .typography h3, .typography h4, .typography h5, .typography h6, .body, .typography { color: #404040; } /* nav */ #media-query-trigger { visibility: visible; } nav#sticky.primary.clone { display: none;} .tablet-nav .header .primary .nav-open-button { /* styling and positioning of the nav toggle button */ z-index: 100; width: 20px; height: 20px; position: absolute; right: 20px; display: block; cursor: pointer; font-family: 'WebSymbolsRegular'; font-size: 20px; color: #d3d3d3; top: 4px; } .tablet-nav .header .primary ul { z-index: 10; position: relative; display: none; /* initially hiding the navigation */ float: left; margin: 0; padding: 0; white-space: normal; width: 100%; } .tablet-nav .header .primary ul li { width: 100%; margin: 0; padding: 0; float: none; /* displays list items vertically */ background: none; position: relative; //text-shadow: 0 1px #fff; } .tablet-nav .header .primary ul li a, .tablet-nav .header .primary ul li.current a, .tablet-nav .header .primary ul li.section a { /* styling the top level nav links */ padding: 10px 0; font-weight: normal; border-bottom: 1px solid #d3d3d3; background: #fff; } .tablet-nav .header .primary ul li.current a, .tablet-nav .header .primary ul li.section a { background-color: #f7f7f7; /* makes background on current top level page slightly darker */ } .tablet-nav .header .primary ul li a:hover { color: inherit; } .tablet-nav .header .primary li.section:after, .tablet-nav .header .primary li.current:after { display: none; /* hides the link arrow on current top level page */ } .tablet-nav .tablet-nav .header nav.primary ul li { padding: 0; } } @media only screen and (max-width: 800px) { .header .primary li { padding-bottom: 0px; margin: 0; position: relative; white-space: nowrap; display: inline-block; } .AccomodationPage .accomlink{ width: 105px; padding: 4px 4px 3px; letter-spacing: 1px; margin-left: 2px; margin-right: 2px; border: 1px solid rgba(161,162,169,0.5); font-size: 10px; text-transform: uppercase; } } /* BREAKPOINT 640px */ /* when changing the breakpoint below, change it ito the same value in the script.js file as well */ @media only screen and (max-width: 680px) { body { max-width: 680px; } .TopImagePage div.content { padding-bottom: 38px; } //div.clm.typography { -webkit-column-count: 1 !important; /* Chrome, Safari, Opera */ -moz-column-count: 1 !important; /* Firefox */ column-count: 1 !important; -webkit-column-gap: 50px; /* Chrome, Safari, Opera */ -moz-column-gap: 50px; /* Firefox */ column-gap: 50px; margin-top: 35px; margin-bottom: 30px; padding-left: 5%; max-height: 1000px; padding-right: 5px; } .extralinkmenu .accomlink, .AccomodationPage .accomlink{ width: 135px; padding: 4px 4px 3px; letter-spacing: 1px; margin-left: auto; margin-right: auto; border: 1px solid rgba(161,162,169,0.5); font-size: 10px; text-transform: uppercase; display: block; } div#colourwrap { background-color: white; max-width: 95%; padding-top: 53px; padding-bottom: 40px; margin-right: auto; margin-top: 23px; margin-left: auto; } .RatesPage div.content { background-color: white; margin-right: auto; margin-left: auto; padding-bottom: 50px; clear: both; padding-top: 50px; width: 85.5%; } .availability { width: 77.5%; margin-right: auto; margin-left: auto; background: white; padding-bottom: 20px; padding-right: 4%; padding-left: 4%; } #quickmenu ul { //max-width: 90%; margin-right: auto; margin-left: auto; } /* GALLERY */ #gallerycontainer div.gallery-item { margin-bottom: 20px; width: 90%; margin-right: auto; margin-left: auto; } #gallerycontainer div.gallery-item img{ width: 100%; } div#ex-holder { width: 90%; margin-right: auto; margin-left: 5%; margin-bottom: 3%; overflow: auto; float: left; position: relative; } div#ex-holder.last { margin-bottom: 20px; } div.ex-gallery-item.odd { float: left; } div.ex-gallery-item.info.odd { width: 100%; position: relative; background-color: #fff; margin: 0; right: 0; bottom: 0; display: block; height: 250px; } div.ex-gallery-item.info.even { width: 100%; position: relative; background-color: #fff; margin: 0; top: 0; right: 0; bottom: 0; display: block; height: 250px; } div#gallerycontainer { position: relative; padding-top: 20px; } div.ex-gallery-item.even { float: right; } div.ex-gallery-item.info span.exinfo { position: absolute; width: 90%; top: 50%; left: 5%; -ms-transform: translateY(-50%); /* IE 9 */ -webkit-transform: translateY(-50%); /* Safari */ transform: translateY(-50%); } #gallerycontainer div.ex-gallery-item { margin-bottom: 20px; width: 100%; margin-bottom:0px; clear: both; } #gallerycontainer div.ex-gallery-item img{ width: 100%; float: left; margin-bottom: 3%; } /* HOME LINKS */ .accomlink { display: block; width: 100%; max-width: 467px; margin-bottom: 30px; margin-right: auto; margin-left: auto; } li.quickmenu { width: 100%; display: block; float: none; margin-right: 0; margin-left: 0; margin-bottom: 30px; } /* Navigation*/ .tablet-nav .header .brand { float: none; display: inline-block; } .brand h1 { font-size: 40px; } .brand h1 { padding-right: 100px; /* padding stops .brand text from overlapping the search and nav buttons */ } #qdetails span#title h3{ margin-bottom: 0px; } #slidewrap div.quote-slider div.work-item img.workimage { background: none; } .tablet-nav .header { padding: 0px; border-bottom: 1px solid rgba(161,162,169,0.5); } .tablet-nav .header .inner { padding: 10px 0 0; min-height: 0; } div#logo { padding-top: 5px; padding-bottom: 2px; margin-bottom: 8px; } /* Search Form */ .search-bar { /* adds new styling to mobile search bar */ width: 100%; position: relative; top: 0; right: 0; display: none; /* hides searchbar initially */ padding: 20px 0; margin: 0; background-color: #E7E7E7; } .search-dropdown-icon { /* styling for search toggle button */ display: block; cursor: pointer; width: 20px; height: 20px; position: absolute; right: 60px; top: 34px; font-family: 'WebSymbolsRegular'; font-size: 20px; color: #ededed; text-align: center; line-height: 20px; } .search-bar form { margin: 0; width: 100%; } .search-bar form fieldset { padding: 0 18px; left: 0; right: 0; position: relative; } .search-bar div.field { margin-bottom: 0; } .search-bar form input.text { width: 89%; /* makes search input full width - allowing for space either side */ max-width: 89%; padding: 8px 10% 8px 1%; text-indent: 15px; position: relative; display: block; right: 0; left: 0; border: 1px solid #e5e5e5; background: #fff; font-size: 17px; -moz-border-radius: 20px; /* increase border radius due to increased padding */ border-radius: 20px; } .search-bar form input.action { right: 5%; top: 2px; font-size: 18px; } /* Main Content */ .main { padding: 0; /* decrease padding so that more content can fit on screen */ } .content-container, .sidebar { width: 100%; /* sidenav is now shown above the page content */ margin-bottom: 0; } .typography h1 { /* decrease size of page heading due to smaller screen */ font-size: 14px; line-height: 24px; margin-bottom: 15px; padding-bottom: 10px; } .typography p { line-height: 26px; text-align: center; font-size: 16px; } p.intro { font-size: 19px; line-height: 27px; } .main .inner { padding: 0 0px; background-repeat: no-repeat; } /* Secondry Nav */ .secondary li a { line-height: 24px; } .secondary li .arrow { line-height: 26px; } /* Footer */ .footer .right { float: left; width: 100%; } } /* Print Styles */ /* Based on HTML5 boilerplate print styles */ @media print { * { background: transparent !important; color: black !important; box-shadow: none !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; } a, a:visited { text-decoration: underline } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links for images, or javascript/internal links */ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } thead { display: table-header-group } tr, img { page-break-inside: avoid } img { max-width: 100% !important } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } /* Simple theme custom print styles */ .header, .footer, .nav-open-button, .search-bar, .search-dropdown-icon, nav.primary { display: none; } } @media only screen and (max-width: 480px) { #ser1,#ser2 { width: 100%; } .typography p { max-width: 93% !important; margin-right: auto; margin-left: auto; } div.inner.typography.line { padding-right: 0; padding-left: 0; } } /* Press page */ div#press { margin-bottom: 0; background-color: #f7f7f8; padding-top: 68px; } .b-bottom { border-bottom: 1px solid rgba(161, 162, 169, 0.5); padding-top:50px; } .client-name { color: #6e757f; font-size: 11px; font-family: sans-serif; line-height: 20px; } .press-img { max-width: 968px; margin-top:40px; } .press-img div.set2, .press-img div.set1{ margin-bottom: 0; } .press-gallery{ margin-top: 95px; } .press-gallery h3{ margin-bottom:20px; } .press-details p{ max-width: 100%; margin-bottom: 50px; } .press-details-head{ justify-items: center; margin-top:80px; } .press-details-head hr{ width: 30%; margin: 1em auto 0; } .press-details{ max-width: 880px; } .press-details-head h3{ margin-bottom:20px; } .press-img a { /*border: 1px solid #ccc;*/ width: fit-content; padding: 8px 12px; margin: 0 auto; color: #a4a1a1; text-decoration: none; background-color: #f2f2f2; } .press-content { text-align: center; display: flex; flex-direction: column; align-items: center; } @media(max-width:768px){ .press-content{ margin: 0 25px; } .press-details p{ margin-bottom: 25px; max-width: 100% !important; margin-right: 0; margin-left: 0; } .press-details .b-bottom{ padding-top: 25px; } } @media(max-width:480px) { .press-img #ser1, .press-img #ser2 { margin-bottom: 50px; } }