/* roboto-300 - latin-ext_latin */
@font-face {
  font-display: fallback;
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'),
       url('../fonts/roboto-v20-latin-ext_latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v20-latin-ext_latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-300italic - latin-ext_latin */
@font-face {
  font-display: fallback;
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
       url('../fonts/roboto-v20-latin-ext_latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v20-latin-ext_latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-regular - latin-ext_latin */
@font-face {
  font-display: fallback;
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'),
       url('../fonts/roboto-v20-latin-ext_latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v20-latin-ext_latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-italic - latin-ext_latin */
@font-face {
  font-display: fallback;
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: local('Roboto Italic'), local('Roboto-Italic'),
       url('../fonts/roboto-v20-latin-ext_latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v20-latin-ext_latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-700 - latin-ext_latin */
@font-face {
  font-display: fallback;
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('../fonts/roboto-v20-latin-ext_latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v20-latin-ext_latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-700italic - latin-ext_latin */
@font-face {
  font-display: fallback;
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'),
       url('../fonts/roboto-v20-latin-ext_latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v20-latin-ext_latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


div#index.chapter > div.titlepage {
	display:none;
}

/*
#index_region > .anchor { padding-top: 50px; }
*/

@media screen and (max-width: 400px) {
	.recipe_steps th, .recipe_steps td {
		padding-right:5px !important;
		padding-left:0px !important;
	}
}

@media screen and (max-width: 360px) {
	.recipe_steps th, .recipe_steps td, .recipe_steps td p {
		font-size:97%;
	}
}

@media screen and (max-width: 320px) {
	.recipe_steps th, .recipe_steps td, .recipe_steps td p{
		font-size:95%;
	}
}


html {
	position: relative;
    min-height: 100%;
}

body {
	font-size:16px;
	margin: 0;
}

body,
.brand,
h1,
h2,
h3,
h4,
h5,
h6 {
    /* font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif; */
    font-family: Roboto, sans-serif;
}



/* The following adds some distance between the page title/heading (e.g. recipe name) and the page content */
h2.title {
	margin-bottom: 25px;
}


a
{
	background-color: transparent;
	color:#d04805;
}
a:active,a:visited
{
	color:#d04805;
	outline: 0;
	text-decoration:none;
}

a:hover
{
	color:#d04805;
	outline: 0;
	text-decoration:underline;
}

.bg-dark a, .bg-dark a:active, .bg-dark a:visited, .bg-dark a:hover {
	color:#ffffff !important;
} 

.bg-primary a
{
	background-color: transparent;
	color:#272727 !important;
}
.bg-primary a:active, .bg-primary a:visited
{
	color:#272727;
	outline: 0;
	text-decoration:none;
}

.bg-primary a:hover
{
	outline: 0;
	text-decoration:underline;
}

section.narrow-werdandi {
  padding: 25px 0 50px 0;
}

.bg-werdandi {
  background-color: #CCCCCC;
}


/* ===== Recipe Specific Styling ===== */
div.recipe_steps div table tbody tr:last-child td {
 border-bottom:0;
}

table.recipe-summary tbody tr td,
table.recipe-summary-below tbody tr td
{
  border-bottom:0px;
  padding-top:0px !important;
  padding-bottom:0px !important;
  padding-left:0px !important;
}

.recipe_step_prep p {
	margin-bottom: 0.5em;
}

.recipe-steps div.informaltable table {
  border-collapse: collapse;
}

.recipe_ing_table {
	vertical-align:top;
}

.recipe_ing_table table {
	margin-bottom:0;
}

.recipe_amount {
	vertical-align:top;
	border-bottom:0;
	width: 5em;
	padding-top:0;
	padding-right: 1em;
	padding-bottom: 4px;
	white-space: nowrap;
}

.recipe_product {
	vertical-align:top;
	border-bottom:0;
	width: 10em;
	padding-top:0;
	padding-right:0;
	padding-bottom: 4px;
	

  -ms-hyphens: manual;
  -moz-hyphens: manual;
  -webkit-hyphens: manual;
  -khtml-hyphens: manual;
  hyphens: manual;

}

.recipe_step_prep {
	vertical-align:top;
	width: 50em;
	padding-left: 1em;
}

.recipe_step_prep p {
	margin-top: 0px;
	padding-top: 0px;
}


div.recipe_steps div table tbody tr:last-child td {
 border-bottom:0;
}



/* ===== DocBook Nav Header / Footer ===== */
div.navheader table tbody tr th,
div.navheader table tbody tr td,
div.navfooter table tbody tr th,
div.navfooter table tbody tr td
{
	border-bottom:0;
	padding: 0;	
	color:#272727;
}

div.navheader table tbody tr td[align=left],
div.navfooter table tbody tr td[align=left],
div.navheader table tbody tr th[align=left],
div.navfooter table tbody tr th[align=left]
{
	text-align: left;
	width: 15%;
}

div.navheader table tbody tr td[align=center],
div.navfooter table tbody tr td[align=center],
div.navheader table tbody tr th[align=center],
div.navfooter table tbody tr th[align=center]
{
	text-align: center;
	width: 70%;
}

div.navheader table tbody tr td[align=right],
div.navfooter table tbody tr td[align=right],
div.navheader table tbody tr th[align=right],
div.navfooter table tbody tr th[align=right]
{
	text-align: right;
	width: 15%;
}

/* ===== TagCloud ===== */
.tag-cloud-container {
  text-align : justify;
}

#content ul.tag-cloud,
#content ul.tag-cloud li,
ul.tag-cloud,
ul.tag-cloud li {
  display: inline;
  margin:0;
  padding:0 0.25em 0 0;
}

.level1 {
  font-size : 1em;
}
.level2 {
  font-size : 1.2em;
}
.level3 {
  font-size : 1.4em;
}
.level4 {
  font-size : 1.6em;
}
.level5 {
  font-size : 1.8em;
}
.level6 {
  font-size : 2em;
}
.level7 {
  font-size : 2.2em;
}
.level8 {
  font-size : 2.4em;
}
.level9 {
  font-size : 2.6em;
}
.level10 {
  font-size : 2.8em;
}

.footer {

	height:50px;
	padding-top:15px;
	background-color:rgba(255,255,255,0.9);
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    overflow:hidden;
}

/* Tables*/
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; 
}
  
  
/*
p {
	font-size:100%;
}
*/

.panel-body p a {
	font-weight:700;
}


/* Meal Chart */
.meal_chart {
	width:100%; 
	height:100px; 
	display:block;
	-webkit-padding-start: 0px;
}

.meal_chart li {
	padding:0px; 
	display:inline; 
	float:left; 
	height:100%;
}
.meal_chart li a {
	height:100%;
	display:block; 
}

.beigenoise {
	background: url(../mealchart/beigenoise.jpg);
}

.bluenoise {
	background: url(../mealchart/bluenoise.jpg);
}

.brownnoise {
	background: url(../mealchart/brownnoise.jpg);
}

.greennoise {
	background: url(../mealchart/greennoise.jpg);
}

.greynoise {
	background: url(../mealchart/greynoise.jpg);
}

.pinknoise {
	background: url(../mealchart/pinknoise.jpg);
}

.purplenoise {
	background: url(../mealchart/purplenoise.jpg);
}

.rednoise {
	background: url(../mealchart/rednoise.jpg);
}

.yellownoise {
	background: url(../mealchart/yellownoise.jpg);
}
.orangenoise {
	background: url(../mealchart/orangenoise.jpg);
}
.darkerbluenoise {
	background: url(../mealchart/darkerbluenoise.jpg);
}


.meal_chart_legend {
	width:100%; 
	display:block; 
	list-style:none; 
	margin-top: 20px;
}

.meal_chart_legend li {
	display:inline-block; 
	/*float:left;*/ 
	margin-right: 25px;
}

.meal_chart_legend li a {
	margin-top:-5px; 
	margin-right: 5px;
	width:30px;
	height:30px;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15x;
	display:inline-block;
	/*float:left;*/ 
}
.meal_chart_legend li span {
    vertical-align: top;
}

.box {
	margin-bottom:30px !important;
}


.img-thumbnail {
	border:0;
	padding:0;
	border-radius: 0px;
	
}



a:focus {
	outline: none !important;
}
#photos_and_slideins > a,
#photos_and_slideins > a:active,
#photos_and_slideins > a:visited,
#photos_and_slideins > a:focus,
#photos_and_slideins > a:hover {
	outline:none;
	text-decoration:none;
} 

#notification, #cache_problem_notification {
    position: fixed;
    top: 0.5em;
    left: 0;
    width: 100%;
    z-index: 2000;
}

#notification-inner-message, #cache_problem_notification-inner-message {
    margin: 0 auto;
}




a#debuginfolink,
a#debuginfolink:active,
a#debuginfolink:visited,
a#debuginfolink:focus,
a#debuginfolink:hover
 {
	color: white !important;
	text-decoration:none;
}

#alerts .row .col-lg-12 .alert {
	margin-bottom: 0px !important;
	margin-top: 20px;
}


#portfolio .portfolio-item {
  margin: 0 0 15px;
  right: 0;
}
#portfolio .portfolio-item .portfolio-link {
  max-width: 400px;
}
#portfolio .portfolio-item .portfolio-link,
#portfolio .portfolio-item .portfolio-link-full-width {
  display: block;
  position: relative;
  margin: 0 auto;
  cursor: pointer
}


#portfolio .portfolio-item .portfolio-link .portfolio-hover,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-hover {
  background: rgba(240, 95, 64, 0.8);
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all ease 0.5s;
  -webkit-transition: all ease 0.5s;
  -moz-transition: all ease 0.5s;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-hover:hover {
  opacity: 1;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-hover .portfolio-hover-content {
  position: absolute;
  width: 100%;
  height: 20px;
  font-size: 24px;
  text-align: center;
  top: 50%;
  margin-top: -12px;
  color: white;
  padding-left: 5px;
  padding-right: 5px;
}
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content .subtitle,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-hover .portfolio-hover-content .subtitle {
  font-size: 20px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-hover .portfolio-hover-content i {
  margin-top: -12px;
}
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-hover .portfolio-hover-content h3,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-hover .portfolio-hover-content h4 {
  margin: 0;
}

#portfolio .portfolio-item .portfolio-link .portfolio-img,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-img {
  display:flex;
  flex-grow: 1;
}

#portfolio .portfolio-item .portfolio-link .portfolio-img img,
#portfolio .portfolio-item .portfolio-link-full-width .portfolio-img img {
  object-fit:cover;
}


#portfolio .portfolio-item .portfolio-caption {
  max-width: 400px;
  margin: 0 auto;
  background-color: white;
  text-align: center;
  padding: 25px;
  /*
  height: 15vh;
  max-height: 80px;
  */
}
#portfolio .portfolio-item .portfolio-caption h4 {
  text-transform: none;
  margin: 0;
}
#portfolio .portfolio-item .portfolio-caption p {
  font-style: italic;
  font-size: 16px;
  margin: 0;
}


