/* christmasphone.css Created by Nancy Bond for Christmas page for screens like phones 550 or smaller */

body { 
  background-color: #dadcdd;   /*dadcdd light gray cccdce medium gray */
  font-family:      Tahoma, Arial, sans-serif;
  font-size:        14px;
  margin:           auto;
  width:  480px; 
}

#pagerectangle {
	background-color: #ffffff;  /* was c8d5e1 Light Blue with gray undertones; ebf4fe Very light baby blue */
	margin: auto;
	width:  480px;  /* was 480px */
}

header {
	text-align:  center;
	width:       100%;
	margin:      auto;
}

/* For the links at top below header banner */
.toplinks {
	background-color: #ffffff;  /* White */
	width: 100%;    /* max-width: 650px; */
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
        color: ffffff;
	border-bottom:1px solid #1E5593;   /* Header Blue color */
}

#nav1 {			/* Home */
    display: table-cell;
    background-color: #ffffff;  /* White */
    padding: 2px 15px 4px 10px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   11%
}

#nava {			/* Preview */
    display: table-cell;
    background-color: #ffffff;  /* White */
    padding: 2px 12px 4px 10px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   12.3%
}

#navb {			/* Order */
    display: table-cell;
    background-color: #ffffff;  /* White */
    padding: 2px 15px 4px 15px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   12.3%
}
#navc {			/* Mysteries */
    display: table-cell;
    background-color: #ffffff;  /* White */
    padding: 2px 15px 4px 15px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   15.6%
}
#navd {			/* Minis */
    display: table-cell;
    background-color: #ffffff;  /* White */
    padding: 2px 12px 4px 15px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   12.3%
}

#nave {			/* Christmas */
    display: table-cell;
    background-color: #ffffff;  /* White */
    padding: 2px 15px 4px 15px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   12.3%
}

.navphone {     /* This makes the nav header inline so that span can be used. */
 display: inline;
}

.preview {      /* This hides items like the large header picture. */
  	display: none;
}

.medium {      /* This hides items like the medium 1200 header picture. */
  	display: none;
}

                   /* NOT working. Trying on kidnapped logo. */
.center {
  display: inline;
  text-align: center;
  margin-left: 0 auto;
  margin-right: 0 auto;
}

.line {
  display: inline;
  margin-left: auto;
  margin-right: auto;
}

.big {			  /* Dark Green paragraphs at top of page. */
  font-size:     105%;
  color:       #0b2f15; /* Dark Green; was 0c2c50 Dark Blue to match bold paragraph words 154275 */
  line-height:   115%;
  text-align:    left;
  font-weight:   normal;
  text-align:    justify;
}

.boldwords {		  /* Dark Green bold words */
  font-size:     105%;
  color:         #0b2f15;  /* Dark Green; was 154275 */
  line-height:   105%;
  text-align:    left;
  font-weight:   bold;
}

.bold {			  /* Bold, black Used This Gift of Love Music info */
  font-size:     100%;
  color:         #000000;
  line-height:   115%;
  text-align:    center;
  font-weight:   bold;
}
.boldlink {		  /* Hidden: Dark Purple link words at top of page like: Preview, How to Order, ... */
  font-size:     115%;
  color:         #422752;
  line-height:   110%;
  text-align:    center;
  font-weight:   bold;
}

/* 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 NOT white */
  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;
}

/* WHITE Links for middle of page */
a.white:link, a.white:visited, 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:   105%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #c8d5e1;  /* Light Blue with gray undertones */
}

a.blue:hover {
  color:            #ffffff;  /* White */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #75828f;  /* Dark Gray */
}

/* GREEN Links to go with BIG wording for PREVIEW FORM and ORDER FORM */
a.green:link, a.green:visited, a.green:active {
  font-size:     100%;
  color:         #0b2f15;  /* Dark Green */
  text-align:    center;
  line-height:   110%;
  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; 
}

/* 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;
  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;
}

/* BOTTOM Darker PURPLE from Theater for Church Curtain */
a.purplebtm:link, a.purplebtm:visited, a.purplebtm:active {
  font-size:     100%;
  color:         #420441;   /* Darker Purple from Theater for Church Curtain 5f015e is curtain color */
  text-align:    center;
  line-height:   105%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #735773;  /* Light Purple */
}

