@charset "UTF-8";
/* CSS Document */

body
{
   max-width: 1024px;
   font-family: Verdana,Arial,sans-serif;
   font-size: 1.0em;
   background-color: #f0f0f0;
   height: 100%;
   margin: 0 auto;
}

p
{
   font-family: 'PT Serif', Georgia, serif;
   text-indent: 1.5em;
   margin: 0em 0.0em 0.6em;
}

.no-indent
{
   font-family: 'PT Serif', Georgia, serif;
   text-indent: 0em;
   margin: 0em 0.0em 0.6em;
}

.reader
{
   font-family: 'PT Serif', Georgia, serif;
   max-width: 652px;
   margin: 0 auto;   
}

.reader-no-indent
{
   font-family: 'PT Serif', Georgia, serif;
   text-indent: 0em;
   max-width: 652px;
   margin: 0 auto;   
}

.one-em
{
   font-family: 'PT Serif', Georgia, serif;
   font-size: 1.0em;
   line-height: 1.2em;
   text-indent: 1.5em;
   margin: 0em 0.0em 0.6em;
}

.one-point-one-em { /* classichomemovies recipes  */
   font-family: 'PT Serif', Georgia, serif;
   font-size: 1.1em;
   line-height: 1.3em;
   text-indent: 1.5em;
   margin: 0em 0.0em 0.6em;    /* was: margin: 0.5em 1.0em 0.4em 1.0em;  */
}

.one-point-one-em-no-indent { /* classichomemovies recipes  */
   font-family: 'PT Serif', Georgia, serif;
   font-size: 1.1em;
   line-height: 1.3em;
   text-indent: 0.0em;
   margin: 0em 0.0em 0.6em;  /* was: margin: 0.5em 1.0em 0.4em 1.0em;  */
}

.crosshead  {
   font-family: Verdana,sans-serif;
   font-size: 1.2em;
   font-weight: bold;
   line-height: 1.4em;
   text-indent: 0.0em;
   margin: 0em 0.0em 0.6em;
}

.crosshead-gray  {
   font-family: Verdana,sans-serif;
   font-size: 1.2em;
   color: #666666;
   font-weight: bold;
   line-height: 1.4em;
   text-indent: 0.0em;
   margin: 0em 0.0em 0.6em;
}

.recipe  {
   max-width: 600px;
   text-align:left;
}

.credits  {
   font-family: Verdana,sans-serif;
   font-weight: normal;
   text-indent: 0.0em;
   margin: 0.0em 0.0em 0.4em;
}

.fine-print {
    font-family: Verdana,sans-serif;
	text-indent: 0em;
}

.about
{
   font-family: Verdana,sans-serif;
   text-align: left;
   text-indent: 0em;
}

#site-name   /* classichomemovies.com */
{
   max-width: 100%;
   font-family: Verdana,sans-serif;
   font-weight: bold;
   text-indent: 0em;
   text-align: center;
   text-decoration: none;
}

a.site-name, a.site-name:visited   /* classichomemovies.com */ 
{
     color: #cc3300;
	 text-decoration: none;
}


.sites
{
	font-size: 1.0em;
	font-family: Verdana,Geneva,sans-serif;
}

.sites ul {
    list-style-type: none;
    margin: auto;
	padding: 0;
    overflow: hidden;
    background-color: #bcd9e1;
	/* For IE, the outcast */
        zoom:1;
        *display: inline;
}

.sites li {
	float: left;
}

.sites li a {
    display: block;
    color: 0000ff;
    text-align: center;
    padding: 0.3em;
	margin: 0.0em 0.0em 0.0em 0.6em;
    text-decoration: none;
}

.sites li a:hover:not(.active) {
    background-color: #ddd;
}

.sites li a.active {
    color: white;
	font-weight: bold;
    background-color: #e6001e;
}


#site-title    /* With using dropdown menus now, #site-title is OBSO */
{
   font-family: Verdana,Geneva,sans-serif;
   text-align: left;
   text-indent: 0em;
   font-size: 1.07em;
   color: #e6001e;
   margin: 0.1em 0.5em 0.8em;
}

.white-type {
   font-family: Verdana, Geneva, sans-serif;
   color: white;
   text-indent: 0em;
   margin: 0.1em 0.0em 0.5em 1.3em;
}

ul.menu-list   /* classichomemovies.com top, also Prev/Next nav */
   {
       list-style-type: none;
	   height: auto;
      text-align: center;
	  padding: 0;
      -ms-text-justify: distribute-all-lines;
      text-justify: distribute-all-lines;
   }
   
   li.menu-item   /* classichomemovies.com */
   {
      width: auto;
      vertical-align: top;
      display: inline-block;
      *display: inline;
      zoom: 1;
   }
   
   li.prev-next   /* Prev/Next nav */
   {
      width: auto;
      vertical-align: top;
      display: inline-block;
      *display: inline;
      zoom: 1;
   }


a.menu-item-link   /* classichomemovies.com nav */
{
   font-family: Verdana,sans-serif;
   text-decoration: none;
   color: #0066ff;
position: relative;
}

a.prev-next-link   /* Prev/Next nav */
{
   font-family: Verdana,sans-serif;
   text-decoration: none;
   color: #0066ff;
position: relative;
}

a.menu-item-link:hover   /* classichomemovies.com nav */
{
   color: #000000;
}

a.prev-next-link:hover   /* Prev/Next nav */
{
   color: #000000;
}

