/****************************************************************** Theme Name: Simpsons Creative Grid 2022 Description: A responsive theme for WordPress, developed by Simpsons Creative, allowing for development of responsive websites - through the use of a dynamic grid system. Author: Simpsons Creative Version: 2022.04.26 Tags: fluid-layout, responsive-layout, accessibility-ready, translation-ready, microformats, rtl-language-support ******************************************************************/ /* Fonts - Need to be at top of style.css to load correctly */ /*@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');*/ /*@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');*/ @import url("https://use.typekit.net/mfb7fxp.css"); /* font-family: 'Lato', sans-serif; - BODY COPY font-family: 'Roboto', sans-serif; - HEADINGS font-family: futura-pt, sans-serif; */ :root { /* Set up CSS variables how to use: var(--red) */ /*theme colours*/ --primary: #522363; --secondary: #EA3785; --tertiary: #5BBFAC; --white: #FFFFFF; --whiteTrans: rgba(255, 255, 255, 0.8); --black: #000000; --blackTrans: rgba(51, 51, 51, 0.76); --grey: #707070; --lightGrey: #E6E6E6; --purple: #522363; --pink: #EA3785; --blue: #5BBFAC; --green: #C3E253; } /* Enable smooth scrolling on the whole document */ html { scroll-behavior: smooth; } /* Disable smooth scrolling when users have prefers-reduced-motion enabled */ @media screen and (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } /* Site Structure */ body { font-family: futura-pt, Arial, Helvetica, sans-serif; font-size: calc(12px + 0.5vw); /* Responsive base font size */ } /* Website Maximum Width - Default: 1920px */ .site-width { max-width: 1920px; } /*Website Inner Width - Default: 1280px*/ .inner-width { max-width: 1280px; } /*Post Maximum Width - Default: 960px*/ .single-post article.post { max-width: 960px; margin-left: auto; margin-right: auto; } /*Mobile Width */ .mobile-width { max-width: 767px; margin-left: auto; margin-right: auto; } /*Header*/ /*Footer*/ #footer { background-color: pink; } .inner-footer { background-color: purple; } .right { float: right; } /*==================== Standards ====================*/ /* 'Standards' contains all of the code that you're likely to change - font sizes, colors, buttons, etc. */ * { font-family: futura-pt, Arial, Helvetica, sans-serif; letter-spacing: 0.1px; } /*Text*/ h1, h2, h3, h4, h5, h6, p { margin: 0 0 5px 0; color: #000; } h1, h2, h3, h4, h5, h6 { color: var(--purple); font-family: futura-pt, Arial, Helvetica, sans-serif; font-style: normal; } h2, h3, h4, h5, h6 { font-weight: 500; } a { color: var(--pink); text-decoration: none; } a:hover { color: var(--pink); text-decoration: none; } a:visited { color: var(--pink); } h1 { font-size: 1.912em; } h2 { font-size: 1.616em; padding-bottom: 0.5em; } h3 { font-size: 1.3em; padding-bottom: 0.5em; } h4 { font-size: 1.1em; } h5 { font-size: 1em; } h6 { font-size: 0.8em; } p, #content li { color: var(--grey); font-family: futura-pt, Arial, Helvetica, sans-serif; font-size: 1em; line-height: 1.4em; padding-bottom: 1em; } em { font-style: italic; } sup { font-size: 0.8em; margin-left: -2px; } #content { clear: both; } #content ul, #content ol { margin-left: 0; margin-bottom: 0; } #content li { margin-left: 1em; padding-bottom: 1em; margin-bottom: 5px; } #content li::marker { float: left; } /*Gallery Fix*/ #content ul.blocks-gallery-grid { margin-left: unset; } #content .blocks-gallery-grid li.blocks-gallery-item { margin-bottom: 1em; } #content .wp-block-gallery li { margin-left: unset; padding-bottom: unset; } /*Gallery Caption*/ .wp-caption-text, .gallery-caption { text-align: center; } .wp-block-gallery figcaption { line-height: normal; text-align: center; } /*Bullet Points/Numbered Lists*/ .entry-content ul > li { list-style-type: disc; padding-bottom: 5px; } .entry-content ol > li { list-style-type: decimal; padding-bottom: 5px; } /*==================== Header ====================*/ #header { background-color: var(--whiteTrans); position: absolute; z-index: 999; padding: 15px 5%; } .inner-header { float: unset; display: flex; justify-content: space-between; width: 100%; align-items: center; } .logoArea {} .logoArea a { float: left; } .logoArea img { width: 60vw; height: auto; max-width: 200px; } .navArea {} /* Featured Area (Image/Video) */ .featuredArea { align-items: center; background-position: 50%; box-sizing: border-box; display: flex; justify-content: center; min-height: 430px; overflow: hidden; overflow: clip; padding: 1em; position: relative } .featuredArea .overlay { bottom: 0; left: 0; opacity: .5; position: absolute; right: 0; top: 0 } .featuredArea video.video-background { border: none; bottom: 0; box-shadow: none; height: 100%; left: 0; margin: 0; max-height: none; max-width: none; object-fit: cover; outline: none; padding: 0; position: absolute; right: 0; top: 0; width: 100% } .featuredArea { min-height: 100vh !important; align-items: flex-end; margin-bottom: 15px; } .featuredArea .featuredArea-inner-container { display: flex; flex-direction: column; align-items: center; z-index: 1; } .featuredArea .overlay { background-color: #000; opacity: 0.4; z-index: 1; } .featuredArea h1.title { font-size: 2.5em; font-weight: bold; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 15px; } .featuredArea h1.title:before { content: url(https://lingfieldpoint.co.uk/wp-content/themes/SCGrid/library/images/lp-white.svg); width: 1.5em; max-width: 85px; height: auto; } .featuredArea h1.title sup { font-size: 0.5em; margin-left: -5px; } .featuredArea p.tagline { font-size: 2em; line-height: normal; max-width: 1029px; } @media (max-height: 800px) { .featuredArea { min-height: 700px !important; } } @media (max-width: 767px) { .featuredArea { min-height: 600px !important; } } .featuredArea .featuredImage { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-position: center; background-size: cover; background-repeat: no-repeat; } .featuredArea.fixed { border-bottom: 40px solid #fff; margin-bottom: 0; } .featuredArea.fixed .featuredImage { position: fixed; z-index: -1; } .featuredArea.fixed video { position: fixed !important; z-index: -1; } /*==================== Nav ====================*/ .nav { float: right; background: none; } .nav ul { background: none; } .nav li a { color: #000; font-size: 1.4em; padding: 0.375em 0.75em; } .nav li a:hover, .nav li a:focus { color: var(--secondary); text-decoration: none; } .nav li:last-of-type a { padding-right: 0px; } .nav li ul.sub-menu, .nav li ul.children { border: none; } .nav li ul.sub-menu li, .nav li ul.children li { width: 100%; } .nav li ul.sub-menu li a, .nav li ul.children li a { background-color: var(--whiteTrans); width: 100%; white-space: nowrap; padding: 0.375em 0.75em; border: none; } .home .nav li ul.sub-menu li a, .nav li ul.children li a { background-color: transparent; } /* Responsive Menu - !!! REPLACE 444 WITH NEWLY CREATED MENU ID (ALSO IN HEADER.PHP) !!! */ #rmp_menu_trigger-22 { background: var(--primary); position: static; float: right; margin-left: 20px; } #rmp_menu_trigger-22.is-active { background: var(--secondary); position: fixed; top: unset; } #rmp_menu_trigger-22:hover, #rmp_menu_trigger-22:focus { background: var(--primary); } #rmp_menu_trigger-22 .responsive-menu-pro-inner::before { top: 8px; } #rmp_menu_trigger-22 .responsive-menu-pro-inner::after { bottom: 8px; } #rmp-container-22 { background-color: var(--primary); min-width: unset; } .rmp-menu-open { -webkit-box-shadow: 1px 1px 10px -2px #000; box-shadow: 1px 1px 10px -2px #000; } #rmp-menu-wrap-22 .rmp-menu-item-link { background-color: transparent !important; font-size: 18px; border-color: transparent !important; } #rmp-menu-wrap-22 .rmp-submenu .rmp-menu-item-link { font-size: 16px; font-weight: normal; } /* Current Menu Item */ #rmp-menu-wrap-22 .rmp-menu-current-item > a.rmp-menu-item-link { color: var(--secondary); font-weight: bold; } #rmp-menu-wrap-22 .rmp-menu-item-current-ancestor > a.rmp-menu-item-link { color: var(--secondary); font-weight: bold; } #rmp-menu-wrap-22 .rmp-submenu .rmp-menu-current-item .rmp-menu-item-link { color: var(--secondary); font-weight: bold; } /* Menu Item Hover */ #rmp-menu-wrap-22 .rmp-menu-item-current-ancestor > a.rmp-menu-item-link:hover { color: #fff; } #rmp-menu-wrap-22 .rmp-menu-item-link:hover { background-color: var(--secondary) !important; text-decoration: none; } #rmp-menu-wrap-22 .rmp-menu-current-item > a.rmp-menu-item-link:hover { color: #fff !important; } /* Additional Content */ .rmp-menu-additional-content { float: left; } .rmp-menu-additional-content .social-icons { width: 100%; float: left; padding: 20px 0px; } .rmp-menu-additional-content .social-icons a { color: #fff; font-size: 30px; margin-right: 15px; } .rmp-menu-additional-content .social-icons a:hover { color: var(--secondary); } /* Hide/Show Main Menu & Responsive Menu */ #rmp_menu_trigger-22 { display: none; } @media(max-width: 1029px) { #rmp_menu_trigger-22 { display: block; } #menu-main-menu { display: none; } } /*==================== Body ====================*/ /* No padding on last p in entry-content, unless panel */ .entry-content p:last-child:not(.panel) { padding-bottom: 0; } .wp-block-image figcaption { color: #888888; margin-bottom: 30px; } .wp-block-image.size-full figcaption { text-align: center; color: #fff; margin-bottom: 10px; } .article-header img { padding-bottom: 1.5em; } .wp-block-columns { margin-bottom: 1.75em; } .wp-block-image { margin-bottom: 1em; } .uppercase { text-transform: uppercase; } .smallIcon img, img.smallIcon { height: 50px; width: auto; } .mediumIcon img, img.mediumIcon { height: 100px; width: auto; } .largeIcon img, img.largeIcon { height: 150px; width: auto; } /* Multiple Column List */ #content .wp-block-columns.list ul { margin-bottom: 1em; } #content .wp-block-columns.list ul:last-child { margin-bottom: 0; } #content .wp-block-columns.list li { padding-bottom: 0; } /* Element Padding */ .pad-top { padding-top: 5%; } .pad-bottom { padding-bottom: 5%; } .pad-left { padding-left: 5%; } .pad-right { padding-right: 5%; } .pad-all { padding: 5%; } /* Colour Overlays */ .blackOverlay { background-color: rgba(0,0,0,0.5); width: 100%; height: 100%; display: block; position: absolute; top: 0px; z-index: 1; } .overlay.multiply, .multiply .overlay { mix-blend-mode: multiply; } /* Buttons */ a.button, #content a.button, a.wp-block-button__link, a.button.primary, #content a.button.primary, .wp-block-button.primary a.wp-block-button__link { background-color: var(--primary); color: #fff; border-color: var(--primary); border-radius: 9999px !important; } a.button.secondary, #content a.button.secondary, .wp-block-button.secondary a.wp-block-button__link { background-color: var(--secondary); color: #fff; border-color: var(--secondary); } a.button.black, #content a.button.black, .wp-block-button.black a.wp-block-button__link { background-color: #000; color: #fff; border-color: #000; } a.button.white, #content a.button.white, .wp-block-button.white a.wp-block-button__link { background-color: #fff; color: #000; border-color: #fff; } a.button.transparent, #content a.button.transparent, .wp-block-button.transparent a.wp-block-button__link { background-color: transparent; color: #fff; border-color: #fff; } a.button.large, #content a.button.large, .wp-block-button.large a.wp-block-button__link { font-size: 2em; font-weight: normal; padding: 15px 40px; } a.button.purple, #content a.button.purple, .wp-block-button.purple a.wp-block-button__link { background-color: var(--purple); color: #fff; border-color: var(--purple); } a.button.pink, #content a.button.pink, .wp-block-button.pink a.wp-block-button__link { background-color: var(--pink); color: #fff; border-color: var(--pink); } a.button.blue, #content a.button.blue, .wp-block-button.blue a.wp-block-button__link { background-color: var(--blue); color: #fff; border-color: var(--blue); } a.button.green, #content a.button.green, .wp-block-button.green a.wp-block-button__link { background-color: var(--green); color: #fff; border-color: var(--green); } /*Buttons Hover*/ a.button:hover, #content a.button:hover, a.wp-block-button__link:hover, a.button.primary:hover, #content a.button.primary:hover, .wp-block-button.primary a.wp-block-button__link:hover { background-color: transparent; color: var(--primary); text-decoration: none; border-color: var(--primary); transition: all .5s; } a.button.secondary:hover, #content a.button.secondary:hover, .wp-block-button.secondary a.wp-block-button__link:hover { background-color: transparent; color: var(--secondary); text-decoration: none; border-color: var(--secondary); } a.button.black:hover, #content a.button.black:hover, .wp-block-button.black a.wp-block-button__link:hover { background-color: transparent; color: #000; border-color: #000; } a.button.white:hover, #content a.button.white:hover, .wp-block-button.white a.wp-block-button__link:hover { background-color: transparent; color: #fff; border-color: #fff; } a.button.transparent:hover, #content a.button.transparent:hover, .wp-block-button.transparent a.wp-block-button__link:hover { background-color: transparent; color: #fff; border-color: #fff; opacity: 0.4; } a.button.purple:hover, #content a.button.purple:hover, .wp-block-button.purple a.wp-block-button__link:hover { background-color: transparent; color: var(--purple); border-color: var(--purple); } a.button.pink:hover, #content a.button.pink:hover, .wp-block-button.pink a.wp-block-button__link:hover { background-color: transparent; color: var(--pink); border-color: var(--pink); } a.button.blue:hover, #content a.button.blue:hover, .wp-block-button.blue a.wp-block-button__link:hover { background-color: transparent; color: var(--blue); border-color: var(--blue); } a.button.green:hover, #content a.button.green:hover, .wp-block-button.green a.wp-block-button__link:hover { background-color: transparent; color: var(--green); border-color: var(--green); } /* Tables */ .wp-block-table thead { background-color: var(--primary); color: #fff; font-weight: bold; border-bottom: none; } .wp-block-table tr:nth-child(even) { background-color: var(--lightGrey); } .wp-block-table td, .wp-block-table th { padding: 0.6em 0.8em; border: none; } .wp-block-table td { color: var(--primary); } .wp-block-table tfoot { font-weight: bold; border-top: none; } /* Panel */ .panel { background-color: var(--blue); clear: both; padding: 20px 5%; margin: 0; /*margin-top: 15px;*/ margin-bottom: 15px; } .panel.doublePadding { padding: 40px 5%; } .panel.triplePadding { padding: 60px 5%; } .panel * { color: #fff; } .panel .wp-block-columns { margin-bottom: 0; } /* Panel Headings */ .panel h1, .panel h2, h1.panel, h2.panel { color: #fff; font-size: 2em; font-weight: bold; line-height: normal; text-transform: uppercase; text-align: center; } /* Panel Colours */ .panel.purple { background-color: var(--purple); } .panel.pink { background-color: var(--pink); } .panel.blue { background-color: var(--blue); } .panel.green { background-color: var(--green); } .panel.grey { background-color: var(--grey); } .panel.black { background-color: var(--black); } /* Accordion Block */ .c-accordion__title, .inner-content .c-accordion__title { background-color: var(--purple); color: #fff; font-size: 1.2em; font-weight: normal; text-align: left; padding: 20px; padding-right: 40px; margin-bottom: 10px; } .c-accordion__title:after { color: #fff; font-size: 25px; right: 20px; } .wp-block-pb-accordion-item.is-open .c-accordion__title { margin-bottom: 20px; } .wp-block-pb-accordion-item:last-of-type { margin-bottom: 1em; } /*==================== Fifty Fifty (50:50) Block ====================*/ .fiftyFiftyBlock { background-color: var(--blue); } .fiftyFiftyBlock * { color: #fff; } .fiftyFiftyBlock h2 { color: #fff; } .fiftyFiftyBlock .overlay { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 1; } .fiftyFiftySection { position: relative; } .fiftyFiftyText { padding: 5%; } .fiftyFiftyImage { width: 100%; height: 100%; position: relative; padding-top: 66.66%; } .fiftyFiftyImage img.background, #main .fiftyFiftyImage img.background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .fiftyFiftyImage .fiftyFiftyText { position: absolute; top: 0; left: 0; z-index: 9999; } /* Aspect Ratios */ .fiftyFiftyBlock.Square .fiftyFiftyImage { padding-top: 100%; } .fiftyFiftyBlock.Four-to-Three .fiftyFiftyImage { padding-top: 75%; } .fiftyFiftyBlock.Three-to-Two .fiftyFiftyImage { padding-top: 66.66%; } .fiftyFiftyBlock.Sixteen-to-Nine .fiftyFiftyImage { padding-top: 56.25%; } .fiftyFiftyBlock.Fit-Content .fiftyFiftyImage { padding-top: 0; } /* Align Content */ /*Horizontally Centred*/ .fiftyFiftySection.h_center { text-align: center; } /*Vertically Centred*/ .fiftyFiftySection.v_center { display: flex; align-items: center; } .fiftyFiftySection.v_center .fiftyFiftyImage .fiftyFiftyText { top: 50%; left: 0; transform: translate(0, -50%); } /*Horizontally & Vertically Centred*/ .fiftyFiftySection.hv_center { text-align: center; display: flex; justify-content: center; align-items: center; } .fiftyFiftySection.hv_center .fiftyFiftyImage .fiftyFiftyText { top: 50%; left: 50%; transform: translate(-50%, -50%); } .fiftyFiftyBlock.Fit-Content .fiftyFiftyImage .fiftyFiftyText, .fiftyFiftyBlock.Fit-Content .fiftyFiftySection.v_center .fiftyFiftyImage .fiftyFiftyText, .fiftyFiftyBlock.Fit-Content .fiftyFiftySection.hv_center .fiftyFiftyImage .fiftyFiftyText { position: relative; top: unset; left: unset; transform: unset; z-index: 9999; } @media (max-width: 767px) { /*Mobile*/ .fiftyFiftyBlock .fiftyFiftySection.rightImageOnly { order: -1; } } .has-white-color * { color: #fff; } /*==================== Box Grid ====================*/ .box-grid { gap: 15px; margin-bottom: 15px; } .box-grid:last-child { margin-bottom: 0; } .box-grid-item { background-color: var(--purple); display: flex; width: calc(33.3333333333% - 10px); flex-basis: calc(33.3333333333% - 10px); border: 1px solid #232D3E; } .box-grid-item.industrial { background-color: var(--blue); } .box-grid-item.office { background-color: var(--green); } .box-grid-item { border: unset; position: relative; } .box-grid-item a { width: 100%; float: left; } .box-grid-item svg { margin-bottom: 20px; } .box-grid-item h3 { color: #fff; font-size: 1.4em; font-weight: 500; line-height: 1.4em; padding-bottom: 0; } .box-grid-item p { color: #fff; font-size: 1em; line-height: 1.2em; padding-bottom: 0px; } /* Hover Effect */ .box-grid-item:hover h3, .box-grid-item:hover p { color: #fff; } .box-grid-item img.post-image { transition: all 0.3s; } .box-grid-item:hover img.post-image { transform: scale(1.1); opacity: 0.7; } .box-grid-item .post-image-container { margin-bottom: 0; overflow: hidden; padding-top: 66.66%; } .box-grid-item .box-grid-info { width: 100%; max-width: 500px; display: block; height: auto; position: absolute; /*top: 50%; left: 50%; transform: translate(-50%, -50%);*/ z-index: 9999; padding: 20px 5%; } .box-grid-item .overlay { background-color: var(--purple); opacity: 0.3; mix-blend-mode: multiply; width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 1; } .box-grid-item #lpIcon, #main .box-grid-item #lpIcon { width: 10%; max-width: 50px; height: auto; object-fit: unset; position: absolute; top: 20px; right: 20px; z-index: 9999; } .box-grid.properties .box-grid-item .post-image-container { position: relative; padding-top: 56.25%; } .box-grid.properties .box-grid-item .post-image-container a.link { position: absolute; height: 100%; width: 100%; line-height: 0; top: 0; left: 0; } .box-grid.properties .box-grid-item .post-image-container img.post-image, #main .post-image-container img.post-image { width: 100%; height: 100%; object-fit: cover; } /* Available Space Stamp */ .box-grid-item div.availableStamp { background-color: var(--pink); width: 100px; height: 100px; display: flex; align-items: center; position: absolute; right: 20px; bottom: 20px; z-index: 999; border-radius: 50%; } .box-grid-item.industrial .post-image + div.availableStamp { background-color: var(--blue); } .box-grid-item.office .post-image + div.availableStamp { background-color: var(--green); } .box-grid-item div.availableStamp p { color: #fff; font-size: 18px; font-weight: bold; text-align: center; } /*==================== Home Page ====================*/ /* Home Page Header */ .home #header { background-color: transparent; position: absolute; z-index: 9999; } /* Home Nav */ .home .nav li a { color: #fff; } .home .nav li a:hover, .home .nav li a:focus { color: var(--secondary); } /* Home Featured Area */ .home .featuredArea { min-height: 100vh !important; align-items: unset; } .home .featuredArea .overlay { background-color: var(--purple) !important; opacity: 0.5; mix-blend-mode: multiply; } .home .featuredArea .wp-block-cover__inner-container { display: flex; flex-direction: column; gap: 25%; padding-top: 150px; } .home .featuredArea h1.title { font-weight: normal; } .home .featuredArea h1.title:before { content: ''; width: unset; height: unset; display: none; } @media (max-height: 800px) { .home .featuredArea { min-height: 800px !important; } } /* Home Page Footer */ .home #footer { margin-top: 0; } /* Availability/Available Space Section*/ #availability { justify-content: center; gap: 2em; } #availability .availableSpace { flex-basis: calc(50% - 1em); flex-direction: column; justify-content: space-between; } #availability .availableSpace .lpIcon { margin-bottom: 1em; } #availability .availableSpace h2 { color: #fff; font-size: 2em; font-weight: bold; text-align: center; text-transform: uppercase; padding-bottom: 0; } #availability .availableSpace p { color: #fff; font-size: 1.5em; text-align: center; } #availability .availableSpace a.button { font-weight: bold; text-transform: uppercase; } /* Features Panel Section */ #features .wp-block-image { padding-top: 1em; margin-top: 5px; } #features p { padding-bottom: 1em; } @media (min-width: 782px) and (max-width: 1078px) { #features br { display: none; } } /* About Panel Section */ #about { margin-bottom: 0; } #about #container, #about .wp-block-columns { gap: 1em; } #about h2 { text-transform: uppercase; } #about h3 { padding-bottom: 0; } #about h3 a { color: #fff; } #about h3 a:hover { text-decoration: none; opacity: 0.7; } /* Fifty Fifty (50:50) Block */ #fiftyFifty-block_6273b03dea1aa .fiftyFiftyText .largeIcon { margin-bottom: 20px; } #fiftyFifty-block_6273b03dea1aa .fiftyFiftyText h2 { padding-bottom: 0; } /* Location Section */ #location { background-color: var(--grey); gap: unset; margin-bottom: 0; } #location .text, #location .map { flex-basis: 50% !important; } #location .text { padding: 5%; } #location .text * { color: #fff; } #location .text h2 { padding-bottom: 0; } #location .text .wp-block-columns { margin-bottom: 0; } #location .map { line-height: 0; margin: 0; } #location .map iframe { width: 100%; } @media (min-width: 768px) { #location .map iframe { height: 100%; } } @media (max-width: 767px) { /*Mobile*/ #location .text, #location .map { flex-basis: 100% !important; } } /* Instagram Widget */ #instagramFeed { margin-top: 1.75em; margin-bottom: 1.75em; } #sb_instagram .sbi_info p { font-size: 14px; } #sb_instagram .sbi_date, #sb_instagram .sbi_location { color: #fff; } /*==================== Icon & Text Block ====================*/ .iconTextBlock { margin-bottom: 0; } .iconTextBlock .icon { flex-basis: auto !important; } .iconTextBlock .icon .wp-block-image { margin-bottom: 0; } .iconTextBlock .icon img { height: 150px; width: auto; } .iconTextBlock .text { flex-grow: 1 !important; } .iconTextBlock blockquote p { font-weight: bold; } .iconTextBlock blockquote p:last-of-type { padding-bottom: 0.5em; } /*==================== News/Blog Grid ====================*/ .blog-grid h3 { font-weight: bold; } .blog-grid p.post-date { color: var(--pink); font-weight: 500; } /* Featured Image - Different Aspect Ratios Fix */ .post-image-container { position: relative; padding-top: 56.25%; margin-bottom: 20px; } .post-image-container a { position: absolute; height: 100%; width: 100%; line-height: 0; top: 0; left: 0; } .post-image-container img, #main .post-image-container img { width: 100%; height: 100%; object-fit: cover; } /*==================== Pagination ====================*/ .pagination ul, #content .pagination ul { background-color: var(--purple); } .pagination li, #content .pagination li { border-right: 1px solid #fff; } .pagination a, .pagination span, #content .pagination a, #content .pagination span { color: #fff; } .pagination a:hover, .pagination a:focus, .pagination span:hover, .pagination span:focus { background-color: var(--pink) !important; color: #fff !important; } .pagination .current, #content .pagination .current { color: #fff !important; background-color: var(--pink); } .pagination .current:hover, .pagination .current:focus { background-color: var(--pink); color: #fff !important; } /*==================== Single Posts ====================*/ .single-post #header { position: relative; box-shadow: 0px 0px 3px 0px var(--grey); margin-bottom: 30px; } .single-post .page-title { font-weight: bold; } .single-post p.byline.entry-meta { color: var(--pink); font-weight: 500; } .single-post .wp-block-image, .single-post .wp-block-gallery { padding-bottom: 1em; margin-bottom: 5px; } /*==================== Single Property ====================*/ .single-properties .featuredArea .overlay { opacity: 0.3; } .single-properties .propType-industrial .panel { background-color: var(--blue); } .single-properties .propType-office .panel { background-color: var(--green); } .single-properties .entry-content > .panel:first-child { padding: 60px 5%; } .single-properties .features p { color: var(--purple); font-weight: bold; padding-bottom: 0; } .single-properties .features li, .single-properties #content .features li, .single-properties .features li span { color: var(--purple) !important; padding-bottom: 0; } /*.single-properties .panel + div { margin-top: 1.75em; margin-bottom: 1.75em; }*/ .wp-block-columns.brochure { gap: 15px; margin-bottom: 15px; } .wp-block-columns.brochure .wp-block-column:first-of-type { background-color: var(--lightGrey); display: flex; align-items: center; padding: 5%; } .wp-block-columns.brochure .wp-block-video { line-height: 0; margin-bottom: 0; } .wp-block-columns.brochure .wp-block-column:last-of-type { padding-right: 5%; } .wp-block-columns.brochure .wp-block-image:last-of-type { margin-bottom: 0; } .wp-block-columns.brochure h2 { padding-bottom: 0; } .wp-block-columns.brochure figcaption { margin-top: 1em; margin-bottom: 0; } .wp-block-columns.brochure figcaption a { background-color: var(--purple); color: #fff; text-align: center; text-transform: uppercase; display: block; padding: 20px; border: 1px solid var(--purple); } .wp-block-columns.brochure figcaption a:hover { background-color: transparent; color: var(--purple); text-decoration: none; transition: all .5s; } .single-properties .propType-industrial .wp-block-columns.brochure figcaption a { background-color: var(--blue); border-color: var(--blue); } .single-properties .propType-industrial .wp-block-columns.brochure figcaption a:hover { background-color: transparent; color: var(--blue); } .single-properties .propType-office .wp-block-columns.brochure figcaption a { background-color: var(--green); border-color: var(--green); } .single-properties .propType-office .wp-block-columns.brochure figcaption a:hover { background-color: transparent; color: var(--green); } .single-properties .entry-content > :last-child { margin-bottom: 15px; } .single-properties #footer { margin-top: 0; } /* August 2025 Changes */ .single-properties .wp-block-column.logo .wp-block-image { width: 100%; } /* Beehive */ body.postid-2173 .panel { background-color: #df7f30!important; } /* Baldwin */ body.postid-2167 .panel { background-color: #4d6c91!important; } /* Lingfield House */ body.postid-2174 .panel { background-color: #a59677!important; } /* Lingfield House 1st Floor */ body.postid-2175 .panel { background-color: #a59677!important; } /* Memphis / Student Loans Company (SLC) */ body.postid-2178 .panel { background-color: #006160!important; } /* Studios */ body.postid-2179 .panel { background-color: #76b82a!important; } .propType-office .panel.availableSpaceHeading { background-color: var(--green)!important; } .single-properties #intro.panel p, .single-properties #intro.panel li, .single-properties #intro.panel li span { color: #fff!important; } /*==================== Availability ====================*/ .availableSpaceTable p { background-color: var(--lightGrey); color: var(--purple); font-weight: bold; text-align: center; clear: both; padding: 20px 5%; margin: 0; margin-bottom: 15px; } .availableSpaceTable p:last-child, .entry-content .availableSpaceTable p:last-child { padding-bottom: 20px; } /* Availability Table */ .wp-block-table.availability thead { background-color: var(--lightGrey); color: var(--primary); font-weight: bold; } /*==================== Directory Page ====================*/ .page-id-2399 .c-accordion__title, .page-id-2399 .inner-content .c-accordion__title { font-size: 1em; } /*==================== The Wellbeing Centre Page ====================*/ #app-panel .inner-width { padding-left: 0; padding-right: 0; } #app-panel .wp-block-columns { gap: 0.5em; } #app-panel .wp-block-columns .text { display: flex; justify-content: center; align-items: center; } #app-panel .app-buttons { display: flex; flex-wrap: nowrap; justify-content: center; gap: 1em; } #app-panel .app-buttons .wp-block-image { width: fit-content; margin-bottom: 0; } #app-panel .app-buttons .wp-block-image img { height: 70px; width: auto; } /*==================== 404 Page ====================*/ body.error404 #content { padding-top: 150px; } /*==================== Footer ====================*/ #footer { background-color: var(--purple); position: relative; padding: 50px 5%; margin-top: 15px; } .inner-footer { background-color: transparent; position: relative; z-index: 999; row-gap: 1.75em; } #footer h2, #footer h3, #footer h4, #footer h5, #footer p { color: #fff; } #footer #bgIcon { height: 100%; width: auto; max-width: 100%; position: absolute; right: 0; bottom: 0; z-index: 1; padding: 20px; } #footer #form { -webkit-flex-flow: row; flex-wrap: nowrap; column-gap: 2em; align-items: flex-end; } #footer .copy { max-width: 300px; } #footer .copy h2 { padding-bottom: 0; } #footer .copy .lpIcon { width: 25%; max-width: 75px; height: auto; margin-bottom: 0.5em; } #footer #contact { flex-grow: 1; gap: 2em; } #footer #social { min-width: 300px; flex-direction: column; } #footer #social ul { gap: 15px; } #footer #social ul li a { color: var(--green); font-size: 50px; } #footer #social ul li a:hover { opacity: 0.7; } #footer #agents { flex-grow: 1; gap: 4em; } #footer #agents h5 { font-weight: bold; text-transform: uppercase; } #footer #agents ul li { color: #fff; font-size: 16px; margin-bottom: 5px; } #footer #agents ul li a { color: #fff; } #footer #agents ul li a:hover { text-decoration: none; opacity: 0.7; } #footer #cpne ul, #footer #kf ul { float: left; } #footer #cpne ul:first-of-type, #footer #kf ul:first-of-type { margin-right: 20px; margin-bottom: 10px; } #logos { background-color: #fff; justify-content: flex-end; column-gap: 2em; padding: 25px 5%; padding-bottom: 15px; } #logos a { float: left; } #logos #frogmore { width: 300px; height: auto; float: right; } #logos #frogmore img { width: 100%; height: auto; } #logos #mottisfont { width: 300px; height: auto; float: right; } #logos #mottisfont img { width: 100%; height: auto; } #legal { width: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: center; flex-wrap: wrap; margin-bottom: 25px; } #legal a { color: #000; font-size: 16px; } /* Ninja Forms */ .nf-before-form-content { display: none; } .ninja-forms-req-symbol { display: none; } .nf-form-content .listselect-wrap .nf-field-element div, .nf-form-content .ninja-forms-field { font-size: 1em; font-weight: normal; margin: 0; padding: 12px; } .nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea { background: #f7f7f7; border: 1px solid #c4c4c4; border-radius: 0; box-shadow: none; color: #787878; transition: all .5s; } .nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] { background-color: var(--green); color: var(--purple); font-size: 18px; font-weight: bold; width: fit-content; min-width: 210px; padding: 15px 20px; border: 1px solid var(--green); border-radius: 9999px; transition: all .5s; } .nf-form-content button:hover, .nf-form-content input[type=button]:hover, .nf-form-content input[type=submit]:hover { background: transparent; color: var(--green); transition: all .5s; } /* Form 1 - Footer */ #nf-form-1-cont { max-width: 1000px; } #nf-form-1-cont nf-field:nth-of-type(odd), #nf-form-1-cont nf-field:nth-of-type(even) { width: calc(50% - 10px); float: left; } #nf-form-1-cont nf-field:nth-of-type(odd) { margin-right: 10px; } #nf-form-1-cont nf-field:nth-of-type(even) { margin-left: 10px; } #nf-form-1-cont .nf-field-element textarea { height: 58px; line-height: 29px; } #nf-form-1-cont .field-wrap>div input[type=checkbox], #nf-form-1-cont .field-wrap button, #nf-form-1-cont .field-wrap input[type=button], #nf-form-1-cont .field-wrap input[type=submit] { font-size: 1em; font-weight: normal; text-align: left; width: 100%; height: 58px; min-width: unset; border-radius: 0px; } #nf-form-1-cont .nf-error-msg, #nf-form-1-cont .ninja-forms-req-symbol { color: #fff; } #nf-form-1-cont .nf-error-required-error { font-size: 14px; position: absolute; } #nf-form-1-cont .nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea { background: rgba(255,255,255,0.4); color: #fff !important; height: 58px; border-color: transparent; } #nf-form-1-cont .nf-form-content .list-select-wrap .nf-field-element>div::placeholder, .nf-form-content input:not([type=button])::placeholder, .nf-form-content textarea::placeholder { color: #fff !important; font-size: 1em; font-weight: normal; opacity: 0.4; } #nf-form-1-cont .nf-after-form-content { clear: both; float: right; } /*==================== Media Queries ====================*/ @media (max-width: 1536px) { #footer #agents { gap: 2em; } } @media (max-width: 1439px) { .single-properties .inner-content { padding-left: 0; padding-right: 0; } .single-properties .inner-width { padding-left: 5%; padding-right: 5%; } } @media (max-width: 1280px) { /*Small Desktop*/ .sd-1of2.box-grid-item { width: calc(50% - 7.5px); flex-basis: calc(50% - 7.5px); /*margin-bottom: 20px;*/ } .sd-1of4.box-grid-item { width: calc(25% - 11.25px); flex-basis: calc(25% - 11.25px); /*margin-bottom: 13.33333333333333px;*/ } .box-grid-item div.availableStamp { width: 60px; height: 60px; } .box-grid-item div.availableStamp p { font-size: 0.6em; } #footer #bgIcon { max-height: 500px; height: auto; } #footer #form { align-items: flex-start; } #fiftyFifty-block_6273b03dea1aa .fiftyFiftyText .largeIcon { max-height: 20vh; } } @media (max-width: 1029px) { /*Tablet*/ .t-1of2.box-grid-item { width: calc(50% - 7.5px); flex-basis: calc(50% - 7.5px); /*margin-bottom: 20px;*/ } .t-1of4.box-grid-item { width: calc(25% - 11.25px); flex-basis: calc(25% - 11.25px); /*margin-bottom: 13.33333333333333px;*/ } .box-grid-item div.availableStamp { width: 75px; height: 75px; } .box-grid-item div.availableStamp p { font-size: 0.8em; } #about #container { justify-content: center; } .fiftyFiftyBlock .fiftyFiftyImage { padding-top: 0 !important; } .fiftyFiftyImage .fiftyFiftyText, .fiftyFiftySection.v_center .fiftyFiftyImage .fiftyFiftyText, .fiftyFiftySection.hv_center .fiftyFiftyImage .fiftyFiftyText { position: relative; top: unset; left: unset; transform: unset; padding: 10% 5%; } } @media (max-width: 960px) { /*Single Post Width*/ #footer #agents div { flex-basis: calc(50% - 1em); } } @media (max-width: 781px) { .wp-block-columns.brochure .wp-block-column:last-of-type { padding-left: 5%; padding-right: 5%; } #content .wp-block-columns.list { gap: unset; } #content .wp-block-columns.list ul:last-child { margin-bottom: 1em; } #content .wp-block-columns.list .wp-block-column:last-child ul:last-child { margin-bottom: 0; } #about #container { gap: 2em; } #about .wp-block-columns { gap: unset; } #about .wp-block-column { text-align: center; } #about .wp-block-image { max-width: 300px; margin-left: auto; margin-right: auto; } } @media (max-width: 767px) { /*Mobile*/ .m-all.box-grid-item { width: 100%; flex-basis: 100%; /*margin-bottom: 20px;*/ } .m-1of2.box-grid-item { width: calc(50% - 7.5px); flex-basis: calc(50% - 7.5px); /*margin-bottom: 20px;*/ } .box-grid-item div.availableStamp { width: 60px; height: 60px; } .box-grid-item div.availableStamp p { font-size: 0.6em; } #footer #form { flex-direction: column; } #logos { justify-content: center; column-gap: 1em; padding-bottom: 25px; } } @media (max-width: 599px) { #about .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column:not(:first-child) { margin-left: 0; } #about #container { text-align: center; } .wp-sm-all.box-grid-item { width: 100%; flex-basis: 100%; } .box-grid-item div.availableStamp { width: 75px; height: 75px; } .box-grid-item div.availableStamp p { font-size: 0.8em; } } @media (max-width: 530px) { #footer #agents div { flex-basis: 100%; } } @media (max-width: 480px) { /*Small Mobile*/ .sm-all.box-grid-item { width: 100%; flex-basis: 100%; /*margin-bottom: 20px;*/ } .home .featuredArea { min-height: 1000px !important; } .home .featuredArea .wp-block-cover__inner-container { gap: 10%; } #availability .availableSpace { flex-basis: 100%; } #nf-form-1-cont nf-field:nth-of-type(odd), #nf-form-1-cont nf-field:nth-of-type(even) { width: 100%; margin-left: 0; margin-right: 0; } }