body {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: 10vh auto 10vh;
  width: 100vw;
  height: 100vh;
  overflow-y: hidden;
}

.desktop {
  display: none;
}

.scrollable {
  overflow-y: auto !important;
}

.input_row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 80vw;
}

.update_msg {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  opacity: 0;
  transition: 0.2s ease;
  padding: 2vh 3vh;
  background: #00a807;
  z-index: 46;
  color: white;
  border-radius: 100px;
}

.error {
  background: #dd293e;
}

.input_row>h2 {
  font-weight: 500;
  font-size: 5vw;
}

.input_row>input {
  padding: 2vw;
  border: 0;
  outline: none;
  font-size: 4vw;
  width: 100%;
  margin-left: 5vw;
}

.input_row>input:empty {
  border-bottom: .75vw solid #7BAE18;
}

.sidebar {
  z-index: 50 !important;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: 100vw;
  height: 100vh;
  position: absolute;
  left: 100%;
  top: 0;
  transition: 0.5s ease;
  background: #7BAE18;
  color: white;
  padding: 10vw;
}

.sidebar>img {
  width: 11vw;
}

.sidebar>.sidebar_hrefs {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  justify-content: space-evenly;
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
}

.sidebar>.sidebar_hrefs a {
  color: white;
  font-size: 4.5vw;
  margin-top: 3vh;
  margin-bottom: 3vh;
  text-decoration: none;
  text-transform: uppercase;
}

.sidebar>svg {
  width: 45vw;
}

.sidebar>svg>g>g>path,
.sidebar>svg>g>text {
  fill: #4C6B10;
}

.sidebar>.sidebar_hrefs a:first-of-type {
  margin-top: 0;
}

.sidebar>.sidebar_hrefs a:last-of-type {
  margin-bottom: 0;
}

.menu_bar, .bottom_bar {
  background: #7BAE18;
  color: white;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 3vw;
  padding-top: 0;
  padding-bottom: 0;
  grid-column: 1 / -1;
  grid-row: 1 / 2;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.bottom_bar {
  position: fixed;
  height:60px;
  bottom:0px;
}

.menu_bar svg {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}

.menu_bar img:last-of-type {
  width: 8%;
}

.bottom_bar>a {
  width: 50%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  text-decoration: none;
  outline: none;
}

.bottom_bar>a:last-of-type {
  flex-direction: row-reverse;
}

.bottom_bar>a>img {
  width: 25%;
  margin-right: 2vw;
}

.bottom_bar>a:last-of-type>img {
  margin-right: 0;
  margin-left: 2vw;
}

.bottom_bar>a>p {
  color: white;
  font-size: 4vw;
}

.link_row_page {
  width: 85%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4vw;
}

.link_row_page>a {
  color: #B54542;
  font-weight: bold;
  font-size: 4vw;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.content_container {
  grid-row: 2 / 3;
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  overflow: auto;
}

.content_container>.link_container {
  grid-row: 2 / 3;
  grid-column: 1 / -1;
  padding: 3vw;
  width: 100%;
  height: 100%;
  display: grid;
  justify-content: center;
  grid-template-columns: repeat(2, 40vw);
  grid-template-rows: repeat(3, 40vw);
  grid-gap: 5vw;
}

.content_container>.link_container>a {
  width: 100%;
  height: 100%;
  box-shadow: 0px 3px 10px lightgray;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-top: 2vw solid #B54542;
  text-decoration: none;
  color: #B54542;
}

.content_container>.link_container>a svg {
  width: 30%;
  margin-bottom: 4vw;
}

.content_container>.link_container>a p {
  color: #B54542;
  font-size: 4vw;
  font-weight: bold;
}

.content_container>.link_container>a:nth-child(even) {
  grid-column: 2 / -1;
}

.content_container>.link_container>a:last-child {
  margin: 0;
}

.bottom_bar {
  grid-row: 3 / -1;
}

.section_header {
  margin-top: 6vw;
  color: #B54542;
  font-size: 6vw;
  margin-bottom: 6vw;
  text-transform: uppercase;
}

.info_cont {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 5vw;
}

.info_cont_column {
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
  width: 100%;
  padding: 5vw;
  height: auto;
  padding-top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  overflow: auto;
}

.info_cont_column>a {
  width: 100%;
  color: white;
  font-size: 5vw;
  text-decoration: none;
  font-weight: 500;
  margin-bottom: 2vh;
  background: #399AB5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2vw;
}

.info_cont>.column_start {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.info_cont>.column_start>img, .info_cont>img, .info_cont>.column_start>iframe, .info_cont>iframe {
  margin-bottom: 6vw;
  border: 0px;
  width: 100%;
}

.info_cont>p {
  width: 100%;
  line-height: 1.5em;
  margin-bottom: 6vw;
}

.img_cont_wrapper, .vid_cont_wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.info_cont>.column_start>a {
  width: 100%;
  color: white;
  font-size: 5vw;
  text-decoration: none;
  font-weight: 500;
  margin-bottom: 2vh;
  background: #399AB5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2vw;
}

.img_cont, .vid_cont {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-bottom: 4vw;
}

.img_cont>h1, .vid_cont>h1 {
  font-size: 4vw;
  margin-bottom: 4vw;
}

.img_cont>img, .vid_cont>iframe {
  width: 90%;
  align-self: center;
  border: 0;
}

.soils_map {
  width: 95vw;
  height: 70vh;
  margin-bottom: 2vh;
}

#address_search {
  width: 95vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  font-size: 4vw;
}

#address_search h2 {
  font-size: 4vw;
  font-weight: 500;
  margin-bottom: 2vh;
}

#address_search>.addr_search_opt {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 95vw;
  margin-bottom: 2vh;
}

#address_search>.addr_search_opt>input {
  width: 100%;
  padding: 1vw;
  outline: none;
}

#address_search>.addr_search_opt>button {
  padding: 1vw;
  font-size: 3vw;
  margin-left: 2vw;
}

#map-canvas {
  margin: 0;
  padding: 0;
  height: 50vh;
  width: 95vw;
  z-index: 1;
  min-height:250px;
}

#sizing_map_btns {
  margin-top: 2vh;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: space-between;
  width: 95vw;
}

#sizing_map_btns>button {
  cursor: pointer;
  width: 100%;
  padding: 2vw;
  font-size: 3.5vw;
  border: 0px;
  background: #399AB5;
  color: white;
  outline: none;
}

