/**
 * Add any custom CSS here.
 *
 * This file will be loaded after all other theme stylesheets.
 */

/******************************** typography ***********************************************/
body, button, input, textarea, ul, li {
	font-family: lato, sans-serif;	
}
h1, h2, h3, h4, h5, h6, #masthead a {
	font-family: montserrat, sans-serif;
}
.site-branding .site-title {
	font-size: 1.86em;
}
header.category-title {
	font-weight: bold; 
	text-align: center; 
	background-color: #a34153;
	color: white;
}
/************************************* end of typography ********************************************/

/******************************** main menu ***********************************************/
.primary-navigation ul.menu li.menu-item ul.sub-menu >a {
	background-color: #9F5C5C;
} 
.primary-navigation ul.menu li.menu-item ul.sub-menu li:hover >a {
	background-color: #f0f0f0;
	color: #9F5C5C;
}
.primary-navigation ul.menu li.menu-item ul.sub-menu li >a {
	color: #9F5C5C;
}
.primary-navigation ul.menu li.menu-item ul.sub-menu li:hover >a {
	color: #9F5C5C;
}
/************************************* end of main menu ********************************************/
html {

}

.woocommerce-breadcrumb{
	display: none;
}

#masthead {
	background-color: #A34153;
	margin-bottom: 0;
}

.custom-logo {
	border-radius: 30px;
	border: 4px solid #423E38;
}

h1.entry-title {
	display:none;
}

section.leader {
	display:none;
}

p.gvoice {
	  text-align:center;
	  font-size:2em;
	  color:black;
}

p.leverage {
	  text-align:center;
	  font-family: montserrat, sans-serif;
	  font-size:1em;
	  font-weight:bold;
	  color:black;
}

.category-card {
    box-shadow: 0px 1px 5px #555;
    background-color: #F0F0F0;
	margin: 1em 0 0 0;
}
.category-card p{
	padding: 12px;
}
.category-card ul{
	padding: 12px;
}

.category-title {
    font-size: 1rem;
    padding: .5rem;
	text-align: center;
}
.category-title h3 {
	font-family: montserrat;
	font-weight: bold; 
	font-size: 1.25em;
}
.cat-description {
	font-family: lato;
    padding: .5rem;
    line-height: 1.6em;
}
.button {
    display: block;
    background-color: #A34153;
    padding: 10px 20px;
    color: white;
    text-decoration: none;
    text-align: center;
    transition: background-color .3s ease-out;
}
button.menu-toggle {
	background-color:#A34153;
	color:white;
	border-color:white;
}
button.menu-toggle:hover {
	background-color:#f0f0f0;
	color:#A34153;
	border-color:#fff;
}
/*** begin :hover styling for the Krusty Burger ***/
button.menu-toggle:hover::before {
	background-color: #A34153;
}
button.menu-toggle:hover::after {
	background-color: #A34153;
}
button.menu-toggle:hover span::before {
	background-color: #A34153;
}
/*** end :hover styling for the Krusty Burger ***/

.woocommerce-mini-cart__empty-message {
	color: rebeccapurple;
	font-weight: bold;
}

/******************** grid styling starts here **********************************/

@supports (grid-area: auto) {

.button {
	align-self: flex-end;
}

@media screen and (min-width: 768px) {
section.homepage-info {
	display:grid;
	grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 2rem 4rem 20rem auto;
    grid-template-rows: 1;
	grid-gap: 1em;
}

article.double {
	display: grid;
	grid-template-rows: auto auto auto;
    grid-template-rows: 1;
	grid-gap: 1em;
}

section.all-homepage-categories {
	display:grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 1em;
}
article.category-card {
	display: grid;
	grid-template-rows: 3rem auto auto;
}
}

@media screen and (min-width: 1024px) {
section.all-homepage-categories {
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 1em;
}
article.category-card {
	display: grid;
	grid-template-rows: 3rem auto auto;
}
}
}