/* christmas.css Created by Nancy Bond for Stuff 4 Church Christmas Page Large Screen and All Screens other than phone of 500 or less */

body { 
  background-color: #cccdce;   /* ebf4fe lighter baby blue; cccdce medium gray; dadcdd Light gray; c8dff8 Light baby blue */
  font-family:      Tahoma, Arial, sans-serif;
  font-size:        16px;
  margin:           auto;
}

@media only screen and (max-width: 900px) {
body {
    font-size: 13px;
  }
}

#pagerectangle {
	background-color: #cccdce;   /* medium gray */
	margin: auto;
	width:  100%;
}

header {
	text-align:  center;
	width:       100%;
	margin:      auto;
}

.large {     /* This hides items like the small header picture. */
   display: none;
}


.center {
  display: inline;
  margin-left: auto;
  margin-right: auto;
}

.line {
  display: inline;
  margin-left: auto;
  margin-right: auto;
}

/* For the links at top above header banner */
#navigation {
	background-color: #ffffff;  /* white with header blue words found at bottom called link.white */
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
        color: ffffff;
}

#colnav1 {		/* FAQs */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 10px 4px 0px;  /* top right bottom left Made the left 0 so that it works correctly when downsizing. */
    vertical-align: middle;
    text-align: center;
    width:   12.3%
}
#colnava {		/* About */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   11.3%
}

#colnavb {		/* Preview */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   11.3%
}
#colnavc {		/* Order */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   11.3%
}
#colnavd {		/* Mysteries */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   11.3%
}

#colnave {		/* Minis */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   11.3%
}

#colnavf {		/* Christmas */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 0px 4px 20px;  /* top right bottom left Made the right 0 so that it works correctly when downsizing. */
    vertical-align: middle;
    text-align: center;
    width:   11.3%
}

#colnavg {		/* Contact */
    display: table-cell;
    background-color: #ffffff;  /* white */
    padding: 2px 0px 4px 20px;  /* top right bottom left Made the right 0 so that it works correctly when downsizing. */
    vertical-align: middle;
    text-align: center;
    width:   12.3%
}

/* Responsive Top large header with bluebirds and Stuff 4 Church */
.img {
  width: 1920px;
  height: 280px;
  object-fit: cover;
}

/* Responsive image at top of Christmas Tree with bulbs. Added percents to the 2 columns so that this worked. */
.imga {
  max-width: 100%;   /* width: 300px; */
  height: auto;     /* height: 536px; */
  object-fit: cover;
}

/* Responsive image header in middle says  5 Unique Christmas Shows */
.img1 {
  max-width: 100%;   /* width: 683px; */
  height: auto;     /* height: 64px; */
  object-fit: cover;
}

/* Responsive Logo Stuff 4 Church in first closer column */
.img3 {
  max-width: 100%;   /* width: 200px; */
  height: auto;     /* height: 160px; */
  object-fit: cover;
}

/* Responsive Bluebird baby at bottom in 5th closer column */
.img4 {
  max-width: 100%;   /* width: 195px; */
  height: auto;     /* height: 156px; */
  object-fit: cover;
}

/* Responsive Facebook at bottom in 3rd closer column */
.img5 {
  max-width: 100%;   /* width: 120px; */
  height: auto;     /* height: 40px; */
  object-fit: cover;
}

/* Responsive email plus home mailing address at bottom in 3rd closer column */
.img6 {
  max-width: 100%;   /* width: 230px; */
  height: auto;     /* height: 134px; */
  object-fit: cover;
}

/* Responsive Theater 4 Church link at bottom in 2nd closer column */
.img7 {
  max-width: 100%;   /* width: 230px; */
  height: auto;     /* height: 64px; */
  object-fit: cover;
}

/* Responsive Nancy Bond Creations Link at bottom in 2nd closer column */
.img8 {
  max-width: 100%;   /* width: 230px; */
  height: auto;     /* height: 32px; */
  object-fit: cover;
}