a.purplebtm:hover {
  color:            #735773;  /* Light Purple */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;
}

/* Nancy Bond Creations Link at BOTTOM; Darkest Green Leaf and darker in Logo */
a.greenbtm:link, a.greenbtm:visited, a.greenbtm:active {
  font-size:     100%;
  color:         #0b2f15;  /* Dark Green */
  text-align:    center;
  line-height:   110%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #aec3b4;  /* aec3b4 Even lighter; 90a395 Lighter Gray Green */
}

a.greenbtm:hover {
  color:         #000000;   /* Black */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none; 
}

/* Deep Aqua Blue from Peacock */
a.deepblue:link, a.deepblue:visited, a.deepblue:active {
  font-size:     100%;
  color:         #185764;   /* Deep Aqua Blue from Peacock */
  text-align:    center;
  line-height:   105%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:    thin dotted #aec3b4;  /* aec3b4 Even lighter; 90a395 Lighter Gray Green */
}

a.deepblue:hover {
  color:            #447c88;  /* Light Aqua Blue */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;  /* aec3b4 Even lighter; 90a395 Lighter Gray Green */
}

#opening {
	background-color: #ffffff;  /* was c8d5e1 Light Blue with gray undertones */
	width: 100%;                 /* was 450px */
	margin: auto;
	padding: 0px 0px 0px 0px;
	text-align: center;
}

 /* Padding around wording at top. */
.padded {     
	padding: 2px 2px 0px 2px;  /* top right bottom left */
}

/* Padding around wording in middle. */
.padding {
	padding: 0px 2px 0px 2px;  /* top right bottom left */
        text-align: center;
}

                   /* Top info with Moolah picture. Different for phone and large screen. */
.intro {
	display: none;
        margin: auto;
}

.introphone {
	background-color: #ffffff;  /* was ebf4fe Lighter baby blue */
	width: 440px;                 /* was 450px but caused bottom scroll issues */
	margin: auto;
	padding: 0px 6px 0px 4px;  /* top right bottom left */
	text-align: justify;
}

.introphone2 {
	background-color: #ffffff;  /* was ebf4fe Lighter baby blue */
	width: 440px;                 /* was 450px but caused bottom scroll issues */
	margin: auto;
	padding: 0px 6px 0px 4px;  /* top right bottom left */
	text-align: justify;
}

.tablecontents {
	display: table;
        margin: auto;
}

.tablerow {
	display: table-row;
}

.border {
	border:1px solid #54626b;
}

#coltop2 {        /* banner says 5 Unique Christmas Shows */
    display: table-cell;
    background-color: #ffffff;  /* was ebf4fe Lighter baby blue */
    padding: 10px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}


#col1mystery {			/* NOT There */
    display: table-cell;
    background-color: ##ffffff;  /* was ebf4fe Lighter baby blue */
    padding: 0px 10px 0px 10px;  /* top right bottom left */
    vertical-align: top;
}

.col2picture {			/* HIDDEN FROM PHONE. Pictures:  */
  display: none;
    background-color: #ffffff;  /* was ebf4fe Lighter baby blue */
    padding:    0px 0px 0px 5px;  /* top right bottom left */
  vertical-align: middle;
  text-align: center;
  font-size:   105%;
}

.col1picture {			/* HIDDEN FROM PHONE. Picture: Christmas tree */
    display: table-cell;
    background-color: #ebf4fe;   /* Very light baby blue */
    padding: 0px 10px 0px 10px;  /* top right bottom left */
    vertical-align: middle;
    text-align: top;
}

           /* HIDDEN FROM LARGE SCREEN. Includes photo 320 wide of Cast This Gift of Love - within the same row so it's stacked. */
#col2part {			/* Main Wording at top: Who uses these Christmas Plays? ... */
  display: table-cell;
  max-width:   450px;
  background-color: ##ffffff;  /* was ebf4fe Lighter baby blue */
  font-size:   105%;
  color:       #1E5593;       /* Header blue */
  padding:     0px 6px 0px 6px;  /* top right bottom left */
  vertical-align: top;
  text-align: center;
}

