/* VIEW PAGES */ .entry-content { display: inline-block; position: relative; width: 100%; height: auto; box-sizing: border-box; } .entry-content p { display: block; position: relative; padding: 0; margin: 1rem 0 0 0; font-size: 1.125rem; line-height: 1.75rem; font-weight: 300; } .entry-content ul li { font-size: 1.125rem; line-height: 1.5rem; font-weight: 300; margin-bottom: 0.5rem; } .entry-date { display: block; position: relative; overflow: hidden; font-size: 0.875rem; margin: 0 0 1rem 0; color: #666; } .date-now-streaming { color: #cc0000; } .entry-excerpt { display: block; position: relative; font-size: 1.25rem; margin: 0.5rem 0; color: #424242; font-weight: 400; } .entry-subtitle { font-size: 1.75rem; text-transform: uppercase; color: #424242; margin-bottom: 1rem; display: block; position: relative; } .entry-image.filmmaker { float: left; width: 20rem; margin: 1.5rem 1rem 0.5rem 0; } .streaming-info { text-align: center; padding: 1rem; } .streaming-excerpt p { margin-bottom: 1.875rem; } .streaming-info img { margin: 1rem auto; } .listing-item-link .streaming-info .streaming-info-logo { padding-bottom: 0!important; } .streaming-info .streaming-title { font-size: 1.5rem; line-height: 2rem; font-weight: 500; color: #444; margin: auto; } .streaming-info .streaming-info-desc { font-size: 1rem; line-height: 1.5rem; font-weight: 100; color: #000; } /* EMBEDDED ELEMENTS */ .entry-gem-card { display: block; position: relative; width: 100%; height: 0px; padding-bottom: 50%; overflow: hidden; } .entry-gem-card.compact { height: 4.5rem; padding: 0; } .entry-gem-card-iframe { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:none; } /* EPISODE GEM CARDS */ .episode-gem-card { max-width: 720px; display: block; margin: 0 auto; -webkit-font-smoothing: antialiased; transition: all ease-in-out 200ms; box-sizing: border-box; } .episode-gem-card.standard { border-radius: 2px 2px; box-shadow: 1px 1px 0.5rem 0 #747474; } .episode-gem-card.compact { } .episode-gem-card:hover { cursor: pointer; transition: all ease-in-out 200ms; } .episode-gem-card .card-image { display: block; flex-wrap: nowrap; position: relative; overflow: hidden; margin: 0; padding: 0; box-sizing: border-box; width: 100%; height: auto; } .episode-gem-card.standard .card-image { object-fit: contain; } .episode-gem-card.compact .card-image { max-height: 4.5rem; display: flex; } .episode-gem-card.compact .card-image img { display: inline-block; position: relative; height: 4.5rem; width: 8rem; overflow: hidden; } .episode-gem-card.standard .card-image img { width: 100%; transition: all ease-in-out 200ms; display: block; position: relative; height: auto; } .episode-gem-card.compact .card-image figcaption { display: inline-block; position: relative; padding: 0.5rem 1rem; margin: 0; background-color: #cc0000; width: calc(100% - 10rem); border-top: 1px solid #660000; border-bottom: 1px solid #660000; } .episode-gem-card.standard .card-image figcaption { padding: 0.5rem 0.5rem; transition: all ease-in-out 200ms; color: white; position: absolute; display: block; bottom: 0; left: 0; z-index: 2; background: rgba(0,0,0,0.6); width: 100%; box-sizing: border-box; } .episode-gem-card.standard .card-image figcaption .card-show-title { font-weight: 600; margin: 0; } .episode-gem-card.standard .card-image figcaption .card-episode-title { font-weight: 600; margin: 0; color: darkgray; font-size: 15px; } .episode-gem-card .playIcon { position: absolute; top: 50%; transform: translate(-50%, -50%); z-index: 2; color: white; transition: all ease-in-out 200ms; text-shadow: black 0px 0px 5px; } .episode-gem-card.compact .playIcon { left: 4rem; margin-right: -50%; font-size: 2em; } .episode-gem-card.standard .playIcon { left: 50%; margin-right: -50%; font-size: 4em; } .episode-gem-card:hover .playIcon { cursor: pointer; color: rgba(255,255,255,0.6); transition: all ease-in-out 200ms; } .episode-gem-card .card-show-title { font-weight: 800; margin: 0; padding: 0; font-size: 1.25rem; line-height: 1.5rem; color: #fff; text-decoration: none; } .episode-gem-card .card-episode-title { font-weight: 600; margin: 0; padding: 0; color: rgba(255,255,255,0.7); font-size: 1rem; text-decoration: none; } .episode-gem-card .card-header { display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; padding: 0; text-transform: uppercase; font-weight: 700; background-color: #cc0000; color: white; text-align: center; height: 2.5rem; } .episode-gem-card .card-header .card-title { display: inline; margin: 0 !important; font-size: 1.25rem; font-weight: 600; } /* RELATED LINKS */ .entry-element-container.related-links h3 { margin-top: 1rem; } .entry-related-link { display: grid; position: relative; box-sizing: border-box; margin: 0; padding: 0.5rem 1rem; width: 100%; align-items: center; text-decoration: none; color: #046B99; grid-template-columns: 2.5rem 1fr; grid-column-gap: 0.5rem; } .entry-related-link .link-text:hover { text-decoration: underline; } .entry-related-link .link-text { display: block; position: relative; box-sizing: border-box; font-size: 1rem; line-height: 1.25rem; font-weight: 600; } .entry-related-link .link-thumbnail { display: block; position: relative; width: 100%; height: auto; box-sizing: border-box; } .entry-related-link .link-bullet { } /* ENTRY AUTHOR */ .entry-author { display: flex; position: relative; width: 100%; height: auto; flex-wrap: nowrap; box-sizing: border-box; margin-bottom: 2rem; } .entry-author .author-image { display: inline-block; position: relative; width: 4rem; height: 4rem; border-radius: 50%; margin-right: 1rem; box-sizing: border-box; } .entry-author .author-info { display: grid; position: relative; width: calc(100% - 6rem); box-sizing: border-box; } .author-info .author-name { font-size: 1rem; font-weight: 700; line-height: 1.25rem; } .author-info .author-position { font-size: 0.875rem; font-weight: 500; font-style: italic; line-height: 1rem; } .author-info .author-bio { margin-top: 0.25rem; font-size: 0.75rem; line-height: 0.875rem; color: #666666; } /* EXPANDING CONTAINER */ .expanding-container { display: block; position: relative; width: 100%; height: auto; box-sizing: border-box; margin: 1rem 0 2rem 0; padding: 0.5rem 1rem 1rem 1rem; background-color: #fafafa; } .expanding-container .expanding-container-title h3 { margin-top: 0.5rem; } .expanding-container-title h3, .expanding-container-title span { display: inline-block; margin-bottom: 2rem; } .expanding-container-title span { margin-left: 0.75rem; } .expanding-container-title .fa-plus-circle { font-size: 1.3rem; color: #e60505; } .expanding-container-button:hover { cursor: pointer; } button.expanding-container-button { margin-left: 1rem; width: 3rem; height: 1.2rem; font-size: 1rem; } .expanding-container-hide-show { margin-top: 2rem; } .element-entry-container.expanding-container { display: block; position: relative; width: 100%; height: auto; box-sizing: border-box; margin: 1rem 0 2rem 0; padding: 0.5rem 1rem 1rem 1rem; background-color: #fafafa; } .expanding-container-title h3, .expanding-container-title button { margin: 0; } .expanding-container-title button { margin-left: 0.75rem; background: transparent; border: none; width: 1.3rem; height: 1.3rem; box-sizing: border-box; display: inline-block; padding: 0; } /* ENTRY CONTAINERS */ .entry-element-container { display: block; position: relative; box-sizing: border-box; overflow: initial; margin: 1rem 0 0 0; } .entry-element-container h3 { margin-top: 2rem; } .entry-element-container .streaming-header { font-size: 1.25rem; line-height: 1.5rem; font-weight: 600; margin: 2rem 0 0 0; } .entry-element-container a { text-decoration: none; color: #046B99; } .entry-element-container a:hover { color: #046B99; } .entry-element-container a.gem-card-link { text-decoration: none; } .entry-element-container.gem-card { margin-bottom: 2rem; } .entry-element-container.gem-card.standard { margin: 2rem auto; } .entry-element-container.image, .entry-element-container.image-grid, .entry-element-container.youtube-embed, .entry-element-container.cbc-media { margin: 2rem 0; } .entry-element-container.bottom-border { padding-bottom: 1rem; margin-bottom: 2rem; border-bottom: 1px solid #dadada; } /* PULL QUOTES */ .collection-item-quote { display: block; position: relative; margin: 2rem 4rem; overflow: hidden; } .entry-pullquote { font-family: 'Open Sans Condensed', serif; font-weight: 500; display: flex; position: relative; margin: 2rem auto; overflow: hidden; flex-wrap: wrap; align-items: center; width: 100%; max-width: calc(100% - 12rem); } .entry-pullquote.open, .entry-pullquote.close { margin: 1rem auto; width: 100%; flex-wrap: nowrap; } .entry-pullquote hr { width: 100%; max-width: calc(50% - 2rem); border: none; margin: 0; height: 1px; color: #ccc; background-color: #ccc; } .entry-pullquote.excerpt hr { width: 100%; max-width: 100%; border: none; margin: 0; height: 1px; color: #ccc; background-color: #ccc; } .entry-pullquote-character { display: inline-block; position: relative; max-width: 8rem; overflow: hidden; padding: 0 0.5rem; opacity: 0.42; } .entry-pullquote-character svg { width: 100%; height: auto; } .entry-pullquote-character svg .quote-fill { fill: #000; } .entry-pullquote-character.open { vertical-align: top; } .entry-pullquote-character.close { vertical-align: bottom; transform: rotate(180deg); } .entry-pullquote-content { font-family: 'Open Sans Condensed', serif; display: block; position: relative; width: 100%; max-width: calc(100% - 16rem); margin: 0 auto; font-size: 2rem; line-height: 2.75rem; font-weight: 500; font-style: italic; } .entry-pullquote-content p { padding: 0; margin: 0 auto; width: fit-content; } .entry-pullquote-content.author { font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 1.25rem; line-height: 1.75rem; color: #545454; padding-top: 0.5rem; text-align: right; font-style: normal; padding-left: 4rem; max-width: calc(100% - 20rem); } /* RELATED LINKS */ .related-links { display: block; position: relative; overflow: hidden; width: 100%; height: auto; box-sizing: border-box; margin: 1rem 0 2rem 0; padding: 0.5rem 1rem 1rem 1rem; background-color: #fafafa; } /* GEM PUSH LINK -- DEPRECATE */ .linkContainer { font-family: "Open Sans"; max-width: 720px; display: block; margin: auto; -webkit-font-smoothing: antialiased; transition: all ease-in-out 200ms; text-decoration: none; } .linkContainer p, .containerTitle { margin: 0; } .linkContainer:hover { cursor: pointer; transition: all ease-in-out 200ms; text-decoration: none !important; } .linkContainer:hover .showTitle { text-decoration: underline; } .linkImage { display: flex; position: relative; overflow: hidden; width: 100%; height: auto; max-height: 4.5rem; flex-wrap: nowrap; margin: 0; padding: 0; } .linkImage img { display: inline-block; position: relative; height: 4.5rem; width: 8rem; overflow: hidden; } .linkImage figcaption { display: inline-block; position: relative; padding: 0.5rem 1rem; margin: 0; background-color: #cc0000; width: calc(100% - 8rem); border-top: 1px solid #660000; border-bottom: 1px solid #660000; box-sizing: border-box; } .playIcon { position: absolute; top: 50%; left: 4rem; margin-right: -50%; transform: translate(-50%, -50%); z-index: 2; color: white; font-size: 2em; transition: all ease-in-out 200ms; text-shadow: black 0px 0px 5px; } .linkContainer:hover .playIcon { color: rgba(255,255,255,0.6); transition: all ease-in-out 200ms; } .showTitle { font-weight: 800; margin: 0; padding: 0; font-size: 1.25rem; line-height: 1.5rem; color: #fff; text-decoration: none; } .episodeTitle { font-weight: 600; margin: 0; padding: 0; color: rgba(255,255,255,0.85); font-size: 1rem; text-decoration: none; } /* TWITTER, INSTAGRAM AND FACEBOOK EMBEDS */ .entry-element-container .twitter-tweet { margin: 0 auto; } .entry-element-container .instagram-media { margin: 0 auto!important; } .entry-element-container .fb-post { margin: 0 auto; display: flex; max-width: 550px; width: 100%; margin-top: 2rem; margin-bottom: 2rem; } /* OVERRIDE DATE MESSAGE */ .override_date_message { display: block; text-transform: uppercase; }