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

body { 
  background-color: #cccdce;   /* medium gray; */
  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;  /* 491e4a darkest purple; d0c3d0 light grayish purple; cccdce a little darker gray; 2d2c2d Dark gray in purple family; */
	margin: auto;
	width:  100%;
}

header {
	background-image: url("Images/header1920.png");
	background-color: #cccdce;  /* cccdce a little darker gray; e8e8e8 light gray; dfd9cb Old Tan of header */
        background-position: center; /* Center the image */
        background-repeat: no-repeat; /* Do not repeat the image */
        background-size: auto; /* auto image is displayed in its original size */
        width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
}

#logocntr {
        display: table-cell;
	margin: auto;
	width: 1200px;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: left;
}

.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: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green; 39650c Darkest Green; */
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
        color: ffffff;
}

#colnava {
    display: table-cell;
    background-color: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green; */
    padding: 2px 20px 4px 0px;  /* top right bottom left Made the left 0 so that it works correctly when downsizing. */
    vertical-align: middle;
    text-align: center;
    width:   14.3%
}

#colnavb {
    display: table-cell;
    background-color: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   14.3%
}
#colnavc {
    display: table-cell;
    background-color: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   16.6%
}
#colnavd {
    display: table-cell;
    background-color: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   14.3%
}

#colnave {
    display: table-cell;
    background-color: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green */
    padding: 2px 20px 4px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   14.3%
}

#colnavf {
    display: table-cell;
    background-color: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green */
    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:   14.3%
}

#colnavg {
    display: table-cell;
    background-color: #491e4a;  /* 491e4a Darkest Purple; 81bb43 Ribbon Green */
    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:   14.3%
}

/* NOT USED Responsive Top Header Logo Theater 4 Church */
.imgtop {
  width: 350px;  /* width: 290px; */
  height: 227px;   /* height: 291px; */
  object-fit: cover;
}

/* 3 Pictures: Cookin Up Christmas, ribbon, angel Michael. Added percents to the 2 columns so that this worked. */
.imga {
  max-width: 100%;  /* width: 300px; */
  height: auto;   /* height: 192px; */
  object-fit: cover;
}

.imgb {
  max-width: 100%;  /* width: 290px; */
  height: auto;   /* height: 42px; */
  object-fit: cover;
}

.imgc {
  max-width: 100%;  /* width: 300px; */
  height: auto;   /* height: 190px; */
  object-fit: cover;
}

/* NOT USED */
.imgd {
  max-width: 100%;  /* width: 1920px; */
  height: auto;   /* height: 195px; */
  object-fit: cover;
}

/* Responsive image header in middle says Ready for a Captivating Christmas Show? */
.img1 {
  max-width: 100%;   /* width: 1000px; */
  height: auto;     /* height: 84px; */
  object-fit: cover;
}

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

/* Responsive Stuff 4 Church link at bottom in 5th closer column */
.img4 {
  max-width: 100%;  /* width: 155px; */
  height: auto;   /* height: 28px; */
  object-fit: cover;
}

/* Responsive Facebook at bottom in 2nd closer column */
.img5 { 
  max-width: 100%;  /* width: 157px; */
  height: auto;   /* height: 28px; */
  object-fit: cover;
}

/* Etsy link at bottom in 4th closer column */
.img6 {
  max-width: 100%;  /* width: 185px; */
  height: auto;   /* height: 28px; */
  object-fit: cover;
}

/* Responsive Theater 4 Church link at bottom in 1st closer column */
.img7 {
  max-width: 100%;  /* width: 188px; */
  height: auto;   /* height: 28px; */
  object-fit: cover;
}

/* Responsive Nancy Bond Creations Link at bottom in 3rd closer column */
.img8 {
  max-width: 100%;  /* width: 217px; */
  height: auto;   /* height: 28px; */
  object-fit: cover;
}


.big {			    /* Darkest Green almost black paragraphs at top of page. */
  font-size:     115%;
  color:         #131c09;  /* 131c09 Darkest Green almost black */
  line-height:   120%;
  text-align:    justify;
  font-weight:   normal;
}

