edits for mobile tooltip view

src/components/BeeswarmChart.vue

@@ -2,7 +2,7 @@
   <section id="beeswarm">
     <div id="text1" class="text-container">
       <p>
-        Everyone needs access to clean water. The gap between water security and <span class="tooltip-group"><span class="tooltip-span"> water insecurity </span><span class="tooltiptext" > Populations cannot maintain access to adequate quantities of water at an acceptable quality to sustain livelihoods, development, and human and ecosystem health.</span></span> can be the difference between a daydream and a nightmare. People may be more or less vulnerable to water insecurity due to  
+        Everyone needs access to clean water. The gap between water security and <span class="tooltip-group"><span class="tooltip-span"> water insecurity </span><span class="tooltiptext"> Populations cannot maintain access to adequate quantities of water at an acceptable quality to sustain livelihoods, development, and human and ecosystem health.</span></span> can be the difference between a daydream and a nightmare. People may be more or less vulnerable to water insecurity due to  
         <span 
           :class="['highlight', 'Demographiccharacteristics', { checked: isChecked.Demographiccharacteristics }]" 
           @click="toggleCategory('Demographiccharacteristics')"
@@ -483,8 +483,7 @@ $ThemeGrey: rgba(217, 217, 217, 0.95);
   pointer-events: none; 
   width: 100%; 
   height: 70px;
-  text-align: center;
-
+  text-align: center
 }
 
 .hidden {
@@ -568,7 +567,7 @@ $ThemeGrey: rgba(217, 217, 217, 0.95);
 
 .tooltiptext {
   visibility: hidden;
-  width: 200px;
+  width: 100px;
   background-color: #555;
   color: #fff;
   text-align: center;
@@ -576,7 +575,7 @@ $ThemeGrey: rgba(217, 217, 217, 0.95);
   padding: 5px;
   position: absolute;
   z-index: 1;
-  margin-left: -170px;
+  margin-left: -120px;
   margin-top: 2rem;
   opacity: 0;
   transition: opacity 0.3s;

src/components/Conclusion.vue

@@ -61,18 +61,15 @@
   padding: 5px;
   position: absolute;
   z-index: 1;
-  // bottom: 100%;
-  // left: 50%;
-  // transform: translateX(-50%);
-  margin-left: -170px;
+  margin-left: -120px;
   margin-top: 2rem;
   opacity: 0;
   transition: opacity 0.3s;
 }
 
 .meta-analysis {
-  width: 400px;
-  margin-left: -270px;
+  width: 200px;
+  margin-left: -80px;
 }
 
 .tooltip:hover .tooltiptext {

src/components/Maps.vue

@@ -11,7 +11,7 @@
         <div class="panel households-panel">
           <p v-html="mapText.paragraph1"></p>
           <img src="@/assets/images/avg_household_size_2022.png" alt="Choropleth map of average household size, of occupied housing units, at the county-level across the contiguous U.S.. The greatest percent of average housing size were in Oglala Lakota County, South Dakota (5), Madison County, Idaho (3.9) and Todd County, South Dakota (3.8) (U.S. Census Bureau, 2022).">
-          <figcaption><span class="tooltip"><span class="tooltip-span">Choropleth map</span><span class="tooltiptext">Type of map that displays divided geographical areas or regions that are coloured, shaded or patterned in relation to a data variable. This provides a way to visualise values over a geographical area, which can show variation or patterns across the displayed location.</span></span> of average household size, of occupied housing units, at the county-level across the contiguous U.S.. The greatest percent of average housing size were in Oglala Lakota County, South Dakota (5), Madison County, Idaho (3.9) and Todd County, South Dakota (3.8) <a href='https://www.census.gov/data/developers/data-sets/acs-5year.html' target='_blank'>(U.S. Census Bureau, 2022).</a></figcaption>
+          <figcaption><span class="tooltip"><span class="tooltip-span">Choropleth map</span><span class="tooltiptext">Type of map that displays divided geographical areas or regions that are coloured, shaded or patterned in relation to a data variable. This provides a way to visualise values over a geographical area, which can show variation or patterns across the displayed location.</span></span> of average household size, of occupied housing units, at the county-level across the contiguous U.S.. The greatest percent of occupied housing units were in Dakota County, Minnesota (97.3%), Lincoln County, South Dakota (97.3%) and Scott County, Minnesota (97%) <a href='https://www.census.gov/data/developers/data-sets/acs-5year.html' target='_blank'>(U.S. Census Bureau, 2022).</a></figcaption>
         </div>
 
         <button class="accordion latino-accordion">Hispanic populations<span class="symbol">+</span></button>