/* contact.css Created by Nancy Bond for Stuff 4 Church Contact Mystery Page Large Screen and All Screens other than phone of 550 or less */

body { 
  background-color: #ebf4fe;  /* c8dff8 light baby blue; ebf4fe Lighter 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: #ebf4fe;  /* c8dff8 light baby blue; ebf4fe Lighter baby blue */
	margin: auto;
	width:  100%;
}

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

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

/* Header and top "I look forward to hearing ..." "Please email question ..." */
.center {
  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 */
	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 */
    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 {		/* Home */
    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: 244px;
  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;
}

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

.tablerow {
	display: table-row;
}

/* hdr1 is I look forward to hearing from you */
.hdr1 {
  font-size:     150%;
  color:         #004690;  /* Dark Blue color of S4C top image words */
  line-height:   140%;
  text-align:    center;
  font-weight:   bold;
}

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

/* Dark Blue bold: Mailing Address, Phone ... */
.boldwords {
  font-size:     105%;
  color:         #004690;  /* Dark Blue color of S4C top image words */
  line-height:   105%;
  text-align:    left;
  font-weight:   bold;
}

/* Blue italics: Not available... Sundays... */
.smallslantb {
  font-size:     92%;
  color:         #0c2c50; /* Dark Blue from big to match bold paragraph words 154275 */
  line-height:   115%;
  text-align:    left;
  font-style:   italic;
}

/* Larger Blue italics: If you are a small non-profit group */
.smallslantc {
  font-size:     100%;
  color:         #0c2c50; /* Dark Blue from big to match bold paragraph words 154275 */
  line-height:   140%;
  text-align:    left;
  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;
}

/* LG DARK BLUE Link for NANCY BOND */
a.lgdarkbl:link, a.lgdarkbl:visited, a.lgdarkbl:active {
  font-size:     150%;
  color:         #004690;  /* Dark Blue color of S4C top image words */
  text-align:    center;
  vertical-align: middle;
  line-height:   140%;
  font-weight:   bold;
  text-decoration: none;
  border-bottom:   thin dotted #a2b8d0;  /* a2b8d0 A lighter and grayish blue  */
}

a.lgdarkbl:hover {
  color:            #2371c4;   /* Light Blue with gray undertones */
  font-weight:   bold;
  text-decoration:  none;
  border-bottom:    none;  
}

/* 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;
  thin dotted #75828f;  /* Dark Gray */
}

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

/* Opening is MAIN Section */
#opening {
	background-color: #ebf4fe;  /* c8dff8 baby blue; ebf4fe Lighter baby blue */
	width: 100%;
	margin: auto;
	padding: 0px 0px 0px 0px;  /* top right bottom left */
	text-align: center;
}

/* cell containing 1 row called narrow and 1 row intro 2 columns: col1picture and col2part */
#coltop2 {
    display: table-cell;
    background-color: ebf4fe;  /* c8dff8 baby blue; ebf4fe Lighter baby blue */
    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;
}

/* Row with top para "I look forward ..." */
.narrow {
  display: table-cell;
  max-width: 1200px;
  padding:  0px 50px 0px 50px;  /* top right bottom left */
  vertical-align: middle;
  text-align: center;
  margin: auto;
}

/* Table holds col1picture and col2part */
.intro {
  display: table;
  border-spacing: 0px;
  margin: auto;
}

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

/* Column 1 - Picture: Bluebird on House ready to fledge */
.col1picture {
    display: table-cell;
    padding: 0px 25px 0px 25px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
}

/* Column 2 - Mailing Address, Phone, Time */
#col2part {
  display: table-cell;
  font-size:   100%;
  padding:     0px 28px 0px 5px;  /* top right bottom left */
  vertical-align: top;
  text-align: center;
}

/* Email address */
#col1includes {
    display: table-cell;
    font-size: 100%;
    padding: 0px 20px 0px 20px; /* top right bottom left */
    vertical-align: top;
    text-align: top;
}

/* Creates thin blue line across screen */
.wide {			
  width: 100%;
  background-color: #0c2c50; /* Dark Blue from big to match 154275; c8dff8 Light baby blue */
  margin: auto;
  padding: 0px 0px 0px 0px;
  word-spacing: 25px;
}

/* 5 columns bottom closing: logo, Web links, Facebook, YouTube, Address and Email, Baby Blue */
#enclosure {
	background-color: #dadcdd;  /*Light gray */
	width: 100%;
	margin: auto;
	padding: 7px 0px 0px 0px;  /* top right bottom left */
}

#closing {
	background-color: #dadcdd;  /* Light gray */
	max-width: 1300px;
	margin: auto;
	padding: 0px 0px 0px 0px;
}

#colbtm1 {     /* Logo */
    display: table-cell;
    background-color: #dadcdd;  /* Light gray */
    padding: 0px 0px 0px 20px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}

#colbtm2 {     /* T4C, NB Creations, Etsy */
    display: table-cell;
    background-color: #dadcdd;  /* 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 {     /* Facebook Youtube */
    display: table-cell;
    background-color: #dadcdd;  /* Light gray */
    padding: 0px 0px 0px 30px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}
#colbtm4 {     /* Address Email */
    display: table-cell;
    background-color: #dadcdd;  /*Old d7dce2 Light gray */
    padding: 0px 0px 0px 30px;  /* top right bottom left */
    vertical-align: middle;
    text-align: center;
    width:   20%
}

#colbtm5 {     /* Baby Bluebird */
    display: table-cell;
    background-color: #dadcdd;  /* 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;
}

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;
}