style.css

/*
Theme Name:  Like Television
Theme URI:   https://github.com/hwdsbcommons/tvhwdsb-theme
Description: Child theme for the TV Platform
Version:     1.0
Author:      Jared Bennett / r-a-y
Template:    gazette
Text Domain: tvhwdsb
License:     GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

body {
	background: #1b62a2;
	color: #BCDEFF;
}

.main-navigation.toggled > div {
	background: #fff;
	border: 1px solid #ddd;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.075);
	display: block;
	position: absolute;
	top: 100%;
	margin-top: 15px;
	width: 100%;
	left: 0;
	padding: 30px;
	z-index: 9998;
}

a {
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
}

button, input[type="button"], input[type="reset"], input[type="submit"] {
	background: #333;
}

/*
 * 'Add Media' button doesn't work if 'table {border-collapse: collapse}'.
 *
 * This is due to WP 4.5 upgrading jQuery to a version that exposed this bug.
 * This could be fixed by upgrading to WP 4.5.3, which upgrades jQuery or if
 * we change our CSS.  We're going with the CSS fix for now.
 *
 * See the following for more info:
 * https://core.trac.wordpress.org/ticket/36533#comment:3
 */
table {
	border-collapse: separate;
}
#primary table,
#tertiary table, {
	border-collapse: collapse;
}

#primary, #tertiary {
	color: #fff;
}

h2 {
	color: #fff;
}

.page-header {
	position: relative;
}

.entry-summary {
	margin-top: 10px;
}

.post-media embed, .post-media iframe, .post-media object, .post-media video {
	max-height: none;
}

.vp_video .post-thumbnail {
	min-height: 158px;
}

#primary .vp_video .post-thumbnail:before {
	content: "\f219";
	color: #fff;
	display: block;
	font-family: "dashicons";
	font-size: 90px;
	font-weight: normal;
	margin-bottom: -135px;
	position: relative;
	text-align: center;
	top: 15px;
}

.vp_video .post-thumbnail img {
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.post-thumbnail .duration {
	background: #000;
	bottom: 0;
	font-size: 14px;
	opacity: .8;
	padding: 1px 4px;
	position: absolute;
	right: 0;
}

/* Replace #777 with something more complementary to our background. Will need to clean this up as some are probably superfluous */
caption {
	color: #BCDEFF;
}

.social-navigation a, .post-navigation .meta-nav {
	color: #BCDEFF;
}

/* Recent Posts */
.widget_recent_entries .post-date {
	color: #BCDEFF;
}

/* RSS */
.widget_rss cite,
.widget_rss .rss-date {
	color: #BCDEFF;
}

.footer-text {
color: #BCDEFF;
}

.content-area .entry-meta, .content-area .entry-meta a {
color: #BCDEFF;
}

/* Entry Footer */
.entry-footer, .entry-footer a {
	color: #BCDEFF;
}

/* Page Links */
.page-links, .page-links > .page-links-title {
	color: #BCDEFF;
}

/* Author Info */
.author-info .author-title {
	color: #BCDEFF;
}

.bypostauthor .fn {
	background: #1b62a2;
}

.comment-list .comment-reply-title small,
.comment-metadata,
.comment-reply-link,
.comment-author-link {
	color: #BCDEFF;
}

.comment-metadata a,
.comment-list .comment-reply-title small a {
	color: #BCDEFF;
}

.wp-caption, .gallery-caption {
	color: #BCDEFF;
}

.site-content .jetpack-recipe .jetpack-recipe-meta {
	color: #BCDEFF;
}

/* First Pass at Fixing long titles */
.entry-title {
	word-break: keep-all;
	overflow-wrap: normal;
	word-wrap: break-word;
	-webkit-hyphens: manual;
	-moz-hyphens: manual;
	-ms-hyphens: manual;
	hyphens: manual;
	text-overflow: ellipsis;
}

/* Single video page */
body.single-vp_video .site-main {
	padding-top: 30px;
}

body.single-vp_video .entry-meta a {
	color: #fff;
}

body.single-vp_video .vp-edit-link {
	margin-top: 1em;
}

/* Single video page - Playlist */
body.single-vp_video #tab-4 p,
div.selectize-control.vp-playlist-select {
	margin-bottom: 1em;
}

/* Single playlist page */
div.vp-playlist-edit,
div.vp-playlist-embed {
	margin-bottom: 0;
}

a.vp-playlist-edit,
a.vp-playlist-embed {
	border-radius: 6px;
	line-height: 1;
	padding: 6px;
	position: absolute;
	right: 0;
}

a.vp-playlist-edit {
	top: 3.3em;
}

a.vp-playlist-embed {
	top: .6em;
}

/* Edit video page */
#titlediv #titlewrap #title {
	width: 100%;
}