/* Responsive Nancy's Etsy shop link at bottom in 2nd closer column */
.img9 {
  max-width: 100%;   /* width: 230px; */
  height: auto;     /* height: 28px; */
  object-fit: cover;
}

/* Responsive YouTube link at bottom in 3rd closer column */
.img10 {
  max-width: 100%;   /* width: 184px; */
  height: auto;     /* height: 68px; */
  object-fit: cover;
}

.big {			    /* Very Dark Blue paragraphs at top of page. */
  font-size:     115%;
  color:         #0b2f15; /* Dark Green; was 0c2c50 Dark Blue to match bold paragraph words 154275 */
  line-height:   120%;
  text-align:    justify;
  font-weight:   normal;
}

.boldwords {		 /* Dark Blue bold paragraph words top of page. */
  font-size:     105%;
  color:         #0b2f15;  /* Dark Green; was 154275 */
  line-height:   105%;
  text-align:    left;
  font-weight:   bold;
}

.bold {			  /* Bold, black "You can do this ..." at top of page. */
  font-size:     100%;
  color:         #000000;
  line-height:   140%;
  text-align:    center;
  font-weight:   bold;
}

.boldlink {		  /* Dark Blue link words at top of page like: Preview, How to Order, ... */
  font-size:     115%;
  color:         #154275;
  line-height:   110%;
  text-align:    center;
  font-weight:   bold;
}

.smallslant {		      /* Black text italics. */
  font-size:     90%;
  color:         #000000;
  line-height:   115%;
  text-align:    left;
  font-style:   italic;
}

.smallslantw {		      /* White text italics. */
  font-size:     100%;
  color:         #ffffff;
  line-height:   115%;
  text-align:    left;
  font-style:   italic;
}

.smallslantbig {		      /* Dark Green text italics. */
  font-size:     100%;
  color:         #0b2f15; /* Dark Green; was 0c2c50 Dark Blue to match bold paragraph words 154275 */
  line-height:   115%;
  text-align:    left;
  font-style:   italic;
}

      /* NOT used because made picture so it could downsize. Used in closing gray box for video and Email not link */
.italicsm {
   font-size:     90%; 
   color:         #474444;  /* Dark Gray */
   text-align:    center;
   line-height:   90%;
   font-style:    italic;
}

                          /* Used in footer */
.italicsmblue {
   font-size:     100%; 
   color:         #c8d5e1;  /* light blue */
   text-align:    center;
   line-height:   100%;
   font-style:    italic;
   line-height:   1.1;
}

/* Small Header BLUE Links - TOP page above Header - NO underline - Hover Black */
a.hdrbl:link, a.hdrbl:visited, a.hdrbl:active {
  font-size:     90%;
  color:         #1E5593;   /* Header Blue color */
  text-align:    center;
  vertical-align: middle;
  line-height:   1;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:   none;  
}

a.hdrbl:hover {
  color:            #000000;  /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;
}

/* GREEN Links to go with BIG wording for PREVIEW FORM and ORDER FORM */
a.green:link, a.green:visited, a.green:active {
  font-size:     105%;
  color:         #0b2f15;  /* aec3b4 Dark Green */
  text-align:    left;
  line-height:   120%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #aec3b4;  /* aec3b4 Even lighter; 90a395 Lighter Gray Green */
}

a.green:hover {
  color:         #000000;   /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none; 
}

/* WHITE Links - Hover bright green - found at MIDDLE of page */
a.white:link, a.white:visited, a.white.hover, a.white:active {
  font-size:     100%;
  color:         #ffffff;   /* white */
  text-align:    center;
  vertical-align: middle;
  line-height:   1;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:   none;  
}

a.white:hover {
  color:            #8acc9c;   /* Bright Green */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #4a4b4a;  /* Gray barely shows to match wide */
}

/* LIGHT BLUE Links for FOOTER - Hover white */
a.blue:link, a.blue:visited, a.blue:active {
  font-size:     100%;
  color:         #c8d5e1;   /* Light Blue with gray undertones */
  text-align:    left;
  line-height:   1.5;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #c8d5e1;  
}

