/* 
Universal theme styles
*/
.grid-container {
    display: grid;  
    grid-gap: 15px;
	margin-bottom: 15px;
  }

  .grid-four-cols {
    grid-template-columns: auto auto auto auto;
  }
  .grid-three-cols {
    grid-template-columns: auto auto auto;
  }
  .grid-two-cols {
    grid-template-columns: auto auto;
  }
#comic-list{

    list-style: none;
    padding-left: 0;

}
#comic-list>li {
	position: relative;
	border-bottom: 1px solid #111111;
    border-left: 1px solid #111111;
    border-right: 1px solid #111111;
	height: 70px;
	padding: 0;
	margin: 0;
	overflow: hidden;
}

#comic-list>li:first-child {
	border-top: 1px solid #111111;
}

#comic-list>li:hover {
	background: #eee;
}

#comic-list>li>a {
	display: block;
	height: 70px;
	white-space: nowrap;
	cursor: pointer;
	color: #000;
	text-decoration: none;
	overflow: hidden;
}

#comic-list>li>a:focus, #comic-list>li>a:focus .comic-list-item-details {
	color: #ff0000 !important;
}

#comic-list>li>a:focus img {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

#comic-list>li:hover a, #comic-list>li:hover p {
	color: #ff0000;
}

#comic-list>li:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

#comic-list>li>a:hover {
	color: #ff0000;
}

.comic-item {
	vertical-align: center;
	height: 70px;
	padding: 0;
	display: table;
	width: 100%;
	table-layout: fixed;
	text-align: left;
}

.comic-item .thmb {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	height: 70px;
	width: 70px;
	overflow: hidden;
	max-height: 70px;
}

.comic-item .rank {
	position: absolute;
	top: 11px;
	left: 9px;
	z-index: 10;
	color: #fff;
	font-size: 24px;
	font-weight: 600;
	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
#comic-list .thmb img {
	max-height: 70px;
	max-width: none !important;
	width: auto;
	margin: 0 !important;
	padding: 0 !important;
}

.comic-item .comic-info {
	height: 70px;
	padding-left: 10px;
	vertical-align: middle;
	display: table-cell;
}

.comic-title-wrapper {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.comic-item .comic-title {
	height: 26px;
	font-size: 17px;
	overflow: hidden;
	min-width: 0;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin: 0;
	padding: 0;
}

.comic-item .comic-list-item-details {
	color: #848484;
	margin-top: 3px;
	font-size: 14px;
	margin: 0;
	padding: 0;
}
.pagination {
    display: -ms-flexbox;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: .25rem;
  }
  .page-numbers {
    display: inline-block;
    text-align: center;
    width: 1.75rem;
    height: 1.75rem;
    margin-bottom: .5rem;
    margin-right: .5rem;
    color: #000;
    text-decoration: none;
    background-color: #ccc;
    border: 1px solid #000000;
  }
  .page-numbers:hover,  .page-numbers:focus,  .page-numbers:active   {
    color: #fff;
    text-decoration: none;
    background-color: #666;
    border-color: #000000;
  }
.page-numbers.current {

    z-index: 1;
    color: #000;
    background-color: #fff;
    border-color: #000000;

}


#comic-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	grid-gap: 15px;
	align-items: stretch;
	margin-bottom: 15px;
}

#comic-grid img {
	border: 1px solid #ccc;
	box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
	max-width: 100% !important;
	height: auto !important;
}

#comic-grid img:hover {
	opacity: 0.7;
}

.comic-thumbnail-wrapper {
	text-align: center;
}
.more-chapters-wrapper{
	margin-bottom: 15px;
}
.single-comic-navigation {
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
  }
.single-comic-navigation a {
	margin: 0 10px;
	text-decoration: none;
	font-size: 30px;
  }
  .single-comic-navigation a:hover, .single-comic-navigation a:focus,  .single-comic-navigation a:active {
	color: #ff0000;
  }
  .single-comic-navigation img {
	max-height: 35px;
	width: auto;
}
/*--------------------------------------------------------------
# Series Styles
--------------------------------------------------------------*/
.series-thumbnail-wrapper a{
	display: none;
}
.series-thumbnail-wrapper a.series-link, .series-thumbnail-wrapper a.series-thumbnail{
	display: inline-block;
}
#series-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	grid-gap: 15px;
	align-items: stretch;
	margin-bottom: 30px;
}

.series-thumbnail-wrapper {
	display: inline-block;
	position: relative;
}

.series-thumbnail-wrapper img {
	display: block;
	width: 100%;
	height: auto;
}

.series-rollover {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #111111;
	color: #fff;
	overflow: hidden;
	width: 100%;
	height: 0;
	transition: .5s ease;
}

.series-thumbnail-wrapper:hover .series-rollover {
	height: 100%;
}

.series-link, .series-link:hover {
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 90%;
	height: 90%;
	color: #fff;
	font-size: 14px;
	line-height: 15px;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: left;
	text-decoration: none;
}

