/* Fonts */ /* Web fonts */ /* Google Fonts (if any) should be preloaded in */ @import url('https://fonts.googleapis.com/css?family=Catamaran:400,700&display=swap'); /* Local fonts */ @font-face { font-family: 'Optima Bold'; src: url('../fonts/Optima-Bold.woff2') format('woff2'), url('../fonts/Optima-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Optima Reg'; src: url('../fonts/Optima-Regular.woff2') format('woff2'), url('../fonts/Optima-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } /* Font variables */ :root { --primary-font: 'Catamaran'; --headings-font: 'Optima Reg'; --headings-font-bold: 'Optima Bold'; --alt-font: 'Optima Reg'; } /* Colors */ /* Color variables */ :root { /* Colors */ --color-1-RED: #c9262d; --color-1-RED-alt: #9c040a; --color-2-RED: #333333; } .has-red-color { color: var(--color-1-RED)!important; } .has-red-background-color { background-color: var(--color-1-RED)!important; } .has-red-alt-color { color: var(--color-1-RED-alt)!important; } .has-red-alt-background-color { background-color: var(--color-1-RED-alt)!important; } .has-dark-gray-color { color: var(--color-2-RED)!important; } .has-dark-gray-background-color { background-color: var(--color-2-RED)!important; } .has-white-color, .has-white-color { color: #fff!important; } .has-white-background-color { background-color: #fff!important; } .has-black-color { background-color: #000!important; } .has-black-background-color { background-color: #000!important; } .has-large-font-size { font-size: 1.6rem!important; line-height: 2rem; } /* Animations */ /* Fadeup Effect */ .fadeup-effect { opacity: 0; overflow: hidden; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } @-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translateY(20px); } to { opacity: 1; -webkit-transform: translateY(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } /*! normalize.css v8.0.1 (November 2018) | MIT License | github.com/necolas/normalize.css */ html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button; appearance: button;}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none} /* Box sizing */ html, input[type="search"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} /* Site wide */ html, body { height: 100%; } body { /* background-color: #f0f0f0; */ color: rgba(0, 0, 0, 0.9); font-family: var(--primary-font), sans-serif; line-height: 1.5em; } body.no-sidebar { background-color: #fff; } .wrapper { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: 15px; padding-right: 15px; } /* Buttons */ .button, .wp-block-button__link, a[title=button] { position: relative; display: inline-block; text-align: center; padding: 15px 40px 15px 20px; margin-top: 20px; line-height: 1.2em; font-size: 1em; background-color: var(--color-1-RED); color: #fff; font-family: var(--headings-font-bold); border: 1px solid var(--color-1-RED); border-radius: 0; text-decoration:none; text-transform: uppercase; -webkit-transition:all .1s ease-in-out; -moz-transition:all .1s ease-in-out; -o-transition:all .1s ease-in-out; -ms-transition:all .1s ease-in-out; transition:all .3s ease-in-out; } .button::after, .wp-block-button__link::after, a[title=button]::after { position: absolute; top: 30%; right: 0; margin-right: 10px; content: ' →'; padding: 0 10px 0 0; transition:all .3s ease-in-out; } .button:hover::after, .wp-block-button__link:hover::after, a[title=button]:hover::after { padding: 0 0 0 10px; transition:all .3s ease-in-out; } /* Aligned buttons */ .button.align-center { position: relative; left: 50%; transform: translateX(-50%); } /* Inverted buttons */ .button.inversed, .wp-block-button.inversed .wp-block-button__link { background-color: #fff; color: var(--color-1-RED); } /* Back buttons */ .button.back, .wp-block-button.back .wp-block-button__link { padding-right: 20px; padding-left: 40px; } .button.back::after, .wp-block-button.back .wp-block-button__link::after { content: ''; } .button.back::before, .wp-block-button.back .wp-block-button__link::before { position: absolute; top: 30%; left: 0; margin-left: 10px; content: '← '; padding-right: 0; padding-left: 10px; transition:all .3s ease-in-out; } .button.back:hover::before, .wp-block-button.back:hover .wp-block-button__link::before { padding-right: 15px; padding-left: 0; transition:all .3s ease-in-out; } /* SVG icons */ svg.icon { display: inline-block; width: 20px; height: 20px; stroke-width: 0; stroke: currentColor; fill: currentColor; margin-right: 5px; vertical-align: middle; } .icon-mobile { transform: rotate(-15deg); } /* Content selection */ ::-moz-selection { background-color: var(--color-1-RED); color: #fff; } ::selection { background-color: var(--color-1-RED); color: #fff; } /* Site header */ .site-header { background-color: #fff; } /* Site branding */ .site-logo-wrapper { z-index: 99999; } /* Site logo */ .site-logo { padding: 10px 0 0 10px; z-index: 99999; } .site-logo a { display: inline-block; } .site-logo a img { width: 180px; height: auto; } /* Site description */ .home .site-description { margin: 0; padding: 10px 10px; font-size: 1.3rem; text-align: center; } /* Mobile topbar */ .mobile-topbar { position: fixed; top: 0; left: 0; height: 60px; background-color: transparent; z-index: 9999; /* border-bottom: 1px solid #fff; */ } .mobile-topbar .inner { height: 100%; overflow: hidden; } /* Menu button */ .responsive-menu-button { position: fixed; top: 10px; right: 10px; display: inline-block; width: 50px; height: 50px; z-index: 99999; padding: 0; margin: 0; outline: none; cursor: pointer; overflow: visible; } .responsive-menu-button, .responsive-menu-open .responsive-menu-button { background-color: var(--color-1-RED); border: 1px solid #fff; border-radius: 5px; } .responsive-menu-button.is-active { left: inherit; background-color: var(--color-1-RED); } /* Menu button icon / shapes */ .responsive-menu-button-icon { width: 25px; height: 19px; display: inline-block; position: relative; vertical-align: middle; } .responsive-menu-inner { display: block; top: 50%; margin-top: -1.5px; } .responsive-menu-inner, .responsive-menu-inner::before, .responsive-menu-inner::after { width: 25px; height: 3px; background-color: #fff; position: absolute; } .responsive-menu-open .responsive-menu-inner, .responsive-menu-open .responsive-menu-inner::before, .responsive-menu-open .responsive-menu-inner::after { background-color: #fff; } .responsive-menu-inner::before, .responsive-menu-inner::after { content: ""; display: block; } .responsive-menu-inner::before { top: -8px; } .responsive-menu-inner::after { bottom: -8px; } /* Menu button text */ .responsive-menu-button-text { display: none; color: #fff; font-size: 9px; padding-top: 3px; } /* Menu button shapes animation */ .responsive-menu-boring .responsive-menu-inner, .responsive-menu-boring .responsive-menu-inner::before, .responsive-menu-boring .responsive-menu-inner::after { transition-property: none; transition: all .3s ease; } .responsive-menu-boring.is-active .responsive-menu-inner::before { top: 0; opacity: 0; transition: all .3s ease; } .responsive-menu-boring.is-active .responsive-menu-inner { transform: rotate(45deg); transition: all .3s ease; } .responsive-menu-boring.is-active .responsive-menu-inner::after { bottom: 0; transform: rotate(-90deg); transition: all .3s ease; } /* Menu button animation */ .responsive-menu-boring .responsive-menu-inner { opacity: 1; } .responsive-menu-boring.is-active .responsive-menu-inner { opacity: 1; } /* .responsive-menu-boring { transform: rotate(0deg); transition: all .3s ease; } */ /* .responsive-menu-boring.is-active { transform: rotate(360deg); transition: all .1s ease; } */ /* Side menu container */ .responsive-menu-container { position: fixed; top: 0; left: 0; bottom: 0; overflow: scroll; background-color: #fff; z-index: 9; width: 100%; padding-bottom: 20px; } .responsive-menu-container .menu-logo { display: inline-block; margin: 10px 0 0 20px; } .responsive-menu-container .menu-logo a { display: inline-block; } .responsive-menu-container .menu-logo a img { width: 200px; height: auto; } .responsive-menu-container .menu-description { display: none; padding: 10px 10px 0 10px; margin: 0; text-align: center; font-family: var(--headings-font); font-size: 1rem; line-height: 1.3rem; color: var(--color-1-RED); font-style: italic; } /* Menu container animation */ .responsive-menu-container { transition: transform 0.5s; transition-timing-function: ease; transition-delay: 0s; max-width: 400px; } .responsive-menu-container { transform: translateX(-100%); -ms-transform: translateX(-100%); -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); } .responsive-menu-container::-webkit-scrollbar { display: none; /* Hide scrollbar for Chrome, Safari and Opera */ } .responsive-menu-container { -ms-overflow-style: none; /* Hide scrollbar for IE and Edge */ scrollbar-width: none; /* Hide scrollbar for Firefox */ } .responsive-menu-container.side-menu--open { transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); } /* Page overlay when side menu is open */ body.side-menu-open .side-menu-overlay { display: block; background-color: rgba(0,0,0,0.5) !important; content: ""; position: fixed; top: 0; left: 0; right: 0; bottom: 0; height: 100vh; z-index: 10; transition: all .3s ease; } body.side-menu-open .responsive-menu-container { z-index: 20; } .hide-side-menu-overlay { display: none; } /* Navigation menu */ .responsive-menu-container nav ul { padding: 0; } .responsive-menu-container nav ul li { list-style: none; } .responsive-menu-container nav ul li a { font-family: 'Optima Bold'; font-size: 1.6rem; text-decoration: none; color: var(--color-2-RED); padding: 15px 5px 9px 20px; display: block; border-bottom: 1px solid #eee; } .responsive-menu-container nav > ul > li:nth-last-child(2) > a { border: 0; } .responsive-menu-container nav ul.sub-menu li { margin-left: 20px; } .responsive-menu-container .current-menu-item > a, .responsive-menu-container .current_page_parent > a { color: var(--color-1-RED); } .responsive-menu-container li.menu-item-has-children.current_page_parent > a { color: var(--color-2-RED); } /* Sub-menus - Hides sub menus and makes them dropdown menus (jQuery is used to add/remove classes) */ /* .responsive-menu-container nav ul li.menu-item-has-children ul.sub-menu { display: none; } animation is done with jquery */ .responsive-menu-container nav > ul > li.menu-item-has-children { position: relative; } /* .responsive-menu-container nav > ul > li.menu-item-has-children.list--open:after { transform: rotate(90deg); transform-origin: center; transition: all .3s ease; } */ /* .responsive-menu-container nav > ul > li.current-menu-parent:after { transform: rotate(90deg); } */ .responsive-menu-container nav ul li.current-menu-parent > a { border-bottom: 1px solid #eee; } .responsive-menu-container nav ul li.current-menu-parent ul.sub-menu { display: block; } .responsive-menu-container nav ul li ul.sub-menu a { font-family: var(--headings-font); font-size: 1.4rem; line-height: 1.7rem; } /* .responsive-menu-container nav > ul > li.menu-item-has-children:after { content: '›'; font-family: var(--alt-font); padding-top: 20px; font-size: 3rem; background-color: transparent; position: absolute; top: 0; right: 25px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; transform: rotate(0deg); transform-origin: center; transition: all .2s ease; } */ /* Transforms last menu item into a call-to-action button */ .responsive-menu-container nav > ul > li:last-child { text-align: center; margin-top: 20px; } .responsive-menu-container nav > ul > li:last-child a { display: inline-block; background-color: var(--color-1-RED); color: #fff; font-size: 1.4rem; padding: 20px 28px 20px 28px; text-transform: uppercase; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpath fill='%23921c21' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23a01e24' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23ad2127' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23bb232a' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23c9262d' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%23d3282f' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23dc2a31' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23e62b34' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%23f02d36' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23fa2f38' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E"); background-size: cover; } /* .responsive-menu-container nav > ul > li:last-child a:after { content: ' »'; } */ .responsive-menu-container nav > ul > li:last-child a:hover { background-color: var(--color-1-RED) !important; background-image: none; } /* Widgets area */ .widget-areas { padding: 0 10px; text-align: center; } /* Business info */ .business-info ul { padding: 0; margin: 40px 0; } .business-info ul li { list-style: none; margin-bottom: 20px; font-family: var(--headings-font); } .business-info ul li a { color: var(--color-1-RED); text-decoration: none; } .business-info ul li a.map { text-decoration: underline; } .business-info ul li a:hover { text-decoration: underline; } .business-info ul li i { padding-right: 5px; font-size: 1.3rem; } .business-info ul li:first-child { font-size: 1.7em; font-family: var(--headings-font-bold); } .business-info ul li:nth-child(2) { font-size: 1.2em; font-family: var(--headings-font-bold); } .business-info ul li:nth-child(3) { font-size: 1.2em; } .business-info ul li span { display: block; } /* Social icons */ .social-icons { max-width: 400px; margin: 30px auto; } .social-icons ul { list-style: none; display: flex; justify-content: center; margin: 0; padding: 0; } .social-icons ul li:not(:last-child) { margin-right: 10px; } .social-icons ul li a { display: inline-block; width: 70px; height: 70px; line-height: 70px; border-radius: 40px; background-color: var(--color-1-RED); text-decoration: none; color: #fff; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: auto; } .social-icons ul li a:hover { color: #fff; } .social-icons svg { width: 2rem; height: 2rem; fill: #fff; stroke-width: 0; stroke: currentColor; margin: 0; } /* Site Page */ .site-page { font-size: 18px;margin-bottom: 30px; } .page-section { padding: 0 0 0; } /* Page header image */ .site-background-image { background-color: #fff; background-size: cover; background-position-x: 50%; background-repeat: no-repeat; position: relative; text-align: center; padding: 30% 0; } h1.page-title { /* background-color: rgba(0, 0, 0, 0.3); */ text-shadow: 0px 4px 4px rgba(0, 0, 0, .6); color: #fff; font-size: 1.8rem; line-height: 1.9rem; max-width: 1000px; margin-left: auto; margin-right: auto; position: relative; display: inline-block; padding: 8px 10px 7px 10px; border-radius: 3px; } h1.page-title i, h1.page-title em { display: block; font-size: .55em; line-height: 1.2rem; margin-top: 5px; font-family: var(--headings-font); } .overlay { background-color: #333; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.4; } .wave { display: block; width: 100%; transform: translateY(-33%); } .wave svg { fill: #fff; } /* Main content */ main { background-color: #fff; padding: 0 0.8em 0.8rem; } /* Headings */ h1, h2, h3, h4, h5 { font-family: var(--headings-font-bold); } h2:after { content: ''; display: block; width: 60px; height: 10px; border-bottom: 2px solid var(--color-1-RED); } .home h2 { font-size: 2rem; line-height: 2.1rem; } .home h2:after { margin: auto; height: 2rem; } main h2 { line-height: 1.7rem; margin-top: 50px; clear: both; color: var(--color-1-RED); } main h2 em { font-size: .7em; color: var(--color-1-RED); } /* Paragraphs & links */ body:not(.home) p.emphase { background-color: var(--color-1-RED); color: #fff; padding: 0.7rem 0.8rem; font-size: 1.2rem; max-width: 100vw; position: relative; } body:not(.home) p.emphase a { color: #fff; text-decoration: underline; } /* Links */ a { color: currentColor; } p a { color: var(--color-1-RED); text-decoration: none; } p a:hover { text-decoration: none; } /* Lists */ main ul { display: inline-block; margin: 0; padding: 0 0.7rem 0 2.8rem; } main ul li { margin-bottom: 10px; } /* Custom classes */ .away a, .away figure { display: block; position: relative; overflow: hidden; text-align: center; } .away a::before, .away figure::before { content: 'Away'; position: absolute; bottom: 15%; left: -10%; width: 120%; padding: 3px 0 5px 0; font-family: var(--headings-font); color: #fff; text-align: center; font-size: 1.4rem; background-color: var(--color-1-RED); transform: rotate(-3deg); z-index: 99; } .away a img, .away figure img { opacity: .6; } footer .away a img { opacity: 1; } footer .away a::before { opacity: .8; } /* Gutenberg blocks */ /* Gutenberg - Custom classes (to be used in Gutenberg blocks... or anywhere else) */ .pb0 { padding-bottom: 0 !important; } .pb10 { padding-bottom: 10px !important; } .pb20 { padding-bottom: 20px !important; } .pb30 { padding-bottom: 30px !important; } .pb40 { padding-bottom: 40px !important; } .pb60 { padding-bottom: 60px !important; } .pb80 { padding-bottom: 80px !important; } .pb100 { padding-bottom: 100px !important; } .pt0 { padding-top: 0 !important; } .pt10 { padding-top: 10px !important; } .pt20 { padding-top: 20px !important; } .pt30 { padding-top: 30px !important; } .pt40 { padding-top: 40px !important; } .pt60 { padding-top: 60px !important; } .pt80 { padding-top: 80px !important; } .pt100 { padding-top: 100px !important; } .mb0 { margin-bottom: 0 !important; } .mb10 { margin-bottom: 10px !important; } .mb20 { margin-bottom: 20px !important; } .mb30 { margin-bottom: 30px !important; } .mb40 { margin-bottom: 40px !important; } .mb60 { margin-bottom: 60px !important; } .mb80 { margin-bottom: 80px !important; } .mb100 { margin-bottom: 100px !important; } .mt0 { margin-top: 0 !important; } .mt10 { margin-top: 20px !important; } .mt20 { margin-top: 20px !important; } .mt30 { margin-top: 30px !important; } .mt40 { margin-top: 40px !important; } .mt60 { margin-top: 60px !important; } .mt80 { margin-top: 80px !important; } .mt100 { margin-top: 100px !important; } .no-max-width img, .no-max-width figure { max-width: 100% !important; } .underline:after { content: ' '; display: block; margin: auto; height: 1px; background-color: #000; width: 10%; margin-top: 7px; } .hide { display: none!important; } @media only screen and (max-width: 767px) { .hom { display: none!important; } /* hide on mobile */ } @media only screen and (min-width: 1024px) { .hot { display: none!important; } /* hide on tablet */ } @media only screen and (min-width: 1200px) { .hod { display: none!important; } /* hide on desktop */ } /* Gutenberg native block: button */ .wp-block-button__link { background-color: var(--color-1-RED); } /* Gutenberg native block: table */ .wp-block-table { width: 100%; max-width: 700px; margin-left: 0; } .wp-block-table tr td { padding: 10px 1%; } .wp-block-table tr td:first-child { width: auto; padding-left: 10px; } .wp-block-table tr td:last-child { text-align: right; vertical-align: top; padding-right: 10px; } /* Gutenberg block: Yoast structured FAQ (transformed into accordion) */ .wp-block-yoast-faq-block { padding: 0.8rem 0; } .schema-faq-section { border: 1px solid #ddd; border-radius: 5px; overflow: hidden; margin-top: 10px; } .schema-faq-question { position: relative; display: block; background-color: #f5f5f5; font-family: var(--headings-font); font-size: 1.1em; line-height: 1.2em; letter-spacing: -.3px; padding: 12px 39px 12px 10px; cursor: pointer; transition: all 0.2s ease-in-out; } .schema-faq-question:hover, .schema-faq-question:focus, .schema-faq-question:active { color: var(--color-1-RED); } .schema-faq-question:after { position: absolute; top: 12px; right: 5px; display: inline-block; width: 30px; height: 30px; text-align: center; background-color: var(--color-1-RED); border: 1px solid var(--color-1-RED); border-radius: 3px; } /* .schema-faq-question:after { content: '▼'; content: '⌄'; color: #fff; } */ .schema-faq-question:after { padding: 2px 0 0 2px; content: url("data:image/svg+xml;charset=UTF-8, "); } .open .schema-faq-question { color: var(--color-1-RED); } .open .schema-faq-question:after {opacity: 1; background-color: #fff; /* content: '▲'; */ padding: 2px 0 0 2px; content: url('data:image/svg+xml;charset=UTF-8, '); } .schema-faq-answer { display: none; margin: 0px 10px; padding: 30px 0 20px 0; } /* Gutenberg native block: image */ .wp-block-image:not(.profile-pic) figure.alignleft, .wp-block-image:not(.profile-pic) figure.alignright { float: none; margin-right: auto; margin-left: auto; } .wp-block-image figcaption { font-style: italic; margin: 0; font-size: .9rem; line-height: 1rem; padding: 0 0.8rem; text-align: center; } /* Gutenberg native block: gallery */ .wp-block-gallery { padding: 0 0.8rem; } .wp-block-gallery .blocks-gallery-item { flex-grow: initial; } /* Gutenberg native block: cover */ .wp-block-cover { height: auto; } .wp-block-cover .wp-block-cover__inner-container { max-width: 1200px; padding-bottom: 50px; } .wp-block-cover .wp-block-cover__inner-container h2 { line-height: 2rem; } .wp-block-cover .wp-block-cover__inner-container .uagb-tm__content { padding: 0 !important; } /* Gutenberg native block: group */ /* .wp-block-group { display: table; } */ /* Gutenberg native block: columns (flexbox layout) */ .site-page .wp-block-columns.crew-index { gap: 10px; flex-wrap: wrap!important; } .site-page .wp-block-columns.crew-index > .wp-block-column { flex-basis: calc((100% - 20px) / 3)!important; flex-grow: 0; margin: 0!important; } .site-page .wp-block-columns.crew-index .wp-block-column figure { margin: 0; } .site-page .wp-block-columns.crew-index .wp-block-column figure img { position: relative; height: auto; /* -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 85%, 50% 100%, 0% 85%, 0 0); */ /* -webkit-clip-path: polygon(5% 5%, 100% 0%, 100% 75%, 75% 75%, 75% 100%, 50% 75%, 0% 75%); */ /* -webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%); */ } /* Gutenberg: blocks alignment */ .alignfull { width: 100vw; max-width: 100vw; left: calc(50% - 50vw); position: relative; margin: 0 0 30px 0; } .aligncenter figcaption { text-align: center; } .alignwide figcaption { text-align: center; } .alignfull figcaption { text-align: center; } /* Gutenberg: additional CSS classes (that can be added to individual blocks throught the "Additional CSS class" field in Gutenberg "*/ /* Profile pictures */ .wp-block-image.profile-pic figure { width: 50%; max-width: 334px; margin-top: 0; margin-bottom: 0; margin-left: -.8rem; } .wp-block-image.profile-pic figure img { height: auto; } .wp-block-image.profile-pic figcaption { font-size: 2rem; } /* All blocks */ .no-margin-top { margin-top: 0; } .no-margin-bottom { margin-bottom: 0; } /* UAGB/SPECTRA plugin - addon blocks for Gutenberg */ .uagb-slick-carousel .slick-slide img { height: auto; } .uagb-slick-carousel ul.slick-dots { padding: 0; } .uagb-slick-carousel ul.slick-dots li button:before { font-size: 60px;} .uagb-post-grid .uagb-post__items article { max-width: 300px !important; margin: auto; } .uagb-post-grid .uagb-post__image img { height: auto; } .uagb-post-grid .uagb-post__inner-wrap { box-shadow: 0 3px 12px rgba(0,0,0,0.16);} .uagb-post-grid .uagb-post__inner-wrap:hover { cursor: pointer; } .uagb-post-grid .uagb-post__inner-wrap:hover .uagb-post__title a { color: var(--color-1-RED) !important; } /* .uagb-post-grid .uagb-post__inner-wrap:hover .uagb-post__image { opacity: .8; } */ .uagb-slick-carousel .slick-arrow { display: none!important; } @media only screen and (min-width: 1024px) { .uagb-slick-carousel .slick-arrow { display: block!important; } .uagb-slick-carousel .slick-next { right: -45px; z-index: 1; } } .uagb-post__author::before { content: 'by '; } .uagb-post__author a { text-decoration: none; } .uagb-post-grid .uagb-post__cta a { font-family: var(--headings-font-bold); } .uagb-testinomial-text-wrap { font-style: italic; color: var(--color-2-RED) ; } /* .uagb-testinomial-text-wrap { background-image: url(https://www.ultimategutenberg.com/wp-content/uploads/2018/12/quote23.png); background-size: auto; background-position: center center; background-repeat: no-repeat; } */ .uagb-testinomial-text-wrap:before { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; display: block; color: rgba(201, 38, 45, .2);; content: '"'; font-size: 20em; line-height: 1em; font-style: normal; z-index: -1; } /* Posts - Grid display */ .uagb-post-grid.is-grid article { width: 100%; max-width: 300px; float: none; display: block; margin: 0 auto!important; transition: all .3s ease; } .uagb-post-grid.is-grid article:hover { transform: scale(1.02); } .uagb-post-grid article .uagb-post__excerpt { display: none; } .uagb-post__image a { display: block; position: relative; top: 0; right: 0; bottom: 0; left: 0; padding-bottom: 60% !important; } .uagb-post-grid.is-grid.uagb-post__image-position-top .uagb-post__image a.uagb-image-ratio-inherit img { position: absolute!important; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } @media only screen and (min-width: 767px) { .uagb-post-grid.is-grid { grid-template-columns: repeat(5 , minmax(0, 1fr)); gap: 40px!important; } .uagb-post-grid.is-grid article { max-width: none; } .uagb-post-grid.is-grid article .uagb-post__excerpt { display: block; } } @media only screen and (min-width: 1200px) { .uagb-post-grid.is-grid { grid-template-columns: repeat(4 , minmax(0, 1fr))!important; gap: 40px!important; } } /* Text size */ .small { font-size: .8em; line-height: 1.1em; display: inline-block; } .bigger { font-size: 1.3em; line-height: 1.1em; } .biggger { font-size: 1.6em; line-height: 1.1em; } .biggger a { color: #fff; } /* Forms */ input, textarea { width: 100%; border: 1px solid #ccc; } /* Services page*/ .services div h3 { flex-basis: 100%; } .services ul { padding: 0; display: block; } .services ul li { list-style-type: none; font-family: var(--headings-font); font-size: 1.2rem; border-radius: 5px; margin: 0 20px 20px 0; background-color: #f0f0f0; display: block; } .services ul li:hover { color: #fff; background-color: var(--color-1-RED); } .services ul li a { display: block; text-decoration: none; padding: 10px; width: 100%; } /* Frontpage */ body.home .emphase { font-size: 1.1em; text-align: center; } body.home .emphase strong { color: var(--color-1-RED); font-family: var(--headings-font-bold);} body.home .emphase span.emphase { display: block; font-family: var(--headings-font-bold); color: var(--color-1-RED); font-size: 1.3em; } body.home .emphase h3 { background-color: var(--color-1-RED); color: #fff; margin: 15px auto 0 auto; font-size: 1.3em; line-height: 1.3em; border-radius: 7px; display: inline-block; padding: 0 10px;} body.home .emphase h3 { background: none; color: var(--color-1-RED); font-style: italic; font-size: 1.8em; } body.home .emphase h3 + p { margin-top: 0; } body.home .custom-cover-block { margin-top: 30px; } body.home .custom-cover-block .wp-block-button__link { background-color: #fff; color: var(--color-1-RED); margin: 0; border: 0; } /* Team page */ .crew-index .wp-block-image figcaption span { display: block; } /* Contact page */ .contact-page .wp-block-column { flex-basis: 100%; margin: 0; } .contact-page .wp-block-column ul { padding: 0; margin-top: 1em; } .contact-page .wp-block-column ul li { list-style: none; } .contact-page .wp-block-column ul li:not(:last-child) { font-size: 1.4rem; } .contact-page .wp-block-column ul li:last-child p { display: inline-block; vertical-align: top; margin: 0; } .contact-page .wp-block-column ul li a { text-decoration: none; color: var(--color-1-RED); } .contact-page .wp-block-column table { max-width: 300px; } .contact-page .map figure { width: 100%; margin: 0;} /* Customizing "Contact Form 7" plugin */ .wpcf7 { background-color: #f7f7f7; padding: 10px !important; margin-bottom: 50px !important; color: #fff; background-color: #85191e; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpath fill='%23921c21' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23a01e24' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23ad2127' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23bb232a' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23c9262d' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%23d3282f' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23dc2a31' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23e62b34' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%23f02d36' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23fa2f38' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E"); background-attachment: fixed; background-size: cover; } .wpcf7 input { max-width: 300px; } .wpcf7 textarea { height: 200px; } .wpcf7 input, textarea { padding: 10px; } .wpcf7 input:focus, .wpcf7 textarea:focus { border-color: #fff; } .wpcf7 input[type="submit"].wpcf7-submit { display: block; width: auto; background-color: var(--color-1-RED); color: #fff; padding: 10px 20px; margin:20px auto 0 auto; } .wpcf7 input[type="submit"].wpcf7-submit:hover, .wpcf7 input[type="submit"].wpcf7-submit:focus { background-color: #fff; color: var(--color-1-RED); cursor: pointer; } .wpcf7 span.wpcf7-not-valid-tip { color: #eee; font-size: .8em; } .wpcf7 .wpcf7-response-output { border: 2px solid #fff !important; color: #fff; margin-top: 0; } span.wpcf7-not-valid-tip { color: #fff; font-style: italic; } fieldset { padding: 0; border: 0; } /* Blog posts index (cards) */ article.post-card { margin: 2rem auto; max-width: 300px; box-shadow: 0 3px 12px rgba(0,0,0,0.16); } article.post-card:hover figure { opacity: .8; } article.post-card:hover h2 { color: var(--color-1-RED); } article.post-card figure { margin: 0; } article.post-card figure img { width: 100%; } article.post-card a { text-decoration: none; display: inline-block; } article.post-card a.button { text-transform: capitalize; } article.post-card:hover a.button:after { padding: 0 0 0 10px; transition:all .3s ease-in-out; } article.post-card h2 { font-size: 1.4rem; margin: 1.7rem 1.7rem; color: var(--color-2-RED); } article.post-card .entry-content { text-align: center; } article.post-card .entry-content p { padding: 0 1.7rem; text-align: left; } article.post-card .entry-content a { margin-bottom: 1rem; } article.post-card .entry-author { font-style: italic; padding: 0 1.7rem; } /* Blog posts */ article { margin-top: 2em; margin-bottom: 100px; } article .entry-meta { font-style: italic; margin-bottom: 30px; } article .entry-meta .author { background-color: rgba(201, 38, 45, 1); color: #fff; padding: 2px 10px; } article .entry-meta .author-desc { display: inline-block; background-color: rgba(201, 38, 45, .8); color: #fff; padding: 5px 10px; margin-top: 6px; font-size: .9rem; line-height: 1.2rem; } main .recent-posts-title { font-family: var(--headings-font-bold); font-size: 2rem; line-height: 1.65em; text-align: center; } main .recent-posts { text-align: center; } main .recent-posts article { max-width: 300px; margin: 40px auto 0 auto; box-shadow: 0 3px 12px rgba(0,0,0,0.16); } main .recent-posts article figure { margin-right: 0; } main .recent-posts article a { text-decoration: none; color: var(--color-1-RED); } main .recent-posts article .entry-title h4 { font-size: 1.3rem; line-height: 1.5rem; padding: 0 1rem; } main .recent-posts article .entry-author { font-size: 1rem; padding: 0 .5rem .5rem .5rem; } /* Sidebar */ aside { clear: both; margin-top: 30px; padding: 0 0.8rem 0 0.8rem; } aside section { position: relative; background-color: #fff; border-radius: 10px; padding: 20px 10px 10px 10px; margin: 0 auto 30px auto; max-width: 300px; box-shadow: 0 3px 12px rgba(0,0,0,0.16); } aside section:last-child { margin-bottom: 0; } aside h3 { font-family: 'Optima Bold'; color: var(--color-2-RED); font-size: 1.5em; padding: 0; text-transform: capitalize; margin-top: 0; } aside h3:after { content: ''; display: block; width: 50px; height: 10px; border-bottom: 2px solid var(--color-1-RED); } aside a { color: var(--color-1-RED); text-decoration: none; } aside a:hover { text-decoration: underline; } aside ul { padding-left: 0px; } aside ul li { margin-bottom: 10px; list-style: none; } aside section#block-8 { background: transparent url('../images/background-bookings.jpg') no-repeat top right; background-size: cover; background-position-y: -70px; color: #fff; padding: 20px 5px 10px 0; border-radius: 0; text-align: center; text-shadow: 0px 3px 3px rgba(0, 0, 0, .7); max-width: none; } aside section#block-8::before { content: ''; display: block; position: absolute; width: 100%; height: 100%; top: 0px; left: 0; background-color: #000; opacity: 0.4; text-shadow: 0px 4px 4px rgba(0, 0, 0, .6); } aside section#block-8 h3 { position: relative; color: #fff; font-size: 2rem; line-height: 1.9rem; letter-spacing: 1px; } aside section#block-8 h3:after { border-bottom: 1px solid #fff; height: 10px; margin: auto; } aside section#block-8 p { position: relative; } aside section#block-8 span.big { font-family: var(--headings-font-bold); font-size: 2.2rem; line-height: 1.65em; } aside section#block-8 a { color: #fff; } aside section#block-8 .button { border: 0; background-color: rgba(201, 38, 45, 1); } aside section.widget-contact li:nth-child(1) { font-size: 1.4em; } aside section.widget-contact li:nth-child(2) { font-size: 1em; } .recent-posts article { display: block; margin-bottom: 2.2rem; border: 0; padding: 0; } .recent-posts article:hover figure { opacity: .9; } .recent-posts article:hover a { text-decoration: underline; } .recent-posts article figure { margin: 0 0 0 0; } .recent-posts article figure img { width: 100%; } .recent-posts article h4 { font-family: var(--headings-font-bold); font-size: 1.1rem; line-height: 1.3rem; font-weight: normal; margin: 0; padding: 0; } .recent-posts article .entry-content { display: none; } .recent-posts article .entry-title { padding: 5px 0; } .recent-posts article .entry-author { font-size: .9rem; font-style: italic; } /* Site footer */ .site-footer { background-color: #504645; color: #fff; background: url('../images/background-footer.jpg') no-repeat top right; background-size: cover;} /* Footer widgets */ .footer-widgets { border-bottom: 1px solid rgba(255, 255, 255, 0.1); margin: 0 auto; } /* .footer-widgets .wrapper { max-width: 500px; } */ .footer-widgets .hentry { display: inline-block; margin: 0 0 30px 0; } .footer-widgets .widget-title { font-family: var(--headings-font-bold); font-size: 1.6em; } .footer-widgets li a { text-decoration: none; color: #fff;} .footer-widgets .textwidget a:hover { text-decoration: underline; } .footer-widgets .hentry div:nth-child(2) h3 { display: none; } .footer-widgets figure:hover { opacity: .9; } /* Team profile images (full width widget that displays like a gallery but composed of with independent images with links) */ .hentry.footer-1 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 2%; margin: 0; padding: 20px 0; } .hentry.footer-1 div:first-child { grid-column: 1 / -1; } .hentry.footer-1 div:first-child a { font-family: var(--headings-font-bold); font-size: 1.5rem; line-height: 1.6rem; color: #fff; text-decoration: none; } .hentry.footer-1 div:first-child a:hover { text-decoration: none; } .hentry.footer-1 .widget_media_image { padding-bottom: 10px; } .hentry.footer-1 .widget_media_image figure { margin: 0; width: 100% !important; } .hentry.footer-1 .widget_media_image figure a { display: inline-block; } .hentry.footer-1 .widget_media_image figure img { border: 1px solid #aaa; margin-bottom: 5px; } .hentry.footer-1 .widget_media_image figure figcaption { text-align: center; font-size: 1rem; font-weight: bold; line-height: 1.1rem; background-color: var(--color-1-RED); color: #fff; padding: 3px 3px; clip-path: polygon(100% 0%, 100% 0%, 100% 85%, 50% 100%, 0% 85%, 0 0); -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 85%, 50% 100%, 0% 85%, 0 0); } /* .hentry.footer-1 .widget_media_image figure figcaption { background-color: #fff; color: var(--color-1-RED); } */ .hentry.footer-1 .widget_media_image figure figcaption { background-color: transparent; color: #fff; } .hentry.footer-1 .widget_media_image figure figcaption span { font-weight: normal; display: block; font-size: .8rem; } .hentry.footer-1 .widget_media_image figure figcaption { color: #fff; /* background-color: var(--color-1-RED); */ background-color: rgba(0,0,0,.5); /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpath fill='%23921c21' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23a01e24' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23ad2127' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23bb232a' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23c9262d' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%23d3282f' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23dc2a31' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23e62b34' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%23f02d36' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23fa2f38' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E"); */ /* background-size: cover; */ /* background-attachment: fixed; */ /* text-shadow: 0px 4px 4px rgba(0, 0, 0, .6); */ } /* Copyrights */ .footer-colophon { padding: 18px 0; background-color: #fff; color: var(--color-2-RED); } /* Back to top */ .backtotop { display: none; position: fixed; bottom: -100px; right: 0.8rem; width: 40px; height: 35px; background-color: var(--color-1-RED); border: 1px solid #fff; border-radius: 5px; z-index: 9; text-align: center; cursor: pointer; -webkit-transition: all .1s ease-in-out; transition: all .1s ease-in-out; } .backtotop .icon-caret-up { width: 100%; height: 100%; background-color: transparent; fill: #fff; padding: 0; } .backtotop:hover { background-color: var(--color-1-RED-alt); } /* Edit page in WordPress */ .edit-in-wp { display: none; } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 400px) { /* iPhone 4 landscape */ /* Page header image */ .site-background-image { padding: 20% 0; } } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 568px) { /* iPhone 5 landscape */ /* Site page */ /* Main content */ main { padding: 0 2em 2em 2rem; } /* Additional classes (that can be added to individual blocks throught the "Additional CSS class" field in Gutenberg "*/ /* Profile pictures */ .wp-block-image.profile-pic figure { width: auto; margin-left: 0rem; } /* Gutenberg native block: image */ .wp-block-image:not(.profile-pic) figure.alignright { float: right; margin-left: 1em; margin-top: .2em; margin-bottom: .2em; } .wp-block-image:not(.profile-pic) figure.alignleft { float: left; margin-right: 1rem; margin-top: .2em; margin-bottom: .2em; } /* Gutenberg native block: cover */ .wp-block-cover .wp-block-cover__inner-container h2 { font-size: 2.3rem; line-height: 2.3rem; } /* Services page */ ul.services li { flex: 0 0 auto; margin: 0 15px 15px 0; } /* Team page */ /* .wp-block-columns.crew-index .wp-block-column { padding-right: 20px; margin-left: 0; } */ .wp-block-columns.crew-index .wp-block-image figcaption { font-size: 1.1rem; padding-top: .5rem; } .wp-block-columns.crew-index .wp-block-image figcaption span { display: inline-block; } /* Contact page */ /* Customizing "Contact Form 7" plugin */ .wpcf7 { padding: 10px 20px 10px 20px !important; } /* Blog posts index (cards) */ .post-cards-wrapper { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 2%; } article.post-card { margin-top: 0; } /* Blog posts */ main .recent-posts { display: grid; grid-template-columns: 1fr 1fr ; grid-gap: 5%; margin-bottom: 30px; justify-items: center; } main .recent-posts article { margin: 20px 0 0 0; } main .recent-posts article h4 { font-size: 1.1rem; background-attachment: sc; } /* Sidebar */ aside section { padding: 30px 20px 20px 20px; } /* Site footer */ /* Team profile images */ .hentry.footer-1 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 1%; padding: 30px 0; } .hentry.footer-1 div:first-child { color: rgb(95, 90, 90); height: 100%; width: 100%; margin: 0; padding: 0.5rem; font-size: 1.2rem; line-height: 1.3em; /* background-color: var(--color-1-RED); */ background-color: rgba(0,0,0,.5); /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpath fill='%23921c21' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23a01e24' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23ad2127' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23bb232a' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23c9262d' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%23d3282f' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23dc2a31' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23e62b34' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%23f02d36' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23fa2f38' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E"); */ /* background-size: cover; */ text-shadow: 0px 4px 4px rgba(0, 0, 0, .6); } .hentry.footer-1 div:first-child:hover { background-position-x: -200px; } .hentry.footer-1 .widget_media_image { padding-bottom: 0; } /* Copyrights */ .footer-colophon { text-align: center; } } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 767px) { /* Site footer */ /* Team profile images */ .site-page .wp-block-columns.crew-index > .wp-block-column { flex-basis: calc((100% - 30px) / 4)!important; flex-grow: 0; margin: 0!important; } .hentry.footer-1 div:first-child a { font-size: 1.7rem; line-height: 2.3rem; } /* Contact page */ .contact-page .wp-block-column { flex-basis: calc(50% - 2rem); } .contact-page .contact-info-columns .wp-block-column:first-child { margin-right: 4rem; } .contact-page .contact-info-columns .wp-block-column:last-child { margin-top: 1em; } } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 961px) { /* Flexbox site layout */ /* body { display: flex; flex-direction: column; } */ .site-page { display: flex; flex: 1 0; } .site-page > main { /* flex: 1 1; */ padding-top: 10px; z-index: 1; width: 70%; } body.right-sidebar .site-page > main { padding-right: 30px; padding-left: 0; } body.left-sidebar .site-page > main { padding-left: 30px; padding-right: 0; order: 1; } body.no-sidebar .site-page > main { width: 100%; padding: 30px; } .site-page > aside { flex: none; width: 30%; } body.right-sidebar .site-page > aside { padding-right: 0; } body.left-sidebar .site-page > aside { padding-left: 0; } body.no-sidebar .site-page > aside { display: none;} .site-footer { margin-top: auto; flex: none; } /* Site page */ .site-page { margin-top: -60px; } .wrapper { width: 96%; } /* Main content */ .site-page > main { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } main h2[id*="service"] { margin-top: 0; padding-top: 90px; } /* Gutenberg native block: cover */ .wp-block-cover .wp-block-cover__inner-container { width: calc(100% - 400px); max-width: 1200px; } /* UAGB blocks */ /* .uagb-post-grid .uagb-post__items article { max-width: 450px !important; } */ /* Full width display */ body:not(.home) .alignfull { width: 100%; left: 0; } /* Blog posts index (cards) */ .post-cards-wrapper { grid-template-columns: 1fr 1fr 1fr; grid-gap: 2%; } /* Frontpage */ body.home .emphase { font-size: 1.3em; line-height: 1.3em; } body.home .emphase h3 { margin-bottom: 10px; line-height: 1.6em; } body.home .emphase p { margin-bottom: 60px; } body.home .custom-cover-block { margin-top: 100px; margin-bottom: 100px; } /* Sidebar */ .site-page > aside { margin-top: 30px; } aside section#block-8 span { line-height: 1em; } aside section#block-8 a { text-decoration: none; text-shadow: none; } /* Full width display */ aside .alignfull { max-width: 100%; left: 0; } /* Site footer */ /* Footer widgets */ .footer-widgets .wrapper { max-width: 1200px; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .footer-widgets.col-2 .wrapper .hentry { width: calc(100%/2 - 4%); } .footer-widgets.col-3 .wrapper .hentry { width: calc(100%/3 - 3%); } .footer-widgets.col-4 .wrapper .hentry { width: calc(100%/4 - 2%); } /* Team profile images */ .hentry.footer-1 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 2%;} .hentry.footer-1 div:first-child { grid-column: 1 / 1; } .hentry.footer-1 div:first-child a { font-size: 2rem; line-height: 2.3rem; } /* Edit page in WordPress link */ .logged-in .edit-in-wp { position: fixed; top: 30%; right: -10px; display: block; line-height: 0; background-color: #F0F0F0; border-radius: 30px; opacity: .8; z-index: 9999; transition: all 0.2s ease-in-out; } .logged-in .edit-in-wp:hover { right: 0; } .logged-in .edit-in-wp .icon-wordpress { width: 40px; height: 40px; fill: var(--color-2-RED); } } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 1024px) { /* Site footer */ /* Team profile images */ .hentry.footer-1 div:first-child a { font-size: 2.3rem; line-height: 2.5rem; } .hentry.footer-1 .widget_media_image figure figcaption { font-size: 1.3rem; line-height: 1.3rem; padding: 5px; } .hentry.footer-1 .widget_media_image figure figcaption span { font-size: 1rem; } } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 1201px) { body.right-sidebar .site-page > aside, body.left-sidebar .site-page > aside { width: 30%; } body.right-sidebar .site-page > main, body.left-sidebar .site-page > main { width: 70%; } /* Widgets area */ .widget-areas { display: flex; order: -1; padding: 10px; width: 100%; background-color: #504645; color: #fff; } /* Business info */ .business-info { order: -1; margin: auto 0; } .business-info ul { display: flex; justify-content: space-between; margin: 5px 0; } .business-info ul li { margin: 0 20px 0 0; } .business-info ul li a { color: #fff; } .business-info ul li i { padding-right: 5px; font-size: 1rem; } .business-info ul li:first-child { font-size: 1rem; font-family: var(--headings-font); } .business-info ul li:nth-child(2) { font-size: 1rem; font-family: var(--headings-font); } .business-info ul li:last-child { font-size: 1rem; margin-right: 0; } .business-info ul li span { display: inline; } .business-info .icon { width: 28px; margin-right: 2px; padding-bottom: 2px; } /* Social icons */ .social-icons { margin: 0 2% 0 auto; padding: 0; } .social-icons ul li:not(:last-child) { margin-right: 20px; } .social-icons ul li a { width: 1.2rem; height: 1.2rem; line-height: 1.2rem; border-radius: 0; background-color: transparent; } .social-icons ul li a:hover { color: var(--color-2-RED); } .social-icons svg { width: 1.7rem; height: 1.7rem; fill: #fff; } /* Site header */ .site-logo-wrapper { display: none; } /* Navigation menu */ .mobile-topbar .responsive-menu-button { display: none; } .responsive-menu-container { position: relative; overflow: initial; display: flex; flex-direction: column; align-items: center; flex-wrap: wrap; transform: none; bottom: auto; padding: 0; max-width: none; } .responsive-menu-container .branding { position: absolute; top: 50px; left: 0; display: flex; width: 100%; background-color: #fff; } .responsive-menu-container .branding.fixed { position: fixed; top: 0; left: 0; box-shadow: 0 4px 6px -6px #aaa; } .responsive-menu-container .branding .menu-logo a img { width: 230px; transition: all .3s ease-in-out; } .responsive-menu-container .branding.fixed .menu-logo a img { width: 170px; } .responsive-menu-container .branding .menu-description { display: none; } .responsive-menu-container nav { position: absolute; top: 25px; right: 0; max-width: 1200px; } .responsive-menu-container nav ul { margin: 0 1rem 0 0; padding: 0; } .responsive-menu-container nav ul li { display: inline-block; vertical-align: baseline; text-align: left; position: relative; padding: 8px 10px 5px 10px; margin-right: 10px; transition: all .3s ease-in-out; } .responsive-menu-container nav ul li.menu-item-has-children:after { position: relative; top: 5px; right: 0; width: auto; height: auto; padding: 0; font-size: 2.3rem; display: inline-block; } .responsive-menu-container nav ul li:hover::after { color: var(--color-1-RED); } .responsive-menu-container nav ul li.current-menu-parent:hover::after { color: #fff; } .responsive-menu-container nav > ul > li:last-child { display: inline-block; padding: 0; margin: 0; } .responsive-menu-container nav > ul > li:last-child a { background-color: var(--color-1-RED); font-family: var(--headings-font-bold); color: #fff; font-size: 1.2rem; padding: 15px 20px 15px 20px; } .responsive-menu-container nav > ul > li:hover:last-child a { background-color: var(--color-1-RED-alt); } .responsive-menu-container nav ul li a { display: inline-block; font-family: 'Optima Reg'; font-size: 1.6rem; border: none; padding: 0 0 0 0; color: #444; transition: all .3s ease-in-out; } .responsive-menu-container nav ul li:hover a { color: var(--color-1-RED); } .responsive-menu-container nav ul li a:after { content: ""; background: var(--color-1-RED); position: absolute; left: 50%; right: 50%; bottom: 0px; height: 2px; -moz-transition: all .3s; -o-transition: all .3s; -webkit-transition: all .3s; transition: all .3s; } .responsive-menu-container nav ul li a:hover:after { left: 0; right: 0;} .responsive-menu-container .fixed nav { top: 10px; } .responsive-menu-container .fixed nav ul li { transition: all .3s ease-in-out; } .responsive-menu-container .fixed nav > ul > li:last-child a { padding: 13px 17px 13px 17px; } .responsive-menu-container .fixed nav ul li a { font-size: 1.4rem; transition: all .3s ease-in-out; } .responsive-menu-container nav ul li.current-menu-parent > a { border: 0; } .responsive-menu-container nav ul > li.menu-item-has-children:after { content: ''; display: inline-block; width: 0; height: 0; top: 0; margin-left: 6px; vertical-align: middle; border-top: 6px solid; border-right: 6px solid transparent; border-left: 6px solid transparent; } .responsive-menu-container nav ul > li.menu-item-has-children a:after { display: none; } /* Sub menus */ .responsive-menu-container nav ul li ul.sub-menu { display: none; position: absolute; top: 40px; left: -20px; text-align: left; overflow: hidden; margin: 0 0 0 0; padding: 40px 0 0 0; } .responsive-menu-container .fixed nav ul li ul.sub-menu { box-shadow: 0 3px 12px rgba(0,0,0,0.16); background-color: #fff; } .responsive-menu-container nav ul li ul.sub-menu > li { width: 250px; list-style-type: none; padding: 10px; margin: 0; background-color: rgba(255,255,255,1); } .responsive-menu-container nav ul li ul.sub-menu > li:not(:last-child) { border-bottom: 1px solid #f1f1f1; } .responsive-menu-container nav ul li ul.sub-menu > li.current-menu-item { background-color: var(--color-1-RED); color: #fff; } .responsive-menu-container nav ul li ul.sub-menu > li.current-menu-item > a { background-color: var(--color-1-RED); color: #fff; } .responsive-menu-container nav ul li ul.sub-menu > li.current-menu-item > a[href]:hover { color: #fff; } .responsive-menu-container nav ul li ul.sub-menu > li > a { color: #000; font-size: 1.2rem; padding: 0; padding: 5px 10px; transition: none; } .responsive-menu-container nav ul li ul.sub-menu > li > a[href]:hover { color: var(--color-1-RED); } /* Current menu items */ .responsive-menu-container .current-menu-item, .responsive-menu-container .current_page_parent { position: relative; background-color: var(--color-1-RED); } .responsive-menu-container nav ul li.current-menu-parent ul.sub-menu { display: none; } .responsive-menu-container nav ul li.current-menu-parent { background-color: var(--color-1-RED); color: #fff; } .responsive-menu-container nav ul li.current-menu-parent a { color: #fff; } .responsive-menu-container .current-menu-item > a, .responsive-menu-container .current_page_parent > a { color: #fff; } .responsive-menu-container .current-menu-item:hover > a, .responsive-menu-container .current_page_parent:hover > a { color: #fff; } .responsive-menu-container .current-menu-item:after, .responsive-menu-container .current_page_parent:after { content: ''; position: absolute; top: 100%; left: 45%; width: 0; height: 0; border-top: solid 12px var(--color-1-RED); border-left: solid 3px transparent; border-right: solid 11px transparent; } /* Navigation menu */ .responsive-menu-container .branding .menu-logo a img { width: 260px; } /* Logo */ .responsive-menu-container .branding .menu-logo { margin-left: 1rem; } /* Page header image */ .site-background-image { padding: 12% 0 12% 0; margin-top: 70px; } h1.page-title { font-size: 2.8rem; line-height: 3.2rem; padding: .6rem 1rem 1rem 1rem; } /* .wave svg { fill: #F0F0F0; } */ } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 1280px) { /* Site header */ /* Logo */ .responsive-menu-container .branding .menu-logo { margin-left: 2rem; } /* Navigation menu */ .responsive-menu-container nav ul { margin-right: 2rem; } .responsive-menu-container nav ul li:last-child { margin-left: 1rem; } /* Site footer */ /* Team profile images */ .hentry.footer-1 div:first-child a { display: inline-block; padding: 1rem; } } /************************************************************ ##BREAKPOINT ******************************************************/ @media only screen and (min-width: 1400px) { /* Site header */ /* Logo */ .responsive-menu-container .branding .menu-logo { margin-left: 3rem; } /* Navigation menu */ .responsive-menu-container nav ul { margin-right: 3rem; } .responsive-menu-container nav ul li:last-child { margin-left: 3rem; } }