a.blue:hover {
  color:            #ffffff;  /* White */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #75828f;  /* Dark Gray */
}

/* BLACK Links for Preview and Order Forms at BOTTOM in 3 Boxes - Hover Gray */
a.bottom:link, a.bottom:visited, a.bottom:active {
  font-size:     100%;
  color:         #000000; /* Black */
  line-height:   115%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #919492;  /* Light gray */
}

a.bottom:hover {
  color:    #465463; /* Very Dark Gray from Header Blue */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;
}

/* No line for image links */
a.none:link, a.none:visited, a.none.hover, a.none:active {
    text-decoration: none;
    border-bottom:   none;
  }

/* Light gray line for image links */
a.gray:link, a.gray:visited, a.gray.hover, a.gray:active {
    text-decoration: none;
    border-bottom:   thin dotted #d7dce2;  /* 55626d Dark gray; d7dce2 light gray */
}

/* Opening includes 3 sections about mystery dinner theaters. */     /*  tried background-image: url("images/backgroundchristmas.png"); images/backgroundchristmas.png The image used */ 
#opening {
	background-color: #ffffff;  /*ebf4fe Lighter baby blue */
	background-image: linear-gradient(#1b582c,#cccdce);   /* from 1b582c tree darker green to 7e7e7f darker gray */
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
}
                           /* row containing col1mystery and col2picture */
#coltop2 {
    display: table-cell;
    background-color: rgba(255, 255, 255, 0.88); /* White background with 88% opacity */
    padding: 0px 0px 0px 4px;  /* top right bottom left Padding does shift a tiny bit to make bottom scroll but worth it.*/
    vertical-align: top;
    text-align: center;
    width: 1200px;
}

/* border above was: border-style: outset; border-left:  4px outset #c0cedf; border-right:  4px solid #c0cedf; border-bottom:  3px solid #c0cedf;  */

/* 1st blank column within the middle column at top */
#col1mystery {			/* Wording: MDT great way to gather paragraph ... */
    display: table-cell;
    font-size: 100%;
    padding: 0px 5px 0px 12px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}

/* NOT SHOWN FOR PHONE: */
.col2picture {			/* Picture: Surprise Party Bamboozle */
  display: table-cell;
  padding:  0px 20px 0px 5px;  /* top right bottom left */
  vertical-align: middle;
  text-align: center;
}

.col1picture {			/* Picture: Green spiral tree with balls */
    display: table-cell;
    background-image: url("images/backtree.png"); /* The image used */
        background-position: left; /* Center the image */
        background-repeat: no-repeat; /* Do not repeat the image */
        background-size: cover; /* Resize the background image to cover the entire container */
    padding: 20px 20px 0px 25px;   /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width: 30%;  /* Added for resizing of tree image */
}

#col2part {		/* Wording "What is a mini mystery?" */
  display: table-cell;
  font-size:   100%;
  padding:     0px 23px 0px 5px;
  vertical-align: top;
  text-align: center;
    width: 70%;  /* Added for resizing of tree image */
}

#col1includes {	    /* "Which of 3 mini mysteries do you recommend?" */
    display: table-cell;
    font-size: 100%;
       padding: 0px 20px 0px 20px; /* top right bottom left */
    vertical-align: top;
    text-align: top;
}


/* Padding around wording at top Get ready for a spectacular event ... */
.padded {
	padding: 20px 0px 0px 0px;  /* top right bottom left */
}

/* Padding around wording in middle.*/
.padding {
	padding: 0px 20px 0px 20px;  /* top right bottom left */
}

                   /* Top info with Moolah picture. Different for phone and large screen. */
.intro {
	display: table;
	border-spacing: 0px;
        margin: auto;
}

.introphone {
	display: none;
	border-spacing: 0px;
        margin: auto;
}

.tablecontents {
	display: table;
	border-spacing: 0px;
        margin: auto;
}

.tablerow {
	display: table-row;
}