.boldwords {		 /* Dark Green bold paragraph words top of page. */
  font-size:     105%;
  color:         #4a830b;  /* 4a830b Darker Bright Green */
  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 Purple link words at top of page like: Preview, How to Order, ... */
  font-size:     115%;
  color:         #42700d;  /* 5c1a5d Darker purple but lighter than very top navigation; 0b2f15 Dark Green; */
  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 {		      /* Darkest Green almost black text italics. */
  font-size:     95%;
  color:         #131c09;  /* 131c09 Darkest Green almost black */
  line-height:   115%;
  text-align:    left;
  font-style:   italic;
}

/* Italics SMALLER Dark green Links like "More about Minis" */
a.darkgreen:link, a.darkgreen:visited, a.darkgreen.hover, a.darkgreen:active {
  font-size:     95%;
  color:         #42700d;  /* Darker Green */
  text-align:    left;
  line-height:   100%;
  font-style:   italic;
  text-decoration: none;
  border-bottom:    thin dotted #42700d;  
}

/* Dark Green Links to go with BIG wording for "Order Form" and "Preview Form" */
a.topgreen:link, a.topgreen:visited, a.topgreen.hover, a.topgreen:active {
  font-size:     100%;
  color:         #42700d;  /* Darker Green */
  text-align:    left;
  line-height:   120%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #42700d;  
}


/* Dark Purple Links to go with BIG wording */
a.darkpurple:link, a.darkpurple:visited, a.darkpurple.hover, a.darkpurple:active {
  font-size:     105%;
  color:         #5c1a5d;  /* Darker Purple */
  text-align:    left;
  line-height:   120%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #0b2f15;  
}


/* Opening includes who does Christmas plays and how to order or preview. */     /* linear-gradient(#cccdce,#2d2c2d); background-image: ; images/backgroundchristmas.png The image used */ 
#opening {
	background-color: #e8e8e8;  /* 491e4a darkest purple; d0c3d0 light grayish purple; cccdce a little darker gray; 2d2c2d Dark gray in purple family; */
	background-image: url("Images/backgroundconfettifade.png");    /* 4a830b ribbon green; c5dea9 light of bright green swirl; 491e4a from dark purple above header to d0c3d0 light grayish purple */
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
}

#coltop2 {
    display: table-cell;
    background-color: rgba(255, 255, 255, 0.88); /* White background with 88% opacity */
    padding: 5px 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;
}

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

.col1picture {			 /* HIDDEN FROM PHONE. 3 Pictures: Cookin Up Christmas, ribbon, angel Michael */
	background-image: url("Images/confettivertical400.jpg");
	background-color: #ffffff;  /* cccdce a little darker gray; e8e8e8 light gray */
        background-position: center; /* Center the image */
        background-repeat: no-repeat; /* Do not repeat the image */
        background-size: auto; /* auto image is displayed in its original size */
    display: table-cell;
    padding: 0px 6px 0px 6px;   /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width: 28%;  /* Added for resizing of images */
}

#col2part {			/* Wording About the Christmas plays */
  display: table-cell;
  font-size:   100%;
  padding:     0px 15px 0px 10px;  /* top right bottom left */
  vertical-align: top;
  text-align: center;
    width: 72%;  /* Added for resizing of images */
}

#col1includes {			/* "How can I get a Preview?" */
    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 Ready for a Captivating Christmas Show? */
.padded {
	padding: 20px 0px 5px 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;
}

.tablecontents2 {
	display: table;
	border-spacing: 0px;
       text-align:  left;
}

.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: #454444;  /* Dark Gray; was c8dff8 Light baby blue */
        margin: auto;
	padding: 0px 0px 0px 0px;
	word-spacing: 20px;
}

/* Bold, white Links found at middle of page */
a.light:link, a.light:visited, a.light.hover, a.light: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;  
}

#col0link {
    display: table-cell;
    background-color: #454444;  /* Dark Gray; was c8dff8 Light baby blue */
    padding: 0px 20px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}

