/*

Theme Name: Looking For Group 2019 Playwire
Theme URI: http://mindfaucet.com/
Author: Mindfaucet
Author URI: http://mindfaucet.com/
Description: Official LFG Theme
Version: 1.0.0

Design by Mindfaucet
http://mindfaucet.com

*/

html {
	padding: 0;
	margin: 0;
	overflow-y: scroll;
}

body {
	padding: 0;
	margin: 0;
	font-size: 16px;
	font-family: 'Catamaran', sans-serif;
	font-weight: 300;
    line-height: 165%;
	color: #c3d1d9;
	background: #000;
	min-width: 768px;
    background: #344652;
}

a {
	color: #ffb217;
	text-decoration: none;
}

	a:hover {
		color: #da2a4d;
	}

	a:focus {
		outline: none;
	}
	
button::-moz-focus-inner {
	border: 0; 
}

input:focus {
	outline: none;
}

input::-moz-focus-inner {
	border: 0; 
}

hr {
	height: 1px;
	color: #abaaa8;
	background-color: #abaaa8;
	border: 0px;
}

img {
	border: none;
  	max-width: 100%;
  	height: auto !important;
}

.clear {
	clear: both;
}

.clear-left {
	clear: left;
}

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

tr, td {
	padding: 0;
	margin: 0;
}

h1 {
    font-family: 'Smythe', sans-serif;
    font-weight: 400;
    font-size: 54px;
    line-height: 100%;
    color: #fff;
}

h2 {
    font-family: 'Smythe', sans-serif;
    font-weight: 400;
    font-size: 36px;
    line-height: 100%;
    color: #fff;
}

h3, h4 {
    font-family: 'Smythe', sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 100%;
    color: #fff;
}

blockquote {
	color: #ffc218;
}

.alignleft {
    float: left;
    margin: 0 10px 10px 0;
}

.alignright {
    float: right;
    margin: 0 0 10px 10px;
}

.aligncenter {
    clear: left !important; 
    display: block;
    margin: 10px auto;
}

img#wpstats{
 display: none;
 }


/* HEADER */

#header {
    height: 100px;
    width: 100%;
    background-image: url('style/header.png');
    background-size: auto 100%;
    position: fixed;
    overflow: hidden;
    box-shadow: 0 2px 20px 5px #000;
    z-index: 10000;
}

#header-button-menu {
    width: 60px;
    height: 60px;
    margin: 20px;
    float: left;
    cursor: pointer;
    background-image: url('style/menu-button.png');
    background-color: #3d010d;
    background-size: auto 60px;
    background-position: 0 0;
}

    #header-button-menu.menu-off {
        background-position: left t op;
    }

    #header-button-menu.menu-on {
        background-position: right top;
    }

#header-logo {
    width: 300px;
    height: 100px;
    display: block;
    float: left;
    text-indent: -9999px;
    background: url('style/logo.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

#header-button-lfg {
    width: 80px;
    height: 80px;
    margin: 7px 7px 7px 0;
    float: right;
    text-indent: -9999px;
    display: block;
    border: 3px solid #ffb217;
    overflow: hidden;
    border-radius: 43px;
    background-image: url('style/header-button-lfg.jpg');
    background-size: 100% 100%;
}

    #header-button-lfg:hover {
        border-color: #fff;
    }

#header-button-npc {
    width: 80px;
    height: 80px;
    margin: 7px 7px 7px 0;
    float: right;
    text-indent: -9999px;
    display: block;
    border: 3px solid #ffb217;
    overflow: hidden;
    border-radius: 43px;
    background-image: url('style/header-button-npc.jpg');
    background-size: 100% 100%;
}

    #header-button-npc:hover {
        border-color: #fff;
    }

#header-button-tda {
    width: 80px;
    height: 80px;
    margin: 7px 7px 7px 0;
    float: right;
    text-indent: -9999px;
    display: block;
    border: 3px solid #ffb217;
    overflow: hidden;
    border-radius: 43px;
    background-image: url('style/header-button-tda.jpg');
    background-size: 100% 100%;
}

    #header-button-tda:hover {
        border-color: #fff;
    }

#header-button-shop {
    width: 80px;
    height: 80px;
    margin: 7px 7px 7px 0;
    float: right;
    text-indent: -9999px;
    display: block;
    border: 3px solid #ffb217;
    overflow: hidden;
    border-radius: 43px;
    background-image: url('style/header-button-shop.jpg');
    background-size: 100% 100%;
}

    #header-button-shop:hover {
        border-color: #fff;
    }