.border {
	border: 1px solid #1e5593;  /*  Header blue was 54626b Dark Gray */
}

         /* 5 columns for 5 links of Preview, Copyright, Mysteries, About, Home */
.wide {			
	width: 100%;
	background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
        margin: auto;
	padding: 0px 0px 0px 0px;
	word-spacing: 10px;
}

#col0link {
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 5px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}

#col1link {
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 20px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}
#col2link {
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 5px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}
#col3link {
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 5px 2px 5px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}

#col4link {
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 5px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}

.parawidth {              /* One liner A Powerful and Moving Play to present this Christmas:  */
	font-size:     120%;
	line-height:   100%;
	max-width: 1200px;
	color:  #610a0b;   /*Dark Maroon */		
        margin: auto;
	padding: 20px 0px 0px 0px;
	text-align: center;
	font-weight:   bold;
}

/* Wording is for each list of mystery summaries. */
.wording {
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;
	text-align: justify;
        line-height:   1.5;
        font-weight:   bold;
}

              /* 3 columns to keep words grouped in the middle. colspace1 is blank column on left */
.colspace1 {
    display: table-cell;
    background-color: #cccdce;  /* dadcdd Light gray */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}

               /* gift First Christmas table: This Gift of Love */
.gift {
    display: table-cell;
    background-color: #FEF5F5;    /*light maroon */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
}
                  /* colspace3 is blank column on right */
.colspace3 {                         
    display: table-cell;
    background-color: #cccdce;  / *NOT WORKING. dadcdd Light gray */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}

.hdr1 {                /* hdr1 is top + 3rd lines play description header box. */
  font-size:     100%;
  color:         #ffffff;
  line-height:   130%;
  text-align:    center;
  font-weight:   normal;
}

.hdr2 {                  /* hdr2 is 2nd line with title of play. */
  font-size:     140%;
  color:         #ffffff;
  line-height:   130%;
  text-align:    center;
  font-weight:   bold;
  font-style:    italic;
}

.headgift {            /* Maroon head Section, This Gift of Love */
	display: table-cell;
	max-width: 1200px;
	background-color: #610a0b;   /*Dark Maroon header */
        margin: auto;
	padding: 5px 10px 5px 10px;     
	border:  2px solid #610a0b;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.rowdescription {	/* Description This Gift of Love */
    display: table-cell;
    background-color: #FEF5F5;    /*light maroon */
    padding: 0px 10px 0px 10px;
    vertical-align: top;
    border-left:  2px solid #610a0b;   /*Dark Maroon header */
    border-right:  2px solid #610a0b;   /*Dark Maroon header */
    text-align:   justify;
}

.description {		   /* Black text of play description. */
  font-size:     110%;
  color:         #000000;
  line-height:   115%;
  text-align:    left;
  font-weight:   normal;
}

.giftbold {		  /* Bold, Maroon Synopsis */
  font-size:     105%;
  color:         #610a0b;   /*Dark Maroon */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
}

.giftslant {		      /* Dark Maroon text italics. */
  font-size:     110%;
  color:         #610a0b;   /*Dark Maroon */
  line-height:   115%;
  text-align:    left;
  font-style:   italic;
}

/* Bold, Maroon Links for Copyright, Preview and Order in This Gift of Love Table */
a.maroon:link, a.maroon:visited, a.maroon:active {
  font-size:     100%;
  color:         #610a0b;  /* Bold, maroon links */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #dbc6c7;  /* dbc6c7 even lighter; c3abac very light maroon */
}

a.maroon:hover {
  color:            #000000;   /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;  /* Gray barely shows to match wide */
}

.tablegift {
	display: table;
	width: 100%;  /* Everything lined up. */
	margin: auto;
}
.col1cast {	        /* Cast This Gift of Love */
    display: table-cell;
    background-color: #FEF5F5;    /* light maroon */
    padding: 0px 5px 1px 10px;   /* top right bottom left */
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #462200;
    border-left:  2px solid #462200;
}

.col2logo {	        /* Logo This Gift of Love */
    display: table-cell;
    background-color: #FEF5F5;    /* light maroon */
    padding: 0px 35px 1px 10px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #462200;
    border-right:  2px solid #462200;
}

.parawidth2 {           /* One liner "Only Christmas Mystery ..." */
	font-size:     120%;
	line-height:   100%;
	max-width: 1200px;
	color:  #24004A;   /*Dark Purple synopsis */
        margin: auto;
	padding: 30px 0px 0px 0px;
	text-align: center;
	font-weight:   bold;
}

                 /* Cookin' Up Christmas mystery description table ... */
.cookin {
    display: table-cell;
    background-color: #F0E8F8; /* light purple */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
}

.headcookin {            /* Pink head Section, Cookin' Up Christmas */
	display: table-cell;
	max-width: 1200px;
	background-color: #24004A;   /*Dark Purple Header */
        margin: auto;
	padding: 5px 10px 5px 10px;      /* top right bottom left */ 
	border:  3px solid #24004A;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.cookinbold {		  /* Bright Pink Synopsis */
  font-size:     105%;
  color:         #24004A;   /*Dark Purple */
  text-align:    center;
  line-height:   140%;
  font-weight:   bold;
}

/* PURPLE Links for Copyright, Preview and Order in Cookin' Up Christmas Table */
a.purple:link, a.purple:visited, a.purple:active {
  font-size:     100%;
  color:         #24004A;   /*Dark Purple */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #af9ac5;  /* Very light Purple */
}

a.purple:hover {
  color:            #000000;   /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;  
}

.tablecookin {
	display: table;
	max-width: 1200px;      /* width: 100%; Everything lined up. */
	margin: auto;
        border-right:  3px solid #24004A;   /*Dark Purple */
}

.rowdescriptiona {	/* Description Cookin' Up Christmas */
    display: table-cell;
    background-color: #F0E8F8; /* light purple */
    padding: 0px 15px 0px 10px; /* top right bottom left */
    vertical-align: top;
    border-left:  2px solid #24004A;   /*Dark Purple */
    border-right:  3px solid #24004A;   /*Dark Purple */
    text-align:   justify;
}

.descriptiona {		   /* Black text of mystery description Cookin' Up Christmas. */
  font-size:     110%;
  color:         #000000;
  line-height:   115%;
  text-align:    left;
  font-weight:   normal;
}

.colalogo {	        /* Logo Left column Cookin' Up Christmas */
    display: table-cell;
    background-color: #F0E8F8; /* light purple */
    padding: 0px 20px 1px 20px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #24004A;   /*Dark Purple */
    border-left:  2px solid #24004A;   /*Dark Purple */
}

.colacast {	        /* Cast Right Column Cookin' Up Christmas */
    display: table-cell;
    background-color: #F0E8F8; /* light purple */
    padding: 0px 5px 1px 20px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #24004A;   /*Dark Purple */
 
}

               /* chili A Chili Christmas description table ... */
.chili {
    display: table-cell;
    background-color: #E2F5F9;    /*light aqua blue */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
}
        
.headchili {            /* Dark Blue head Section, A Chili Christmas */
	display: table-cell;
	max-width: 1200px;
	background-color: #64aec0;  /* Darker Aqua Blue was 89d2e5 */
        margin: auto;
	padding: 5px 10px 5px 10px;     
	border:  2px solid #64aec0;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.rowdescriptionb {	/* Description A Chili Christmas */
    display: table-cell;
    background-color: #E2F5F9;    /*light aqua blue */
    padding: 0px 10px 0px 10px;
    vertical-align: top;
    border-left:  2px solid #64aec0;   /*Aqua Blue */
    border-right:  2px solid #64aec0;   /*Aqua Blue */
    text-align:   justify;
}

.descriptionb {		   /* Black text of mystery description. */
  font-size:     110%;
  color:         #000000;
  line-height:   115%;
  text-align:    left;
  font-weight:   normal;
}

.chilibold {		  /* Bold, Aqua Blue Synopsis */
  font-size:     105%;
  color:         #265d6a;  /* 377a8a Darkest; was 64aec0 Darker Aqua Blue */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
}

/* AQUA BLUE Links for Copyright, Preview and Order in A Chili Christmas Table */
a.aqua:link, a.aqua:visited, a.aqua:active {
  font-size:     100%;
  color:         #265d6a;  /* 377a8a Darkest; was 64aec0 Darker Aqua Blue */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom: thin dotted #64aec0;
}

a.aqua:hover {
  color:            #000000;   /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;  
}

.tablemysteryparty {
	display: table;
	width: 100%;  /* Everything lined up. */
	margin: auto;
}
.colbcast {	        /* Cast A Chili Christmas */
    display: table-cell;
    background-color: #E2F5F9;    /*light aqua blue */
    padding: 0px 5px 1px 10px;  /* top right bottom left */
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #64aec0;  /* Darker Aqua Blue */
    border-left:  2px solid #64aec0;  /* Darker Aqua Blue */
}

.colblogo {	        /* Logo A Chili Christmas */
    display: table-cell;
    background-color: #E2F5F9;    /*light aqua blue */
    padding: 0px 35px 1px 10px;  /* top right bottom left */
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #64aec0;  /* Darker Aqua Blue */
    border-right:  2px solid #64aec0;  /* Darker Aqua Blue */
}

                /* My Superpower description table ... */
.super {
    display: table-cell;
    background-color: #F7EEC5;    /*light gold */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
    border-left:  3px solid #C09701;   /*Gold header */
    border-bottom:  3px solid #C09701;   /*Gold header */
        border-right:  3px solid #C09701;   /*Gold header */
}

.headsuper {            /* Gold head Section, My Superpower */
	display: table-cell;
	max-width: 1200px;
	background-color: #C09701;   /*Gold header */
        margin: auto;
	padding: 5px 10px 5px 10px;     
	border:  3px solid #C09701;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.superbold {		  /* Very Dark Gold Synopsis */
  font-size:     105%;
  color:         #604a11;   /*Very Dark Gold */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
}

/* GOLD Links for Copyright, Preview and Order in My Superpower Table */
a.gold:link, a.gold:visited, a.gold:active {
  font-size:     100%;
  color:         #604a11;   /*Very Dark Gold */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #af995f;   /* af995f very light Gold */
}

a.gold:hover {
  color:            #000000;   /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;  
}

.tablesuper {
	display: table;
	max-width: 1200px;  /* width: 100%; Everything lined up. */
	margin: auto;
}

.rowdescriptionc {	/* Description My Superpower */
    display: table-cell;
    background-color: #F7EEC5;    /*light gold */
    padding: 0px 15px 0px 10px; /* top right bottom left */
    vertical-align: top;
    text-align:   justify;
}

.descriptionc {		   /* Black text of My Superpower description. */
  font-size:     110%;
  color:         #000000;
  line-height:   115%;
  text-align:    left;
  font-weight:   normal;
}

.colclogo {	        /* Logo Left column My Superpower */
    display: table-cell;
    background-color: #F7EEC5;    /*light gold */
    padding: 0px 35px 1px 0px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;

}

.colccast {	        /* Cast Right Column My Superpower */
    display: table-cell;
    background-color: #F7EEC5;    /*light gold */
    padding: 0px 5px 1px 20px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;
}

.parawidth4 {              /* Small "Back to Top"  */
	font-size:     90%;
	line-height:   200%;
	max-width: 1200px;
	color:  #000000;	
        margin: auto;
	padding: 0px 0px 0px 0px;
	text-align: right;
	font-weight:   bold;
}

             /* forget The Christmas I'll Never Forget play description table ... */
.forget {
    display: table-cell;
    background-color: #EEFBF0;    /*light green */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
}
        
.headforget {        /* Dark Green head Section, The Christmas I'll Never Forget */
	display: table-cell;
	max-width: 1200px;
	background-color: #0b552c;  /* Dark Green */
        margin: auto;
	padding: 5px 10px 5px 10px;     
	border:  2px solid #0b552c;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.rowdescriptione {	/* Description The Christmas I'll Never Forget */
    display: table-cell;
    background-color: #EEFBF0;    /*light green */
    padding: 0px 10px 0px 10px;
    vertical-align: top;
    border-left:  2px solid #0b552c;  /* Dark Green */
    border-right:  2px solid #0b552c;  /* Dark Green */
    text-align:   justify;
}

.descriptione {		   /* Black text of play description. */
  font-size:     110%;
  color:         #000000;
  line-height:   115%;
  text-align:    left;
  font-weight:   normal;
}

.forgetbold {		  /* Bold, Aqua Blue Synopsis */
  font-size:     105%;
  color:         #0b552c;  /* Dark Green */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
}

/* DARK GREEN Links for Copyright, Preview and Order in The Christmas I'll Never Forget */
a.never:link, a.never:visited, a.never:active {
  font-size:     100%;
  color:         #0b552c;  /* Dark Green */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #6d917d; /* Dark Green */
}

a.never:hover {
  color:            #000000;   /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;  
}

.tableforget {
	display: table;
	width: 100%;  /* Everything lined up. */
	margin: auto;
}
.colecast {	        /* Cast The Christmas I'll Never Forget */
    display: table-cell;
    background-color: #EEFBF0;    /*light green */
    padding: 0px 5px 1px 10px;  /* top right bottom left */
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #0b552c;  /* Dark Green */
    border-left:  2px solid #0b552c;  /* Dark Green */
}

.colelogo {	        /* Logo The Christmas I'll Never Forget */
    display: table-cell;
    background-color: #EEFBF0;    /*light green */
    padding: 0px 35px 1px 10px;  /* top right bottom left */
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #0b552c;  /* Dark Green */
    border-right:  2px solid #0b552c;  /* Dark Green */
}

#howtosection {
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: justify;
        line-height:   1.5;
        font-weight:   bold;
}

.tablemysterybtm {
	display: table;
	max-width: 1200px;
	margin: auto;
}

.hdr5 {                  /* hdr5 is headers at bottom of page */
  font-size:     140%;
  color:         #ffffff;
  line-height:   130%;
  text-align:    center;
  font-weight:   bold;
}

.btmbold {		  /* Bold, bottom section */
  font-size:     100%;
  color:         #000000;
  line-height:   115%;
  font-weight:   bold;
}

.headbtm1 {               /* Bluebird Color Blue head Section, border - BONUS */
	display: table-cell;
	width: 29%;
	background-color: #24004A;   /* 24004A Purple Cookin Up; 3069AE Bluebird Blue; 154275 Dark Welcome Blue */
        margin: auto;
	padding: 10px 4px 10px 4px;     
	border:  1px solid #24004A;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.headbtm0 {               /* space between */
	display: table-cell;
	width: 4%;
	background-color: #cccdce;  /* ebf4fe Lighter baby blue; was cccdce medium gray */
        margin: auto;
	padding: 10px 0px 10px 0px;     
	border:  1px solid #cccdce;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.headbtm00 {               /* space between */
	display: table-cell;
	width: 4%;
	background-color: #cccdce;  /* ebf4fe Lighter baby blue; was cccdce medium gray */
        margin: auto;
	padding: 10px 0px 10px 0px;     
	border:  1px solid #cccdce;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.headbtm2 {               /* Gray head Section, border - PREVIEWS */
	display: table-cell;
	width: 29%;
	background-color: #C09701;     /* C09701 Gold My Superpower; 8b8b8b Medium Gray */ 
        margin: auto;
	padding: 10px 4px 10px 4px;     
	border:  1px solid #C09701;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.headbtm3 {               /* Green head Section, border - ORDERS */
	display: table-cell;
	width: 29%;
	background-color: #610a0b;  /* 610a0b Maroon Gift of Love; 539717 Missing Greenbacks header green */
        margin: auto;
	padding: 10px 4px 10px 4px;     
	border:  1px solid #610a0b;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.bodybtm1 {		/* BONUS info */
    display: table-cell;
    background-color: #F0E8F8;   /* F0E8F8 light purple; ebf4fe Extremely light Blue */
    padding: 5px 7px 5px 7px;
    vertical-align: top;
    text-align: justify;
    border-bottom:  3px solid #24004A;   /* Purple Cookin Up */
    border-left:  3px solid #24004A;
    border-right: 3px solid #24004A;
}

.bodybtm2 {		/* PREVIEW info */
    display: table-cell;
    background-color: #F7EEC5;        /* F7EEC5 light gold; e7e6e6 Pale Gray */
    padding: 5px 7px 5px 7px;
    vertical-align: top;
    text-align: justify;
    border-bottom:  3px solid #C09701;   /* C09701 Gold My Superpower; 8b8b8b Medium Gray */
    border-left:  3px solid #C09701;
    border-right: 3px solid #C09701;
}
.bodybtm3 {		/* ORDER info */
    display: table-cell;
    background-color: #FEF5F5;        /* FEF5F5 Pale Maroon Gift of Love; eeebe4 Pale Green */
    padding: 5px 7px 5px 7px;
    vertical-align: top;
    text-align: justify;
    border-bottom:  3px solid #610a0b;   /* 610a0b Maroon Gift of Love; 539717 Missing Greenbacks header green */
    border-left:  3px solid #610a0b;
    border-right: 3px solid #610a0b;
}

                            /* 5 columns at bottom in closing with logo, Web links, Facebook, YouTube, Address and Email, Baby Blue */
#enclosure {
	background-color: #f3f4f4;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
	width: 100%;
	margin: auto;
	padding: 7px 0px 0px 0px;   /* top right bottom left */
}

