body{
    font-family: 'Montserrat', sans-serif;
    background: transparent;
    /* background: url("https://gis.pearlandtx.gov/images/open%20data%20portal/TESThubsitepic3.jpg");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; */
  }

.Heading{
    background-color: #00ab67;
    text-shadow: 2px 2px 3px black;
    width: 100%;
    color: white;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 10px;
}

.Container {
    height: 100%;
    width: 100%;
    position: relative;
    background-color: transparent;
    color: white;
    text-shadow: 2px 2px 2px black;
    font-size: 17px;
}

button {
    width: 100%;
    border-color: transparent;
    text-align: left;
    transition: all .05s ease-in-out;
    color: white;
    background-color: #00ab67;
    text-shadow: 2px 2px 3px black;
    padding: 10px;
    font: inherit;
    margin-top: 5px;
    font-size: 25px
}

button:hover {
    cursor: pointer;
    transform: scale(1.006);
}

span {
    border: solid white;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: rotate(315deg);
    margin-left: 7px;
    margin-bottom: 2px;
  }
  
.open-caret {
    transform: rotate(45deg);
}


/* Dropdown Items */
.Container .Aerial{
    overflow: hidden;
    max-height: 0px;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    text-align: center;
    transition: all .75s ease-in;
}
.Container .Boundaries{
    overflow: hidden;
    max-height: 0px;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    text-align: center;
    transition: all .75s ease-in;
}
.Container .CIP{
    overflow: hidden;
    max-height: 0px;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    text-align: center;
    transition: all .75s ease-in;
}
.Container .COM{
    overflow: hidden;
    max-height: 0px;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    text-align: center;
    transition: all .75s ease-in;
}
.Container .EPW{
    overflow: hidden;
    max-height: 0px;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    text-align: center;
    transition: all .75s ease-in;
}
.Container .Park{
    overflow: hidden;
    max-height: 0px;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    text-align: center;
    transition: all .75s ease-in;
}
.Container .Plan{
    overflow: hidden;
    max-height: 0px;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    text-align: center;
    transition: all .75s ease-in;
}

/* Dropdown Expand */
.Container .expand {
    max-height: 1500px;
    background-color: transparent;
}
img{
    height: 160px;
    width: 247px;
    transition: all .15s ease-in;
}
img:hover{
    transform: scale(1.05);
}



/* for mobile view */
@media screen and (min-width: 1000px) and (max-width: 1400px) {
   .Container .expand{
        grid-template-columns: auto auto auto;
   }
}

@media screen and (max-width: 999px) {
    .Container .expand{
        grid-template-columns: auto auto;
   }
}

@media screen and (min-width: 0px) and (max-width: 700px) {
.Container .expand{
    grid-template-columns: auto;
}
}