#header-button-patreon {
    width: 150px;
    height: 100px;'
    display: block;
    float: right;
    text-indent: -9999px;
    background-image: url('style/patreon-login.png');
    background-size: 100% auto;
}

#header-button-patreon:hover {
    background-position: 0 -100px;
}

#header-spacer {
    height: 100px;
}

#header.mini {
    height: 50px;
}

#header.mini #header-button-menu {
    width: 40px;
    height: 40px;
    margin: 5px;
    float: left;
    cursor: pointer;
    background-size: auto 40px;
}

#header.mini #header-logo {
    width: 150px;
    height: 50px;
    display: block;
}

#header.mini #header-button-lfg, #header.mini #header-button-npc, #header.mini #header-button-tda, #header.mini #header-button-shop {
    width: 40px;
    height: 40px;
    margin: 3px 3px 3px 0;
    border-width: 2px;
    border-radius: 22px;
}

#header.mini #header-button-patreon {
    width: 75px;
    height: 50px;'
    background-size: 100% auto;
}

#header.mini #header-button-patreon:hover {
    background-position: 0 -50px;
}

@media (min-width: 0px) and (max-width: 1000px) {
    
    #header {
        height: 50px;
    }

    #header-button-menu {
        width: 40px;
        height: 40px;
        margin: 5px;
        float: left;
        cursor: pointer;
        background-size: auto 40px;
    }

    #header-logo {
        width: 150px;
        height: 50px;
        display: block;
    }

    #header-button-lfg, #header-button-npc, #header-button-tda, #header-button-shop {
        width: 40px;
        height: 40px;
        margin: 3px 3px 3px 0;
        border-width: 2px;
        border-radius: 22px;
    }

    #header-button-patreon {
        width: 75px;
        height: 50px;'
        background-size: 100% auto;
    }

    #header-button-patreon:hover {
        background-position: 0 -50px;
    }

    #header-spacer {
        height: 50px;
    }
    
}


/* MENU */

#menu {
    width: 0;
    height: 100%;
    position: fixed;
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: auto;
    background: #3d010d;
}

#menu-list {
    width: 260px;
    padding: 60px 20px 20px 20px;
}

    #menu-list a {
        display: block;
    }

#menu-list h2 {
    margin: 20px 0 10px 0;
    font-size: 24px;
}


/* FEATURE */

#feature {
    background: #fff;
}

#feature-left {
    width: 66.6%;
    float: left;
}

#feature-right {
    width: 33.4%;
    float: left;
}

    #feature-tdb-wrap {
        display: none;
    }

    #feature-right #feature-tdb-wrap, #feature-tda-wrap {
        display: block;
    }

    #feature-right #feature-tda-wrap {
        display: none;
    }

    .feature-header {
        padding: 0 0 0 1%;
        font-family: 'Smythe', sans-serif;
        font-weight: 400;
        font-size: 30px; font-size: 2vw;
        line-height: 150%;;
        color: #663b0e;
        background: #da9a42;
        border-bottom: 4px solid #fff;
        cursor: pointer;
    }

    .feature-footer {
        padding: 0 0 0 1%;
        font-size: 16px; font-size: 1vw;
        line-height: 180%;
        border-top: 4px solid #890721;
        white-space: nowrap;
        overflow: hidden;
    }

    .feature-footer a span {
        font-size: 24px; font-size: 1.5vw;
        color: #da2a4d;
    }

    #feature-tda-header, #feature-tdb-header {
        background: #dfba59;
    }

    #feature-npc-header, #feature-tdb-header {
        padding: 0 0 0 2%;
    }

    #feature-npc-footer, #feature-tdb-footer {
        padding: 0 0 0 2%;
    }

    #feature-tdb-footer p {
        margin: 0;
        padding: 0;
        display: block;
    }

    #feature-lfg-wrap {
        width: 50%;
        float: left;
    }

        #feature-lfg {
            margin: 0 4px 0 0;
            background: #0e161a;
        }

        #feature-lfg-thumb {
            width: 100%;
            background-size: 100% 100%;
            cursor: pointer;
        }

        #feature-lfg-thumb::after {
            padding-top: 50%;
            display: block;
            content: '';
        }

    #feature-tda-wrap {
        width: 50%;
        float: left;
    }

        #feature-tda {
            margin: 0 4px 0 0;
            background: #0e161a;
        }

        #feature-tda-thumb {
            width: 100%;
            background-size: 100% 100%;
            cursor: pointer;
        }

        #feature-tda-thumb::after {
            padding-top: 50%;
            display: block;
            content: '';
        }

    #feature-npc-wrap {
        width: 50%;
        float: left;
    }

        #feature-npc {
            margin: 0 2px 0 0;
            background: #0e161a;
        }

        #feature-npc-thumb {
            width: 100%;
            background-size: 100% 100%;
            cursor: pointer;
        }

        #feature-npc-thumb::after {
            padding-top: 99.6%;
            display: block;
            content: '';
        }

    #feature-tdb-wrap {
        width: 50%;
        float: left;
    }
    
        #feature-tdb {
            margin: 0 0 0 2px;
            background: #0e161a;
        }

        #feature-tdb-thumb {
            width: 100%;
            background-size: 100% 100%;
            cursor: pointer;
        }

        #feature-tdb-thumb::after {
            padding-top: 99.6%;
            display: block;
            content: '';
        }

