/* Theme Name: FilmNorth Theme Description: Child Theme for Beaver Builder Version: 1.0.0 Author: Westwords Consulting Author URI: https://westwordsconsulting.com Template: bb-theme License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* Typography */ h1, h2 { font-family: 'Jost', sans-serif; font-optical-sizing: auto; } h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration: underline; } h1 { font-size: 5rem; font-weight: 600; line-height: 6rem; } h2 { font-size: 2.5rem; font-weight: 600; letter-spacing: 2px; line-height: 3rem; margin-top: 30px; text-transform: uppercase; } h3 { font-family: 'Montserrat', sans-serif; font-weight: 500; margin-top: 0; } /* .fl-module-heading h2.fl-heading .fl-heading-text { font-weight: 600; letter-spacing: 2px; text-transform: uppercase; } */ .fl-content a, .fl-col-content a { text-decoration: underline; } p { color: #231f20; font-family: 'Montserrat', sans-serif; font-optical-sizing: auto; font-size: 1.6rem; font-weight: 500; line-height: 2.5rem; } #sitemap ul { list-style-position: inside; } #sitemap ul .children { padding-top: 10px; padding-left: 15px; } #sitemap li { display: list-item; list-style-type: disc; } .fl-screen-reader-text { background-color: black !important; color: white !important; } #post-content li { line-height: 2.5rem; } /* Modules */ .fl-button-wrap a.fl-button, input[type="submit"] { background-color: #c3002f; border: 1px solid transparent; border-radius: 10px; color: white; font-family: 'Jost', sans-serif; font-optical-sizing: auto; font-size: 18px; font-weight: 700; letter-spacing: 2px; outline: 1px solid transparent; text-transform: uppercase; } .fl-button-wrap a.fl-button span { color: white; } .fl-button-wrap a.fl-button:hover, #home-announcement a:hover, input[type="submit"]:hover { background-color: #c3002f; border: 1px solid white; outline: 1px solid #c3002f; } .fl-button-wrap a.fl-button:focus, #home-announcement a:focus, input[type="submit"]:focus { border: 3px solid white; outline: 2px solid black; } .fl-button-wrap a.fl-button:focus span { color: white; } .fl-button-wrap a.fl-button:active, #home-announcement a:active, input[type="submit"]:active { background-color: #3a3a3a; border: 1px solid #3a3a3a; color: white; outline: 1px solid black; } .fl-button-wrap a.fl-button:active span { color: white; } .form-accordion .fl-accordion { background-color: #c3002f; border-radius: 10px; } .form-accordion .fl-accordion a { color: white; } .form-accordion .fl-accordion .fl-accordion-item { border: none; } .form-accordion .fl-accordion a { color: white; font-family: 'Jost', sans-serif; font-size: 2rem; font-weight: bold; letter-spacing: 2px; text-decoration: none; text-transform: uppercase; } .form-accordion .fl-accordion-button-icon-left, .fl-accordion-button-icon-right { opacity: 1; } .form-accordion button:hover { border: 1px solid #c3002f; outline: 1px solid black; } .fl-page-content .alignleft { margin: 5px 20px 0 0; } .fl-page-content .alignright { margin: 5px 0 0 20px; } /* Layouts */ .fl-row-fixed-width { max-width: 1200px; } .fl-page { background-color: white; } .fn-logo-bg { background-color: #3a3a3a; background-image: url(img/filmnorth-logo-bg-left.png), url(img/filmnorth-logo-bg-right.png); background-position: right bottom 5rem, left top 5rem; background-repeat: no-repeat, no-repeat; background-size: 15%; } /* Tables */ table { margin-bottom: 20px; width: 100%; } table th { background-color: black; } table th, table td { padding: 10px; } table tr.header { border-radius: 10px 10px 0 0; } table tr td:nth-child(1) { width: 75%; } table tr td:nth-child(2) { width: 25%; } table tr:nth-child(odd) { background-color: #c3002f; color: white; } /* Home Page */ #home-announcement a { background-color: #c3002f; border: 1px solid transparent; border-radius: 5px; color: white; display: inline-block; padding: 5px 20px; margin-left: 15px; outline: 1px solid transparent; text-decoration: none; } #home-support, #home-news-signup, #home-support p { color: white; } /* Header */ header .fl-photo-content a { display: block; } header .fl-photo-content a:focus { border-radius: 10px; outline: 2px solid white; } /* Main Menu */ #menu-main-menu, #menu-main-menu-fiscally-sponsored-projects { font-family: 'Jost', sans-serif; font-optical-sizing: auto; text-transform: uppercase; } #menu-main-menu a, #menu-main-menu-fiscally-sponsored-projects a { font-weight: 700; padding: 15px; text-decoration: none; } #menu-main-menu a:focus, #menu-main-menu-fiscally-sponsored-projects a:focus, #menu-main-menu .fl-photo-content a, #menu-main-menu-fiscally-sponsored-projects .fl-photo-content a { border-radius: 10px; outline: 2px solid white; } #menu-main-menu a:hover, #menu-main-menu-fiscally-sponsored-projects a:hover { background-color: white; border-radius: 10px; color: #c3002f; } #menu-main-menu .current-menu-item a, #menu-main-menu-fiscally-sponsored-projects .current-menu-item a { text-decoration: underline; } #menu-main-menu .fl-menu-search-item .fl-button:hover .fl-button-icon::before, #menu-main-menu-fiscally-sponsored-projects .fl-menu-search-item .fl-button:hover .fl-button-icon::before { color: #c3002f; } #menu-main-menu .fl-menu-search-item .fl-button .fl-button-icon, #menu-main-menu-fiscally-sponsored-projects .fl-menu-search-item .fl-button .fl-button-icon { margin-right: 0; } /* Breadcrumbs */ .widget_breadcrumb_navxt h2 { display: none; } .breadcrumbs a, .breadcrumb-nav a { color: #c3002f; text-decoration: underline; } .breadcrumbs a:hover, .breadcrumb-nav a:hover { color: black; } .breadcrumb-container { padding-top: 40px; width: 1145px !important; } /* Sidebar Menu */ #sidebar nav a { background-color: #eeeeeeb2; border-left: 5px solid transparent; text-decoration: none; } #sidebar nav a:focus, #sidebar nav .sub-menu a:focus { outline: 2px solid #c3002f; } #sidebar nav a:hover, #sidebar nav .sub-menu a:hover { background-color: #c3002f; color: white; } #sidebar nav .sub-menu a:hover { background-image: url(img/submenu-icon-hover.png); } #sidebar nav .current-menu-item a { background-color: #DCDCDC; border-left: 5px solid #c3002f; } #sidebar nav .current-menu-item a:hover { background-color: #c3002f; } #sidebar nav .current-menu-item a { font-weight: bold; } #sidebar nav li:first-child a { border-radius: 0 10px 0 0; } #sidebar nav li:last-child a { border-radius: 0 0 10px 0; } #sidebar nav li:only-child a { border-radius: 0; } #sidebar nav .sub-menu li:first-child a, #sidebar nav .sub-menu li:last-child a { border-radius: 0; } #sidebar nav .current-menu-item .sub-menu a { border-left: 5px solid transparent; font-weight: normal; } #sidebar nav .sub-menu a { background: url(img/submenu-icon.png) no-repeat 15px 50% #eeeeeeb2; background-size: 10px; padding-left: 35px; } #sidebar nav .sub-menu li:first-child { border-top: 1px solid transparent; } #sidebar nav .menu-item { line-height: 2rem; } /* Heading Pill */ .heading-pill h3 { background-color: #c3002f; border-radius: 10px 10px 0 0; color: white; margin-bottom: 0; padding: 10px 20px 10px 20px; } .heading-pill p { background-color: black; border-radius: 0 0 10px 10px; color: white; padding: 10px 20px 10px 20px; } /* People */ .filmnorth-people .fl-post-column { margin-bottom: 20px; } .filmnorth-people .fl-post-feed-post { display: flex; padding-bottom: 30px; } .filmnorth-people .fl-post-image { flex: 0 0 30%; margin-bottom: 10px; } .filmnorth-people .fl-post-title { padding-bottom: 5px; } .filmnorth-people-list .fl-post-text { padding: 0 0 0 20px; } .filmnorth-people .person-title { font-style: italic; padding-bottom: 20px; } .filmnorth-people .person-title, .filmnorth-people .person-email { display: block; line-height: 1.5rem; } .filmnorth-people .staff_contact_info span { padding-bottom: 10px; } .filmnorth-people .staff_contact_info { padding: 15px 0; } .filmnorth-people .fl-post-image { position: relative; } .filmnorth-people .fl-post-image img { border-radius: 10px; width: 100%; height: auto; } .staff-pronouns { font-size: 1.5rem; text-transform: lowercase; } /* Instructors */ #instructors .pp-content-post, #instructors img { border-radius: 10px; } #instructors h3 { font-size: 1.5rem; line-height: 1.75rem; } #headshot img, .instructor-bio img { border: 1px solid black; border-radius: 10px; padding: 5px; } .instructor-bio { display: flex; } .classworkshop-instructor .fl-post-column { padding-bottom: 20px; } .classworkshop-instructor .fl-post-column:last-child { padding-bottom: 0; } .instructor-bio .fl-post-image { width: 30%; } .instructor-bio .fl-post-text { padding: 0 20px 20px 20px; width: 100%; } /* Classes & Workshops */ .classworkshop-instructor .fl-post-grid-post { border: 0; } #classworkshop-testimonials .classworkshop-student-testimonial { background-color: #eeeeeeb2; border-left: 5px solid #c3002f; padding: 20px; } .classworkshop-tuition-type { display: inline-block; margin-right: 20px; } .classworkshop-datetime, .classworkshop-location { display: inline-block; width: 100%; } .classworkshop-tuition-type-regular, .classworkshop-registration-deadline span:first-child, .classworkshop-ages span:first-child, .classworkshop-maximum-enrollment span:first-child { background: black; border-radius: 10px 0 0 10px; color: white; } .classworkshop-tuition-type-free { background: black; border-radius: 10px; color: white; padding: 10px; } .classworkshop-sessions, .classworkshop-location-name { background: black; border-radius: 10px 10px 0 0; color: white; } .classworkshop-tuition-type-regular, .classworkshop-registration-deadline span:first-child, .classworkshop-ages span:first-child, .classworkshop-maximum-enrollment span:first-child { display: inline-block; padding: 10px; } .classworkshop-sessions, .classworkshop-location-name { border: 1px solid black; border-radius: 10px 10px 0 0; display: block; font-size: 2.4rem; } .classworkshop-datetimespan, .classworkshop-location { display: block; font-size: 1.75rem; } .classworkshop-tuition-cost, .classworkshop-registration-deadline span:last-child, .classworkshop-ages span:last-child, .classworkshop-maximum-enrollment span:last-child { border-top: 1px solid black; border-right: 1px solid black; border-bottom: 1px solid black; border-left: 0; border-radius: 0 10px 10px 0; display: inline-block; padding: 10px; } .classworkshop-sessions, .classworkshop-location-name { display: block; padding: 10px 20px 3px 20px; } .classworkshop-datetimespan { border: 1px solid black; border-radius: 0 0 10px 10px; display: block; line-height: 3rem; padding: 20px; } .classworkshop-location-address { display: block; line-height: 3rem; padding: 20px; } .classworkshop-tuition-type-member { background: #c3002f; border-radius: 10px 0 0 10px; display: inline-block; padding: 10px; } .classworkshop-tuition-type-member a { color: white; text-decoration: underline; } .classworkshop-location-address a { text-decoration: underline; } .classworkshop-tuition-type-lowincome { background: #eeeeeeb2; border-radius: 10px 0 0 10px; display: inline-block; padding: 10px; } .classworkshop-categories ul { list-style-type: none; padding-left: 0; } .classworkshop-categories ul li { display: inline; } .classworkshop-categories ul li a { background-color: #c3002f; border-radius: 5px; color: white; margin-right: 10px; padding: 5px 10px; text-decoration: underline; } .classworkshop-categories ul li a:hover, .classworkshop-categories ul li a:focus, #classes-workshops-posts a:hover, #summer-youth-camps-posts a:hover, #sponsoredprojects-posts a:hover, #classes-workshops-posts a:focus, #summer-youth-camps-posts a:focus, #sponsoredprojects-posts a:focus { text-decoration: none; } .classworkshop-categories ul li a:hover, .classworkshop-categories ul li a:focus { color: white; } .classworkshop-tuition-type-regular, .classworkshop-tuition-type-member, .classworkshop-tuition-type-lowincome, .classworkshop-registration-deadline span:first-child, .classworkshop-ages span:first-child, .classworkshop-maximum-enrollment span:first-child { border-top: 1px solid black; border-right: 0; border-bottom: 1px solid black; border-left: 1px solid black; border-radius: 10px 0 0 10px; } #classes-workshops-posts .pp-content-grid-post-image, #summer-youth-camps-posts .pp-content-grid-post-image, #sponsoredprojects-posts .pp-content-grid-post-image { padding: 10px; } #classes-workshops-posts .pp-content-grid-post-meta-sep ul, #summer-youth-camps-posts .pp-content-grid-post-meta-sep ul, #sponsoredprojects-posts .pp-content-grid-post-meta-sep ul { list-style-type: none; padding-left: 0; } #classes-workshops-posts .pp-content-grid-post-image { padding-bottom: 0; position: relative; } #summer-youth-camps-posts .pp-content-grid-post-image, #sponsoredprojects-posts .pp-content-grid-post-image { position: relative; } #classes-workshops-posts .pp-content-grid-post-image .classworkshop-categories, #summer-youth-camps-posts .pp-content-grid-post-image .classworkshop-categories { position: absolute; bottom: 10px; right: 10px; } #classes-workshops-posts .pp-content-grid-post-text, #summer-youth-camps-posts .pp-content-grid-post-text, #sponsoredprojects-posts .pp-content-grid-post-text { padding-top: 0; } #classworkshop-locations .fl-post-feed-post { border-bottom: 0; margin-bottom: 0; } #classworkshop-locations .fl-post-feed { border-left: 1px solid black; border-right: 1px solid black; border-bottom: 1px solid black; border-radius: 0 0 10px 10px; } #classworkshop-locations .fl-post-feed-post:nth-child(2) .classworkshop-location { border-top: 1px solid black; } #classes-workshops-posts .pp-content-post, #summer-youth-camps-posts .pp-content-post, #sponsoredprojects-posts .pp-content-post, #classes-workshops-posts img, #summer-youth-camps-posts img, #sponsoredprojects-posts img, #classworkshop-featured-image img { border-radius: 10px; } .button-inactive { background-color: #3a3a3a; border-radius: 10px; color: white; display: inline-block; font-family: 'Jost', sans-serif; font-size: 2rem; font-weight: bold; letter-spacing: 2px; padding: 7px 24px; text-transform: uppercase; } #search-posts h2 { display: none; } #classes-workshops-posts .pp-content-grid-post-image, #summer-youth-camps-posts .pp-content-grid-post-image, #sponsoredprojects-posts .pp-content-grid-post-image { display: flex; flex-direction: column-reverse; justify-content: start; } #classes-workshops-posts .pp-content-grid-post-title { padding: 10px 10px 0 10px; } #classes-workshops-posts .pp-content-grid-post-title-archives { padding: 10px 0 0 0; } #summer-youth-camps-posts .pp-content-grid-post-title { padding: 0; } /* News */ #news-posts .fl-post-feed-post:first-child { padding-top: 0; } #news-posts .fl-post-feed-post { padding: 20px 0; } /* Footer */ footer a, footer .fl-icon-text a { text-decoration: underline; } footer a:hover, footer .fl-icon-text a:hover { text-decoration: none; } #home-news-signup h2 span, #home-news-signup .fl-rich-text p, .ctct-form-wrapper .ctct-label-top label { background: rgba(0,0,0,.75); padding: 5px 10px; } .ctct-form-wrapper .ctct-form abbr, .ctct_usage { display: none; } .ctct-form-wrapper .ctct-label-top label { display: inline-block !important; } /* New Window/Tab Warning */ .anww-external-link-icon::before { padding-left: 5px; } .anww-external-link-icon { display: inline-block; margin-top: -5px; padding-bottom: 5px; } /* The Events Calendar */ .tribe-common-l-container { padding-top: 0 !important; } .tribe-events a { text-decoration: underline !important; } .tribe-common .tribe-common-anchor-thin { transition: none !important; } .tribe-events a:hover { text-decoration: none !important; border-bottom: 0 !important; } #tribe-events-events-bar-keyword:focus, .tribe-common--breakpoint-medium.tribe-events .tribe-events-c-top-bar__today-button:focus, .tribe-events button.tribe-events-c-top-bar__datepicker-button:focus, .tribe-events-c-view-selector__list-item-link:focus, .tribe-common-c-btn-icon:focus, .tribe-events-c-nav__prev:focus, .tribe-events-c-nav__next:focus, .tribe-events-calendar-latest-past__event-title-link:focus { outline: 2px solid #c3002f !important; } .tribe-events .tribe-events-c-search__button, .tribe-events button.tribe-events-c-search__button { background-color: #c3002f !important; } .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, .tribe-events .datepicker .day.active, .tribe-events .datepicker .day.active.focused, .tribe-events .datepicker .day.active:focus, .tribe-events .datepicker .day.active:hover, .tribe-events .datepicker .month.active, .tribe-events .datepicker .month.active.focused, .tribe-events .datepicker .month.active:focus, .tribe-events .datepicker .month.active:hover, .tribe-events .datepicker .year.active, .tribe-events .datepicker .year.active.focused, .tribe-events .datepicker .year.active:focus, .tribe-events .datepicker .year.active:hover { background-color: #c3002f !important; color: white !important; } .tribe-common .tribe-common-c-btn-border { border: 1px solid #c3002f !important; } .tribe-events .tribe-events-c-search__button:hover, .tribe-events button.tribe-events-c-search__button:hover { background-color: #3a3a3a !important; } .tribe-events-c-subscribe-dropdown__button-text, .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, .tribe-common .tribe-common-c-svgicon--messages-not-found .tribe-common-c-svgicon__svg-stroke, .single-tribe_events .tribe-events-c-subscribe-dropdown__export-icon, .tribe-block__events-link .tribe-events-c-subscribe-dropdown__export-icon { color: #c3002f !important; } .tribe-events-c-subscribe-dropdown__button-text:focus, .tribe-events-c-subscribe-dropdown__button-text:hover, .single-tribe_events .tribe-events-c-subscribe-dropdown:focus .tribe-events-c-subscribe-dropdown__button-icon, .tribe-events .tribe-events-c-subscribe-dropdown:focus .tribe-events-c-subscribe-dropdown__button-icon, .single-tribe_events .tribe-events-c-subscribe-dropdown:hover .tribe-events-c-subscribe-dropdown__button-icon, .tribe-events .tribe-events-c-subscribe-dropdown:hover .tribe-events-c-subscribe-dropdown__button-icon, .tribe-events .tribe-events-c-subscribe-dropdown:focus .tribe-events-c-subscribe-dropdown__button-text, .tribe-events .tribe-events-c-subscribe-dropdown:hover .tribe-events-c-subscribe-dropdown__button-text { color: white !important; } /* News Signup */ .ctct-form-wrapper .ctct-label-top label { color: white !important; } .ctct-form-wrapper input::placeholder { color: black !important; } .ctct-form-wrapper .ctct-message { background: white !important; } @media only screen and (max-width: 1189px) { .fn-logo-bg { background-size: 30%; } } @media only screen and (max-width: 900px) { .instructor-bio .fl-post-text { width: 50%; } .instructor-bio { display: flex; } } @media only screen and (max-width: 768px) { .fl-search-form-input-wrap { width: auto !important; } } @media only screen and (max-width: 700px) { .instructor-bio .fl-post-image, .instructor-bio .fl-post-image img { width: 100%; } .instructor-bio .fl-post-text { padding: 20px 0; width: 100%; } .instructor-bio { display: block; } } @media only screen and (max-width: 500px) { .filmnorth-people .fl-post-feed-post { display: block; } .filmnorth-people .fl-post-text { padding: 0 0 30px 10px; } .filmnorth-people .fl-post-image { padding-bottom: 10px; } }