/*
#portfolio * {
  z-index: 2;
}
*/

@media (min-width: 767px) {
  #portfolio .portfolio-item {
    margin: 0 0 30px;
  }
}

.portfolio-banner {
	height:30vh; 
	min-height:200px; 
	object-fit:cover; 
	width:100%;
}

/*
.equal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
  flex-wrap: wrap;
}
.equal > [class*='col-'] {
  display: flex;
  flex-direction: column;
}
*/


.spinner {
  border: 3px solid #eeeeee;
  border-radius: 50%;
  border-top: 3px solid #aaaaaa;
  width: 30px;
  height: 30px;
  -webkit-animation: spin 1.5s linear infinite; /* Safari */
  animation: spin 1.5s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


#foodMap path {
	stroke:#666666;
    fill: #dddddd;
}
    
#foodMap path:hover {
    stroke-width: 2;     
    fill: #e5e5e5;
}
    
#maptoolTip {
	display: block;
	visibility:hidden;
	opacity:0;
	margin-left: 10px;
	padding: 7px;
	position: absolute;
	z-index: 1000;
	background-color:#eeeeee;
	transition: visibility 0s, opacity 0.5s linear;
	font-size: 0.9em;
	pointer-events: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-moz-box-shadow:    3px 3px 10px 0px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.25);
	box-shadow:         3px 3px 10px 0px rgba(0, 0, 0, 0.25);
	color: #222222 !important;
}

