/*
Theme Name: CRL v3
Author: James (hat tip Ali Jafarian)
Description: Custom theme based off of WP TwentyThirteen
Version: 3.0

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


/* Table of Contents
========================================================================================================== */
/*
01: Global
02: Header
03: Content
04: Footer
05: Forms
06: Tables
07: Bootstrap Over-rides
08: Responsive (Media Queries)
/*


/* Global
========================================================================================================== */
/* ---------- Reset ---------- */
html,body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	text-align: left;
	background: transparent;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

body {font-family: 'Roboto', Arial, sans-serif; font-weight: 300; background: #eee; color: #777;}
h1, h2, h3, h4, h5, h6, p {margin: 0 0 20px;}
h1, h2, h3, h4, h5, h6 {font-family: 'Roboto Condensed', sans-serif; color: #333;}
h1 {font-size: 4em; letter-spacing: -1px; margin: 0 0 15px;}
h2 {font-size: 3em; letter-spacing: -1px;}
h3 {font-size: 2em; font-weight: 700;}
h4 {font-size: 1.4em;}
h5 {font-size: 1.2em;}
h6 {font-size: 1em;}
p {
	font-size: 1em;
	line-height: 1.6em;
}
p.headline {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1.8em;
	font-weight: 300;
	color: #333;
}

pre {
	padding: 5px 0;
	margin: 0 0 20px;
	background: #000;
	color: #999;
	font-size: .85em;
}

span.code-text {
	background: #f5f5f5;
	padding: 5px 3px 3px;
	border: 1px solid #ddd;
	font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
	color: #f60;
	font-size: .85em;
	vertical-align: middle;
}
.alert span.code-text {
	background: none;
	border: none;
	vertical-align: baseline;
}

blockquote {
	padding: 30px;
  	margin: 0 0 30px;
  	background: #f5f5f5;
  	font-size: 1.8em;
  	color: #999;
  	clear: both;
}

.clear {
	clear: both;
}

hr.thick {
	border-top-width: 5px;
}

.embed {
	margin: 0 0 30px;
}

.btn {
	line-height: 1.5em;
	padding: 10px;
}
.btn.demo {
	background: #06c;
	color: #fff;
}
.btn.demo:hover {
	background: #000;
}
.btn.download {
	background: #09c;
	color: #fff;
}
.btn.download:hover {
	background: #000;
}
.btn.share {
	background: #eee;
	color: #08c;
	border: 1px solid #09c;
}
.btn.share:hover {
	background: #666;
	color: #fff;
	border: 1px solid #666;
}

.icon-container {
	display: inline-block;
	padding: 10px;
	margin: 0 5px 0 0;
	background: #333;
	border-radius: 100px;
	-moz-border-radius: 100px;
	-webkit-border-radius: 100px;
}
.icon-container i,
.icon-container span {
	color: #fff;
}
.icon-container.container-number {
	padding: 9px 18px;
	color: #fff;
}
.icon-left {
	margin-right: 5px;
}
.icon-right {
	margin-left: 5px;
}

.screen-reader-text {
	display: none;
}

.nav-social {
	list-style: none;
	font-size: 1.2em;
	padding: 10px;
}
.nav-social li {
	display: inline-block;
	margin: 0 5px 0 0;
}
.nav-social li a {
	display: inline-block;
	line-height: 1;
	width: 35px;
	padding: 7px;
	color: #666;
	text-decoration: none;
	text-align: center;
}
.nav-social li.facebook a {
	color: #4c66a4;
}
.nav-social li.twitter a {
	color: #55acee;
}
.nav-social li.linkedin a {
	color: #0e7cb7;
}
.nav-social li a:hover {
	color: #fff !important;
}

.brand {
	padding: 15px;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1.2em;
	font-weight: 300;
	background: #333;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
}
.brand span {
	font-weight: 700;
	color: #999
}
.brand:hover,
.brand span:hover {
	color: #fff;
	text-decoration: none;
}

.screen-reader-response {
	display: none;
}

.block-image {
	display: block;
	width: 100%;
	margin: 0 0 20px;
}

.rsp-grid {
	list-style: none;
	padding: 2%;
	margin-left: -2%;
	font-size: 0px;
}
.rsp-grid .grid-container {
	display: inline-block;
	width: 31.33%;
	margin: 0 0 2% 2%;
	border: 1px solid #ddd;
	border-bottom-width: 2px;
	font-size: 16px;
	font-size: 1rem;
	vertical-align: top;
}
.rsp-grid .grid-container.container-25 {
	width: 23%;
}
.rsp-grid .grid-container.container-50 {
	width: 50%;
}

.color-container {
	padding: 20px;
}


/* 02: Header
========================================================================================================== */
#wpadminbar {
	display: none !important;
}

/* mobile header */
.mobile-header {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 45px;
	background: #151515;
	z-index: 50;
}
.mobile-header .mobile-nav-toggle {
	position: absolute;
	top: 0;
	left: 0;
	height: 45px;
	padding: 6px 15px;
	background: #333;
	color: #fff;
	font-size: 1.4em;
	text-align: center;
	z-index: 60;
}
.mobile-header .brand {
	display: block;
	height: 45px;
	padding: 8px;
	background: #151515;
	text-align: center;
}

/* left nav */
.site-nav {
	position: fixed;
	left: 0;
	top: 0;
	width: 20%;
	height: 100%;
	background: #000;
	z-index: 1000;
	-webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
.site-nav .logo {
	float: left;
	display: block;
	width: 100px;
	padding: 15px 25px;
	background: #666;
}
.site-nav .nav-brand {
	/* float: left; */
	display: block;
	padding: 25px;
	background: #000;
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1.3em;
	font-weight: 300;
	text-transform: uppercase;
}
.site-nav .nav-brand span {
	font-weight: 700;
}
.site-nav .nav-brand:hover {
	color: #ccc;
	text-decoration: none;
}
.site-nav .mobile-header {
	display: none; /* show with JS */
}
.site-nav .mobile-nav-toggle {
	color: #fff;
	font-size: 1.2em;
	padding: 10px 19px;
}
.site-nav .brand {
	display: block;
	text-align: center;
}

.site-nav .nav-menu ul {
	list-style: none;
	font-size: 1em;
}
.site-nav .nav-menu ul li {
	/* float: left; */
	position: relative;
	border-bottom: 1px solid #333;
}
.site-nav .nav-menu ul li a {
	position: relative;
	display: block;
	padding: 20px 20px 20px 50px;
	color: #999;
	line-height: 1.5em;
	text-decoration: none;
}
.site-nav .nav-menu ul li a:hover {
	background: none;
	color: #fff;
}
.site-nav .nav-menu ul li a .menu-icon {
	position: absolute;
	top: 19px;
	left: 10px;
	width: 40px;
	color: #999;
	text-align: center;
	-webkit-transition: all .5s ease; /* Safari and Chrome */
    -moz-transition: all .5s ease; /* Firefox */
    -ms-transition: all .5s ease; /* IE 9 */
    -o-transition: all .5s ease; /* Opera */
    transition: all .5s ease;
}
.site-nav .nav-menu ul li:hover a .menu-icon {
	font-size: 1.5em;
}
.site-nav .nav-menu ul li a:hover .menu-icon {
	color: #fff;
}
.site-nav .nav-menu ul li.about a .menu-icon {color: #cfcece;}
.site-nav .nav-menu ul li.show-archive a .menu-icon {color: #cfcece;}
.site-nav .nav-menu ul li.movie-lists a .menu-icon {color: #cfcece;}
.site-nav .nav-menu ul li.movie-games a .menu-icon {color: #cfcece;}
.site-nav .nav-menu ul li.contact a .menu-icon {color: #cfcece;}
.site-nav .nav-menu ul li a .arrow-icon {
	position: absolute;
	top: 15px;
	right: 15px;
	opacity: .5;
}
.site-nav .nav-menu ul li ul.drop-down {
	display: none;
	position: absolute;
	top: 54px;
	left: 0;
	width: 200px;
	background: rgba(0, 0, 0, .80);
	font-size: .9em;
	font-weight: 400;
	text-transform: none;
}
.site-nav .nav-menu ul li:hover ul.drop-down {
	display: block;
}
.site-nav .nav-menu ul li ul.drop-down li {
	float: none;
	display: block;
	border-top: 2px solid rgba(255, 255, 255, .10);
}
.site-nav .nav-menu ul li ul.drop-down li:first-child {
	border-top: none;
}
.site-nav .nav-menu ul li ul.drop-down li.list-title {
	padding: 15px;
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
}
.site-nav .nav-menu ul li.tutorials ul.drop-down {
	border-left: 2px solid #690;
}
.site-nav .nav-menu ul li.articles ul.drop-down {
	border-left: 2px solid #099;
}
.site-nav .nav-menu ul li.life ul.drop-down {
	border-left: 2px solid #c60;
}
.site-nav .nav-menu ul li ul.drop-down li a {
	padding: 15px;
	color: #999;
}
.site-nav .nav-menu ul li ul.drop-down li a:hover {
	background: rgba(0, 0, 0, .5);
	color: #fff;
}

.site-nav .search-container {
	margin: 20px 10px;
}
.site-nav .search-container label {
	vertical-align: top;
}
.site-nav .search-container input[type="search"] {
	width: 85%;
	height: 30px;
	padding: 10px;
	background: #fff;
	font-size: .85em;
	border: none;
	border-radius: 0;
	vertical-align: top;
}
.site-nav .search-container input[type="search"]:focus {
	color: #000;
	margin: 0;
	outline: none;
}
.site-nav .search-container .btn,
.site-nav .search-container input[type="submit"] {
	display: inline-block;
	vertical-align: top;
	padding: 5px 9px 4px;
	margin: 0;
	background: #cf6;
	color: #000;
	cursor: pointer;
	border: none;
	border-radius: 0;
}
.site-nav .search-container .btn:hover,
.site-nav .search-container input[type="submit"]:hover {
	background: #690;
	color: #cf6;
}


/* 03: Content
========================================================================================================== */
#wrapper {
	margin: 0 auto 0 20%;
	background: #f5f5f5;
}
#wrapper > .container {
	padding: 0;
}
/*
.single #wrapper {
	margin: 0 260px;
}
*/
	
.main {
	min-height: 600px;
}
.main.feed {
	background: #
}
.main ul.standard-list {
	list-style: square;
	margin: 0 0 20px 18px;
	font-size: .9em;
	color: #333;
}
.main ul.standard-list li {
	margin: 0 0 15px;
}
.main ol.steps {
	font-size: .85em;
	font-weight: bold;
	margin: 0 0 20px 20px;
	color: #333;
}
.main ol.steps li {
	margin: 0 0 10px;
}
.main ul.points {
	list-style: none;
	margin: 0 0 20px;
}
.main ul.points li {
	margin: 0 0 10px;
}
.main ul.points li strong {
	color: #000;
}

.icon-list {
	list-style: none;
	font-size: 1.2em;
	color: #333;
	margin: 0 0 30px;
}
.icon-list li {
	position: relative;
	padding: 0 0 0 40px;
	margin: 0 0 15px;
}
.icon-list li i {
	position: absolute;
	top: 5px;
	left: 0;
	width: 30px;
	text-align: center;
}
.icon-list.list-color-green li i {
	color: #690;
}

.page-content {
	padding: 20px 7%;
	background: #fff;
}
.page-content img {
	display: block;
	max-width: 100%;
	height: auto;
}
.page-content p.post-date {
	display: inline-block;
	margin: 0 20px 10px 0;
}

.hero {
	padding: 350px 20px 50px;
	background: url(images/hero-bg-001.jpg) bottom center no-repeat #333;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
}
.hero .hero-thumb {
	display: block;
	width: 240px;
	margin: 0 auto 20px;
	border: 10px solid rgba(255, 255, 255, .25);
	border-radius: 300px;
}
.hero h1 {
	color: #f15b22;
	font-weight: 300;
	line-height: 1.4;
	text-align: center;
	text-shadow: 1px 1px #000;
}
.hero h1 .name {
	display: block;
	text-align: center;
	text-transform: uppercase;
}
.hero p {
	color: #fff;
	font-weight: 700;
	text-align: center;
}
.hero p span {
	display: inline-block;
	padding: 10px 30px;
	border-radius: 30px;
	background: rgba(0, 0, 0, .75);
	text-align: center;
}

/* ----------- Feed styling ---------- */
h1.category-title {
	font-size: 1.5em;
	font-weight: 700;
	letter-spacing: -1px;
	text-transform: uppercase;
	padding: 27px 2%;
	margin: 0;
	background: #ddd;
}

ul.posts-feed {
	list-style: none;
	padding: 2%;
	margin-left: -2%;
	font-size: 0px;
}
ul.posts-feed li {
	display: inline-block;
	width: 31.33%;
	margin: 0 0 2% 2%;
	background: #fff;
	border: 1px solid #ddd;
	border-bottom-width: 2px;
	font-size: 16px;
	font-size: 1rem;
	vertical-align: top;
}
ul.posts-feed li h2 {
	font-size: 1.5em;
	margin: 0 0 10px;
}
ul.posts-feed li h2 a {
	display: block;
	color: #333;
	text-decoration: none;
}
ul.posts-feed li h2 a:hover {
	color: rgba(241, 91, 34, 1);
}
ul.posts-feed li p {
	font-size: .85em;
	margin: 0 0 10px;
}
ul.posts-feed li p:last-child {
	margin: 0;
}

.post-content {
	padding: 10px;
}
.post-category {
	display: inline-block;
	padding: 3px 10px;
	margin: 0 0 5px;
	font-size: .75em;
	background: #333;
	color: #777;
}
.category-tutorials .post-category {
	background: #690;
}
.category-articles .post-category {
	/*background: #f15b22;*/
	background: #eee;
}
.category-life .post-category {
	background: #c60;
}

.featured-image-container {
	position: relative;
	overflow: hidden;
	background: #000;
}
.featured-image-container .date-stamp {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 10px;
	background: rgba(0, 0, 0, .5);
	z-index: 10;
}
.featured-image-container .flag-demo {
	position: absolute;
	top: 15px;
	left: 0;
	display: inline-block;
	padding: 5px 15px;
	background: rgba(241, 91, 34, .75);
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	z-index: 11;
}
.featured-image-container img {
	display: block;
	max-width: 100%;
	height: auto;
	-webkit-transition: all .5s ease; /* Safari and Chrome */
    -moz-transition: all .5s ease; /* Firefox */
    -ms-transition: all .5s ease; /* IE 9 */
    -o-transition: all .5s ease; /* Opera */
    transition: all .5s ease;
}
.featured-image-container img:hover {
	-webkit-transform:scale(1.15); /* Safari and Chrome */
    -moz-transform:scale(1.15); /* Firefox */
    -ms-transform:scale(1.15); /* IE 9 */
    -o-transform:scale(1.15); /* Opera */
     transform:scale(1.15);
     opacity: .5;
}

.date-stamp span {
	display: inline-block;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	color: #fff;
	line-height: 1em;
}
.date-stamp span.month {
	font-size: 1em;
	font-weight: 700;
	text-transform: uppercase;
}
.date-stamp span.day {
}
.date-stamp span.year {
	padding-right: 10px;
	margin-right: 3px;
	border-right: 1px solid rgba(255, 255, 255, .5);
}

p.form-allowed-tags {
	display: none;
}


/* ---------- Posts ---------- */
.page-header {
	width: 100%;
	padding: 0;
	margin: 0;
	border-bottom: none;
}
.page-header.page h1 {
	margin: 0 0 10px;
	text-transform: uppercase;
}

/* post headers */
.post-header {
	position: relative;
	background: #333;
}
/*
.post-header.category-tutorials {
	background: #690;
}
.post-header.category-articles {
	background: #099;
}
.post-header.category-life {
	background: #c60;
}
*/
.post-header .featured-image-container {
	display: block;
}
.post-header .featured-image-container img {
	display: block;
	width: 100%;
	opacity: .75;
}
.post-header .featured-image-container .post-title {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: rgba(0, 0, 0, .5);
}
.post-header .featured-image-container .post-title h1 {
	padding: 15px;
	margin: 0;
	color: #fff;
	text-shadow: none;
}
.post-info {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 100px 50px 50px;
	background: -webkit-gradient(linear, center top, center bottom, from(transparent), to(rgba(0,0,0,0.75)));
	background: -webkit-linear-gradient(transparent, rgba(0,0,0,0.75));
	background: -moz-linear-gradient(transparent, rgba(0,0,0,0.75));
	background: -o-linear-gradient(transparent, rgba(0,0,0,0.75));
	background: linear-gradient(transparent, rgba(0,0,0,0.75));

}
.post-info h1 {
	color: #fff;
	text-align: center;
}
.post-info .date-stamp {
	font-size: 1.5em;
	text-align: center;
	padding: 0 0 15px;
	margin: 0 0 15px;
	border-bottom: 1px solid rgba(255, 255, 255, .15);
}
.post-info .post-categories {
	list-style: none;
	font-size: .85em;
	font-weight: 700;
	text-align: center;
	padding: 0 0 10px;
	margin: 0 0 15px;
	border-bottom: 1px solid rgba(255, 255, 255, .15);
}
.post-info .post-categories li {
	display: inline-block;
	margin: 0 1px 5px 0;
}
.post-info .post-categories li a {
	display: inline-block;
	padding: 5px 10px;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .5);
	border-radius: 3px;
	text-decoration: none;
}
.post-info .post-categories li a:hover {
	background: #fff;
	color: #333;
}

ul.share-nav {
	list-style: none;
	text-align: center;
}
ul.share-nav li {
	display: inline-block;
	margin: 0 1px 5px 0;
}
ul.share-nav li a {
	display: inline-block;
	width: 36px;
	padding: 9px;
	text-decoration: none;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .5);
	text-align: center;
	line-height: 1;
	border-radius: 100px;
	-moz-border-radius: 100px;
	-webkit-border-radius: 100px;
}
ul.share-nav li a:hover {
	background: #fff;
	color: #333;
}
ul.share-nav .tooltip-inner {
	padding: 7px 10px;
}

.demo-links .btn {
	padding: 10px 20px;
	margin: 0 1px 5px 0;
	background: #08c;
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
}
.demo-links .btn:hover {
	background: #036;
}
.demo-links .btn i {
	margin-right: 5px;
}

.right-sidebar {
	float: left;
	width: 25%;
	padding: 0 20px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.right-sidebar h5 {
	padding: 10px;
	margin: 0;
	background: #eee;
	font-weight: 700;
	text-transform: uppercase;
	color: #333;
}
.right-sidebar h5 i {
	margin-right: 3px;
}
.right-sidebar ul.nav {
	margin: 0 0 30px;
	font-size: .8em;
}
.right-sidebar ul.nav li {
	border-bottom: 1px solid #ccc;
}
.right-sidebar ul.nav li:first-child {
	border-top: 1px solid #ccc;
}
.right-sidebar ul.nav li a {
	padding: 10px;
	color: #09c;
}
.right-sidebar ul.nav li a:hover {
	background: #000;
	color: #cf6;
}
.right-sidebar ul.nav li a i {
	float: right;
	margin-top: 2px;
}

.card {
	margin: 0 0 20px;
	border: 1px solid #ddd;
	box-shadow: 0 0 5px #ddd;
}
.card img {
	display: block;
	
}
.card h5,
.card p {
	margin: 20px;
}
.card.card-green {
	border-bottom: 5px solid #690;
}
.card.card-blue {
	border-bottom: 5px solid #6cf;
}
.card.card-blue-dark {
	border-bottom: 5px solid #036;
}

/* ---------- Stories ---------- */
.story-title {
	font-weight: 700;
}
.story-title .title-desc {
	font-weight: 300;
}
.story-image {
	position: relative;
	margin: 50px 0;
}
.story-image br {
	display: none;
}
.story-image .image-caption {
	position: absolute;
	padding: 10px 20px;
	background: rgba(0, 0, 0, .5);
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	z-index: 10;
}
.story-image .image-caption.caption-bottom-left {
	bottom: 30px;
	left: 0;
}
.story-image .image-caption.caption-bottom-right {
	bottom: 30px;
	right: 0;
}


/* 04: Footer
========================================================================================================== */
#footer {
	padding: 20px 0;
	margin-left: 20%;
	background: #eee;
}
#footer ul.footer-nav {
	list-style: none;
	font-size: .8em;
	margin: 0 0 20px;
}
#footer ul.footer-nav li {
	display: inline-block;
	margin-left: 20px;
}
#footer p.copyright {
	font-size: .75em;
	padding: 20px 0 10px;
	margin: 0 0 0 20px;
	border-top: 1px solid #ddd;
	color: #999;
}