a.menu-item-link:active   /* classichomemovies.com nav */
{
   color: #FF0000;
}

a.prev-next-link:active   /* Prev/Next nav */
{
   color: #FF0000;
}

.dropdown {
  position: relative;
  display: inline-block;
  text-indent: 0.0em;
}

.dropdown2 {       /* classichomemovies.com recipes*/
  position: relative;
  display: inline-block;
  text-indent: 0.0em;
}

.dropdown2 div {
    right:-49px;
}


.dropbtn {    /* dropdown button */
  background-color: #f0f0f0;
  color: #e6001e;
  padding: 0.5em 0.5em 0.5em 2.55em;
  border: none;
  cursor: pointer;
}

.dropbtn2 {    /* dropdown button - classichomemovies */
  background-color: #4e4ec6;
  color: #fff032;
  padding: 0.35em 0.3em 0.35em;
  font-size: 1.0em;
  border: none;
  cursor: pointer;	
}

.dropbtn:hover, .dropbtn:focus {
  background-color: #fff032;
  font-weight: normal;
}

.dropbtn2:hover, .dropbtn2:focus {   /* classichomemovies */
  background-color: #000066;
  font-weight: normal;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #000000;
  min-width: 19em;
  max-width: 19em;
  height: calc(100vh - 80px);
  overflow-x: auto;
    overflow-y: scroll;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
  z-index: 1;
}

.dropdown-content a {
  color: white;
  padding: 0.5em 1.0em;
  font-size: 0.9em;
  text-align: left;
  text-decoration: none;
  display: block;
}

.dropdown a:hover {background-color: #e6001e;}

.dropdown2 a:hover {background-color: #5e5eff;}

.show {display: block;}

a.about-link
{
   text-decoration: none;
   color: #0066ff;
position: relative;
}

a.about-link:hover
{
   color: #000000;
}

a.linktotop-link
{
   text-align: center;
   text-decoration: none;
   color: #0066ff;
position: relative;

}

a.linktotop-link:hover
{
   color: #000000;
}

a.contact-link
{
   font-size: 0.9em;
   text-decoration: none;
   color: #666666;
   position: relative;

}

a.contact-link:hover
{
   color: #000000;
}


.fluidMedia {
    position: relative;
    padding-bottom: 56.25%; /* proportion value to aspect ratio 16:9 (9 / 16 = 0.5625 or 56.25%) */
    padding-top: 0px;
    height: 100%;  /*  Depending on your case I suggest you set height for images */
    overflow: hidden;
}

.fluidMedia iframe {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%;
    height: 100%;
}


img
{
   border: 0em;
    width: 100%;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}


#main-footer {
   background-color: #e6e6e6;
   text-align: left;
   font-family: Verdana,Geneva,sans-serif;
   text-indent: 0em;
}

#main-footer span {
    float: right;
}




.about span {
	font-family: Verdana,sans-serif;
	float: right;
    }
	
.aboutcenter
{
   font-family: Verdana,sans-serif;
   text-align: center;
   text-indent: 0em;
}

a.back-to-top  {
   font-family: Verdana,sans-serif;
   text-decoration: none;
   font-weight: bold;
   color: #3c6ef0;
   font-size: 1.0em;
   line-height: 1.0em;
   text-indent: 0.0em;
   margin: 0em 0.0em 0.0em;
}

a.back-to-top:hover
{
   color: #000000;
}

img.responsive 
{ height: auto; 
}

.sticky-header {   /* classichomemovies.com - text align and padding in responsive code */
  background: #c7d3ec;
  color: #000066;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  max-width:inherit;
}

.sticky + .content {
  padding-top: 102px;
}

.bluegraybar {
  border:none;
  color:#c7d3ec;
  background-color:#c7d3ec;
}

#arrowleft {
position: relative; right: 90px; 
font-family: Verdana, Arial, sans-serif;
font-size: 12px;
list-style: none;
margin-top: -75%;
padding: 0px;
text-indent: 0px; }

#arrowleft a {
text-decoration: none;
display: block;
text-indent: 0px;
background: url(arrowleft.png) 0 0 no-repeat;
width: 40px;
height: 150px;}

#arrowleft a:link {
font-weight: normal;
color: #000000;
text-decoration: none;
padding: 0px;}

#arrowleft a:hover {
background-position: -40px 0;}

#arrowleft a:active {
background-position: -80px 0;
font-weight: normal;
color: #FFFFFF;
text-decoration: none;
background-color: none;
padding: 0px;
border: 0px solid #000000;}


#arrowright {
position: relative; 
margin-left: 1070px;
font-family: Verdana, Arial, sans-serif;
font-size: 12px;
list-style: none;
margin-top: 170px;
padding: 0px;
text-indent: 0px; }

#arrowright a {
text-decoration: none;
display: block;
text-indent: 0px;
background: url(arrowright.png) -80px 0 no-repeat;
width: 40px;
height: 150px;  }

#arrowright a:link {
font-weight: normal;
color: #000000;
text-decoration: none;
padding: 0px;  }

#arrowright a:hover {
background-position: -40px 0;}

#arrowright a:active {
background-position: 0 0;
font-weight: normal;
color: #FFFFFF;
text-decoration: none;
background-color: none;
padding: 0px;
border: 0px solid #000000;}

.group {      /* w3schools calls this 'clearfix.' Use this class around floats, it keeps things from overflowing around float  */
  overflow: auto; }


}