#col1link {
    display: table-cell;
    background-color: #454444;  /* Dark Gray; was c8dff8 Light baby blue */
    padding: 0px 20px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}
#col2link {
    display: table-cell;
    background-color: #454444;  /* Dark Gray; was c8dff8 Light baby blue */
    padding: 0px 5px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}
#col3link {
    display: table-cell;
    background-color: #454444;  /* Dark Gray; was c8dff8 Light baby blue */
    padding: 0px 5px 2px 5px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}

#col4link {
    display: table-cell;
    background-color: #454444;  /* Dark Gray; was c8dff8 Light baby blue */
    padding: 0px 5px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   20%
}


.parawidth {              /* One liner brown "Medium script ..."  */
	font-size:     120%;
	line-height:   100%;
	max-width: 1200px;
	color:  #2b2929;     /* 2b2929 Very Dark Gray; 462200 Brown Kidnapped */		
        margin: auto;
	padding: 20px 0px 0px 0px;
	text-align: center;
	font-weight:   bold;
}

/* Wording is for each list of Christmas Play 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;
}
                            /* kidnapped2 First mystery description table ... */
.kidnapped2 {
    display: table-cell;
    background-color: CAAC86; /* medium brown */
    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;
}

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

.rowdescription {	/* Description Kidnapped */
    display: table-cell;
    background-color: #CAAC86;    /*light brown */
    padding: 0px 10px 0px 10px;
    vertical-align: top;
    border-left:  2px solid #462200;   /*Dark Brown header */
    border-right:  2px solid #462200;   /*Dark Brown header */
    text-align:   justify;
}

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