@media (min-width: 0px) and (max-width: 1000px) {
    
    #feature-lfg-wrap, #feature-tda-wrap {
        float: none;
        width: 100%;
    }
    
    #feature-npc-wrap, #feature-tdb-wrap {
        float: none;
        width: 100%;
    }
    
    #feature-tda-wrap, #feature-tdb-wrap {
        border-top: 4px solid #fff;
    }
    
    #feature-npc-wrap .feature-header {
        background: #dfba59;
    }
    
    #feature-tdb-wrap .feature-header {
        background-color: #da9a42;
    }
    
    #feature-npc, #feature-tdb {
        margin: 0;
    }
    
    #feature-npc-thumb::after, #feature-tdb-thumb::after {
        padding-top: 99.0%;
    }
    
    .feature-header {
        font-size: 4vw;
    }

    .feature-footer {
        font-size: 2vw;
    }
    
}


/* EVENTS */

#events-wrap {
    color: #afc0cc;
    font-size: 14px;
    line-height: 16px;
    background: #162026;
    border-top: 4px solid #fff;
    border-bottom: 4px solid #fff;
}

#events-wrap-inner {
    max-width: 1880px;
    min-height: 90px;
    padding: 20px;
    margin: 0 auto;
    overflow: hidden;
}

.social-buttons {
    width: 280px;
    height: 60px;
    padding: 15px 0 0 0;
    float: left;
}

    .social-buttons a {
        width: 60px;
        height: 60px;
        margin: 0 10px 0 0;
        float: left;
        display: block;
        text-indent: -9999px;
        background-color: #344652;
        background-size: 100% 100%;
        border-radius: 30px;
    }

    .social-buttons a:hover {
        background-color: #a0112e;
    }

    .social-button-twitter {
        background-image: url('style/social-button-twitter.png');
    }

    .social-button-facebook {
        background-image: url('style/social-button-facebook.png');
    }

    .social-button-instagram {
        background-image: url('style/social-button-instagram.png');
    }

    .social-button-reddit {
        background-image: url('style/social-button-reddit.png');
    }

#events {
    height: 90px;
    overflow: hidden;
}

#eventsOLD p {
    height: 50px;
    margin: 0 0 0 20px;
    float: left;
    font-size: 16px;
    line-height: 20px;
}

    #eventsOLD p a {
        color: #afc0cc;
    }

    #eventsOLD p a:hover {
        color: #fff;
    }

#events-header {
    margin: 0 0 5px 20px;    
    height: 40px;
    color: #fff;
    font-family: 'Smythe', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 40px;
    overflow: hidden;
    border-bottom: 2px solid #344652;
}

.events-more {  
    font-size: 16px;
	font-family: 'Catamaran', sans-serif;
	font-weight: 300;
    line-height: 40px;
    float: right;
}

#ad-events-leader {
    padding: 0 0 0 20px;
    float: right;
    width: 728px;
    height: 90px;
}

#events .vsel-content {
    display: inline-block;
    height: 50px;
    margin: 0 0 0 20px;
    float: left;
    font-size: 16px;
    line-height: 20px;
}

