/* Body settings for the entire page*/

body {
  width: 900px;
  margin-left: auto; 
  margin-right: auto;
  font-family: Arial, Verdana, sans-serif;
  font-weight: normal;
  color: #31572C; /* dark green */
  font-size: 1em;
  background-color: #F1E8D8; /* light beige */
}

/* wrapper — Container around page content */

#wrapper {
  background-color: #ffc8dd; /* light pink */
  padding: 20px;
  box-sizing: border-box;
}

/* paragraph text */

p {
  margin-left: 2em;
  color: #31572C; /* dark green */
  font-size: 17px; 
  line-height: 1.8; 
 margin-bottom: 16px; 
}

/* Ordered lists*/

ol {
  color: #31572C; /* dark green */
  line-height: 1.8; 
  padding-left: 28px;
}

ol li: marker {
  color: #31572C; /* dark green */
  font-weight: bold;
  }

/* unordered lists */

ul {
  color: #31572C; /* dark green */
  line-height: 1.8; 
}

ul li::marker {
  color: #31572C; /* dark green */
}


/* headings */
h1 {
  font-size: 2.5em;

  color: #31572c; /*  dark green */

  font-weight: bolder;

  text-decoration: underline;
}

h2 {
  font-size: 2em;

  color: #31572c; /* dark green */

  font-weight: bolder; 

  text-decoration: none;
}

h3 {
  font-size: 1.7em;
  color: #31572c; /* dark green */
  font-weight: bolder; 
  text-decoration: none;
}

h4 {
  font-size: 1.4em;
  color: #31572c; /* dark green */
  font-weight: bolder; 
  text-decoration: none;
}


/* tables */

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background-color: #F5EFE6; /* cream */
  border: 2px solid #87A878; /* sage green border */
  border-radius: 12px;
  overflow: hidden;
}

td {
  padding: 16px 20px;
 text-align: left;
 border-bottom: 1px solid #D5DFCE; /* green line */
}
thead {
  background-color: #284B35; /* dark green */
  color: #F5EFE6; /* cream */
}
tbody tr:nth-child(even) {
  background-color: #E8EDE3; /* light green background */
}
tbody tr:last-child td {
  border-bottom: none;
}

/* back to top links */
a[href="#top"] {
  display: inline-block;
  background-color: #cad182; /* green background */
  color: #31572c; /* text dark green */
  padding: 12px 18px;
  margin: 12px 0;
  border: 2px solid #284B35; /* dark green border */
  border-radius: 8px;
  font-weight: bold;
  text-decoration: none;
}
/* back to top hover */
a[href="#top"]:hover {
  background-color: #f7b1b0; /*pink */
 color: #263D2D; /* dark green */
}


/* form fields */

input,
select,
textarea {
  border: 3px solid #87A878; /* sage green border */
  border-radius: 6px; 
  padding: 8px; 
  background-color: #F5EFE6; /* cream background */
  color: #d88180; /* pink */
  font-family: Arial, Verdana, sans-serif;
 font-size: 16px;
}
input:focus,
select:focus,
textarea:focus {
  outline: 2px solid #284B35; /* dark green */
  outline-offset: 2px; 
}
fieldset {
  border: 3px solid #87A878; /* sage green border */
  border-radius: 10px;
  color: #263D2D; /* dark green */
}

/* hoya images */
.hoya-image {
  float: left;
  margin-right: 20px;
  margin-bottom: 15px;
  padding: 1em;
  border: 1px solid #284B35; /* dark green border */
  background-color: #284B35; /* dark green */
}
.hoya-name {
  clear: both;
}

/* hoya flower images */
.hoya-flower {
  float: none;
  padding: 1em;
  border: 1px solid #284B35; /* dark green border */
  background-color: #284B35; /* dark green */
}

/* hoya names and flowers */
.hoya-name,
.flower-heading {
  color: #31572c; /*dark green */
  font-size: 1.2em;
  margin-left: 0;
  font-weight: bold;
  margin-top: 12px;
  margin-bottom: 8px;
}

h4:has(em) {
  color: #31572c; /* dark green */
  font-size: 1.2em; 
  font-weight: bold; 
  margin-left: 0;
  margin-top: 12px; 
  margin-bottom: 8px;
}

/* header background image */
header {
  min-height: 360px; /* Makes the header at least 360px tall */
  padding: 20px; /* Adds space inside the header */
  box-sizing: border-box;
 
background-image:
  linear-gradient(
    rgba(255, 200, 221, 0.40),
    rgba(255, 200, 221, 0.40)
  ),
  url("https://images.unsplash.com/photo-1781814046093-94706cd5bdf1?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMjM4NDZ8MHwxfHJhbmRvbXx8fHx8fHx8fDE3OTI1MzE5MjN8&ixlib=rb-4.1.0&q=85");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  color: #F5EFE6; /* cream */
}

/* navigation links */
header nav ul {
  margin: 0 auto;
  padding: 0;
  list-style-type: none;
  display: flex;
  justify-content: center;
  width: 100%;
  height: 40px;
}
header nav li {
  flex: 1;
  text-align: center;
}


a:link {
  color: #263D2D; /* dark green */
  font-weight: bold;
  text-decoration: none;
  font-size: 1.5em;
}

a:visited {
  color: #A65F67; /* darker pink */
}

a:hover,
a:focus {
  color: #87A878; /* sage green */
  text-decoration: underline;
}

a:active {
  color: #263D2D; /* dark green */
}

/* Navigation link colors */
/* Navigation link colors */
header nav a:link,
header nav a:visited {
  color: #263D2D;
}

header nav a:hover,
header nav a:focus {
  color: #87A878;
}

/* Highlight the current page */
#home nav .home a,
#types nav .types a,
#care nav .care a,
#resources nav .resources a,
#feedback nav .feedback a {
  background-color: #ffc8dd;
}

/* footer */
footer {
  clear: both;
}

/* site name — Dawnya's Hoyas heading */
.site-name {
  font-family: "Brush Script MT", "Segoe Script", cursive;
  font-size: 76px;
  font-weight: normal;
  text-align: center;
  color: #123524; /* dark green */
  text-decoration: none;
  margin: 20px 0;
  width: 100%;
}
header nav a {
  white-space: nowrap;
}