h1{
    text-transform: lowercase;
    font-style:italic;
    border-bottom: black solid 1px;
    text-align: left;
    margin-bottom:1.5em;
    margin-top:1.5em;
    font-weight: 300;
    font-size: 2em;
}

h2{
    text-transform: lowercase;
    font-style:italic;
    font-weight:300;
    font-size: 2em;
    text-align: left;
}

/* Layout Styles */
#smwit, #landscape{
    display:flex;
    flex-direction:column;
    justify-items: flex-start;
    flex-wrap:wrap;
    height: 400px;
    padding-bottom: 4em;
    gap:2em;
}

#smwih-images{
    display:grid;
    grid-template-rows: 200px 200px;
    grid-template-columns: 300px 300px;
    grid-template-areas:
    "photo1 photo2"
    "photo3 photo4";
    gap: 10px;  
}

#landscape{
    display:flex;
    flex-direction:column;
    justify-items: flex-start;
    flex-wrap:wrap;
    height: 200px;
    padding-bottom: 4em;
    gap:2em;
}
#landscape-images{
    display:grid;
    grid-template-rows: 200px;
    grid-template-columns: 300px;
    grid-template-areas:
    "photo1 photo2";
    gap:10px;
}

#smwih-heading, #landscape-heading {
    position:relative;
    text-align:left;
    margin-bottom:.4em;
    padding-bottom:.4em;
    border-bottom:#000 1px solid;
}

div.image{
    width:600px;
}

p{
    font-size:1.1rem;
}

.text{
    gap:2em;
    position:relative;
    max-width: 38em;
    line-height: 1.25em;
}

#back{
    text-align: right;
    font-size:0.9em;
}

.dropdown{
    z-index:10;
}

/* Dropdown Menu */

.site-header ul li ul {
    background: #000;
}

 hr{
    color:#f2f2f2;
 }

 .dropdown a:link{
    color:#f2f2f2;
 }
 
 .dropdown a:hover{
        color:#d3d3d3;
        text-decoration:underline;
    }

.dropdown a:active{
    background-color:transparent;
}

/* Image Hover */
.image {
    opacity: 1;
    display: block;
    width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
  }
  
.image a:hover {
    opacity: 0.5;
    background-color:transparent;
}