.series-link:focus {
	outline: none !important;
}

.series-link h3 {
	font-size: 18px;
	line-height: 18px;
	padding-top: 5px;
}

.series-link .description {
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 16px;
}
/* Sidebar calendar widget */

#toocheke-calendar {
	width: 100% !important;
	font-size: 11px !important;
	background-color: transparent;
}

#toocheke-calendar thead th {
	background: transparent !important;
	border: 1px solid #ffffff;
	font-size: 11px !important;
}

#toocheke-calendar tbody td {
	color: #ffffff;
	text-align: center !important;
	border: 1px solid #ffffff;
	line-height: 2.5em !important;
	transition: background 0.15s ease !important;
	-webkit-transition: background 0.15s ease !important;
	-o-transition: background 0.15s ease !important;
	-moz-transition: background 0.15s ease !important;
}

#toocheke-calendar tbody td:hover {
	background: rgba(0, 0, 0, .15) !important;
	color: #ffffff;
}

#toocheke-calendar tbody td a {
	display: block !important;
	text-decoration: none !important;
	background: #ffffff !important;
	color: #000000 !important;
}

#toocheke-calendar tbody td:hover a {
	background: #444 !important;
	color: #fff !important;
}

#toocheke-calendar tfoot td {
	padding-top: 1px !important;
	padding: 4px !important;
}

#toocheke-calendar caption {
	cursor: pointer !important;
	font-size: 13px !important;
	text-transform: uppercase !important;
	margin: 0 !important;
	padding: 12px !important;
	outline: 0 none !important;
	background: #444 !important;
	color: #fff !important;
}

#toocheke-calendar caption:hover {
	opacity: 0.8;
}

#toocheke-calendar tbody a {
	display: block !important;
	text-decoration: underline !important;
}

#toocheke-calendar th {
	text-align: center !important;
	padding: 7px 0 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
}

#toocheke-calendar tfoot a {
	color: #f8d94a;
}
/* Body Calendar */

#archive-page-calendar-wrapper #toocheke-calendar thead th {
	border: 1px solid #000;
}

#archive-page-calendar-wrapper #toocheke-calendar tbody td {
	color: #000;
	border: 1px solid #000;
}

#archive-page-calendar-wrapper #toocheke-calendar tbody td:hover {
	background: rgba(0, 0, 0, .15) !important;
	color: #000;
}

#archive-page-calendar-wrapper #toocheke-calendar tbody td a {
	background-color: #ff0000!important;
	color: #fff !important;
}

#archive-page-calendar-wrapper #toocheke-calendar tbody td:hover a {
	opacity: 0.8;
}

#archive-page-calendar-wrapper #toocheke-calendar th {
	color: #000 !important;
}

#archive-page-calendar-wrapper #toocheke-calendar tfoot a {
	color: #ff0000;
}
.post-type-archive-comic #archive-page-calendar-wrapper{
	padding: 30px;
	max-width: 600px;
margin: 0 auto;
}
.post-type-archive-comic #archive-page-calendar-wrapper .page-title{
	margin-bottom: 15px;
}

/* Comic Layout Options for Desktop and Mobile Users */

#unspliced-comic {
	display: none;
}

@media only screen and (min-width: 991px) {
	#two-comic-options #spliced-comic {
		display: none;
	}
	#two-comic-options #unspliced-comic {
		display: block;
	}
}

@media only screen and (max-width: 990px) {
	#two-comic-options #spliced-comic {
		display: block;
	}
	#two-comic-options #unspliced-comic {
		display: none;
	}
}

@media only screen and (max-width: 1023px) {
    .grid-container {
        grid-template-columns: auto auto;
      }

}
@media only screen and (max-width: 500px) {
    .grid-container {
        grid-template-columns: auto;
      }
}
/*--------------------------------------------------------------
## Chapters navigation
--------------------------------------------------------------*/
#chapters-drodpown {
	padding: 0px 5px;
	font-size: 14px;
	line-height: 14px;
}

#chapter-navigation {
	padding-top: 15px;
	text-align: center;
}

.chapters-nav-label {
	
	font-weight: bold;
	display: inline-block;
	padding: 0px;
	margin: 0;
}
.single-comic-navigation .chapters-nav-label{
	font-size: 1.33333em;
	line-height: 35px;
}
.chapter-inline-nav, .chapter-footer-dropdown{
	display: inline-block;
}
.chapter-inline-nav{
	line-height: 30px;
}
.chapter-inline-dropdown{
	margin-bottom: 25px;
}
.chapter-footer-nav{
	line-height: 35px;
	overflow: hidden;
	position: absolute;
	max-height: 35px;
	margin-top: 5px;
	display: inline-block;
}
.chapter-footer-nav i {
	margin: 0px 5px;
}
.d-none{
	display:none;
}
@media only screen and (max-width: 575px) {
	.chapter-footer-nav, .chapter-footer-dropdown{
		display: none;
	}
	.chapter-inline-nav{
		line-height: 35px;
	}
}