/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain)
*/
html, body, div, span, applet, 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, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

html { box-sizing: border-box; }

*, *::after, *::before { box-sizing: inherit; }

@font-face { font-family: 'icomoon'; src: url("../fonts/icomoon.eot?g62vm1"); src: url("../fonts/icomoon.eot?g62vm1#iefix") format("embedded-opentype"), url("../fonts/icomoon.ttf?g62vm1") format("truetype"), url("../fonts/icomoon.woff?g62vm1") format("woff"), url("../fonts/icomoon.svg?g62vm1#icomoon") format("svg"); font-weight: normal; font-style: normal; }
[class^="icon-"], [class*=" icon-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon-tumblr:before { content: "\e900"; }

.icon-facebook:before { content: "\e901"; }

.icon-play:before { content: "\ea15"; }

.icon-volume-on:before { content: "\ea26"; }

.icon-volume-mute:before { content: "\ea2a"; }

.icon-twitter:before { content: "\ea91"; }

.icon-rss:before { content: "\ea94"; }

.icon-apple:before { content: "\eabf"; }

.icon-pause:before { content: "\ea16"; }

.icon-soundcloud:before { content: "\eac4"; }

body { font-family: "Source Code Pro", "Courier", mono; color: #A6ADB2; font-size: 1em; line-height: 1.15em; }

h1, h2, h3, h4, h5, h6 { font-family: "Montserrat", Arial, sans-serif; font-weight: 400; line-height: 1em; margin-bottom: 1em; color: #23D6A3; }

h1 { font-size: 2.25em; }

h2 { font-size: 1.75em; }

h3 { font-size: 1.25em; }

h4 { font-size: 1.00em; }

h5 { font-size: 0.875em; }

h6 { font-size: 0.775em; text-transform: uppercase; }

h2 a { color: #23D6A3; border-bottom-width: 0px; }
h2 a:hover { color: #28AEDE; }

p { font-size: 0.875em; margin-bottom: 1em; }

small { font-size: 0.775em; }

a { color: #28AEDE; text-decoration: none; border-bottom: 1px solid #28AEDE; transition: color .25s linear; }
a:hover, a:active, a:focus { color: #23D6A3; border-bottom-color: #23D6A3; }

.action-img { border-bottom-width: 0px; }

.button { display: inline-block; padding: 10px; margin: 30px auto 30px auto; border: solid 2px transparent; -moz-border-image: -moz-linear-gradient(top left, #28AEDE 0%, #23D6A3 100%); -webkit-border-image: -webkit-linear-gradient(top left, #28AEDE 0%, #23D6A3 100%); border-image: linear-gradient(to bottom right, #28AEDE 0%, #23D6A3 100%); border-image-slice: 1; }

.post-tag-list { padding-left: 0px; margin-bottom: 0px; }
.post-tag-list li { display: inline-block; margin-top: 10px; font-size: 0.75em; }
.post-tag-list li a { color: #A6ADB2; background-color: #202325; border-bottom: 0px; text-transform: uppercase; padding: 0.25em 0.5em; }
.post-tag-list li a:hover, .post-tag-list li a:active, .post-tag-list li a:focus { color: #23D6A3; }

.pagination { text-align: center; margin: 1em 0px; }
.pagination a { color: white; border-bottom-width: 0px; margin: 0px 1em; }
.pagination a:hover { color: #23D6A3; }
.pagination span { margin: 0px 1em; color: #616B70; }
.pagination .active-page { font-weight: bold; }

body { background-color: #202325; background-image: url("../img/repeating-robots-2.png"); background-attachment: fixed; margin: 0; }

.all-site-content { max-width: 73.125em; margin-left: auto; margin-right: auto; }
.all-site-content::after { clear: both; content: ""; display: table; }

.left-aside { float: left; display: block; margin-right: 2.35765%; width: 23.23176%; }
.left-aside:last-child { margin-right: 0; }
@media screen and (max-width: 1170px) { .left-aside { padding: 0 0.5em; } }
@media screen and (max-width: 980px) { .left-aside { float: left; display: block; margin-right: 2.35765%; width: 23.23176%; margin-right: 0; }
  .left-aside:last-child { margin-right: 0; } }
@media screen and (max-width: 780px) { .left-aside { float: left; display: block; margin-right: 2.35765%; width: 100%; }
  .left-aside:last-child { margin-right: 0; } }

.page-content { float: left; display: block; margin-right: 2.35765%; width: 48.82117%; margin-bottom: 2em; }
.page-content:last-child { margin-right: 0; }
@media screen and (max-width: 1170px) { .page-content { padding: 0 0.5em; } }
@media screen and (max-width: 980px) { .page-content { float: left; display: block; margin-right: 2.35765%; width: 74.41059%; }
  .page-content:last-child { margin-right: 0; } }
@media screen and (max-width: 780px) { .page-content { float: left; display: block; margin-right: 2.35765%; width: 100%; }
  .page-content:last-child { margin-right: 0; } }

@media screen and (max-width: 1170px) { article { padding: 0 0.5em; } }

.right-aside { float: left; display: block; margin-right: 2.35765%; width: 23.23176%; }
.right-aside:last-child { margin-right: 0; }
@media screen and (max-width: 1170px) { .right-aside { padding: 0 0.5em; } }
@media screen and (max-width: 980px) { .right-aside { width: 100%; } }

span.track-link { display: none; }

article .date { margin-bottom: 1em; }
article .article-title { margin-bottom: 1em; }
article .audio-embed, article iframe { margin-bottom: 1em; }
article ul { font-size: 0.875em; margin-bottom: 1em; line-height: 2em; }
article ul li:before { content: "\2022"; margin-right: 0.5em; color: #28AEDE; }
article ol { font-size: 0.875em; margin-bottom: 1em; line-height: 2em; counter-reset: li; }
article ol li { counter-increment: li; }
article ol li:before { content: counter(li) ". "; color: #28AEDE; }
article blockquote { font-size: 0.875rem; margin-bottom: 1em; padding-left: 1em; border-left: 3px solid #616B70; }
article hr { margin: 2em 0; border: 1px solid #616B70; }
article img { width: 100%; height: auto; display: block; margin: 1em 0px; }
article .img-src { display: inline-block; margin-top: 1em; padding-top: 1em; border-top: 1px solid #616B70; }
article .video-container { position: relative; padding-bottom: 56.25%; padding-top: 35px; height: 0; overflow: hidden; }
article .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.featured-ep { padding: 1em; border: solid 2px transparent; -moz-border-image: -moz-linear-gradient(top left, #28AEDE 0%, #23D6A3 100%); -webkit-border-image: -webkit-linear-gradient(top left, #28AEDE 0%, #23D6A3 100%); border-image: linear-gradient(to bottom right, #28AEDE 0%, #23D6A3 100%); border-image-slice: 1; }
.featured-ep small { display: block; width: 100%; }
.featured-ep h2 { margin-top: 0.5em; }
.featured-ep .audio-embed, .featured-ep iframe { margin-bottom: 1em; }
.featured-ep:before { content: 'LATEST'; position: relative; top: -1em; left: -1em; height: 20px; padding: 1px 8px; background-color: #28AEDE; color: white; }

.all-eps { margin-top: 20px; padding: 1em; border: solid 2px #616B70; }
.all-eps h2 { margin-top: 0.5em; }

header { background-color: #31383C; text-align: center; margin-bottom: 1em; padding: 0.5em 0px; border-bottom: 7px solid #202325; }
header h1 { margin: 0.5em 0; display: inline-block; position: relative; bottom: 6px; }
header h1 a { font-weight: 700; color: white; border-bottom-width: 0px; font-size: 50px; }

.roboism-logotype { height: 60px; margin-bottom: 0.5em; }

.left-aside .social-icons { list-style-type: none; text-align: center; margin-bottom: 1em; }
.left-aside .social-icons li { display: inline-block; font-size: 0.75em; }
.left-aside .social-icons li a { display: block; height: 35px; width: 35px; color: #A6ADB2; transition: color .25s linear; border-bottom-width: 0px; padding-top: 10px; border-radius: 50%; background-color: #202325; }
.left-aside .social-icons li a:hover { color: #fff; }
@media screen and (max-width: 980px) { .left-aside .social-icons li a { margin: 0 0.5em; } }
.left-aside .main-nav { list-style-type: none; padding: 0.5em; border: solid 2px #616B70; margin-bottom: 1em; }
.left-aside .main-nav h3 { margin-bottom: 0px; }
.left-aside .main-nav a { border-bottom-width: 0px; color: #23D6A3; }
.left-aside .main-nav a:hover { color: #28AEDE; }
.left-aside .hosts { padding: 0.5em; border: solid 2px #616B70; margin-bottom: 1em; }
@media screen and (max-width: 780px) { .left-aside .hosts { float: left; display: block; margin-right: 2.35765%; width: 100%; }
  .left-aside .hosts:last-child { margin-right: 0; } }
.left-aside .host-description { text-align: center; margin-bottom: 1em; }
@media screen and (max-width: 780px) { .left-aside .host-description { float: left; display: block; margin-right: 2.35765%; width: 48.82117%; }
  .left-aside .host-description:last-child { margin-right: 0; } }
.left-aside .host-avatar-svg { width: 60px; height: 60px; margin-bottom: 0.5em; transition: transform 0.2s cubic-bezier(0.05, 0.59, 0.64, 1.46); }
.left-aside .host-avatar-svg:hover { transform: scale(1.1); }
@media screen and (max-width: 780px) { .left-aside p { padding: 0 1em; } }

.coops { text-align: center; margin-bottom: 1em; }
.coops img { width: 100%; height: auto; padding: 0.5em; margin-bottom: 1em; border: solid 2px #616B70; }
@media screen and (max-width: 980px) { .coops { float: left; display: block; margin-right: 2.35765%; width: 48.82117%; margin-left: 25.58941%; border-width: 0px; }
  .coops:last-child { margin-right: 0; } }
@media screen and (max-width: 560px) { .coops { float: left; display: block; margin-right: 2.35765%; width: 100%; margin-left: 0%; }
  .coops:last-child { margin-right: 0; } }

.copyright { text-align: center; padding-bottom: 2em; }
@media screen and (max-width: 980px) { .copyright { float: left; display: block; margin-right: 2.35765%; width: 48.82117%; margin-left: 25.58941%; }
  .copyright:last-child { margin-right: 0; } }
@media screen and (max-width: 560px) { .copyright { float: left; display: block; margin-right: 2.35765%; width: 100%; margin-left: 0%; }
  .copyright:last-child { margin-right: 0; } }

.soundcloud-logo { color: #202325; border: none; font-size: 4em; margin-top: 15px; }

div.audio-embed { display: table; width: 100%; background-color: #202325; border-radius: 5px; }
div.audio-embed div small { line-height: 2em; }
div.audio-embed iframe { display: none; }

.play-pause { padding: 5px; display: table-cell; vertical-align: middle; width: 45px; }

.time { display: table-cell; vertical-align: middle; padding: 5px; }

.volume { display: table-cell; width: 28px; vertical-align: middle; padding: 5px; }

.progress-bar-container { display: table-cell; vertical-align: middle; width: 100%; }

.progress-bar { width: 100%; height: 8px; background-color: #616B70; }
.progress-bar:hover { cursor: pointer; }

.progress { width: 0%; height: 8px; background-color: #23D6A3; position: relative; }

i.play, i.pause { font-size: 2.5em; }
i.play:hover, i.pause:hover { transition: color .25s linear; color: #23D6A3; cursor: pointer; }

i.pause { position: relative; top: 0; display: none; }

i.on, i.mute { font-size: 1.25em; }
i.on:hover, i.mute:hover { transition: color .25s linear; cursor: pointer; color: #23D6A3; }

i.mute { position: relative; top: 0; display: none; }