.kidnappedbold {		  /* Bold, brown Synopsis */
  font-size:     105%;
  color:         #462200;
  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, brown Links for Copyright, Preview and Order in Kidnapped Table */
a.brown:link, a.brown:visited, a.brown.hover, a.brown:active {
  font-size:     100%;
  color:         #462200;    /* Bold, brown Synopsis */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #462200;
}

.tablemystery4a {
	display: table;
	width: 100%;  /* Everything lined up. */
	margin: auto;
}

.col1cast {	        /* Cast Kidnapped */
    display: table-cell;
    background-color: #CAAC86;
    padding: 0px 5px 1px 10px;
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #462200;
    border-left:  2px solid #462200;
}

.col2logo {	        /* Logo Kidnapped */
    display: table-cell;
    background-color: #CAAC86;
    padding: 0px 5px 1px 10px;
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #462200;
    border-right:  2px solid #462200;
}

.parawidth2 {                 /* One liner "3 mini options ..." */
	font-size:     120%;
	line-height:   100%;
	max-width: 1200px;
	color:  #2b2929;     /* 2b2929 Very Dark Gray; 154275 dark blue of Welcome */	
        margin: auto;
	padding: 20px 0px 0px 0px;
	text-align: center;
	font-weight:   bold;
}

                                    /* The Cupcake Caper mystery description table ... */
.cupcake2 {
    display: table-cell;
    background-color: #F6BCDC; /* light pink */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
}

.headcupcake {            /* Pink head Section, The Cupcake Caper */
	display: table-cell;
	max-width: 1200px;
	background-color: #E500A1;   /*Bright Pink header */
        margin: auto;
	padding: 5px 10px 5px 10px;     
	border:  3px solid #E500A1;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.cupcakebold {		  /* Bright Pink Synopsis */
  font-size:     105%;
  color:         #E500A1;   /*Bright Pink */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
}

/* Bold, brown Links for Copyright, Preview and Order in Cupcake Table */
a.pink:link, a.pink:visited, a.pink.hover, a.pink:active {
  font-size:     100%;
  color:         #E500A1;   /*Bright Pink */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #E500A1;
}

.tablemysterycake {
	display: table;
	max-width: 1200px;      /* width: 100%; Everything lined up. */
	margin: auto;
        border-right:  3px solid #E500A1;   /*Dark Pink header */
}

.rowdescriptiona {	/* Description Cupcake */
    display: table-cell;
    background-color: #F6BCDC;    /*light pink */
    padding: 0px 15px 0px 10px; /* top right bottom left */
    vertical-align: top;
    border-left:  2px solid #E500A1;   /*Dark Pink header */
    border-right:  3px solid #E500A1;   /*Dark Pink header */
    text-align:   justify;
}

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

.colalogo {	        /* Logo Left column The Cupcake Caper */
    display: table-cell;
    background-color: #F6BCDC;    /*light pink */
    padding: 0px 20px 1px 20px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #E500A1;   /*Dark Pink header */
    border-left:  2px solid #E500A1;   /*Dark Pink header */
}

.colacast {	        /* Cast Right Column The Cupcake Caper */
    display: table-cell;
    background-color: #F6BCDC;    /*light pink */
    padding: 0px 5px 1px 20px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #E500A1;   /*Dark Pink header */
 
}

                            /* party2 Surprise Party mystery description table ... */
.party2 {
    display: table-cell;
    background-color: B6CBE3;    /*light blue */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
}
        
.headparty {            /* Dark Blue head Section, Surprise Party */
	display: table-cell;
	max-width: 1200px;
	background-color: #2362AA;  /* Dark Blue Party */
        margin: auto;
	padding: 5px 10px 5px 10px;     
	border:  2px solid #2362AA;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.rowdescriptionb {	/* Description Surprise Party */
    display: table-cell;
    background-color: #B6CBE3;    /*light blue */
    padding: 0px 10px 0px 10px;
    vertical-align: top;
    border-left:  2px solid #2362AA;   /*Dark Brown header */
    border-right:  2px solid #2362AA;   /*Dark Brown header */
    text-align:   justify;
}

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

.partybold {		  /* Bold, brown Synopsis */
  font-size:     105%;
  color:         #2362AA;  /* Dark Blue Party */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
}

/* Bold, blue Links for Copyright, Preview and Order in Surprise Party Table */
a.party:link, a.party:visited, a.party.hover, a.party:active {
  font-size:     100%;
  color:         #2362AA;    /* Bold, blue Synopsis */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #2362AA;
}

.tablemysteryparty {
	display: table;
	width: 100%;  /* Everything lined up. */
	margin: auto;
}

.colbcast {	        /* Cast Surprise Party */
    display: table-cell;
    background-color: #B6CBE3;    /*light blue */
    padding: 0px 5px 1px 10px;
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #2362AA;  /* Dark Blue Party */
    border-left:  2px solid #2362AA;  /* Dark Blue Party */
}

.colblogo {	        /* Logo Surprise Party */
    display: table-cell;
    background-color: #B6CBE3;    /*light blue */
    padding: 0px 5px 1px 10px;
    vertical-align: middle;
    text-align: left;
    border-bottom:  3px solid #2362AA;  /* Dark Blue Party */
    border-right:  2px solid #2362AA;  /* Dark Blue Party */
}


                                    /* Mystery Moolah description table ... */
.moolah2 {
    display: table-cell;
    background-color: #D2EAB3;    /*light green */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    max-width:   1200px;
    border-left:  3px solid #82BA35;   /*Bright Green header */
    border-bottom:  3px solid #82BA35;   /*Bright Green header */
        border-right:  3px solid #82BA35;   /*Bright Green header */
}

.headmoolah {            /* Pink head Section, Mystery Moolah */
	display: table-cell;
	max-width: 1200px;
	background-color: #82BA35;   /*Bright Green header */
        margin: auto;
	padding: 5px 10px 5px 10px;     
	border:  3px solid #82BA35;  /* Need border to keep rows collapsed and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.moolahbold {		  /* Bright Green Synopsis */
  font-size:     105%;
  color:         #537c1c;   /*New darker than Bright Green header */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
}

/* Bold, green Links for Copyright, Preview and Order in Mystery Moolah Table */
a.moolah:link, a.moolah:visited, a.moolah.hover, a.moolah:active {
  font-size:     100%;
  color:         #537c1c;   /*New darker than Bright Green header */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #82BA35;   /*Bright Green header Makes a lighter line. */
}

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

}