#events h4.vsel-meta-title {
	font-family: 'Catamaran', sans-serif;
	font-weight: 300;
    font-size: 16px;
    margin: 0;
}

#events .vsel-meta-date {
    margin: 0;
    display: inline;
}

#events .vsel-meta-end-date {
    display: none;
}

#events .vsel-meta-location, #events .vsel-meta-link, #events .vsel-image-info {
    display: none;
}

#events-data .vsel-content {
    width: 100%;
    clear: left;
    float: left;
    margin: 0 0 20px;
    padding: 0 0 10px;
    border-bottom: 1px solid #dfba59;
}

#events-data .vsel-meta {
    width: 50%;
    float: left;
}

#events-data h4.vsel-meta-title {
    font-size: 36px;
    margin: 0;
}

#events-data .vsel-image-info {
    width: 50%;
    float: right;
}

#events-data .vsel-image {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 200px !important;
    float: right;
    margin: 5px 0 5px 10px;
    padding: 0;
    border: 0;
}

#events-data .vsel-meta-date {
    display: inline-block;
    margin-bottom: 0;
}

@media (min-width: 0px) and (max-width: 1600px) {
    
    #events-wrap .social-buttons {
        display: none;
    }
    
}

@media (min-width: 0px) and (max-width: 1150px) {
    
    #ad-events-leader {
        padding: 0;
        float: none;
    }
    
    #events {
        margin-left: -20px;
    }
    
}


/* BLOG */

#content-blog {
    max-width: 1890px;
    padding: 30px 30px 30px 0;
    margin: 0 auto;
}

.post-wrap {
    padding: 0 0 30px 0;
    margin: 0 660px 0 0;
    float left;
}

.avatar-wrap {
    width: 252px;
    height: 264px;
    float: left;
    background-image: url('style/avatar-wrap.png');
    background-size: 100% 100%;
}

    .avatar {
        width: 200px;
        height: 200px;
        margin: 10px 0 0 42px;
        overflow: hidden;
        background-image: url('mock/will-megaman.png');
        background-size: 200px auto;
        background-position: top left;
    }

.post-tail {
    width: 45px;
    height: 130px;
    float: left;
    background-image: url('style/post-tail.png');
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 40px 32px;
}

.post {
    padding: 15px 40px;
    margin: 0 0 0 297px;
    background: #222f37;
    border-radius: 30px;
}

.post-details {
    padding: 15px 0 0 0;
    font-size: 20px;
    font-family: 'Smythe', san-serif;
}

h2.post-title {
    margin: 0;
    padding: 0;
    font-family: 'Smythe', sans-serif;
    font-size: 54px;
    line-height: 100%;
    font-weight: 300;
    color: #fff;
}

#comments {
    padding: 20px 0 0 0;
}

@media (min-width: 0px) and (max-width: 1600px) {
    
    .post-wrap {
       margin-right: 330px;
    }
    
}

@media (min-width: 0px) and (max-width: 1200px) {
    
    .post {
        clear: left;
        margin: 0 0 0 30px;   
    }
    
    .post-tail {
        width: 100px;
        height: 132px;
        background-image: url('style/post-tail-mini.png');
        background-position: right bottom;
        background-size: 90px auto;
    }
    
    .avatar-wrap {
        width: 126px;
        height: 132px;
        margin-left: 20px;
    }

        .avatar {
            width: 100px;
            height: 100px;
            margin: 5px 0 0 21px;
            background-size: 100px auto;
        }
    
}


/* PAGE */

#page-title-wrap {
    background: #162026;
    border-bottom: 4px solid #dfba59;
}

    #page-title {
        max-width: 1880px;
        min-height: 90px;
        padding: 20px;
        margin: 0 auto;
        overflow: hidden;
    }

    #page-title h1 {
        margin: 20px 20px 0 20px;
    }

    #npc-credit {
        margin: 0 0 0 20px;
    }

#content-page {
    max-width: 1890px;
    padding: 30px;
    margin: 0 auto;
}

.page-wrap {
    margin: 0 660px 0 0;
}

.page-content {
    padding: 20px 40px;
    background: #222f37;
    border-radius: 30px;
}

.page-nav-newer {
    float: right;
}

.page-nav-older {
    float: left;
  	margin-left: 30px;
}