#maptoolTip p {
  margin: 0;
  padding: 0;
}
        
#foodMap {
    width:100%;
}

#foodMap path.color1 {
    fill: #fff6e5;
}
#foodMap path.color1:hover {
    fill: #ffffff;        
}
#foodMap path.color2 {
    fill: #ffedcc;
}
#foodMap path.color2:hover {
    fill: #fff6e5;        
}
#foodMap path.color3 {
    fill: #ffe4b2;
}
#foodMap path.color3:hover {
    fill: #ffedcc;        
}
#foodMap path.color4 {
    fill: #ffdb99;
}
#foodMap path.color4:hover {
    fill: #ffe4b2;        
}
#foodMap path.color5 {
    fill: #ffd27f;
}
#foodMap path.color5:hover {
    fill: #ffdb99;        
}
#foodMap path.color6 {
    fill: #ffc966;
}
#foodMap path.color6:hover {
    fill: #ffd27f;        
}
#foodMap path.color7 {
    fill: #ffc04c;
}
#foodMap path.color7:hover {
    fill: #ffc966;        
}
#foodMap path.color8 {
    fill: #ffb732;
}
#foodMap path.color8:hover {
    fill: #ffc04c;        
}
#foodMap path.color9 {
    fill: #ffae19;
}
#foodMap path.color9:hover {
    fill: #ffb732;        
}
#foodMap path.color10 {
    fill: #ffa500;
}
#foodMap path.color10:hover {
    fill: #ffae19;        
}

