Fixed Bug where p tags had descendents

src/components/Home.js

@@ -6,12 +6,12 @@ const Home = (props) => {
   document.title = "Welcome to my Portfolio";
   const title = "Welcome to my Portfolio";
   const description = 
-    <p>
+    <div>
       This website helps you access the projects that I've worked on. You can navigate
       at the top to different locations in the site. Within you can find information about me,
       my github repositories, and some youtube videos I've posted. This website is coded with
       React/Redux and hosted over Vercel. You can email me at <a href="mailto:camerin@camsprojects.online">camerin@camsprojects.online</a>.
-    </p>;
+    </div>;
 
   return (
     <div className="Home">

src/components/Theater.js

@@ -8,9 +8,9 @@ const Theater = (props) => {
             <div className="theater-bg" style={props.background ? {backgroundImage: `url(${props.background})`} : {}}/>
             <div className="theater-content">
                 <h1>{props.title}</h1>
-                <p>
+                <div className="description">
                     {props.description}
-                </p>
+                </div>
             </div>
         </div>
         

src/components/css/Theater.css

@@ -43,10 +43,19 @@
     align-items: center;
 }
 
-.theater-content p,h1 {
+.theater-content .description, .theater-content h1 {
     width: 50vw;
 }
+.theater-content .description {
+    padding: 10px;
+}
 
 .theater-content a {
     color: #CFCFBA !important;
+}
+
+@media only screen and (max-width: 600px) {
+    .theater-content .description {
+        width: 80vw;
+    }
 }