:root {
 --fore-color:#3a301c;
 --back-color:#3a301c;
 --footer-back-color:#3a301c;
 --footer-border-color:#3a301c;
 --a-link-color:#0277bd;
 --a-visited-color:#01579b;
 --header-fore-color:#ffffff;
 --header-hover-fore-color: #3a301c;
 --header-hover-back-color: #eadea1;
 --main-content-back:#eadea1;
 --header-back-color:#3f7696;
 --header-border-color:#3f7696
}

.inst-div
{
    float:left;
    width:49%;
}
.recipe-ctls
{
    margin: calc(1.5 * var(--universal-margin)) var(--universal-margin);
    
}
.recipe-ctls a, .recipe-ctls a:visited
{
    margin-right:0.5rem;
    line-height:2rem;
    color:var(--header-back-color);
}
.recipe-ctls a:hover
{
    color:#5B97BA;
}
.recipe-ctls-links > :last-child {margin-right: 0 !important; }
header
{
    height:4rem;
}
header [role="button"] {

 height:calc(4rem + var(--universal-padding) / 2);
 line-height:calc(4rem - var(--universal-padding) * 1.5);
 
}
#main-content
{
    background-color:var(--main-content-back);
    padding:2rem;
    padding-bottom:0.8rem;
}

header button:hover,
header button:focus,
header [type="button"]:hover,
header [type="button"]:focus,
header .button:hover,
header .button:focus,
header [role="button"]:hover,
header [role="button"]:focus {
 color:var(--header-hover-fore-color)
}
.logo
{
    width:20rem;
    display:block;
}
.navlinks, .col-right
{
    text-align:right;
}
.drawer-div
{
    padding-top:0.5rem;
    text-align:right;
}


.drawer-links
{
    display:none !important;
}

.container
{
    margin-top:1rem;
}

@media screen and (max-width: 768px) {
    .inst-div
    {
        float:none;
        width:100%;
    }
    .drawer-links
    {
        display:block !important;
    }
    .recipe-dir
    {
        margin-top:20px;
    }
    .navlinks
    {
        display:none;
    }
    #main-content
    {
        padding:1rem;
    }
    .quote{
        text-align:center;
    }
    .container {
    padding: 0;
    margin-top:0rem;
    }
    .search-box
    {
        width:100%;
    }
    .drawer-div
    {
        display:none;
    }
   
}



/*
#search
{
    border-top-right-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}*/

.r_name
{
    font-weight:bold;
}
.recipe-notes
{
    padding-left:1.5rem;
    font-style:italic;
}
.recipe-ing
{
  margin-top:0.8rem;
}
.recipe-title
{
    margin-bottom:2rem;
}



.recipe-meta-title
{
  vertical-align: top;
}
.recipe-meta-value
{
  font-weight:bold;
  padding-left:10px;
  vertical-align:top;
}
.main-search
{
    text-align:center;
}
.search-img img
{
    width:25rem;
    
}
.search-img
{
    margin:0 auto;
}
.search-box
{
    margin:0 auto;
    width:50%;
}
.recipe-meta-tbl td, .recipe-meta-tbl tr
{
    background:inherit;
    border:none;
 
}
.recipe-meta-tbl td
{
    border-bottom:.0625rem solid var(--table-border-color);
}
.recipe-meta-tbl tbody
{
    border:none;
}
.show-search-row .search-box
{
    width:100%;
}
@media screen and (max-width: 767px)
{

    .recipe-meta-tbl td, table.horizontal td {
    display: table-cell;
    text-align:left;
    width:50%;
    }
    .recipe-meta-tbl tr
    {
        display:table-row;
    }
    .search-img img
    {
        width:75%;

    }
    .search-box
    {
        width:80%;
    }
    .logo_div
    {
        margin:auto;
    }
    .show-search-row .search-box
    {
        width:80%;
    }


}
    .responsive-label
{
    margin-top:1rem;
}
/*input:not([type]), [type="text"], [type="email"], [type="number"], [type="search"], [type="password"], [type="url"], [type="tel"], [type="checkbox"], [type="radio"], textarea, select
{
    background: var(--header-back-color);
    color:#fff;
}
input#search
{
    background: var(--input-back-color);
    color: var(--input-fore-color);
}*/
input[type="text"]
{
    width:100%;
    outline:0;
}
input:not([type]), [type="text"], [type="email"], [type="number"], [type="search"], [type="password"], [type="url"], [type="tel"], [type="checkbox"], [type="radio"], [type="submit"], textarea, select{
    outline:0;
}

