Rushil and Christina need to give a pic and quote

pages/static/pages/css/styles.css

@@ -8,6 +8,26 @@ html {
   overflow-x: hidden;
 }
 
+.person_cont {
+    text-align: center;
+    margin: 20px;
+}
+
+.photo {
+    width: 300px;
+    margin: 15px;
+    border-radius: 10px;
+    box-shadow: 12px 12px rgb(0, 0, 0, 0.1), -12px -12px rgb(0, 0, 0, 0.3);
+}
+
+.council h2{
+    text-align: center;
+}
+
+.details p a {
+    font-size: 25px;
+}
+
 .border-sides {
     border: 0px !important;
     border-left: 1px solid gray !important;

pages/templates/pages/council.html

@@ -11,9 +11,82 @@
 </div>
 <hr>
 <div class="council container">
-    <h3 class="display-6">Our Mission</h3>
+    <h2 class="display-6">Our Mission</h2>
     <p>Some description of what we do</p>
-    <h6>Our Team</h6>
-    <p>pics, description, role, and quote, of every class council member</p>
 </div>
+<hr>
+<div class="council">
+    <h2>Our Team</h2>
+    <br><br>
+    <div class="person_cont">
+        <img src="{% static 'pages/css/img/vinay.png' %}" class="photo">
+        <div class="details">
+            <h3><b>The President</b></h3>
+            <p><a>Vinay Ayala</a><br>
+                <i>“Live life to the fullest.”</i>
+            </p>
+        </div>
+    </div>
+    <br><br>
+    <div class="person_cont">
+        <img src="{% static 'pages/css/img/chinmay.png' %}" class="photo">
+        <div class="details">
+            <h3><b>The Vice President</b></h3>
+            <p><a>Praneeth Chinmay Bhandaru</a><br>
+                <i>“You don't need to be a potato to be good in life, all you need to do is trust yourself.”</i>
+            </p>
+        </div>
+    </div>
+    <br><br>
+    <div class="person_cont">
+        <img src="{% static 'pages/css/img/grace.png' %}" class="photo">
+        <div class="details">
+            <h3><b>The Treasurer</b></h3>
+            <p><a>Grace Guan</a><br>
+                <i>“I'm excited to serve again as a member of your class clowncil!”</i>
+            </p>
+        </div>
+    </div>
+<br><br>
+    <div class="person_cont">
+        <img src="{% static 'pages/css/img/christina.png' %}" class="photo">
+        <div class="details">
+            <h3><b>The Secretary</b></h3>
+            <p><a>Christina Han</a><br>
+                <i>“Needs a Quote”</i>
+            </p>
+        </div>
+    </div>
+<br><br>
+    <div class="person_cont">
+        <img src="{% static 'pages/css/img/yulee.png' %}" class="photo">
+        <div class="details">
+            <h3><b>Senator</b></h3>
+            <p><a>Yulee Kang</a><br>
+                <i>“Is a Cutie :)”</i>
+            </p>
+        </div>
+    </div>
+<br><br>
+    <div class="person_cont">
+        <img src="{% static 'pages/css/img/rushil.png' %}" class="photo">
+        <div class="details">
+            <h3><b>Senator</b></h3>
+            <p><a>Rushil Umaretiya </a><br>
+                <i>“Needs a quote”</i>
+            </p>
+        </div>
+    </div>
+<br><br>
+    <div class="person_cont">
+        <img src="{% static 'pages/css/img/katelyn.png' %}" class="photo">
+        <div class="details">
+            <h3><b>The Historian</b></h3>
+            <p><a>Katelyn Chen</a><br>
+                “&#127345;&#65039;&#127358;&#65039;&#128200;&#127883;”
+            </p>
+        </div>
+    </div>
+</div>
+<br><br><br><br>
 {% endblock content %}