button.tocCloseCollapse {
	margin-top: 20px !important;
	font-size: 30px !important;
}

button.tocCloseCollapse.collapsed:before {
    content:'+' ;
/*    display:block;
    width:15px;*/
}
button.tocCloseCollapse:before {
    content:'-' ;
/*    display:block;
    width:15px;*/
}

span.larger {
	font-size: 135%;
}

.dictionaryentry table {
	margin: auto;
	width: 75%;
	margin-bottom: 25px;
}

.dictionaryentry td {
	border: none;
	vertical-align: top;
	padding: 8px 15px;
}

div.indexdiv > dl > dt > a:before {
  display: block;
  height: 80px;   /* equal to the header height */
  margin-top: -80px;  /* negative margin equal to the header height */
  visibility: hidden;
  content: "";
}

div.indexdiv > dl > dt > a.indexterm:before {
  display: inline-block;
  height: 0px;
  margin-top: 0px;
  visibility: hidden;
  content: "";
}


div.indexdiv > dl > dt {
  font-size: 120%;
}

#index_name div.indexdiv > dl > dt {
  font-size: 100%;
}


div.indexdiv > dl > dd {
  margin-left: 1em;
}


#back-to-top-link {
  visibility: hidden; 
  position: fixed; 
  bottom: 1em; 
  right: -0.5em; 
  z-index: 99; 
  border: none; 
  outline: none; 
  background-color: #f4623a; 
  cursor: pointer;
  padding: 0.5em 1em 0.5em 0.5em;
  border-radius: 10px;
  font-size: 1em;  
  opacity: 0;
  transition: visibility 0.5s, opacity 0.5s linear; 
}

@media screen and (max-width: 576px) {
  #back-to-top-link {
    bottom: 4em;
  } 
}


#back-to-top-link.show {
  visibility: visible;
  opacity: 1;
}


/* increasing font size a little and reducing the padding to keep the height of the navbar constant */
.navbar-brand {
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    font-size: 1.5rem;
}

/* increasing font size of navigation links a little */
#mainNav .navbar-nav .nav-item .nav-link {
   font-size: 1rem;
}