/*
 * started : 09-APR-2012
 * updated : 02-SEP-2018
 * updated : 17-JUL-2022 Changed "command_list" to "cmd_highlight".
 */

body { background-color: lightblue; }

body
{
   background-color: white;
   color: black;
	# font-family: Arial, Helvetica, Verdana, "Luxi Sans", sans-serif;
	font-family: "Liberation Serif", "Nimbus Roman No 9 L", "Nimbus Roman", "FreeSerif", "Hoefler Text", Times, "Times New Roman", serif;
   font-size: 1rem;
   width: 1024px;
   margin-left: 10%; margin-right: 10%;
}

/* don't underline links */
A:link { text-decoration: none; }

h1, h2, h3, h4, h5, h6
{
	font-family: "DejaVu Sans", "Bitstream Vera Sans", FreeSans, Geneva, Verdana, sans-serif;
}

H1.main_title { color: blue; }

H4 { font-style: italic; }

/* The following definitions for headers are set partly to get round what seems to be a currently odd situation. When you use semantic HTML, it appears to alter the size of headings, for a reason I do not understand. Therefore, I set the specific size for headings to counteract that. */
h1 { font-size: 2em; }

h2 { font-size: 1.8em; }

h3 { font-size: 1.6em; }

blockquote{
  background-color: #f1fbff;
  /* font-size: 1.2em; */
}

blockquote::before{
  font-family:Arial;
  content: "\201C";
  font-size:2em;
}

blockquote::after{
  font-family:Arial;
  content: "\201D";
  /* font-size:2em; */
}

/* ---------------------------------------------------------------------*/
/*
 * Default table style.
 */
TABLE.table_default THEAD TR { background-color: lightgrey; }

TABLE.table_default
{
    font-size: 1em; /* for email */
}

/* style for presenting code where we surround it with a box for emphasis */
pre.code_with_box
{
   font-family: LucidaTypewriter, "Courier New", "Courier";
   margin-left: 5%;
   margin-right: 5%;
   background-color: lightgrey;
   border: thin solid black;
}

pre.code_block
{
   font-family: LucidaTypewriter, "Courier New", "Courier";
   margin-left: 5%;
   margin-right: 5%;
   background-color: lightgrey;
   border: thin solid black;
}
pre.cmd_output
{
   font-family: LucidaTypewriter, "Courier New", "Courier";
   margin-left: 5%;
   margin-right: 5%;
   background-color: lightgrey;
   border: thin solid black;
}

/* ul.command_list */
ul.cmd_highlight
{
   list-style: none;
   list-style-position: inside;
   background-color: lightgrey;
   font-family: LucidaTypewriter, "Courier New", "Courier";
   /* margin: 0;
   padding-left: 0; */
}

/* ul.command_list li::before */
ul.cmd_highlight li::before
{
   content: '$ '
}

p.hcm_business_rule
{
   font-family: LucidaTypewriter, "Courier New", "Courier";
   margin-left: 3%; margin-right: 3%;
   background-color: lightgrey;
   border: thin solid black;
   padding-left: 0;
}

code.code_inline
{
   font-family: LucidaTypewriter, "Courier New", "Courier";
   /* background-color: lightgrey; */
}

/* ---------------------------------------------------------------------*/
/* The following CSS definitions are related to the cookery part of the website.*/

.cookery_summary p
{
   float: left;
   font-size: 1.5em;
	padding-right: 10px;
   /* width: 400px; */
}

.ingredients
{
   clear: both;
}

.horizontal_row_box
{
   clear: both;
}

.horizontal_row_box img
{
   float: left;
	padding: 5px;
}

.ingredients ul
{
   width: 400px;
   float: left;
}

/* This currently doesn't have any active CSS. However, I'm leading this definition here in case I need to add any. */
.ingredients_image img
{
   /* float: left; */
   /* width: 400px; */
}