/** * The Events Calendar Full Stylesheet * (Some of these styles may override your current theme's styles) * * To add your own custom styles, create a stylesheet with the name * tribe-events.css in the tribe-events/ directory of your theme. * Your new stylesheet will be loaded after our own stylesheet. * * To replace our stylesheet altogether, you can use the 'tribe_events_stylesheet_url' filter. * * @package TribeEventsCalendar * */ :root { --featured-event-bg: #0ea0d7; --twentynineteen-font--body: "NonBreakingSpaceOverride", "Hoefler Text", "Baskerville Old Face", Garamond, "Times New Roman", serif; --twentynineteen-font--heading: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; --twentynineteen-font--code: Menlo, monaco, Consolas, Lucida Console, monospace; --twentynineteen-font--pre: "Courier 10 Pitch", Courier, monospace; } @define-mixin featured-list-styles { .tribe-event-featured { background: var(--featured-event-bg); margin-bottom: 2rem; padding: 0 1.5rem 1rem; @mixin-content; &.tribe-events-first { padding-top: 0; } .tribe-events-event-image { display: block; float: none; margin: 0 -1.5rem 0 -1.5rem; width: auto; } .tribe-events-list-event-title { display: inline-block; margin-top: 1.5rem; a { color: #fff; } } .tribe-events-event-meta { background-color: transparent; color: rgba( 255, 255, 255, .7 ); font-weight: normal; } .tribe-events-content { color: rgba( 255, 255, 255, .9 ); } a { color: rgba( 255, 255, 255, .7 ); &:active, &:hover { color: rgba( 255, 255, 255, .9 ); } } /* Cost */ .tribe-events-event-cost { display: flex; align-items: center; float: none; margin: 30px 0; span { border: 0; color: #fff; background: rgba( 255, 255, 255, 0.1 ); display: block; font-style: normal; font-weight: bold; line-height: 1; padding: 10px; text-align: center; text-overflow: ellipsis; } .ticket-cost { background: rgba( 255, 255, 255, 0.2 ); } .tribe-tickets-left { font-style: italic; font-weight: normal; margin-left: 1px; } .tribe-out-of-stock { background: #f0f0f0; border-left: none; color: #727272; font-style: italic; font-weight: normal; } .tribe-ticket-cost { margin: 0; } .tribe-button { color: #000; font-weight: bold; &:hover { color: var(--featured-event-bg); } &:active { color: #000; } } } .tribe-button { background: #fff; color: var(--featured-event-bg); } } } /* Cost */ .tribe-events-event-cost { display: flex; align-items: center; float: none; margin: 0 0 15px; span { border: 1px solid #ddd; display: block; font-style: normal; font-weight: bold; line-height: 1; padding: 8px 12px; text-align: center; text-overflow: ellipsis; } .tribe-tickets-left { background: #f0f0f0; border-left: none; color: #727272; font-style: italic; font-weight: normal; } .tribe-out-of-stock { background: #f0f0f0; border-left: none; color: #727272; font-style: italic; font-weight: normal; } .tribe-ticket-cost { margin: 0; } } input.tribe-button, button.tribe-button, a.tribe-button, .tribe-button { border-radius: 3px; line-height: 1; margin: 10px; padding: 9px 12px; &.sold-out { background: none; border: none; color: #a00; &:hover { cursor: default; } } } /* = Global & Miscellaneous Styles =============================================*/ #tribe-events-pg-template, .tribe-events-pg-template { margin: 0 auto; max-width: 1200px; } /* Default Events Template Base HTML Styles */ .tribe-events-after-html { clear: both; } #tribe-events .tribe-events-content, .tribe-events-before-html, .tribe-events-after-html { p { line-height: 1.7; margin: 0 0 10px; } } #tribe-events-pg-template .tribe-events-content, .tribe-events-before-html, .tribe-events-after-html { h1, h2, h3, h4, h5, h6 { line-height: 1.7; margin: 24px 0; } h1 { font-size: 21px; line-height: 1.5; } h2 { font-size: 18px; line-height: 1.6; } h3 { font-size: 16px; line-height: 1.8; } h4 { font-size: 14px; line-height: 1.8; } h5 { font-size: 13px; line-height: 1.8; } h6 { font-size: 12px; line-height: 1.8; } ul { list-style: disc outside; } ol { list-style: decimal outside; } ul, ol { li { line-height: 1.7; margin: 0 0 20px; } } } .tribe-events-back { margin: 0 0 20px 0; .events-list &.tribe-events-loop { margin: 0 auto 20px; } } /* Links */ #tribe-events-content a, .tribe-events-event-meta a { text-decoration: none; } /* Important Link Styles */ ul.tribe-events-sub-nav, .tribe-events-back, .tribe-events-list-widget .tribe-events-widget-link, .tribe-events-adv-list-widget .tribe-events-widget-link { a { text-decoration: none; &:hover { text-decoration: none; } } } /* Global Main Button Style */ .tribe-events-button, #tribe-events .tribe-events-button { *display: inline; background-color: #666; background-image: none; border-radius: 3px; border: 0; box-shadow: none; color: #fff; cursor: pointer; display: inline-block; font-size: 11px; font-weight: bold; letter-spacing: 1px; line-height: normal; padding: 6px 9px; text-align: center; text-decoration: none; text-transform: uppercase; vertical-align: middle; zoom: 1; } .tribe-events-button.tribe-active { background-color: #666; color: #fff; } .tribe-events-button.tribe-inactive, .tribe-events-button:hover, #tribe-events .tribe-events-button:hover, .tribe-events-button.tribe-active:hover { background-color: #ddd; color: #444; text-decoration: none; } /* Calendar Add Buttons */ a.tribe-events-ical, a.tribe-events-gcal { clear: both; color: #fff; float: right; font-size: 10px; font-weight: normal; line-height: 18px; margin-top: 21px; padding: 0 6px; text-decoration: none; } .tribe-events-gcal { margin-right: 9px; } .single-tribe_events a.tribe-events-ical, .single-tribe_events a.tribe-events-gcal { float: none; } /* Google Maps */ .tribe-events-event-meta .tribe-events-gmap, .tribe-events-event-meta-desc .tribe-events-gmap { white-space: nowrap; } /* Fixes for rich snippets */ .event .entry-title { color: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; padding: inherit; } .updated-info { height: 0; text-indent: -9999px; } /* Featured Images */ .tribe-events-event-image { margin: 0 0 20px 0; text-align: center; } .tribe-events-event-image img { height: auto; max-width: 100%; } /* Event Schedule Detail Styling */ .tribe-events-schedule h2 { display: inline-block; margin-bottom: 0; font-size: 1.2em; font-style: normal; font-weight: bold; line-height: normal; } .tribe-events-event-schedule-details { display: inline; } /* 2011 Theme Extra Calendar Room */ .events-archive { .entry-content, .entry-header { width: 98%; } /* Remove "Edit" Link from unneeded templates */ span.edit-link { display: none; } } /* Remove unused header / footer elements on non-event page template */ .events-archive, .single-tribe_events, .single-tribe_venue, .single-tribe_organizer { header, footer { &.entry-header, &.entry-meta { display: none; } } } /* Event Notices */ .tribe-events-notices { background: #d9edf7; border-radius: 4px; border: 1px solid #bce8f1; color: #3a87ad; margin: 10px 0 18px; padding: 8px 35px 8px 14px; text-shadow: 0 1px 0 #fff; div& > ul, div& > ul > li { list-style: none; margin: 0; padding: 0; } } /* Promotional Styles */ #tribe-events-content { p.tribe-events-promo { color: #999; font-size: 12px; a { color: #666; } } } /* Miscellaneous Helper Classes */ .clearfix, .tribe-clearfix { zoom: 1; &::before, &::after { content: ''; display: table; } &::after, &::after { clear: both; } } .tribe-clear { clear: both; } .tribe-events-visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .tribe-hide-text { overflow: hidden; text-indent: 100%; white-space: nowrap; } .tribe-events-error { display: none; } .tribe-events-multi-event-day { color: #0f81bb; } #tribe-events-content .tribe-events-abbr { border-bottom: 0; cursor: default; } /* Tribe Spinner */ .tribe-events-spinner { height: 32px; margin-left: -16px; width: 32px; } .tribe-events-spinner-medium { height: 24px; width: 24px; } .tribe-events-spinner-small { height: 16px; margin-left: -8px; width: 16px; } /* IE7 Tweaks */ * + html { .events-archive { .tribe-events-page-title { padding-bottom: 30px; } .tribe-events-list .tribe-events-page-title { padding-bottom: 0; } } #tribe-events-header { margin-bottom: 30px; } } /* General Template Headers */ .tribe-events-page-title { clear: none; font-size: 24px; font-weight: normal; margin-bottom: .5em; position: relative; text-align: center; z-index: 0; /* don't float on filter list view */ .tribe-events-filter-view.events-list & { width: 100%; float: none; } a { color: #000; &:hover, &:focus { color: #333; text-decoration: underline; } } } /* General Template Header/Footer Nav */ #tribe-events-header, #tribe-events-footer { clear: both; margin-bottom: .5em; .tribe-events-sub-nav { line-height: normal; list-style-type: none; margin: 0; overflow: hidden; padding: 0; text-align: center; li { *display: inline; display: inline-block; margin: 0; vertical-align: middle; zoom: 1; } li, .tribe-events-nav-previous { float: left; margin-right: 5px; text-align: left; } .tribe-events-nav-next { float: right; margin-left: 5px; text-align: right; } .tribe-events-nav-left { float: left; text-align: left; } .tribe-events-nav-right { float: right; text-align: right; } } } .tribe-events-ajax-loading { background: #666; border-radius: 5px; box-shadow: none; display: none; left: 50%; margin-left: -27px; padding: 15px; position: absolute; top: 150px; z-index: 10; .tribe-events-loading &, &.tribe-events-active-spinner, &.tribe-events-active-spinner img { display: block; } } #tribe-events-header { position: relative; } #tribe-events-footer { margin-bottom: 1em; } /* List & Map & Day Nav Tweaks */ .events-list #tribe-events-footer, .tribe-events-day #tribe-events-footer, .tribe-events-map #tribe-events-footer { clear: both; margin: 1.25em 0 18px; } /* Single Event & Map View Nav Tweaks */ .tribe-events-map #tribe-events-header { margin: 1em 0; } .single-tribe_events { #tribe-events-header { margin: 1em 0 20px; } #tribe-events-header li, #tribe-events-footer li { width: 48%; } } #tribe-events-content .tribe-events-nav-date { padding-top: 16px; } select.tribe-events-dropdown { font-size: 11px; margin: 33px 9px 0 0; width: auto; } #tribe-events-events-picker, #tribe-events-picker { display: inline; } /* = Calendar View & List View Template Styles @ Template: month.php & list.php =============================================*/ #tribe-events-content { margin-bottom: 48px; padding: 2px 0; position: relative; &.tribe-events-list { padding: 0; } } .tribe-events-othermonth { div[id*='tribe-events-daynum-'], .tribe-events-month-event-title { -khtml-opacity: .4; -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=40)'; filter: alpha(opacity=40); opacity: .4; } } /* = List View Template Styles @ Template: list.php =============================================*/ #tribe-events-content.tribe-events-list { margin-bottom: 60px; } .tribe-events-list { .tribe-events-loop { @mixin featured-list-styles; .tribe-events-event-image { float: left; margin: 0 3% 0 0; width: 30%; } .tribe-events-content { width: 100%; } } .tribe-events-list-event-title { border: none; display: inline-block; font-size: 1.4em; letter-spacing: 0; line-height: 1.4em; margin: 0; padding: 0; text-transform: none; } .type-tribe_events { border-bottom: 1px solid #ddd; margin: 0; padding: 2.25em 0; &.tribe-events-first { padding-top: 0; } &.tribe-event-end-month { border-bottom: 0; padding-bottom: 0; } } .tribe-events-event-image { display: inline-block; float: left; margin: 0 3% 0 0; img { height: auto; margin: 0; padding: 0; width: 100%; } + div.tribe-events-content { display: block; float: none; position: relative; } /* Reset list-view descriptions to static position; fixes bug with relative positioning that prevented the full area of the .tribe-events-event-image being "clickable". */ + div.tribe-events-content.tribe-events-list-event-description { position: static; } } .tribe-events-loop .tribe-events-event-meta { .recurringinfo { *display: inline; display: inline-block; zoom: 1; } .event-is-recurring { position: relative; } /* Content */ .tribe-events-content { padding: 0; width: 100%; } } .time-details, .tribe-events-venue-details { display: block; line-height: 1.2; margin: 0; } .time-details { margin: 0 0 8px 0; } .tribe-events-venue-details { margin: 15px 0; } } .tribe-events-event-details .tribe-events-event-meta address.tribe-events-address { font-family: inherit; font-size: inherit; font-style: normal; line-height: inherit; } /* Date Separators */ .tribe-events-list-separator-year { color: #ccc; display: block; font-size: 38px; font-weight: bold; padding: 1em 2.25em 0; text-align: center; } .tribe-events-list-separator-month { background-color: #eee; display: block; font-size: 14px; font-weight: bold; margin: 2.5em 0 0; padding: 6px 10px; text-transform: uppercase; & + .type-tribe_events.tribe-events-first { padding-top: 2.25em; } } /* = List View & Single Venue (Pro Version) Template Styles @ Template: list.php & single-venue.php =============================================*/ /* Loop */ .tribe-events-loop { clear: both; .type-tribe_events.tribe-events-last { border-bottom: 0; } .tribe-events-content { float: left; padding: 0 5% 0 0; width: 60%; } /* Meta */ .tribe-events-event-meta { border: 0; clear: both; float: none; font-size: 14px; font-weight: bold; line-height: 1.5; margin: 5px 0 15px 0; overflow: visible; } } .tribe-events-event-meta address.tribe-events-address { display: inline; font-family: inherit; font-size: inherit; font-style: normal; line-height: inherit; margin-right: 10px; } .single-tribe_venue .tribe-events-loop .tribe-events-content p { margin: 0; } .events-archive h3 .published, .single-tribe_venue h3 .published { font-size: 18px; font-style: italic; margin-top: 0; text-transform: none; } .tribe-events-event-meta-desc, .tribe-events-event-day { color: #333; } .venue-address { margin-top: 1em; &>* { display: block; margin-top: 0.5em; } } /* = Single Event Template Styles @ Template: single-event.php =============================================*/ .single-tribe_events .tribe-events-single-event-title { font-size: 1.7em; line-height: 1; margin: 0; padding: 0; } .single-tribe_events .tribe-events-single-event-recurrence-description { align-items: center; display: flex; font-size: 1em; margin: 0.5em 0 1.5em; & > img { height: 1em; } & > a { color: #009fd4; font-size: 0.8125em; } & > * { margin-right: 0.4375em; } } #tribe-events-content .tribe-events-single-event-description .attachment-post-thumbnail { display: block; margin-left: auto; margin-right: auto; text-align: center; } .tribe-events-meta-group { .tribe-events-single-section-title { font-size: 1.4em; font-weight: bold; margin: 20px 0 10px; } & + .tribe-events-single-section-title { margin-top: 0; } } .tribe-events-event-meta .tribe-events-meta-group address.tribe-events-address { display: block; margin: 0; } /* Eventbrite */ #eventbrite-embed { margin: 24px 0; min-height: 225px; width: 100%; } .eventbrite-ticket-embed { margin: 0 0 30px 0; } /* Date/Time */ .tribe-events-schedule { margin: 20px 0 0; vertical-align: middle; } .single-tribe_events { .tribe-events-schedule { .tribe-events-divider, .recurringinfo, .tribe-events-cost { font-size: 1.2em; } h3 { *display: inline; display: inline-block; font-size: 1.2em; margin: 0; padding: 0; vertical-align: middle; white-space: nowrap; zoom: 1; } .tribe-events-cost { vertical-align: baseline; } } /* Featured Image */ .tribe-events-event-image { clear: both; margin-bottom: 30px; text-align: center; } /* Export Links */ .tribe-events-cal-links { clear: both; } /* Meta Sections */ .tribe-events-event-meta { background: #fafafa; border: 1px solid #eee; margin: 30px 0; } /* Map */ .tribe-events-venue-map { background: #eee; border: 1px solid #ddd; border-radius: 3px; display: inline-block; float: right; margin: 20px 4% 2% 0; padding: 5px; vertical-align: top; width: 90%; zoom: 1; } .tribe-events-meta-group + .tribe-events-meta-group + .tribe-events-meta-group-gmap { clear: both; display: block; float: none; width: auto; .tribe-events-venue-map { float: none; width: 100%; } } .secondary { .tribe-events-venue-map { width: 58%; @media screen and (max-width: 767px) { width: 90%; } } } .sidebar .secondary .tribe-events-venue-map { width: 100%; } /* Event Meta */ .tribe-events-event-meta { font-size: 13px; } .tribe-events-event-meta dl { margin: 0; } #tribe-events-content { .tribe-events-event-meta { dt { clear: left; font-weight: bold; line-height: 1; list-style: none; } dd { float: none; line-height: 1.5; list-style: none; margin: 0 0 10px 0; padding: 0; } } } } .tribe-events-event-meta { .tribe-events-meta-group, .column { box-sizing: border-box; display: inline-block; float: left; margin: 0 0 20px 0; padding: 0 4%; text-align: left; vertical-align: top; width: 33.3333%; zoom: 1; } } #tribe-events-content .tribe-events-event-meta dd span.adr { display: block; } /* Content */ .single-tribe_events .tribe-events-content { max-width: 100%; padding: 0; width: 100%; } /* Twenty Thirteen Conflict */ .sidebar.single-tribe_events .tribe-events-content { padding: 0; } /* = Day Grid Template Styles @ Template: day.php =============================================*/ .tribe-events-day { .tribe-events-day-time-slot { .tribe-events-day-time-slot-heading { background-color: #eee; font-size: 14px; font-weight: bold; margin: 2.5em 0 0; padding: 6px 10px; text-transform: uppercase; } .type-tribe_events { margin-left: 5%; } } } .tribe-events-day { @mixin featured-list-styles { .tribe-events-content { display: block; float: none; width: auto; } } .type-tribe_events { margin-left: 0; } .tribe-events-event-image { display: inline-block; float: left; margin: 0 3% 0 0; width: 30%; } .tribe-events-content { display: inline-block; float: right; padding: 0; width: 67%; @media screen and (min-width: 44.375em) { margin-left: 0; margin-right: 0; } } } /* = Calendar Styles (includes styles for both large & small calendars) @ Template: month.php & widgets/calendar-widget.php =============================================*/ /* Global Calendar Styles */ #tribe-events-content { table.tribe-events-calendar { border-collapse: collapse; clear: both; font-size: 12px; margin: 12px 0 .6em; overflow: visible; table-layout: fixed; width: 100%; .type-tribe_events.tribe-event-featured { background: var(--featured-event-bg); margin: 0; padding: 6px 14px; /* This is a failover if the browser doesn't support calc */ padding: 6px calc( 5% + 8px ); .events-archive.events-gridview & { margin: 0; padding: 6px 14px; /* This is a failover if the browser doesn't support calc */ padding: 6px calc( 5% + 8px ); } .tribe-events-month-event-title { a { color: #fff; &:active, &:hover { color: #eee; } } } } } table.tribe-events-calendar, .tribe-events-calendar td { border: 1px solid #bbb; } .tribe-events-calendar td { box-sizing: border-box; color: #114b7d; font-size: 12px; height: 145px; padding: 0 0 .5em; vertical-align: top; width: 14.28%; } } .tribe-events-calendar { div[id*='tribe-events-daynum-'], div[id*='tribe-events-daynum-'] a { background-color: #f5f5f5; color: #333; font-size: 11px; font-weight: bold; } td.tribe-events-present { div[id*='tribe-events-daynum-'], div[id*='tribe-events-daynum-'] > a { background-color: #666; color: #fff; } } td.tribe-events-past { div[id*='tribe-events-daynum-'], div[id*='tribe-events-daynum-'] > a { color: #999; } } } /* Global Tooltips */ .tribe-events-calendar .tribe-events-tooltip, .tribe-events-week .tribe-events-tooltip, .tribe-events-shortcode.view-week .tribe-events-tooltip, .recurring-info-tooltip { background-color: #f9f9f9; border: 1px solid #666; bottom: 30px; color: #333; display: none; left: 3px; line-height: 1.4; position: absolute; width: 320px; z-index: 1001; } .tribe-events-tooltip .tribe-events-arrow { background-image: url(../images/tribe-tooltips.png); background-position: 0 0; background-repeat: no-repeat; background-size: 44px 19px; bottom: -11px; display: block; height: 11px; left: 20px; position: absolute; width: 18px; } .tribe-events-calendar .tribe-events-right .tribe-events-tooltip, .tribe-events-week .tribe-events-right .tribe-events-tooltip, .tribe-events-shortcode.view-week .tribe-events-right .tribe-events-tooltip, .recurring-info-tooltip { left: auto; right: 3px; } .tribe-events-right .tribe-events-tooltip .tribe-events-arrow { left: auto; right: 30px; } .tribe-events-tooltip { ul, ol { margin-left: 1.6em; } /** For images contained *inside* the tooltip body, let's constrain the size by default */ .tribe-events-event-body .tribe-events-event-thumb img { max-height: 150px; max-width: 150px; } /** For when a tooltip is near top edge of viewport, so displays below event title instead of above it. */ &.tribe-events-tooltip-flipdown { &:before { border: 10px solid transparent; border-bottom-color: #666; content: ' '; display: block; height: 0; left: 17px; position: absolute; top: -21px; width: 0; z-index: 2; } .tribe-events-arrow { display: none; } } } /** Tweak location of the arrow on "flipdown" tooltips for events on the right side of the screen. */ .tribe-events-right .tribe-events-tooltip { &.tribe-events-tooltip-flipdown:before { left: auto; right: 43px; } } #tribe-events-content .tribe-events-tooltip { ul, ol { @media screen { margin-left: 1.6em; } } } /* Recurring info tooltip */ .recurringinfo { *display: inline; display: inline-block; position: relative; zoom: 1; } .event-is-recurring { color: rgba(0, 0, 0, .7); font-style: normal; font-weight: 500; position: relative; &:hover { color: #000; } .tribe-event-featured & { color: rgba( 255, 255, 255, .7 ); &:hover { color: #fff; } div { color: rgba( 0, 0, 0, .7 ); } } } .recurring-info-tooltip.tribe-events-tooltip { left: 10px; padding-bottom: .8em; width: 200px; } /* Large Calendar Specifics */ .events-archive.events-gridview #tribe-events-content table .type-tribe_events { border-bottom: 1px solid #e7e7e7; margin: 0 5%; padding: 6px 8px; } .events-archive.events-gridview #tribe-events-content table .tribe-events-last { border-bottom: 0; } .tribe-events-viewmore { border-top: 1px solid #e7e7e7; font-weight: bold; line-height: 1; margin: 0 5%; padding: 9px 8px; } .tribe-events-calendar { td { .tribe-events-viewmore a { font-size: 90%; white-space: nowrap; } div[id*='tribe-events-daynum-'] { line-height: 1.2; padding: 6px 9px; } a { font-size: 91.7%; } } th { background-color: #ddd; color: #333; height: 10px; letter-spacing: 1px; padding: 4px 0; text-align: center; text-transform: uppercase; width: 14.28%; } div[id*='tribe-events-event-'], div[id*='tribe-events-daynum-'] { margin: 0; position: relative; } div[id*='tribe-events-event-'] h3.tribe-events-month-event-title a { font-size: 100%; } } #tribe-events-content { .tribe-events-calendar div[id*='tribe-events-event-'] h3.tribe-events-month-event-title { font-family: sans-serif; font-size: 98%; font-weight: normal; line-height: 1.25; margin: 0; overflow: hidden; padding: 3%; text-transform: none; } /* Large Calendar Tooltip Specifics */ .tribe-events-tooltip h4 { background-color: #666; color: #fff; font-size: 12px; font-weight: normal; letter-spacing: 1px; line-height: 24px; margin: 0; min-height: 24px; padding: 0 6px; } } .tribe-events-tooltip { .tribe-events-event-body { font-size: 11px; font-weight: normal; padding: 3px 6px 6px; } .duration { font-style: italic; margin: 3px 0; } &:not(.tribe-event-featured) .tribe-events-event-thumb { padding: 5px 5px 5px 0; } &.tribe-event-featured .tribe-events-event-thumb { padding: 2px 0 8px 0; } .tribe-events-event-thumb { float: left; img { box-shadow: none; } } p.entry-summary { font-size: 11px; line-height: 1.5; padding: 0; } } #tribe-mobile-container { display: none; } /* = Events List Widget Styles (Sidebar) @ Template: widgets/list-widget.php =============================================*/ .tribe-events-list-widget { ol li { list-style: none; margin-bottom: .5rem; } .tribe-list-widget { margin-left: 0; } .tribe-events-list-widget-events { padding: 0 1.5rem; margin-bottom: 1.25rem; } .tribe-event-title { margin-bottom: .25rem; margin-top: 0; } .duration { font-weight: bold; } .tribe-event-featured { background: var(--featured-event-bg); padding-bottom: .75rem; .tribe-event-title { margin-top: .75rem; a { color: white; } } .tribe-event-image { line-height: 0; margin-left: -1.5rem; margin-right: -1.5rem; overflow: hidden; } .tribe-event-duration { color: white; } } } /* = Events Navigation Bar @ Template: modules/bar.php =============================================*/ /* Datepicker ========================================================================== */ .datepicker { td, table tr td span { border-radius: 0; } td { border-top: 1px solid #ededed; } td, th { word-break: normal; } table tr { td { &.active.active, span.active.active { background: #666; &:hover { background: #dadada; color: inherit; } } } } body.admin-bar & { margin-top: 32px; @media screen and (max-width: 782px) { margin-top: 46px; } } } #tribe-events-bar { clear: none; height: auto; margin-bottom: 30px; min-width: 220px; position: relative; width: 100%; * { box-sizing: border-box; } } #tribe-bar-form { background: #f5f5f5; margin: 0; position: relative; width: 100%; input { font-size: 15px; margin: 0 4px 0 0; } input[type='text'] { background: 0; border: none; border-bottom: 1px dashed #b9b9b9; border-radius: 0; box-shadow: none; font-style: italic; font-weight: normal; height: auto; line-height: 1; padding: 5px; width: 100%; &:focus { border-bottom: none; outline: 1px dashed #b9b9b9; } } .tribe-bar-submit input[type=submit] { -webkit-appearance: button; background: #666; background-image: none; border: none; border-radius: 0; color: #fff; font-size: 13px; height: auto; letter-spacing: 0; line-height: 2; padding: 10px; width: 100%; } label { display: block; font-size: 11px; font-weight: bold; line-height: 1; margin: 0 0 5px 0; padding: 0; text-transform: uppercase; } .tribe-bar-filters { float: left; margin: 0; position: relative; width: 100%; } .tribe-bar-filters-inner { margin: 0; } .tribe-bar-views-inner label { padding: 0 15px; text-align: left; } } #tribe-bar-filters-wrap { position: relative; } input[name*='tribe-bar-']::-webkit-input-placeholder { color: #5f5f5f; font-style: italic; font-weight: normal; line-height: 1.3; } input[name*='tribe-bar-']:-moz-placeholder { color: #5f5f5f; font-style: italic; font-weight: normal; line-height: 1.3; } .tribe-event-placeholder { color: #5f5f5f; font-weight: normal; font-style: italic; line-height: 1.3; } #tribe-bar-dates .select2-choice { border-bottom: 1px dashed #b9b9b9; } /* Tribe Bar Full Layout */ .tribe-bar-date-filter { float: left; margin-bottom: 0; padding: 15px; width: 25%; } .tribe-bar-search-filter { float: left; margin-bottom: 0; padding: 15px; width: 33.3333%; } .tribe-bar-submit { float: left; margin-bottom: 0; margin-left: 16.6667%; padding: 15px; width: 25%; @media screen and (max-width: 767px) { margin-left: 0; } input[type=submit]:hover { background: #999; color: #fff; } } .tribe-bar-views-inner { background: #e0e0e0; margin: 0; padding: 16px 0; } #tribe-bar-views-toggle { border: 0; background: transparent; color: #333; display: block; font-size: 16px; font-family: inherit; font-weight: normal; line-height: 1; padding: 6px 15px; position: relative; text-align: left; text-transform: none; width: 100%; &:focus { outline: 1px dotted; } &:hover, &:focus { background: #cacaca; } &:after { border: solid transparent; border-color: rgba(136, 183, 213, 0); border-top-color: inherit; border-width: 8px; content: ' '; height: 0; pointer-events: none; position: absolute; right: 15px; top: 10px; width: 0; } .tribe-bar-views-open & { &:after { border-bottom-color: inherit; border-top-color: transparent; top: 0; } } .tribe-bar-collapse & { padding: 10px 14px; &:after { top: 14px; } } } #tribe-bar-views { .tribe-bar-views-list { background: #e0e0e0; border-radius: 0 0 3px 3px; display: none; left: 0; margin: 0; padding: 5px 0 0 0; position: absolute; top: auto; width: 100%; z-index: 2; } .tribe-bar-views-option { display: block; color: #444; line-height: 14px; margin: 0; padding: 6px 15px; &:hover { cursor: pointer; background: #cacaca; } &:focus { outline: 1px dotted; } &:last-child { border-radius: 0 0 3px 3px; } &.tribe-bar-active { background: #cacaca; } } .tribe-bar-settings { display: none; } } /* Tribe Bar Mini Styles */ #tribe-bar-form.tribe-bar-mini { * { font-size: 12px; } label { font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tribe-bar-submit input[type=submit] { -webkit-appearance: button; font-size: 11px; padding: 10px 5px; } .tribe-bar-date-filter { padding: 10px; } .tribe-bar-search-filter { padding: 10px; } .tribe-bar-submit { padding: 10px; } .tribe-bar-views-list .tribe-bar-views-option a { padding: 4px 15px; } .tribe-bar-views-inner { padding: 12px 0; label { padding: 0 10px; } } } #tribe-bar-form.tribe-bar-mini, #tribe-bar-form.tribe-bar-full { &.tribe-events-bar--has-views #tribe-bar-filters-wrap { float: left; width: 83.3333%; } &.tribe-events-bar--has-filters #tribe-bar-views { position: relative; float: left; width: 16.6667%; } } /* Tribe Bar Collapse Styles */ #tribe-bar-collapse-toggle { background: #f5f5f5; color: #333; display: none; width: 100%; font-size: 13px; font-weight: bold; line-height: 28px; padding: 15px; position: relative; text-align: left; text-transform: uppercase; border: 0; &:focus, &:hover { cursor: pointer; color: #fff; background: #666; } &.tribe-bar-filters-open span.tribe-bar-toggle-arrow::after { border-bottom-color: inherit; border-top-color: transparent; top: 0; } span.tribe-bar-toggle-arrow { display: inline-block; margin: 0 4px; position: absolute; right: 10px; &::after { border: solid transparent; border-color: rgba(136, 183, 213, 0); border-top-color: inherit; border-width: 8px; content: ' '; height: 0; pointer-events: none; position: absolute; right: 0; top: 10px; width: 0; } } } #tribe-bar-form.tribe-bar-collapse { background: transparent; #tribe-bar-collapse-toggle { display: block; } .tribe-bar-filters { position: absolute; z-index: 21; float: none; display: none; left: auto; padding-top: 5px; overflow: hidden; right: auto; width: 100%; background: #f5f5f5; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); } .tribe-bar-filters-inner > div { width: 100%; } #tribe-bar-views { margin-top: 10px; } .tribe-bar-views-inner { padding: 10px 0 0 0; } } .tribe-bar-disabled { float: right; position: relative; z-index: 101; .tribe-events-page-title { clear: none; line-height: 45px; margin: 0; text-align: left; } #tribe-events-bar { float: none; min-width: 0; width: auto; } #tribe-bar-form { border-radius: 3px; width: auto; } #tribe-bar-filters-wrap { float: left; min-width: 120px; width: auto; } .tribe-bar-filters .tribe-bar-date-filter { padding: 5px 10px; } #tribe-bar-form { label { font-size: 10px; } .tribe-bar-filters input[type='text'] { border: none; display: block; font-size: 13px; line-height: 1; margin: 10px 0 0 0; padding: 3px 0 0 0; width: 100px; } #tribe-bar-views { float: right; font-size: 16px; left: 50%; min-width: 130px; padding: 0; right: auto; width: 50%; } } .tribe-bar-views-inner { border-radius: 0 3px 3px 0; min-width: 100px; padding: 5px 0 0; position: relative; } #tribe-bar-views { .tribe-bar-views-list, .tribe-bar-views-list .tribe-bar-views-option { margin: 0; } .tribe-bar-views-list .tribe-bar-views-option a { margin: 0; padding: 4px 10px; } .select2-container .select2-choice { font-size: 13px; height: auto; line-height: 18px; } } .tribe-select2-results-views.select2-drop .select2-results li { padding: 0 10px; } #tribe-bar-collapse-toggle, .tribe-bar-submit { display: none; } } .tribe-bar-disabled .tribe-bar-date-filter, .tribe-events-uses-geolocation .tribe-bar-disabled .tribe-bar-date-filter { width: auto; } /* Events Bar Icons */ .tribe-bar-views span[class^='tribe-icon-'] { background-position: 0 50%; background-repeat: no-repeat; display: inline-block; min-height: 16px; padding-left: 24px; /* Default Icon (month) */ background-image: url(../images/events-bar/icon-month.png); background-size: 15px 16px; } .tribe-bar-views { span.tribe-icon-month { background-image: url(../images/events-bar/icon-month.png); background-size: 15px 16px; } span.tribe-icon-list { background-image: url(../images/events-bar/icon-list.png); background-size: 15px 10px; } span.tribe-icon-week { background-image: url(../images/events-bar/icon-week.png); background-size: 15px 16px; } span.tribe-icon-day { background-image: url(../images/events-bar/icon-day.png); background-size: 15px 16px; } span.tribe-icon-photo { background-image: url(../images/events-bar/icon-photo.png); background-size: 15px 14px; } span.tribe-icon-map { background-image: url(../images/events-bar/icon-map.png); background-position: 2px 50%; background-size: 12px 16px; } } /* ========================================================================= Theme Compatibility ========================================================================== */ /* Twenty Fourteen ========================================================================== */ .tribe-events-week.tribe-theme-twentyfourteen #masthead, .tribe-events-week.tribe-theme-parent-twentyfourteen #masthead { z-index: 1001; } .tribe-theme-twentyfourteen #tribe-events-pg-template #tribe-events, .tribe-theme-parent-twentyfourteen #tribe-events-pg-template #tribe-events { padding: 20px; } .tribe-theme-twentyfourteen #tribe-bar-views .tribe-bar-views-list, .tribe-theme-parent-twentyfourteen #tribe-bar-views .tribe-bar-views-list { z-index: 3; } @media screen and (min-width: 1000px) { .tribe-theme-twentyfourteen #tribe-events-pg-template, .tribe-theme-parent-twentyfourteen #tribe-events-pg-template { padding-left: 220px; } } /* Stop themes from hiding elements with the .updated CSS class */ #tribe-events-content .tribe-updated { display: inherit; } @media screen and (max-width: 400px) { .list-view.events-archive .site-content .type-page .entry-content { display: initial; } } /* Twenty Fifteen (including Twenty Fifteen child themes) ========================================================================== */ .tribe-theme-twentyfifteen, .tribe-theme-parent-twentyfifteen { #tribe-events { background: white; margin: 0 8.333%; padding-top: 8.333%; } .tribe-events-single-event-title { font-size: 39px; } } .tribe-theme-twentyfifteen, .tribe-theme-parent-twentyfifteen { &.events-single { &.tribe-events-page-template { #tribe-events-pg-template { padding-top: 8.3333%; } #tribe-events-content { padding: 8.3333% 10%; } } } &.single-tribe_events { #tribe-events { .tribe_events { box-shadow: none; margin-left: 0; margin-right: 0; padding-top: 0; } .tribe-events-schedule h2 { display: inline-block; font-size: 1.2em; margin: 0; } } .tribe-events-single { box-shadow: none; margin: 0; } } &.tribe-events-week .tribe-events-grid .hentry { margin-left: 0; margin-right: 0; } .tribe-events-list-widget { .type-tribe_events { border-top: 1px solid rgba( 51, 51, 51, .1 ); box-shadow: none; margin-left: 0; margin-right: 0; } .entry-title { font-size: 22px; line-height: 1.4545; } } &.tribe-events-page-template #tribe-events-content-wrapper { padding: 3.333%; } .tribe-events-list { .type-tribe_events, .type-tribe_events.tribe-events-first { padding: 8.333% 10%; } .time-details, .tribe-events-venue-details { line-height: 1.6; } } .tribe-events-day-time-slot .type-tribe_events { margin-left: 0; /* Corrects some extra margin in the day view. */ } .type-tribe_events a.more-link { display: none; /* Hides the occasionally-appearing duplicate More link from 2015 theme. */ } .datepicker.dropdown-menu { max-width: 340px; table, table.table-condensed { border-left-width: 0; border-top-width: 0; } } ul.tribe-bar-views-list li a { border-bottom: none; } .tribe-events-calendar td a { border-bottom: none; } .tribe-events-nav-previous a, .tribe-events-nav-next a { border-bottom: none; } &.single-tribe_events .entry-footer, &.events-archive .entry-footer { display: none; } } /* Twenty Sixteen (including Twenty Sixteen child themes) ========================================================================== */ .tribe-theme-twentysixteen, .tribe-theme-parent-twentysixteen { table.tribe-events-calendar { table-layout: auto; } .tribe-events-single-section-title:first-child { margin-top: 20px; } .tribe-events-content.entry-summary { font-size: inherit; margin-bottom: 0; margin-top: 5px; } &.events-archive .entry-content, &.events-archive .entry-header { width: auto; } .datepicker table { border: 0; width: auto; } .entry-content { a { box-shadow: none; } } .tribe-events-list-event-title { clear: none; } } /* Twenty Seventeen ========================================================================== */ .tribe-theme-twentyseventeen { .entry-content { a { box-shadow: none; } } &.single-tribe_events { .single-featured-image-header { display: none; } } /* Ensure full-width calendar if Main Events Page is site homepage. */ &.page-template-page-php.blog:not(.has-sidebar) { #primary article { width: 100%; } } } /* Twenty Nineteen ========================================================================== */ .tribe-theme-twentynineteen { /* Removing the dash above headers in a number of specific places. */ h1.tribe-events-page-title::before, h2.tribe-events-list-separator-month::before, h2.tribe-events-day-time-slot-heading::before, .tribe-events-schedule h2::before, .tribe-events-tooltip h3.entry-title::before { content: none; } #tribe-bar-form label { font-family: var(--twentynineteen-font--heading); } .tribe-bar-views-inner { padding: 19px 0; } #tribe-events .tribe-events-button { font-family: var(--twentynineteen-font--heading); } &.single-tribe_events { .tribe-events-event-meta { background: none; border: 0 none; dt { font-family: var(--twentynineteen-font--heading); } .tribe-events-meta-group { padding-left: 0; &:last-of-type { padding-right: 0; } .tribe-events-single-section-title { font-size: 1.7em; } } } } &.single-tribe_events.tribe-events-page-template { #tribe-events-content { padding-left: calc(10% + 60px); padding-right: calc(10% + 60px); } .entry { margin-top: 2rem; } } .tribe-events-schedule { margin-bottom: 0.75em; margin-top: 1.5em; h2 { margin-top: 0; } } .tribe-events-loop { .tribe-events-event-meta { font-size: 0.9rem; } } .tribe-bar-views-option, #tribe-bar-views-toggle { font-family: var(--twentynineteen-font--heading); font-size: 0.75rem; } .tribe-events-tooltip { .tribe-event-duration { font-family: var(--twentynineteen-font--body); font-size: 0.85rem; } .tribe-event-description { font-family: var(--twentynineteen-font--body); font-size: 0.65rem; } h3.entry-title { font-size: 1rem; } } } /* Twenty Twenty ========================================================================== */ .tribe-theme-twentytwenty { .tribe-events-tooltip { h3.entry-title { font-size: 2.4rem; margin: 0; } } } /* = Events Retina =============================================*/ @media (min--moz-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2/1), (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) { .tribe-events-tooltip .tribe-events-arrow { background-image: url(../images/tribe-tooltips@2x.png); } #tribe-bar-filters .tribe-bar-button-search .tribe-bar-btn-small { background-image: url(../images/events-bar/icon-search@2x.png); } #tribe-events-bar { .tribe-bar-button-settings span { background-image: url(../images/events-bar/icon-gear@2x.png); } [class^='tribe-bar-button-']::after { background-image: url(../../../common/vendor/tribe-select2/select2x2.png); } } /* Default icon */ .tribe-bar-views span[class^='tribe-icon-'] { background-image: url(../images/events-bar/icon-month@2x.png); } .tribe-bar-views span.tribe-icon-list { background-image: url(../images/events-bar/icon-list@2x.png); } .tribe-bar-views span.tribe-icon-month { background-image: url(../images/events-bar/icon-month@2x.png); } .tribe-bar-views { span.tribe-icon-week { background-image: url(../images/events-bar/icon-week@2x.png); } span.tribe-icon-day { background-image: url(../images/events-bar/icon-day@2x.png); } span.tribe-icon-photo { background-image: url(../images/events-bar/icon-photo@2x.png); } span.tribe-icon-map { background-image: url(../images/events-bar/icon-map@2x.png); } } } /* Utility Classes */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute !important; width: 1px; word-wrap: normal !important; }