#col1includes {		/* "How do I get a Free Preview?" */
    display: table-cell;
    max-width:   450px;
    font-size: 105%;
    background-color: #ffffff;  /* was ebf4fe Lighter baby blue */
    padding: 0px 15px 0px 15px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}

                   /* 5 columns for the navigation links before descriptions */
.wide {			
	font-size:     90%;
	line-height:   10%;
	max-width: 550px;  
	background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
        margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
	word-spacing: 5px;
}

#col0link {     /* Preview */
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 5px 2px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}

#col1link {     /* Copyright */
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 10px 2px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}
#col2link {     /* Mysteries */
    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;
}
#col3link {     /* About */
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 10px 2px 5px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}

#col4link {     /* Home */
    display: table-cell;
    background-color: #232423;  /* 23242 Very DARK gray; 4d4d4d Dark Gray with green tone */
    padding: 0px 5px 2px 10px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}


.parawidth {		/* "My one Medium ..." changes size and padding for each screen. Font is dark brown for Kidnapped. */
	font-size:     110%;
	line-height:   100%;
	width: 450px;
	color:  #462200;	
        margin: auto;
	padding: 20px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
	font-weight:   bold;
}

                            /* Start Mystery Descriptions */
.wording {
	background-color: #dadcdd;  /* dadcdd light gray; cccdce medium gray; c8d5e1 Light Blue with gray undertones */
	width: 450px;                 /* was 100% */
	margin: auto;
	padding: 0px 0px 0px 0px;
	text-align: justify;
}

                            /* 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;
    width:   450px;
}

.headgift {	/* Maroon head Section, This Gift of Love */
	display: table-cell;
	width: 450px;
	background-color: #610a0b;   /*Dark Maroon header */
        margin: auto;
	padding: 5px 9px 5px 10px;  /* IMP for lining up with bottom section. Aug 2024 top right bottom left */   
	border:  1px solid #610a0b;  /* Need this border to keep the rows collapsed together and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.hdr1 {            /* hdr1 is top + 3rd lines mystery descrip hdr box. */
  font-size:     90%;
  color:         #ffffff;
  line-height:   100%;
  text-align:    center;
  font-weight:   normal;
}

.hdr2 {              /* hdr2 is 2nd line with title of mystery. */
  font-size:     120%;
  color:         #ffffff;
  line-height:   120%;
  text-align:    center;
  font-weight:   bold;
  font-style:    italic;
}

.rowdescription {	/* Description This Gift of Love */
    display: table-cell;
    font-size:     105%;
    background-color: #FEF5F5;    /*light maroon */
    padding: 5px 10px 5px 10px;      /* top right bottom left */
    vertical-align: top;
    border-left:  3px solid #610a0b;   /*Dark Maroon */
    border-right:  3px solid #610a0b;   /*Dark Maroon */
    text-align:    justify;
}

.giftbold {
  font-size:     105%;
  color:         #610a0b;   /*Dark Maroon */
  text-align:    left;

  font-weight:   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, Dark Maroon links */
  text-align:    left;
  line-height:   105%;
  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 */
}

.description {	     /* Black text of cast. */
  font-size:     105%;
  color:         #000000; 
  line-height:   115%;
  text-align:    center;
  font-weight:   normal;
}

tablemgiftphone {
	display: table;
	width: 450px;
	margin: auto;
}
.col1cast {	        /* Cast This Gift of Love */
    display: table-cell;
    width: 450px;
    background-color: #FEF5F5;    /*light maroon */
    padding: 0px 5px 0px 10px;
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #462200;  /* Dark brown like header */
    border-left:  3px solid #462200;  /* Dark brown like header */
    border-right:  3px solid #462200;  /* Dark brown like header */
}

.col2logo {	        /* Logo This Gift of Love */
    display: table-cell;
    width: 450px;
    background-color: #FEF5F5;    /*light maroon */
    padding: 0px 10px 5px 10px;     /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    margin: auto;
}

.smallfont {	     /* Black text of mystery cast smaller. */
  font-size:     85%;
  color:         #000000; 
  line-height:   95%;
  text-align:    left;
  font-weight:   normal;
}

.giftslant {		      /* Dark Maroon text italics. */
  font-size:     95%;
  color:         #610a0b;   /*Dark Maroon */
  line-height:   115%;
  text-align:    left;
  font-style:   italic;
}