#sizing_map_btns>button:last-of-type {
  background: #B54542;
}

#sizingResultsArea {
  margin-top: 2vh;
  background-color: #f4f4f4;
  width: 95vw;
  padding: 3vw;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 2vh;
}

#sizingResultsArea>div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

#sizingResultsArea>div>h2 {
  font-weight: 500;
  font-size: 4vw;
  margin-bottom: 1vh;
}

#sizingResultsArea>div:last-of-type {
  align-items: flex-end;
  text-align: right;
}

#measuredAreaMap,
#suggestedRainGardenArea {
  color: #AB142C;
  font-size: 5vw;
  font-weight: 600;
}

.ack_cont, .priv_cont, .how_cont {
  width: 100vw;
  padding: 5vw;
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.ack_cont>p, .priv_cont>p, .how_cont>p {
  text-align: left;
  font-size: 4vw;
  margin-bottom: 5vw;
}

.how_cont ol{
  width: 100%;
}

.ack_cont>div, .priv_cont>div, .how_cont>div {
  width: 100vw;
  background: white;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.ack_cont>div>img {
  width: 49%;
  padding: 3vw;
}

.rain_gardens, .rain_garden_options {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 90vw;
}

.rain_gardens>div, .rain_garden_options>div:not(.input_row) {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 4vw;
  justify-content: flex-start;
  border-left: 2vw solid #B54542;
  color: #B54542;
  box-shadow: 0px 3px 10px lightgray;
  width: 100vw;
  margin-bottom: 4vw;
}

.rain_gardens>div:first-of-type {
  text-align: center;
  justify-content: center;
}

.rain_garden_options>.input_row {
  margin-bottom: 4vh;
  width: 100%;
}

.rain_garden_options>div:not(.input_row)>img {
  width: 15vw;
  margin-right: 4vw;
}

.rain_gardens>.add_rg {
  box-shadow: none;
  border: 0;
  background: #B54542;
  color: white;
}

.rain_gardens>.add_rg>h3 {
  font-size: 5vw;
  font-weight: 500;
  margin: 0;
  padding: 0;
}

.rain_gardens>.add_rg>h2 {
  font-size: 12vw;
  margin: 0;
  padding: 0;
  font-weight: 500;
}

.name_modal {
  position: absolute;
  top: 0%;
  left: 0%;
  z-index: 45;
  background: rgba(255, 255, 255, 0.9);
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  display: none;
  opacity: 0;
  transition: 0.2s ease;
  padding: 5vw;
}

.name_modal>img {
  width: 10vw;
  margin-bottom: 15vh;
}

.name_modal>h3 {
  width: 100%;
  text-align: center;
  margin-bottom: 3vh;
  font-size: 5vw;
}

.name_modal>div {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15vh;
}

.name_modal>div>input {
  width: 75%;
  padding: 2vw;
  border: none;
  box-shadow: 0px 3px 6px lightgray;
  outline: 0px;
}

.name_modal>div>button {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  width: 20%;
  padding: 2vw;
  background: none;
  border: 0px;
  background: #7BAE18;
  color: white;
  font-weight: 500;
}

.sizeloc_bar, .plantlist_bar, .reminders_bar {
  width: 100vw;
  height: 100vh;
  position: absolute;
  right: -100%;
  top: 0;
  opacity: 0;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
  background: white;
  border-top: 2vw solid #7BAE18;
  border-bottom: 2vw solid #7BAE18;
  padding: 15vw;
  transition: 0.5s ease;
}

.plantlist_bar {
  padding: 5vw;
  margin-top:9vh;
}

.sizeloc_bar>h3, .plantlist_bar>h3, .reminders_bar>h3 {
  text-transform: uppercase;
  color: #B54542;
  font-size: 5vw;
}

.sizeloc_bar>.content, .plantlist_bar>.content {
  height: 100%;
  width: 100%;
  padding-top: 3vw;
  padding-bottom: 3vw;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

.sizeloc_bar>.content>div, .plantlist_bar>.content>div {
  width: 100%;
}

.sizeloc_bar>.content>div>.row_between, .plantlist_bar>.content>div>.row_between {
  margin-bottom: 3vw;
}

.sizeloc_bar>.content>div>.row_between>h3 {
  font-weight: 500;
  font-size: 4.5vw;
}

.sizeloc_bar>.content>div>.row_between>input {
  font-weight: 500;
  padding: 2vw;
  border: 0;
  outline: none;
  color: gray;
  text-align: right;
  background: transparent;
  font-size: 4vw;
}

.sizeloc_bar>.content>div>button, .plantlist_bar>.content>div>button {
  width: 100%;
  padding: 4vw 2vw;
  outline: none;
  border-radius: 5px;
  margin-bottom: 2vw;
  background: #399AB5;
  border: 0;
  color: white;
  font-size: 3.5vw;
}

.sizeloc_bar>.content>div {
  margin-bottom: 5vw;
}

.sizeloc_bar>.content>button {
  outline: none;
  margin-top: 5vw;
  width: 100%;
  padding: 4vw 2vw;
  border-radius: 5px;
  background: #7BAD18;
  border: 0;
  color: white;
  font-size: 3.5vw;
}

.sizeloc_bar>.content>button:last-of-type {
  background: #a12517;
}

.plantlist_bar table>tr>td>h1 {
  font-size: 4vw !important;
  padding: 3vw;
  font-weight: 500;
}

.plantlist_bar table>tr>td:first-of-type {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.plantlist_bar table>tr>td:last-of-type {
  text-align: center;
}

.sizing_banner {
  width: 95vw;
  background: #21a662;
  color: white;
  padding: 10vw;
}

#calculation_banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#calculation_banner button {
  height: fit-content;
  border-radius: 100%;
  padding: 0vw 2vw;
  border: none;
  color: #21a662;
  font-size: 4vw;
  cursor: pointer;
  background-color: white;
}

.sizing_calc_opts {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: 95vw;
}

.calc_hr {
  padding-left: 2vw;
  padding-right: 2vw;
  border-top: 2px solid rgba(0, 0, 0, 0.0925);
  background: rgba(33, 142, 173, 0.08);
}

.calc_note {
  padding: 0vw 2vw 2vw 2vw;
  background: rgba(33, 142, 173, 0.08);
}

.calc_note p {
  width: 80vw;
  font-size: 2vw;
}

.gray_banner {
  width: 95vw;
  background: #e7e7e7;
  font-weight: 500;
  padding: 2vw;
}

.gray_banner select {
  padding: 1vw 2vw;
  background: rgba(0, 0, 0, 0.0625);
  border-radius: 5px;
  font-weight: 500;
  border: 0;
}

.button_row {
  margin-top: 1vh;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 95vw;
}

.button_row a {
  width: 49%;
}

.button_row button {
  width: 49%;
  padding: 4vw;
  border-radius: 5px;
  border: 0;
  color: white;
  margin-bottom: 1vh;
  background: #399AB5;
}

.button_row a button {
  width: 100%;
}

.sc_options {
  width: 95vw;
}

.sc_options>.option {
  width: 100%;
  padding: 2vw;
  background: rgba(33, 142, 173, 0.08);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.sc_options>.option>p {
  width: 80vw;
  margin-right: 5vw;
}

.sc_options>.option>input {
  background: transparent;
  border: 0px;
  text-align: right;
  font-size: 4vw;
  width: 100%;
}

.scd_options {
  width: 95vw;
}

.scd_options>.option {
  width: 100%;
  padding: 2vw;
  background: rgba(33, 142, 173, 0.08);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.scd_options>.option>p {
  width: 45%;
  margin-right: 5vw;
}

.scd_options>.option>div {
  width: 70%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
}

.scd_options>.option>div>input[type="range"] {
  background: transparent;
  border: 0px;
  text-align: right;
  font-size: 4vw;
  width: 90%;
}

.scd_options>.option>div>input[type="number"] {
  width: 30%;
  background: transparent;
  border: 0px;
  text-align: right;
  font-size: 4vw;
  margin-left: 5vw;
}

.scd_options>.option>div>select {
  padding: 2vw;
  background: white;
  border: 0px;
  outline: none;
  font-size: 4vw;
  box-shadow: 0px 3px 10px lightgray;
  border-radius: 5px;
}

.select_soil button{
  padding: 1vw;
  border: none;
  box-shadow: 0px 3px 3px lightgray;
  cursor: pointer;
}

#sandy_soil{
  border-radius: 5px 0px 0px 5px;
}
#clayey_soil{
  border-radius: 0px 5px 5px 0px;
}

.calculated_surface_area {
  width: 95vw;
  padding: 2vw;
  background: #21a662;
  font-weight: 500;
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.calculated_surface_area>p>span {
  font-size: 6vw;
  font-weight: 700;
}

.checkboxes {
  width: 100%;
  background: rgba(237, 246, 249, 0.6);
}

.checkboxes>div {
  padding: 2vw;
}

.checkboxes>div>strong {
  border-bottom: 1px solid gray;
  width: 100%;
  padding-bottom: 2vw;
  margin-bottom: 2vh;
  font-size: 4vw;
}

.checkboxes>div>label {
  margin-bottom: 1vh;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  font-size: 4vw;
  font-weight: 500;
}

.checkboxes>div>label>input {
  margin-right: 2vw;
}

.submit_plant_query {
  width: 100%;
  padding: 3vw;
  font-size: 4vw;
  font-weight: 500;
  color: white;
  border: 0;
  background: #399AB5;
}

.filtered_plant_results {
  width: 100%;
  height: 100%;
  box-shadow: 0px 3px 6px lightgray;
  border-collapse: collapse;
}

.filtered_plant_results tr {
  width: 100%;
  margin: 0;
}

.plantlist_bar table {
  width: 100%;
  margin-bottom: 4vw;
}

.plantlist_bar tr {
  width: 100%;
  margin: 0;
}

.filtered_plant_results tr:nth-child(1), .plantlist_bar tr:nth-child(1) {
  background: rgba(0, 0, 0, 0.125);
}

.filtered_plant_results tr:nth-child(1)>td, .plantlist_bar tr:nth-child(1)>td {
  font-weight: 500;
  border: 1px solid lightgray;
  margin: 0;
}

.filtered_plant_results tr:nth-child(even), .plantlist_bar tr:nth-child(even) {
  background: rgba(0, 0, 0, 0.05);
}

.filtered_plant_results tr:nth-child(odd), .plantlist_bar tr:nth-child(odd) {
  background: rgba(0, 0, 0, 0.1);
}

.filtered_plant_results tr>td>img {
  width: 10vw;
  height: 10vw;
}

.plantlist_bar tr>td>img {
  width: 20vw;
  height: 20vw;
}

.filtered_plant_results tr>td {
  font-size: 2.5vw;
  border: 1px solid lightgray;
  padding: 1vw;
}

.filtered_plant_results tr>td>div>h2 {
  font-weight: 600;
  margin: 0;
  padding: 0;
  font-size: 3vw;
}

.filtered_plant_results tr>td>div>p {
  font-size: 2.5vw;
  font-style: italic;
}

.plant_details {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100vw;
  height: 100%;
  overflow: auto;
}

.plant_details>h1 {
  font-size: 5vw;
  margin-top: 3vh;
  font-weight: 500;
}

.notes, .latin_name {
  padding: 0 10vw;
  text-align: center;
}

.plant_details img {
  margin-top: 3vh;
  width: 50vw;
}

.plant_details>div {
  margin-top: 3vh;
}

.plant_details .width_height {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-top: 3vh;
}

.plant_details>.width_height>div {
  padding: 2vw;
  text-align: center;
  color: white;
}

.plant_details .width_height>div:nth-child(1) {
  background: rgb(123, 173, 24, 1);
}

.plant_details .width_height>div:nth-child(2) {
  background: rgb(123, 173, 24, 1);
}

.plant_details div h2 {
  font-size: 4vw;
  text-align: center;
  font-weight: 500;
}

.plant_details div h1 {
  font-size: 5vw;
  text-align: center;
  font-weight: 500;
}

.plant_details>p {
  font-size: 4vw;
  font-style: italic;
  margin-top: 1vh;
}

.plant_details>small {
  font-size: 3.5vw;
  margin-top: 1vh;
}

.plant_details>.shade_sun {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.plant_details>.shade_sun>.shade_sun_res {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: center;
  margin-bottom: 3vh;
}

.plant_details>.shade_sun>.shade_sun_res>div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-left: 3vw;
  margin-right: 3vw;
}

.plant_details>.shade_sun>.shade_sun_res>div>img {
  width: 12vw;
  height: 12vw;
}

.save_btn_plants{
  background: #399AB5;
  border: 0px;
  /* border-radius: 5px; */
  /* margin-top: 2vh; */
  width: 100%;
  color: white;
  font-size: 4vw;
  padding: 6% 4% 6% 4%;
  position: fixed;
  /* margin-top: 65vh; */
  bottom:60px;
  z-index: 3;
  left: 0%;
  margin-top:0px;
}

.sizing_map_text{
  width: 95vw;
}

@media only screen and (min-width: 400px) {
  .sizing_banner {
    padding: 4vw;
  }
  #calculation_banner button {
    padding: 0% 1.9%;
  }
}

@media only screen and (min-width: 768px) {
  .menu_bar, .bottom_bar {
    background: #7BAE18;
    padding: 2vw;
  }

  .menu_bar svg {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }

  .menu_bar img:last-of-type {
    width: 5%;
  }

  .bottom_bar {
    grid-row: 3 / -1;
  }

  .bottom_bar>a {
    width: 50%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    outline: none;
  }

  .bottom_bar>a>img {
    width: 15%;
    margin-right: 2vw;
  }

  .bottom_bar>a>p {
    font-size: 2.5vw;
  }

  .link_row_page {
    width: 75%;
    margin-bottom: 8vw;
  }

  .link_row_page>a {
    font-size: 2.5vw;
  }

  .content_container>.link_container {
    grid-template-columns: repeat(3, 25vw);
    grid-template-rows: repeat(3, 25vw);
  }

  .content_container>.link_container>a {
    border-top-width: 1.5vw;
  }

  .content_container>.link_container>a svg {
    width: 30%;
    margin-bottom: 3vw;
  }

  .content_container>.link_container>a p {
    font-size: 2.5vw;
  }

  .content_container>.link_container>a:nth-child(even) {
    grid-column: auto;
  }

  .section_header {
    margin-top: 6vw;
    color: #B54542;
    font-size: 3vw;
    margin-bottom: 6vw;
    text-transform: uppercase;
    padding:10px;
  }

  .info_cont {
    width: 95%;
    display: flex;
    flex-direction: row;
    padding-top: 0;
    flex-wrap: wrap;
  }

  .info_cont_column>a {
    padding: 2vw;
    font-size: 3vw;
  }

  .info_cont_column>p {
    margin-bottom: 0;
    line-height: 1.5em;
    font-size: 3vw;
    text-align: justify;
    margin-top: 0;
  }

  .info_cont>.column_start {
    width: 100%;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
  }

  .info_cont>img, .info_cont>.column_start>iframe, .info_cont>iframe {
    margin-bottom: 2vh;
    width: 100%;
    height: 30vh;
  }

  .info_cont>.column_start>a {
    font-size: 2.5vw;
    margin-bottom: 2vh;
    padding: 2vw;
  }

  .info_cont>p {
    line-height: 1.5em;
    font-size: 2.25vw;
    text-align: justify;
    margin-bottom: 6vw;
  }

  .img_cont_wrapper, .vid_cont_wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }

  .img_cont, .vid_cont {
    display: flex;
    flex-direction: column;
    width: 49%;
    align-items: center;
    justify-content: center;
    margin-bottom: 4vw;
  }

  .img_cont>h1, .vid_cont>h1 {
    font-size: 2.5vw;
    margin-bottom: 4vw;
  }

  .img_cont>img, .vid_cont>iframe {
    width: 100%;
    align-self: center;
  }

  .info_cont>iframe {
    height: 30vh;
  }

  .soils_map {
    height: 70vh;
  }

  #address_search {
    font-size: 3vw;
    flex-direction: row;
    align-items: center;
    margin-bottom: 2vh;
  }

  #address_search h2 {
    font-size: 3vw;
    margin-bottom: 0vh;
  }

  #address_search>.addr_search_opt {
    width: 65%;
    margin-bottom: 0vh;
  }

  #address_search>.addr_search_opt>input {
    padding: 1vw;
  }

  #address_search>.addr_search_opt>button {
    padding: 1vw;
    font-size: 2vw;
    margin-left: 2vw;
  }

  #map-canvas {
    margin: 0;
    padding: 0;
    height: 50vh;
    width: 95vw;
  }

  #sizing_map_btns {
    margin-top: 2vh;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    width: 95vw;
  }

  #sizing_map_btns>button {
    width: 100%;
    padding: 2vw;
    font-size: 3vw;
    border: 0px;
    background: #399AB5;
    color: white;
    outline: none;
  }

  #sizing_map_btns>button:last-of-type {
    background: #B54542;
  }

  #sizingResultsArea {
    margin-top: 2vh;
    background-color: #f4f4f4;
    width: 95vw;
    padding: 3vw;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 2vh;
  }

  #sizingResultsArea>div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }

  #sizingResultsArea>div>h2 {
    font-weight: 500;
    font-size: 3.5vw;
    margin-bottom: 1vh;
  }

  #sizingResultsArea>div:last-of-type {
    align-items: flex-end;
    text-align: right;
  }

  #measuredAreaMap,
  #suggestedRainGardenArea {
    color: #AB142C;
    font-size: 5vw;
    font-weight: 600;
  }

  .ack_cont, .priv_cont, .how_cont {
    padding: 8vw;
    padding-bottom: 0;
  }

  .ack_cont>p, .priv_cont>p, .how_cont>p {
    font-size: 3vw;
  }

  .ack_cont>div, .priv_cont>div, .how_cont>div {
    width: 100vw;
  }

  .ack_cont>div>img {
    width: 30%;
  }

  .gray_banner>p {
    font-size: 3vw;
  }

  .gray_banner select {
    padding: 2vw 2vw;
    font-size: 3vw;
  }

  .button_row {
    margin-top: 1vh;
    width: 95vw;
  }

  .button_row button {
    width: 49%;
    padding: 4vw;
    font-size: 3vw;
  }

  .rain_gardens {
    width: 90vw;
  }

  .rain_gardens>div {
    width: 28vw;
    height: 28vw;
    margin-bottom: 3vw;
  }

  .rain_gardens>.add_rg>h3 {
    font-size: 4vw;
  }

  .rain_gardens>.add_rg>h2 {
    font-size: 8vw;
  }

  .name_modal {
    padding: 15vw;
  }

  .name_modal>img {
    width: 7vw;
    margin-bottom: 15vh;
  }

  .name_modal>h3 {
    font-size: 4vw;
  }

  .name_modal>div>input {
    font-size: 3vw;
    width: 65%;
  }

  .name_modal>div>button {
    font-size: 3vw;
    width: 30%;
  }

  .rain_gardens>div, .rain_garden_options>div:not(.input_row) {
    padding: 3vw;
    width: 43vw;
  }

  .rain_garden_options>.input_row {
    margin-bottom: 4vh;
    width: 100%;
  }

  .rain_garden_options>.input_row>h2 {
    font-size: 3vw;
  }

  .rain_garden_options>.input_row>input {
    font-size: 3vw;
  }

  .rain_garden_options>div:not(.input_row)>img {
    width: 15%;
    margin-right: 3vw;
  }

  .sizeloc_bar>h3, .plantlist_bar>h3, .reminders_bar>h3 {
    font-size: 3vw;
  }

  .sizeloc_bar>.content, .plantlist_bar>.content, .reminders_bar>.content {
    height: 100%;
    width: 100%;
    padding-top: 1vw;
    padding-bottom: 1vw;
    overflow-y: auto;
  }

  .sizeloc_bar>.btns>button, .reminders_bar>.btns>button, .plantlist_bar>.btns>button {
    padding-top: 3vw;
    padding-bottom: 3vw;
    font-size: 2.5vw;
    letter-spacing: .25vw;
  }

  .sizeloc_bar>.content>div>.row_between {
    margin-bottom: 2vw;
  }

  .sizeloc_bar>.content>div>.row_between>h3 {
    font-size: 3vw;
  }

  .sizeloc_bar>.content>div>.row_between>input {
    padding: 2vw;
    width: 100%;
    font-size: 3vw;
  }

  .sizeloc_bar>.content>div>button, .plantlist_bar>.content>div>button {
    width: 100%;
    padding: 2vw 1vw;
    font-size: 2.5vw;
  }

  .sizeloc_bar>.content>div {
    margin-bottom: 5vw;
  }

  .sizeloc_bar>.content>button {
    margin-top: 5vw;
    padding: 2vw 1vw;
    font-size: 2.5vw;
  }

  .sizeloc_bar>.content>button:last-of-type {
    background: #a12517;
  }

  .plantlist_bar table>tr>td>h1 {
    font-size: 3vw !important;
    padding: 2vw;
  }

  .plantlist_bar table>tr>td:last-of-type {
    font-size: 2.5vw;
  }

  .sc_options {
    width: 95vw;
  }

  .sc_options>.option {
    padding: 2vw;
  }

  .sc_options>.option>p {
    font-size: 3vw;
  }

  .sc_options>.option>input {
    font-size: 3vw;
  }

  .scd_options {
    width: 95vw;
  }

  .scd_options>.option {
    padding: 2vw;
  }

  .scd_options>.option>p {
    font-size: 3vw;
  }

  .scd_options>.option>div {
    width: 70%;
  }

  .scd_options>.option>div>input[type="number"] {
    width: 30%;
    font-size: 3vw;
  }

  .scd_options>.option>div>select {
    padding: 2vw;
    font-size: 3vw;
    box-shadow: 0px 3px 10px lightgray;
  }

  .calculated_surface_area {
    padding: 2vw;
  }

  .calculated_surface_area>p>span {
    font-size: 4vw;
  }

  .checkboxes {
    width: 100%;
    background: rgba(237, 246, 249, 0.6);
  }

  .checkboxes>div {
    padding: 2vw;
    width: 100%;
  }

  .checkboxes>div>strong {
    padding-bottom: 2vw;
    margin-bottom: 2vh;
    font-size: 2.5vw;
  }

  .checkboxes>div>label {
    margin-bottom: 1vh;
    font-size: 2.5vw;
  }

  .checkboxes>div>label>input {
    margin-right: 2vw;
    --size: 2.5vw;
    width: var(--size);
    height: var(--size);
  }

  .submit_plant_query {
    padding: 2vw;
    font-size: 3vw;
  }

  .filtered_plant_results tr>td>img {
    width: 10vw;
    height: 10vw;
  }

  .filtered_plant_results tr>td {
    font-size: 2vw;
    padding: 1vw;
  }

  .filtered_plant_results tr>td>div>h2 {
    font-weight: 600;
    margin: 0;
    padding: 0;
    font-size: 2.5vw;
  }

  .filtered_plant_results tr>td>div>p {
    font-size: 2vw;
    font-style: italic;
  }

  .plant_details {
    width: 100vw;
    height: 100%;
    overflow: auto;
  }

  .plant_details>h1 {
    font-size: 4vw;
    margin-top: 3vh;
  }

  .plant_details div h2 {
    font-size: 3vw;
  }

  .plant_details div h1 {
    font-size: 4vw;
  }

  .plant_details>p {
    font-size: 3vw;
  }

  .plant_details>small {
    font-size: 2.5vw;
  }

  .plant_details > img {
    margin-top: 3vh;
    width: 300px;
    height: auto;
    border-radius: 5px;
  }

  .plant_details>div {
    margin-top: 3vh;
  }

  .plant_details .width_height {
    margin-top: 3vh;
    width: 30vw;
    flex-direction: column;
    justify-content: space-between;
  }

  .plant_details>.width_height>div {
    padding: 2vw;
    border-radius: 5px;
    width: 100%;
  }

  .plant_details .width_height>div:nth-child(1) {
    background: rgb(123, 173, 24, 1);
  }

  .plant_details .width_height>div:nth-child(2) {
    background: rgb(123, 173, 24, 1);
    margin-top: 1vh;
  }

  .plant_details>.shade_sun {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .plant_details>.shade_sun>.shade_sun_res {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: center;
    margin-bottom: 3vh;
  }

  .plant_details>.shade_sun>.shade_sun_res>div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-left: 3vw;
    margin-right: 3vw;
  }

  .plant_details>.shade_sun>.shade_sun_res>div>img {
    width: 10vw;
    height: 10vw;
  }

  .plant_details>.shade_sun>.shade_sun_res>div>p{
    font-size: 2.5vw;
    margin-top: 1vh;
  }

  .save_btn_plants{
    width: 100;
    font-size: 2.75vw;
    padding: 2vw 0vw;
    left: 0%;
    margin-top:0;
  }

}