.rowdescriptionc {	/* Description Mystery Moolah */
    display: table-cell;
    background-color: #D2EAB3;    /*light green */
    padding: 0px 15px 0px 10px; /* top right bottom left */
    vertical-align: top;
    text-align:   justify;
}

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

.colclogo {	        /* Logo Left column Mystery Moolah */
    display: table-cell;
    background-color: #D2EAB3;    /*light green */
    padding: 0px 20px 1px 10px;   /* top right bottom left */
    vertical-align: middle;
    text-align: left;

}

.colccast {	        /* Cast Right Column Mystery Moolah */
    display: table-cell;
    background-color: #D2EAB3;    /*light green */
    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;
}

/* Bold, green Links for Back to the Top */
a.backtop:link, a.backtop:visited, a.backtop.hover, a.backtop:active {
  font-size:     100%;
  color:         #5d8a2c;  /* 5d8a2c Ribbon Green Darker */
  text-align:    left;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #82BA35;   /*Bright Green header Makes a lighter line. */
}

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

.tablehowtobtm {
	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;
}

/* Bold, black Links for Preview and Order Forms at bottom of page */
a.bottom:link, a.bottom:visited, a.bottom.hover, a.bottom:active {
  font-size:     100%;
  color:         #000000;
  line-height:   115%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #000000;
}

.headbtm1 {               /* Bible Verses */
	display: table-cell;
	width: 29%;
	background-color: #571c58;   /* 571c58 Darker purple from ribbon tone; 24004A Purple Cookin Up;  */
        margin: auto;
	padding: 10px 4px 10px 4px;     
	border:  1px solid #571c58;  /* 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 {               /* DARK GRAY head Section, border - PREVIEWS */
	display: table-cell;
	width: 29%;
	background-color: #382f38;  /* 382f38 Darkest Gray from Purple swirl; c5b80b Yellow Gold from ribbon tone */ 
        margin: auto;
	padding: 10px 4px 10px 4px;     
	border:  1px solid #382f38;  /* 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: #5d8a2c;  /* 5d8a2c Ribbon Green Darker; 382f38 Darkest Gray from Purple swirl */
        margin: auto;
	padding: 10px 4px 10px 4px;     
	border:  1px solid #5d8a2c;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.bodybtm1 {		/* BIBLE VERSES I John 4:9 and Luke 2:10,11 */
    display: table-cell;
    background-color: #efebef;   /* efebef lightest purple of ribbon tone */
    padding: 5px 7px 5px 7px;
    vertical-align: top;
    text-align: justify;
    border-bottom:  3px solid #571c58;   /* 571c58 Darker purple from ribbon tone */
    border-left:  3px solid #571c58;
    border-right: 3px solid #571c58;
}

.bodybtm2 {		/* PREVIEW info */
    display: table-cell;
    background-color: #e8e7e8;  /* e8e7e8 Very light Gray from Purple swirl; f8f6d3 Yellow Gold from ribbon tone */
    padding: 5px 7px 5px 7px;
    vertical-align: top;
    text-align: justify;
    border-bottom:  3px solid #382f38;   /* 382f38 Darkest Gray from Purple swirl */
    border-left:  3px solid #382f38;
    border-right: 3px solid #382f38;
}
.bodybtm3 {		/* ORDER info */
    display: table-cell;
    background-color: #f5f5f4;        /* f5f5f4 Very Pale White Green */
    padding: 5px 7px 5px 7px;
    vertical-align: top;
    text-align: justify;
    border-bottom:  3px solid #5d8a2c;  /* 5d8a2c Ribbon Green Darker; 382f38 Darkest Gray from Purple swirl; */
    border-left:  3px solid #5d8a2c;
    border-right: 3px solid #5d8a2c;
}

