#bodyfooter {z-index: 1;}
#postheader {padding-top: 21%; min-height: 200px; background: no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover;}
#post {font-size: 18px;}
#post .details {margin-top: 20px;}
#post .details a, #related a {color: #333; text-decoration: none;}
#post .details time>a, #related time>a {color: #999;}
#post .details a:hover, #post .details a:focus, #related a:hover, #related a:focus {color: #428bca;}
#post h1 {font-size: 55px; line-height: 1.3; margin: 15px 0 0 0;}
#author {display: flex; align-items: center;}
#author>img {margin-right: 7px;}
#body {margin-top: 30px; line-height: 1.75;}
#body p, #body>div>ol, #body>div>ul, #body figure {margin-bottom: 30px;}
#body ol p, #body ul p {margin-bottom: 15px;}
#body li>ol, #body li>ul {margin-top: 10px;}
#body>div>p:last-child {margin-bottom: 0;}
#body blockquote p {margin-bottom: 10px;}
#body li {margin-bottom: 10px;}
#body h2 {line-height: 1.3; margin: 50px 0 40px 0;}
#body h3 {line-height: 1.3; margin: 0 0 10px 0;}
#body figcaption {font-size: 90%; color: #818a91; margin-top: 15px; line-height: 1.75;}
#related hr:first-child {margin: 40px 0 25px 0;}
#related hr:last-child {margin: 30px 0 0 0;}
#related h4 {font-size: 16px; text-align: center; text-transform: uppercase; margin: 0;}
#related h5 {font-size: 18px; line-height: 1.4; margin: 25px 0 15px 0;}
#related .img-responsive {margin-top: 30px; border: 1px solid #999;}
#blognav {margin-top: 30px;}
#blogsearchform, #blognav>.dropdown>a, #blognav>a {width: 220px;}
#blogsearchform .fa-caret-down {margin-left: 4px;}
#blognav>.dropdown .fa-caret-down {margin-left: 5px;}
#blognav .dropdown-menu a {padding: 3px 15px; line-height: 1.6;}
#blognav .dropdown-menu i, #subscribe i {margin-right: 8px;}
#blognav>.dropdown, #blognav>a {margin-top: 10px;}
#blognav hr {display: none; margin: 30px 0 0 0;}
.affix {top: 68px;}
.affix-bottom {position: absolute;}
#sidebar .well {width: 220px; margin: 30px 0 0 0; line-height: 1.8; text-align: center;}
#sidebar .well div {margin-bottom: 10px;}
#sidebar .well img, #sidebar .well h3 {margin: 0 0 20px 0;}
#sidebar .well a {margin-top: 10px; white-space: normal;}
#subscribe {font-family: "Roboto Condensed", "Arial Unicode MS", "Lucida Grande", "Lucida Sans Unicode", sans-serif; text-transform: uppercase; background: #0066b5; border-radius: 4px; margin: 60px 0; padding: 10px;}
#subscribe div {display: inline-block; font-size: 16px; color: #fff; vertical-align: middle; margin: 5px 7px;}
#subscribe a {border: 2px solid #333; margin: 5px 7px;}
q:before, q:after {content: "\0022";}
.upperalpha {list-style-type: upper-alpha;}
.imgborder {border: 1px solid #999;}
.playvideo {position: relative; color: #428bca; border: 1px solid #ccc; margin: 30px 0; transition: opacity .25s cubic-bezier(0.0,0.0,0.2,1);}
.playvideo:hover {opacity: 0.9; color: #FF0000;}
.playvideo>div {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 70px; line-height: .5; background: #FFF; width: 62px; height: 40px; margin-left: 4px;}
.playvideo>div>i {line-height: .5; margin-left: -4px;}
figure .playvideo {margin-bottom: 0;}
.giphy {width: 100%; height: 0; padding-bottom: 56%; position: relative;}
.giphy iframe {width: 100%; height: 100%; position: absolute;}
.giphy+p {text-align: center;}
#genrecontent h2 {font-size: 60px; color: #363b45; text-transform: uppercase; text-align: center; letter-spacing: 10px; line-height: 1.15; margin-bottom: 30px; text-shadow: -0.0075em 0.0075em 0 #f3f3f4, 0.005em 0.005em 0 #afb1b5, 0.01em 0.01em 0 #b3b5b8, 0.015em 0.015em #b7b8bc, 0.02em 0.02em 0 #bbbcc0, 0.025em 0.025em 0 #bfc0c3, 0.03em 0.03em 0 #c3c4c7, 0.035em 0.035em 0 #c7c8cb;}
#genrecontent h3 {font-size: 30px; margin: 40px 0 30px 0;}
#genrecontent h3 small {display: block; text-transform: uppercase; padding: 10px 0 3px 0;}
#genrecontent h4 {font-size: 20px; margin: 3px 0;}
#genrecontent h5 {font-size: 18px; text-transform: uppercase; line-height: 1.3; margin: 0 0 3px 0;}
#genrecontent>div:first-of-type>div>div, #genrecontent>div:first-of-type>div>div ul {padding: 0;}
#genrecontent>div:first-of-type>div>div>ul {list-style-type: none; width: 80%; font-size: 15px; line-height: 1.3;}
#genrecontent>div:first-of-type>div>div>ul li {padding-bottom: 5px;}
#genrecontent>div:first-of-type>div>div>ul hr {border-top: 1px solid #333; margin: 7px 0 15px 0;}
#genrecontent>div:first-of-type>div>div>ul img {width: 44px; height: 30px; margin-right: 5px;}
#genrecontent>div:first-of-type>div>div>ul>li>a {font-size: 27px; padding: 0 8px; box-decoration-break: clone; -webkit-box-decoration-break: clone;}
#genrecontent>div:first-of-type>div>div>ul>li>ul>li, #genrecontent figure+p+.panel>.panel-body>div {display: flex; align-items: center;}
#genrecontent figure+p+.panel>.panel-body>div:not(:last-child), #genrecontent .panel {margin-bottom: 30px;}
#genrecontent figure+p+.panel>.panel-body>div>div:first-of-type {width: 70px; height: 102px; margin-right: 10px;}
#genrecontent figure+p+.panel>.panel-body>div>div:first-of-type img {height: 102px; border: 1px solid #ddd;}
#genrecontent figure+p+.panel>.panel-body>div>div:last-of-type {line-height: 1.3;}
#genrecontent .panel-body>ul {list-style-type: none; padding: 0; line-height: 1.43;}
@media (max-width: 767px) {#post {font-size: 16px;} #post h1 {font-size: 36px;} #body {line-height: 1.9;} #body h2 {font-size: 23px; line-height: 1.4;} #body h3 {font-size: 18px; line-height: 1.4;} #genrecontent h2 {font-size: 36px; line-height: 1.3;} #genrecontent h3 {font-size: 25px;} #genrecontent h4 {font-size: 18px;} #genrecontent h5 {font-size: 16px;} #blogsearchform, #blognav>.dropdown {max-width: 300px; width: auto; margin-left: auto; margin-right: auto;} #blognav>.dropdown>a {width: 100%;} #blognav>a, #related hr:last-child {display: none;} #blognav hr {display: block;} #sidebar {text-align: center;} #sidebar .well {display: inline-block; width: auto; max-width: 300px;} .affix {position: static;} #subscribe {display: inline-block; max-width: 300px; margin: 30px 0;} #subscribe div {font-size: 14px;}}
@media (min-width: 992px) {#genrecontent figure+p+.panel>.panel-body {display: flex; justify-content: space-around; text-align: center;} #genrecontent figure+p+.panel>.panel-body>div {flex-direction: column; width: 28%; margin-bottom: 0 !important;} #genrecontent figure+p+.panel>.panel-body>div>div:first-of-type {margin: 0 0 10px 0;} #blogsearchform, #blognav>.dropdown>a, #blognav>a, #sidebar .well {width: 290px;}}