.trans-modal .modal-content {
	background: rgba(255, 255, 255, .5);
	border: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	box-shadow: none;
}
.trans-modal .close {
	position: absolute;
	top: 15px;
	right: 20px;
	font-size: 3em;
	font-weight: 300;
	color: #000;
	text-shadow: none;
	z-index: 10;
	opacity: 1;
}
.trans-modal .close:hover {
	opacity: .5;
}
.trans-modal .modal-body {
	padding: 100px 50px;
}
.trans-modal input[type="search"] {
	width: 100%;
	padding: 10px;
	background: rgba(0, 0, 0, .35);
	color: #fff;
	font-size: 2em;
	font-weight: 300;
	border: none;
	outline: none;
}
.trans-modal button[type="submit"] {
	display: none;
}


/* ---------- Ads ---------- */
.ad-container {
	padding: 20px;
	margin: 0 0 20px;
	background: #f5f5f5;
	border: 1px solid #ddd;
}

/* 05: Forms
========================================================================================================== */
form div {
	margin: 0 0 10px;
}
label {
	display: block;
	font-weight: bold;
	color: #333;
	margin-bottom: 5px;
	text-shadow: 0 1px 1px #fff;
}
input {
	margin: 0;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
textarea {
	width: 100%;
	padding: 10px;
	background: #e5e5e5;
	color: #333;
	box-shadow: none;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border: none;
}
textarea {
	height: 120px;
}
input[type="submit"] {
	color: #fff;
	background: #999;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1em;
	font-weight: 400;
	padding: 10px 20px;
	border: none;
	border-radius: 5px;
	-moz-border-radius: 5px;
	cursor: pointer;
}
input[type="submit"]:hover {
	background: #000;
}

.required {
	color: #c00;
}

.feedback-form {
	padding: 15px;
	border: 2px solid #eee;
}
.feedback-form .wpcf7-list-item {
	display: inline-block;
  	margin: 0 15px 10px 0;
  	padding: 5px 10px;
  	border: 1px solid #ccc;
  	border-radius: 4px;
  	-moz-border-radius: 4px;
}

/* 06: Tables
========================================================================================================== */


/* 07: Bootstrap over-rides
========================================================================================================== */
.container {
	width: auto;
	max-width: 1600px;
	padding: 0;
}
.alert {
	padding: 10px;
}
.breadcrumb {
	background: #f5f5f5;
	font-size: .75em;
	padding: 10px 20px;
	margin: 0;
	border-radius: 0;
}
.breadcrumb p {
	margin: 0;
	text-align: center;
}
.single .breadcrumb {
	border-bottom: 1px solid #ddd;
}
.modal-backdrop.in {
	opacity: .75;
	filter: alpha(opacity=75);
}


/* Plugins
========================================================================================================== */
/* Google Code Prettify - used for tutorial markup */

/* SPAN elements with the classes below are added by prettyprint. */
.pln {color: #eee;}  /* plain text */

@media screen {
  .str {color: #d1f26c;}  /* string content */
  .kwd {color: #ca81fd;}  /* a keyword - LIGHT PURPLE */
  .com {color: #666;}  /* a comment - GREY */
  .typ {color: #f60;}  /* a type name - ORANGE */
  .lit {color: #357ffb;}  /* a literal value - BLUE */
  /* punctuation, lisp open bracket, lisp close bracket */
  .pun, .opn, .clo {color: #999;}
  .tag {color: #69cafc;}  /* a markup tag name - LIGHT BLUE */
  .atn {color: #357ffb;}  /* a markup attribute name - BLUE */
  .atv {color: #d1f26c;}  /* a markup attribute value - LIME GREEN */
  .dec, .var {color: #ff0;}  /* a declaration; a variable name - YELLOW */
  .fun {color: #f60;}  /* a function name - ORANGE */
}

/* Use higher contrast and text-weight for printable form. */
@media print, projection {
  .str {color: #060;}
  .kwd {color: #006; font-weight: bold;}
  .com {color: #600; font-style: italic;}
  .typ {color: #404; font-weight: bold;}
  .lit {color: #044;}
  .pun, .opn, .clo {color: #440;}
  .tag {color: #006; font-weight: bold;}
  .atn {color: #404;}
  .atv {color: #060;}
}

/* Put a border around prettyprinted code snippets. */
pre.prettyprint {background: #000; font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace; overflow-x: auto; margin: 0 0 20px;}
pre.prettyprint.terminal {padding: 15px; color: #999;}

/* Specify class=linenums on a pre to get line numbering */
ol.linenums {margin-top: 0; margin-bottom: 0; padding-left: 40px;} /* IE indents via margin-left */
ol.linenums li {color: #666; margin: 0; padding: 5px;}

/* Alternate shading for lines */
li.L1,
li.L3,
li.L5,
li.L7,
li.L9 {background: #222;}

/* PageNavi Pagination */
.wp-pagenavi {
	clear: both;
	font-size: .75em;
	margin: 20px 0 0;
	padding: 18px 10px;
	line-height: 1.5em;
	border: 1px solid #ddd;
}
.wp-pagenavi a, .wp-pagenavi span {
	text-decoration: none;
	background: #f5f5f5;
	border: 1px solid #ccc;
	padding: 7px 10px !important;
	margin: 2px;
	border-radius: 3px;
	-moz-border-radius: 3px;
}
.wo-pagenavi a {
	color: #333;
}
.wp-pagenavi a:hover {
	background: #f15b22;
	color: #fff;
}
.wp-pagenavi span.current {
	font-weight: bold;
	background: #333;
	color: #fff;
}


/* 08: Responsive
========================================================================================================== */
@media (min-width: 1200px) {

}

@media (max-width: 1199px) {

	h1 {
		font-size: 3em;
	}
	/*
	.single #wrapper {
		margin-right: 0;
	}
	*/
	
	.site-nav .search-container {width: auto; margin-right: 0;}
	
	.main {border-left: none; padding-left: 0;}
	.right-sidebar {padding-right: 0;}
	
	.post-info {
		padding: 20px;
	}

}

@media (max-width: 992px) {
	
	.site-nav {
		top: 45px;
		width: 0;
		height: 100%;
		background: rgba(0, 0, 0, .85);
		overflow: hidden;
	}
	.site-nav .nav-brand {
		display: none;
	}
	.site-nav .logo {
		display: none;
	}
	.site-nav.open {
		width: 100%;
	}
	.site-nav .mobile-header {
		display: block;
		height: 48px;
		background: #151515;
		overflow: hidden;
	}
	.site-nav .mobile-header .brand {
		display: inline-block;
		padding: 0;
		background: none;
		text-align: left;
	}
	.site-nav .mobile-nav-toggle {
		display: inline-block;
	}
	.site-nav .nav-menu ul li {
		float: none;
		display: block;
		border-bottom: none;
		border-top: 2px solid rgba(255, 255, 255, .15);
	}
	.site-nav .nav-menu ul li a {
		color: #ccc;
	}
	.site-nav.open .nav-menu ul li a:hover {
		background: rgba(0, 0, 0, .5);
	}
	.site-nav .nav-menu ul li:hover ul.drop-down {
		display: none;
	}
	.site-nav .nav-menu ul li a .menu-icon {
		left: 5px;
		border-left: none;
	}
	.site-nav .nav-menu ul li a .arrow-icon {
		display: none;
	}
	.site-nav .nav-social {
		float: none;
		border-top: 2px solid rgba(255, 255, 255, .15);
	}
	
	.mobile-header {
		display: block;
		
	}
	
	.site-nav .search-container {
		display: none;
	}
	
	#wrapper {
		padding: 45px 0 0;
		margin: 0 !important;
	}
	
	.page-content {
		padding: 20px 50px;
	}
	
	.hero .hero-thumb {
		width: 150px;
	}
	
	ul.posts-feed li {
		width: 48%;
	}
	
	.right-sidebar h5 {font-size: .9em;}
	
	#footer {margin-left: 0;}
	#footer ul.footer-nav {margin: 0 20px 20px;}
	#footer ul.footer-nav li:first-child {margin-left: 0;}

}

@media (max-width: 767px) {
	
	h1 {font-size: 2em;}
	h2 {font-size: 1.6em;}
	h3 {font-size: 1.4em; font-weight: 700;}
	h4 {font-size: 1.2em;}
	h5 {font-size: 1em;}
	h6 {font-size: 1em;}
	p.headline {font-size: 1.4em;}
	ul.icon-list {
		font-size: 1em;
	}
	
	.page-content {
		padding: 15px;
	}
	.breadcrumb {
		padding: 10px 15px;
	}
	
	#footer {
		margin-left: 0;
	}
	
	ul.posts-feed {
		padding: 15px;
		margin: 0;
	}
	ul.posts-feed li {
		width: 100%;
		margin: 0 0 15px;
	}
	
	h1.category-title {
		padding: 20px 15px;
	}
	
	.right-sidebar {width: 100%; padding: 0; margin: 30px 0 0;}
	.right-sidebar h5 {font-size: 1.2em;}
	.right-sidebar ul.nav {margin: 0 0 20px;}
	
	.post-header .featured-image-container {
		display: block;
		width: 100%;
	}
	.post-header .featured-image-container .post-title {
		position: static;
	}
	.post-header .featured-image-container .post-title .post-date {
		display: block;
	}
	.post-header .post-info {
		display: block;
		width: 100%;
	}
	.post-info .date-stamp {
		font-size: 1em;
	}
	
	.demo-links .btn {
		display: block;
	}
	
	.wp-pagenavi {
		margin: 15px 0;
	}
	
	#footer ul.footer-nav li {display: block; margin: 0; border-top: 1px solid #ddd;}
	#footer ul.footer-nav li:first-child {border-top: none;}
	#footer ul.footer-nav li a {display: block; padding: 10px;}

}

@media (max-width: 500px) {

	h1 {font-size: 1.5em;}
	h2 {font-size: 1.3em;}
	h3 {font-size: 1.1em;}
	h4 {font-size: 1em;}
	p {font-size: .85em;}
	p.headline {font-size: 1.2em;}
	
	blockquote {
		font-size: 1.2em;
	}
	
	.post-info {
		position: static;
		background: #333;
	}
	
	.demo-links .btn {
		margin: 0 0 10px;
	}
	
	.trans-modal .modal-body {
		padding: 100px 20px;
	}
	
	.story-image {
		margin: 30px 0;
	}

}

/*TEMP PLAYER CODE*/
.div-0-ppr { background-color: rgb(23, 23, 23); border-color: rgb(130, 130, 130); bottom: 0px; color: rgb(130, 130, 130); font-family: Helvetica,Arial; height: 30px; left: 0px; line-height: 27px; list-style-type: none; outline-color: rgb(130, 130, 130); perspective-origin: 315.75px 15px; position: absolute; right: 0px; text-align: left; top: 21px; transform-origin: 315.75px 15px 0px; width: 631.5px; text-decoration: none; }
.div-1-ppr { float: left; font-size: 11px; height: 26px; line-height: 11px; perspective-origin: 13px 13px; transform-origin: 13px 13px 0px; width: 26px; }
.button-2-ppr { background-color: transparent; background-image: url("http://cinereelists.com/wp-includes/js/mediaelement/controls.svg"); background-position: 0px 0px; background-repeat: no-repeat; border-color: rgb(7, 7, 7); border-style: none; border-width: 0px; bottom: 0px; color: rgb(7, 7, 7); cursor: pointer; display: block; font-family: Helvetica,Arial; font-size: 0px; font-weight: 700; height: 16px; left: 0px; line-height: 0px; margin: 7px 5px; outline-color: rgb(7, 7, 7); padding-left: 0px; padding-right: 0px; perspective-origin: 8px 8px; position: absolute; right: 605.5px; top: 0px; transform-origin: 8px 8px 0px; transition-property: none; width: 16px; text-decoration: none; }
.div-3-ppr { border-color: rgb(255, 255, 255); color: rgb(255, 255, 255); float: left; font-size: 11px; height: 17px; line-height: 11px; outline-color: rgb(255, 255, 255); overflow: hidden; padding-left: 3px; padding-right: 3px; padding-top: 10px; perspective-origin: 16.5px 13.5px; text-align: center; transform-origin: 16.5px 13.5px 0px; width: 27px; text-decoration: none; }
.div-5-ppr { float: left; font-size: 11px; height: 26px; line-height: 11px; padding-top: 5px; perspective-origin: 0.5px 15.5px; transform-origin: 0.5px 15.5px 0px; width: 1px; }
.span-6-ppr { background-color: rgba(255, 255, 255, 0.33); bottom: 5px; cursor: pointer; display: block; height: 10px; left: 59px; margin: 5px; perspective-origin: 0px 5px; position: absolute; right: 562.5px; top: 5px; transform-origin: 0px 5px 0px; width: 0px; }
.span-7-ppr { animation-duration: 2s; animation-iteration-count: infinite; animation-name: buffering-stripes; animation-timing-function: cubic-bezier(0, 0, 1, 1); background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-size: 15px 15px; display: none; height: 10px; perspective-origin: 50% 50%; position: absolute; transform-origin: 50% 50% 0px; width: 100%; }
.span-8-ppr { background-color: rgb(153, 153, 153); bottom: 0px; display: block; height: 10px; left: 0px; perspective-origin: 0px 5px; position: absolute; right: 0px; top: 0px; transform-origin: 0px 5px 0px; width: 0px; }
.span-9-ppr { background-color: rgb(255, 255, 255); bottom: 0px; display: block; height: 10px; left: 0px; perspective-origin: 0px 5px; position: absolute; right: 0px; top: 0px; transform-origin: 0px 5px 0px; width: 0px; }
.span-10-ppr { background-color: rgb(255, 255, 255); border-color: rgb(51, 51, 51); border-radius: 5px; border-style: solid; border-width: 2px; display: none; height: 10px; perspective-origin: 50% 50%; position: absolute; text-align: center; top: -2px; transform-origin: 50% 50% 0px; width: 10px; }
.span-11-ppr { background-color: rgb(238, 238, 238); border-color: rgb(51, 51, 51); border-style: solid; border-width: 1px; color: rgb(17, 17, 17); display: none; height: 17px; margin-left: -18px; outline-color: rgb(17, 17, 17); perspective-origin: 50% 50%; position: absolute; text-align: center; top: -26px; transform-origin: 50% 50% 0px; width: 36px; text-decoration: none; }
.span-12-ppr { display: block; height: 10px; left: 0px; margin: 2px; position: absolute; width: 30px; }
.span-13-ppr { border-color: rgb(238, 238, 238) transparent transparent; border-style: solid; border-width: 5px; display: block; height: 0px; left: 13px; line-height: 0px; position: absolute; top: 15px; width: 0px; }
.div-16-ppr { bottom: 31px; clear: both; float: right; font-size: 11px; height: 26px; left: 0px; line-height: 11px; perspective-origin: 13px 13px; position: relative; right: 0px; top: -31px; transform-origin: 13px 13px 0px; width: 26px; }
.button-17-ppr { background-color: transparent; background-image: url("http://cinereelists.com/wp-includes/js/mediaelement/controls.svg"); background-position: -16px -16px; background-repeat: no-repeat; border-color: rgb(7, 7, 7); border-style: none; border-width: 0px; bottom: -4px; color: rgb(7, 7, 7); cursor: pointer; display: block; font-family: Helvetica,Arial; font-size: 0px; font-weight: 700; height: 16px; left: 0px; line-height: 0px; margin: 7px 5px; outline-color: rgb(7, 7, 7); padding-left: 0px; padding-right: 0px; perspective-origin: 8px 8px; position: absolute; right: 0px; top: 0px; transform-origin: 8px 8px 0px; transition-property: none; width: 16px; text-decoration: none; }
.a-18-ppr { border-color: rgb(241, 91, 34); bottom: 0px; color: rgb(241, 91, 34); display: table; float: left; height: 26px; left: 0px; outline-color: rgb(241, 91, 34); perspective-origin: 28px 13px; position: relative; right: 0px; text-decoration: none rgb(241, 91, 34); top: 0px; transform-origin: 28px 13px 0px; transition-duration: 0.3s; transition-timing-function: cubic-bezier(0, 0, 0.58, 1); vertical-align: middle; width: 56px; }
.span-19-ppr { border-color: rgb(241, 91, 34); bottom: 10025px; clip: rect(1px, 1px, 1px, 1px); color: rgb(241, 91, 34); display: block; height: 1px; left: -10000px; outline-color: rgb(241, 91, 34); overflow: hidden; perspective-origin: 0.5px 0.5px; position: absolute; right: 10055px; top: -10000px; transform-origin: 0.5px 0.5px 0px; width: 1px; text-decoration: none; }
.div-20-ppr { background-color: rgba(255, 255, 255, 0.33); border-color: rgb(241, 91, 34); bottom: 7px; color: rgb(241, 91, 34); font-size: 1px; height: 8px; left: 0px; line-height: 11px; outline-color: rgb(241, 91, 34); perspective-origin: 25px 4px; position: absolute; right: 6px; top: 11px; transform-origin: 25px 4px 0px; width: 50px; text-decoration: none; }
.div-21-ppr { background-color: rgb(153, 153, 153); border-color: rgb(241, 91, 34); bottom: 7px; color: rgb(241, 91, 34); font-size: 1px; height: 8px; left: 0px; line-height: 11px; outline-color: rgb(241, 91, 34); perspective-origin: 20px 4px; position: absolute; right: 16px; top: 11px; transform-origin: 20px 4px 0px; width: 40px; text-decoration: none; }
.div-22-ppr { border-color: rgb(241, 91, 34); color: rgb(241, 91, 34); display: none; float: left; font-size: 11px; height: 26px; left: 27px; line-height: 11px; outline-color: rgb(241, 91, 34); perspective-origin: 50% 50%; transform-origin: 50% 50% 0px; width: 26px; text-decoration: none; }