.parablocks p {
    display: inline-block;
    margin: 0 20px 20px 0;
    vertical-align: top;
}

.parablocks h1, .parablocks h2, .parablocks h3, .parablocks h4, .parablocks h5, .parablocks hr {
    clear: left;
}

.parablocks-even p {
    width: 150px;
    display: inline-block;
    margin: 0 20px 20px 0;
    vertical-align: top;
}

.parablocks-even h1, .parablocks-even h2, .parablocks-even h3, .parablocks-even h4, .parablocks h5, .parablocks-even hr {
    clear: left;
}

@media (min-width: 0px) and (max-width: 1600px) {
    
    .page-wrap {
       margin-right: 330px;
    }
    
}


/* ARCHIVE */

#comic-info-wrap {
    width: 42%;
    float: left;
}

#comic-info {
    padding: 20px 40px;
    margin: 0 20px 0 0;
    background: #222f37;
    border-radius: 30px;
}

#comic-info-logo {
    width: 100%;
    max-width: 500px;
}

#archive-feature-wrap {
        width: 58%;
        float: left;
        box-shadow: 0 5px 30px 0 #000;
    }

    #archive-feature {
        background: #0e161a;
    }

    #archive-feature-thumb {
        width: 100%;
        background-size: 100% 100%;
        cursor: pointer;
    }

    #archive-feature-thumb::after {
        padding-top: 50%;
        display: block;
        content: '';
    }

#archive {
    padding: 20px 0;
    text-align: center;
}

.archive-thumb-wrap {
    width: 18%;
    margin: 0 1%;
    float: left;
    cursor: pointer;
}

    .archive-thumb {
        width: 100%;
        box-shadow: 0 5px 30px 0 #000;
        background-size: 100% auto;
    }

    .archive-thumb::after {
        padding-top: 143%;
        display: block;
        content: '';
    }

    .tda-thumbs .archive-thumb {
        background-size: 100% 100%;
    }

    .tda-thumbs .archive-thumb::after {
        padding-top: 50%;
        display: block;
        content: '';
    }

    .archive-thumb-spacer {
        width: 100%;
    }

        .archive-thumb-spacer::after {
            padding-top: 5%;
            display: block;
            content: '';
        }

    .archive-thumb-title {
        width: 100%;
        color: #ffb217;
        font-size: 20px;
        line-height: 20px;
        text-align: center;
    }

        .archive-thumb-title::after {
            padding-top: 15%;
            display: block;
            content: '';
        }

        .npc-covers .archive-thumb-title::after {
            padding-top: 20%;
            display: block;
            content: '';
        }

.archive-thumb-title span {
    width: 100%;
    display: block;
    height: 0px;
}

    .archive-thumb-wrap:hover .archive-thumb-title {
        color: #da2a4d;
    }

.archive-book-cover-wrap {
    width: 38%;
    margin: 0 1%;
    float: left;
}

.archive-book-cover {
    width: 100%;
    box-shadow: 0 5px 30px 0 #000;
    background-size: 100% 100%;
}

    .archive-book-cover::after {
        padding-top: 145%;
        display: block;
        content: '';
    }

@media (min-width: 0px) and (max-width: 1400px) {
    
    #comic-info-wrap {
        width: 100%;
        float: none;
    }
    
    #comic-info {
        margin: 0;
    }
    
    #archive-feature-wrap {
        margin-top: 20px;
        width: 100%;
        float: none;
    }
    
    .archive-thumb-title {
        font-size: 15px;
        line-height: 15px;
        text-align: center;
    }
    
}

@media (min-width: 0px) and (max-width: 1200px) {
    
    .archive-book-cover-wrap {
        width: 47%;
        margin: 0 1.5%;
        float: left;
    }

    .archive-thumb-wrap {
        width: 22%;
        margin: 0 1.5%;
        float: left;
        cursor: pointer;
    }
    
    .archive-thumb-title {
        font-size: 12px;
        line-height: 12px;
        text-align: center;
    }

    
}

@media (min-width: 0px) and (max-width: 900px) {
    
    .archive-book-cover-wrap {
        width: 62.6%;
        margin: 0 2%;
        float: left;
    }

    .archive-thumb-wrap {
        width: 29.3%;
        margin: 0 2%;
        float: left;
        cursor: pointer;
    }
    
    .archive-thumb-title {
        font-size: 10px;
        line-height: 10px;
        text-align: center;
    }

    
}
    