/* Ribbons on the bottom adjust because of background */
#bottomimage {
	background-image: url("Images/footer1920.png");
	background-color: #cccdce;  /* cccdce a little darker gray; e8e8e8 light gray; dfd9cb Old Tan of header */
        background-position: center; /* Center the image */
        background-repeat: no-repeat; /* Do not repeat the image */
        background-size: auto; /* image is displayed in its original size */
	height: 202px;
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: left;
}

                            /* 5 columns at bottom in closing with links to Theater 4 Church, Facebook, Nancy Bond Creations, Etsy Shop, Stuff 4 Church */
#enclosure {
	display: table;
	background-color: #ffffff;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
	width: 100%;
	margin: auto;
	padding: 1px 0px 1px 0px;   /* top right bottom left */
	text-align: center;
}

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

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

#colbtm2 {
    display: table-cell;
    background-color: #ffffff;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
    padding: 2px 0px 0px 30px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   18%
}
#colbtm3 {
    display: table-cell;
    background-color: #ffffff;  /* 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:   24%
}
#colbtm4 {
    display: table-cell;
    background-color: #ffffff;  /* 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: #ffffff;  /* f3f4f4 very light gray; dadcdd lighter gray; d7dce2 a bit darker light gray */
    padding: 0px 5px 0px 30px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}


/* Bold, header white Links found at top of page above Header */
a.white:link, a.white:visited, a.white.hover, a.white:active {
  font-size:     90%;
  color:         #ffffff;   /* white */
  text-align:    center;
  vertical-align: middle;
  line-height:   1;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:   none;  
}

/* Bold, header purple Links found at top of page above Header */
a.purphead:link, a.purphead:visited, a.purphead.hover, a.purphead:active {
  font-size:     90%;
  color:         #671c68;   /* Header purple at top Not Cookin Up */
  text-align:    center;
  vertical-align: middle;
  line-height:   1;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:   none;  
}


/* Bold, light blue Links for Footer */
a.blue:link, a.blue:visited, a.blue.hover, a.blue:active {
  font-size:     100%;
  color:         #2b5e9c;   /* 2b5e9c Darker bluebird blue; c8d5e1 Light Blue with gray undertones */
  text-align:    left;
  line-height:   1.5;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #2b5e9c;  
}

/* White Links for Footer larger than white above */
a.whitefoot:link, a.whitefoot:visited, a.whitefoot.hover, a.whitefoot:active {
  font-size:     100%;
  color:         #ffffff;   /* White */
  text-align:    left;
  line-height:   1.5;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #ffffff;  
}

/* 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 */
  }

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

footer {
  background-color: #2d2c2d;      /* 2d2c2d Dark gray in purple family; d7dce2 light gray*/
  color:            #ffffff;  /* White font */
  text-align:       center;
  padding:          10px 20px 10px 0px;  /* top right bottom left */
  margin:           auto;                       /* IMPORTANT. Auto made this footer centered. */
  font-size:        90%;
  max-width:        1200px;
  line-height:      1.1;
}

.foot1logo {	        /* Logo Left footer section */
    display: table-cell;
    background-color: #2d2c2d;      /* 2d2c2d Dark gray in purple family; */
    padding: 0px 10px 1px 0px;   /* top right bottom left */
    vertical-align: middle;
    text-align: center;
}

.foot2words {	        /* Wording Right Column footer section */
    display: table-cell;
    background-color: #2d2c2d;      /* 2d2c2d Dark gray in purple family; */
    padding: 0px 3px 1px 2px;   /* top right bottom left */
    vertical-align: middle;
    text-align: center;
}


h1 {
   font-size:      180%;
   color:          #ffffff; /* 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 */
}


                          /* Used in footer */
.italicsm {
   font-size:     100%; 
   color:         #ffffff;  /* other option 474444 Dark Gray */
   text-align:    center;
   line-height:   180%;
   font-style:    italic;
}

a:link {
  color:            #000000; /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #000000;
}

a:hover {
  color:            #ffffff;  /* white */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #ffffff;
}
a:visited {
  color:            #000000; /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #000000;
}