/* 
Theme Name:		 Toocheke Child
Theme URI:		 https://www.toocheke.com/
Description:	 Toocheke Child is a child theme of Toocheke
Author:			 LeeToo
Author URI:		 https://leetoo.net/
Template:		 toocheke
Version:		 1.0.0
Text Domain:	 toocheke-child
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
*/


/* Write here your own personal stylesheet */


/*--------------------------------------------------------------
# Fonts
--------------------------------------------------------------*/

h1 {
	font-family: "sirenne-text-mvb-roman-small", serif;
	font-weight: 400;
	font-style: normal;
}

h2 {
	font-family: sirenne-text-mvb, serif;
	font-weight: 400;
	font-style: normal;
}

h3 {
	font-family: sirenne-text-mvb, serif;
	font-weight: 400;
	font-style: italic;
}

/*--------------
 # Comments
--------------*/


/*--------------------------------------------------------------
# Comic Page
--------------------------------------------------------------*/
/*FOR DESKTOP SCREENS*/
@media only screen and (min-width: 800px){
    #content {
        margin-top: 0 !important;
    }
	#main {
        padding-top: 0 !important;
	}
}

@media only screen and (min-width: 800px){
	#comic {
    	background-color: #fff;
    	text-align: center;
    	padding: 15px;
		margin-bottom: 0; 
    }

    #comic img {
    	clear: both;
	    max-width: 80%;
	    height: auto;
	    margin: 0 auto 16px !important;
	    display: block;
    }
	
.single-comic-wrapper {
    margin-top: 0;
    text-align: center;
}
	
	.single-comic-navigation {
    	padding-top: 0;
    	padding-bottom: 0;
    	background-color: #fff;
    	margin-bottom: 0;
    }

    .single-comic-navigation a {
	    margin: 0 10px;
	    text-decoration: none;
    	font-size: 30px;
    }

    .single-comic-navigation img {
    	max-height: 70px;
    	width: auto;
    	margin: 0;
    }
	
	}
	



/*FOR MOBILE SCREENS*/
@media only screen and (max-width: 799px){
    #comic {
    	background-color: #fff;
    	text-align: center;
    	padding: 0;
		margin-bottom: 24px !important;
    }
	.single-comic-wrapper {
    margin-bottom: 24px;
	}
	#latest-comic{
		margin-bottom: 0 !important;
	}
    #comic img {
    	clear: both;
    	max-width: 100%;
    	height: auto;
    	margin: 0 auto 16px !important;
    	display: block;
    }		
	
	#content {
	    margin-top: 0 !important;
		
	}
	#left-content {
		margin-bottom: 24px !important;
	}
	
	#main {
	    padding-top: 0 !important;
	}
	
	.single-comic-navigation {
    	margin-top: -15px;
    	padding-bottom: 0;
    	background-color: #fff;
    	margin-bottom: 0;
    }

    .single-comic-navigation a {
	    margin: 0 10px;
	    text-decoration: none;
    	font-size: 30px;
    }

    .single-comic-navigation img {
    	max-height: 35px;
    	width: auto;
    	margin: 0;
    }
 
}

/*--------------------------------------------------------------
# Comic Archive
--------------------------------------------------------------*/


#comic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    grid-gap: 5px;
    align-items: stretch;
    padding: 0px 0px 15px 0px;


}


#comic-grid img {
    border: 1px solid white;
	box-shadow: none;
    max-width: 100%;
}


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


.comic-thumbnail-wrapper {
    text-align: center;
}

.archive-collapsible {
    background-image:url(
    "https://thescourgecomic.com/wp-content/uploads/2026/01/archive-button-1.png");
    background-size: 100%;
    background-repeat: no-repeat;
    background-color:black!important;
    border: none;
    color: white;
    cursor: pointer;
    text-align: left;
    width: 100%;
}

//** backgrounds for archive buttons **//


.archive-collapsible:nth-child(2n-1) {
   background-image:url(
    "https://thescourgecomic.com/wp-content/uploads/2026/01/archive-button-1.png");
    background-size: 100%;
    background-repeat: no-repeat;
 }
 .archive-collapsible:nth-child(3n-1) {
   background-image:url(
    "https://thescourgecomic.com/wp-content/uploads/2026/01/archive-button-1.png");
    background-size: 100%;
    background-repeat: no-repeat;
 }
  .archive-collapsible:nth-child(3n+1) {
   background-image:url(
    "https://thescourgecomic.com/wp-content/uploads/2026/01/archive-button-1.png");
    background-size: 100%;
    background-repeat: no-repeat;
 }
 //** end backgrounds for buttons **//

.archive-button:hover, .archive-button:active {
 background-color: white;
 color: black;
}

.archive-grid {
    display: none;
    overflow: hidden;
}

@media only screen and (max-width: 575px) {
    
    #comic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(75px, 1fr));
    grid-gap: 2px;
    align-items: stretch;
    padding: 0px 0px 5px 0px;
}


    #comic-grid img {
    border: 1px solid white;
	box-shadow: none;
    max-width: 100%;
}
    
}