/* COMIC */

#page-title.lfg {
    max-width: 1402px;
}

#content-page.lfg {
    max-width: 1402px;
}   

#comic-wrap {
    width: 742px;
}

#comic {
    width: 740px;
    padding: 0;
    background: #fff;
    border-top: 1px solid #f4f0e8; 
    border-left: 1px solid #c7b58b; 
    border-right: 1px solid #c7b58b; 
    border-bottom: 2px solid #c2af83; 
    box-shadow: inset 0 0 25px 5px #a68a48, 0 5px 40px 5px #000;
}

    #comic.tda {
        width: 1000px;
        margin: 30px auto 10px auto;
    }

#comic-img {
    padding: 0 20px;
}

    .tda #comic-img {
        padding: 20px;
    }

    #comic-img img {
        width: 100%;
        display: block;
    }

#comic-comments {
    padding: 20px 40px;
    margin: 20px 0 0 0;
    background: #222f37;
    border-radius: 30px;
}

#comic-nav-top {
    height: 30px;
}

    #comic-nav-top .comic-nav-prev, #comic-nav-top .comic-nav-next {
        width: 40px;
        height: 30px;
        float: left;
        display: block;
        color: #cdb99a;
        font-family: 'Catamaran', sans-serif;
        font-weight: 300;
        font-size: 40px;
        line-height: 40px;
        text-align: center;
    }

    #comic-nav-top .comic-nav-prev:hover, #comic-nav-top .comic-nav-next:hover {
        color: #da2a4d;
    }

    #comic-nav-top .comic-nav-title {
        width: 660px;
        height: 20px;
        padding: 10px 0 0 0;
        float: left;
        color: #a7917d;
        font-family: 'Smythe', sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 20px;
        text-align: center;
    }

      #comic-nav-top .comic-nav-prev-none {
        width: 40px;
        height: 30px;
        float: left;
        display: block;
        overflow: hidden;
      }

#comic-footer-title {
        height: 20px;
        padding: 0 0 10px 0;
        color: #8b6f42;
        font-family: 'Smythe', sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 20px;
        text-align: center;
}

#comic-nav-bottom {
    height: 50px;
    padding: 20px 0 0 0;
    overflow: hidden;
}

    #comic-nav-bottom.tda {
        padding: 0;
    }

    #comic-nav-bottom .comic-nav-prev, #comic-nav-bottom .comic-nav-next {
        width: 40px;
        height: 40px;
        margin: 5px;
        float: left;
        display: block;
        text-align: center;
        font-size: 80px;
        font-weight: bold;
        line-height: 37px;
        border-radius: 20px;
        color: #000;
        background: #ffb217;
        overflow: hidden;
    }

      #comic-nav-bottom .comic-nav-prev:hover, #comic-nav-bottom .comic-nav-next:hover {
          background: #da2a4d;
      }

      #comic-nav-bottom .comic-nav-prev-none {
        width: 40px;
        height: 40px;
        margin: 5px;
        float: left;
        display: block;
        overflow: hidden;
      }

    #comic-nav-social {
        width: 300px;
        margin: 0 0 0 25px;
        height: 50px;
        float: left;
    }

    #comic-nav-menu {
        width: 317px;
        padding: 0;
        height: 50px;
        line-height: 50px;
        text-align: center;
        float: left;
        text-transform: uppercase;
    }

#comic-nav-float {
    position: fixed;
    height: 50px;
    width: 742px;
    bottom: 0;
    background: url('style/comic-nav-float.png');
    display: none;
}

    #comic-nav-float .comic-nav-prev, #comic-nav-float .comic-nav-next {
        width: 40px;
        height: 40px;
        margin: 5px;
        float: left;
        display: block;
        text-align: center;
        font-size: 80px;
        font-weight: bold;
        line-height: 37px;
        border-radius: 20px;
        color: #000;
        background: #ffb217;
        overflow: hidden;
    }
    
    #comic-nav-float .comic-nav-prev:hover, #comic-nav-float .comic-nav-next:hover {
        background: #da2a4d;
    }

    #comic-nav-float .comic-nav-title {
        width: 642px;
        height: 50px;
        float: left;
        text-align: center;
        line-height: 50px;
        font-size: 20px;
        text-shadow: 0 0 1px #000, 0 0 2px #000, 0 0 3px #000, 0 0 4px #000, 0 0 5px #000, 0 0 6px #000, 0 0 7px #000, 0 0 8px #000, 0 0 9px #000, 0 0 10px #000, 0 0 11px #000, 0 0 12px #000, 0 0 13px #000, 0 0 14px #000, 0 0 15px #000;
    }

      #comic-nav-float .comic-nav-prev-none {
        width: 40px;
        height: 40px;
        margin: 5px;
        float: left;
        display: block;
        overflow: hidden;
      }