.smallslant {		      /* Black text italics. */
  font-size:     95%;
  color:         #000000;
  line-height:   100%;
  text-align:    left;
  font-style:   italic;
}

.parawidth2 {	        /* One liner "Only Christmas Mystery ..." */
	font-size:     110%;
	line-height:   120%;
	width: 450px;
	color:  #24004A;   /*Dark Purple synopsis */
        margin: auto;
	padding: 25px 0px 0px 0px;  /* top right bottom left */
	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;
    width:   450px;
}

.headcookin {	           /* Pink head Section, Cookin' Up Christmas */
	display: table-cell;
	width: 450px;
	background-color: #24004A;   /*Dark Purple header */
        margin: auto;
	padding: 5px 9px 5px 10px;  /* IMP for lining up with bottom section. Aug 2024 top right bottom left */   
	border:  1px solid #24004A;  /* Need this border to keep the rows collapsed together and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.cookinbold {
  font-size:     105%;
  color:         #24004A;   /*Dark Purple synopsis */
  text-align:    center;
  line-height:   100%;
  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:   105%;
  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;  
}

tablecookinphone {
	display: table;
	width: 450px;
	margin: auto;
}

.rowdescriptiona {	/* Description Cookin' Up Christmas */
    display: table-cell;
    font-size:     105%;
    background-color: #F0E8F8; /* light purple */
    padding: 5px 10px 5px 10px;      /* top right bottom left */
    vertical-align: top;
    border-left:  3px solid #24004A;   /*Dark Purple */
    border-right:  3px solid #24004A;   /*Dark Purple */
    text-align:    justify;
}

.descriptiona {	     /* Black text of mystery cast. */
  font-size:     105%;
  color:         #000000; 
  line-height:   115%;
  text-align:    center;

}

.colacast {	        /* Cast Cookin' Up Christmas */
    display: table-cell;
    width: 450px;
    background-color: #F0E8F8; /* light purple */
    padding: 0px 5px 0px 10px;
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #24004A;   /*Dark Purple */
    border-left:  3px solid #24004A;   /*Dark Purple */
    border-right:  3px solid #24004A;   /*Dark Purple */
}

.colalogo {	        /* Logo Cookin' Up Christmas */
    display: table-cell;
    width: 450px;
    background-color: #F0E8F8; /* light purple */
    padding: 0px 10px 5px 10px;     /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    margin: auto;
}
                      /*Starts A Chili Christmas */
.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;
    width:   450px;
}

.headchili {	/* Aqua blue head Section, Aqua blue border - A Chili Christmas. */
	display: table-cell;
	width: 450px;
	background-color: #64aec0;  /* Dark Aqua Blue */
        margin: auto;
	padding: 5px 9px 5px 10px;  /* IMP for lining up with bottom section. Aug 2024 top right bottom left */   
	border:  1px solid #64aec0;  /* Need this border to keep the rows collapsed together and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.rowdescriptionb {	/* Description A Chili Christmas */
    display: table-cell;
    font-size:     105%;
    background-color: #E2F5F9;    /*light aqua blue */
    padding: 5px 10px 5px 10px;      /* top right bottom left */
    vertical-align: top;
    border-left:  3px solid #64aec0;  /* Dark Aqua Blue */
    border-right:  3px solid #64aec0;  /* Dark Aqua Blue */
    text-align:    justify;
}

.chilibold {
  font-size:     105%;
  color:         #265d6a;  /* 377a8a Darkest; was 64aec0 Darker Aqua Blue */
  text-align:    left;
  line-height:   100%;
  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:   105%;
  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;  
}

.descriptionb {	     /* Black text of A Chili Christmas cast. */
  font-size:     105%;
  color:         #000000; 

  text-align:    center;
  font-weight:   normal;
}

tablechiliphone {
	display: table;
	width: 450px;
	margin: auto;
}
.colbcast {	        /* Cast A Chili Christmas */
    display: table-cell;
    width: 450px;
    background-color: #E2F5F9;    /*light aqua blue */
    padding: 0px 5px 0px 10px;
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #64aec0;  /* Dark Aqua Blue */
    border-left:  3px solid #64aec0;  /* Dark Aqua Blue */
    border-right:  3px solid #64aec0;  /* Dark Aqua Blue */
}