#closing {
	background-color: #f3f4f4;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
	max-width: 1300px;
	margin: auto;
	padding: 0px 0px 0px 0px;   /* top right bottom left */
}


#colbtm1 {
    display: table-cell;
    background-color: #f3f4f4;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
    padding: 0px 0px 0px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}

#colbtm2 {
    display: table-cell;
    background-color: #f3f4f4;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
    padding: 0px 0px 0px 30px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    line-height:   .6;
    font-weight:   bold;
    width:   20%
}
#colbtm3 {
    display: table-cell;
    background-color: #f3f4f4;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
    padding: 0px 0px 0px 30px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}
#colbtm4 {
    display: table-cell;
    background-color: #f3f4f4;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
    padding: 0px 0px 0px 30px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}

#colbtm5 {
    display: table-cell;
    background-color: #f3f4f4;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
    padding: 0px 0px 0px 40px;  /* top right bottom left */
    vertical-align: middle;
    text-align: right;
    width:   20%
}

#enclosefoot {
	background-color: #55626d;  /*Dark gray */
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;
}

footer {
  background-color: #55626d;      /* 1e5593 Was dark blue or d7dce2 light gray*/
  color:            #c8d5e1;  /* Light Blue with gray undertones */
  text-align:       center;
  padding:          10px 20px 10px 0px;  /* top right bottom left */
  margin:           auto;                       /* IMPORTANT. Auto made this footer centered. I accidentally had a 0 with no px. */
  font-size:        90%;
  max-width:        1200px;
  line-height:      1.1;
}

h1 {
   font-size:      180%;
   color:          #154275; /* Dark Blue like Welcome at top */
}


                   /* h2 is used for wording under Welcome */
h2 {
   font-size:     120%; 
   color:         #285784;  /* Slightly lighter Dark Blue */
}

h3 {
   font-size:     120%; 
   color:         #4674a0;  /* Medium yet lightish Blue */
}


a:link {
  color:            #154275; /* Dark Blue like Welcome at top */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #1E5593;
}

a:hover {
  color:            #ffffff;  /* white */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #ffffff;
}
a:visited {
  color:            #1E5593;  /* Slightly lighter Dark Blue Header Color */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #1E5593;
}