.comic-nav-prev span {
    display: block;
    margin: -1px 0 0 0;
    padding: 0 3px 0 0;
}

.comic-nav-next span {
    display: block;
    margin: -1px 0 0 0;
    padding: 0 0 0 3px;
}

@media (min-width: 0px) and (max-width: 1600px) {
    
    #content-page.lfg, #comic-nav {
        width: 1072px;
    }   
    
}

@media (min-width: 0px) and (max-width: 1162px) {
    
    #content-page.lfg, #comic-nav {
        width: 742px;
    }  
    
    #content-page.lfg #sidebars {
        display: none;
    } 
    
}

@media (min-width: 0px) and (max-width: 1100px) {
    
    #comic.tda {
        width: 100%;
        margin: 0;
        padding: 0;
        box-shadow: none;
    }
    
    #comic.tda img {
        margin: 0 auto;
        max-width: 1000px;
    }
    
}

@media (min-width: 0px) and (max-width: 802px) {
    
    #content-page.lfg, #comic-wrap, #comic-nav {
        width: 702px;
    }   
    
    #comic {
        padding: 0;
    }
    
    #comic-nav-title {
        width: 162px;
    }

    #comic-nav-social {
        width: 300px;
        height: 50px;
        float: left;
    }

    #comic-nav-archive {
        width: 120px;
    }
    
}


/* SIDEBARS */

#sidebars {
    width: 660px;
    float: right;
}

#sidebar-left {
    width: 300px;
    margin: 0 0 0 30px;
    float: right;
}

#sidebar-right {
    width: 300px;
    margin: 0 0 0 30px;
    float: right;
    overflow: hidden;
}

.sidebar-ad {
    width: 300px;
    padding: 0 0 10px 0;
    margin: 0 0 30px 0;
    overflow: hidden;
    background-color: #4f616d;   
    border-radius: 10px
}

h3.sidebar {
    padding: 0 10px;
    margin: 0;
    color: #a2b2bc;
    font-family: 'Smythe', sans-serif;
    font-weight: 400;
    font-size: 17px;
    line-height: 30px;
    display: block;
    text-transform: uppercase;
}

#sidebars .social-buttons {
    width: 100%;
    padding: 0;
    margin: 0 0 30px 0;
}

    #sidebars .social-buttons a {
        margin: 0 20px 0 0;
        background-color: #2b3b45;
    }

    #sidebars .social-buttons a.social-button-reddit {
        margin: 0;
    }

    #sidebars .social-buttons a:hover {
        background-color: #a0112e;
    }

#books {
    padding: 20px 10px 10px 10px;
    background: #2b3b45;
}

    #books a {
        width: 120px;
        margin: 0 10px;
        float: left;
        text-align: center;
    }

    #books-print {
        width: 120px;
        height: 120px;
        margin: 0 10px 0 0;
        float: left;
        display: block;
        text-indent: -9999px;
        background-color: #3a4b56;
        background-size: 100% 100%;
        background-image: url('style/books-print.png');
        border-radius: 60px;
    }

        #books a:hover #books-print {
            background-color: #a0112e;
        }

    #books-digital {
        width: 120px;
        height: 120px;
        margin: 0 10px 0 0;
        float: left;
        display: block;
        text-indent: -9999px;
        background-color: #3a4b56;
        background-size: 100% 100%;
        background-image: url('style/books-digital.png');
        border-radius: 60px;
    }

        #books a:hover #books-digital {
            background-color: #a0112e;
        }   

@media (min-width: 0px) and (max-width: 1600px) {
    
    #sidebars {
        width: 330px;
    }
    
}


/* FOOTER */

#footer {
    padding: 20px;
    background: #162026;
    border-top: 4px solid #dfba59;
    text-align: center;
}

.single-comic #footer {
    border-bottom: 50px solid #000;
}