.colblogo {	        /* Logo A Chili Christmas */
    display: table-cell;
    width: 450px;
    background-color: #E2F5F9;    /*light aqua blue */
    padding: 0px 10px 5px 10px;     /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    margin: auto;
}

                 /* 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;
    width:   450px;
}

.headsuper {	         /* Gold head Section, My Superpower */
	display: table-cell;
	width: 450px;
	background-color: #C09701;   /* Gold header */
        margin: auto;
	padding: 5px 9px 5px 10px;  /* IMP for lining up with bottom section. Aug 2024 top right bottom left */   
	border:  1px solid #C09701;  /* Need this border to keep the rows collapsed together and lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.superbold {
  font-size:     105%;
  color:         #604a11;   /*Very Dark Gold */
  text-align:    left;
  line-height:   100%;
  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:   105%;
  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;  
}

tablesuperphone {
	display: table;
	width: 450px;
	margin: auto;
}

.rowdescriptionc {	/* Description My Superpower ... */
    display: table-cell;
    font-size:     105%;
    background-color: #F7EEC5;    /*light gold */
    padding: 5px 10px 5px 10px;      /* top right bottom left */
    vertical-align: top;
    border-left:  3px solid #C09701;   /* Gold header */
    border-right:  3px solid #C09701;   /* Gold header */
    text-align:    justify;
}

.descriptionc {	     /* Black text of My Superpower cast. */
  font-size:     105%;
  color:         #000000; 
  line-height:   120%;
  text-align:    center;
  font-weight:   normal;
}

.colccast {	        /* Cast My Superpower */
    display: table-cell;
    width: 450px;
    background-color: #F7EEC5;    /*light gold */
    padding: 0px 5px 0px 10px;
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #C09701;   /* Gold header */
    border-left:  3px solid #C09701;   /* Gold header */
    border-right:  3px solid #C09701;   /* Gold header */
}

.colclogo {	        /* Logo My Superpower */
    display: table-cell;
    width: 450px;
    background-color: #F7EEC5;    /*light gold */
    padding: 0px 10px 5px 10px;     /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    margin: auto;
}

.parawidth4 {	        /* Back to Top" */
	font-size:     100%;
	line-height:   140%;
	width: 450px;
        margin: auto;
	padding: 0px 10px 10px 0px;  /* top right bottom left */
	text-align: left;
	font-weight:   bold;
}

                      /*Starts The Christmas I'll Never Forget */
.forget {
    display: table-cell;
    background-color: #EEFBF0;    /*light green */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
    width:   450px;
}

.headforget {	/* Aqua blue head Section, Aqua blue border - The Christmas I'll Never Forget. */
	display: table-cell;
	width: 450px;
	background-color: #0b552c;  /* Dark Green */
        margin: auto;
	padding: 5px 9px 5px 10px;  /* IMP for lining up with bottom section. Aug 2024 top right bottom left */   
	border:  1px solid #0b552c;  /* Need this border to keep the rows collapsed together 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;
    font-size:     105%;
    background-color: #EEFBF0;    /*light green */
    padding: 5px 10px 5px 10px;      /* top right bottom left */
    vertical-align: top;
    border-left:  3px solid #0b552c;  /* Dark Green */
    border-right:  3px solid #0b552c;  /* Dark Green */
    text-align:    justify;
}

.forgetbold {
  font-size:     105%;
  color:         #0b552c;  /* Dark Green */
  text-align:    left;
  line-height:   100%;
  font-weight:   bold;
}

/* DARK GREEN Links for Copyright, Preview and Order in The Christmas I'll Never Forget Table */
a.never:link, a.never:visited, a.never:active {
  font-size:     100%;
  color:         #0b552c;  /* Dark Green */
  text-align:    left;
  line-height:   105%;
  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;  
}

.descriptione {	     /* Black text of The Christmas I'll Never Forget cast. */
  font-size:     105%;
  color:         #000000; 

  text-align:    center;
  font-weight:   normal;
}

tableforgetphone {
	display: table;
	width: 450px;
	margin: auto;
}
.colecast {	        /* Cast The Christmas I'll Never Forget */
    display: table-cell;
    width: 450px;
    background-color: #EEFBF0;    /*light green */
    padding: 0px 5px 0px 10px;
    vertical-align: top;
    text-align: left;
    border-bottom:  3px solid #0b552c;  /* Dark Green */
    border-left:  3px solid #0b552c;  /* Dark Green */
    border-right:  3px solid #0b552c;  /* Dark Green */
}

