/*
CSS for Harper Blackwell Family site
*/
 
/*comma separated list of properties allows for multiple background images (css3.info is source I used)
*/

body {
  font-family: Verdana, Helvetica, Arial, sans-serif;
  background-image: url(images/tree_1022r1.jpg), url(images/tree_1022r4xFlipped.jpg) ;background-repeat: no-repeat; 
  background-position: left top, right top; background-color: #cc9999;
  line-height: 125%;
  padding: 15px;
}

/* 6/20/2017 Testing Menu to add Puzzle as first page and Family as second page (instruction from w3schools.com)-->
 */
 
 /* Dropdown Button */
.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* trying to change "coming Soon" to different color*/
a.coming{
font-size: ;
color:blue;
}

/* Links inside the dropdown */
.dropdown-content-sub a {
    color: red;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}



/* End Dropdown Sub Menu*/




/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}



/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: #3e8e41;
}


/* End Menu Setup */

/*Setup top of page Intro Section for Julian below Welcome*/
#intro {margin-left: auto; margin-right: auto; width: 79%;
}

p.intro { text-align: justify;
}

p.sig { text-align: center;
}

p.contact { text-align: center;
}

#intro p {font-family:'Trebuchet MS',Helvetica, Arial, serif, monospace, cursive, sans-serif;
font-size:18px;
}

/*Setup bottom of page Contact Us Section */
/*
#family1 {margin-left: auto; margin-right: auto; width: 79%; 
}
*/
p.family {text-align: justify;
}

h1 {font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
  font-size: x-large;}  

h2 {
  color: blue;
  font-size: medium;
  font-weight: normal;
}

h3,  {
height: 45px;
margin:0;
}
h4 {
font-style: italic;
}


li {
  font-size: small;
}

p {
  font-size: medium;
  color: black;
}

em {
  font-style: normal;   
  text-transform: uppercase; 
}

#logo p{
font-family: serif, verdana, helvetica, arial, sans-serif;
height: 15px;
font-style: normal;
color: #663333;
font-size: 40pt;
font-weight: bold;
}


#bottom p {
font-family: serif, verdana, helvetica, arial, sans-serif;
font-size: 12pt;
}
.feature1{
float: left;
margin: 10px;
border: thin black solid;
margin: 0.4em;
padding: 0.1em;
}

/*Image placement for James and Victoria blackwell*/
.feature1a{
float: right;
margin: 10px;
border: thin black solid;
margin: 0.4em;
padding: 0.1em;
}


div#about {
font-family:'Trebuchet MS',Helvetica, Arial, serif, monospace, cursive, sans-serif;
font-size:20px;
line-height: 25px;
text-align: center; 
}

div#aboutus{clear:both;
}

div#roots {clear: both;
}

/*p.about {font-weight: bold; text-align: center; 
}*/

.alive {font-weight: bold; color:green; text-decoration:underline;
}

/* TABLES for Families*/

/*Julian and Rosa*/
table#jnharper {width: 600px; border: 2px solid black;}
/*table#harper td {background: yellow; border: 1px solid black;} */
table#jnharper td {background: #e4d071; border: 1px solid black;}
table#jnharper caption {border: 2px solid yellow;}

table#jnharper  td.alive {font-style: italic;
color: green;
font-weight: bold; 
}
/*Julian and Rosa*/
table#jnharper{float: left;
 }


/*James and Victoria*/
table#jblackwell {width: 450px; border: 2px solid black;}
/*table#blackwell td {border: 1px solid red;}*/
table#jblackwell td {background: pink; border: 1px solid black;}
table#jblackwell caption {border: 2px solid pink;}

table#jblackwell  td.alive {font-style: italic;
color: green;
font-weight: bold; 
}
/*James and Victoria*/
 table#jblackwell{float: right;
}

/*Henry and Janie*/
table#harper {width: 450px; border: 2px solid black;}
/*table#harper td {background: yellow; border: 1px solid black;} */
table#harper td {background: #e4d071; border: 1px solid black;}
table#harper caption {border: 2px solid yellow;}

table#harper  td.jv {background-color: pink; 
}
/*Henry and Janie*/
table#harper { float: left; 
 }
 
 
 /*William and Emma*/
table#blackwell {width: 600px; border: 2px solid black;}
/*table#blackwell td {border: 1px solid red;}*/
table#blackwell td {background: pink; border: 1px solid black;}
table#blackwell caption {border: 2px solid pink; 
}

table#blackwell  td.jr {background-color: #e4d071;
}

/*William and Emma*/
table#blackwell{ float: right;
 }

/*Cap and Victoria*/
table#charper {width: 450px; border: 4px solid green;}
/*table#harper td {background: yellow; border: 1px solid black;} */
table#charper td {background: #e4d071; border: 1px solid black;}
table#charper caption {border: 2px solid yellow;font-weight: bold;}

/*Cap and Victoria*/
table#charper { float: left; 
 }


 /*Monroe and Melissa*/
table#xblackwell {width: 450px; border: 4px solid green;}
/*table#harper td {background: yellow; border: 1px solid black;} */
table#xblackwell td {background: pink; border: 1px solid black;}
table#xblackwell caption {border: 2px solid pink;font-weight: bold;}

 /*Unknown Parents of William Blackwell*/
table#xblackwell{ float: right;
 }

/*
#t1 {margin: 0 auto;
}
*/


div.images {
border: 0px silver solid;
}
/* Rosa and Greatgrand Daughter Image  */
div.mom{
float: left;
margin: 5px;
border: 3px silver solid;
margin: 0.1em;
padding: 0.1em;
}
div.mom{
text-align: center;
font-size: small;
font-weight: bold;
margin: 1px;
}

/* Janie M and Cousin and Niece Image  */
div.janie{
float: right;
margin: 5px;
border: 3px silver solid;
margin: 0.1em;
padding: 0.1em;
}
div.janie {
text-align: center;
font-size: small;
font-weight: bold;
margin: 1px;
}