/* CUSTOM THEME FOR OMBU CAPITAL - December 2021 */ * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } /*.messages {display:none;}*/ *:focus { outline: none; } html, body { width: 100%; height:100%; font-family: 'Gothic A1', Arial, Helvetica; font-style: normal; font-weight: 300; color: #333333; /*scroll-behavior: smooth;*/ } .dialog-off-canvas-main-canvas, .layout-container { width: 100%; max-width: 100%; min-width: 100%; margin: 0 auto; padding: 0; } body { font-size: 20px; line-height: 26px; color: #333333; } h1, h2, h3, h4 { font-weight: 300; color: #333333; } p { font-size: 20px; line-height: 28px; color: #333333; } a { text-decoration: none; cursor: pointer!important; } /* ------------------ GENERAL ------------------ */ .dialog-off-canvas-main-canvas, .layout-container, header, .region-header, main, .layout-content, .node__content, .region-pagebottom, .region-footer { width: 100%; min-width: 100%; overflow: hidden; float: none; position: relative; } .path-frontpage #block-capital-page-title, .path-frontpage #block-capital-content { display: none; } .center, .view-home-about .views-field-view-node, #block-fundraising, #block-fundraising h2, #block-fundraising p, #block-homecontactlinkblock, #block-homecontactlinkblock h2, #block-homecontactlinkblock p, .field--type-datetime, #block-contactintro p { text-align: center; } .region-content { position: relative; } .region-content, #block-views-block-home-about-block-1, #block-fundraising, #block-homecontactlinkblock, .view-articles, .view-insights, .view-news { padding: 60px 10%; } .path-frontpage .region-content { padding: 60px 0; } #block-capital-page-title { width: 100%; position: relative; text-align: center; } .page-node-type-about .region-content, .page-node-type-page .region-content { padding: 60px 0 0 0; } .page-node-type-about #block-capital-content, .page-node-type-page #block-capital-content { padding: 0; } .page-node-type-about .field--name-field-tagline, .page-node-type-page .field--name-field-tagline { padding: 0 20%; } .page-node-type-about .field--name-body, .page-node-type-page .field--name-body { padding: 0 20% 60px 20%; text-align: center; } .page-node-type-about .field--name-body ul, .page-node-type-page .field--name-body ul { display: inline-block; text-align: left; margin: 0 auto; } /* -- CENTER TITLE WITH LINES EITHER SIDE -- */ .view-home-about .views-field-title a, #block-views-block-home-about-block-1 h2, #block-homecontactlinkblock h2, .page-node-type-about .page-title, .page-node-type-about .field--name-body h2, #block-fundraising h2, .page-node-type-page .page-title, .views-field-title a, .path-resources .page-title, .path-contact .page-title { font-size: 24px; line-height: 26px; text-align: center; text-transform: uppercase;} #block-views-block-home-about-block-1 h2, #block-fundraising h2, #block-homecontactlinkblock h2, .page-node-type-about .page-title, .page-node-type-page .page-title, .path-resources .page-title, .path-contact .page-title { padding: 0 20px; margin: 0 auto; text-align: center; position: relative; } #block-views-block-home-about-block-1 h2:before, #block-views-block-home-about-block-1 h2:after, #block-fundraising h2:before, #block-fundraising h2:after, #block-homecontactlinkblock h2:before, #block-homecontactlinkblock h2:after, .page-node-type-about .page-title:before, .page-node-type-about .page-title:after, .page-node-type-page .page-title:before, .page-node-type-page .page-title:after, .path-resources .page-title:before, .path-resources .page-title:after, .path-contact .page-title:before, .path-contact .page-title:after { display: inline-block; content: ""; width: 100px; margin: 0 20px; transform: translateY(-8px); } #block-views-block-home-about-block-1 h2:before, #block-views-block-home-about-block-1 h2:after, .page-node-type-about .page-title:before, .page-node-type-about .page-title:after, .page-node-type-page .page-title:before, .page-node-type-page .page-title:after, .path-resources .page-title:before, .path-resources .page-title:after, .path-contact .page-title:before, .path-contact .page-title:after { border-top: 1px solid #333333; } #block-fundraising h2:before, #block-fundraising h2:after, #block-homecontactlinkblock h2:before, #block-homecontactlinkblock h2:after { border-top: 1px solid #F0F0F0; } #block-fundraising, #block-fundraising h2, #block-fundraising p, #block-homecontactlinkblock, #block-homecontactlinkblock h2, #block-homecontactlinkblock p, .field--name-field-textbox h2, .field--name-field-textbox p { color: #F0F0F0; } #block-views-block-home-about-block-1 .view-home-about .views-field-body, .page-node-type-about h2, .page-node-type-about p, .page-node-type-page h2, .page-node-type-page p, .page-node-type-article .region-content h2, .page-node-type-article .region-content p, .page-node-type-insight .region-content h2, .page-node-type-insight .region-content p, .page-node-type-news .region-content h2, .page-node-type-news .region-content p, .view-resources .view-header p, .view-resources .view-empty p { text-align: center; } .button, .views-exposed-form li a { border: 1px solid #333333; padding: 10px 10px 8px 10px; color: #333333; text-transform: uppercase; text-align: center; } .button:hover, .views-exposed-form li a:hover { background: #333333; color: #F0F0F0; } .buttonwhite { border: 1px solid #F0F0F0; padding: 10px 10px 8px 10px; color: #F0F0F0; text-transform: uppercase; } .buttonwhite:hover { background: #F0F0F0; color: #0C2140; } .space { margin: 60px 0; } .wide { width: 20%; display: block; } .page-node-type-about .field--name-body h2, .page-node-type-page .field--name-body h2 { border-bottom: 1px solid #333333; margin-top: 60px; padding-bottom: 20px; } /* ------------------ TABS STYLING ------------------ */ ul.tabs.primary { margin: 0; padding: 20px 10% 0 10%; text-align: left; border-bottom: 1px solid #CCC; } ul.tabs.primary li a { border-top: 1px solid #CCC; border-right: 1px solid #CCC; border-left: 1px solid #CCC; border-top-left-radius: 8px; border-top-right-radius: 8px; background-color: #DEDEDE; transition: background-color 0.3s; font-size: 16px; color: #000000; } ul.tabs.primary li a:hover { background-color: #e9e9e9; color: #000000; } ul.tabs.primary li a.is-active { color: #000000; background-color: transparent; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9e9e9), color-stop(100%, rgba(233, 233, 233, 0))); background-image: -webkit-linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); background-image: -moz-linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); background-image: -o-linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); background-image: linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); } /* ------------------ HEADER ------------------ */ .path-frontpage header { background: url('../images/home-bg.jpg') no-repeat top center, #0C2140; background-size: cover; height: auto; overflow:visible!important; } header, .region-header { height: auto; overflow: visible!important; } .region-header { min-height: 210px; padding: 40px 6%; } .path-frontpage .scrollheader { width: 100%; height: auto; overflow: hidden; position: relative; background: url('../images/rain.png'); background-repeat: repeat-y; background-position: 0 0; background-size: 100% 50%; animation: slide 3s linear infinite; } @keyframes slide { 100% { background-position: 0 100%; } } #block-capital-branding { width: 20%; height: auto; overflow: hidden; float: left; } a.site-logo { height: 130px; display: block; } .site-logo img { width: auto; height: 100%; } /* ------------------ NAVIGATION ------------------ */ #block-mainnavigation { width: 70%; height: auto; overflow: visible; float: right; margin-top: 60px; } ul.sf-menu li { text-transform: lowercase; } ul.sf-menu li { float: left; margin: 0 5px!important; } ul.sf-menu a, ul.sf-menu span.nolink, ul.menu a.is-active { color: #F0F0F0; padding: 10px 20px; } ul.sf-menu span.menuparent { padding-right: 30px; } ul.sf-menu >li.active-trail.sf-depth-1 >a, ul.menu li.active-trail.sf-depth-1 >a, ul.menu ul li.sf-depth-2 a:hover, ul.menu li.active-trail.sf-depth-1 >span.menuparent.nolink { background-color: #577382; } ul.menu >li.sf-depth-1 >a:hover, ul.sf-menu >li.active-trail.sf-depth-1 >a:hover, span.menuparent.nolink:hover {background: #11203D;} ul.sf-menu ul li.sf-depth-2 a { display: inline-block; background: #11203D; padding: 10px; margin-bottom: 3px; } ul.sf-menu .sf-sub-indicator { right: 10px; height: 10px; width: 12px;} ul.sf-menu .sf-sub-indicator:after { font-size: 12px; } /* ------------------ HERO ------------------ */ #block-herotext { width: 100%; height: auto; overflow: hidden; clear: both; padding-top: 100px; } #block-herotext h1, #block-herotext p { text-align: center; color: #F0F0F0; } #block-herotext h1 { text-transform: uppercase; font-size: 60px; line-height: 60px } #block-herotext p { font-size: 40px; line-height: 48px } .arrow {width: 70px; height: 70px; background: url("../images/arrow-down.svg") no-repeat 0 0; background-size: contain; text-indent: -999999em; color: transparent; display: inline-block; overflow: hidden;} /* ------------------ HOME BLOCKS ------------------ */ #block-views-block-home-about-block-1 .view-header { text-align: center; margin-bottom: 100px; } #block-views-block-home-about-block-1 .field--name-field-tagline { margin-bottom: 60px; } .view-home-about .view-content{ display: flex; flex-wrap: wrap; } .view-home-about .views-row { display: flex; flex-direction: column; height: auto; overflow: hidden; float: left; margin-bottom: 2%; padding: 5%; position: relative; background: #F3F5F6; } #block-views-block-home-about-block-1 .view-home-about .views-row { width: 49%; } #block-views-block-home-about-block-2 .view-home-about .views-row { width: 32%; background: none; } #block-views-block-home-about-block-1 .view-home-about .views-row:nth-child(2n) { margin-left: 2%; } .views-field-field-icon { width: 50%; margin: 0 auto; } .view-home-about .views-field-title { text-align: center; text-transform: uppercase; border-bottom: 1px solid #333333; margin: 30px 0; padding: 12px 0 10px 0; } .view-home-about .views-field-title a, .views-field-title a { color: #333333; } .view-home-about .views-field-title:hover { background: #333333; } .view-home-about .views-field-title:hover a { color: #F0F0F0; } .views-field-body { margin-bottom: 40px; } #block-fundraising { background: url('../images/fundraising-bg.jpg') no-repeat top center, #0C2140; background-size: cover; } #block-homecontactlinkblock { background: url('../images/fcontact-bg.jpg') no-repeat top center, #0C2140; background-size: cover; margin-bottom: 10px; } /* -- RESOURCES -- */ .path-resources header { background: url('../images/resources-bg.jpg') no-repeat bottom center, #0C2140; background-size: cover; background-size: cover; } #block-views-block-articles-block-1, #block-views-block-articles-block-2, #block-views-block-insights-block-1, #block-views-block-insights-block-2, #block-views-block-news-block-1, #block-views-block-news-block-2 { position: relative; } #block-views-block-articles-block-1 h2, #block-views-block-insights-block-1 h2, #block-views-block-news-block-1 h2, #block-views-block-articles-block-2 h2, #block-views-block-insights-block-2 h2, #block-views-block-news-block-2 h2 { border-top: 1px solid #333333; border-bottom: 1px solid #333333; border-left: 1px solid #333333; text-transform: uppercase; margin-left: 27%; padding-left: 20px; } #block-views-block-articles-block-1 h2:before, #block-views-block-insights-block-1 h2:before, #block-views-block-news-block-1 h2:before, #block-views-block-articles-block-2 h2:before, #block-views-block-insights-block-2 h2:before, #block-views-block-news-block-2 h2:before { position: absolute; top: 0; left: 0; content: ""; width: 26%; height: 60px; overflow: hidden; } #block-views-block-articles-block-1 h2:before, #block-views-block-articles-block-2 h2:before { background: #C77024; border: 1px solid #C77024; } #block-views-block-insights-block-1 h2:before , #block-views-block-insights-block-2 h2:before { background: #7D8F3D; border: 1px solid #7D8F3D;} #block-views-block-news-block-1 h2:before, #block-views-block-news-block-2 h2:before { background: #736357; border: 1px solid #736357;} .view-articles .views-row , .view-insights .views-row, .view-news .views-row, .view-resources .views-row { width: 100%; height: auto; overflow: hidden; margin-bottom: 40px; } .view-articles .views-field-field-banner, .view-articles .views-field-body, .view-insights .views-field-field-banner, .view-insights .views-field-body, .view-news .views-field-field-banner, .view-news .views-field-body, .view-resources .views-field-field-banner, .view-resources .views-field-body { float: left; } .view-articles .views-field-field-banner, .view-insights .views-field-field-banner, .view-news .views-field-field-banner, .view-resources .views-field-field-banner { width: 20%; margin-right: 2%; } .view-articles .views-field-body, .view-insights .views-field-body, .view-news .views-field-body, .view-resources .views-field-body { width: 76%; } .view-articles .views-field-title, .view-insights .views-field-title, .view-news .views-field-title, .view-resources .views-field-title { margin-bottom: 10px; } .view-articles .views-field-date, .view-insights .views-field-date, .view-news .views-field-date, .view-resources .views-field-date { font-size: 16px; } .view-articles .views-field-text, .view-insights .views-field-text, .view-news .views-field-text, .view-resources .views-field-text { margin: 20px 0; } .view-articles .views-field-title:hover a { color: #C77024; } .view-insights .views-field-title:hover a { color: #7D8F3D; } .view-news .views-field-title:hover a { color: #736357; } .view-resources .views-field-title:hover a { color: #8FA3AD; } .view-filters ul { padding: 0; } .form-type-select, .bef-links, .bef-links ul { width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center;} .form-type-select { margin-bottom: 60px; } .views-exposed-form ul { list-style-type: none; } .views-exposed-form li { margin: 0 20px; } .views-exposed-form li a { width: 100%; display: block; color: #333333; text-align: center; } .views-exposed-form li:hover a { color: #F0F0F0; } .views-exposed-form li a#edit-type-1-all.bef-link--selected { background: #8FA3AD; border: 1px solid #8FA3AD; color: #F0F0F0; } .views-exposed-form li a#edit-type-1-article.bef-link--selected { background: #C77024; border: 1px solid #C77024; color: #F0F0F0; } .views-exposed-form li a#edit-type-1-insight.bef-link--selected { background: #7D8F3D; border: 1px solid #7D8F3D; color: #F0F0F0; } .views-exposed-form li a#edit-type-1-news.bef-link--selected { background: #736357; border: 1px solid #736357; color: #F0F0F0; } /* ------------------ ABOUT PAGES ------------------ */ .field--name-field-tagline p { font-size: 44px; line-height: 49px; text-transform: uppercase; margin: 60px 0 20px 0; } .field--name-field-textbox { margin-top: 40px; padding: 100px 20% 80px 20%; background: #1F3653; } .page-node-type-about .field--name-field-textbox h2 { font-size: 40px; line-height: 40px; text-align: center; text-transform: uppercase; font-size: 40px; border-bottom: 1px solid #F0F0F0; margin: 0; padding-bottom: 20px;} .field--name-field-textboxpic { width: 100%; height: 600px; display: block; position: relative; } .sector-wrapper { width: 100%; height: auto; position: relative; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; } .tech { background: url('../images/icon-tech.png') no-repeat top center; } .agri { background: url('../images/icon-agri.png') no-repeat top center; } .tourism { background: url('../images/icon-tourism.png') no-repeat top center; } .manufacture { background: url('../images/icon-manufacture.png') no-repeat top center; } .criterion { background: url('../images/icon-criterion.png') no-repeat top center; } .sector-icon { min-width: 100px; max-width: 30%; padding-top: 100px; margin: 0 20px; background-size: 100px 100px; } #block-views-block-home-about-block-2 { background: #F3F5F6; margin-bottom: 10px; padding: 60px 2%; } #block-views-block-home-about-block-2 h2 { text-transform: uppercase; padding-bottom: 20px; border-bottom: 1px solid #333333; } #block-views-block-home-about-block-2 .view-home-about .views-field-body { text-align: center; } #block-views-block-home-about-block-2 .view-home-about .views-row { margin: 0; padding-bottom: 1%; } /* ------------------ ARTICLE PAGES ------------------ */ .page-node-type-article .page-title, .page-node-type-insight .page-title { text-transform: uppercase; } .page-node-type-article .region-header, .page-node-type-insight .region-header, .page-node-type-news .region-header { background-blend-mode: multiply; } .field--type-datetime { margin-bottom: 80px; } /* ------------------ CONTACT ------------------ */ .path-contact header, #block-homecontactlinkblock { background: url('../images/contact-bg.jpg') no-repeat center center, #0C2140; background-size: cover; } #block-contactintro { margin-bottom: 60px; } #block-capital-content { padding: 0 10%;} #contact-message-feedback-form .form-item label { font-size: 16px; text-transform: uppercase; font-weight: 300; } #contact-message-feedback-form .button--primary {background: #7D8F3D; border: 1px solid #7D8F3D; color: #F0F0F0; } #edit-preview { background: #C77024; border: 1px solid #C77024; color: #F0F0F0; } #contact-message-feedback-form .button:hover {background: #333333; border: 1px solid #333333; } /* ------------------ FOOTER ------------------ */ .region-footer { padding: 60px 10%; background: #1F3653; } .region-footer p, .region-footer a { color: #F0F0F0; text-align: center; } .region-footer hr { border: 1px solid #325074; } .region-footer a:hover { color: #8FA3AD; } /* ------------------ ERROR PAGES ------------------ */ .page-node-type-error-page .field--name-body p { text-align: center; } .page-node-type-error-page .region-footer { background: #C77024; } .page-node-type-error-page .region-footer hr { border: 1px solid #e5944e; } /* ------------------ MAINTENANCE PAGE ------------------ */ body.maintenance-page .layout-container { background: #1F3653; } .head-box { width: 100%; height: auto; overflow: hidden; display: block; text-align: center; padding: 50px 10%; background: url('../images/home-bg.jpg') no-repeat top center; background-size: cover;} body.maintenance-page a.site-logo { height: 280px; height: 166px; } body.maintenance-page a.site-logo img { width: 280px; } body.maintenance-page, body.maintenance-page h1, body.maintenance-page p { text-align: center; font-family: 'Gothic A1', Arial, Helvetica; font-style: normal; font-weight: 300; } body.maintenance-page .body-box { padding: 50px 2%; background: #FFFFFF; } body.maintenance-page .body-box h1 {font-size: 30px; line-height: 36px; color: #333333; text-transform: uppercase; } body.maintenance-page .body-box p { color: #333333; } /* ------------------ USER PAGE ------------------ */ .path-user header { background: url('../images/home-bg.jpg') no-repeat center center, #0C2140; background-size: cover; } /*-------------------------------------------------------------------------------------*/ /*-------------------------------- MOBILE STYLING -------------------------------------*/ @media all and (max-width: 800px) { .region-header { padding: 0; } #block-mainnavigation { display: none; } #block-capital-branding { width: 100%; display: block; float: none; padding: 40px 10%; } #block-responsivemenumobileicon { width: 100%; background: #1F3653; } #block-herotext { padding: 40px 10%; } #block-herotext h1 { font-size: 40px; line-height: 42px; } #block-herotext p, .field--name-field-tagline p { font-size: 30px; line-height: 36px; } .region-content, #block-views-block-home-about-block-1, #block-fundraising, #block-homecontactlinkblock, .view-articles, .view-insights, .view-news, .field--name-field-textbox, .page-node-type-about .field--name-field-tagline, .page-node-type-about .field--name-body { padding: 40px 6%; } .sector-icon { min-width: 100px; max-width: 50%; #block-capital-content { padding: 0; } } @media all and (max-width: 480px) { #block-views-block-home-about-block-1 h2, #block-homecontactlinkblock h2, .page-node-type-about .page-title, .page-node-type-about .field--name-body h2, .page-node-type-about .field--name-field-textbox h2, #block-fundraising h2, .page-node-type-page .page-title, .path-resources .page-title, .path-contact .page-title { font-size: 18px; line-height: 20px; padding: 0; } #block-views-block-home-about-block-1 h2:before, #block-views-block-home-about-block-1 h2:after, #block-fundraising h2:before, #block-fundraising h2:after, #block-homecontactlinkblock h2:before, #block-homecontactlinkblock h2:after, .page-node-type-about .page-title:before, .page-node-type-about .page-title:after, .page-node-type-page .page-title:before, .page-node-type-page .page-title:after, .path-resources .page-title:before, .path-resources .page-title:after, .path-contact .page-title:before, .path-contact .page-title:after { display: inline-block; content: ""; width: 30px; margin: 0 10px; transform: translateY(-8px); } #block-views-block-home-about-block-1 .view-home-about .views-row, #block-views-block-home-about-block-2 .view-home-about .views-row { width: 100%; float: none; margin-bottom: 20px; } #block-views-block-home-about-block-2 .view-home-about .views-row { padding-bottom: 20px; } .view-articles .views-field-field-banner, .view-insights .views-field-field-banner, .view-news .views-field-field-banner, .view-resources .views-field-field-banner { width: 100%; margin: 0 0 20px 0; float: none; } .view-articles .views-field-body, .view-insights .views-field-body, .view-news .views-field-body, .view-resources .views-field-body, .wide { width: 100%; float: none; } #block-views-block-articles-block-1 h2, #block-views-block-insights-block-1 h2, #block-views-block-news-block-1 h2, #block-views-block-articles-block-2 h2, #block-views-block-insights-block-2 h2, #block-views-block-news-block-2 h2 { font-size: 26px; line-height: 28px; padding-top: 20px; height: 60px; } #block-views-block-articles-block-1 h2::before, #block-views-block-insights-block-1 h2::before, #block-views-block-news-block-1 h2::before, #block-views-block-articles-block-2 h2::before, #block-views-block-insights-block-2 h2::before, #block-views-block-news-block-2 h2::before { height: 58px; } .field--name-field-tagline p, .view-resources .view-header p { text-align: center; } .field--name-field-textboxpic { height: 300px; } .views-exposed-form li { width: 100%; height: 50px; margin-bottom: 20px; float: left; text-align: center; } }