.mainHeader {
text-align: center;
display: flex;
justify-content: center;

margin-top: 5%;
}

.mainHeader img{
    width: 6%;
}

.resourceHeader {
    text-align: center;
display: flex;
justify-content: center;

margin-top: 5%;
}

.resourceHeader img{
    width:8%;
    height: 8%;
}

.resourceList {
    font-family: interstate, sans-serif;
    font-size: 2em;
    margin-left: 5%;
    list-style: none;
    display: grid;
    justify-content: center;
    grid-template-columns: 23% 23% 23%;
    grid-template-rows: 50%;
    column-gap: 10%;
    row-gap: 15%;
    margin-bottom: 10%;
}

.resourceList li {
    margin-bottom: 2%;
   
}

.Subhead {
    font-family: interstate, sans-serif;
    text-align: center;
    font-style: normal;
    margin-top: 2%;
    font-size: 1.7em;
    margin-bottom: 10%;
    font-weight: 400;
    color: #0D8081;
}
h1{
    margin-left: 2%;
    margin-right: 2%;
}

.featured   {
    display: flex;
    flex: wrap;
    flex-direction: row;
    justify-content:space-between;
    align-items:center;
    margin-top: 5%;
}

h4 {
    font-size: 1em;
    font-family: utopia-std, serif;
    color: #0D8081;
    margin-bottom: -2%;
}

.featured h3    {
    font-size: 2em;
    font-family: utopia-std, serif;
    margin-bottom: -1%;
}

.featuredText    {
    width: 50%;
    padding-left: 5%;
    padding-right: 15%;
}

.featuredImage  {
       margin-left: 5%;
}


.guides {
    margin-left: 5%;
    font-size: 2.5em;
  
}

.guideSubhead {
    font-family: interstate, sans-serif;
    font-style: normal;
    /* margin-top: -2%; */
    font-size: 1em;
    margin-left: 5%;
    margin-bottom: 5%;
    color: #0D8081;

} 
.searchBar  {
   margin: 10% 10% 5% 10%;
}

.label  {
    width: 100%;
    font-family: interstate, sans-serif;
    font-style: normal;
    display: flex;
    justify-content: space-between;
}

input[type=search] {
    width: 100%;
    background-color: #FCF9F6;
    border: none;
    border-bottom: 2px solid black;
    margin-bottom: 8%;
    font-family: interstate, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1em;
    margin-top: 1%;

}

.popular    {
    display: grid;
    justify-content: center;
    grid-template-columns: 23% 23% 23%;
    grid-template-rows: 50%;
    column-gap: 10%;
    row-gap: 15%;
    margin-bottom: 10%;
}

.popular .pinkButton {
    margin-top: 6%;
    font-size: 1.25em;
}

.popular h3 {
    font-size: 1.75em;
    font-family: utopia-std, serif;
    margin-top: 10%;
    line-height: 1.25em;
    color: #0D8081;
}

.popularItem a{
    text-decoration: none;
}

.popularItem img {
    width: 90%;
}
.needMoreHelp   {
    background-color: #F58C8A;
    margin-left: -12%;
    margin-right: -12%;
    padding-left: 17%;
    display: flex;
    flex: wrap;
    flex-direction: row;
    justify-content:space-between;
    align-content: center;
    align-items:center;
    margin-top: 8%;
    padding-top: 6%;
    padding-bottom: 6%;
}

.moreHelpText   {
    width: 50%;
    /* margin-left: 12%; */
    padding-right: 10%;
}
.moreHelpImg {
    width: 80%;
    /* margin-top: 2%; */
    
}



.learnMore  {
    margin-left: -5%;
    margin-right: -5%;
    display: flex;
    flex: wrap;
    flex-direction: row;
    justify-content:space-between;
    align-items:stretch;
    margin-top: 5%;
    padding-top: 3%;
    padding-bottom: 3%;
}

.learnMoreText  {
    width: 50%;
    margin-left: 5%;
}

.learnMore img {
    padding-left: 25%;
}


.popularItem p{
    font-size: 1.1em;
}