@media only screen and (min-width: 1025px) {
  body {
    grid-template-columns: repeat(25, 4fr);
    grid-template-rows: auto;
    align-items: center;
    justify-content: center;
  }

  .menu_bar {
    grid-column: 1 / 7;
    grid-row: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .menu_bar svg:first-of-type {
    width: 15vw;
  }

  .content_container {
    grid-row: 1 / -1;
    grid-column: 7 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0;
    overflow: hidden;
  }

  .content_container>.link_row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 45vw;
  }

  .content_container>.link_row>a,
  .content_container>.link_row>p {
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight: bold;
    color: #B54542;
  }

  .content_container>.link_row:last-of-type {
    width: 15vw;
  }

  .content_container>.link_container {
    grid-template-columns: repeat(3, 13.75vw);
    grid-template-rows: repeat(2, 13.75vw);
    grid-gap: 2vw;
  }

  .content_container>.link_container>a {
    border-top-width: .5vw;
    box-shadow: 0px 3px 3px lightgray;
    transition: 0.2s ease;
  }

  .content_container>.link_container>a:hover {
    cursor: pointer;
    transform: translateY(-5%);
    background: #B54542;
  }

  .content_container>.link_container>a:hover p {
    color: white;
  }

  .content_container>.link_container>a svg {
    width: 30%;
    margin-bottom: 1vw;
  }

  .content_container>.link_container>a:hover svg>rect,
  .content_container>.link_container>a:hover svg>path,
  .content_container>.link_container>a:hover svg>g>path,
  .content_container>.link_container>a:hover svg>g>g>path {
    fill: white;
  }

  .content_container>.link_container>a:hover svg .ruler_studs {
    fill: #B54542;
  }

  .content_container>.link_container>a p {
    font-size: .8vw;
    transition: 0.2s ease;
  }

  .content_container>.link_container>a:nth-child(even) {
    grid-column: auto;
  }

  .menu_bar>.arrow_collection {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .menu_bar>.arrow_collection>.copyright {
    font-size: .9vw;
  }

  .menu_bar>.arrow_collection>div {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    margin-top: 3vw;
    margin-bottom: 3vw;
    width: 15vw;
  }

  .menu_bar>.arrow_collection>div>a {
    width: -webkit-min-content;
    width: -moz-min-content;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    outline: none;
    text-decoration: none;
  }

  .menu_bar>.arrow_collection>div>a>img {
    width: 4vw;
    margin: 0vw;
    margin-bottom: .5vw;
  }

  .menu_bar>.arrow_collection>div>a>p {
    color: white;
    text-decoration: none;
    font-size: 1vw;
  }

  .desktop {
    display: flex;
  }

  .mobile {
    display: none;
  }

  .section_header {
    margin-top: 2vw;
    color: #B54542;
    font-size: 1.25vw;
    margin-bottom: 2vw;
    text-transform: uppercase;
  }

  .link_row_page {
    width: 35%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2vw;
  }

  .link_row_page>a {
    color: #B54542;
    font-weight: bold;
    font-size: .8vw;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }

  .link_row_page>a:hover {
    cursor: pointer;
  }

  .link_row_page>a:after {
    content: '';
    width: 0%;
    opacity: 0;
    margin-top: .25vw;
    height: .25vw;
    background: #B54542;
    transition: 0.2s ease;
  }

  .link_row_page>a:hover:after {
    width: 100%;
    opacity: 1;
    transition: 0.2s ease;
  }

  .selected_menu:after {
    content: '';
    width: 100% !important;
    opacity: 1 !important;
    margin-top: .25vw;
    height: .25vw;
    background: #B54542;
    transition: 0.2s ease;
  }

  .info_cont>.column_start {
    width: -webkit-min-content;
    width: -moz-min-content;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: 49%;
  }

  .info_cont {
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    width: 100%;
    height: 50vh;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    overflow: auto;
  }

  .info_cont_column {
    width: 60%;
  }

  .info_cont_column>a {
    padding: 1vw;
    font-size: 1vw;
  }

  .info_cont_column>p {
    line-height: 1.5em;
    font-size: 1vw;
    text-align: justify;
  }

  .info_cont>img, .info_cont>iframe {
    margin-bottom: 0vw;
    float: left;
    width: 40%;
    margin-right: 2vw;
    display: flex;
  }

  .info_cont>p {
    line-height: auto;
    font-size: .8vw;
    margin-bottom: 0;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    display: flex;
    flex-direction: row;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: 49%;
  }

  .info_cont>.column_start>iframe {
    width: 100%;
  }

  .info_cont>.column_start>a {
    font-size: 1vw;
    width: 100%;
    margin-bottom: 2vh;
    padding: 1vw;
  }

  .img_cont, .vid_cont {
    width: 33.3%;
    margin-bottom: 2vw;
  }

  .img_cont>h1, .vid_cont>h1 {
    font-size: 1vw;
    margin-bottom: 1vw;
  }

  .img_cont>img, .vid_cont>iframe {
    border: 0;
    width: 90%;
    height: 11vw;
  }

  .soils_map {
    width: 50vw;
    height: 70vh;
    margin-bottom: 0;
  }

  #address_search {
    font-size: 1vw;
    margin-bottom: 2vh;
    width: 50vw
  }

  #address_search h2 {
    font-size: 1vw;
    margin-bottom: 0vh;
  }

  #address_search>.addr_search_opt {
    width: 75%;
  }

  #address_search>.addr_search_opt>input {
    padding: .5vw;
  }

  #address_search>.addr_search_opt>button {
    padding: .5vw;
    font-size: .75vw;
    margin-left: 0.5vw;
  }

  #map-canvas {
    height: 50vh;
    width: 50vw;
  }

  #sizing_map_btns {
    width: 50vw;
  }

  #sizing_map_btns>button {
    padding: 1vw;
    font-size: 1vw;
  }

  #sizingResultsArea {
    width: 50vw;
    padding: 1vw;
  }

  #sizingResultsArea>div>h2 {
    font-size: 1vw;
    margin-bottom: .5vh;
  }

  #measuredAreaMap,
  #suggestedRainGardenArea {
    color: #AB142C;
    font-size: 1.5vw;
    font-weight: 600;
  }

  .ack_cont, .priv_cont, .how_cont {
    max-height: 75vh;
    padding: 1vw;
    padding-top: 30vw;
    border: 2px solid lightgray;
    border-radius: 5px;
    width: 60vw;
    padding-bottom: 1vw;
    overflow: auto;
  }

  .how_cont {
    padding-top: 0vw;
  }

  .ack_cont {
    padding-top: 40vw;
  }

  .ack_cont>p, .priv_cont>p, .how_cont>p {
    padding-top: 2vw;
    font-size: .85vw;
    margin-bottom: 1vw;
  }

  .ack_cont>div, .priv_cont>div, .how_cont>div {
    width: 100%;
  }

  .ack_cont>div>img {
    width: 24%;
  }

  .gray_banner>p {
    font-size: 1vw;
  }

  .gray_banner select {
    padding: 1vw 1vw;
    font-size: 1vw;
  }

  .calc_note {
    padding: 0vw 1vw 1vw 1vw;
  }

  .calc_note p {
    font-size: 0.75vw;
  }

  #calculation_banner {
    display: flex;
    justify-content: space-between;
    margin-top: auto;
    margin-bottom: auto;
  }
  
  #calculation_banner button {
    height: fit-content;
    border-radius: 100%;
    padding: 0% 1.7%;
    border: none;
    color: #21a662;
    font-size: 2vw;
  }

  .button_row {
    margin-top: 1vh;
    width: 50vw;
  }

  .button_row a {
    width: 24%;
    transition: 0.2s ease;
  }

  .button_row button {
    width: 24%;
    padding: 1vw;
    font-size: 1vw;
    transition: 0.2s ease;
  }

  .button_row button:hover {
    cursor: pointer;
    transform: rotate(-2deg);
    background: rgba(57, 154, 181, 0.69);
  }

  .rain_gardens {
    width: 50%;
    overflow-y: auto;
    padding: .25vw;
    padding-top: .75vw;
    padding-bottom: .75vw;
    justify-content: flex-start;
  }

  .rain_gardens>div {
    border-top: .5vw solid #B54542;
    box-shadow: 0px 0px 10px lightgray;
    border-left: 0;
    align-items: center;
    justify-content: center;
    width: 10vw;
    height: 10vw;
    margin-left: 0.5vw;
    margin-right: 0.5vw;
    margin-bottom: 1vw;
    transition: 0.2s ease;
  }

  .rain_gardens>div:last-of-type {
    margin-right: 0;
  }

  .rain_gardens>div:first-of-type:hover {
    cursor: pointer;
    transition: 0.2s ease;
    border-radius: 10px;
    transform: translateY(-5%);
  }

  .rain_gardens>div:not(.add_rg):hover {
    cursor: pointer;
    color: #7BAE18;
    border-top-color: #7BAE18;
    transition: 0.2s ease;
    transform: translateY(-5%);
  }

  .rain_gardens>.add_rg>h2 {
    font-size: 3vw;
  }

  .name_modal {
    padding: 25vw;
    background: rgba(255, 255, 255, 0.95)
  }

  .name_modal>img {
    width: 3vw;
    margin-bottom: 15vh;
  }

  .name_modal>h3 {
    margin-bottom: 5vh;
    font-size: 1.5vw;
  }

  .name_modal>div>input {
    width: 78%;
    font-size: 1vw;
    padding: 1vw;
  }

  .name_modal>div>button {
    width: 20%;
    padding: 1vw;
    font-size: 1vw;
    transition: 0.2s ease;
  }

  .name_modal>div>button:hover {
    cursor: pointer;
    transition: 0.2s ease;
    color: #7BAE18;
    outline: .25vw solid #7BAE18;
    outline-offset: -.125vw;
    background: white;
  }

  .rain_garden_options {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 60vw;
  }

  .rain_garden_options>div:not(.input_row) {
    padding: 1vw;
    border-left: .5vw solid #B54542;
    box-shadow: 0px 3px 10px lightgray;
    width: 19vw;
    margin-bottom: 1vw;
    transition: .2s ease;
  }

  .rain_garden_options>.input_row {
    margin-bottom: 4vh;
    align-items: baseline;
    justify-content: center;
    width: 100%;
  }

  .rain_garden_options>.input_row>h2 {
    font-size: 1.5vw;
    margin: 0;
    padding: 0;
  }

  .rain_garden_options>.input_row>input {
    font-size: 1.5vw;
    padding: .25vw .75vw;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
    border-bottom-width: .25vw;
    margin-left: 1vw;
  }

  .rain_garden_options>div:not(.input_row)>img {
    width: 3vw;
    margin-right: 1vw;
    transition: 0.2s ease;
  }

  .rain_garden_options>div:not(.input_row)>h3 {
    transition: 0.2s ease;
  }

  .rain_garden_options>div:not(.input_row):hover {
    cursor: pointer;
    border-radius: 5px;
    box-shadow: 0px 3px 6px gray;
    transform: translate(0vw, -.5vw);
    transform: rotate(-2deg);
    background: #B54542;
  }

  .rain_garden_options>div:not(.input_row):hover>img {
    transform: rotate(-15deg);
    background: white;
    padding: 0.5vw;
    border-radius: 5px;
  }

  .rain_garden_options>div:not(.input_row):hover>h3 {
    width: 100%;
    color: white;
    margin-left: .25vw;
  }

  .sizeloc_bar, .plantlist_bar, .reminders_bar {
    width: 30vw;
    height: 100vh;
    right: -30vw;
    border-top: 0;
    border-left: .5vw solid #7BAE18;
    border-bottom: 0;
    padding: 2vw;
    opacity: 0;
    display: none;
    z-index: 1;
  }

  .sizeloc_bar>h3, .plantlist_bar>h3, .reminders_bar>h3 {
    text-transform: uppercase;
    color: #B54542;
    font-size: 1.5vw;
  }

  .sizeloc_bar>.content, .plantlist_bar>.content, .reminders_bar>.content {
    padding-top: 3vw;
    padding-bottom: 3vw;
  }

  .sizeloc_bar>.btns>button, .reminders_bar>.btns>button, .plantlist_bar>.btns>button {
    width: 45%;
    padding-top: 1vw;
    padding-bottom: 1vw;
    font-size: 1vw;
    letter-spacing: .0625vw;
    transition: 0.2s ease;
  }

  .sizeloc_bar>.btns>button:hover, .reminders_bar>.btns>button:hover, .plantlist_bar>.btns>button:hover {
    cursor: pointer;
    background: white;
    box-shadow: 0px 3px 6px gray;
    color: #4C6C0E;
  }

  .sizeloc_bar>.btns>button:first-of-type:hover, .reminders_bar>.btns>button:first-of-type:hover, .plantlist_bar>.btns>button:first-of-type:hover {
    color: #B91818;
  }

  .sizeloc_bar>.content>div>.row_between {
    margin-bottom: 0vw;
  }

  .sizeloc_bar>.content>div>.row_between>h3 {
    font-size: 1vw;
  }

  .sizeloc_bar>.content>div>.row_between>input {
    padding: 1vw;
    width: 100%;
    font-size: 1vw;
  }

  .sizeloc_bar>.content>div>button, .plantlist_bar>.content>div>button {
    width: 100%;
    padding: .75vw .25vw;
    font-size: 1vw;
    margin-bottom: .5vw;
  }

  .sizeloc_bar>.content>div {
    margin-bottom: 3vw;
  }

  .sizeloc_bar>.content>button {
    margin-top: .5vw;
    margin-bottom: 0vw;
    padding: .75vw .25vw;
    font-size: 1vw;
  }

  .sizeloc_bar>.content>button:last-of-type {
    background: #a12517;
  }

  .plantlist_bar table>tr>td:first-of-type img {
    width: 6vw;
  }

  .plantlist_bar table>tr>td>h1 {
    font-size: 1vw !important;
    padding: .5vw;
  }

  .plantlist_bar table>tr>td:last-of-type {
    font-size: .8vw;
  }

  .sizing_banner {
    width: 50vw;
    padding: 1.5vw;
  }

  .sizing_calc_opts {
    width: 50vw;
  }

  .gray_banner {
    width: 50vw;
    padding: 1vw;
  }

  .sc_options {
    width: 50vw;
  }

  .sc_options>.option {
    width: 100%;
    padding: 1vw;
  }

  .sc_options>.option>p {
    width: 80vw;
    margin-right: 5vw;
    font-size: 1vw;
  }

  .sc_options>.option>input {
    font-size: 1vw;
    width: 100%;
  }

  .scd_options {
    width: 50vw;
    /*box-shadow: 0px 3px 6px lightgray;*/
  }

  .scd_options>.option {
    width: 100%;
    padding: 1vw;
  }

  .scd_options>.option>p {
    width: 45%;
    margin-right: 5vw;
    font-size: 1vw;
  }

  .scd_options>.option>div {
    width: 70%;
  }

  .scd_options>.option>div>input[type="range"] {
    width: 90%;
  }

  .scd_options>.option>div>input[type="number"] {
    width: 30%;
    font-size: 1vw;
    margin-left: 5vw;
  }

  .scd_options>.option>div>select {
    padding: .5vw;
    font-size: 1vw;
    box-shadow: 0px 3px 10px lightgray;
    border-radius: 5px;
  }

  .calculated_surface_area {
    width: 50vw;
    padding: 1vw;
  }

  .calculated_surface_area>p>span {
    font-size: 1.5vw;
    font-weight: 700;
  }

  .checkboxes {
    width: 100%;
  }

  .checkboxes>div {
    padding: 1vw;
    width: 100%;
  }

  .checkboxes>div>strong {
    padding-bottom: 1vw;
    margin-bottom: 2vh;
    font-size: .8vw;
  }

  .checkboxes>div>label {
    margin-bottom: 1vh;
    font-size: .8vw;
  }

  .checkboxes>div>label>input {
    margin-right: 1vw;
    --size: .8vw;
    width: var(--size);
    height: var(--size);
  }

  .submit_plant_query {
    width: min-content;
    align-self: center;
    padding: 1vw 3vw;
    border-radius: 5px;
    margin-top: 1vw;
    font-size: 1vw;
  }

  .filtered_plant_results {
    width: 85%;
    height: 65vh;
    overflow: auto;
  }

  .filtered_plant_results tr>td>img {
    width: 6vw;
    height: 6vw;
  }

  .filtered_plant_results tr>td {
    font-size: .8vw;
    padding: 0.5vw
  }

  .filtered_plant_results tr>td>div>h2 {
    font-weight: 600;
    margin: 0;
    padding: 0;
    font-size: 1vw;
    margin-bottom: .5vh;
  }

  .filtered_plant_results tr>td>div>p {
    font-size: .8vw;
    font-style: italic;
  }

  .plantlist_bar tr>td>img {
    width: 6vw;
    height: 6vw;
  }

  .plant_details {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .plant_details>h1 {
    font-size: 1vw;
    margin-top: 1vh;
    font-weight: 500;
  }

  .plant_details img {
    margin-top: 3vh;
    box-shadow: 0px 3px 6px gray;
    width: 300px;
  }

  .plant_details>div {
    margin-top: 3vh;
  }

  .plant_details .width_height {
    flex-direction: row;
    margin-top: 3vh;
    justify-content: center;
  }

  .plant_details>.width_height>div {
    padding: 1vw;
    text-align: center;
    width: max-content;
    color: white;
  }

  .plant_details .width_height>div:nth-child(1) {
    background: rgb(123, 173, 24, 1);
  }

  .plant_details .width_height>div:nth-child(2) {
    background: rgb(123, 173, 24, 1);
    margin-left: .5vw;
    margin-top: 0;
  }

  .plant_details div h2 {
    font-size: .8vw;
    text-align: center;
    font-weight: 500;
  }

  .plant_details div h1 {
    font-size: 1vw;
  }

  .plant_details>p {
    font-size: .8vw;
  }

  .plant_details>small {
    font-size: .9vw;
  }

  .plant_details>.shade_sun>.shade_sun_res>div {
    margin-left: 2vw;
    margin-right: 2vw;
  }

  .plant_details>.shade_sun>.shade_sun_res>div>img {
    width: 4vw;
    box-shadow: 0px 0px transparent;
    height: 4vw;
  }

  .plant_details>.shade_sun>.shade_sun_res>div>p{
    font-size: .8vw;
  }

  .save_btn_plants{
    width: 65%;
    font-size: 1vw;
    padding: 1vw 0vw;
    left: 29.5%;
    margin-top:0;
  }

  .sizing_map_text{
    width: 50vw;
  }
}

@media screen and (orientation:landscape) {
  .sizing_map_text {
    padding-bottom: 10vh;
}
  #address_search{
    min-height:100px;
  }
  #sizing_map_btns{
    min-height:20px;
  }
  #sizingResultsArea{
    min-height:130px;
  }
  .sidebar{
    height: initial;
  }
}