/* Happy little CSS file for Robert Gentile */
/**
* below is my attempt to use the default classes to style the various types
* of carousels. Almost all of the classnames below (except nav stuff) are
* applied at the individual slide level.
*
* My approach has not worked terribly well, so you can stick with
* to see if you have better results, or we can come up with specific
* classes for the various carousel types.
*
* Another handy note: Autoplay is turned OFF on the Eureka carousels,
* which makes it WAY easier to work on styling the slides.
*
*/
/* Fonts
----------------- */
/* hover color of all (I think) links */
.fl-page a:focus,
.fl-page a:hover {
color: #C13D1F;
}
/* set hover color of body (I think) links see above */
/* shouldn't need anymore 7/18
.fl-module-content a:hover,
.fl-module-content a:focus {
color: #c13d1f;
}
*/
/*
/* Text and photo carousels
----------------- */
.fl-slide-foreground { /* This works to posititon copy above images */
display: flex;
flex-direction: column-reverse;
}
.fl-slide-foreground .fl-slide-photo-wrap .fl-slide-photo { /* Should center images with text above */
margin-left: auto;
margin-right: auto;
margin-bottom: 0;
}
.fl-slide-text-center .fl-slide-content-wrap { /* left align copy */
text-align: left;
}
.fl-slide .fl-slide-foreground .fl-slide-content-wrap { /* adjust outer copy wrapper div */
width: 98%;
}
/* largeformat slider styles
------------------------------ */
.fl-module-content-slider.largeformat .fl-slide .fl-slide-foreground .fl-slide-content,
.fl-module-content-slider.largeformat .fl-slide .fl-slide-foreground .fl-slide-photo-wrap {
margin-right: 60px !important;
margin-left: 60px !important;
margin-top: 32px;
margin-bottom: 0;
}
/* when on blue background want font white */
.fl-builder-content .fl-module-content-slider.white .fl-slide .fl-slide-text,
.fl-builder-content .fl-module-content-slider.white .fl-slide .fl-slide-text * {
color: #fff;
}
/* END largeformat slider styles */
/* event slider styles
------------------------------ */
.fl-module-content-slider.events .fl-slide .fl-slide-foreground .fl-slide-content { /* Adjust inner copy wrapper div */
margin-right: 0px; /* no left right margin for events slider */
margin-left: 0px;
margin-top: 32px;
margin-bottom: 0;
}
/* no quotes */
.fl-module-content-slider.events.noquote .fl-slide-text:before,
.fl-module-content-slider.events.noquote .fl-slide-text:after {
content: none;
}
/* END event slider styles */
/* Testimonial slider styles
------------------------------ */
.fl-module-content-slider.testimonial .fl-slide .fl-slide-foreground .fl-slide-content {
margin-right: 50px;
margin-left: 50px;
margin-top: 32px;
margin-bottom: 0;
}
/* no quotes */
.fl-module-content-slider.testimonial.noquote .fl-slide .fl-slide-foreground .fl-slide-content {
margin-right: 50px;
margin-left: 50px;
}
@media only screen and ( min-width: 992px ) {
.fl-module-content-slider.testimonial.noquote .fl-slide .fl-slide-foreground .fl-slide-content {
margin-right: 0px;
margin-left: 0px;
}
}
.fl-module-content-slider.testimonial.noquote .fl-slide-text:before,
.fl-module-content-slider.testimonial.noquote .fl-slide-text:after {
content: none;
}
.fl-module-content-slider.testimonial.noquote .fl-slide-text {
padding: 0px; /* since no quotes display text wider */
}
.fl-module-content-slider.testimonial .fl-slide .fl-slide-foreground {
padding: 0px;
}
/* END testimonial slider styles */
.fl-content-slider .fl-content-slider-navigation { /* Position div w/ nav arrows */
left: 50%;
width: 100%;
transform: translateX(-50%);
}
.fl-slide-text > * {
/* padding: 0px !important; */
padding: 10px !important;
}
/* remove white space appearing at bottom of page
* note: this assumes 1577 (the ID of not sure what) does not change
----------------- */
.fl-builder-content.fl-builder-content-1577 .fl-module-content {
margin: 0px 20px 0px 20px;
}
.fl-builder-content .events.fl-module-content-slider .fl-slide .fl-slide-content {
padding: 30px;
}
/* Stupid mobile last overrides */
@media only screen and ( max-width: 768px ) {
/* BG colors, image and testimonials */
.fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-content {
margin: 0 !important;
/*padding: 16px; 7/30/19 */
padding: 16px 0px;
/*background-color: #fff; 7/30/19 */
background-color: transparent;
}
/* Text color, align */
.fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-text,
.fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-text * {
color: #000;
/*color: #fff; 8/1/19 */
text-align: left;
font-size: 20px !important; /* override module style */
}
.fl-builder-content .events.fl-module-content-slider .fl-slide .fl-slide-content {
padding: 30px 0px;
}
.fl-builder-content .fl-module-content-slider.events .fl-slide .fl-slide-text,
.fl-builder-content .fl-module-content-slider.events .fl-slide .fl-slide-text * {
/*color: #000; 7/30/19 */
color: #fff;
text-align: left;
font-size: 20px !important; /* override module style */
}
.fl-builder-content .fl-module-content-slider.events .fl-slide .fl-slide-text a {
color: #f3704c;
}
} /* / Stupid mobile last overrides */
/* stop horizontal scrollbar on /insights page - will probably affect anywhere same slider is used 7/30/19 */
.uabb-image-carousel button.slick-prev,
.uabb-image-carousel button.slick-prev:hover {
left: -10px;
}
.uabb-image-carousel button.slick-next,
.uabb-image-carousel button.slick-next:hover {
right: -10px;
}
/* Testimonial sliders
--------------------------- */
.bx-has-pager { /* Dot nav outer wrapper */
position: relative;
}
.fl-content-slider .bx-wrapper .bx-pager { /* Dot nav inner wrapper */
position: relative;
bottom: 100%;
width: 100%;
padding: 20px 16px 0 0;
text-align: right;
}
.fl-content-slider .bx-wrapper .bx-pager.bx-default-pager a { /* Single nav dot */
position: relative;
width: 22px;
height: 22px;
border: 1px solid #f2704c;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
background: transparent;
}
.fl-content-slider .bx-wrapper .bx-pager.bx-default-pager a.active,
.fl-content-slider .bx-wrapper .bx-pager.bx-default-pager a:focus,
.fl-content-slider .bx-wrapper .bx-pager.bx-default-pager a:hover { /* Active dot */
background: #fde5df;
}
/* arrow and active arrow styles */
.fl-content-slider .bx-wrapper .bx-pager.bx-default-pager a:before {
content: " ";
display: block;
position: absolute;
/* top: -37px;*/
top: -38px; /* controls position of white down arrow at bottom of slider */
border-left: 20px solid transparent;
border-right: 20px solid transparent;
border-top: 20px solid white;
left: 50%;
transform: translateX(-50%) translateY(-100%);
transition: all 0.4s;
}
.fl-content-slider .bx-wrapper .bx-pager.bx-default-pager a.active:before {
transform: translateX(-50%) translateY(0%);
}
.fl-slide.fl-slide-text-left { /* Single slide outer wrap, uses default classname */
display: flex;
flex-direction: row;
align-items: center;
border-radius: 12px;
}
/* Event slider needs more left right padding */
.events .fl-slide-foreground {
padding: 0 83px;
}
/* slider with text and screenshot (https://devaswp.wpengine.com/solution/paragon/)*/
.fl-slide-foreground {
display: block;
padding: 0 20px;
max-width: 100%;
}
/* .fl-slide-text-left .fl-slide-foreground .fl-slide-0 .fl-slide-content-wrap, attempt fix event carousel width problem rg 7/10 I think */
.fl-slide-text-left .fl-slide-foreground .fl-slide-content-wrap {
width: 100%;
}
.fl-slide-text-left .fl-slide-foreground .fl-slide-content { /* Just... why? */
margin-top: 0;
}
.fl-slide-text-left .fl-slide-text { /* Wrapper closest to text */
position: relative;
}
.fl-slide-text-left .fl-slide-text:before,
.fl-slide-text-left .fl-slide-text:after { /* Pseudo elements for quote marks */
position: absolute;
width: 48px;
height: 38px;
color: #e5e5e5;
font-family: 'Avenir Black';
background-repeat: no-repeat;
background-position: 50% 50%;
}
/* TICKET ISSUES SLIDER TICKET FIX */
.fl-slide-text:before {
/*
content: " ";
top: 0;
left: -64px;
*/
background: none;
/* background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-quote-open.svg'); 7/30 */
}
.fl-slide-text:after {
/*
content: " ";
bottom: 0;
right: -64px;
*/
background: none;
/* background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-quote-close.svg'); 7/30 */
}
@media only screen and ( min-width: 992px ) {
.fl-slide-text {
padding: 0px 75px;
}
.fl-slide-text:before {
content: " ";
top: 0;
left: 0;
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-quote-open.svg');
}
.fl-slide-text:after {
content: " ";
bottom: 0;
right: 0;
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-quote-close.svg');
}
}
/* END TICKET ISSUES SLIDER TICKET FIX */
/* No quotes on slider
--------------------------- */
/* to use: Edit Page > Content Slider > Advanced > HTML Element > Class - add noquote */
/*.fl-module-content-slider.noquote .fl-slide-text-left .fl-slide-text:before {*/ /* Open quote */
.fl-module-content-slider.noquote .fl-slide-text:before {
content: none;
}
/*.fl-module-content-slider.noquote .fl-slide-text-left .fl-slide-text:after {*/ /* Close quote */
.fl-module-content-slider.noquote .fl-slide-text:after {
content: none;
}
/* 2 Up and 3 Up styles
-------------------------- */
.fl-insights-wrapper {
max-width: 100% !important; /* overriding max width add to container via JS */
}
/* Every card has 34px of right margin */
.fl-featured-insights-carousel .fl-post-column, /* 3 Up */
.fl-module-related-insights .fl-insights-wrapper .fl-post-column { /* 2 Up */
margin: 4px 34px 0px 0px;
}
/* END 2 Up and 3 Up styles */
/* reduce space above bulleted list when list is below p tag
* note: p tag has bottom margin (unless it is last p tag)
*/
.fl-rich-text p + ul {
margin-top: -30px; /* leave 10px bottom */
}
.fl-insight-content .fl-post-meta-top p.fl-post-byline {
color: #999999;
}
/* Chicklets styling
------------------------- */
.fl-module-related-solutions {
display: flex;
flex-direction: column;
justify-content: flex-start;
margin: 50px 0px;
}
.fl-module-related-solutions .fl-related-solution {
flex-grow: 0;
flex-basis: 100px;
margin: 0px 0px 20px 0px;
display: flex;
align-items: flex-end;
}
.fl-module-related-solutions .fl-related-solution:last-child {
margin: 0px 0px 0px 0px;
}
.fl-module-related-solutions .fl-related-solution .fl-related-solution-image {
width: 100px;
height: 100px;
}
.fl-module-related-solutions .fl-related-solution .fl-related-solution-content h2 {
display: block;
font-size: 16px;
width: 100%;
text-align: left;
margin: 0px 0px 0px 10px;
}
.fl-module-related-solutions .fl-module-title {
margin-bottom: 20px;
}
/* contains chicklets */
.fl-related-solutions-grid {
display: flex;
flex-direction: column;
}
@media only screen and ( min-width: 992px ) {
.fl-related-solutions-grid {
flex-direction: row; /* want chicklets on same row for desktop */
}
.fl-module-related-solutions .fl-related-solution {
margin: 0px 40px 0px 0px;
}
.fl-module-related-solutions .fl-related-solution .fl-related-solution-content h2 {
display: none;
}
}
/* END Chicklets styling */
/* Ninja Form button
* to use add fl-bb-button in Ninja Form > Edit Submit button > Display > Element
---------------------------------------------------------- */
.nf-form-content .nf-field-container #nf-field-14-wrap .nf-field-element input[type=button].fl-bb-button {
color: #f3704c;
text-transform: uppercase;
background: transparent;
border: 1px solid #f3704c;
border-radius: 30px;
}
.nf-form-content .nf-field-container #nf-field-14-wrap .nf-field-element input[type=button].fl-bb-button:hover {
background: #f2b8a9;
}
/* CTA button
* to use add class="fl-bb-button" to an eg. (use HTML module to add to page)
* :not used to override bootstrap css
---------------------------------------------------------- */
a.fl-bb-button,
a.fl-bb-button:not([href]):not([tabindex]) {
color: #f3704c;
text-transform: uppercase;
background: transparent;
border: 1px solid #f3704c;
border-radius: 30px;
font-size: 16px;
letter-spacing: 1px;
padding: 11px 24px 12px 24px;
}
a.fl-bb-button:hover,
a.fl-bb-button:not([href]):not([tabindex]):hover {
background: #f2b8a9;
text-decoration: none;
}
/* these styles are applied when using the Button module to add a link to a page */
a.fl-button *,
a.fl-button:visited *,
a.fl-button:hover *,
.fl-builder-content a.fl-button *,
.fl-builder-content a.fl-button:hover *,
.fl-builder-content a.fl-button:visited * {
color: #f3704c;
}
/* Map location styling
---------------------------------------------------------- */
#locations_map .gm-style-iw-d {
text-align: center;
font-family:"Avenir Roman";
font-size: 14px;
}
#locations_map .gm-style-iw-d h2 {
font-family:"Avenir Heavy";
font-size: 14px;
margin-bottom: 0px;
}
#locations_map .gm-style-iw-d p {
font-size: 14px;
}
/**
* These styles are for accordions on Solutions pages, i.e.:
* https://devaswp.wpengine.com/solution/eureka/
* I put them here in case they clash with the Leadership accordions
* you're going to be working on
*
*/
/* General use accordions/slides styles
-------------------------------------------- */
.fl-accordion p,
.fl-slide-text p {
font-size: 20px;
}
.fl-accordion p:last-child,
.fl-slide-text p:last-child,
.fl-intro-copy p:last-child {
margin-bottom: 0;
}
.fl-accordion .fl-accordion-item {
margin-bottom: 10px;
background: #EAF1F3;
border-width: 0px;
}
.fl-accordion-button-label {
font-family: 'Avenir Black';
font-size: 34px;
line-height: 1.4;
outline: 0;
color: #002950;
}
.fl-accordion-button-icon.fa-plus:before,
.fl-accordion-button-icon.fa-minus:before {
display: block;
width: 30px;
height: 30px;
overflow: hidden;
background: url('/wp-content/themes/bb-theme-child/assets/images/icon-accordion-right.svg') no-repeat 50% 50%;
text-indent: -999px;
}
.fl-accordion-button-icon.fa-minus:before {
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-accordion-down.svg');
}
/* Ninjaforms styles
--------------------------- */
.nf-form-content {
border: 0px solid #ffffff;
}
.nf-form-content label {
display: none;
}
.nf-form-content input:not([type=button]), .nf-form-content textarea {
border: 1px solid #f7f7f7;
}
.nf-field-label label {
display: none;
}
.nf-form-content .ninja-forms-field {
font-weight: 800;
letter-spacing: 1px;
}
.nf-form-fields-required {
display: none;
}
.nf-fail.nf-error .ninja-forms-field {
border-color: #fd6f58!important;
}
.nf-fail.nf-error.field-wrap .nf-field-element:after {
background: #fd6f58!important;
}
.nf-error-msg {
color: #fd6f58!important;
}
/* download button as seen on https://devaswp.wpengine.com/case-study/springhill-medical-center/ (in sidebar) */
.nf-form-content input[type=button] {
border-radius: 30px;
}
/*
.nf-form-content input[type=button]:after {
content: "\f160";
}
.nf-form-content .nf-field-container #nf-field-14-wrap .nf-field-element .ninja-forms-field:after {
content: "\f160";
}
*/
.nf-form-content .nf-field-container #nf-field-14-wrap .nf-field-element .ninja-forms-field:after {
content: "\f160";
}
ul.nf-next-previous li.nf-next-item input.nf-next,
ul.nf-next-previous li.nf-previous-item input.nf-previous {
background: none;
color: #fd6f58;
}
/**
* Below are the partial styles and classnames for:
* Generic Event and Press Release archives
* Specific Event and Press Release archives
* Taxonomy filter selects (the pills here: https://devaswp.wpengine.com/video/working-at-allscripts/)
* Archive filter selects (the pills here: https://devaswp.wpengine.com/insights/)
* @type {[type]}
*/
/* Shared styles for events and press releases
--------------------------------------------------- */
.fl-archive-grid-item { /* Inner single item wrap */
padding: 20px;
position: relative;
background: #fff;
border: 1px solid #bfbfbf;
border-radius: 8px;
background-image: url('/wp-content/themes/bb-theme-child/assets/images/event-card-background.png');
background-position: 0px 0px;
background-size: 353px 362px;
background-repeat: no-repeat;
margin-bottom: 35px; /* space below row on Newsroom page (note: 1 per row) */
}
.fl-archive-grid-trigger { /* Toggle trigger */
position: absolute;
top: 25px;
right: 0px;
/*
right: -1px;
padding: 6px 14px;
color: #fff;
font-size: 42px;
font-weight: 700;
line-height: 1;
background: #f2704c;
border: 1px solid #f2704c;
border-radius: 10px 0 0 10px;
border-radius: 35px 0 0 35px;
*/
background-image: url('/wp-content/themes/bb-theme-child/assets/images/card-trigger-closed.png');
background-size: cover;
height: 50px;
width: 50px;
}
.fl-archive-grid-trigger.open,
.fl-archive-grid-trigger:hover { /* Toggle trigger */
background-image: url('/wp-content/themes/bb-theme-child/assets/images/card-trigger-open.png');
}
.fl-archive-meta { /* wrapper for initially visible copy */
margin: 20px 0px 20px 0px;
}
.fl-archive-date { /* Top line date for events & PRs */
font-family: 'Avenir Medium';
font-size: 14px;
font-weight: 800;
line-height: 14px;
color: #666666;
}
.fl-archive-content { /* wrapper for initially hidden copy */
display: none;
}
.fl-archive-content p {
font-size: 14px;
color: #666666;
}
.fl-archive-content p b { /* subtitle on Newsroom page */
font-family: 'Avenir Medium';
font-size: 14px;
font-weight: 800;
color: #000;
}
.fl-archive-filters-wrap {
position: relative;
}
/* remove some spacing above filters on Archive pages */
.fl-archive .fl-content {
margin: 0px 0px 40px 0px;
}
/* Clear filter link styling */
.fl-clear-filters {
text-align: center;
margin: 3px 0px 15px 0px;
}
@media only screen and ( min-width: 480px ) {
.fl-clear-filters {
text-align: center;
margin: 3px 0px 0px 0px;
}
}
.fl-clear-filters a {
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
}
/* Events grid and items
----------------------------- */
.fl-event-column {
flex: 0 0 100%;
margin-right: 0px !important; /* 7/31/19 molly */
}
/* Event grid row and cards mobile */
.fl-event-grid-row { /* single row of cards mobile */
/* 8/5/19
display: block;
*/
margin-bottom: 0;
padding: 0;
}
.fl-archive-grid-row .fl-post-column:last-child { /* last card in row */
margin-right: 0;
}
/* Event grid and cards desktop */
@media only screen and ( min-width: 992px ) {
.fl-archive-grid .fl-post-column { /* card outer wrap */
flex: 0 0 32%;
align-self: stretch;
margin: 0 2% 0 0;
}
.fl-archive-grid .fl-event-column { /* card outer wrap */
margin-bottom: 32px;
}
.fl-event-column {
flex: 0 0 30.333%;
margin-right: 33px !important;
}
.fl-event-column:nth-child(3n) {
margin-right: 0px !important;
}
}
.fl-archive-date { /* Days of week */
color: #666666;
}
.fl-event-date { /* Big month/day on events */
color: #000;
font-size: 32px;
}
.fl-event-title { /* Event title */
color: #000;
margin-top: 35px;
line-height: 1.3em;
}
.fl-event-location p { /* Event location */
font-family: 'Avenir Medium';
font-size: 14px;
color: #666666;
font-weight: 500;
}
.fl-events-wrapper {
max-width: 100% !important; /* override inline style */
}
/* Leadership grid and items
----------------------------- */
/* this needs to be the parent of .fl-leader-column I think molly
.fl-content.fl-archive-grid {
display: flex;
flex-flow: row nowrap;
margin-bottom: 35px;
}
*/
.fl-leader-column {
flex: 0 0 48%; /* also a flex item */
}
.fl-leader-column:nth-child(2) {
margin: 0px 35px;
}
.fl-leader-column .fl-archive-grid-item {
display: flex;
background: #eaf1f3;
}
.fl-leader-image {
margin: -20px 0px 0px -20px; /* position photo in upper left corner */
/*height: 228px; match size of (min-height) inline-style (not sure what is setting inline style) */
flex-basis: 35%;
}
.fl-leader-image img {
height: auto; /* match size of inline-style (not sure what is setting inline style) */
width: auto;
border-top-left-radius: 8px;
}
.fl-leader-column .fl-archive-meta {
flex-basis: 65%;
flex-shrink: 1;
margin: 10px 0px 20px 20px;
}
.fl-leader-column .fl-archive-content.open {
flex-basis: 100
}
/* Press release grid and items
------------------------------------ */
h2.fl-press-title { /* PR headline */
font-size: 32px;
}
.fl-press-content { /* Inner content wrapper, hidden by default */
display: none;
}
/* Insights and Events pagination styles
------------------------------------ */
/* Insights (3 Up) on home page styles */
.fl-module-insights.fl-module-as-slider {
padding-bottom: 0px;
}
/* Insights slider on home page 8/3/19
* this pushes column to the right over so it does not display on mobile
* known issue: this fix works on newer mobile devices but causes older mobile devices (note 2)
*/
.fl-module-insights.fl-module-as-slider .fl-featured-insights-carousel .fl-post-column {
/*margin-left: 25px;*/
}
/* don't need left margin on desktop */
@media only screen and ( min-width: 992px ) {
.fl-module-insights.fl-module-as-slider .fl-featured-insights-carousel .fl-post-column {
/*margin-left: 0px;*/
}
}
/* Events slider on home page styles 8/3/19
* this pushes column to the right over so it does not display on mobile
* known issue: this fix works on newer mobile devices but causes older mobile devices (note 2)
*/
.fl-module-events.fl-module-as-slider .fl-event-column {
/*margin-left: 30px;
margin-right: 20px !important; */
}
/* don't need margins on desktop */
@media only screen and ( min-width: 992px ) {
.fl-module-events.fl-module-as-slider .fl-event-column {
/*margin-left: 0px;
margin-right: 33px !important;*/
}
}
.fl-module-events.fl-module-as-slider .fl-slider-view-all {
transform: translate(-50%, -175%); /* positioning for home page */
}
/* 2 Up layout container */
.fl-module-related-insights.fl-module-as-slider {
padding-bottom: 0px;
}
.fl-slider-view-all {
position: absolute;
width: 160px;
bottom: 0;
left: 50%;
transform: translate(-50%, -30%); /* positioning for 2 Up page */
}
/* this is event slider on home page */
.fl-node-5ce5c7a06533d > .fl-module-content {
margin-left: 0px;
}
/* Styles for both Insights and Events */
.fl-module-as-slider .bx-controls {
/*
position: absolute;
bottom: 16px;
left: 39%;
width: 32%;
*/
position: relative;
width: 100%;
left: 0;
bottom: 0px;
height: 45px;
margin-top: 50px; /* space above pagination */
}
.fl-module-as-slider .bx-controls a {
display: block;
width: 34px;
height: 34px;
overflow: hidden;
text-indent: -999px;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: contain;
}
.fl-module-as-slider .bx-controls-direction {
/*
width: 69%;
display: flex;
justify-content: space-between;
*/
width: 280px;
display: flex;
justify-content: space-between;
position: absolute;
left: 50%;
bottom: 0;
transform: translate(-50%, -55%);
}
/*.fl-module-as-slider a.disabled {*/
.fl-module-as-slider .bx-controls-direction a.disabled {
opacity: 0.6;
}
.fl-module-as-slider .bx-controls-direction a.bx-prev {
background-image: url(/wp-content/themes/bb-theme-child/assets/images/icon-carousel-prev.svg);
}
.fl-module-as-slider .bx-controls-direction a.bx-next {
background-image: url(/wp-content/themes/bb-theme-child/assets/images/icon-carousel-next.svg);
}
.fl-module-as-slider .fl-post-column {
margin: 4px 34px 0px 0px;
}
/* Header search placeholder style
* Note:
* User agents are required to ignore a rule with an unknown selector.
* A group of selectors containing an invalid selector is invalid.
* So we need separate rules for each browser. Otherwise the whole group would be ignored by all browsers
------------------------------- */
/* Chrome/Opera/Safari */
.fl-search input[type="search"].fl-search-input::-webkit-input-placeholder {
color: #fff !important;
}
/* Firefox 19+ */
.fl-search input[type="search"].fl-search-input::-moz-placeholder {
color: #fff !important;
}
/* IE 10+ */
.fl-search input[type="search"].fl-search-input:-ms-input-placeholder {
color: #fff !important;
}
/* Firefox 18- */
.fl-search input[type="search"].fl-search-input:-moz-placeholder {
color: #fff !important;
}
/* search on Newsroom */
.fl-typed-search .form-control,
.fl-typed-search .form-control:focus {
/*width: 88%; make touch */
}
.fl-page .fl-typed-search button.fl-button-submit {
background-size: auto 50%;
border-radius: 50%;
height: 30px;
width: 10%;
margin-right: 13px;
}
/* Filter pills on Newsroom page */
.fl-archive-filters.fl-newsroom-filters .fl-taxonomy-filter-wrap {
flex: 0 0 20%; /* makes pills same width and causes long filter names to break on multiple lines */
}
/* news room card container */
.fl-archive .fl-insight-content .fl-row-fixed-width {
padding: 0 20px; /* so card edges don't touch browser edge in mobile */
}
@media only screen and ( min-width: 992px ) {
.fl-archive .fl-insight-content .fl-row-fixed-width {
padding: 0px; /* don't need for desktop */
}
}
/* Search results page styles
------------------------------- */
.fl-search-grid {
max-width: 960px;
}
.fl-search-grid h2 { /* page title */
padding-bottom: 40px;
border-bottom: 1px solid #cccccc;
}
.fl-search-grid .fl-page-title-wrap {
padding-bottom: 40px;
}
.fl-search-grid .fl-search-list .fl-search-list-item { /* individual search result */
margin-bottom: 40px;
border-bottom: 1px solid #cccccc;
max-width: 768px;
}
.fl-search-grid .fl-search-list .fl-search-list-item .fl-search-list-image { /* individual search result image */
}
.fl-search-grid .fl-search-list .fl-search-list-item .fl-search-list-type { /* individual search result file type */
font-size: 14px;
margin-bottom: 5px;
max-width: 768px;
}
.fl-search-grid .fl-search-list .fl-search-list-item h3.fl-search-list-title { /* individual search result title */
font-size: 20px;
font-weight: 700;
max-width: 768px;
}
.fl-search-grid .fl-search-list .fl-search-list-item p { /* individual search result description */
margin-bottom: 40px;
max-width: 768px;
}
/* Taxonomy filter selects
------------------------------- */
.fl-taxonomy-filter-wrap {
margin-bottom: 20px;
padding: 16px 20px;
/* original right arrow
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-arrow-right.svg');
background-repeat: no-repeat;
background-position: 94% 8px;
background-size: 9px 18px;
*/
border: 1px solid #b3b3b3;
border-radius: 24px;
transition: all 0.4s;
}
/*.fl-archive-filters .fl-taxonomy-filter-wrap.open*/
.fl-taxonomy-filter-wrap.open {
/* original down arrow
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-arrow-down-orange.svg');
background-size: 18px 9px;
background-position: 90% 14px;
*/
}
.fl-taxonomy-filter-wrap .fl-taxonomy-filter-title,
.fl-taxonomy-filter-wrap .fl-taxonomy-filter-title:hover,
.fl-taxonomy-filter-wrap .fl-taxonomy-filter-title:focus { /* anchor, toggle trigger*/
display: block;
margin: 0;
line-height: 1;
color: #b3b3b3;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 700;
padding: 0px;
/*background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-arrow-right.svg');*/
background-repeat: no-repeat;
background-position: right;
background-size: 9px 18px;
}
.fl-taxonomy-filter-wrap.open.active .fl-taxonomy-filter-title,
.fl-taxonomy-filter-wrap.open .fl-taxonomy-filter-title { /* filter category inside pill */
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-arrow-down-orange.svg');
background-size: 15px 9px;
color: #f3704c; /* on color */
}
.fl-taxonomy-filter-wrap.active .fl-taxonomy-filter-title { /* filter category inside pill */
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-arrow-right-on.png');
background-size: 9px 18px;
color: #f3704c; /* on color */
}
.fl-taxonomy-filter-select-wrap { /* contains checkboxes inside filter drop down */
display: none;
padding-top:15px;
}
.fl-taxonomy-filter-select { /* UL wrapping links */
margin: 10px 0 0;
}
.fl-taxonomy-filter-select-wrap.open .facetwp-checkbox.checked { /* filter name inside pill */
color: #f3704c; /* on color */
}
.fl-taxonomy-filter-select-wrap.open .facetwp-facet {
margin-bottom: 0px;
}
/* Filter videos font sizing
* should be limited to sidebar Filter videos text
------------------------------------ */
.fl-module-sidebar .fl-taxonomy-filter-wrap .fl-taxonomy-filter-item {
font-size: 14px;
}
.fl-module-sidebar .fl-taxonomy-filter-wrap .fl-taxonomy-filter-item a:hover {
color: #c13d1f;
}
.fl-taxonomy-filter-link {}
/* Sidebar header font sizing
------------------------------------ */
.fl-module-sidebar .fl-widget-title {
font-size: 22px;
}
/* Insight filter interface ( based on taxo selects )
---------------------------------------------------------- */
.fl-archive-filters {
display: block;
position: relative; /* display filters in column (for mobile) */
z-index: 142;
width: 100%;
padding: 0px 0px 36px 0px;
}
.fl-archive-filters .fl-taxonomy-filter-wrap {
padding: 12px 12px 12px 12px; /* make button/pill taller */
background-color: #fff;
background-position: 90% 8px;
flex: 0 0 15%;
}
.fl-taxonomy-filter-wrap .fl-taxonomy-filter-title {
background-image: url('/wp-content/themes/bb-theme-child/assets/images/icon-arrow-right.svg');
}
@media only screen and ( min-width: 480px ) {
/* display filters in row */
.fl-archive-filters {
position: absolute;
top: 0;
left: 0;
display: flex;
/*justify-content: space-evenly; IE 11 doesn't support */
justify-content: space-around; /* see https://caniuse.com/#search=justify-content */
align-items: flex-start;
flex-direction: row;
}
}
/* Facet filter styling (created for use on /insights but may be used elsewhere)
---------------------------------------------------------- */
/* Replace FacetWP checkboxes with + or - sign
* checkboxes appear in open Filter menus */
.fl-archive-filters .fl-taxonomy-filter-wrap .facetwp-checkbox {
background: url(/wp-content/themes/bb-theme-child/assets/images/facetwp-plus-sign.png) no-repeat;
background-position: top right 3px; /* 3px lines up with category arrow */
background-size: 10px 10px;
margin-bottom: 4px;
padding-left: 0px;
padding-right: 20px; /* moves + or - from end of filter name */
cursor: pointer;
font-size: 12px;
color: #b3b3b3;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 700;
}
.fl-archive-filters .fl-taxonomy-filter-wrap .facetwp-checkbox.checked {
background-image: url(/wp-content/themes/bb-theme-child/assets/images/facetwp-minus-sign.png);
}
.fl-archive-filters .fl-taxonomy-filter-wrap .facetwp-checkbox .facetwp-counter {
display: none; /* don't display count */
}
/* See X more in facet drop down menu
* :not used to override bootstrap css
---------------------------------------------------------- */
a.facetwp-toggle:not([href]):not([tabindex]),
a.facetwp-toggle:not([href]):not([tabindex]):hover {
font-size: 12px;
letter-spacing: 1px;
text-transform: uppercase;
color: #b3b3b3;
font-weight: 700;
}
/* control color of border around home page (maybe other pages too) video in lightbox */
.fl-button-lightbox-wrap .mfp-content .mfp-iframe-scaler {
background: #000;
}
.fl-button-lightbox-wrap .mfp-content .mfp-iframe-scaler iframe {
border: 0;
}
/* Marketo form styling
---------------------------------------------------------- */
/* class on