#publishing-action {
	margin-bottom: 1em;
}

/* Playlist widget */
#widget-playlist h2 {
	margin-bottom: 0;
}

#widget-playlist .playlist-meta {
	margin-bottom: .5em;
}

#widget-playlist ol {
	border-bottom: 1px solid #eee;
	list-style-position: outside;
}

#widget-playlist li {
	position: relative;
}

#widget-playlist li img {
	float: none;
	height: 50px;
	vertical-align: middle;
}

#widget-playlist li.currently-playing a:first-child:before {
	content: "\f522";
	font-family: dashicons;
	font-size: 3em;
	position: absolute;
	width: 75px;
	text-align: center;
	left:0;
	top: 0;
}

#widget-playlist li a.playlist-video-title,
#widget-playlist li a.playlist-author-link {
	display: inline-block;
	margin-bottom: -5px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 40%;
}

#widget-playlist li a.playlist-author-link {
	color: #BCDEFF;
	font-weight: normal;
	margin-left: .3em;
}

@media screen and (max-width: 506px) {
	#widget-playlist li img {
		float: left;
	}

	#widget-playlist li a.playlist-video-title,
	#widget-playlist li a.playlist-author-link {
		width: calc(100% - 80px);
	}
}

@media screen and (min-width: 960px) {
	#widget-playlist li img {
		float: left;
	}

	#widget-playlist li a.playlist-video-title,
	#widget-playlist li a.playlist-author-link {
		width: 190px;
	}
}


/* Jetpack Related Posts */
.hentry div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post-context {
	color: #BCDEFF;
}

div#jp-relatedposts {
	border: 0;
	margin-top: 0;
	padding-top: 0;
	width: auto;
}

div#jp-relatedposts::before {
	display: none;
}

body.single-vp_video #jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post {
	width: 100%;
}

/* Tabs */
ul.tabs{
	list-style: none;
	margin: 0px;
	padding: 0px;
}

ul.subtabs {
	border-bottom: 1px solid #fff;
	margin-bottom: 2.5em;
	margin-top: -3em;
}

ul.tabs li,
ul.subtabs li {
	background: none;
	cursor: pointer;
	display: inline-block;
	padding: 5px 15px;
}

ul.tabs li.current{
	background: #fff;
	border-radius: 6px 6px 0px 0px;
	color: #222;
}

ul.subtabs li.current {
	font-weight: bold;
}

.tab-content{
	background: #fff;
	display: none;
	padding: 20px 15px 15px 15px;
}

.tab-content.current,
.tab-content a {
	color: #222;
	display: inherit;
}

.tab-link a {
	background: inherit;
	color: inherit;
	font-weight: inherit;
}

body.author .page-header {
	padding-bottom: 0;
}

body.tax-vp_playlist .page-header {
	padding-bottom: .75em;
}

body.tax-vp_playlist .page-header {
	margin-bottom: .5em;
}


body.author .tab-container {
	margin-top: 2em;
}

/* Alerts */
body.single-vp_video #message,
body.single-vp_video .alert {
	margin-top: 2rem;
}

body.author.archive #message {
	margin: -1rem 0 2em;
}

/* Searchwp ajax results */
.searchwp-live-search-result a {
	color: #1b62a2;
}

.igrowl-title, .igrowl-message {
	font-family: sans-serif;
	font-size: .8em;
	line-height: 1.3;
}