.colelogo {	        /* Logo The Christmas I'll Never Forget */
    display: table-cell;
    width: 450px;
    background-color: #EEFBF0;    /*light green */
    padding: 0px 10px 5px 10px;     /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    margin: auto;
}


.smallslant {	   /* Black italics. */
  font-size:     90%;
  color:         #000000;
  line-height:   105%;
  text-align:    left;
  font-style:   italic;
}

.smallslantw {	   /* White italics. */
  font-size:     90%;
  color:         #ffffff;
  line-height:   105%;
  text-align:    left;
  font-style:   italic;
}

.smallslantb {	   /* Blue italics. */
  font-size:     100%;
  color:         #0c2c50; /* Dark Blue from big to match bold paragraph words 154275 */
  line-height:   105%;
  text-align:    left;
  font-style:   italic;
}


.parawidth4 {              /* Small "Back to Top"  */
	font-size:     90%;
	line-height:   200%;
	width: 450px;
	color:  #000000;	
        margin: auto;
	padding: 0px 0px 0px 0px;
	text-align: right;
	font-weight:   bold;
}

#howtosection {
	background-color: #dadcdd;  /* dadcdd light gray; cccdce medium gray; c8d5e1 Light Blue with gray undertones */
	width: 100%;                 /* was 450px */
	margin: auto;
	padding: 0px 0px 0px 0px;
	text-align: justify;
}

.tablemysterybtm {
	display: table;
	width: 450px;
	margin: auto;
}

.hdr5 {                  /* hdr5 is headers at bottom of page */
  font-size:     100%;
  color:         #ffffff;
  line-height:   130%;
  text-align:    center;
  font-weight:   bold;
}

.btmbold {		  /* Bold, bottom section */
  font-size:     90%;
  color:         #000000;
  line-height:   105%;
  font-weight:   bold;
}

.headbtm1 {               /* Not Shown on Phone - BONUS */
	display: none;
	width: 0%;
	background-color: #7f3779;
        margin: auto;
	padding: 0px 0px 0px 0px;     
	border:  1px solid #7f3779;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.headbtm00 {               /* space before boxes */
	display: none;
	width: 0%;
	background-color: #dadcdd;   /* Light Gray */
        margin: auto;
	padding: 0px 0px 0px 0px;     
	border:  1px solid #dadcdd;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.headbtm0 {               /* space between boxes */
	display: table-cell;
	width: 3%;
	background-color: #dadcdd;   /* Light Gray */
        margin: auto;
	padding: 0px 0px 0px 0px;     
	border:  1px solid #dadcdd;  /* Need border to keep rows collapsed together + lines placed vertically correctly. */
	text-align: center;  /* This makes the header text centered. */
}

.headbtm2 {               /* Green head Section, border - PREVIEWS */
	display: table-cell;
	width: 45%;
	background-color: #C09701;  /* C09701 Gold My Superpower; 77c029 bright green; 8b8b8b Medium Gray */
        margin: auto;
	padding: 5px 3px 5px 3px;     
	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 {               /* maroon head Section, border - ORDERS */
	display: table-cell;
	width: 45%;
	background-color: #610a0b;  /* 610a0b Maroon Gift of Love; 8b8b8b dark gray; 539717 Missing Greenbacks header green */
        margin: auto;
	padding: 5px 3px 5px 3px;     
	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: none;
    background-color: #c5abc2;
    padding: 6px 8px 6px 8px;
    vertical-align: top;
    text-align: justify;
    border-bottom:  3px solid #7f3779;
    border-left:  3px solid #7f3779;
    border-right: 3px solid #7f3779;
}

.bodybtm2 {		/* PREVIEW info */
    display: table-cell;
    background-color: #F7EEC5;    /* F7EEC5 light gold; eeebe4 pale yellowish green; e7e6e6 Pale Gray */
    padding: 6px 8px 6px 8px;
    vertical-align: middle;
    text-align: justify;
    border-bottom:  3px solid #C09701;  /* C09701 Gold My Superpower; 77c029 bright green; 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; e7e6e6 Pale Gray; eeebe4 Pale Green */
    padding: 6px 8px 6px 8px;
    vertical-align: middle;
    text-align: justify;
    border-bottom:  3px solid #610a0b;   /* 610a0b Maroon Gift of Love; 8b8b8b dark gray; 539717 Missing Greenbacks header green */
    border-left:  3px solid #610a0b;
    border-right: 3px solid #610a0b;
}

#enclosure {
	background-color: #ebf4fe;  /* Very light baby blue; c8dff8 Light baby blue; cccdce Medium gray; was d7dce2 Light gray */
	max-width: 550px;
	margin: auto;
	padding: 6px 0px 0px 0px; /* top right bottom left */
}