#custom-search-input
{
    margin-top:1rem;
}
#search
{
    width:100%;
}

/* Reset Select */
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  outline: 0;
  box-shadow: none;
  border: 0 !important;
  background-color: var(--header-back-color);
  background-image: none;
}
/* Remove IE arrow */
select::-ms-expand {
  display: none;
}
/* Custom Select */
.select {
  position: relative;
  display: flex;
  width:auto;

  line-height: 2;
  background-color: var(--header-back-color);
  overflow: hidden;
  border-radius: .25em;
}
.recipe-ctls .select
{
    width:75px;
    float:right;
}
select {
  flex: 1;
  padding: 0 .5em;
  color: #fff;
  cursor: pointer;
}
/* Arrow */
.select::after {
  content: '\25BC';
  position: absolute;
  top: 0;
  right: 0;
  padding: 0 0.5em;
  color:var(--header-fore-color);
  cursor: pointer;
  pointer-events: none;
  -webkit-transition: .25s all ease;
  -o-transition: .25s all ease;
  transition: .25s all ease;
}
/* Transition */
.select:hover::after {
  color:var(--header-fore-color)
}

.editselect
{
    margin-left:4px;
}
.editselect select
{
    background-color: var(--input-back-color);
    
    color: var(--input-fore-color)
}
#newing-form .select
{
    border: 1px #ddd solid;
}
.editselect
{
    background: var(--input-back-color);
    margin: calc(var(--universal-margin) / 2);
}
.editselect.select::after
{
    color:var(--input-fore-color);
}

.recipe-optional
{
    font-weight:bold;
}
form
{
    background:none;
    border:none;
}
label
{
    font-weight:bold;
}

.edit-ing, .edit-recipe-ing
{
    clear:both;
}

.edit-recipe-ing
{
    display:flex;
    margin-bottom:5px;
}
.edit-recipe-ing-title
{
    display:flex;
}
.edit-recipe-ing-title div
{
    text-align:center;
}
.edit-recipe-ing edit-select
{
    margin-left:0px;
}
.ing-input
{
    margin-right:5px;
}
.ing-qual, .ing-name, .ing-notes
{
    flex:1 1;
}
.ing-unit, .ing-qty, .ing-opt, .ing-cancel
{
    flex:0 0 auto;
}
.ing-qty
{
    flex-basis:4rem;
}
.ing-sort
{
    flex-basis:14px;
}
.ing-unit
{
    flex-basis:120px;
}
/*input.ing-input
{
    display:flex;
}

input.ing-qty
{
    width:5%;
}
input.ing-unit
{
    width:10%;
}
input.ing-qual, input.ing-name
{
    width:25%;
}
input.ing-notes
{
    width:31%;
}

.ing-cancel, .ing-opt
{
    width:2%;
}*/
.ing-cancel
{
    text-align:right;
}
.ing-opt input
{
   position:relative;
   top:10px;
}
.fa-times-circle, .fa-sort
{
    color:red;
    position:relative;
    top:13px;
    cursor:pointer;
}
.fa-sort
{
    color:grey;
    cursor:grab;
}
.ui-state-highlight { height: 1.5em; line-height: 1.2em; }

.show-search-row
{
    text-align:center;
}

.recipe-ctls-links
{
    clear:both;
}
.recipe-ing, .recipe-dir
{
    font-size:1.2rem;
}
.ing-add-btn, .newing-add
{
    cursor:pointer;
}
#directions
{
    width:100%;
    max-width:100%;
}
.error
{
    font-weight:normal;
    color:red;
}
#err-summary
{
    display:none;
}
select.error, input.error, textarea.error
{
    background-color:#fec1c1
}
.readonly
{
    cursor:not-allowed;
    background-color:lightgrey !important;
}

.owner_name
{
    font-style:italic;
    font-size:1.4rem;
}