/*
 Theme Name:   GeneratePress Child (BEC)
 Theme URI:    https://build-electronic-circuits.com/
 Description:  BEC's Child Theme for GeneratePress
 Author:       Oyvind Dahl
 Author URI:   https://build-electronic-circuits.com/
 Template:     generatepress
 Version:      1.0.0
 Text Domain:  generatepress-child
*/



/* Misc Elements that need a fix */

.entry-content figure.wp-block-image,
.entry-content .wp-block-image figure {
    margin-bottom: 1.5em;
}

figcaption {
	font-size: 14px;
	font-weight: 600;
	margin-top: 0.5em;
	margin-bottom: 1em;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
}

p#breadcrumbs {
	font-size: 14px;
}

h2.widget-title {
	font-size: 24px;
	font-weight: 600;
}

.textwidget {
	margin-bottom: 40px;
}

.add-padding {
	padding:20px;
}


.main-nav .menu-item a {
	font-size:16pt;
}
.main-nav .menu-item .sub-menu a {
	font-size:14pt;
}

/* Divide the main menu Tutorials dropdown into two columns */
.main-navigation li.two-column-menu > ul {
    display: grid;
    grid-template-columns: 50% 50%;
    width: 500px;
}

/* Mainly for embedded Youtube videos */
.wp-block-embed {
    margin-bottom: 30px;
}




/*------------ Front Page -----------------*/

/* Style the Featured In section on the front page */
.featured-in {
	text-align:center;	
}
.featured-in img {
	padding-left:20px;
	padding-right:20px;
	padding-bottom:10px;
	max-height: 30px;
}

.featured-resources h3 > a {
	color: #2d3142;
	text-decoration: none;
}

.featured-resources h3 > a:hover {
	color: #e86b59;
}

.hero-banner {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}


/*------------ Table of contents for pages -----------------*/

.mobile_toc {
		display: none;
}

.toc {
		padding: 15px;
}

.toc-title {
    font-weight: bold;
    margin-bottom: 10px;
}

.toc ul {
    list-style-type: none;
    padding-left: 0;
		margin: 0 0 1.5em 1.5em;
}

.toc li {
    margin-bottom: 5px;
}

.toc li.h3 { 
    margin-left: 15px;  /* Indentation for h3 items */
}




/*------------ Pinout and truth table styling -----------------*/

.pinout.compact td {
    padding: 0.2em;
}

.truth-table table,
.pinout table {
	font-size: 0.8em;
	background: #feffd0;
	margin-bottom: 20px;
}

.truth-table th,
.pinout th {
	font-weight: 700;
}

.truth-table tbody,
.pinout tbody {
	font-weight: 400;
}

.content .truth-table table {
	margin: auto;
	width: auto;
}

.truth-table td,
.truth-table th {
	text-align: center;
}


/*------------ Code Blocks -----------------*/

pre.wp-block-code {
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-left: 3px solid #E86B59;
    color: #404660;
    page-break-inside: avoid;
    font-family: monospace;
    max-width: 100%;
    overflow: auto;
    word-wrap: break-word;
}

.wp-block-code code {
    font-family: monospace;
    line-height: 1.6;
}





/*------------ Highlight boxes -----------------*/

.yellow-box {
	background: none repeat scroll 0 0 #fbdd71;
	clear: both; 
	margin-bottom: 30px; 
	overflow: hidden; 
	border-radius: 8px;
	padding: 20px;
}

.yellow-box span {
	color: #e86b59;
}

.gray-box {
	background: none repeat scroll 0 0 #e7e8eb;
	clear: both; 
	margin-bottom: 30px; 
	overflow: hidden; 
	border-radius: 8px;
	padding: 13px;
}




/*------------ Settings aimed at https://www.build-electronic-circuits.com/products/ebook-2nd-edition/ -----------------*/

.page-template-default h2 {
    font-size: 48px;
    margin-bottom: 40px;
}

.page-template-default blockquote {
    font-size: 1em;
}


/*------------ Settings aimed at front page icon-menu -----------------*/

.tutorials-group a {
    text-align: center;
    text-decoration: none;
}

.tutorials-group {
  color: #404660;
  justify-content: center;
  display: grid;
  grid-template-columns: 159px 159px 159px 159px 159px;
  grid-row: 190px 190px 190px 190px 190px;
  gap: 10px 10px;
  max-width: 1100px;
  grid-template-columns: repeat(auto-fit, 159px);
}

.tutorial-single {
  width: 175px;
  height: 159px;
  background: #f9f9f9;
  place-items: center;
  border-radius: 18px;
  margin: 14px, 14px;
  transition: all 150ms ease-in-out;
  display: grid;
}
.tutorial-single:hover {
  cursor: pointer;
  width: 175px;
  height: 159px;
  background: #fff;
  box-shadow: 1px 1px 1px#2d3142;
  margin: 14px, 14px;
}

.tutorial-single img {
  display: block;
  margin-top: 14px;
  justify-content: center;
  align-items: center;
  grid-template-columns: repeat(auto-fit, minmax(20px, 40px));
}



/*------------ Responsive stuff -----------------*/

@media (max-width: 768px) {
	/* Display the mobile TOC on small devices (for 7400 and 4000 pages only) */
	.mobile_toc {
		display: block;
	}
	.sidebar_toc {
		display: none;
	}
}

@media screen and (min-width: 380px) {
  .tutorials-group {
    grid-template-columns: repeat(auto-fill, minmax(159px, 1fr));
    justify-content: center;
    align-items: center;
    margin: 0px, 30px, 0px;
  }
}