#closing {
	background-color: #ebf4fe;  /* Very light baby blue; c8dff8 Light baby blue; cccdce Medium gray; was d7dce2 Light gray */
	width: 450px;
	margin: auto;
	padding: 0px 0px 0px 0px;
}

#colbtm1 {
    display: table-cell;
    background-color: #ebf4fe;  /* Very light baby blue; c8dff8 Light baby blue; cccdce Medium gray; was d7dce2 Light gray */
    padding: 0px 2px 0px 4px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}

#colbtm2 {
    display: table-cell;
    background-color: #ebf4fe;  /* Very light baby blue; c8dff8 Light baby blue; cccdce Medium gray; was d7dce2 Light gray */
    padding: 0px 5px 0px 5px;  /* top right bottom left */
    text-align: center;
    line-height:   200%;
    font-weight:   bold;
    vertical-align: middle;
    width:   60%
}
#colbtm3 {
    display: none;
    background-color: #ebf4fe;  /* Very light baby blue; c8dff8 Light baby blue; cccdce Medium gray; was d7dce2 Light gray */
    padding: 0px 5px 0px 4px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    line-height:   150%;
    width:   0%
}
#colbtm4 {
    display: none;
    background-color: #ebf4fe;  /* Very light baby blue; c8dff8 Light baby blue; cccdce Medium gray; was d7dce2 Light gray */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: top;
    text-align: center;
}

#colbtm5 {
    display: table-cell;
    background-color: #ebf4fe;  /* Very light baby blue; c8dff8 Light baby blue; cccdce Medium gray; was d7dce2 Light gray */
    padding: 0px 0px 0px 0px;  /* top right bottom left */
    vertical-align: middle;
    text-align: right;
    width:   20%
}

footer {
  background-color: #223a51;
  color:            #c8d5e1;   /* Light Blue with gray undertones */
  text-align:       center;
  padding:          5px 0px 5px 0px;  /* top right bottom left */
  margin:           auto;
  font-size:        90%;
  max-width:        550px;
  line-height:      1.5;
}


h1 {
   font-size:      110%;
   color:          #154275; /* Dark Blue like Welcome at top */
}

h2 {
   font-size:     100%; 
   color:         #285784;  /* Slightly lighter Dark Blue */
}

h3 {
   font-size:     100%; 
   color:         #4674a0;  /* Medium yet lightish Blue */
}

                  /* thick1 is used for headings in closing row but NOT on phone */
.thick1 {
   font-size:     90%; 
   color:         #474444;  /* Dark Gray */
   text-align:    center;
   line-height:   1.1;
   font-weight:   bold;
}

                  /* thick2 is used for heading of the body */
.thick2 {
   font-size:     110%; 
   color:         #154275;  /* Darker Welcome blue */
   text-align:    center;
   line-height:   1.1;
   font-weight:   bold;
}

        /* Used in closing gray box for video and Email not link which are NOT on phone */
.italicsm {
   font-size:     80%; 
   color:         #474444;  /* Dark Gray */
   text-align:    center;
   line-height:   80%;
   font-style:    italic;
}

                          /* Used in footer */
.italicsmblue {
   font-size:     100%; 
   color:         #c8d5e1;  /* light blue */
   text-align:    center;
   line-height:   90%;
   font-style:    italic;
}

/* No line for image links */
a.none:link, a.none:visited, a.none.hover, a.none:active {
    text-decoration: none;
    border-bottom:   none;
  }

a:link {
  color:            #154275; /* Dark Blue like Welcome at top */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    thin dotted #154275;
}

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;
}




