/* 
Theme Name: Orvis Child 
Theme URL: https://antoniotahhan.com
Description: Antonio Tahhan's updated theme 2020 
Theme Author: Antonio Tahhan
Author URL: https://antoniotahhan.com
Template: orvis
Version: 1.0.0 
Text Domain: orvis-child 
*/


.site-title{
	font-family: 'Roboto Slab', serif;
	font-size: 1.8em;
	color: #FFE66D;
}

.site-title a:hover{
	text-decoration: none!important;
	color: #FFE66D;
}

.site-description{
	font-size: 0.9em;
	color: #F7FFF7;
}

.search-submit{
	display: none;
}

/*Fixes issue in mobile where search input box overlaps
with navigation menu */
.search-form input{
	margin-top: 5px;
}

.rounded-image{
	border-radius: 50%;
	clear: both;
}

/*--------------------------------------------------------------
## recipe cards (added by ajtahhan 6/5/2020
--------------------------------------------------------------*/

#content div.recipe {
	background-color: rgb(245, 245, 245);
	color: #333;
	margin: 1em 0;
}

#content div.recipe a{
	color: #333;
}

#content div.recipe a:hover{
	background-color: #FFE66D;
}

#content div.recipe h1 {
	/*background: url(images/recipe-header.jpg) no-repeat;*/
	border: 0;
	/*color: #333;*/
	font-size: 2em;
	font-variant: normal;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0px;
	min-height: 50px;
	padding: 20px 0px 10px 0px;
	text-align: center;
}

#content div.recipe ul, ol{
	margin-top: 10px;
	margin-left: 40px;
}


#content div.recipe p.print {
	float: left;
}

#content div.recipe p.print button{
	background-color: #ececec;
	border: 1px solid #a0a0a0;
	padding: 10px 20px;
	position: absolute;
	color: #333;
}
	
#content div.recipe p.print button:hover{
	background-color: #d6d6d6;
}


#content div.recipe p.subtitle {
	color: gray;
	font-style: italic;
	text-align: center;
	margin: 0px;
	padding: 0px;
}

#content div.recipe h2 {
	border-bottom: 1px #333 solid;
	color: gray;
	font-size: 1.4em;
	font-style: bold;
	margin: 0px;
	padding: 10px 0px;
}

#content div.recipe div {
	background: url(images/recipe-footer.jpg) bottom no-repeat;
	padding: 0 25px 60px 25px;
}

/*--------------------------------------------------------------
## recipe page/archives (added by ajtahhan)
--------------------------------------------------------------*/

/* Style the links inside the pill navigation menu */

#recipes_filter ul{
	display: flex;
    align-items: stretch; /* Default */
    justify-content: flex-start;
	flex-wrap: wrap;	
	margin: 0px;
	padding: 0px;
}

#recipes_filter li {
    flex: 0 1 auto; /* Default */
	list-style-type: none;
	margin-bottom: 10px;
	margin-right: 6px;
	background-color: #4e4e4e;
	border-radius: 3px;
}
  
#recipes_filter a {
	text-decoration: none;
	display: block;
	font-size: 13px;
	font-weight: 500;
	padding: 5px;
	border-radius: 3px;
	text-transform: uppercase;
}

/* Change the color of links on mouse-over */
.pill-nav a:hover {
background-color: #F7FFF7;
color: #303030;
}

/* Add a color to the active/current link */
.pill-nav a.active {
background-color: #FFE66D;
color: #303030;
}

#recipes_filter .category_description{
	color: #F7FFF7;
	padding: 5px 10px;
	margin: 5px 0px;
	font-size: 0.9em;
	border-left: 4px solid #FFE66D;
}

.grid-container { 
	display: grid; 
	grid-template-columns: repeat(auto-fill, minmax(152px, 0fr));
	grid-gap: 1rem;
	margin-top: 20px;
}

.grid-item {
	text-align: left;
}

.grid-item img:hover{
	-webkit-filter: opacity(.9);
	filter: opacity(.9);
}

.grid-item .recipe_name{
	font-size: 0.8em;
	word-wrap: break-word;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

.grid-item .recipe_name_arabic{
	font-size: 0.9em;
	word-wrap: break-word;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

.grid-item a.active {
	background-color: #FFE66D;
	color: #303030;
}


/*--------------------------------------------------------------
## recipe page/archives (added by ajtahhan)
--------------------------------------------------------------*/

#projects-grid{
	display: grid;
	grid-template-columns: 150px auto;
}


.project-title{ 
	grid-column: span 2;
	margin:0px;
	padding: 0px;
}

.project-image{
	margin:0px;
	padding: 0px;
	margin-bottom: 40px;
}

.project-excerpt{
	padding-left: 15px;
	margin-top: 0px;
	padding-top: 0px;
}