/* Theme Name: St. Francis Foundation Author: Nick Zwinggi Author URI: https://zwinggicreative.com Description: Theme built for St. Francis Foundation Version: 2024.1 */ @font-face { font-family: 'social round'; src: url('fonts/zc_social.eot'); src: url('fonts/zc_social.eot?#iefix') format('embedded-opentype'), url('fonts/zc_social.woff?v=4') format('woff'), url('fonts/zc_social.ttf?v=4') format('truetype'), url('fonts/zc_social.svg#zc_social') format('svg'); font-weight: normal; font-style: normal; } html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}body{line-height:1}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent} .sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important} /* ---------------- ---------------- */ /* -------- Global Elements -------- */ /* ---------------- ---------------- */ :root{ --wine: #8B686C; --wine32: rgba(139, 104, 108, .32); --teal: #607678; --gold: #C4BA84; --olive: #9C965F; --slate: #434549; --darkwine: #54393C; --verdi: #32494B; --cotton: #D9D6D3; --brown: #5B563B; --black: #020202; --rose: #C6B4B4; --aqua: #9DBEC1; --sand: #F4F1E9; --grey: #8A8D8F; --white: #FFFFFF; --sans: "filson-pro", sans-serif; --serif: "filson-pro", sans-serif; --title: "filson-pro", sans-serif; } html { overflow-x: hidden;} body * {font-family: var(--sans);} body { font-weight:400; font-family: var(--sans); font-size: 18px; background-color:var(--white); color:var(--wine); overflow-x: hidden;} body .hex {background-image:url("/wp-content/themes/st_francis/images/stucco.jpg"); background-repeat: repeat; background-size: 100% auto; background-position: center top; background-color:var(--white); z-index: -1;top:0; content: ''; position: fixed ;left: 0; width:100%; height: 100%; opacity: .8;} strong, b, strong a, b a { font-weight:700; } em, i, em a, i a { font-style:italic;} img.alignright { float:right; margin: 0 0 20px 20px; max-width: 50%;} img.alignleft { float:left; margin: 0 20px 20px; max-width: 50%;} @media (max-width:767px){ img.alignleft, img.alignright { float:none; margin: 0 0 20px; max-width: 100%; } } hr { height:1px; border:none; border-top:1px solid var(--wine); width:100%; background: none; margin: 30px 0; opacity: .5;} .divider-gold hr { border-top:1px solid var(--gold);} .divider-green hr { border-top:1px solid var(--olive);} article ul { list-style: disc; margin: 30px;} article ol { list-style: decimal; margin: 30px;} article ul li, article ol li { padding:5px 27px 5px 5px; text-align: left;} @media (max-width:990px){ article ul li, article ol li { padding:5px;} } article ol, article ul { margin:20px 40px; list-style-position: outside;} article ol ol, article ul ul { margin:8px 40px; } article li { color: var(--wine); margin-bottom: 8px;} article ul:first-child { margin-top: 0px;} article ol:first-child { margin-top: 0px;} article p:first-child { margin-top: 0px;} .midnight { color:var(--verdi);} .navy { color:var(--verdi);} .green { color:var(--teal);} .green { color:var(--olive);} .teal { color:var(--olive);} .brown { color:var(--wine);} .black { color:var(--black);} .white { color:var(--white);} .grey { color:var(--grey);} .gold { color:var(--gold);} .bg-midnight { background-color:var(--verdi) !important;} .bg-navy { background-color:var(--verdi) !important;} .bg-green { background-color:var(--olive) !important;} .bg-purple { background-color:var(--wine)!important;} .bg-teal { background-color:var(--olive)!important;} .bg-brown { background-color:var(--wine)!important;} .bg-black { background-olor:var(--black)!important;} .bg-white { background-color:var(--white)!important;} .bg-grey { background-color:var(--grey)!important;} .bg-gold { background-color:var(--gold)!important;} .panel-bg-green { background-color:var(--teal);} .panel-bg-purple { background-color:var(--wine);} .panel-bg-teal { background-color:var(--wine);} .panel-bg-midnight { background-color:var(--verdi);} .panel-bg-navy { background-color:var(--verdi);} .panel-bg-brown { background-color:var(--wine);} .panel-bg-black { background-color:var(--black);} .panel-bg-white { background-color:var(--white);} .panel-bg-grey { background-color:var(--grey);} .panel-bg-gold { background-color:var(--gold);} .panel-bg-green *, .panel-bg-midnight *, .panel-bg-brown *, .panel-bg-grey *, .panel-bg-purple *, .panel-bg-navy * { color:var(--white);} .panel-bg-gold p { color:var(--black);} img { max-width:100%; height: auto;} .pane { border-radius:0; position: relative; overflow: hidden; } .pane img { object-fit: cover; position: absolute; width: 100%; height: 100%; border: 10px solid #FFFFFF; box-shadow: 1px 3px 8px 0 rgba(0,0,0,0.07); border-radius: 0; } .relative { position:relative;} .static { position:static;} .fixed { position:fixed;} .absolute { position:absolute;} a { transition: .25s all ease-in-out; color:var(--teal); text-decoration: none;} a:hover { transition: .25s all ease-in-out; color:var(--gold); text-decoration: none;} a.button, .button-link a, a.button-link, .search-submit, button.forminator-button-submit, .button a, div.button{ line-height: 1.35em; color: var(--white) !important; text-transform: uppercase; transform: scale(100%) !important; display: inline-block !important; border: none !important; transition: .25s all ease-in-out !important; cursor: pointer; position: relative; background-color:var(--teal); font-size: 18px !important; letter-spacing: 4.27px; border-radius:5px; width:auto; padding:15px 60px 14px 30px !important; font-weight: 800; margin-top:10px;} @media (max-width:1200px){ a.button, .button-link a, a.button-link, .search-submit, button.forminator-button-submit, .button a, div.button { font-size: 16px !important; padding-top:10px !important; padding-bottom:9px !important; letter-spacing: 3.5px; } } a.button:hover, .button-link a:hover, a.button-link:hover, .search-submit:hover, button.forminator-button-submit:hover, .button a:hover, div.button:hover { background-color: var(--wine);} a.button::after, div.button::after, .search-submit::after { position:absolute; right:20px; width:20px; content:''; top:10%; background:url("/wp-content/themes/st_francis/images/arrow_white.svg") no-repeat; background-size: contain; background-position:center; transition:.25s all ease-in-out; height: 80%;} @media (max-width:1200px){ a.button::after, div.button::after, .search-submit::after { top: 26%; height: 40%;} } .search-submit::after { background-image:url("/wp-content/themes/st_francis/images/spyglass-white.svg");} a.button.icon-button::after { z-index:5;} button.forminator-button-submit::after, .button a::after, div.button::after { position:absolute; right:20px; width:20px; content:''; top:10%; background:url("/wp-content/themes/st_francis/images/icon-checkmark.svg") no-repeat; background-size: contain; background-position:center; transition:.25s all ease-in-out; height: 80%;} a.button.light, div.button.light { color:var(--darkwine) !important; } a.button.light:hover, div.button.light:hover { color:var(--white) !important; } a.button.light::after, div.button.light::after { filter: brightness(.25) saturate(6) sepia(1) hue-rotate(-62deg); transition: .25s all ease-in-out; } a.button.light:hover::after, div.button.light:hover::after { filter: none; transition: .25s all ease-in-out; } a.button:hover::after, .insights .cell:hover div.button::after { right:15px; transition:.25s all ease-in-out;} a.button.icon-button:hover::after, .insights .cell:hover div.button.icon-button::after { right:20px; margin-top:-3px; transition:.25s all ease-in-out;} .panel-bg-green a.button, .panel-bg-purple a.button, a.button.gold { background-image:url("/wp-content/themes/st_francis/images/gold-smudge-4.png");} .panel-bg-purple a.button::before, a.button.gold::before { background-image:url("/wp-content/themes/st_francis/images/green-smudge-4.png");} @media (max-width:640px){ .search-submit, button.forminator-button-submit { max-width:100%;} } .link_shelf { display:flex; justify-content: center; flex-wrap: wrap; gap:24px;} .forminator-ui.forminator-custom-form[data-design="default"] .forminator-button:active, .forminator-ui.forminator-custom-form[data-design="default"] .forminator-button:focus, .forminator-ui.forminator-custom-form[data-design="default"] .forminator-button:hover { -webkit-box-shadow: none !important; box-shadow: none !important; } .forminator-field-checkbox.one-hundred .forminator-field label { width: 100% !important; } .funk .masthead-text a { color:var(--white);} .funk .masthead-text a:hover { color:var(--gold) !important;} a.download-link { padding-right: 42px !important; } a.download-link::after { content:''; position: absolute; top:50%; transform: translateY(-50%); right:8px; height:20px; width:25px; background: url("/wp-content/themes/st_francis/images/downloadable.svg") no-repeat; background-size: contain;} button#searchsubmit { margin-top:30px;} .read-more.button { width: auto !important;} .read-more.button:hover { width: auto !important;} .link-content { display: flex; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center; gap:40px; } .page-panel .link-content { justify-content: flex-start; align-content: flex-start; } .link-content a { margin:unset !important;} @media (max-width:640px){ .link-content { gap:24px;} } p, ul, li, ol, .p { line-height: 1.6em;} p, .p { margin-bottom: 19px; line-height: 2em; font-weight: 400;} @media (max-width:640px){ p, .p, ul, li, ol { font-size: 16px; } } #memberships, #memberships p { display:flex; align-items: center; justify-content: center;} #memberships img { margin:0 20px;} @media (max-width:990px){ #memberships p { flex-wrap: wrap;} #memberships img { margin: 10px 0; display: block; max-width: 100%;} } .flex-wrap {flex-wrap: wrap;} .pageinner { max-width:1280px; width:90%; margin:0 auto; padding: 0; position: relative;} @media (max-width:990px) { .pageinner { width:calc(100% - 50px); margin:0 25px;} } .extra-wide .pageinner { max-width: 1520px;} .extra-wide .pageinner .flexPanel { max-width: 1520px;} .pageinnerslim { max-width:840px;} .pageinnerslim img, .wp-caption { max-width:100%;} .wp-caption-text { font-style:italic; padding:20px 0; margin-bottom:30px; border-bottom:1px solid #d7d7d7; line-height: 1.5em;} header .pageinner { max-width:1280px; width:calc(90% - 50px);align-items: center;} @media (max-width:990px) { header .pageinner {width: calc(100% - 50px);text-align: center;justify-content: center;} } .attachment-post-thumbnail, .page-panel img { border-radius:0px; margin-bottom: 30px;} @media (max-width:767px) { .attachment-post-thumbnail, .page-panel img { display:block;} } .flex { display:flex;} @media (max-width:990px) { .mobile-reverse .flexPanel { flex-direction: row-reverse;} } @media (max-width:640px) { .mobile-reverse .flexPanel { flex-direction: column-reverse;} } @media (min-width:991px) { .desktop-reverse .flexPanel { flex-direction: row-reverse;} .flexPanel.desktop-reverse { flex-direction: row-reverse;} } .side-by-side ul {display: flex;flex-wrap: wrap;} .side-by-side ul li { width:50%;} @media (max-width:990px) { .desktop-only { display:none !important;} } @media (min-width:991px) { .mobile-only { display:none !important;} } .no-margin { margin:0 !important;} .no-padding { padding:0 !important;} .no-bottom { padding-bottom:0 !important;} .no-top { padding-top:0 !important;} .page-panel.no-top { padding-top:0 !important;} .page-panel.no-bottom { padding-bottom:0 !important;} .page-panel.extra-top { padding-top:200px !important;} .page-panel.extra-bottom { padding-bottom:200px !important;} .page-panel.squat-top, .page-panel.squattop { padding-top:50px !important;} .page-panel.squat-bottom, .page-panel.squatbottom { padding-bottom:50px !important;} .page-panel.negative-top { margin-top:-33vh !important;} .page-panel.negative-bottom { margin-bottom:-33vh !important;} @media(max-width:990px){ .page-panel.extra-top { padding-top:100px !important;} .page-panel.extra-bottom { padding-bottom:100px !important;} .page-panel.squat-top, .page-panel.squattop { padding-top:32px !important;} .page-panel.squat-bottom, .page-panel.squatbottom { padding-bottom:32px !important;} } #header { position: relative; width:100%; top:0; left: 0;z-index: 99999; height: calc(100vh - 105px); background: rgb(104,87,62); background: -moz-radial-gradient(circle, rgba(104,87,62,1) 0%, rgba(68,60,48,1) 100%); background: -webkit-radial-gradient(circle, rgba(104,87,62,1) 0%, rgba(68,60,48,1) 100%); background: radial-gradient(circle, rgba(104,87,62,1) 0%, rgba(68,60,48,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#68573e",endColorstr="#443c30",GradientType=1); } .scroll-up #header, .scroll-down #header { } #site-title { background:url("/wp-content/themes/st_francis/images/logo.svg") no-repeat; background-size:contain; width:250px; height:80px; background-position: left center; text-indent: -9999px; overflow: hidden; margin:24px 0; transition:.25s all ease-in-out;} .scroll-up #site-title, .scroll-down #site-title {height: 50px;margin: 12px 0; transition:.25s all ease-in-out;} @media (max-width:990px) { #site-title { width: 100%;height: 47px; background-position: center center;} .scroll-up #site-title, .scroll-down #site-title {height: 40px;margin: 12px 0; transition:.25s all ease-in-out;} } #site-title a { display: block; height: 100%; cursor: pointer; } .fader { opacity:0; transition: .375s all ease-in-out; position: relative;} .fader.opaque { opacity:1; transition: .375s all ease-in-out;} @media (min-width:991px) { .fader { margin-top:50px !important; margin-bottom:-50px !important;} .fader.opaque { margin-top:0 !important; margin-bottom:0 !important;} .cell_12.fader, .card.fader { margin-top:70px !important; margin-bottom:-30px !important; } .cell_12.fader.opaque, .card.fader.opaque { margin-top:20px !important; margin-bottom:20px !important; } } .flex-panel-outer > .pageinner { z-index:1;} #desktop-menu { width: calc(100% - 250px); display: flex; flex-wrap: wrap; align-content: flex-end;} #menu-main-menu { width: calc(100%); display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-between;} .menu-main-menu-container { width: calc(100% - 46px); margin: auto; } #menu-main-menu li a { text-transform: uppercase; color: var(--wine); font-family: var(--sans); font-size: 18px; font-style: italic; letter-spacing: 3px; } #menu-main-menu li:not(.button) a:hover { color:var(--white); } #menu-main-menu li:not(.button) a::before { content: ''; position: absolute; top: 0; width: 100%; height: 100%; background: var(--teal); opacity: 0; transition: .25s all ease-in-out; background-size: 100% 100%; z-index: -1; border-radius: 5px; left: -1px; } #menu-main-menu li:not(.button) a:hover::before { opacity:1; transition: .25s all ease-in-out;} #menu-main-menu li.current_page_item:not(.button) > a { color:var(--white);} #menu-main-menu li.current_page_item:not(.button) > a::before { opacity:1; transition: .25s all ease-in-out; background:var(--olive);} #menu-main-menu li.current_page_item:not(.button) > a:hover::before { background:var(--teal);} #menu-main-menu li li .sub-menu { position: relative; top: unset !important; margin: 6px 13px 13px; width: calc(100% - 26px); padding: 8px; background: var(--sand); border: none; bottom: unset !important; } .menu-nav-shelf-container { width:100%;} .menu-nav-shelf-container ul { display:flex; justify-content: flex-end;} .menu-nav-shelf-container ul li { position: relative; transition: .25s all ease-in-out; line-height: 1.5;} .menu-nav-shelf-container ul li a { padding:12px 14px 10px; display: block; font-family: var(--sans); font-weight:500; position: relative; font-size: 15px; color: var(--white); letter-spacing: 1.81px;text-transform: uppercase; } .menu-nav-shelf-container ul li.button a { padding-right:0; padding-left:0; margin-top: 8px; padding-top: 8px !important; padding-bottom: 6px !important; margin-left:0px;} .menu-nav-shelf-container ul li.button a:hover { margin-left:-15px;} .menu-nav-shelf-container ul li:not(.button) a { position:relative; display: inline-block;padding-left:0px;padding-right:45px;} .menu-nav-shelf-container ul li:not(.button) a:hover { padding-left:15px;padding-right:30px;} .menu-nav-shelf-container ul li:not(.button) a::before { transition: .25s all ease-in-out; content: '';background: url("/wp-content/themes/st_francis/images/chevron-right-dark.svg") no-repeat;width: 0;height: 14px; position: absolute; background-size: 6px 12px; left: 0;background-position: right; top: 15px;} .menu-nav-shelf-container ul li:not(.button) a:hover::before { width: 6px; transition: .25s all .125s ease-in-out; } .menu-nav-shelf-container ul li.button a { font-size:14px !important; padding-left:14px !important; padding-right: 45px !important;} .menu-nav-shelf-container ul li.button a:hover { padding-right:60px !important;} #menu-main-menu li.search-nav a, a.search-button { margin-top: 0; width: 15px; height: 15px; background-position: center center; text-indent: -9999px; overflow: hidden; display: block; padding-right: 0; padding-left: 0; background-color: transparent !important; border: none !important; transition: .25s all ease-in-out; padding: 0 !important; margin: 9px 23px 0 23px; position: relative; } #menu-main-menu li.search-nav a::before, a.search-button::before { position:absolute; content:''; background-image: url("/wp-content/themes/st_francis/images/spyglass_dark.svg") !important; background-repeat: no-repeat !important; background-size: contain; background-position: center center; width: 100%; height: 100%; top: 0; left:0; opacity: 1; transition:.25s all ease-in-out;} #menu-main-menu li.search-nav a:hover::before, a.search-button:hover::before { opacity:0; transition:.25s all ease-in-out;} #menu-main-menu li.search-nav a::after, a.search-button::after { position:absolute; content:''; background-image: url("/wp-content/themes/st_francis/images/spyglass.svg") !important; background-repeat: no-repeat !important; background-size: contain; background-position: center center; width: 100%; height: 100%; top: 0; left:0; opacity: 0; transition:.25s all ease-in-out;} #menu-main-menu li.search-nav a:hover::after, a.search-button:hover::after { opacity:1; transition:.25s all ease-in-out;} #menu-main-menu li.search-nav a:hover, a.search-button:hover { transform:scale(119%); transition:.25s all ease-in-out;} .menu-nav-shelf-container ul > li:hover a { color:var(--wine); transition: .25s all ease-in-out; position: relative; z-index: 3;} .menu-nav-shelf-container ul .sub-menu { padding:14px; position: absolute; left:0px; min-width: 250px; background:#f8f8f8; border:1px solid #DEDEDE; z-index: 2; margin-top:0px; height:auto; overflow: hidden;transition:.25s all ease-in-out; max-height:0px; opacity: 0; flex-wrap: wrap;} .menu-nav-shelf-container ul > li.menu-item-has-children:hover .sub-menu { max-height: 1000px; transition:.25s all ease-in-out; opacity: 1;} @media(max-width:990px){ .menu-nav-shelf-container ul .sub-menu { padding: 0; position: relative; left: 0%; width:100%; height:auto; max-height:0px; overflow: hidden; bottom: unset; top:unset; background:#d0d0d0;transition: .25s all ease-in-out;} .menu-nav-shelf-container ul > li.menu-item-has-children:hover .sub-menu { position: relative; left: 0%; max-height: 1000px;transition: .25s all ease-in-out;opacity: 1;padding-left: 41px;bottom: 0px;z-index: 999;} .menu-nav-shelf-container ul li { position: static;} .menu-nav-shelf-container ul li a { position: static;} .menu-nav-shelf-container ul li.search-nav { display: none;} a.search-button { top: 37px; left: 25px; position: absolute; transform: scale(134%);} } .menu-nav-shelf-container ul .sub-menu li { margin:0; background:#f8f8f8; border:none; width:100%;} .menu-nav-shelf-container ul .sub-menu li a { padding:9px 0; margin: 0; background:#f8f8f8 !important; border:none !important; line-height: 1;} .menu-nav-shelf-container ul .sub-menu li a { position:relative; display: inline-block;padding-right:15px;} .menu-nav-shelf-container ul .sub-menu li a:hover { padding-left:15px;padding-right:0;} .menu-nav-shelf-container ul .sub-menu li a::before { transition: .25s all ease-in-out; content: '';background: url("/wp-content/themes/st_francis/images/chevron-right.svg") no-repeat;width: 0;height: 14px; position: absolute; background-size: 6px 12px; left: 0;background-position: right; top: 9px;} .menu-nav-shelf-container ul .sub-menu li a:hover::before { width: 6px; transition: .25s all .125s ease-in-out; } @media(max-width:990px){ .menu-nav-shelf-container ul .sub-menu li a { padding:10px; margin: 0; background:#d0d0d0 !important; border:1px solid #dedede !important; border-left: none !important; border-right: none !important;} .menu-nav-shelf-container ul .sub-menu li a::before, .menu-nav-shelf-container ul .sub-menu li a::after { display:none !important;} } #menu-main-menu li { position:relative; display: block;} #menu-main-menu > li { padding: 23px 0;} #menu-main-menu > li li { padding: 0;} #menu-main-menu li > a { position: relative; padding-left: 23px; padding-right: 23px; display: block; line-height: 34px; color: var(--wine); font-weight: 900; font-style: normal; font-size: 14px; letter-spacing: 2px; padding: 3px 20px; } #menu-main-menu li li > a { position:relative; padding-left:12px; padding-right:12px; display:block; text-align: left; line-height: 1.5; padding: 14px;} #menu-main-menu li .sub-menu { position:absolute; left:0; bottom:73px; opacity: 0; max-height: 0px; height:auto; overflow: hidden; transition:.25s all ease-in-out; min-width: 300px; width: auto; margin-left: 0; border: #d8d8d8 1px solid; background: var(--white); padding: 11px; z-index: 4;} #menu-main-menu li:hover .sub-menu { max-height: 1000px; transition:.25s all ease-in-out; opacity: 1;} .fixed #menu-main-menu li .sub-menu { bottom: unset; top: 73px;} #menu-main-menu > li:last-child { margin-right: 23px;} @media(max-width:1400px){ #menu-main-menu li > a { letter-spacing: 2px;} } @media(max-width:1250px){ #menu-main-menu li > a { padding-left:10px; padding-right:10px;} #menu-main-menu li .sub-menu { padding:11px 5px; min-width: 275px;} } @media(max-width:1023px){ #menu-main-menu li > a { letter-spacing: 1px;} } #searchoverlay { position:fixed; top:0; left:0; width:100%; height: 100%; background:rgba(45,69,83,.9); z-index: 999999999999999999; visibility: hidden; opacity: 0; transition:.25s all ease-in-out;} #searchoverlay.active { visibility: visible; opacity: 1; transition:.25s all ease-in-out;} #searchoverlay #search {margin:0vh auto 0; max-width: 534px; background: var(--white); padding:25px; border-radius:3px; width: calc(100% - 50px); transition:.25s all ease-in-out;} #searchoverlay.active #search {margin:20vh auto 0; transition:.25s all ease-in-out;} form.search-form {display: flex; justify-content: space-between; flex-wrap: wrap;} textarea, input[type="text"],input[type="email"], input[type="button"], input[type="reset"], input[type="search"], input[type="password"] { -webkit-appearance: none; appearance: none; border-radius: 0; border: 1px solid #ccc; font-size: 16px; padding: 12px 22px 10px; width:100%;} form.search-form label { width:100%; margin-bottom: 30px;} .closeX { position:absolute; right:50px; top:50px; width:34px; height:34px;} @media(max-width:990px){ .closeX { right: 25px; top: 30px;} } .closeX::before { transition:.25s all ease-in-out; content: ''; height:2px; width:35px; top:16px; left:0; transform: rotate(-45deg); background:var(--white); position: absolute;} .closeX::after { transition:.25s all ease-in-out; content: ''; height:2px; width:35px; top:16px; left:0; transform: rotate(45deg); background: var(--white); position: absolute;} .closeX:hover::before, .closeX:hover::after { transition: .25s all ease-in-out; transform:rotate(0deg)} .default-header, .text-header { padding:4px 0 0;} @media(max-width:990px){ .default-header, .text-header {padding: 4px 25px 30px;} } .resource_search .custom-form { display:flex;} .resource_search .custom-form button { margin-top:0 !important; } .project-overlay { display:flex; padding:30px;} .project-overlay a { text-transform: uppercase; margin-right: 30px; letter-spacing: 1px;} .project-overlay a:hover { color:var(--wine);} @media(max-width:990px){ .project-overlay a { text-transform: uppercase; margin-right: 30px; width: 100%; display: block; padding: 5px 0;} .resource_search { width: 100%; margin: 10px 0 0;} } /* ---------------- ---------------- */ /* -------- Mega Menu -------- */ /* ---------------- ---------------- */ .mega-menu{ display: flex; justify-content: flex-end; width: 100%; padding-left: 40px;} @media (max-width:990px){ .mega-menu {flex-wrap: wrap;padding-left: 25px;} .mega-menu > .menu {flex-wrap: wrap; justify-content:left;} } .mega-menu .menu { display:flex; justify-content: flex-end;align-items: end; margin-bottom: -1px;} .mega-menu .menu li.has-mega-menu > a { padding:20px 20px 38px; display: block; background:var(--white); border:1px solid var(--white); transition: .25s all ease-in-out; border-bottom:1px solid #DEDEDE;} @media(max-width:1250px){ .mega-menu .menu li.has-mega-menu > a { padding:15px 15px 28px; width: 180px; } } @media(max-width:990px){ .mega-menu .menu li.has-mega-menu { width: 100%; } .mega-menu .menu li.button-link { width: auto; position: absolute; top: 32px; left: 50%; transform: translateX(-50%);margin: 0 !important;} .mega-menu .menu li.has-mega-menu > a { padding:6px 15px 15px; width: 100%; } } .mega-menu .menu li.has-mega-menu:hover > a { color:var(--teal); background:#f8f8f8; border:1px solid #DEDEDE; border-bottom:1px solid #f8f8f8; transition: .25s all ease-in-out; } li.has-mega-menu > a::before { content:'for'; font-family:'DS Italic';text-transform: lowercase; color:var(--wine); display:block; letter-spacing: 2px; font-size: 13px; padding:0; margin-bottom: 0px;} li.has-mega-menu > a::after { content: ''; background: url("/wp-content/themes/st_francis/images/chevron.svg") no-repeat; width: 25px; height: 16px; background-position: right 7px; background-size: 15px; display: inline-block;} @media (max-width:990px){ li.has-mega-menu > a::after {content: '';background: url("/wp-content/themes/st_francis/images/chevron.svg") no-repeat;width: 16px;height: 10px;background-position: left bottom;background-size: contain;display: inline-block; transform: rotate(-90deg);} } .mega-menu .menu > li.button-link { margin:0 0 37px 20px;} .mega { display:block; position: absolute; left:0; background: #f8f8f8; padding:0; height: auto; overflow: hidden; max-height:0px;transition: .75s max-height 0s ease-in-out, 0s opacity .75s; opacity: 0; z-index: 2;} .has-mega-menu:hover .mega { max-height: 70vh; transition: .75s max-height ease-in-out; opacity:1; z-index: 3;} .mega-title { font-family:'DS Italic';text-transform: lowercase; color:var(--wine); display:block; letter-spacing: 2px; font-size: 13px; padding:0 0 15px; margin-bottom: 25px; border-bottom:1px solid #dedede; } .mega-flex { padding:40px 45px;border:1px solid #dedede; border-top:none;} .mega-flex .mega-inner { width:18%; margin-right:0; } .mega-flex .mega-inner.widget_media_image { width:calc(50% - 45px); margin-right:45px; } .mega-menu .menu .widget_nav_menu:last-child { width:32%; } .mega-menu .menu .widget_nav_menu .menu { flex-wrap:wrap; justify-content: flex-start; align-items: flex-start; } .mega-menu .menu .widget_nav_menu .menu li { width:100%; padding-bottom: 25px; } .mega-menu .menu .widget_nav_menu .menu li a { position:relative; display: inline-block;} .mega-menu .menu .widget_nav_menu .menu li a:hover { padding-left:15px;} .mega-menu .menu .widget_nav_menu .menu li a::before { transition: .25s all ease-in-out; content: '';background: url("/wp-content/themes/st_francis/images/chevron-right.svg") no-repeat;width: 0;height: 14px; position: absolute; background-size: 6px 12px; left: 0;background-position: right; top: 4px;} .mega-menu .menu .widget_nav_menu .menu li a:hover::before { width: 6px; transition: .25s all .125s ease-in-out; } #mobile-menu.navmenu { display:none;} #contact-nav-list { position:fixed; width:100%; height:100%; top:0; z-index: 888; background: #055170; text-align: left; left:110%; transition:.5s left ease-in-out; padding: 24px 24px 0;} #contact-nav-list.active { left:0%; transition:.5s left ease-in-out;} #contact-nav-list iframe { border: 0; width: 100%; height: 60vh;} #contact-nav-list .textwidget { margin: 3vh 5%;} #contact-nav-list .textwidget a.button{ width:100%;} #contact-nav-list .forminator-description { font-size:11px; color:var(--white); font-style:italic; margin:5px 0 0 0; opacity: .7;} #mobile-nav-list { position:fixed; width:100%; height:100%; top:0; z-index: 888; background: var(--wine); text-align: left; left:110%; transition:.5s left ease-in-out;} #mobile-nav-list.active { left:0%; transition:.5s left ease-in-out;} #mobile-nav-list ul { text-align:left; position: absolute; bottom:100px; left: 7%;} #mobile-nav-list ul li { position: relative;} #mobile-nav-list ul li ul { position: relative; top: 0; } #mobile-nav-list ul a { text-align:#ffffff;} #mobile-nav-list > div > ul > li > a { font-family: var(--sans); font-weight: 700; position: relative; padding-right: 60px; font-size: 24px; color: #ffffff; letter-spacing: 4px; text-transform: uppercase; font-style: normal; margin: 10px 0 10px; display: inline-block; } #mobile-nav-list > div > ul > li ul { margin-bottom: 10px;} #mobile-nav-list > div > ul > li ul li { margin-top: 10px;} #mobile-nav-list > div > ul > li ul li:first-child { margin-top:0;} #mobile-nav-list > div > ul > li ul a {font-family: var(--sans);font-weight: 500;position: relative;padding-left:20px;font-size: 16px;color: #ffffff;letter-spacing: 2px;text-transform: uppercase;margin: 0;display: inline-block;} #mobile-nav-list > div > ul > li ul a::before { transition: .25s all ease-in-out; content: '';background: url("/wp-content/themes/st_francis/images/chevron-right-white.svg") no-repeat;width: 6px;height: 14px; position: absolute; display:inline-block; left: 0;background-position: right; top:6px;} .mobilemenu { display: none;} @media (max-width:990px){ .mobilemenu { display: flex; position:fixed; width:100%; height: 71px; bottom: 0; left:0; background: #fff; /*border-top: 1px solid #ffffff; */z-index: 999;padding-left: 0;} .mobilenav-item {width: 25%;height: 71px;display: flex;flex-wrap: wrap;align-items: center;padding-bottom: 12px;position: relative;transition: .5s background ease-in-out;padding-top: 12px;} .mobilenav-item.active { background: var(--wine); transition:.5s background ease-in-out;} .mobilenav-item.active img { filter:brightness(1000%); transition:.5s background ease-in-out;} .mobilenav-item.active::after { opacity:0; transition:.5s opacity ease-in-out;} .mobilenav-item.activecontact::after { opacity:0; transition:.5s opacity ease-in-out;} /*.mobilenav-item:last-child { width:24%}*/ .mobilenav-item:last-child::after { display:none;} .mobilenav-item img { text-align: center; margin: 0 auto; max-height: 24px;} .mobilenav-item .img { text-align: center; margin: 0 auto; max-height: 28px;height: 28px;width: 100%;position: relative;} .mobilenav-item .img img { opacity:0; position: absolute; top:0; left:50%; transform:translateX(-50%); width: auto; height: auto; max-height: 28px; transition:.25s all ease-in-out;} .mobilenav-item .img img.img-on { opacity:0; transition:.25s all ease-in-out;} .mobilenav-item.active .img img.img-on { opacity:1; transition:.25s all ease-in-out;} .mobilenav-item .img img.img-off { opacity:1; transition:.25s all ease-in-out;} .mobilenav-item.active .img img.img-off { opacity:0; transition:.25s all ease-in-out;} .mobilenav-item span { text-align: center; margin:0 auto; display: block; text-transform: uppercase; font-family: var(--sans); letter-spacing: 1px; width:100%;font-weight: 900;font-size: 11px; line-height: 10px; color:var(--wine); transition: .5s all ease-in-out;} .mobilenav-item.active span { color:#ffffff;} .mobilenav-item:hover { transition: .5s all ease-in-out;} .stackNav { position:relative; display: block; height:19px; width:28px; z-index: 99; margin: 0 auto;} .stackNav * { transition:.25s all ease-in-out; background-color: var(--wine);} .stackNav .one { height:2px; width:25px; top:0; left:1px; position: absolute; } .stackNav .two { height:2px; width:25px; top:6px; left:1px; position: absolute; opacity: 1;} .stackNav .three { height:2px; width:18px; top:12px; left:1px; position: absolute; } .mobilenav-item.active .stackNav * { background-color: #ffffff;} .mobilenav-item.active .stackNav .one { transform:rotate(45deg); top:6px;} .mobilenav-item.active .stackNav .two { transform:rotate(-45deg); top:6px;} .mobilenav-item.active .stackNav .three { transform:rotate(-45deg); top:6px; opacity: 0; transition:.25s all ease-in-out, .125s opacity .125s ease-in-out;} .mobilenav-item.stackNav-item img{max-height: 20px;} #mobile-nav-list ul.sub-menu li ul.sub-menu { margin-top: 10px;} } @media (max-width:350px){ .mobilenav-item img { max-height: 20px;} } /* ---------------- ---------------- */ /* -------- Headings -------- */ /* ---------------- ---------------- */ h1 {font-family: var(--sans); font-weight: 300; text-align: center;position: relative; font-size: 61px;color: var(--white);letter-spacing: 9.33px;line-height: 1.17em;} @media (max-width:1200px){ h1 {font-size: 44px; letter-spacing: 6.72px;padding-left: 0;} } @media (max-width:990px){ h1 {font-size: 30px; letter-spacing: 4.59px;padding-left: 0;} } h1 span { display:block; margin: 0; line:1; font-size: 24px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase;} .entry-title { margin-bottom:40px;} h1 em { white-space: nowrap; display: inline-block; position: relative; z-index: 1; font-style: normal;} h1 em::after { position:absolute; bottom: -10px; background:url("/wp-content/themes/st_francis/images/gold-smudge-1.png") no-repeat; background-size: 100% 100%; left:-3px; width:calc(100% + 12px); height:27px; z-index: -1; content: ''; } h2 em { white-space: nowrap; display: inline-block; position: relative; z-index: 1; font-style: normal;} h2 em::after { position:absolute; bottom: -7px; background:url("/wp-content/themes/st_francis/images/gold-smudge-1.png") no-repeat; background-size: 100% 100%; left:-3px; width:calc(100% + 12px); height:15px; z-index: -1; content: ''; } h2 em:nth-child(3n-1)::after { background-image:url("/wp-content/themes/st_francis/images/gold-smudge-2.png"); } h2 em:nth-child(3n)::after { background-image:url("/wp-content/themes/st_francis/images/gold-smudge-3.png"); } .panel-bg-purple h2 em::after { background-image:url("/wp-content/themes/st_francis/images/green-smudge-1.png");} .panel-bg-purple h2 em:nth-child(3n-1)::after { background-image:url("/wp-content/themes/st_francis/images/green-smudge-2.png"); } .panel-bg-purple h2 em:nth-child(3n)::after { background-image:url("/wp-content/themes/st_francis/images/green-smudge-3.png"); } .panel-bg-gold h2 { color:var(--black);} .panel-bg-gold h2 em::after { background-image:url("/wp-content/themes/st_francis/images/purple-smudge-2.png");} .panel-bg-gold h2 em:nth-child(3n-1)::after { background-image:url("/wp-content/themes/st_francis/images/purple-smudge-3.png"); } .panel-bg-gold h2 em:nth-child(3n)::after { background-image:url("/wp-content/themes/st_francis/images/purple-smudge-1.png"); } .masthead-content h1 { text-align: center; position: relative; z-index: 1;} @media (max-width:767px){ .masthead-content h1 { padding-right: 0px; padding: 0 20px;} } #searchoverlay #search h2 { margin-bottom:30px;} h2 { font-weight: 500; font-size: 36px;color: var(--wine);letter-spacing: 0;line-height: 49px; margin-bottom: 22px; position: relative; padding-top: 75px;} @media (max-width:990px){ h2 { font-size: 28px;line-height: 33px;} } h2.bolder { font-weight: 600;} h2::before { content: ''; position: absolute; top: -45px; left: -36px; background-image: url("/wp-content/themes/st_francis/images/icon-leaves.svg"); background-repeat: no-repeat; background-size: contain; background-position: center; width: 140px; height: 140px; } .light h2::before { background-image: url("/wp-content/themes/st_francis/images/icon-leaves-light.svg");} .page-panel.panel-bg-image.full-width h2::before { background-image: url("/wp-content/themes/st_francis/images/icon-leaves-light.svg"); } @media (max-width:990px){ h2::before { height: 90px; width:90px; top: 0px; left: -20px;} } .card .card-content h2 { padding-top:0;} .card .card-content h2::before { content:none;} h3{ font-weight: 500; margin-bottom: 22px; font-size: 23px; color: var(--teal); letter-spacing: 3.62px; line-height: 25px; text-transform: uppercase; text-align: left; position: relative;} @media (max-width:990px){ h3 { font-size: 28px;line-height: 33px;} } h4 { font-weight: 300; color: var(--wine);font-style: italic;font-size: 17px;letter-spacing: 8.88px; margin-bottom: 10px; text-transform: uppercase;} blockquote h4 { font-weight: 600;font-size: 23px;color: var(--olive);letter-spacing: 0; text-transform: none;} @media (max-width:990px){ h4 { line-height: 2em;} blockquote h4 {font-size: 20px; line-height: 1.25em;} } .team_member h4 { color:var(--wine);} h5 { font-size: 18px; color: var(--olive); letter-spacing: 4px; line-height: 24px; font-weight: 800; } .team_member h5 { font-family: var(--sans); font-size: 18px; color: var(--white); letter-spacing: 2.9px; background:var(--wine); padding:4px 60px 4px 16px; text-transform: uppercase; width:auto; font-style: italic; display:inline-block; line-height: 1.25em; margin-bottom:20px;} @media (max-width:990px){ .team_member h5 { font-size: 16px;padding-right: 48px; line-height: 1.25em; padding: 8px 60px 8px 16px;} } @media (max-width:480px){ .team_member h5 { font-size: 14px;line-height: 1.25em;padding: 10px 30px 10px 16px;} } h6 { text-transform: uppercase; font-size: 14px; letter-spacing: 2px; line-height: 1.5; font-weight: 900;} .flexPanel p, .flexPanel .p { font-size:18px;} @media (max-width:640px){ .flexPanel p, .flexPanel .p { font-size: 16px; } } /* ---------------- ---------------- */ /* -------- Flex Panel Values -------- */ /* ---------------- ---------------- */ .flexPanel { display: flex !important; padding: 0; width:calc(100% + 40px); max-width:1320px; flex-wrap: wrap; margin:0 -20px;} .flexPanel.flexReverse { flex-direction:row-reverse;} .flexPanel .cell_12, .flexPanel .cell_11, .flexPanel .cell_10, .flexPanel .cell_9, .flexPanel .cell_8, .flexPanel .cell_7, .flexPanel .cell_6, .flexPanel .cell_5, .flexPanel .cell_4, .flexPanel .cell_3, .flexPanel .cell_2, .flexPanel .cell_1 { width:calc(100% - 40px); margin:20px; display:block;} @media (min-width:641px){ .flexPanel .cell_8, .flexPanel .cell_7, .flexPanel .cell_6, .flexPanel .cell_5, .flexPanel .cell_4 { width:calc(50% - 40px);} } @media (min-width:768px){ .flexPanel .cell_8,.flexPanel .cell_9 { width:calc(67.777% - 40px);} .flexPanel .cell_4, .flexPanel .cell_3 { width:calc(33.333% - 40px);} } @media (min-width:991px){ .flexPanel .cell_11 { width:calc(91.667% - 40px);} .flexPanel .cell_10 { width:calc(83.333% - 40px);} .flexPanel .cell_9 { width:calc(75% - 40px);} .flexPanel .cell_8 { width:calc(66.667% - 40px);} .flexPanel .cell_7 { width:calc(58.333% - 40px);} .flexPanel .cell_5 { width:calc(41.667% - 40px);} .flexPanel .cell_4 { width:calc(33.333% - 40px);} .flexPanel .cell_3 { width:calc(25% - 40px);} .flexPanel .cell_2 { width:calc(16.667% - 40px);} .flexPanel .cell_1 { width:calc(8.333% - 40px);} } @media (min-width:991px){ .team_member .flexPanel .cell_3 { width:calc(33% - 40px);} } @media (min-width:1400px){ .team_member .flexPanel .cell_3 { width:calc(25% - 40px);} } @media (max-width:991px){ .flexPanel .card.cell_4, .flexPanel .card.cell_3 { width: calc(50% - 40px) !important;} } @media (max-width:640px){ .flexPanel .card.cell_4, .flexPanel .card.cell_3 { width: calc(100% - 40px) !important;} } /* ---------------- ---------------- */ /* -------- Panel Values -------- */ /* ---------------- ---------------- */ main#content { width:100%; margin-top:73px;overflow-x: hidden; position: relative;} @media (max-width:990px){ main#content { margin-top:0px;} } .page-panel { padding: 100px 0; position: relative; overflow: hidden;} @media (max-width:990px){ .page-panel { padding: 50px 0;} } .page-panel.panel-bg-image.full-width { padding: 200px 0; position: relative;} @media (max-width:990px){ .page-panel.panel-bg-image.full-width { padding: 100px 0;} } .page-panel.justify-right > .pageinner > .flexPanel { flex-direction: row-reverse;} .page-panel.justify-flex-end > .pageinner > .flexPanel { justify-content: flex-end;} .page-panel.justify-center > .pageinner > .flexPanel { justify-content: center;} .page-panel.justify-flex-start > .pageinner > .flexPanel { justify-content: flex-start;} .page-panel.justify-space-around > .pageinner > .flexPanel { justify-content: space-around;} .page-panel.justify-space-between > .pageinner > .flexPanel { justify-content: space-between;} .page-panel.vert-right > .pageinner > .flexPanel { align-items:flex-end;} .page-panel.vert-left > .pageinner > .flexPanel { align-items: flex-start;} .page-panel.vert-center > .pageinner > .flexPanel { align-items: center;} .panel-over-right { position:absolute; right:-20px; top:120px; min-width: 386.65px;} .panel-over-right p { line-height:1em;} .panel-bg-image.full-width h1, .panel-bg-image.full-width h2, .panel-bg-image.full-width h3, .panel-bg-image.full-width h4, .panel-bg-image.full-width h5, .panel-bg-image.full-width h6, .panel-bg-image.full-width p, .panel-bg-image.full-width li, .panel-bg-image.full-width a, .light .card:not(.dark) h1, .light .card:not(.dark) h2, .light .card:not(.dark) h3, .light .card:not(.dark) h4, .light .card:not(.dark) h5, .light .card:not(.dark) h6, .light .card:not(.dark) p, .light .card:not(.dark) li, .light .card:not(.dark) a { color:var(--white);} a.rel { position:absolute; top:-200px; font-size: 0px; color: transparent; height: 0; width: 0; opacity: 0; overflow: hidden;} .bg-panel { position:absolute; width:100%; height:100%; z-index: 0; top:0; left: 0; overflow: hidden;} .half-width .bg-panel { position:absolute; width:60%; height:100%; z-index: 0; top:0; left: 0;} .half-width .bg-panel.right { left: unset; right:0;} .bg-panel img { object-fit: cover; width: 100%; height: 120%; margin: 0; display: block; position: relative;} .half-width .bg-panel img { object-fit: contain; width: 100%; height: 100%; margin: 0; display: block;} .hundred .bg-panel img { object-fit: contain; width: 100%; height: 100%; margin: 0; display: block; position: relative;} .hundred .bg-panel.center.top::before { position:absolute; z-index: 1; width:100%; height: 100%; content: ''; top:0; left:0; background-image:linear-gradient(0deg, rgba(33,23,28,0) 0%, rgba(33,23,28,.6) 100%);} .panel-bg-image.full-width .bg-panel::before { position:absolute; z-index: 1; content: ''; width: 100%; height: 100%; top:0; left:0px; background-image:linear-gradient(123deg, rgba(0,0,0,.2), rgba(0, 0, 0,.8) 95%);} .masthead { position:relative; padding:0 !important; overflow: unset !important;} .masthead .funk { position:relative; padding:0 !important; overflow: hidden !important;} .masthead .textbox { position:absolute; left:0; top: 9vh; z-index: 4; width: calc(100%); display: flex; gap:40px; align-items: center; justify-content: space-between; } .masthead .textbox h3 { width:50%; } .masthead .textbox .masthead-outer { width:100%; position: relative; } @media (max-width:990px){ .masthead .textbox {flex-wrap: wrap;} .masthead .textbox h3, .masthead .textbox .masthead-outer { width:100%; } .masthead .textbox .masthead-text { margin-bottom:0;} .masthead .textbox {position: relative;left: 0;top: 0;transform: none;z-index: 4;width: calc(100%);display: flex;gap: 40px;align-items: center;justify-content: space-between;padding: 88px 0px;} .slider_pane .pageinner {height: auto !important; min-height: 125vh;} } .masthead .pane { border-radius:0px; height:457px; } @media (max-width:990px){ .masthead .pane { height:320px; } .panel-over-right { min-width: 215px;} } @media (max-width:640px){ .masthead .pane { height:240px; } .masthead .textbox { padding:40px 0;} } @media (max-height:640px) and (max-width:640px){ .masthead .textbox { padding:0;} } .panel-bg-padding { padding:40px;} .masthead-text { background: transparent; padding:0 40px; color:var(--white); text-align: center;} @media (max-width:640px){ .masthead-text { padding: 24px 24px 40px; } } .masthead-text h2 { color:var(--white); text-align: center;} .masthead-outer.bg-white { background: transparent; padding:40px; color:var(--white);} @media (max-width:640px){ .masthead-outer.bg-white {padding: 24px;} } .masthead .slider_pane::before { content: ''; position: absolute; top:0; left: 0; height: 100%; width:100%; z-index: 4; background: -moz-linear-gradient(0deg, rgba(44,26,49,0) 67%, rgba(44,26,49,.67) 100%); background: -webkit-linear-gradient(0deg, rgba(44,26,49,0) 67%, rgba(44,26,49,.67) 100%); background: linear-gradient(0deg, rgba(44,26,49,0) 67%, rgba(44,26,49,.67) 100%); } .masthead-outer.bg-white .masthead-text { background: transparent; padding:0px; color:var(--white);} .masthead-text p {color: var(--white);max-width: 900px;margin-left: auto;margin-right: auto;} .image-icon { bottom: -1px; left: -94px; position: absolute; width: 230px; height: 272px; z-index: 2; background-size: contain; background-repeat: no-repeat; background-position: left bottom;} .image-icon.building { bottom: 0px; left: -83px; position: absolute; width: 230px; height: 172px; z-index: 2; background-size: contain; background-repeat: no-repeat; background-position: left bottom; } @media (max-width:990px){ .image-icon.building { bottom: -1px;} } .image-icon.house { bottom: 0px; left: -104px; position: absolute; width: 230px; height: 146px; z-index: 2; background-size: contain; background-repeat: no-repeat; background-position: left bottom; } @media (max-width:990px){ .image-icon.house { bottom: -1px;} } @media (max-width:990px){ .image-icon { bottom: -1px; left: -37px; position: absolute; width: 90px; height: 122px; z-index: 2; background-size: contain;background-repeat: no-repeat; background-position: left bottom;} .masthead .cell_4 { width: calc(100% - 40px); top: -20px; position: relative; margin: 0; z-index: -1; border-radius: 0 0 7px 7px;} .panel-bg-padding { padding:25px;} .image-icon.house {bottom: -1px;left: 0px;width: 110px;height: 96px;} .image-icon.building {left: 0; width: 70px; height: 172px;} } .callout {margin: -34px -40px 40px 40px; padding:40px;} .callout h3, .callout h4, .callout h5, .callout h6 { margin:0; color:var(--white); font-weight:900; text-align: left; width:90%; display:block; text-transform: uppercase; font-style: normal;} .callout h4 {font-size: 36px;letter-spacing: 19px;line-height: 39px;} .callout h3 {font-size: 76px;letter-spacing: 0;line-height: 1.35em; min-width:90%; } .callout h5 {font-size: 20px;letter-spacing: 14.38px; font-weight: 600;line-height: 1.85em;} .callout h6 {font-size: 16px;letter-spacing: 21.91px; font-weight: 600;} .link-panel.callout-link { width:auto; position: absolute; bottom:71px; left:95%;} .link-panel.callout-link a.button { width:auto !important; white-space: nowrap;} @media (max-width:1400px){ .callout h4 {font-size: 32px;letter-spacing: 17px;} .callout h3 {font-size: 69px;} .callout h5 {font-size: 17px;letter-spacing: 13.38px;} .callout h6 {font-size: 14px;letter-spacing: 19.7px;} } @media (max-width:1200px){ .callout{margin: -32px -12px auto;padding: 40px;min-width: 423px;} .callout h4 {font-size: 32px;letter-spacing: 17px; width:100%;} .callout h3 {font-size: 69px; min-width:100%; width:100%;} .callout h5 {font-size: 17px;letter-spacing: 13.38px; width:100%;} .callout h6 {font-size: 14px;letter-spacing: 19.7px; width:100%;} .link-panel.callout-link {width: auto;position: relative;bottom: 11px;left: 10px;} } @media (max-width:540px){ .callout{padding: 24px 15% 35px; min-width:unset;} .callout h4 {font-size: 25px;letter-spacing: 12px; width:100%;} .callout h3 {font-size: 51px; min-width:100%; width:100%;} .callout h5 {font-size: 14px;letter-spacing: 9px; width:100%;} .callout h6 {font-size: 11px;letter-spacing: 14.2px; width:100%;} } @media (max-width:440px){ .callout{padding: 24px 24px 35px;} } .callout.bg-brown *, .callout.bg-green *, .callout.bg-teal *, .callout.bg-black * { color:var(--white);} .callout.bg-brown ul, .callout.bg-green ul, .callout.bg-teal ul, .callout.bg-black ul { margin:0 0 0 10px;} .card-title { display: flex; align-items: center; justify-content: flex-start; border-radius: 7px 7px 0 0; width:calc(100% + 2px); margin-left:-1px;} .card-icon { width:64px; height: 85px; background-position: center center; background-repeat: no-repeat; margin:25px; background-size: contain;} @media (max-width:990px){ .card-icon { width:44px; height: 60px;} } .card-icon.none { width:40px; margin-left:0; margin-right: 0;} .card .pane {width:100%; margin-bottom:7px; height: auto;padding-bottom: 69.37%; border-radius:0px; box-shadow: 1px 3px 8px 0 rgba(0,0,0,0.07);} .card.bg-solid .pane { box-shadow:none;} .card.imagesquare .pane {padding-bottom: 100%;} .card.image80 .pane {padding-bottom: 80%;} .card.imagefull .pane {padding-bottom: 61.8046971569839%;} .card.imagebelow .pane {margin-bottom:-222px;} .page-panel.imagebelow { margin-bottom:52px;} @media (max-width:990px){ .page-panel.imagebelow { margin-bottom:52px;} } @media (max-width:640px){ .page-panel.imagebelow { margin-bottom:156px;} } .card.imageabove .pane {margin-top:-222px;} .page-panel.imageabove { margin-top:52px;} @media (max-width:990px){ .page-panel.imageabove { margin-top:52px;} } @media (max-width:640px){ .page-panel.imageabove { margin-top:222px;} .page-panel.imageabove { margin-top: 109px;} } .card-content { padding: 10px 0px;} .pane-overflow { display:none;} .card.imagesquare .pane-overflow { display: block; z-index: 99; overflow: visible; position: absolute; top: 0; left: 0;} .card.imagesquare .pane-overflow::after { content: ''; position: absolute; bottom:-70px; right:-73px; width:160px; height: 160px; background-size: contain; background-repeat: no-repeat;} .panel-bg-gold .card.imagesquare .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-4.svg");} .panel-bg-green .card.imagesquare .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-3.svg");} .panel-bg-purple .card.imagesquare .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-1.svg");} @media (max-width:990px){ .card.imagesquare .pane-overflow::after { bottom:-60px; right:-53px; width:100px; height: 100px;} } .card.image80 .pane-overflow { display: block; z-index: 99; overflow: visible; position: absolute; top: 0; left: 0;} .card.image80 .pane-overflow::after { content: ''; position: absolute; bottom:-70px; right:-73px; width:160px; height: 160px; background-size: contain; background-repeat: no-repeat;} .panel-bg-gold .card.image80 .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-4.svg");} .panel-bg-green .card.image80 .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-3.svg");} .panel-bg-purple .card.image80 .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-1.svg");} @media (max-width:990px){ .card.image80 .pane-overflow::after { bottom:-60px; right:-53px; width:100px; height: 100px;} } .card.imagefull .pane-overflow { display: block; z-index: 99; overflow: visible; position: absolute; top: 0; left: 0;} .card.imagefull .pane-overflow::after { content: ''; position: absolute; bottom:-70px; right:-73px; width:160px; height: 160px; background-size: contain; background-repeat: no-repeat;} .panel-bg-gold .card.imagefull .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-4.svg");} .panel-bg-green .card.imagefull .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-3.svg");} .panel-bg-purple .card.imagefull .pane-overflow::after { background-image:url("/wp-content/themes/st_francis/images/icon-dot-1.svg");} @media (max-width:990px){ .card.imagefull .pane-overflow::after { bottom:-60px; right:-53px; width:100px; height: 100px;} } .card-content p img { display: block; border: 10px solid #FFFFFF; box-shadow: 1px 3px 8px 0 rgba(0,0,0,0.07); position: relative; transition: .25s opacity ease-in-out, .25s transform ease-in-out; } .flex-icon img { max-width:63px; margin: 0 auto; display: block;} .resource_search input { margin-right: 20px; line-height: 1; padding: 5px 10px; border-radius: 0; border: 0; color:var(--wine); } .slider-absolute { position: absolute !important; top: 0; left: 0; height: 100vh; width: 100%; } .aligncenter {margin-left: auto;margin-right: auto;text-align: center;display: block;} .cell_4 .card-title h2 { padding-right:20px; font-size: 30px;} .bg-solid .card-content { padding: 10px 24px;} .flexPanel .cell_12.flex { display:flex; } .space-between { justify-content:space-between; align-items: center;} .border-top > .pageinner { border-top:1px solid var(--wine32);} .border-bottom > .pageinner { border-bottom:1px solid var(--wine32);} .article_img { position:relative; height:auto; margin-bottom: 20px;} .article_img div.pane { height:auto; padding-bottom:61.8046971569839%; border-radius: 12px; box-shadow: 1px 3px 8px 0 rgba(0,0,0,0.07);} .team_img { position:relative; height:auto; margin-bottom: 20px;} .team_img div.pane {height: auto;width: 100%;padding-bottom: 100%; max-width:100%; } #contact-nav-list h3 { margin-bottom:12px; font-weight:900;} .insights .cell { position: relative; transition:.25s all ease-in-out; margin: 0 0 50px; padding:20px; border-radius: 28px; } .insights .cell_4 { width:100%;} @media (min-width:641px){ .insights .cell_4 { width:calc(50%);} } @media (min-width:768px){ .insights .cell_4 { width:calc(33.333%);} } .insights .cell a.read-more { position: absolute; bottom:0; left:0;} .insights .cell a { display:block; text-align: left; color: var(--grey); height:100%;} .insights .cell:not(.sfa):hover { transition:.25s all ease-in-out; transform:scale(102%); background:var(--gold); padding: 20px;} .insights .p { margin: 0; color: var(--grey); text-align: left;} .insights .cell * { transition: .25s all ease-in-out;} .insights .cell:hover * { color:var(--white) !important; transition: .25s all ease-in-out;} .center { text-align:center; justify-content: center; align-content: center; } .stat { position:relative; transition: .25s all ease-in-out;} .stat img { position:absolute; width: 100%; height: 100%; object-fit: cover; z-index: -1; left:0; top:0;border-radius: 11px; } .stat a { display:block; height:100%; width:100%;} .stat a .masthead-text { display:inline-block;} .stat a .masthead-text::after { content: ''; background-image:url("/wp-content/themes/st_francis/images/arrow_white_thin.svg"); background-position: right center; background-repeat: no-repeat; height: 30px; width: 70px; position: relative; display: inline-block; margin-left:20px;} .stat-link:hover { transform: scale(104%); transition: .25s all ease-in-out;} .stat .stat-content { margin:50% 0 40px; position: relative; padding:0 6.71% 0 13.42%; z-index: 4} @media (max-width:1250px){ .stat .stat-content { padding:0 6.71%;} .stat a .masthead-text { font-size:36px; line-height: 1.25em; width:auto; padding: 0;} } @media (max-width:990px){ .stat h2 { margin-left: -41px; padding: 10px 60px 10px 30px;} } @media (max-width:540px){ .stat .stat-content { margin: 70% 0 40px;} } .stat * { color:#ffffff;} .stat-text { margin-top:10px;} .stat::before { z-index: 1; width: calc(100% - 22px); height: 350px; top: calc(45% - 8px); position: absolute; background: url("/wp-content/themes/st_francis/images/dots-light.png") repeat; opacity: 0.26; content: ''; left: 17px; } .stat::after { height: 100%; width: 100%; top: 0; left: 0; content: ''; background: var(--wine); opacity: .4; position: absolute; z-index: 0; border-radius: 11px; } @media (min-width:768px){ .stats-outer::before { z-index: -1; width: 100%; height: 350px; top: 45%; position: absolute; background: url("/wp-content/themes/st_francis/images/dots.png") repeat; opacity: .86; content: '';} } footer { border-radius:0 !important; padding:0; text-align:center; line-height: 1.5em; margin-top: 6px;} footer h3 { font-weight: 900;font-size: 23px;color:var(--wine);letter-spacing: 0;line-height: 39px;} footer .widget_text {text-align:left; padding:0;} footer .widget_text * {text-align:left; max-width: 100%;} th {font-weight:800; font-family: var(--sans); text-transform: uppercase;font-size: 15px;letter-spacing: 1.81px;text-align: center;line-height: 30px; padding:30px 18px 6px;} td, #copyright { font-weight: 400; font-size: 14px; text-align: left; padding: 0; } #copyright { padding-bottom: 20px; text-align: right; } footer iframe { max-width: calc(100% + 100px); border-radius: 11px;} @media (max-width:1200px){ footer iframe { max-width: calc(100% + 50px);} } @media (max-width:767px){ footer iframe { max-width: calc(100% - 48px);} } footer .dots-panel { z-index:0;} footer .dots-panel::before { display:none;} footer .dots-panel-inner { background-image: url("/wp-content/themes/st_francis/images/dots-light.png") } footer .dots-panel-inner::before { background: var(--wine); display: block;} footer .flexPanel { position: relative; z-index: 2;} footer .dots-inner { margin-top: 41px;} @media (max-width:990px){ footer .flexPanel .cell_6 { width:calc(100% - 40px);} footer .dots-panel { top: 116px; height: calc(100% - 254px);} } @media (max-width:767px){ footer .dots-panel { top: 0px; height: calc(100% - 204px);} footer .dots-panel-inner { top:8px; background-position: top right;} footer .dots-panel-inner::before { right: 48px; top:59px; left: unset; height: calc(100% - 160px);} } footer#legal-footer { margin:0; padding-top:4px; position: relative; overflow: hidden;} footer#legal-footer .floating-icon { z-index:0;} #legal-sub-footer { margin-bottom:300px; padding:0 50px; position: relative; z-index: 2;} .footer-1 p { display:flex; align-items: center; justify-content: flex-start; margin: 0 20px;} .footer-1 p.logo-panel img { max-height: 90px; max-width: 118px; width: auto; height: auto; margin-right: 20px; } @media (max-width:990px){ .footerFlex .cell_6 { width:calc(100% - 40px) !important;} .footerFlex .cell_6:first-child { margin-bottom:0;} .footerFlex .cell_6:last-child { margin-top:0;} .footer-1 p { justify-content: center; margin: 0 20px;} .footer-1 p.logo-panel img {margin: 0 4%;} footer .widget_text {text-align: left;padding: 20px 0;} } @media (max-width:640px){ .footer-1 p.logo-panel img { max-height: 50px; max-width: 26%;} } .flexPanel.footerFlex .footer-3 { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; text-align: right;} .flexPanel.footerFlex .footer-3 .widget_text p { text-align: right;} .flexPanel.footerFlex .footer-3 .widget_nav_menu { width:100%; } .flexPanel.footerFlex .footer-3 .widget_nav_menu .menu { flex-wrap: nowrap; justify-content: flex-end; gap:10px; display: flex;} @media (max-width:990px){ .flexPanel.footerFlex .footer-3 { justify-content: center; align-items: center; text-align: center;} .flexPanel.footerFlex .footer-3 .widget_text p { text-align: center;} .flexPanel.footerFlex .footer-3 .widget_nav_menu .menu { justify-content:center;} } footer .forminator-ui {display: flex; width:100%; justify-content: flex-start;} footer .forminator-ui input { border:1px solid var(--grey); font-weight:700;font-size: 12px;color: #68573E;letter-spacing: 3.41px;padding: 13px 15px 13px 21px !important; line-height: 1.35em; text-transform: uppercase;} footer .forminator-ui button.forminator-button-submit { font-size:12px !important; letter-spacing: 3.41px;padding: 15px 66px 15px 15px !important; margin-left:20px;} @media (max-width:990px){ footer .forminator-ui {flex-wrap:wrap;} footer .forminator-ui button.forminator-button-submit { margin-left: 0;margin-top:20px; width:100%;} } .forminator-label { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; } #radio-1 .forminator-label { position: relative !important; height: auto !important; padding: 0 !important; margin: 0 0 0px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; font-size: 18px !important; font-weight: 600 !important; color: var(--wine) !important; border-bottom: 1px solid var(--tea) !important; width: auto !important; display: inline-block; } .forminator-error-message { display: block; color: #cc0000; font-style: italic; font-size: 12px; line-height: 1; margin: 10px 0 0; } #contact-nav-list .forminator-error-message {color: #F5A8A8;} @media (max-width:990px){ footer .forminator-ui { justify-content: center;} footer .forminator-ui input { border:1px solid var(--wine);} footer h3 { text-align: center !important;} footer#legal-footer { padding-bottom:150px;} } footer .forminator-edit-module { display:none;} footer .forminator-ui.forminator-custom-form:not(.forminator-size--small)[data-grid="open"] .forminator-row:not(:last-child) { margin-bottom:0;} footer#legal-footer .cell_12 { margin-bottom:10px;} footer#legal-footer .widget_text { padding:0; font-size: 14px;} footer#legal-footer .widget_text p {font-size: 14px; text-align: left; margin: 0 0 10px;} footer#legal-footer .widget_text p:last-child { margin-bottom:0;} footer#legal-footer .cell_12#copyright { margin-bottom:0px;} @media (max-width:990px){ footer#legal-footer .widget_text p {text-align: center;} } .menu-footer-container ul { display:flex; justify-content: flex-start; } .menu-footer-container ul li { padding-right:60px; position: relative;} .menu-footer-container ul li::after {content: '';position: absolute;right: 30px;top: 20%;width: 1px;height: 60%;background: var(--wine);} .menu-footer-container ul li:last-child { padding-right:0;} .menu-footer-container ul li:last-child::after { display:none;} .menu-footer-container a {font-size: 14px;color:var(--wine);letter-spacing: 0; text-decoration: underline;} .menu-footer-container a:hover { color:var(--teal);} @media (max-width:990px){ .menu-footer-container ul {display: flex;justify-content: center; flex-wrap: wrap;} .menu-footer-container ul li { padding-right:0; width:100%; } .menu-footer-container ul li::after { display: none;} #copyright {text-align: center;} } /* ---------------- ---------------- */ /* -------- Blog Values -------- */ /* ---------------- ---------------- */ .portfolio-container { margin-top:20px; margin-bottom: 150px; transition:.75s all ease-in-out;} .cat-resource { font-size: 14px;color: var(--teal);line-height: 24px; margin:10px 0; text-transform: uppercase;font-weight: 600;letter-spacing: 5px;} .cat-resource a { color:var(--teal);} .cat-resource a:hover { color:var(--verdi);} .resource-title { font-family: var(--sans); font-weight: 400; font-size: 30px; color: var(--teal); letter-spacing: 0; line-height: 1.25em; margin: 20px 0 10px; text-transform: none; margin-bottom: 13px; } .portfolio-container .cell { padding:20px 0 50px; position: relative;} .portfolio-container .cell .button { position:absolute; bottom: 10px;left:0; } .related-title h3 { margin-bottom:0;} .further-reading .article_img { padding-bottom:61.8%;} .project-overlay a:hover { color:var(--cotton);} .portfolio-container.fadey { transition:.75s all ease-in-out; opacity: 0; filter:blur(5px);} .tags { border-top:#ECECEC 1px solid; border-bottom:#ECECEC 1px solid; text-transform: uppercase; padding:5px 0;margin-bottom: 12px; } .tags a { display: inline-block; padding: 10px 10px 8px 0; position: relative; font-size: 12px; margin-right: 10px; letter-spacing: .5px; font-weight: 600; } .tags.singletags a { display:inline-block; padding: 10px 10px 8px 0; position: relative; font-size: 14px; margin-right:10px; letter-spacing: 1px; font-weight: 400;} .tags a::after { height:76%; width:1px; content: ''; right:0; top:12%; position: absolute; background: #ECECEC;} .tags a:last-child::after { display:none;} .resource_search input[type="search"] { padding: 2px 9px; font-size: 11px; width:100%;height: 21px; border-radius: 3px 0 0 3px; border: none; color:#2E2E2E;} .project-overlay { display:flex; justify-content: space-between; align-items: center;} @media (max-width:990px){ .project-overlay { flex-wrap:wrap;} } .resource_search input[type="submit"] { text-indent: -9999px; overflow: hidden; background-color: var(--white); border-radius: 0 3px 3px 0 !important; height: 21px; width: 30px; padding: 0; background-image: url('/wp-content/themes/st_francis/images/spyglass.svg'); background-position: center center; background-size:12px 12px; background-repeat: no-repeat; } .resource_search input[type="submit"]:hover { transform:none; background-color:#63C863; box-shadow: none;} .resource_search form.search-form label { width: 100%; } .project-buttons {padding-right:20px;} .single-thumbnail { padding: 0 0 62px 0; display: block; position: relative; margin-bottom: 60px !important; height:500px; width:100%;} .single-thumbnail-inner { padding: 0; display: block; position: relative; height:500px; width:100%;border-radius:10px; overflow: hidden;} @media (max-width:990px){ .single-thumbnail { padding:0; margin-top: 30px !important; margin-bottom: 70px !important; height:400px; } .single-thumbnail-inner { height:400px; } } @media (max-width:767px){ .single-thumbnail { height:300px; } .single-thumbnail-inner { height:300px; } } .single-thumbnail img { display:block; margin-bottom: 0; width: 100%; height:100%; position: absolute; object-fit: cover;} blockquote { color: var(--wine);letter-spacing: 0;text-align: center; padding:40px; font-weight: 300; margin: 40px 0; position: relative; font-size: 20px;line-height: 51px;} /* blockquote::before { position: absolute; width: 100%; height:50px; content: ''; left:0; top:0; background:url("/wp-content/themes/st_francis/images/dots.png");} blockquote::after { position: absolute; width: 100%; height:50px; content: ''; left:0; bottom:0; background:url("/wp-content/themes/st_francis/images/dots.png");} */ blockquote p { display: block; width: auto; font-size: 18px; color: var(--wine); text-align: left; line-height: 26px; font-family: var(--sans); font-weight: 300; font-style: italic; position: relative; margin: 30px 0; } blockquote p:first-child { text-indent: 93px; } blockquote p b, blockquote p strong { display: inline-block; position: absolute; right: calc(100% - 83px); text-align: right; font-weight: 200; font-size: 68px; top: -18px; } @media (max-width:640px){ blockquote p b, blockquote p strong { display: block; position: relative; top: unset; right: unset; text-align: left; margin-bottom: 50px; left: -24px;} blockquote p:first-child { text-indent: 0px;} blockquote p { padding-left:6px;} } blockquote p:last-of-type { margin-bottom:0;} @media (max-width:990px){ blockquote { padding: 100px 20px; min-width: unset; transform: translateX(-50%); left: 50%;} } @media (max-width:640px){ blockquote { min-width: unset; padding: 20px;} blockquote:last-child, blockquote:last-child h2:last-child { margin-bottom: 0px; madding-bottom:0; } } .the-content-container { margin:100px auto;} @media (max-width:990px){ .the-content-container { margin:0px auto;} } .cell_12.tags.singletags { margin-top: -30px; display: flex; justify-content: space-between; flex-wrap: nowrap; margin-bottom: 80px; } .singletags .meta { display: inline-block; padding: 10px 0 8px 10px; position: relative; font-size: 14px; margin-left: 10px; letter-spacing: 1px; } .singletags .meta.author { } .cell_12.related-title { padding:30px;} .phone { display:flex; flex-wrap: wrap; margin-top:20px; font-size: 14px; } .phone-item { width:100%; margin-bottom: 10px; font-size: 14px; } .phone-item:last-child { margin-bottom: 0px; } .social-contacts { display:flex; margin-top:20px; font-size: 14px; } .social {height: 45px;width: 45px;overflow: hidden;text-indent: -9999px;display: block;position: relative; margin:0px;transition:var(--standard);} .social a {height: 45px;width: 45px;overflow: hidden;text-indent: 9999px;display: block;position: relative; padding: 0;} .social a:hover { transform: none !important;} .social:hover { transition:var(--standard);} .social a::before { display: inline-block;font-family: 'social round';font-style: normal;font-weight: normal;text-indent: 0px; line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;height: 28px;width: 28px; position: absolute; top: 1px; left: 1px; font-size: 43px; color:var(--wine); transition:var(--standard); content: '';} .darkmode .social a::before { color:var(--white);transition:var(--onesecond);} .social:hover a::before { color:var(--teal); transition:var(--standard);} .social.facebook a:before { content:'\0041';} .social.linkedin a:before { content:'\0042';} .social.twitter a:before { content:'\0043';} .social.youtube a:before { content:'\0044';} .social.pinterest a:before { content:'\0045';} .social.instagram a:before { content:'\0046';} .social.x a:before { content:'\0047';} .social.search a:before { content:'\0048';} .social.amazon a:before { content:'\0049';} .social.tiktok a:before { content:'\004a';} .social.houzz a:before { content:'\004b';} .social.spotify a:before { content:'\004c';} .social.phone a:before { content:'e';} .social.whatsapp a:before { content:'\004d';} .social.google a:before { content:'\004e';} .social.behance a:before { content:'\004f';} .social.dropbox a:before { content:'\0050';} .social.slack a:before { content:'\0051';} .social.sketch a:before { content:'\0052';} .social.pandora a:before { content:'\0053';} .social.soundcloud a:before { content:'\0054';} .social.deviantart a:before { content:'\0055';} .social.googleplay a:before { content:'\0056';} .social.apple a:before { content:'\0057';} .social.vimeo a:before { content:'\0058';} .social.tumblr a:before { content:'\0059';} .social.airtable a:before { content:'\005a';} .social.notion a:before { content:'a';} .social.etsy a:before { content:'b';} .social.shopify a:before { content:'c';} .social.email a:before { content:'d';} .social.two a:before { content:'t';} .social.zwinggi a:before { content:'z';} .social.pills a:before { content:'\0030';} .social.transfer a:before { content:'\0031';} .social.vaccine a:before { content:'\0032';} .social.wound a:before { content:'\0033';} .social.walker a:before { content:'\0034';} .social.testing a:before { content:'\0035';} .social.sports a:before { content:'\0036';} .social.select_arrow a:before { content:'\0037';} .social.icon_resources a:before { content:'\0038';} .social.donate a:before { content:'\0039';} .social.pinwheel-ai a:before { content:'\0021';} .social.pin a:before { content:'\0022';} .social.arrow_blue_thin a:before { content:'\0023';} .social.arrow_blue a:before { content:'\0024';} .social.check-2 a:before { content:'\0025';} .social.chevron-midnight a:before { content:'\0026';} .social.contact a:before { content:'\0027';} .social.load_more a:before { content:'\0028';} .social.spyglass_blue a:before { content:'\0029';} .social.play-2 a:before { content:'\002a';} .social.patient a:before { content:'\002b';} .social.calendar a:before { content:'\002c';} .social.info a:before { content:'\002d';} .social.upload a:before { content:'\002e';} .social.spyglass a:before { content:'\002f';} .social.flickr a:before { content:'\005b';} .social.map a:before { content:'f';} .social.donate a:before { content:'9';} .social.info a:before { content:'-';} .social.upload a:before { content:'.';} .social.cellphone a:before { content:'\005c';} .social.website a:before { content:'\005d';} .team_member .cell:hover .team_img .normy { opacity:0;} .normy { z-index:3;} .funny { z-index:2;} .dl { border-top:1px solid #ececec; padding: 37px 0; display:flex; } .dl:last-child { border-bottom:1px solid #ececec; margin-bottom: 100px;} .dl-image { width:67%; margin-right:50px; height:300px; position: relative; border-radius: 7px; overflow: hidden; background: #000;} .dl-image img { position: absolute; width: 100%; height: 100%; object-fit: cover; opacity: .95;} .dl-meta-inner { border-top:1px solid #ececec; border-bottom:1px solid #ececec; padding:20px 0; margin: 20px 0; font-family: var(--sans); font-weight:600; font-size: 14px;letter-spacing: 1px;text-transform: uppercase;} @media (max-width:640px){ .dl { flex-wrap: wrap;} .dl-image { width:100%; margin: 0; height: 200px;} .dl-meta { width:100%; margin-top:40px;} } .gm-style-iw { padding:0 !important;} .marker-panel { padding:30px;} .marker-panel h2 { background:url("/wp-content/themes/st_francis/images/plans_green.jpg"); padding:30px 30px 30px 60px; width:calc(100% + 60px); margin:-30px 0 0 -30px; font-size: 30px; font-weight:500; color:var(--white); position: relative;} .marker-panel-inner { padding: 30px 0 0 30px;} .marker-panel-inner div { padding: 5px 0;} @media (max-width:640px){ .marker-panel-inner { padding: 30px 0 0 0;} } .gm-ui-hover-effect {top: 0px !important;right: 0px !important;} .gm-ui-hover-effect::before { top:17px; left: 0; width:20px; height:2px; content: ''; transform: rotate(-45deg); background: var(--white) !important;transition: .25s all ease-in-out !important; position: absolute;} .gm-ui-hover-effect::after { top:17px; left: 0; width:20px; height:2px; content: ''; transform: rotate(45deg); background:var(--white) !important;transition: .25s all ease-in-out !important; position: absolute;} .gm-ui-hover-effect:hover::before, .gm-ui-hover-effect:hover::after { background: #dfd; transition: .25s all ease-in-out !important;} .gm-ui-hover-effect img { display: none !important;} .forminator-select.forminator-select-dropdown-container--open .forminator-select-dropdown.forminator-dropdown--default { background: var(--white);} .gallery-limit { margin-bottom: 60px; width:calc(100% - 70px);} .gallery-limit .gallery { display:flex; align-items: center; justify-content: flex-start; } .gallery-limit .gallery .gallery-item, .gallery-limit .gallery br { display:none; width:auto !important; } .gallery-limit .gallery .gallery-item:nth-child(1), .gallery-limit .gallery .gallery-item:nth-child(2), .gallery-limit .gallery .gallery-item:nth-child(3), .gallery-limit .gallery .gallery-item:nth-child(4), .gallery-limit .gallery .gallery-item:nth-child(5) { display:block;} .gallery-limit .gallery .gallery-item img { border:none !important;} @media (max-width:767px){ .gallery-limit { width:calc(100%);} .gallery-limit .gallery { flex-wrap: wrap;} .gallery-limit .gallery .gallery-item { width:auto !important; max-width:33%;} } .team_member .flexPanel p { font-size:16px;} .half { max-width:50%;} .thirds { max-width:33.333%;} .fourths { max-width:25%;} .fifths { max-width:20%;} .the-content-container p a:not(.button), .page-panel p a:not(.button) { text-decoration: underline;} footer.page-panel p a:not(.button) { text-decoration: underline;display: block;width: 128px;} footer.page-panel p a img { margin-bottom:0px;} footer.page-panel p a { transition:.25s all ease-in-out;} footer.page-panel p a:hover { transition:.25s all ease-in-out; transform:scale(104%);} .page-panel p a:not(.button):hover { color:var(--gold);} .slider_pane { width:100%; overflow: hidden; border-radius: 0px;} .slider_pane img, .slider_pane video { height:100%; width: 100%; object-fit: cover; position: relative; z-index: 1;} .slider_pane .pane { position:absolute; top:0; left:0; z-index: 3; width:100%; height:100%;} /*.slider_pane .pane::before { height:100%; width: 100%; top:0; left:0; content: ''; background:var(--wine); opacity:.4; position: absolute; z-index: 3;} */ @media (max-height:800px){ .slider_pane .pane::after { top:38%} } @media (max-width:480px){ .slider_pane .pane::after { top:30%; height:56%;} } .slider, .slick-list, .slick-track, .slider_pane {height:calc(100vh - 0px);} @media (max-width:990px){ .slider, .slick-list, .slick-track, .slider_pane {height:calc(96vh - 0px);} .slick-slider .slick-list { overflow: visible;} } .slider_pane .pageinner { height: 100vh; } @media (max-width:1200px){ .sliders .slider_pane, .sliders .slider_pane .pageinner, .slider-absolute, .slider-absolute .slider, .slider-absolute .slick-list, .slider-absolute .slick-track, .slider-absolute .slider_pane { height:130vh;} } @media (max-width:767px){ .sliders .slider_pane, .sliders .slider_pane .pageinner{ height:130vh;} .slider-absolute, .slider-absolute .slick-list, .slider-absolute .slick-track, .slider-absolute .slider_pane { height:80vh;} .imageOnlyRotation .textbox { margin-top:30vh;} } @media (max-width:480px){ .sliders .slider_pane, .sliders .slider_pane .pageinner{ height:135vh;} } @media (max-width:359px){ .sliders .slider_pane, .sliders .slider_pane .pageinner{ height:150vh;} } .slider-absolute img { height: 100%; width: 100%; object-fit: cover; position: absolute; top: 0; left: 0; display: block; } .slick-prev, .slick-next {position: absolute;bottom: 0px;right: 0px;border: 1px solid #979797;height: 7vh;width: 7vh;background-color: #fff;text-indent: -9999px;overflow: hidden;background-image: url(/wp-content/themes/st_francis/images/chevron-right.svg);background-repeat: no-repeat;background-position: center;background-size: 14px; z-index: 4; transition: .25s all ease-in-out;} .slick-prev:hover, .slick-next:hover { background-size:17px; background-color:#055170; border-color:#055170; transition: .25s all ease-in-out;} @media (max-width:640px){ .slick-prev, .slick-next { background-size:10px;} .slick-prev:hover, .slick-next:hover { background-size:12px;} } .slick-prev { right:calc(7vh - 1px); background-image: url(/wp-content/themes/st_francis/images/chevron-left.svg);} header#header { display: grid; place-items: center; height: calc(100vh - 105px);} .slider-container {display: grid; place-content: center; overflow: hidden; position: relative; width: 100%;} .slider-image-container { width:100%; height: calc(100vh - 105px); min-width: 100vw; } .slider-image-container::before, .slider-image-container::after { content:''; position:absolute; top:0; left:0; width:100%; height:100%; z-index: 2; background: rgb(30,28,30);} .slider-image-container::after { background: rgb(49,42,64); background: -moz-radial-gradient(circle, rgba(49,42,64,0) 0%, rgba(42,39,45,.5) 100%); background: -webkit-radial-gradient(circle, rgba(49,42,64,0) 0%, rgba(42,39,45,.5) 100%); background: radial-gradient(circle, rgba(49,42,64,0) 0%, rgba(42,39,45,.5) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#312a40",endColorstr="#2a272d",GradientType=1); } .slider-container img { display:block; max-width: 100vw; width: 100vw; height: 100%; object-fit: cover; object-position: left; border: none; box-shadow: none; border-radius: 0;} .slider-container .before-container { position:absolute; inset:0; width:var(--position);z-index: 2; overflow: hidden;} .slider-container img.image-before { } .slider-container img.image-after { position: absolute;left: 0;z-index: 1;} .slider-handle { position: absolute; inset: 0; cursor: pointer; width: 100%; height: 100%; opacity: 0; z-index: 444; } .slider-handle:focus-visible ~ .slider-button { outline:5px solid #000; outline-offset:3px;} .slider-button { position:absolute; z-index: 11; padding: 8px; border-radius: 100vw; display: grid; place-items:center;height: 50px; width: 50px;transform: translateX(-50%);left: var(--position); bottom: 10vh; pointer-events: none;} .slider-image-container img { left:unset;object-position: center;} .masthead-content { position:absolute; display: flex; transform: translateX(-50%) translateY(-50%); top:50%; left:50%; max-width: 1520px; width:calc(100% - 96px); margin: 0 auto; z-index: 5; align-items:center; justify-content: space-between; height:calc(100% - 44px);} .slider-logo { width: 100%; align-content: flex-start; height: unset; position: relative;} .slider-logo::before, .slider-logo::after { content: ''; width:calc(50% - 130px); height: 1px; position: absolute; top:68%; left:0; background: var(--white); opacity: .42;} .slider-logo::after { left:unset; right:0;} .slider-logo img { width:180px; height:auto; margin: 0 auto;} .slider-content { height:100%; text-align: right; align-content: center; width: 100%; background: radial-gradient(ellipse at center, rgba(0,0,0,.4), transparent 70%); } .slider-content *:not(h1) { text-align: center; max-width: 850px; margin: 40px auto 0; color: var(--white);} .slider-content p { text-align: center; max-width: 850px; margin: 40px auto 0; color: var(--white);} @media (min-width:768px){ .masthead-content { flex-direction:column;} } @media (max-width:1200px){ .slider-content p { margin: 20px auto 0;} } @media (max-width:767px){ .masthead-content { display: grid; transform: translateX(-50%); top: 24px; width:calc(100% - 48px); height:93%; justify-content: stretch; grid-template-rows: 1fr 54fr;} .slider-content { grid-area: 2 / 1 / 3 / 2; place-content: center;} .slider-logo { grid-area: 1 / 1 / 2 / 2; } .slider-button { bottom: 19vh;} .slider-content p { margin: 10px auto 0;} .slider-content :not(h1) { margin: 16px auto 0;} } .slider-handle::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 6px; height: 600px; background: white; cursor: pointer; } .slider-handle::-moz-range-thumb { width: 6px; height: 600px; background: white; cursor: pointer; } .navigationArea { position: absolute;bottom: 0px;width: 100%;background: none;margin-bottom: 0;text-align: center;left: 0;z-index: 2147483646; height:105px; } .navigation { position: absolute;bottom: 20px;width: 100%;margin-bottom: 0;text-align: center;left: 0;z-index: 2147483646; height:85px; transition: .25s all ease-in-out; background:#fff;-webkit-box-shadow: 1px 3px 5px -2px rgba(0,0,0,0);-moz-box-shadow: 1px 3px 5px -2px rgba(0,0,0,0);box-shadow: 1px 3px 5px -2px rgba(0,0,0,0);} .navigation.posts-navigation { background:transparent;} .navigationArea .logo { display:block; margin:-20px auto -20px;transition: .25s all ease-in-out; max-width: 250px; } .navigationArea.fixed { } .navigationArea.fixed .navigation { position: fixed; bottom: auto; top:0; left:0; transition: .5s all ease-in-out;-webkit-box-shadow: 1px 3px 5px -2px rgba(0,0,0,0.16);-moz-box-shadow: 1px 3px 5px -2px rgba(0,0,0,0.16);box-shadow: 1px 3px 5px -2px rgba(0,0,0,0.16);} .navigationArea.fixed .logo { margin:5px auto; width:129px; max-width: 129px; transition: .25s all ease-in-out;} @media (max-width:990px){ .navigationArea { height:0; margin-bottom: 0;} .navigation { height:0;} .navigationArea .logo { display: block; margin: 5px auto -20px 5px; transition: .25s all ease-in-out; max-width: 89px;} } .link-panel { display:flex; flex-wrap: wrap; gap:20px; position: relative; left: 0; width: calc(100% + 60px);} .link-panel a.button {} .link-content a { margin: 0 0 29px; } .page-setting .flexPanel .cell_12 > *:last-child { margin-bottom:0;} .page-panel:not(.flex-panel-outer).add-top-border::before { content:''; position: absolute; top:0; left: 0; width: 100%; height: 1px; background-color:var(--wine); opacity: .5;} .page-panel:not(.flex-panel-outer).add-bottom-border::after { content:''; position: absolute; bottom:0; left: 0; width: 100%; height: 1px; background-color:var(--wine); opacity: .5;} .page-panel.flex-panel-outer.add-top-border-flex .pageinner::before { content:''; position: absolute; top:-100px; left: 0; width: 100%; height: 1px; background-color:var(--wine); opacity: .5;} .page-panel.flex-panel-outer.add-bottom-border-flex .pageinner::after { content:''; position: absolute; bottom:-100px; left: 0; width: 100%; height: 1px; background-color:var(--wine); opacity: .5;} @media (max-width:990px){ .page-panel.flex-panel-outer.add-top-border-flex .pageinner::before { top:-50px;} .page-panel.flex-panel-outer.add-top-border-flex .pageinner::after { bottom:-50px;} } .card.cell_12.icon-item hr { margin-bottom:60px} @media (max-width:990px){ .card.cell_12.icon-item hr { margin:0 0 30px} } .map-panel { position:relative; width: 100%; height: auto; padding-bottom:89.7226753670473%; } .map-panel img { position:absolute; top:0; left:0; width: 100%; height: auto;opacity:1; transition: .25s all ease-in-out; } .map-panel img.halftone { opacity:.5; transition: .25s all ease-in-out; filter:grayscale(25%);} .map-panel img.on { filter:brightness(110%) saturate(110%); transition: .25s all ease-in-out;} .flexUL { flex-wrap: wrap;} .flexUL ul { margin-top:0; margin-bottom:0;} .videoWrapper { position: relative; padding-bottom: 51.25%; /* 16:9 */ padding-top: 25px; height: 0; } .videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .icon-item h4 { margin-bottom:20px;} .page-setting .flexPanel table { width:100%; max-width:1280px;} .page-setting .flexPanel table th, .page-setting .flexPanel table td { text-align:left; padding:14px 14px 14px 9px;} .page-setting .flexPanel table td { border-top:1px solid var(--grey); } .page-setting .flexPanel table tr:nth-child(2n) td { background:#f8f8f8;} .forminator-description {padding: 10px 0;display: inline-block;} .gallery-item { width:100% !important; position: relative;} .gallery-item a { display:block; border: 10px solid #FFFFFF; box-shadow: 1px 3px 8px 0 rgba(0,0,0,0.07); position: relative; transition:.25s opacity ease-in-out, .25s transform ease-in-out;} .gallery-item a:hover { transform:scale(101%);} .gallery-item:nth-child(4n-3) { width:44% !important;} .gallery-item:nth-child(4n-2) { width:67% !important; left:33%; margin-top:-250px !important;} .gallery-item:nth-child(4n-1) { margin-top:-150px !important; width:55% !important; left:5%;} .gallery-item:nth-child(4n) { margin-top:-200px !important; width:44% !important; left:22%;} @media (max-width:1350px) { .gallery-item:nth-child(4n-2) { left:41%; margin-top:-180px !important;} .gallery-item:nth-child(4n-1) { margin-top:-80px !important; } } @media (max-width:1100px) { .cell_9.parallax-gallery { width:100%;} .gallery-item:nth-child(4n-2) { left:33%;} } @media (max-width:990px) { .gallery-item:nth-child(4n-2) { left:41%; margin-top:-80px !important; width:59% !important} .gallery-item:nth-child(4n-1) { margin-top:-30px !important; left: 15%;} } @media (max-width:640px) { .gallery-item:nth-child(4n-3) { width:83% !important;} .gallery-item:nth-child(4n-2) { width:89% !important;margin-top:-50px !important; left:11%;} .gallery-item:nth-child(4n-1) { width:77% !important;margin-top:-30px !important; left:7%;} .gallery-item:nth-child(4n) { width:74% !important;margin-top:20px !important;} } .gallery-item a img { margin:0; border: none !important; display: block;} .gallery-png-1 .gallery-item:nth-child(1) a { border:none; box-shadow:none;} .gallery-png-2 .gallery-item:nth-child(2) a { border:none; box-shadow:none;} .gallery-png-3 .gallery-item:nth-child(3) a { border:none; box-shadow:none;} .gallery-png-4 .gallery-item:nth-child(4) a { border:none; box-shadow:none;} .left-2 .gallery-item:nth-child(4n-3) { width:89% !important; margin-left:11%;} .left-2 .gallery-item:nth-child(4n-2) { width: 79% !important; left: 0%; margin-top: -60px !important;} .left-2 .gallery-item:nth-child(4n-1) { margin-top: -80px !important; width: 125% !important; left:43%;} .left-2 .gallery-item:nth-child(4n) { margin-top:-60px !important; width:44% !important; left:22%;} @media (max-width:990px) { .left-2 .gallery-item:nth-child(4n-3) { width:89% !important; left:11%;} .left-2 .gallery-item:nth-child(4n-2) { left:-12px; margin-top:-30px !important;} .left-2 .gallery-item:nth-child(4n-1) { width:72% !important; margin-top: -60px !important;} .left-2 .gallery-item:nth-child(4n) { width:68% !important; left:5%;} } .left-3 .gallery-item:nth-child(4n-3) { width:89% !important; margin-left:11%;} .left-3 .gallery-item:nth-child(4n-2) { width: 79% !important; left: 0%; margin-top: -60px !important;} .left-3 .gallery-item:nth-child(4n-1) { margin-top: -80px !important; width: 67% !important; left: unset; left: 43%;} .left-3 .gallery-item:nth-child(4n) { margin-top:-60px !important; width:44% !important; left:22%;} @media (max-width:990px) { .left-3 .gallery-item:nth-child(4n-3) { width:89% !important; left:11%;} .left-3 .gallery-item:nth-child(4n-2) { left:-12px; margin-top:-30px !important;} .left-3 .gallery-item:nth-child(4n-1) { width:72% !important; left:calc(28% + 12px); margin-top: -60px !important;} .left-3 .gallery-item:nth-child(4n) { width:68% !important; left:5%;} } .center-1 .gallery-item:nth-child(4n-3) { width:100% !important;} .center-1 .gallery-item:nth-child(4n-2) { width: 43% !important; left: -17%; margin-top: -160px !important;} .center-1 .gallery-item:nth-child(4n-1) { margin-top: -180px !important; width: 67% !important; left: unset; left: 43%;} .center-1 .gallery-item:nth-child(4n) { margin-top:-200px !important; width:44% !important; left:22%;} @media (max-width:990px) { .center-1 .gallery-item:nth-child(4n-3) { width:89% !important; left:11%;} .center-1 .gallery-item:nth-child(4n-2) { width:55% !important; left:-12px; margin-top:-60px !important;} .center-1 .gallery-item:nth-child(4n-1) { width:72% !important; left:calc(28% + 12px); margin-top: -60px !important;} .center-1 .gallery-item:nth-child(4n) { width:68% !important; left:5%;} } @media (max-width:640px) { .center-1 .gallery-item:nth-child(4n-2) { width:75% !important;} } .right-1 .gallery-item:nth-child(4n-3) { width:90% !important; left:10%;} .right-1 .gallery-item:nth-child(4n-2) { margin-top: -80px !important; width: 67% !important; left: unset; left: 43%;} .right-1 .gallery-item:nth-child(4n-1) { width: 40% !important; left: 5%; margin-top: -160px !important;} .right-1 .gallery-item:nth-child(4n) { margin-top:-200px !important; width:44% !important; left:22%;} @media (max-width:990px) { .right-1 .gallery-item:nth-child(4n-3) { width:85% !important; left:15%;} .right-1 .gallery-item:nth-child(4n-2) { width:55% !important; left:-12px; margin-top:-60px !important;} .right-1 .gallery-item:nth-child(4n-1) { width:72% !important; left:calc(28% + 12px); margin-top: -60px !important;} .right-1 .gallery-item:nth-child(4n) { width:68% !important; left:5%;} } @media (max-width:640px) { .center-1 .gallery-item:nth-child(4n-2) { width:75% !important;} } .right-2 .gallery-item:nth-child(4n-3) { width:55% !important; left:45%;} .right-2 .gallery-item:nth-child(4n-2) { margin-top: -180px !important; width: 50% !important; left: unset; left: 7%;} .right-2 .gallery-item:nth-child(4n-1) { width: 40% !important; left: 5%; margin-top: -160px !important;} .right-2 .gallery-item:nth-child(4n) { margin-top:-200px !important; width:44% !important; left:22%;} @media (max-width:990px) { .right-2 .gallery-item:nth-child(4n-3) { width:85% !important; left:15%;} .right-2 .gallery-item:nth-child(4n-2) { width:55% !important; left:-12px; margin-top:-60px !important;} .right-2 .gallery-item:nth-child(4n-1) { width:72% !important; left:calc(28% + 12px); margin-top: -60px !important;} .right-2 .gallery-item:nth-child(4n) { width:68% !important; left:5%;} } @media (max-width:640px) { .center-1 .gallery-item:nth-child(4n-2) { width:75% !important;} } @media (max-width:640px) { .left-1 .gallery-columns-1 .gallery-item:nth-child(4n-3), .left-2 .gallery-columns-1 .gallery-item:nth-child(4n-3), .left-3 .gallery-columns-1 .gallery-item:nth-child(4n-3), .center-1 .gallery-columns-1 .gallery-item:nth-child(4n-3), .center-2 .gallery-columns-1 .gallery-item:nth-child(4n-3), .center-3 .gallery-columns-1 .gallery-item:nth-child(4n-3), .right-1 .gallery-columns-1 .gallery-item:nth-child(4n-3), .right-2 .gallery-columns-1 .gallery-item:nth-child(4n-3), .right-3 .gallery-columns-1 .gallery-item:nth-child(4n-3) { width: 100% !important; left: 0 !important; margin: 0;} } a.read-more.button { position:absolute; bottom: 35px; left: 0;} .flexPanel article.cell_4, .further-reading .cell_4, .portfolio-container .cell_4 { padding-bottom:105px; position: relative;} .tribe-events *, .tribe-override *:not(.button) { letter-spacing: 0 !important; } .tribe-events a.button, .tribe-override a.button { letter-spacing: 5px !important; } .tribe-events *, .tribe-override * { font-family: var(--sans) !important; } .tribe-override .tribe-events-single-event-title, .tribe-override .tribe-events-notices li, .tribe-override .tribe-events-notices ul, .tribe-override .tribe-events-single-event-title { color:var(--wine); line-height: 2.25;} #tribe-events-pg-template.tribe-override {margin: 0 auto;max-width: 1320px;margin-top: 100px;} .tribe-override .tribe-events-schedule h2 { color:var(--wine); font-size:22px; font-weight: 300;} .tribe-override .tribe-events-content p { color:var(--wine);} .tribe-events-back { display:none;} .event_color_panel.tealfade { position: relative;} .event_color_panel.tealfade .tealbg { height: 100%; padding:30px;} .tribe-override .meta_top { width: 100%; min-height: 150px; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center; background: var(--olive); padding: 30px; margin-bottom: 30px; } @media (max-width:990px){ .tribe-override .meta_top { padding:24px;} #tribe-events-pg-template.tribe-override {margin: 0 auto;max-width: 1320px;margin-top: 0px;} .tribe_events.type-tribe_events .flexPanel h2.entry-title { display:none;} .tribe_events.type-tribe_events .flexPanel h2.entry-title { display:none;} } .tribe-events-single > .tribe_events > :not(.primary), .tribe-events-single > .tribe_events > :not(.secondary), .tribe-events-single > .tribe_events > :not(.tribe-events-related-events-title), .tribe-events-single > .tribe_events > :not(.tribe-related-events) { width: inherit !important;} .news-items .meta_top .month, .tribe-override .meta_top .month { display: block; font-weight: 600 !important; letter-spacing: 15px !important; font-size: 28px; text-transform: uppercase; width: 100%; color: var(--white); text-align: left; } .news-items .meta_top .day, .tribe-override .meta_top .day { display: block; font-weight: 900 !important; font-size: 82px; line-height: .75; text-transform: uppercase; width: 100%; color: var(--white); text-align: left; margin-top: 24px; } .news-items .meta_top .year, .tribe-override .meta_top h5.year { display: block; font-weight: 600 !important; letter-spacing: 44px !important; font-size: 18px; text-transform: uppercase; width: 100%; text-align: left; line-height: 1; margin: 20px 8px 0; padding-left: 0; color: var(--white); } .tribe-override .meta_middle {text-transform: uppercase;letter-spacing: 4px !important;text-align: left;margin-top: 0;margin-bottom: 30px;font-size: 14px;padding-left: 0;display: block;padding-top: 10px;} .tribe-override .meta_bottom { padding:5px 0px;} .tribe-override .meta_phone { margin:0 0 25px;} .tribe-override h5 { color: var(--wine); font-weight: 900; font-size: 30px; line-height: 1; margin-bottom: 20px; } .tribe-override .tribe-address { margin: 0 0 25px; display: block; line-height: 1.5; } .tribe-override .tribe-events-event-meta::before { display:none;} .tribe-override .tribe-events-meta-group-organizer { padding-top:20px; border-top:1px solid rgba(255,255,255,.25); margin-right: 0;} .tribe-override .tribe-events-c-subscribe-dropdown__container { margin-bottom:0;} .tribe-override button.tribe-events-c-subscribe-dropdown__button-text::after { display:none;} .tribe-events-calendar-list * { color:var(--wine) !important;} .tribe-events-calendar-list a.button { color:var(--white) !important;} .tribe-common--breakpoint-medium.tribe-common .tribe-common-h4--min-medium {font-size: 44px!important; line-height: 1.25 !important;} .tribe-common--breakpoint-medium.tribe-common .tribe-common-h4--min-medium a { text-decoration: none; border: none;} .tribe-events-calendar-list__event-venue-title.tribe-common-b2--bold { display:block;} .tribe-events .tribe-events-calendar-list__month-separator::after { background:var(--wine) !important; opacity: .5;} .tribe-events .tribe-events-calendar-list-nav {border-top: 1px solid var(--wine) !important; opacity: .5;} .tribe-common--breakpoint-medium.tribe-common .tribe-common-h4--min-medium a {color: var(--teal) !important;line-height: 1.1em;display: block; transition:.25s all ease-in-out;text-decoration: none !important;} .tribe-common--breakpoint-medium.tribe-common .tribe-common-h4--min-medium a:hover { color:var(--verdi) !important; transition:.25s all ease-in-out;} .tribe-override .tribe-events-calendar-list__event-datetime-wrapper { margin: 20px 0; font-weight:600; letter-spacing: 2px; font-size: 14px; } .tribe-events-single > .tribe_events { overflow:visible;} .tribe-events-content a {border:none !important; color:var(--teal) !important; text-decoration: underline !important;} .tribe-events-content a:hover { color:var(--verdi) !important; } .tribe-override a {border:none !important; color:var(--teal) !important; text-decoration: underline !important;} .tribe-override a:hover { color:var(--verdi) !important; } .tribe-override .page-panel .cell_4 > a { text-decoration:none !important;} .tribe-override a.button { color:var(--white) !important; text-decoration: none !important;} .tribe-override #main-panel-1 { padding-top:0;} .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button.tribe-events-c-subscribe-dropdown__button--active, .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus, .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus-within, .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button.tribe-events-c-subscribe-dropdown__button--active, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus-within, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover { background-color: var(--wine); color: var(--white); } .tribe-common .tribe-common-c-btn-border, .tribe-common a.tribe-common-c-btn-border { background-color: var(--wine); border: 1px solid var(--white); border-radius: 0; text-align: center; } .single-tribe_events .tribe-events-c-subscribe-dropdown__export-icon, .tribe-block__events-link .tribe-events-c-subscribe-dropdown__export-icon { color: var(--white);} .single-tribe_events .tribe-common-c-btn-border:hover .tribe-events-c-subscribe-dropdown__export-icon, .tribe-block__events-link .tribe-common-c-btn-border:hover .tribe-events-c-subscribe-dropdown__export-icon, .single-tribe_events .tribe-common-c-btn-border:focus .tribe-events-c-subscribe-dropdown__export-icon, .tribe-block__events-link .tribe-common-c-btn-border:focus .tribe-events-c-subscribe-dropdown__export-icon { color: var(--white) !important; } .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button-text, .single-tribe_events .tribe-events-c-subscribe-dropdown button.tribe-events-c-subscribe-dropdown__button-text, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button-text, .tribe-events .tribe-events-c-subscribe-dropdown button.tribe-events-c-subscribe-dropdown__button-text { color: var(--white);} .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button-icon, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button-icon { stroke: var(--white); } .tribe-common button:focus, .tribe-common button:hover, .tribe-theme-twentyseventeen .tribe-common button:focus, .tribe-theme-twentyseventeen .tribe-common button:hover, .tribe-common-c-btn-border:focus button, .tribe-common-c-btn-border:hover button, .tribe-theme-twentyseventeen .tribe-common-c-btn-border:focus button, .tribe-theme-twentyseventeen .tribe-common-c-btn-border:hover button { color: var(--white) !important; } .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__list-item a, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__list-item a, .tribe-organizer-url a { text-decoration:none;} .is-style-stripes td { padding:10px; line-height: 1.25em; } .is-style-stripes td:first-child { width:300px;} @media (max-width:990px){ .is-style-stripes td:first-child { width:28%;} } .is-style-stripes td em { color:var(--olive);} .the-content-container h3, .the-content-container h4, .the-content-container h5, .the-content-container h6 { color:var(--wine); text-align: left;} .the-content-container p em { color: var(--olive); font-weight: 600; } .the-content-container h3 { margin-top:40px;} .the-content-container h4 { margin-top:40px; font-weight: 600;} .forminator-ui.forminator-design--default h2.forminator-title { font-weight: 500 !important;; margin-bottom: 0 !important; font-size: 23px !important;; color: var(--olive) !important;; letter-spacing: 3.62px !important;; line-height: 25px !important;; text-transform: uppercase !important;; text-align: left !important;; position: relative !important;;} @media (max-width:990px){ .forminator-ui.forminator-design--default h2.forminator-title { font-size: 28px !important;;line-height: 33px !important;} } .forminator-ui.forminator-design--default .forminator-button-submit:hover {width: auto !important;} .forminator-ui.forminator-design--default .forminator-input { background:#ebebeb !important; border:1px solid rgba(151,151,151,.16) !important;} .forminator-ui.forminator-design--default .forminator-input::placeholder {color: var(--wine) !important;} .forminator-ui.forminator-design--default .forminator-description, .forminator-ui.forminator-design--default .forminator-description p { font-size: 14px !important; } .footer-1 ul { display:flex; justify-content: space-between; align-items: flex-start; } .footer-1 ul li a { padding-left:44px; display:block; position: relative; } .footer-1 ul li a::before { width:32px; height: 44px; content:''; position: absolute; left:0; top:0px; background-position: center center; background-size: contain; background-repeat: no-repeat;} .footer-1 ul li.address a::before { background-image: url("/wp-content/themes/st_francis/images/icon-pin.svg"); top:2px;} .footer-1 ul li.telephone a::before { background-image: url("/wp-content/themes/st_francis/images/icon-phone.svg"); top:-4px;} .footer-1 ul li.facebook a { padding-left:54px;} .footer-1 ul li.facebook a::before { background-image: url("/wp-content/themes/st_francis/images/icon-facebook.svg"); width:40px; top:-2px} footer .footerFlex .footer-1 { display:flex; justify-content: space-between; gap:100px; align-items: center;} footer .footer-1 .widget_text { width: calc(100% - 450px);} .footer-1 .widget_media_image { max-width: 350px;} .footer-1 .widget_media_image a { display:block;} .footer-1 .widget_media_image img { margin:0; display: block;} @media (max-width:1350px){ footer .footerFlex .footer-1 { gap: 50px;} footer .footer-1 .widget_text { width: calc(100% - 400px);} } @media (max-width:990px){ .footer-1 .widget_media_image { width: 65%;} footer .footerFlex .footer-1 { flex-wrap: wrap; justify-content: center;} footer .footer-1 .widget_text { width:100%;} .footer-1 ul { flex-wrap: wrap; width: 300px;gap: 25px; margin: 0 auto;} } .navicon {position: absolute;left: -30px;width: 130px;height: 250px;top: -80px;} @media (max-width:990px){ .navicon {position: absolute;left: -10px;width: 80px;height: 130px;top: -170px;} } .navicon img { position: absolute; width: 100%; height: auto; top:50%; transform: translateY(-50%); right:0;} @media (max-width:1440px){ .desktop-nav.navmenu .pageinner { padding-left:40px;} } .header-icon { position:absolute; right:-150px; width:300px; height: 300px; top:-30px; z-index: 5;} @media (max-width:1200px){ .header-icon { right:-100px; width:200px; height: 200px; top:-20px; } } @media (max-width:767px){ .header-icon { right:-50px; width:100px; height: 100px; top:-10px;} } .floating-icon {position: absolute;bottom:0px; height: 240px; width:300px; z-index: 0; right: calc(50% + 524px);} .floating-icon img { margin-bottom: 0 !important; position: absolute; object-fit: contain; height: 100%; width: 100%; } .floating-icon.bottomright { right:unset; left: calc(50% + 524px);} .floating-icon.topleft { bottom: unset; top:0px; right: calc(50% + 664px);} .floating-icon.topright { right:unset; left: calc(50% + 544px); bottom: unset; top:0px;} .floating-icon.icon-stack { margin-top:-12px;} .floating-icon.outsidebottomleft {left: -3%; } .floating-icon.outsidebottomright {left: unset; right:-3%;} .floating-icon.big-flower img {max-height: unset;max-width: unset;width: 100%;height: 100%;} .floating-icon.outsidetopleft { bottom: unset; top:-100px; left:-3%;} .floating-icon.outsidetopright { left: unset; right:-3%; bottom: unset; top:-100px;} @media (max-width:1400px){ .floating-icon.topleft { bottom: unset; width: 140px; height: 100px;top:0px; right:calc(100% - 38px); left:unset;} } @media (max-width:1200px){ .floating-icon {bottom: 0px; left: 2%; max-height: 150px; max-width: 150px;} .floating-icon img { max-height:175px; min-height:100px; width:auto; margin-bottom: 0 !important;} .floating-icon.bottomright { right:2%;} .floating-icon.topleft { top:0px; right:calc(100% - 38px); left:unset;} .floating-icon.topright { right:2%; top:-75px;} .floating-icon.icon-stack { margin-top:-5px;} .floating-icon.outsidebottomleft {left: -2%; } .floating-icon.outsidebottomright { right:-2%;} .floating-icon.outsidetopleft { top:-75px; left:-2%;} .floating-icon.outsidetopright { right:-2%; top:-75px;} } @media (max-width:990px){ .floating-icon {bottom:0px; left: 2%; max-height: 120px; max-width: 120px;} .floating-icon img { max-height:125px; min-height:100px; width:auto; margin-bottom: 0 !important;} .floating-icon.bottomright { right:1.5%;} .floating-icon.topright { right:1.5%; } .floating-icon.topleft { right:-3%; } .floating-icon.icon-stack { margin-top:-7px;} .floating-icon.outsidebottomleft {left: -1.5%; } .floating-icon.outsidebottomright { right:-1.5%;} .floating-icon.outsidetopleft { left:-1.5%;} .floating-icon.outsidetopright { right:-1.5%;} } @media (max-width:640px){ .floating-icon {bottom: 0px; left: 2%; max-height: 90px; max-width: 90px;} } .floating-icon.big-flower { z-index: 1; left: calc(50% + 490px); right: unset; width: 373px; height: 430px; max-height: unset;} @media (max-width:1440px){ .floating-icon.big-flower { z-index: 1; right: -150px; left:unset; width: 323px; height: 430px; max-height: unset;} } @media (max-width:1200px){ .floating-icon.big-flower { z-index: 1; right: -40px; left:unset; width: 323px; height: 430px; max-height: unset;} } @media (max-width:990px){ .floating-icon.big-flower { display: none;} } .button.mobilenav-item { width: auto; height: auto; padding: 0 20px !important; line-height: 1.25em; display: flex !important; margin: 16px 0; font-size: 14px !important; } .make-a-divider { display:flex !important; align-content:center; align-items: center;} .make-a-divider img { margin:0 20px 0 -50px; width:270px;} .make-a-divider hr { margin:0 !important;} .make-a-divider.fern img { margin-left:-70px;} .make-a-divider.leaf img { max-width:180px; margin-left: -41px;} .make-a-divider.clef img { max-width:210px;} .team_member img { border-radius:12px;} @media (max-width:640px){ .half-width .card h2:first-child { padding-right:40%;} .half-width .card p:first-of-type { padding-right:20%;} } @media (max-width:500px){ .half-width .bg-panel { width: 70%;} .half-width .card h2:first-child { padding-right:25%;} .half-width .card p:first-of-type { padding-right:12.5%;} } .shortquote blockquote h3 {font-weight: 200; font-style: italic;font-size: 29px; color: var(--wine);line-height: 46px; letter-spacing: 0px; text-align: right; text-transform: none;} .shortquote blockquote h3 i, .shortquote blockquote h3 em {font-size: 66px; font-weight: 200; margin-right: 4px;} .shortquote blockquote h4 {font-weight: 200;font-style: normal;font-size: 24px; color: var(--wine);line-height: 46px; position: relative;display: inline-block;padding-left: 50px; margin-top:20px;} .shortquote blockquote h4::before {height: 1px;width: 45px;background: var(--wine);top: 28px; position: relative; margin-right: 10px;content: '';left: -60px;display: block;} .shortquote blockquote h3:first-of-type { text-align:left; margin-bottom:0;} .shortquote blockquote h3:last-of-type { margin-bottom:10px;} blockquote { margin-top:95px;} blockquote::before { content: ''; position: absolute;top: -70px; left: 210px; background-image: url("/wp-content/themes/st_francis/images/icon-leaves.svg"); background-repeat: no-repeat;background-size: contain; background-position: center;width: 190px;height: 190px;} .page-panel.panel-bg-image.full-width .shortquote blockquote h3::before { background-image: url("/wp-content/themes/st_francis/images/icon-leaves-light.svg"); } .shortquote blockquote::before { top: -119px;} .shortquote blockquote h3 { line-height:46px;} .shortquote blockquote h3 i, .shortquote blockquote h3 em {line-height:46px;} .shortquote blockquote h3:first-of-type { margin-bottom: 0; right: calc(100% - 190px); max-width: 260px; text-align: right; position: absolute; display: block; width: 100%; bottom: calc(100% - 32px); line-height: 42px; } .cell_12.shortquote blockquote h3:first-of-type { max-width:100%; right: 0%; text-align: center; position: relative;} .cell_12.shortquote blockquote h3 { right: 0%; text-align: center; max-width: 1050px; margin-left:auto; margin-right: auto;} .cell_12.shortquote blockquote h3 i, .cell_12.shortquote blockquote h3 em {display: block; line-height: 1em; margin-bottom: 9px;} .cell_12.shortquote blockquote::before { left:50%; transform:translateX(-50%);} .card:not(.shortquote) .card-content blockquote h2 { font-weight: 200; text-align: left; font-style: italic;} .card:not(.shortquote):not(.longquote) .card-content blockquote { padding-left: 0;} .card:not(.shortquote) .card-content blockquote::before { left: -70px; top:-110px; transform: rotate(-10deg);} .bg-solid .card-content.no-image *:first-child{ margin-top: 20px !important;} .longquote blockquote::before { content:none;} @media (max-width:1200px){ .shortquote blockquote h3 { font-size:23px; line-height: 35px;} .shortquote blockquote h3:first-of-type { line-height: 35px; bottom: calc(100% - 39px);} .shortquote blockquote h3 i, .shortquote blockquote h3 em { font-size:50px;} .shortquote blockquote h4 { font-size: 20px;} } @media (max-width:990px){ .shortquote blockquote:last-child { margin-bottom: 0; padding-bottom: 0;} .shortquote blockquote h3:first-of-type { max-width:100%; right: 0%; text-align: center; position: relative;} .shortquote blockquote h3 { right: 0%; text-align: center; max-width: 1050px; margin-left:auto; margin-right: auto;} .shortquote blockquote h3 i, .shortquote blockquote h3 em {display: block; line-height: 1em; margin-bottom: 9px;} .shortquote blockquote::before { left:50%; transform:translateX(-50%); width:140px; height: 140px;} .card:not(.shortquote) .card-content blockquote::before { width: 140px; height: 140px; left: -50px; top: -100px; transform: rotate(-10deg);} blockquote {padding: 20px 20px;} .shortquote .card-content > p:first-child { display:none;} .shortquote .card-content { padding: 0px;} } .forminator-ui .forminator-repeater-field { padding: 50px !important; background: var(--white) !important; box-shadow: 1px 3px 8px rgba(0,0,0,.1) !important; border-radius: 0 !important;} .forminator-field-section .forminator-field { display:flex; flex-wrap: wrap; flex-direction: column-reverse;} @media (max-width:990px){ .forminator-ui .forminator-repeater-field { padding: 37px !important;} } .forminator-ui.forminator-design--default .forminator-input, .forminator-ui.forminator-design--default .forminator-select, .forminator-ui.forminator-design--default .forminator-select .selection span, .forminator-ui.forminator-design--default .forminator-textarea { color:var(--darkwine); text-transform: uppercase;letter-spacing: 2.29px; background: #ebebeb !important; } .forminator-ui .forminator-icon-chevron-down::before { content: "" !important; background:url("/wp-content/themes/st_francis/images/triangle.svg") no-repeat !important; background-size:contain !important; background-position: center !important; width: 14px; height: 14px; } .inline-checkbox-label .forminator-field { display:flex; flex-wrap: nowrap; gap:40px; align-items:center;} .inline-checkbox-label .forminator-field .forminator-description { font-weight: 300; font-style: italic; font-size: 16px;letter-spacing: 2.29px; text-transform: uppercase; line-height: 1.25em; margin: 0 !important;} @media (max-width:990px){ .inline-checkbox-label .forminator-field { flex-wrap: wrap; gap:20px;} .forminator-ui.forminator-custom-form .forminator-description {padding-bottom: 0 !important;} } label.forminator-checkbox {margin: 0 !important;} label.forminator-checkbox .forminator-checkbox-label {font-weight:500 !important; text-transform: uppercase; font-size: 16px; letter-spacing: 2.29px;} .forminator-ui.forminator-design--default .forminator-select .selection > span { border: 1px solid rgba(151, 151, 151, 0.16) !important;} .forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box { width: 44px !important; height: 44px !important; flex: unset !important; background:#ebebeb !important; border-radius: 0 !important; border: 1px solid rgba(151, 151, 151, 0.16) !important; } .forminator-ui.forminator-custom-form .forminator-checkbox.forminator-is_checked .forminator-checkbox-box { border: 1px solid var(--olive) !important;} .forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box::before { content: "" !important; color: var(--white) !important; background:var(--olive) !important; background-image: url("/wp-content/themes/st_francis/images/icon-checkmark.svg") !important; background-position: center center !important; background-size: 80% auto !important; background-repeat: no-repeat !important; height:100%; width:100%; } .forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box ~ span { width: calc(100% - 54px) !important; } .forminator-field-html { margin-top:40px;} .forminator-row:nth-child(2) .forminator-field-html { margin-top:20px;} .forminator-field-html .forminator-field { padding-bottom:5px !important; border-bottom:1px solid var(--wine32) !important;} .forminator-field-html h5 { font-weight: 300; font-style: italic; font-size: 16px; color: var(--teal) !important; letter-spacing: 2.29px; text-transform: uppercase; padding-bottom:10px;} .forminator-field-html h4 { font-weight: 400; font-style: italic; font-size: 28px; color: var(--wine) !important; text-transform: none; letter-spacing: 0px; line-height: 1.125em;} .forminator-field-checkbox:not(.inline-checkbox-label) .forminator-field { display:flex; flex-wrap: wrap; gap:24px;} .forminator-field-checkbox:not(.inline-checkbox-label) .forminator-field label { width:calc(50% - 12px);} .forminator-field.forminator-custom-input { width:100% !important;} @media (max-width:990px){ .forminator-field-checkbox:not(.inline-checkbox-label) .forminator-field {gap: 20px;} .forminator-field-checkbox:not(.inline-checkbox-label) .forminator-field label {width: 100%;} } .tribe-events-view { margin-top: 70px; } img.tribe-events-calendar-list__event-featured-image { box-shadow: 1px 3px 8px rgba(00,00,00,.1); border: 10px solid #fff; } .day-of-the-week { margin-top:20px; font-size:24px; display:block;} .tribe-events-event-categories-label { display:none;} .tribe-common--breakpoint-medium.tribe-common .tribe-common-h4--min-medium { font-size:30px !important; line-height: 1.25em !important;} .tribe-override .tribe-events-content ol, .tribe-override .tribe-events-content ul { margin:20px 40px; list-style-position: outside;} .tribe-override .tribe-events-content ol ol, .tribe-override .tribe-events-content ul ul { margin:8px 40px; } .tribe-override .tribe-events-content li { color: var(--wine); margin-bottom: 8px;} .masked-layer { mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); } @media (max-width:990px){ .panel-bg-image .pageinner { margin:0 50px; width:calc(100% - 100px);} } @media (max-width:990px){ .panel-bg-image .pageinner { margin:0 37px; width:calc(100% - 74px);} }