diff --git a/static/css/achievement.css b/static/css/achievement.css
index d35d4b65..c198a613 100644
--- a/static/css/achievement.css
+++ b/static/css/achievement.css
@@ -1,10 +1,14 @@
-.achievement .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
+.achievement .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark .achievement .d-flex h2 {
+  color: white;
 }
 
 /*--------------------------------------------------------------
@@ -32,11 +36,11 @@ section {
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.25);
 }
 
-.services .icon-box:hover{
+.services .icon-box:hover {
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.5);
 }
 
-.services .icon-box:hover h4{
+.services .icon-box:hover h4 {
   /* background: #2b2b2b; */
   color: #db1515;
 }
@@ -46,10 +50,10 @@ section {
   font-weight: 650;
   margin-bottom: 10px;
   font-size: 18px;
-  color: #16324f;
+  color: #3975b5;
   transition: 0.3s;
   text-align: center;
-  font-family: "Poppins",sans-serif;
+  font-family: "Poppins", sans-serif;
   line-height: 1.2em;
   letter-spacing: 0.05em;
   word-spacing: 0.2em;
@@ -64,23 +68,23 @@ section {
   font-weight: 600;
 }
 
-.services .icon-box p>a {
-    color: #EC3134;
-    /* font-weight: 600; */
+.services .icon-box p > a {
+  color: #ec3134;
+  /* font-weight: 600; */
 }
 
-.services .bg-dark{
-    font-family: "Montserrat",sans-serif;
-    font-weight: 600;
-    font-size: 1.2em;
+.services .bg-dark {
+  font-family: "Montserrat", sans-serif;
+  font-weight: 600;
+  font-size: 1.2em;
 }
 
-.achievement h4{
-    color: #16324f;
+.achievement h4 {
+  color: #3975b5;
   font-weight: 800;
   font-family: "Montserrat", sans-serif;
   font-size: 1.4em;
   word-spacing: 5px;
   letter-spacing: 2px;
   line-height: 180%;
-}
\ No newline at end of file
+}
diff --git a/static/css/alumni.css b/static/css/alumni.css
index 28ad06d7..f3c82097 100644
--- a/static/css/alumni.css
+++ b/static/css/alumni.css
@@ -1,161 +1,167 @@
 /*--------------------------------------------------------------
 # Alumini
 --------------------------------------------------------------*/
-.title .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
-  
-  [data-toggle="collapse"] i:before {
-    content: "\f068";
+.title .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark .title .d-flex h2 {
+  color: white;
+}
+
+[data-toggle="collapse"] i:before {
+  content: "\f068";
 }
 [data-toggle="collapse"].collapsed i:before {
-    content: "\f067";
+  content: "\f067";
 }
 #accordion .card-header {
-    margin-bottom: 12px;
+  margin-bottom: 12px;
 }
 #accordion .accordion-title {
-    position: relative;
-    display: block;
-    padding: 14px 0 14px 50px;
-    background: #1b1b1b;
-    border-radius: 8px;
-    overflow: hidden;
-    text-decoration: none;
-    color: #fff;
-    font-size: 22px;
-    font-weight: 700;
-    width: 100%;
-    text-align: left;
-    transition: all 0.4s ease-in-out;
+  position: relative;
+  display: block;
+  padding: 14px 0 14px 50px;
+  background: #1b1b1b;
+  border-radius: 8px;
+  overflow: hidden;
+  text-decoration: none;
+  color: #fff;
+  font-size: 22px;
+  font-weight: 700;
+  width: 100%;
+  text-align: left;
+  transition: all 0.4s ease-in-out;
 }
 #accordion .accordion-title i {
-    position: absolute;
-    width: 40px;
-    height: 100%;
-    left: 0;
-    top: 0;
-    color: #fff;
-    background: radial-gradient(rgba(27, 27, 27, .8), #1b1b1b);
-    text-align: center;
-    border-right: 1px solid transparent;
+  position: absolute;
+  width: 40px;
+  height: 100%;
+  left: 0;
+  top: 0;
+  color: #fff;
+  background: radial-gradient(rgba(27, 27, 27, 0.8), #1b1b1b);
+  text-align: center;
+  border-right: 1px solid transparent;
 }
 #accordion .accordion-title:hover {
-    padding-left: 60px;
-    /* background: #e14143; */
-    color: #fff;
+  padding-left: 60px;
+  /* background: #e14143; */
+  color: #fff;
 }
 #accordion .accordion-title:hover i {
-    border-right: 1px solid #fff;
+  border-right: 1px solid #fff;
 }
 #accordion .accordion-body {
-    padding: 40px 55px;
+  padding: 40px 55px;
 }
 #accordion .accordion-body ul {
-    list-style: none;
-    margin-left: 0;
-    padding-left: 0;
+  list-style: none;
+  margin-left: 0;
+  padding-left: 0;
 }
 #accordion .accordion-body li {
-    padding-left: 1.2rem;
-    text-indent: -1.2rem;
+  padding-left: 1.2rem;
+  text-indent: -1.2rem;
 }
 #accordion .accordion-body li:before {
-    content: "\f10a";
-    padding-right: 5px;
-    font-family: "Flaticon";
-    font-size: 16px;
-    font-style: normal;
-    color: #213744;
+  content: "\f10a";
+  padding-right: 5px;
+  font-family: "Flaticon";
+  font-size: 16px;
+  font-style: normal;
+  color: #213744;
 }
 
 /* ------------------------- */
 
 .team .member {
-    margin-bottom: 20px;
-    overflow: hidden;
-    border-radius: 5px;
-    background: #fff;
-    background: #e03a3c;
-    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.3);
-  }
-.team .member:hover{
-    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.8);
-    transition: 0.3s;
-}
-  
-  .team .member .member-img {
-    position: relative;
-    overflow: hidden;
-  }
-  
-  .team .member .social {
-    position: absolute;
-    left: 0;
-    bottom: 30px;
-    right: 0;
-    opacity: 0;
-    transition: ease-in-out 0.3s;
-    text-align: center;
-  }
-  
-  .team .member .social a {
-    transition: color 0.3s;
-    color: #111111;
-    margin: 0 3px;
-    padding-top: 7px;
-    border-radius: 50px;
-    width: 36px;
-    height: 36px;
-    background: #e03a3c;
-    display: inline-block;
-    transition: ease-in-out 0.3s;
-    color: #fff;
-  }
-  
-  .team .member .social a:hover {
-    background: #111111;
-  }
-  
-  .team .member .social i {
-    font-size: 18px;
-  }
-  
-  .team .member .member-info {
-    padding: 20px 15px;
-  }
-  
-  .team .member .member-info h4 {
-    font-weight: 650;
-    margin-bottom: 5px;
-    font-size: 21px;
-    color: white;
-    letter-spacing: 1px;
-  }
-  
-  .team .member .member-info span {
-    display: block;
-    font-size: 14px;
-    font-weight: 400;
-    color: #efe2e2;
-  }
-  
-  .team .member .member-info p {
-    font-style: italic;
-    font-size: 14px;
-    line-height: 26px;
-    color: #777777;
-  }
-  
-  .team .member:hover .social {
-    opacity: 1;
-    bottom: 15px;
-  }
-  
-  
\ No newline at end of file
+  margin-bottom: 20px;
+  overflow: hidden;
+  border-radius: 5px;
+  background: #fff;
+  background: #e03a3c;
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.3);
+}
+.team .member:hover {
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.8);
+  transition: 0.3s;
+}
+
+.team .member .member-img {
+  position: relative;
+  overflow: hidden;
+}
+
+.team .member .social {
+  position: absolute;
+  left: 0;
+  bottom: 30px;
+  right: 0;
+  opacity: 0;
+  transition: ease-in-out 0.3s;
+  text-align: center;
+}
+
+.team .member .social a {
+  transition: color 0.3s;
+  color: #111111;
+  margin: 0 3px;
+  padding-top: 7px;
+  border-radius: 50px;
+  width: 36px;
+  height: 36px;
+  background: #e03a3c;
+  display: inline-block;
+  transition: ease-in-out 0.3s;
+  color: #fff;
+}
+
+.team .member .social a:hover {
+  background: #111111;
+}
+
+.team .member .social i {
+  font-size: 18px;
+}
+
+.team .member .member-info {
+  padding: 20px 15px;
+}
+
+.team .member .member-info h4 {
+  font-weight: 650;
+  margin-bottom: 5px;
+  font-size: 21px;
+  color: white;
+  letter-spacing: 1px;
+}
+
+.team .member .member-info span {
+  display: block;
+  font-size: 14px;
+  font-weight: 400;
+  color: #efe2e2;
+}
+
+.team .member .member-info p {
+  font-style: italic;
+  font-size: 14px;
+  line-height: 26px;
+  color: #777777;
+}
+
+.team .member:hover .social {
+  opacity: 1;
+  bottom: 15px;
+}
+
+.card {
+  background: transparent;
+}
diff --git a/static/css/avishkar.css b/static/css/avishkar.css
index 72ef526d..221143b4 100644
--- a/static/css/avishkar.css
+++ b/static/css/avishkar.css
@@ -1,48 +1,50 @@
 .container {
   font-family: "Poppins", sans-serif;
-
 }
 
-#avishkar .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
+#avishkar .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
   letter-spacing: 2px;
   line-height: 180%;
   /* border-bottom:#e03a3c 5px solid; */
 }
-.title{
-  border-bottom:#e03a3c 5px solid;
+
+.dark #avishkar .d-flex h2 {
+  color: white;
 }
-.full-form{
+
+.title {
+  border-bottom: #e03a3c 5px solid;
+}
+.full-form {
   text-align: center;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
   margin-right: auto;
 }
-.logo{
+.logo {
   max-height: 73px;
   margin-right: auto;
 }
-@media(min-width: 576px) and (max-width: 767px)
-{
-  .logo{
+@media (min-width: 576px) and (max-width: 767px) {
+  .logo {
     /* display: none; */
     max-height: 64px;
     margin-right: 0px;
   }
-  .title{
+  .title {
     margin-left: 7px;
     border-bottom: transparent;
   }
 }
-@media(max-width: 557px)
-{
-  .logo{
+@media (max-width: 557px) {
+  .logo {
     /* display: none; */
     max-height: 64px;
     margin-right: 0px;
   }
-  .title{
+  .title {
     margin-left: 9px;
     border-bottom: transparent;
   }
@@ -57,6 +59,10 @@
   position: relative;
 }
 
+.dark .events .card {
+  background-color: #1b1b1b;
+}
+
 .events .card-img {
   width: calc(100% + 60px);
   margin-left: -30px;
@@ -80,6 +86,10 @@
   transition: 0.3s;
 }
 
+.dark .events .card-body {
+  background-color: black;
+}
+
 .events .card-title {
   font-weight: 700;
   text-align: center;
@@ -95,6 +105,10 @@
   color: #5e5e5e;
 }
 
+.dark .events .card-text {
+  color: whitesmoke;
+}
+
 .events .read-more a {
   color: #777777;
   text-transform: uppercase;
@@ -104,7 +118,7 @@
 }
 
 .events .read-more a:hover {
-  color:#db1515;
+  color: #db1515;
 }
 
 .events .card:hover img {
@@ -115,7 +129,7 @@
   border-color: #db1515;
 }
 
-.events .card:hover .card-body .card-title{
+.events .card:hover .card-body .card-title {
   color: #db1515;
 }
 
@@ -125,10 +139,10 @@
 
 /* Horizontal line */
 .collapsible-link::before {
-  content: '';
+  content: "";
   width: 14px;
   height: 2px;
-  background: #333;
+  background: white;
   position: absolute;
   top: calc(50% - 1px);
   right: 1rem;
@@ -138,10 +152,10 @@
 
 /* Vertical line */
 .collapsible-link::after {
-  content: '';
+  content: "";
   width: 2px;
   height: 14px;
-  background: #333;
+  background: white;
   position: absolute;
   top: calc(50% - 7px);
   right: calc(1rem + 6px);
@@ -149,16 +163,16 @@
   transition: all 0.3s;
 }
 
-.collapsible-link[aria-expanded='true']::after {
+.collapsible-link[aria-expanded="true"]::after {
   transform: rotate(90deg) translateX(-1px);
 }
 
-.collapsible-link[aria-expanded='true']::before {
+.collapsible-link[aria-expanded="true"]::before {
   transform: rotate(180deg);
 }
 
 .accordion .card-header a {
-  color: #37423b;
+  color: white;
   transition: 0.3s;
 }
 .accordion .card-body a {
@@ -166,7 +180,17 @@
   transition: 0.3s;
 }
 
-.accordion .card a:hover{
+.accordion .card a:hover {
   color: #db1515;
   text-decoration: none;
 }
+
+.dark .accordion .card {
+  background-color: #1b1b1b;
+}
+
+.dark #headingOne,
+.dark #headingTwo,
+.dark #headingThree {
+  background-color: #1b1b1b !important;
+}
diff --git a/static/css/blog.css b/static/css/blog.css
index e77b5c40..8d92a192 100644
--- a/static/css/blog.css
+++ b/static/css/blog.css
@@ -1,128 +1,130 @@
- #blog .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid;
-    margin-bottom: 0%;
-  }
+#blog .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+  margin-bottom: 0%;
+}
+
+#blog .d-flex h2 {
+  color: white;
+}
 
 .card {
-      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
-      border: none;
-      margin-bottom: 50px;
-      overflow: hidden;
-      max-height: 520px;
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+  border: none;
+  margin-bottom: 50px;
+  overflow: hidden;
+  max-height: 520px;
 }
 
-.card-image{
+.card-image {
   transition: transform 0.3s;
   overflow: hidden;
   z-index: 2;
-      /* width: 350px;*/
-      height: 315px;
+  /* width: 350px;*/
+  height: 315px;
 }
-  
-    .card-body{
-      transition: height 0.4s;
-      overflow: hidden;
-      z-index: 2;
-      /* transition: all ease-in-out 1s; */
-    }
-
-    .card img{
-      width: 100%;
-      height: 100%;
-    }
-    
-    .card-title{
-      color: #e03a3c;
-      font-weight: bold;
-      font-family: "Roboto", sans-serif;
-      word-spacing: 10px;
-      letter-spacing: 2px;
-      line-height: 180%;
-    }
-
-    .card:hover{
-      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6);
-    }
-    
-    .card:hover .card-body{
-      transform: translateY(-150%);
-      /* height: 100%; */
-    }
-  
-    .card:hover .card-title{
-      border-bottom: 2px solid #e03a3c;
-    } 
-    
-    .card:hover .card-image{
-      transform: translateY(-320px);
-    } 
-
-    .card:hover .card-text{
-      display: block;
-    }
-    
-     #blog a, a:hover{
-      text-decoration: none;
-      color: #212529;
-    } 
-     
-    #blog .badge{
-      color: white;
-    }
-     
-    .card-text{
-      display: none; 
-    overflow: hidden;
-    transition: display 0.5s;
-    transition-timing-function: ease-in-out;
-    transition-delay: 1s;
-      font-size: 15px;
-    }
 
-  
-    
-    .text-muted i {
-      margin: 0 10px;
-    }
-
-    .blog-image img{
-      max-width: 50%;
-      height: 100%;
-    }
-    
-    .blog-image iframe{
-      overflow: hidden;
-  }
-  
-#blog-detail .d-flex h3{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid;
-    margin-bottom: 0%;
-    }
+.card-body {
+  transition: height 0.4s;
+  overflow: hidden;
+  z-index: 2;
+  /* transition: all ease-in-out 1s; */
+}
 
-.end{
-    text-align: center;
+.card img {
+  width: 100%;
+  height: 100%;
 }
 
+.card-title {
+  color: #e03a3c;
+  font-weight: bold;
+  font-family: "Roboto", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+}
+
+.card:hover {
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6);
+}
+
+.card:hover .card-body {
+  transform: translateY(-150%);
+  /* height: 100%; */
+}
 
-.dot{
-    height: 15px;
-    width: 15px;
-    background-color:#e03a3c;
-    border-radius: 50%;
-    display: inline-block;
-    margin: 5px
+.card:hover .card-title {
+  border-bottom: 2px solid #e03a3c;
+}
+
+.card:hover .card-image {
+  transform: translateY(-320px);
+}
+
+.card:hover .card-text {
+  display: block;
+}
+
+#blog a,
+a:hover {
+  text-decoration: none;
+  color: #212529;
+}
+
+#blog .badge {
+  color: white;
+}
+
+.card-text {
+  display: none;
+  overflow: hidden;
+  transition: display 0.5s;
+  transition-timing-function: ease-in-out;
+  transition-delay: 1s;
+  font-size: 15px;
+}
+
+.text-muted i {
+  margin: 0 10px;
+}
+
+.blog-image img {
+  max-width: 50%;
+  height: 100%;
+}
+
+.blog-image iframe {
+  overflow: hidden;
+}
+
+#blog-detail .d-flex h3 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+  margin-bottom: 0%;
+}
+
+.end {
+  text-align: center;
+}
+
+.dot {
+  height: 15px;
+  width: 15px;
+  background-color: #e03a3c;
+  border-radius: 50%;
+  display: inline-block;
+  margin: 5px;
 }
 
 /* #intro {
@@ -139,23 +141,23 @@
   display: block;
 } */
 
-.blog-form .container{
-  border: 1px solid  #e9ecef;
+.blog-form .container {
+  border: 1px solid #e9ecef;
   border-radius: 20px;
 }
 
-#blog-form .d-flex h2{
+#blog-form .d-flex h2 {
   color: #333;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
   margin-bottom: 0%;
-  }
+}
 
-#blog-form .form-group label{
+#blog-form .form-group label {
   margin-top: 15px;
   color: #e03a3c;
   font-style: italic;
@@ -165,16 +167,16 @@
   font-weight: 500;
 }
 
-.blog-form .form-control{
-  border-radius:1rem;
+.blog-form .form-control {
+  border-radius: 1rem;
 }
 
-.blog-form form{
+.blog-form form {
   padding-left: 2%;
   padding-right: 2%;
 }
 
-.blog-form .text-muted{
+.blog-form .text-muted {
   font-style: italic;
   font-size: 15px;
   margin-top: 0;
@@ -182,49 +184,48 @@
 }
 
 .blogbtn {
-    height: 45px;
-    margin: 3px;
-    border: none;
-    border-radius: 10px;
-    /* padding: 2%; */
-    background: #e03a3c;
-    font-weight: 600;
-    color: #fff;
-    font-style: italic;
-    cursor: pointer;
-    align-items: center; 
-}
-
-#postbtn{
+  height: 45px;
+  margin: 3px;
+  border: none;
+  border-radius: 10px;
+  /* padding: 2%; */
+  background: #e03a3c;
+  font-weight: 600;
+  color: #fff;
+  font-style: italic;
+  cursor: pointer;
+  align-items: center;
+}
+
+#postbtn {
   width: auto;
 }
 
-#writebtn{
+#writebtn {
   width: auto;
 }
 
-#updatebtn{
+#updatebtn {
   width: auto;
   display: inline-block;
   margin: 3px;
   background: grey;
 }
 
-#deletebtn{
+#deletebtn {
   width: auto;
   display: inline-block;
   margin: 3px;
 }
 
-.blogbtn:hover{
-  background: crimson !important; 
+.blogbtn:hover {
+  background: crimson !important;
 }
 
 /* .blog-form .btn{
   text-align: center;
 } */
 
-.vid{
+.vid {
   padding: 20px;
 }
- 
\ No newline at end of file
diff --git a/static/css/blogs.css b/static/css/blogs.css
index 2fa6d5c9..12c3772a 100644
--- a/static/css/blogs.css
+++ b/static/css/blogs.css
@@ -1,20 +1,24 @@
-#blog .d-flex h2{
+#blog .d-flex h2 {
   color: #333;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
   margin-bottom: 0%;
 }
 
+.dark #blog .d-flex h2 {
+  color: white;
+}
+
 .card {
   /* width: 350px; */
   height: 520px;
   background-color: #fff;
   background: linear-gradient(#f8f8f8, #fff);
-  box-shadow: 0 8px 16px -8px rgba(0,0,0,0.4);
+  box-shadow: 0 8px 16px -8px rgba(0, 0, 0, 0.4);
   border-radius: 6px;
   overflow: hidden;
   position: relative;
@@ -24,7 +28,7 @@
   max-height: 100vh;
 }
 
-.card-details h4{
+.card-details h4 {
   color: #e03a3c;
   /* font-weight: bold; */
   margin-left: 2px;
@@ -32,33 +36,33 @@
   font-family: "Poppins", sans-serif;
   word-spacing: 2px;
   letter-spacing: 1px;
-  
+
   /* line-height: 180%; */
 }
 
-.card:hover{
+.card:hover {
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6);
 }
 
-.card:hover .hover-part h2{
+.card:hover .hover-part h2 {
   border-bottom: 1px solid #e03a3c;
-} 
-
+}
 
- a, a:hover{
+a,
+a:hover {
   /* text-decoration: none; */
   color: #e03a3c;
-} 
+}
 
-.card-image{
+.card-image {
   transition: transform 0.3s;
   overflow: hidden;
   z-index: 2;
-      /* width: 350px;*/
-      height: 280px;
+  /* width: 350px;*/
+  height: 280px;
 }
 
-.card img{
+.card img {
   width: 100%;
   height: 92%;
 }
@@ -72,24 +76,23 @@
   height: 280px;
   width: 100%;
   /* background: linear-gradient(#dE685E, #EE786E); */
-  background-color: #F7F7F7;
+  background-color: #f7f7f7;
   transition: height 0.4s;
   overflow: hidden;
   z-index: 2;
 }
 
-
 .card:hover .hover-part {
   height: 100%;
   border-radius: 0 5px 5px 0;
 }
 
- .card .hover-part .card-image {
+.card .hover-part .card-image {
   /* height: 315px; */
   width: 100%;
   position: relative;
   float: left;
-} 
+}
 
 .card .hover-part .card-image::after {
   content: "";
@@ -98,7 +101,7 @@
   top: 10%;
   right: -2px;
   height: 80%;
-  border-left: 2px solid rgba(0,0,0,0.025);
+  border-left: 2px solid rgba(0, 0, 0, 0.025);
 }
 
 .card .hover-part .card-image img {
@@ -110,11 +113,11 @@
   text-transform: uppercase;
   /* font-size: 0.75em;
   font-weight: bold; */
-  /* background: rgba(0,0,0,0.15);
+/* background: rgba(0,0,0,0.15);
   padding: 0.125rem 0.75rem;
   border-radius: 100px; */
-  /* white-space: nowrap; */
-/* } */ 
+/* white-space: nowrap; */
+/* } */
 
 .card .hover-part .card-text {
   height: 240px;
@@ -127,7 +130,7 @@
   /* padding: 10px; */
 }
 
-.card-desc{
+.card-desc {
   padding: 10px;
 }
 
@@ -144,7 +147,7 @@
   /* line-height: 180%; */
 }
 
-.card .card-details{
+.card .card-details {
   display: inline-block;
 }
 
@@ -153,20 +156,18 @@
   /* color: #fff; */
   font-size: 0.9rem;
   align-items: center;
-
 }
 
 .card .card-details .detail span + span {
   float: right;
 }
 
-
 .card .card-details {
-  height:  240px;
+  height: 240px;
   width: 100%;
   position: absolute;
   bottom: 0;
-  left:  0;
+  left: 0;
   z-index: 1;
   box-sizing: border-box;
   /* padding: 1rem; */
@@ -181,7 +182,7 @@
   font-size: 0.7em;
 } */
 
-.card .card-desc p{
+.card .card-desc p {
   color: #000;
 }
 
@@ -190,55 +191,54 @@
   bottom: 1rem;
   right: 1rem;
   font-size: 0.9em;
-  color: #7F8389;
+  color: #7f8389;
 }
 
-#blog a, a:hover{
+#blog a,
+a:hover {
   text-decoration: none;
-  color: #6C757D;
-} 
+  color: #6c757d;
+}
 
 .text-muted i {
   margin: 0 10px;
 }
 
-#blog .badge{
+#blog .badge {
   color: white;
 }
- 
 
-.blog-image img{
+.blog-image img {
   max-width: 100%;
   height: auto;
 }
 
-.blog-image iframe{
+.blog-image iframe {
   overflow: hidden;
 }
 
-#blog-detail .d-flex h3{
-color: #333;
-font-weight: 600;
-font-family: "Poppins", sans-serif;
-word-spacing: 10px;
-letter-spacing: 2px;
-line-height: 180%;
-border-bottom:#e03a3c 3px solid;
-margin-bottom: 3%;
+#blog-detail .d-flex h3 {
+  color: #939393;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 3px solid;
+  margin-bottom: 3%;
 }
 
-.end{
-text-align: center;
+.end {
+  text-align: center;
 }
 
-
-.dot{
-height: 15px;
-width: 15px;
-background-color:#e03a3c;
-border-radius: 50%;
-display: inline-block;
-margin: 5px
+.dot {
+  height: 15px;
+  width: 15px;
+  background-color: #e03a3c;
+  border-radius: 50%;
+  display: inline-block;
+  margin: 5px;
 }
 
 /* #intro {
@@ -255,98 +255,98 @@ display: none;
 display: block;
 } */
 
-.blog-form .container{
-border: 1px solid  #e9ecef;
-border-radius: 20px;
-}
-
-#blog-form .d-flex h2{
-color: #333;
-font-weight: 600;
-font-family: "Poppins", sans-serif;
-word-spacing: 10px;
-letter-spacing: 2px;
-line-height: 180%;
-border-bottom:#e03a3c 5px solid;
-margin-bottom: 0%;
-}
-
-#blog-form label{
-margin-top: 15px;
-color: #e03a3c;
-font-style: italic;
-word-spacing: 10px;
-letter-spacing: 2px;
-font-size: 20px;
+.blog-form .container {
+  border: 1px solid #e9ecef;
+  border-radius: 20px;
+}
+
+#blog-form .d-flex h2 {
+  color: #939393;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+  margin-bottom: 0%;
+}
+
+#blog-form label {
+  margin-top: 15px;
+  color: #e03a3c;
+  font-style: italic;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  font-size: 20px;
   font-weight: 500;
 }
 
-.blog-form .form-control{
-border-radius:1rem;
+.blog-form .form-control {
+  border-radius: 1rem;
 }
 
-.blog-form form{
-padding-left: 2%;
-padding-right: 2%;
+.blog-form form {
+  padding-left: 2%;
+  padding-right: 2%;
 }
 
-.blog-form .text-muted{
-font-style: italic;
-font-size: 15px;
-margin-top: 0;
-display: inline;
+.blog-form .text-muted {
+  font-style: italic;
+  font-size: 15px;
+  margin-top: 0;
+  display: inline;
 }
 
 .blogbtn {
-height: 45px;
-margin: 3px;
-border: none;
-border-radius: 23px;
-/* padding: 2%; */
-background: #e03a3c;
-font-weight: 600;
-color: #fff;
-font-style: italic;
-cursor: pointer;
-align-items: center; 
+  height: 45px;
+  margin: 3px;
+  border: none;
+  border-radius: 23px;
+  /* padding: 2%; */
+  background: #e03a3c;
+  font-weight: 600;
+  color: #fff;
+  font-style: italic;
+  cursor: pointer;
+  align-items: center;
 }
 
-#postbtn{
-width: 30%;
+#postbtn {
+  width: 30%;
 }
 
-#writebtn{
-width: auto;
+#writebtn {
+  width: auto;
 }
 
-#updatebtn{
-width: auto;
-display: inline-block;
-margin: 3px;
-background: grey;
+#updatebtn {
+  width: auto;
+  display: inline-block;
+  margin: 3px;
+  background: grey;
 }
 
-#deletebtn{
-width: auto;
-display: inline-block;
-margin: 3px;
+#deletebtn {
+  width: auto;
+  display: inline-block;
+  margin: 3px;
 }
 
-.blogbtn:hover{
-background: crimson !important; 
+.blogbtn:hover {
+  background: crimson !important;
 }
 
 /* .blog-form .btn{
 text-align: center;
 } */
 
-.vid{
-padding: 20px;
+.vid {
+  padding: 20px;
 }
-.content{
+.content {
   padding-left: 0px;
 }
-.content img{
+.content img {
   max-width: 100%;
   height: auto;
 }
diff --git a/static/css/collaborate.css b/static/css/collaborate.css
index 976b449b..f2f0c841 100644
--- a/static/css/collaborate.css
+++ b/static/css/collaborate.css
@@ -1,4 +1,4 @@
-#about .d-flex h2{
+#about .d-flex h2 {
   text-align: center;
   color: #333;
   font-weight: 600;
@@ -6,7 +6,11 @@
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark #about .d-flex h2 {
+  color: white;
 }
 
 #about #section-title {
@@ -19,17 +23,13 @@
   margin-bottom: 0;
 }
 
-#about footer{
-  background-color: #fff !important;
-}
-
-.collaborate{
-  border: 2px solid rgb(204, 67, 67); 
-  padding: 20px; 
+.collaborate {
+  border: 2px solid rgb(204, 67, 67);
+  padding: 20px;
   border-radius: 7px;
 }
 
-.collaborate .title{
+.collaborate .title {
   color: #212529;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
@@ -39,8 +39,12 @@
   line-height: 180%;
   text-transform: capitalize; */
 }
-  
-.collaborate .title-u{
+
+.dark .collaborate .title {
+  color: whitesmoke;
+}
+
+.collaborate .title-u {
   background: #e03a3c;
   width: 50px;
   height: 3px;
@@ -48,40 +52,33 @@
   left: calc(50% - 25px);
   display: block;
 }
-  
-.collaborate  p {
+
+.collaborate p {
   margin-top: 60px;
-    text-align: justify;
+  text-align: justify;
 }
 
-.lead{
-    text-align: center !important;
+.lead {
+  text-align: center !important;
 }
 
 .about {
   overflow: hidden;
 }
 
-.collaborate a{
+.collaborate a {
   color: #e03a3c !important;
 }
 
-@media(max-width: 990px) {
-#offer {
-  flex-direction: column-reverse;
-}
-#learn {
-  flex-direction: column-reverse;
-}
+@media (max-width: 990px) {
+  #offer {
+    flex-direction: column-reverse;
+  }
+  #learn {
+    flex-direction: column-reverse;
+  }
 }
 
-
-  
-
- 
-
-
-
 /* 
 #about #about-us{
     background-color: #CCCCCC;;
@@ -93,7 +90,6 @@
     
 } */
 
-
 /* .about .row h2 {
     font-weight: 700;
     font-size: 42px; 
diff --git a/static/css/components.css b/static/css/components.css
index f8d3d2fd..dcb29295 100644
--- a/static/css/components.css
+++ b/static/css/components.css
@@ -4,211 +4,207 @@ starts
 */
 
 /* Component Heading */
-#components .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid;
-  }
-  
-
-  /* Setting container for tabs+components */
-  #features {
-    display: inline-block;
-    height: 100%;
-    width: 100%;
-  }
-
-
-  /* Color of the tabs */
-  #features .container .nav .nav-item a{
-    color:#e76668;
-  }
-
-  /* Active tab */
-  #features .container .nav .nav-item .active{
-    color:#e03a3c;
-    font-weight: 500;
-  }
-  
-  /* Block of single component */
-  #features .feature-block {
-    background: #fff none repeat scroll 0 0;
-    padding: 20px 20px;
-    margin-bottom: 30px;
-    transition: all 0.5s ease-in-out 0s;
-    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.25);
-  }
-
-
-  /* Component Image */
-
-  #features .feature-block img{
-    max-width: 100%;
-    height: auto;
-    object-fit: cover;
-  }
-  
-
-  #features .feature-block:hover {
-    box-shadow: 0 0 35px rgba(0, 0, 0, 0.4);
-    transition: all 0.5s ease-in-out 0s;
-  }
-  
-
-  /* Name of the Component */
-  #features .feature-block h4 {
-    margin-bottom: 10px;
-    margin-top: 25px;
-    font-size: 1.25rem;
-    font-family: "Roboto", sans-serif;
-    font-weight: bold;
-    color: #de1212;
-    padding-top: 10px;
-  }
-  
-  /* Description of Component */
-  #features .feature-block p {
-    margin-bottom: 8px;
-    font-family: "Roboto", sans-serif;
-    font-weight: 500;
-    color: #333;
-  }
-
-  /*
+#components .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark #components .d-flex h2 {
+  color: white;
+}
+
+/* Setting container for tabs+components */
+#features {
+  display: inline-block;
+  height: 100%;
+  width: 100%;
+}
+
+/* Color of the tabs */
+#features .container .nav .nav-item a {
+  color: #e76668;
+}
+
+/* Active tab */
+#features .container .nav .nav-item .active {
+  color: #e03a3c;
+  font-weight: 500;
+}
+
+/* Block of single component */
+#features .feature-block {
+  background: #fff none repeat scroll 0 0;
+  padding: 20px 20px;
+  margin-bottom: 30px;
+  transition: all 0.5s ease-in-out 0s;
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.25);
+}
+
+/* Component Image */
+
+#features .feature-block img {
+  max-width: 100%;
+  height: auto;
+  object-fit: cover;
+}
+
+#features .feature-block:hover {
+  box-shadow: 0 0 35px rgba(0, 0, 0, 0.4);
+  transition: all 0.5s ease-in-out 0s;
+}
+
+/* Name of the Component */
+#features .feature-block h4 {
+  margin-bottom: 10px;
+  margin-top: 25px;
+  font-size: 1.25rem;
+  font-family: "Roboto", sans-serif;
+  font-weight: bold;
+  color: #de1212;
+  padding-top: 10px;
+}
+
+/* Description of Component */
+#features .feature-block p {
+  margin-bottom: 8px;
+  font-family: "Roboto", sans-serif;
+  font-weight: 500;
+  color: #939393;
+}
+
+/*
   Components
   Ends
   */
 
-  /*component form*/
-
-  .components-form .container{
-    border: 1px solid  #e9ecef;
-    border-radius: 20px;
-  }
-  
-  #components-form .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid;
-    margin-bottom: 0%;
-    }
-  
-  #components-form label{
-    margin-top: 15px;
-    color: #e03a3c;
-    font-style: italic;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-  }
-  
-  .components-form .form-control{
-    border-radius:1rem;
-  }
-  
-  .components-form form{
-    padding-left: 2%;
-    padding-right: 2%;
-  }
-  
-  .components-form .text-muted{
-    font-style: italic;
-    font-size: 15px;
-    margin-top: 0;
-    display: inline;
-  }
-
-  .info-box .issuer{
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-  
-   .componentsbtn {
-     width: auto;
-     height: 45px;
-    margin: 10px;
-    border: none;
-    border-radius: 10px;
-    /* padding: 2%; */
-    background: #e03a3c;
-    font-weight: 600;
-    color: #fff;
-    font-style: italic;
-    cursor: pointer;
-  }
-  
-  .approvebtn{
-    width: 30%;
-    background:green;
-  }
-  
-  #deletebtn{
-    width: 30%;
-  }
-
-  #postbtn{
-    width:20%;
-  }
-
- 
-  
-  .componentsbtn:hover{
-    background: crimson !important; 
-  }
-  
-  #id_detail{
-    height: 80px;
-  }
+/*component form*/
+
+.components-form .container {
+  border: 1px solid #e9ecef;
+  border-radius: 20px;
+}
+
+#components-form .d-flex h2 {
+  color: #939393;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+  margin-bottom: 0%;
+}
+
+#components-form label {
+  margin-top: 15px;
+  color: #e03a3c;
+  font-style: italic;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+}
+
+.components-form .form-control {
+  border-radius: 1rem;
+}
+
+.components-form form {
+  padding-left: 2%;
+  padding-right: 2%;
+}
+
+.components-form .text-muted {
+  font-style: italic;
+  font-size: 15px;
+  margin-top: 0;
+  display: inline;
+}
+
+.info-box .issuer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.componentsbtn {
+  width: auto;
+  height: 45px;
+  margin: 10px;
+  border: none;
+  border-radius: 10px;
+  /* padding: 2%; */
+  background: #e03a3c;
+  font-weight: 600;
+  color: #fff;
+  font-style: italic;
+  cursor: pointer;
+}
+
+.approvebtn {
+  width: 30%;
+  background: green;
+}
+
+#deletebtn {
+  width: 30%;
+}
+
+#postbtn {
+  width: 20%;
+}
+
+.componentsbtn:hover {
+  background: crimson !important;
+}
+
+#id_detail {
+  height: 80px;
+}
 
 /*issue details*/
 #issue-details .carousel-img {
   width: 150px;
   height: 150px;
-  }
+}
 
-#issue-details .d-flex h2{
+#issue-details .d-flex h2 {
   color: #333;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 2px solid;
+  border-bottom: #e03a3c 2px solid;
 }
 
 #issue-details .message-box {
-	position: relative;
-	padding: 60px;
+  position: relative;
+  padding: 60px;
   margin-top: 10px;
   text-align: left;
   border: 1px solid #e9ecef;
   border-radius: 20px;
 }
 
-#issue-details .issuer{
+#issue-details .issuer {
   color: #e03a3c !important;
 }
 
-#issue-details .issuer a{
+#issue-details .issuer a {
   color: #e03a3c !important;
 }
 
-#issue-details .info-box .name{
+#issue-details .info-box .name {
   color: #16324f;
   border-bottom: 1px #e03a3c;
 }
 
-
 #issue-details .message-box h3 {
-	margin-top: 15px;
+  margin-top: 15px;
   margin-bottom: 25px;
   color: #e03a3c;
   font-size: 25px;
@@ -216,12 +212,12 @@ starts
   letter-spacing: 2px;
 }
 
-#issue-details .message-box h4 b{
+#issue-details .message-box h4 b {
   color: #e03a3c;
 }
 
 #issue-details .message-box h4 {
-	margin-top: 15px;
+  margin-top: 15px;
   margin-bottom: 25px;
   font-size: 15px;
   font-family: "Roboto", sans-serif;
@@ -234,19 +230,19 @@ starts
 }
 
 #issue-details .message-box .row:after {
-	content: '';
-	position: absolute;
-	left: 20px;
-	right: 20px;
-	bottom: 0;
-	top: 120px;
-	
-	/* border: 1px solid #e9ecef; */
-	border-radius: 20px;
+  content: "";
+  position: absolute;
+  left: 20px;
+  right: 20px;
+  bottom: 0;
+  top: 120px;
+
+  /* border: 1px solid #e9ecef; */
+  border-radius: 20px;
   z-index: -1;
 }
 
-#issue-details .info-box{
+#issue-details .info-box {
   border: 1px solid #e9ecef;
   border-radius: 20px;
   text-align: center;
@@ -261,25 +257,25 @@ starts
 }
 .red-border .form-control:focus {
   border: 1px solid #e03a3c;
-  box-shadow: 0 0 0 0.3rem rgba(220, 20, 60, .10);
+  box-shadow: 0 0 0 0.3rem rgba(220, 20, 60, 0.1);
 }
 
-#components ul{
+#components ul {
   padding: 0;
   margin: 0;
 }
 
-.tab-text{
+.tab-text {
   padding: 10px 9px;
 }
-.comp-img{
+.comp-img {
   width: 180px;
   height: 108px;
   /* max-width: 100%; */
   /* height: auto; */
 }
 
-.test{
+.test {
   padding-top: 4px;
   padding-bottom: 4px;
-}
\ No newline at end of file
+}
diff --git a/static/css/coordinator.css b/static/css/coordinator.css
index 0460147d..a19ae59b 100644
--- a/static/css/coordinator.css
+++ b/static/css/coordinator.css
@@ -1,180 +1,203 @@
 /*--------------------------------------------------------------
 # Coordinators
 --------------------------------------------------------------*/
-.cord-title .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
+.cord-title .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
 
-  [data-toggle="collapse"] i:before {
-    content: "\f068";
+[data-toggle="collapse"] i:before {
+  content: "\f068";
 }
 [data-toggle="collapse"].collapsed i:before {
-    content: "\f067";
+  content: "\f067";
+}
+
+.dark .cord-title .d-flex h2 {
+  color: white;
 }
+
 #accordion .card-header {
-    margin-bottom: 12px;
+  margin-bottom: 12px;
 }
 #accordion .accordion-title {
-    position: relative;
-    display: block;
-    padding: 14px 0 14px 50px;
-    background: #1b1b1b;
-    border-radius: 8px;
-    overflow: hidden;
-    text-decoration: none;
-    color: #fff;
-    font-size: 22px;
-    font-weight: 700;
-    width: 100%;
-    text-align: left;
-    transition: all 0.4s ease-in-out;
+  position: relative;
+  display: block;
+  padding: 14px 0 14px 50px;
+  background: #1b1b1b;
+  border-radius: 8px;
+  overflow: hidden;
+  text-decoration: none;
+  color: #fff;
+  font-size: 22px;
+  font-weight: 700;
+  width: 100%;
+  text-align: left;
+  transition: all 0.4s ease-in-out;
 }
 #accordion .accordion-title i {
-    position: absolute;
-    width: 40px;
-    height: 100%;
-    left: 0;
-    top: 0;
-    color: #fff;
-    background: radial-gradient(rgba(27, 27, 27, .8), #1b1b1b);
-    text-align: center;
-    border-right: 1px solid transparent;
+  position: absolute;
+  width: 40px;
+  height: 100%;
+  left: 0;
+  top: 0;
+  color: #fff;
+  background: radial-gradient(rgba(27, 27, 27, 0.8), #1b1b1b);
+  text-align: center;
+  border-right: 1px solid transparent;
 }
 #accordion .accordion-title:hover {
-    padding-left: 60px;
-    /* background: #e14143; */
-    color: #fff;
+  padding-left: 60px;
+  /* background: #e14143; */
+  color: #fff;
 }
 #accordion .accordion-title:hover i {
-    border-right: 1px solid #fff;
+  border-right: 1px solid #fff;
 }
 #accordion .accordion-body {
-    padding: 40px 55px;
+  padding: 40px 55px;
 }
 #accordion .accordion-body ul {
-    list-style: none;
-    margin-left: 0;
-    padding-left: 0;
+  list-style: none;
+  margin-left: 0;
+  padding-left: 0;
 }
 #accordion .accordion-body li {
-    padding-left: 1.2rem;
-    text-indent: -1.2rem;
+  padding-left: 1.2rem;
+  text-indent: -1.2rem;
 }
 #accordion .accordion-body li:before {
-    content: "\f10a";
-    padding-right: 5px;
-    font-family: "Flaticon";
-    font-size: 16px;
-    font-style: normal;
-    color: #213744;
-}
-
- .speaker{
-    transition: box-shadow 1s;
-    padding-top: 10px;
-    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
-  }
- .speaker:hover{
-    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.8);
-    /* transition: all 0.3s ease-in-out; */
-  }
-  
-  
-  .tags{
-      font-size: 10px;
-      color: white;
-      border-radius: 12px;
-  }
- .member {
-    margin-bottom: 20px;
-    overflow: hidden;
-    border-radius: 5px;
-    background: #fff;
-    transition: all 0.3s ease-in-out;
-  }
-  
- .member .member-img {
-    position: relative;
-    overflow: hidden;
-    transition: 0.3s;
-  }
-  
- .member .social {
-    position: absolute;
-    left: 0;
-    bottom: 30px;
-    right: 0;
-    opacity: 0;
-    transition: ease-in-out 0.3s;
-    text-align: center;
-  }
-  
- .member .social a {
-    transition: color 0.3s;
-    color: #111111;
-    margin: 0 3px;
-    padding-top: 7px;
-    border-radius: 50px;
-    width: 36px;
-    height: 36px;
-    background: #e03a3c;
-    display: inline-block;
-    transition: ease-in-out 0.3s;
-    color: #fff;
-  }
-  
- .member .social a:hover {
-    background: #111111;
-  }
-  
- .member .social i {
-    font-size: 18px;
-  }
-  
- .member .member-info {
-    padding: 15px 15px;
-    transition: 0.3s;
-  }
-  
- .member .member-info h4 {
-    font-weight: 700;
-    margin-bottom: 5px;
-    font-size: 18px;
-    color: #111111;
-  }
-  
- .speaker:hover h4{
-    color: #b31b1b;
-  }
-  
- .member .member-info span {
-    display: block;
-    font-size: 14px;
-    font-weight: 500;
-    color: #aaaaaa;
-  }
-  
- .member .member-info p {
-    font-style: italic;
-    font-size: 11px;
-    font-weight: 480;
-    line-height: 22px;
-    color: #777777;
-    margin-bottom: 0.5rem;
-  }
-  
- .member:hover .social {
-    opacity: 1;
-    bottom: 15px;
-  }
-  
-  /* .icon{
+  content: "\f10a";
+  padding-right: 5px;
+  font-family: "Flaticon";
+  font-size: 16px;
+  font-style: normal;
+  color: #213744;
+}
+
+.speaker {
+  transition: box-shadow 1s;
+  padding-top: 10px;
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
+}
+.speaker:hover {
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.8);
+  /* transition: all 0.3s ease-in-out; */
+}
+
+.dark .speaker {
+  background-color: #1b1b1b;
+  box-shadow: 0px 2px 15px rgba(255, 255, 255, 0.2);
+  border: 0.1px solid aliceblue;
+}
+
+.dark .speaker:hover {
+  box-shadow: 0px 5px 20px rgba(255, 255, 255, 0.8);
+}
+
+.tags {
+  font-size: 10px;
+  color: white;
+  border-radius: 12px;
+}
+.member {
+  margin-bottom: 20px;
+  overflow: hidden;
+  border-radius: 5px;
+  background: #fff;
+  transition: all 0.3s ease-in-out;
+}
+
+.dark .member {
+  background-color: #1b1b1b;
+  color: white;
+}
+
+.member .member-img {
+  position: relative;
+  overflow: hidden;
+  transition: 0.3s;
+}
+
+.member .social {
+  position: absolute;
+  left: 0;
+  bottom: 30px;
+  right: 0;
+  opacity: 0;
+  transition: ease-in-out 0.3s;
+  text-align: center;
+}
+
+.member .social a {
+  transition: color 0.3s;
+  color: #111111;
+  margin: 0 3px;
+  padding-top: 7px;
+  border-radius: 50px;
+  width: 36px;
+  height: 36px;
+  background: #e03a3c;
+  display: inline-block;
+  transition: ease-in-out 0.3s;
+  color: #fff;
+}
+
+.member .social a:hover {
+  background: #111111;
+}
+
+.member .social i {
+  font-size: 18px;
+}
+
+.member .member-info {
+  padding: 15px 15px;
+  transition: 0.3s;
+}
+
+.member .member-info h4 {
+  font-weight: 700;
+  margin-bottom: 5px;
+  font-size: 18px;
+  color: #111111;
+}
+
+.dark .member .member-info h4 {
+  color: whitesmoke;
+}
+
+.speaker:hover h4 {
+  color: #b31b1b;
+}
+
+.member .member-info span {
+  display: block;
+  font-size: 14px;
+  font-weight: 500;
+  color: #aaaaaa;
+}
+
+.member .member-info p {
+  font-style: italic;
+  font-size: 11px;
+  font-weight: 480;
+  line-height: 22px;
+  color: #777777;
+  margin-bottom: 0.5rem;
+}
+
+.member:hover .social {
+  opacity: 1;
+  bottom: 15px;
+}
+
+/* .icon{
       display: flex;
       align-items: center;
       justify-content: center;
@@ -189,4 +212,4 @@
       color: #4a60d0;
       transition: 0.3s;
   }
-   */
\ No newline at end of file
+   */
diff --git a/static/css/faculty.css b/static/css/faculty.css
index f8883904..b6a01416 100644
--- a/static/css/faculty.css
+++ b/static/css/faculty.css
@@ -1,61 +1,69 @@
-
 /*--------------------------------------------------------------
 # Faculty
 --------------------------------------------------------------*/
-.faculty-title .d-flex h2{
+.faculty-title .d-flex h2 {
   color: #333;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark .faculty-title .d-flex h2 {
+  color: white;
 }
 
-.faculty{
+.faculty {
   margin: 0 auto;
 }
 
-.faculty .faculty-item{
+.faculty .faculty-item {
   justify-content: center;
   margin-top: 3rem;
 }
 
-.faculty .faculty-item .user .row{
+.faculty .faculty-item .user .row {
   margin: 0;
 }
 
-.faculty .faculty-item .user{
+.faculty .faculty-item .user {
   background: white;
   margin-bottom: 30px;
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.25);
 }
-.faculty .faculty-item .user .user-image{
+
+.dark .faculty .faculty-item .user {
+  background: #1b1b1b;
+}
+
+.faculty .faculty-item .user .user-image {
   width: 150px;
   height: 150px;
   overflow: hidden;
   margin: 2rem auto 2rem auto;
 }
-.faculty-content{
+.faculty-content {
   padding: 1rem 1rem 2rem 1rem;
 }
 
-.display-7{
+.display-7 {
   font-family: "Poppins", sans-serif;
   font-weight: 500;
   font-size: 16px;
 }
-.display-8{
+.display-8 {
   /* font-family: "Poppins", sans-serif; */
   font-weight: 500;
 }
-.user_name{
+.user_name {
   font-weight: bold;
 }
-.user-link a{
+.user-link a {
   color: #e03a3c;
 }
-.user-link a:hover{
+.user-link a:hover {
   color: red;
   text-decoration: none;
-}
\ No newline at end of file
+}
diff --git a/static/css/gallery.css b/static/css/gallery.css
index f394962a..bd92a4c5 100644
--- a/static/css/gallery.css
+++ b/static/css/gallery.css
@@ -1,102 +1,102 @@
 /*gallery starts*/
 
-#gallery .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
-  
-  #gallery .d-flex h3{
-    color: #16324f;
-    font-size: 26px;
-    font-weight: bold;
-    font-family: "Roboto", sans-serif;
-    word-spacing: 2px;
-    margin-left: 20px;
-  }
-  
-  .gallery .gallery-container {
-    margin-left: 20px;
-    margin-right: 20px;
-   
-  }
-  
-  .gallery .gallery-item {
-    margin-bottom: 30px;
-    /* width: 350px; */
-      height: 315px;
-  }
-  
-  .gallery .gallery-item img{
+#gallery .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
 
-    width: 100%;
-    height: 100%;
-  } 
-  
-  .gallery .gallery-wrap {
-    transition: 0.3s;
-    position: relative;
-    overflow: hidden;
-    z-index: 1;
-    width: 350px;
-      height: 315px;
-    background: rgba(17, 17, 17, 0.6);
-  }
-  
-  .gallery .gallery-wrap::before {
-    content: "";
-    background: rgba(17, 17, 17, 0.6);
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    transition: all ease-in-out 0.3s;
-    z-index: 2;
-    opacity: 0;
-  }
-  
-  .gallery .gallery-wrap img {
+.dark #gallery .d-flex h2 {
+  color: white;
+}
 
-    transition: all ease-in-out 0.3s;
-  }
-  
-  .gallery .gallery-wrap .gallery-info {
-    opacity: 0;
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    z-index: 3;
-    transition: all ease-in-out 0.3s;
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-end;
-    align-items: flex-start;
-    padding: 20px;
-  }
-  
-  .gallery .gallery-wrap .gallery-info h4 {
-    font-size: 20px;
-    color: #fff;
-    font-weight: 600;
-  }
-  
-  .gallery .gallery-wrap:hover::before {
-    opacity: 1;
-  }
-  
-  .gallery .gallery-wrap:hover img {
-    transform: scale(1.2);
-  }
-  
-  .gallery .gallery-wrap:hover .gallery-info {
-    opacity: 1;
-  }
-  /*gallery ends*/
-  
\ No newline at end of file
+#gallery .d-flex h3 {
+  color: #007bff;
+  font-size: 26px;
+  font-weight: bold;
+  font-family: "Roboto", sans-serif;
+  word-spacing: 2px;
+  margin-left: 20px;
+}
+
+.gallery .gallery-container {
+  margin-left: 20px;
+  margin-right: 20px;
+}
+
+.gallery .gallery-item {
+  margin-bottom: 30px;
+  /* width: 350px; */
+  height: 315px;
+}
+
+.gallery .gallery-item img {
+  width: 100%;
+  height: 100%;
+}
+
+.gallery .gallery-wrap {
+  transition: 0.3s;
+  position: relative;
+  overflow: hidden;
+  z-index: 1;
+  width: 350px;
+  height: 315px;
+  background: rgba(17, 17, 17, 0.6);
+}
+
+.gallery .gallery-wrap::before {
+  content: "";
+  background: rgba(17, 17, 17, 0.6);
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  transition: all ease-in-out 0.3s;
+  z-index: 2;
+  opacity: 0;
+}
+
+.gallery .gallery-wrap img {
+  transition: all ease-in-out 0.3s;
+}
+
+.gallery .gallery-wrap .gallery-info {
+  opacity: 0;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 3;
+  transition: all ease-in-out 0.3s;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  align-items: flex-start;
+  padding: 20px;
+}
+
+.gallery .gallery-wrap .gallery-info h4 {
+  font-size: 20px;
+  color: #fff;
+  font-weight: 600;
+}
+
+.gallery .gallery-wrap:hover::before {
+  opacity: 1;
+}
+
+.gallery .gallery-wrap:hover img {
+  transform: scale(1.2);
+}
+
+.gallery .gallery-wrap:hover .gallery-info {
+  opacity: 1;
+}
+/*gallery ends*/
diff --git a/static/css/homepage_testimonial.css b/static/css/homepage_testimonial.css
index 4aeda0c8..f164b499 100644
--- a/static/css/homepage_testimonial.css
+++ b/static/css/homepage_testimonial.css
@@ -1,122 +1,135 @@
-.testimonials .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
-  
-  /* -------------------------------------------------------------------------------------------------- */
-  
+.testimonials .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
 
-  .owl-theme .owl-controls{
-      margin-top: 10px;
-  }
-  .owl-theme .owl-controls .owl-page span{
-      background: #5e5f5f;
-      opacity: 1;
-      transition: all 0.4s ease 0s;
-  }
-  .owl-theme .owl-controls .owl-page.active span,
-  .owl-theme .owl-controls.clickable .owl-page:hover span{
-      background: #ed5360;
-  }
-  .owl-theme .owl-controls .owl-page.active span{
-      width: 22px;
-      height: 12px;
-  }
-  
-    .owl-pagination{
-        padding-bottom: 25px;
-    }
-  
-  /*testimonials section*/
-
-.testimonial{
-    margin: 0 20px 40px;
-    /* max-height: 50vh; */
-}
-.testimonial .testimonial-content{
-    padding: 35px 25px 35px 50px;
-    margin-bottom: 35px;
-    background: #F8f8f8;
-    border: 5px solid #f0f0f0;
-    position: relative;
-}
-.testimonial .testimonial-content:after{
-    content: "";
-    display: inline-block;
-    width: 40px;
-    height: 40px;
-    background: #F7F7F7;
-    border-bottom: 5px solid #f0f0f0;
-    border-right: 5px solid #f0f0f0;
-    position: absolute;
-    bottom: -20px;
-    left: 30px;
-    transform: rotate(45deg);
-}
-.testimonial-content .testimonial-icon{
-    width: 50px;
-    height: 45px;
-    background: #ff4242;
-    text-align: center;
-    font-size: 22px;
-    color: #fff;
-    line-height: 42px;
-    position: absolute;
-    top: 37px;
-    left: -19px;
-}
-.testimonial-content .testimonial-icon:before{
-    content: "";
-    border-bottom: 16px solid #e41212;
-    border-left: 18px solid transparent;
-    position: absolute;
-    top: -16px;
-    left: 1px;
-}
-.testimonial .description{
-    max-height: 160px;
-    overflow-y: scroll;
-    font-size: 16px;
-    font-style: italic;
-    color: #8a8a8a;
-    line-height: 23px;
-    margin: 0;
-}
-
-.testimonial .testimonial-details .carousel-img{
+.dark .testimonials .d-flex h2 {
+  color: white;
+}
+
+/* -------------------------------------------------------------------------------------------------- */
+
+.owl-theme .owl-controls {
+  margin-top: 10px;
+}
+.owl-theme .owl-controls .owl-page span {
+  background: #5e5f5f;
+  opacity: 1;
+  transition: all 0.4s ease 0s;
+}
+.owl-theme .owl-controls .owl-page.active span,
+.owl-theme .owl-controls.clickable .owl-page:hover span {
+  background: #ed5360;
+}
+.owl-theme .owl-controls .owl-page.active span {
+  width: 22px;
+  height: 12px;
+}
+
+.owl-pagination {
+  padding-bottom: 25px;
+}
+
+/*testimonials section*/
+
+.testimonial {
+  margin: 0 20px 40px;
+  /* max-height: 50vh; */
+}
+
+.dark .testimonial {
+  background: #a5a4a4;
+}
+
+.testimonial .testimonial-content {
+  padding: 35px 25px 35px 50px;
+  margin-bottom: 35px;
+  background: #f8f8f8;
+  border: 5px solid #f0f0f0;
+  position: relative;
+}
+.testimonial .testimonial-content:after {
+  content: "";
+  display: inline-block;
+  width: 40px;
+  height: 40px;
+  background: #f7f7f7;
+  border-bottom: 5px solid #f0f0f0;
+  border-right: 5px solid #f0f0f0;
+  position: absolute;
+  bottom: -20px;
+  left: 30px;
+  transform: rotate(45deg);
+}
+.testimonial-content .testimonial-icon {
+  width: 50px;
+  height: 45px;
+  background: #ff4242;
+  text-align: center;
+  font-size: 22px;
+  color: #fff;
+  line-height: 42px;
+  position: absolute;
+  top: 37px;
+  left: -19px;
+}
+.testimonial-content .testimonial-icon:before {
+  content: "";
+  border-bottom: 16px solid #e41212;
+  border-left: 18px solid transparent;
+  position: absolute;
+  top: -16px;
+  left: 1px;
+}
+.testimonial .description {
+  max-height: 160px;
+  overflow-y: scroll;
+  font-size: 16px;
+  font-style: italic;
+  color: #8a8a8a;
+  line-height: 23px;
+  margin: 0;
+}
+
+.testimonial .testimonial-details .carousel-img {
   width: 6em;
   height: 6em;
 }
 
-.testimonial-details{
+.testimonial-details {
   display: flex;
   align-items: center;
 }
 
-.testimonial .title{
-    display: block;
-    font-size: 18px;
-    font-weight: 700;
-    color: #525252;
-    text-transform: capitalize;
-    letter-spacing: 1px;
-    margin: 0 0 5px 0;
+.testimonial .title {
+  display: block;
+  font-size: 18px;
+  font-weight: 700;
+  color: #525252;
+  text-transform: capitalize;
+  letter-spacing: 1px;
+  margin: 0 0 5px 0;
+}
+
+.dark .testimonial .title {
+  color: whitesmoke;
 }
-.testimonial .post{
-    display: block;
-    font-size: 14px;
-    color: #ff4242;
+
+.testimonial .post {
+  display: block;
+  font-size: 14px;
+  color: #ff4242;
 }
 
 .testimonial-details a {
   font-size: 18px;
   display: inline-block;
-  background: #EC3134;
+  background: #ec3134;
   color: #eee;
   line-height: 1;
   padding: 10px 0;
@@ -130,17 +143,19 @@
   margin-top: 6px;
 }
 
-.testimonial-details .links{
+.testimonial-details .links {
   padding-left: 60px;
 }
 
-.testimonial-details a:hover, a:active, a:focus {
+.testimonial-details a:hover,
+a:active,
+a:focus {
   color: #000;
   outline: none;
   text-decoration: none;
 }
 
-.more{
+.more {
   display: flex;
   align-items: center;
   text-align: center;
@@ -148,30 +163,30 @@
   color: #e03a3c;
 }
 
-.batch{
+.batch {
   word-spacing: 3px;
   letter-spacing: 1px;
 }
 
-#home-testimonial-slider #more{
+#home-testimonial-slider #more {
   height: 50vh;
   display: flex;
   align-items: center;
 }
 
-.carousel-icon i{
+.carousel-icon i {
   color: #e03a3c;
   font-size: 30px;
 }
 
 #testimonials h4::after {
-  content: '';
+  content: "";
   position: absolute;
   display: block;
   width: 50px;
   height: 2px;
   background: #e03a3c;
-  margin-top: 9px ;
+  margin-top: 9px;
   left: calc(50% - 25px);
 }
 
@@ -192,8 +207,9 @@
   float: right;
 }
 
-.animated-btn::before, .animated-btn::after {
-  content: '';
+.animated-btn::before,
+.animated-btn::after {
+  content: "";
   display: block;
   position: absolute;
   top: 0;
@@ -212,15 +228,14 @@
   animation-delay: 0.5s;
 }
 
-.owl-carousel .owl-buttons{
-    height: 47px;
-    position: absolute;
-    width: 100%;
-    top: 100px !important;
-    
+.owl-carousel .owl-buttons {
+  height: 47px;
+  position: absolute;
+  width: 100%;
+  top: 100px !important;
 }
 
-.owl-buttons .owl-prev{
+.owl-buttons .owl-prev {
   display: flex !important;
   justify-content: start;
   width: 26px;
@@ -232,7 +247,7 @@
   height: 26px;
 }
 
-.owl-buttons .owl-next{
+.owl-buttons .owl-next {
   display: flex !important;
   justify-content: end;
   width: 26px;
@@ -250,11 +265,11 @@
 
 .owl-buttons .owl-prev{
     /* background: url(nav-icon.png) no-repeat scroll 0 0; */
-    /* left: -33px;
+/* left: -33px;
 }
 .owl-buttons .owl-next{ */
-    /* background: url(nav-icon.png) no-repeat scroll -24px 0px; */
-    /* right: -33px;
+/* background: url(nav-icon.png) no-repeat scroll -24px 0px; */
+/* right: -33px;
 }
 .owl-carousel .prev-slide:hover{
    background-position: 0px -53px;
@@ -263,45 +278,43 @@
   background-position: -24px -53px;
 } */
 
-
 @keyframes ripple-1 {
   0% {
-      transform: scale(1);
-      opacity: 1;
+    transform: scale(1);
+    opacity: 1;
   }
 
   100% {
-      transform: scale(1.5);
-      opacity: 0;
+    transform: scale(1.5);
+    opacity: 0;
   }
 }
 
 @keyframes ripple-2 {
   0% {
-      transform: scale(1);
-      opacity: 1;
+    transform: scale(1);
+    opacity: 1;
   }
 
   100% {
-      transform: scale(1.7);
-      opacity: 0;
+    transform: scale(1.7);
+    opacity: 0;
   }
 }
 
-  
 .description::-webkit-scrollbar {
   width: 5px;
-background-color: #F5F5F5;
+  background-color: #f5f5f5;
 }
 
 .description::-webkit-scrollbar-track {
   -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
-border-radius: 10px;
-background-color: #F5F5F5;
+  border-radius: 10px;
+  background-color: #f5f5f5;
 }
 
 .description::-webkit-scrollbar-thumb {
   border-radius: 10px;
--webkit-box-shadow: inset 0 0 6px rgba(255, 243, 243, 0.3);
-background-color: #D62929;
-}
\ No newline at end of file
+  -webkit-box-shadow: inset 0 0 6px rgba(255, 243, 243, 0.3);
+  background-color: #d62929;
+}
diff --git a/static/css/notice.css b/static/css/notice.css
index 833eac02..e2121911 100644
--- a/static/css/notice.css
+++ b/static/css/notice.css
@@ -3,64 +3,68 @@ Notice Starts
 */
 
 /* Notice Board */
-#notice .d-flex h2{
-    color: #333;
-    font-weight: bold;
-    font-family: "Roboto", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
-
-  #notice .card h5{
-    font-family: 'Roboto', sans-serif;
-    font-size: 22px;
-    color: #16324f;
-    font-weight: 900;
-    line-height: 1;
-    display: block;
-  }
-
-  #notice .card p{
-    font-family: 'Poppins', sans-serif;
-    font-size: 17px;
-    line-height: 1.2em;
-    display: block;
-    color: #333;
-  }
-
-  #notice .card p>a{
-    font-family: 'Poppins', sans-serif;
-    font-size: 17px;
-    font-weight: 500;
-    display: block;
-    color: #e03a3c;
-  }
-
-  /*
+#notice .d-flex h2 {
+  color: #333;
+  font-weight: bold;
+  font-family: "Roboto", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark #notice .d-flex h2 {
+  color: white;
+}
+
+#notice .card h5 {
+  font-family: "Roboto", sans-serif;
+  font-size: 22px;
+  color: #16324f;
+  font-weight: 900;
+  line-height: 1;
+  display: block;
+}
+
+#notice .card p {
+  font-family: "Poppins", sans-serif;
+  font-size: 17px;
+  line-height: 1.2em;
+  display: block;
+  color: #939393;
+}
+
+#notice .card p > a {
+  font-family: "Poppins", sans-serif;
+  font-size: 17px;
+  font-weight: 500;
+  display: block;
+  color: #e03a3c;
+}
+
+/*
 Notice Ends
 */
 
 /* Notice Form starts */
 
-.notice-form .container{
-  border: 1px solid  #e9ecef;
+.notice-form .container {
+  border: 1px solid #e9ecef;
   border-radius: 20px;
 }
 
-#notice-form .d-flex h2{
+#notice-form .d-flex h2 {
   color: #333;
   font-weight: bold;
   font-family: "Roboto", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
   margin-bottom: 0%;
-  }
+}
 
-#notice-form label{
+#notice-form label {
   margin-top: 15px;
   color: #e03a3c;
   font-style: italic;
@@ -68,23 +72,23 @@ Notice Ends
   letter-spacing: 2px;
 }
 
-.notice-form .form-control{
-  border-radius:1rem;
+.notice-form .form-control {
+  border-radius: 1rem;
 }
 
-.notice-form form{
+.notice-form form {
   padding-left: 2%;
   padding-right: 2%;
 }
 
-.notice-form .text-muted{
+.notice-form .text-muted {
   font-style: italic;
   font-size: 16px;
   margin-top: 0;
   display: inline;
 }
 
- /* .noticebtn {
+/* .noticebtn {
   height: 100%;
   border: none;
   border-radius: 1rem;
@@ -96,7 +100,7 @@ Notice Ends
   cursor: pointer;
 } */
 
-.noticebtn{
+.noticebtn {
   height: 28px;
   margin: 3px;
   border: none;
@@ -107,29 +111,28 @@ Notice Ends
   color: #fff;
   font-style: italic;
   cursor: pointer;
-  align-items: center; 
+  align-items: center;
 }
 
-#postbtn{
+#postbtn {
   width: 20%;
 }
 
-#writebtn{
+#writebtn {
   width: 100%;
 }
 
-#updatebtn{
+#updatebtn {
   width: 30%;
   background: grey;
 }
 
-#deletebtn{
+#deletebtn {
   width: 30%;
 }
 
-.noticebtn:hover{
-  background: crimson !important; 
+.noticebtn:hover {
+  background: crimson !important;
 }
 
-
 /* Notice Form ends */
diff --git a/static/css/project.css b/static/css/project.css
index b0575814..ebd75000 100644
--- a/static/css/project.css
+++ b/static/css/project.css
@@ -1,28 +1,32 @@
-#project .d-flex h2{
+#project .d-flex h2 {
   color: #333;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
   margin-bottom: 0%;
-  }
+}
 
-#project-detail .d-flex h2{
-  color: #333;
+.dark #project .d-flex h2 {
+  color: white;
+}
+
+#project-detail .d-flex h2 {
+  color: #939393;
   font-weight: bold;
   font-family: "Roboto", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 3px solid;
+  border-bottom: #e03a3c 3px solid;
   margin-bottom: 3%;
-  }
+}
 
-.project-detail .d-flex h4{
+.project-detail .d-flex h4 {
   font-size: 15px;
-  color:#e03a3c;
+  color: #e03a3c;
   border-radius: 50%;
   text-align: center;
 }
@@ -30,7 +34,9 @@
 .vid {
   position: relative;
   padding-bottom: 56.25%;
-  padding-top: 30px; height: 0; overflow: hidden;
+  padding-top: 30px;
+  height: 0;
+  overflow: hidden;
 }
 
 .vid iframe,
@@ -46,27 +52,26 @@
 .carousel-img {
   width: 50%;
   height: 40vh;
-  }
-
+}
 
-#project-detail h3{
-    color: #e03a3c;
-    font-size: 26px;
-    font-weight: 500;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 5px;
-    /* margin-bottom: 15px; */
-    margin-top: 10px;
-    letter-spacing: 1px;
+#project-detail h3 {
+  color: #e03a3c;
+  font-size: 26px;
+  font-weight: 500;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 5px;
+  /* margin-bottom: 15px; */
+  margin-top: 10px;
+  letter-spacing: 1px;
 }
 
-.members small{
+.members small {
   margin-top: 0;
   font-style: italic;
   margin-left: 10px;
 }
 
-.list-inline p{
+.list-inline p {
   border: 4px solid #b3a4a4;
   border-radius: 20px;
   padding: 5px 12px;
@@ -80,24 +85,24 @@
   border: none;
   margin-bottom: 50px;
 }
-.card-body{
+.card-body {
   padding: 20px 20px;
 }
 
-.card-image{
+.card-image {
   overflow: hidden;
   z-index: 9;
   /* width: 350px; */
   height: 315px;
 }
 
-.card img{
+.card img {
   width: 100%;
   height: 100%;
   transition: all ease-in-out 0.3s;
 }
 
-.card-title{
+.card-title {
   color: #e03a3c;
   font-weight: bold;
   font-family: "Roboto", sans-serif;
@@ -106,28 +111,29 @@
   line-height: 140%;
 }
 
-#project a, a:hover{
+#project a,
+a:hover {
   text-decoration: none;
   color: #212529;
 }
 
-#project .badge{
+#project .badge {
   color: white;
 }
 
-.card:hover{
+.card:hover {
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6);
 }
 
-.card:hover .card-title{
+.card:hover .card-title {
   border-bottom: 2px solid #e03a3c;
 }
 
-.card:hover img{
+.card:hover img {
   transform: scale(1.1);
 }
 
-.card-text{
+.card-text {
   font-size: 15px;
 }
 
@@ -135,23 +141,23 @@
   margin: 0 10px;
 }
 
-.project-form .container{
-  border: 1px solid  #e9ecef;
+.project-form .container {
+  border: 1px solid #e9ecef;
   border-radius: 20px;
 }
 
-#project-form .d-flex h2{
-  color: #333;
+#project-form .d-flex h2 {
+  color: #939393;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
   margin-bottom: 0%;
-  }
+}
 
-#project-form label{
+#project-form label {
   margin-top: 15px;
   color: #e03a3c;
   font-style: italic;
@@ -161,24 +167,24 @@
   font-weight: 500;
 }
 
-.project-form .form-control{
-  border-radius:1rem;
+.project-form .form-control {
+  border-radius: 1rem;
 }
 
-.project-form form{
+.project-form form {
   padding-left: 2%;
   padding-right: 2%;
 }
 
-.project-form .text-muted{
+.project-form .text-muted {
   font-style: italic;
   font-size: 15px;
   margin-top: 0;
   display: inline;
 }
 
- .projectbtn {
-   height: 45px;
+.projectbtn {
+  height: 45px;
   margin: 3px;
   border: none;
   border-radius: 10px;
@@ -188,52 +194,52 @@
   color: #fff;
   font-style: italic;
   cursor: pointer;
-  align-items: center; 
+  align-items: center;
 }
 
-#postbtn{
+#postbtn {
   width: 20%;
 }
 
-#writebtn{
+#writebtn {
   width: 30%;
 }
 
-#updatebtn{
+#updatebtn {
   width: auto;
   display: inline-block;
   margin: 3px;
   background: grey;
 }
 
-#deletebtn{
+#deletebtn {
   width: auto;
   display: inline-block;
   margin: 3px;
 }
 
-.projectbtn:hover{
-  background: crimson !important; 
+.projectbtn:hover {
+  background: crimson !important;
 }
 
-#id_aim{
+#id_aim {
   height: 40px;
 }
 
-input{
-  width:auto;
+input {
+  width: auto;
 }
 
-.project-image img{
+.project-image img {
   max-width: 50%;
   height: 100%;
 }
 
-.project-image iframe{
+.project-image iframe {
   overflow: hidden;
 }
 
-.link-text{
+.link-text {
   padding: 4px 4px;
   padding-bottom: 9px;
   background: #756969;
@@ -242,26 +248,26 @@ input{
   overflow-wrap: break-word;
 }
 
-.link-text::selection{
+.link-text::selection {
   background: #e03a3c;
   height: 5px;
 }
 
-.link{
+.link {
   padding: 6px 12px;
   border-radius: 9px;
   margin-left: 1px;
   margin-bottom: 3px;
 }
 
-@media(max-width:992px){
-  .link{
+@media (max-width: 992px) {
+  .link {
     margin-top: 10px;
   }
-  .shareable i{
+  .shareable i {
     margin-bottom: 10px;
   }
-  .link-text{
+  .link-text {
     font-size: 14px;
   }
 }
@@ -276,23 +282,23 @@ input{
   color: #fff;
   font-style: italic;
   cursor: pointer;
-  align-items: center; 
+  align-items: center;
   width: 30%;
 }
-.blogbtn:hover{
+.blogbtn:hover {
   text-decoration: none;
   color: black;
   transition: 0.3s;
 }
-.content{
+.content {
   padding-left: 0px;
 }
-.content img{
+.content img {
   max-width: 100%;
   height: auto;
 }
-@media(max-width:768px){
-  .blogbtn{
+@media (max-width: 768px) {
+  .blogbtn {
     width: 50%;
   }
-}
\ No newline at end of file
+}
diff --git a/static/css/prosang.css b/static/css/prosang.css
index b37944a9..0839a51a 100644
--- a/static/css/prosang.css
+++ b/static/css/prosang.css
@@ -1,30 +1,34 @@
-#avishkar .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
+#avishkar .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
   letter-spacing: 2px;
   line-height: 180%;
   /* border-bottom:#e03a3c 5px solid; */
 }
-.title{
-  border-bottom:#e03a3c 5px solid;
+
+.dark #avishkar .d-flex h2 {
+  color: white;
+}
+
+.title {
+  border-bottom: #e03a3c 5px solid;
 }
-.full-form{
-  border-bottom:#e03a3c 5px solid;
+.full-form {
+  border-bottom: #e03a3c 5px solid;
   margin-right: auto;
 }
-.logo{
+.logo {
   max-height: 73px;
   margin-right: auto;
 }
-@media(max-width: 768px)
-{
-  .logo{
+@media (max-width: 768px) {
+  .logo {
     /* display: none; */
     max-height: 64px;
     margin-right: 0px;
   }
-  .title{
+  .title {
     margin-left: 7px;
     border-bottom: transparent;
   }
@@ -54,11 +58,19 @@ section {
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.25);
 }
 
-.services .icon-box:hover{
+.dark .services .icon-box {
+  background-color: #1b1b1b;
+}
+
+#services .container h4 {
+  color: black;
+}
+
+.services .icon-box:hover {
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.5);
 }
 
-.services .icon-box:hover h3{
+.services .icon-box:hover h3 {
   /* background: #2b2b2b; */
   color: #db1515;
 }
@@ -72,6 +84,12 @@ section {
   transition: 0.3s;
 }
 
+.dark .services .icon-box,
+.dark #services .container h4,
+.dark .services .icon-box h3 {
+  color: white;
+}
+
 .services .icon-box p {
   /* margin-left: 70px; */
   line-height: 24px;
@@ -84,7 +102,7 @@ section {
 
 /* Horizontal line */
 .collapsible-link::before {
-  content: '';
+  content: "";
   width: 14px;
   height: 2px;
   background: #333;
@@ -97,7 +115,7 @@ section {
 
 /* Vertical line */
 .collapsible-link::after {
-  content: '';
+  content: "";
   width: 2px;
   height: 14px;
   background: #333;
@@ -108,11 +126,19 @@ section {
   transition: all 0.3s;
 }
 
-.collapsible-link[aria-expanded='true']::after {
+.dark .collapsible-link::before {
+  background-color: whitesmoke;
+}
+
+.dark .collapsible-link::after {
+  background-color: whitesmoke;
+}
+
+.collapsible-link[aria-expanded="true"]::after {
   transform: rotate(90deg) translateX(-1px);
 }
 
-.collapsible-link[aria-expanded='true']::before {
+.collapsible-link[aria-expanded="true"]::before {
   transform: rotate(180deg);
 }
 
@@ -120,34 +146,52 @@ section {
   color: #37423b;
   transition: 0.3s;
 }
+
+.dark .accordion .card-header a {
+  color: whitesmoke;
+}
+
 .accordion .card-body a {
   color: #e05578;
   transition: 0.3s;
 }
 
-.accordion .card a:hover{
+.accordion .card a:hover {
   color: #db1515;
   text-decoration: none;
 }
 
+.accordion .card #headingOne,
+.accordion .card #headingTwo {
+  background-color: white;
+}
+
+.dark .accordion .card #headingOne,
+.dark .accordion .card #headingTwo {
+  background-color: #1b1b1b;
+}
+
+.dark #collapseOne,
+.dark #collapseTwo {
+  background-color: #1b1b1b;
+}
 
 /*--------------------------------------------------------------
 # Team
 --------------------------------------------------------------*/
-.content{
+.content {
   font-size: 1.1rem;
 }
-.team .speaker{
+.team .speaker {
   transition: box-shadow 1s;
   padding-top: 10px;
-  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.20);
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.2);
 }
-.team .speaker:hover{
+.team .speaker:hover {
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.6);
   /* transition: all 0.3s ease-in-out; */
 }
 
-
 .team .member {
   margin-bottom: 20px;
   overflow: hidden;
@@ -207,7 +251,7 @@ section {
   color: #111111;
 }
 
-.team .speaker:hover h4{
+.team .speaker:hover h4 {
   color: red;
 }
 
diff --git a/static/css/spinoff.css b/static/css/spinoff.css
index 163501d5..9a6dffdd 100644
--- a/static/css/spinoff.css
+++ b/static/css/spinoff.css
@@ -2,68 +2,73 @@
 # Spinoff
 --------------------------------------------------------------*/
 
-.title .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
-.details .text-center{
-    font-family: "Raleway",sans-serif;
-    /* font-size: 1em; */
-    font-weight: 500;
-    font-size: 19px;
+.title .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
 }
-.details .text-center a{
-    color: #e03a3c;
-    /* text-decoration: none; */
+
+.dark .title .d-flex h2 {
+  color: white;
+}
+
+.details .text-center {
+  font-family: "Raleway", sans-serif;
+  /* font-size: 1em; */
+  font-weight: 500;
+  font-size: 19px;
+}
+.details .text-center a {
+  color: #e03a3c;
+  /* text-decoration: none; */
+}
+.tsaw-title {
+  font-family: "Raleway", sans-serif;
+  font-weight: bold;
+  font-size: 25px;
+}
+.about {
+  font-family: "Poppins", sans-serif;
+  line-height: 26px;
+  margin-right: 1em;
+}
+.spinoff-logo {
+  width: 100%;
+  height: auto;
+  /* justify-content: center; */
+  /* align-items: center; */
+  /* margin-top: 20px; */
+}
+.quote-text p {
+  font-family: "Raleway", sans-serif;
+  font-size: 19px;
+  font-weight: 450;
+}
+.quote-text b {
+  font-size: 18px;
+  float: right;
+  margin-top: 10px;
 }
- .tsaw-title{
-    font-family: "Raleway",sans-serif;
-    font-weight: bold;
-    font-size: 25px;
-  }
- .about{
-    font-family: "Poppins",sans-serif;
-    line-height: 26px;
-    margin-right: 1em;
-  }
- .spinoff-logo{
-    width: 100%;
-    height: auto;
-    /* justify-content: center; */
-    /* align-items: center; */
-    /* margin-top: 20px; */
-  }
- .quote-text p{
-    font-family: "Raleway",sans-serif;
-      font-size: 19px;
-      font-weight: 450;
-  }
- .quote-text b{
-      font-size: 18px;
-      float: right;
-      margin-top: 10px;
-  }
-  .blogbtn {
-    height: 45px;
-    margin: 3px;
-    border: none;
-    border-radius: 22px;
-    /* padding: 2%; */
-    background: #e03a3c;
-    font-weight: 600;
-    color: #fff;
-    font-style: italic;
-    cursor: pointer;
-    align-items: center; 
-    width: 30%;
+.blogbtn {
+  height: 45px;
+  margin: 3px;
+  border: none;
+  border-radius: 22px;
+  /* padding: 2%; */
+  background: #e03a3c;
+  font-weight: 600;
+  color: #fff;
+  font-style: italic;
+  cursor: pointer;
+  align-items: center;
+  width: 30%;
 }
-.blogbtn:hover{
-    text-decoration: none;
-    color: black;
-    transition: 0.3s;
+.blogbtn:hover {
+  text-decoration: none;
+  color: black;
+  transition: 0.3s;
 }
diff --git a/static/css/sponsor.css b/static/css/sponsor.css
index 886d1ec5..90ad3a06 100644
--- a/static/css/sponsor.css
+++ b/static/css/sponsor.css
@@ -1,102 +1,106 @@
-#support{
+#support {
   /* padding-top: 1em;
   background-color: #1b1b1b;
   padding-bottom: 1em; */
   padding: 0;
 }
 
-#sponsor .d-flex h2{
-    color: #1b1b1b;;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
+#sponsor .d-flex h2 {
+  color: #1b1b1b;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
 
-  #sponsor .support img{
-    width: 14%;
-    height: 14%;
-    object-fit: cover;
-    display: block;
-      margin-left: auto;
-      margin-right: auto;
-  }
+.dark #sponsor .d-flex h2 {
+  color: white;
+}
 
-  #sponsor .support p{
-    /* margin: 2em; */
-    margin-left: 4em;
-    margin-right: 4em;
-    margin-bottom: 0;
-    /* padding-bottom: 2em; */
-    /* text-align: center; */
-     font-size: 1.1em;
-    /*font-family: "Poppins",sans-serif; */
-    /* font-weight: 500; */
-    /* color: #1b1b1b;; */
-  }
+#sponsor .support img {
+  width: 14%;
+  height: 14%;
+  object-fit: cover;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
 
-  #sponsor .support .quote{
-    text-align: center;
-  }
+#sponsor .support p {
+  /* margin: 2em; */
+  margin-left: 4em;
+  margin-right: 4em;
+  margin-bottom: 0;
+  /* padding-bottom: 2em; */
+  /* text-align: center; */
+  font-size: 1.1em;
+  /*font-family: "Poppins",sans-serif; */
+  /* font-weight: 500; */
+  /* color: #1b1b1b;; */
+}
 
-  #sponsor .support .details{
-    text-align: left;
-    line-height: 1.8em;
-    font-size: 17px;
-  }
+#sponsor .support .quote {
+  text-align: center;
+}
 
-  #sponsor .support .details p{
-    margin-bottom: 0.5em;
-    margin-top: 0.5em;
-  }
+#sponsor .support .details {
+  text-align: left;
+  line-height: 1.8em;
+  font-size: 17px;
+}
 
-  #sponsor .support .details .text-center b{
-    font-family: "montserrat",sans-serif;
-    font-size: 1em;
-    font-weight: 600;
-  }
-  #sponsor .support .details .told b{
-    /* font-family: "montserrat",sans-serif; */
-    /* font-size: 1em; */
-    /* font-weight: 600; */
-    float: right;
-  }
-  #sponsor .support .details b{
-    font-family: "montserrat",sans-serif;
-    font-size: 1.4em;
-    font-weight: 600;
-    padding-bottom: 20px;
-  }
+#sponsor .support .details p {
+  margin-bottom: 0.5em;
+  margin-top: 0.5em;
+}
 
-  #sponsor .support .tsaw-title{
-    font-weight: bold;
-    font-size: 20px;
-  }
-  #sponsor .support .about{
-    line-height: 26px;
-    margin-right: 1em;
-  }
-  #sponsor .support .spinoff-logo{
-    width: 100%;
-    height: auto;
-    justify-content: center;
-    align-items: center;
-    /* margin-top: 20px; */
-  }
+#sponsor .support .details .text-center b {
+  font-family: "montserrat", sans-serif;
+  font-size: 1em;
+  font-weight: 600;
+}
+#sponsor .support .details .told b {
+  /* font-family: "montserrat",sans-serif; */
+  /* font-size: 1em; */
+  /* font-weight: 600; */
+  float: right;
+}
+#sponsor .support .details b {
+  font-family: "montserrat", sans-serif;
+  font-size: 1.4em;
+  font-weight: 600;
+  padding-bottom: 20px;
+}
 
-  #sponsor .support .details a{
-    color: #EC3134;
-  }
+#sponsor .support .tsaw-title {
+  font-weight: bold;
+  font-size: 20px;
+}
+#sponsor .support .about {
+  line-height: 26px;
+  margin-right: 1em;
+}
+#sponsor .support .spinoff-logo {
+  width: 100%;
+  height: auto;
+  justify-content: center;
+  align-items: center;
+  /* margin-top: 20px; */
+}
 
-#sponsor .social-links ul{
+#sponsor .support .details a {
+  color: #ec3134;
+}
+
+#sponsor .social-links ul {
   text-align: center;
   padding: 0;
   margin: 0;
 }
 
-#sponsor .social-links li{
+#sponsor .social-links li {
   display: inline-block;
   padding-bottom: 0.5em;
 }
@@ -104,7 +108,7 @@
 #sponsor .social-links i {
   font-size: 1.2em;
   display: inline-block;
-  background: #EC3134;
+  background: #ec3134;
   color: #eee;
   line-height: 1;
   padding: 7.5px 0;
@@ -125,47 +129,50 @@
   text-decoration: none;
 }
 
-@media (max-width: 768px){
-  #sponsor .support img{
+@media (max-width: 768px) {
+  #sponsor .support img {
     width: 20%;
     height: auto;
   }
 }
 
 @media (max-width: 500px) {
-  #sponsor .support img{
+  #sponsor .support img {
     width: 42%;
     height: auto;
   }
 
-  #sponsor .support p{
+  #sponsor .support p {
     margin-left: 1.5em;
     margin-right: 1.5em;
   }
 }
 
-
-#sponsor h2{
+#sponsor h2 {
   color: #16324f;
-  font-family: "Poppins",sans-serif;
+  font-family: "Poppins", sans-serif;
   font-size: 2.2em;
   font-weight: 500;
 }
 
 /* Carousel */
 
-#sponsor .container{
+#sponsor .container {
   margin-left: auto;
   margin-right: auto;
   max-width: max-content;
 }
 
-#sponsor .container h2{
-  color: #1B1B1B;
+#sponsor .container h2 {
+  color: #1b1b1b;
   text-transform: uppercase;
 }
 
-#sponsor .container .title-u{
+.dark #sponsor .container h2 {
+  color: whitesmoke;
+}
+
+#sponsor .container .title-u {
   background: #e03a3c;
   width: 50px;
   height: 3px;
@@ -174,7 +181,7 @@
   display: block;
 }
 
-#sponsor .card{
+#sponsor .card {
   background: none;
   border: none;
   /* height: 10vw; */
@@ -183,7 +190,7 @@
   margin-right: 5px;
 }
 
-#sponsor .card{
+#sponsor .card {
   padding: 0;
   padding-top: 1em;
   padding-bottom: 1em;
@@ -193,13 +200,12 @@
   height: 400px;
 }
 
-#sponsor .card .card-head{
+#sponsor .card .card-head {
   height: 100px;
   text-align: center;
 }
 
-#sponsor .card img{
-  
+#sponsor .card img {
   margin-top: auto;
   margin-bottom: auto;
   overflow: hidden;
@@ -209,44 +215,46 @@
   max-width: 80%;
 }
 
-
 /* Card Body */
-#sponsor  .row .card-text {
+#sponsor .row .card-text {
   max-height: 90%;
   overflow-y: scroll;
   /* font-family: "raleway",sans-serif; */
 }
 
-#sponsor  .row .card-body h5{
-  font-family: "Poppins",sans-serif;
+#sponsor .row .card-body h5 {
+  font-family: "Poppins", sans-serif;
   font-size: 1.6em;
   font-weight: 500;
   text-align: center;
   color: #e03a3c;
 }
 
-#sponsor .row .card-body p{
+#sponsor .row .card-body p {
   /* font-family: "Poppins",sans-serif; */
   font-size: 1em;
   /* font-weight: 600; */
   line-height: 1.2em;
-  color: #3F4246;
+  color: #3f4246;
   height: 185px;
-  
 }
 
-#sponsor .row a:hover{
+.dark #sponsor .row .card-body p {
+  color: white;
+}
+
+#sponsor .row a:hover {
   text-decoration: none;
 }
 
-#sponsor hr{
-  background-color: #DBDCDE;
+#sponsor hr {
+  background-color: #dbdcde;
   height: 0.9px;
   margin-top: 2em;
   margin-bottom: 2em;
 }
 
-#sponsor .tab{
+#sponsor .tab {
   margin-left: 1.5em;
 }
 
@@ -258,7 +266,7 @@
 /* Hide scrollbar for IE, Edge and Firefox */
 /* #sponsor  .row .card-body {
   -ms-overflow-style: none;  /* IE and Edge */
-  /*scrollbar-width: none;  /* Firefox */
+/*scrollbar-width: none;  /* Firefox */
 /*} */
 /* 
 #sponsor hr{
@@ -316,41 +324,40 @@ transform: translateX(0);
   font-size: 1em;
 } */
 
-.owl-theme .owl-controls{
+.owl-theme .owl-controls {
   margin-top: 10px;
 }
-.owl-theme .owl-controls .owl-page span{
+.owl-theme .owl-controls .owl-page span {
   background: #5e5f5f;
   opacity: 1;
   transition: all 0.4s ease 0s;
 }
 .owl-theme .owl-controls .owl-page.active span,
-.owl-theme .owl-controls.clickable .owl-page:hover span{
+.owl-theme .owl-controls.clickable .owl-page:hover span {
   background: #ed5360;
 }
-.owl-theme .owl-controls .owl-page.active span{
+.owl-theme .owl-controls .owl-page.active span {
   width: 22px;
   height: 12px;
 }
 
-.owl-pagination{
-    padding-bottom: 25px;
+.owl-pagination {
+  padding-bottom: 25px;
 }
 
-  
-#sponsor  .row .card-body p::-webkit-scrollbar {
+#sponsor .row .card-body p::-webkit-scrollbar {
   width: 5px;
-background-color: #F5F5F5;
+  background-color: #f5f5f5;
 }
 
-#sponsor  .row .card-body p::-webkit-scrollbar-track {
+#sponsor .row .card-body p::-webkit-scrollbar-track {
   -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
-border-radius: 10px;
-background-color: white;
+  border-radius: 10px;
+  background-color: white;
 }
 
-#sponsor  .row .card-body p::-webkit-scrollbar-thumb {
+#sponsor .row .card-body p::-webkit-scrollbar-thumb {
   border-radius: 10px;
--webkit-box-shadow: inset 0 0 6px rgba(255, 243, 243, 0.3);
-background-color: #D62929;
-}
\ No newline at end of file
+  -webkit-box-shadow: inset 0 0 6px rgba(255, 243, 243, 0.3);
+  background-color: #d62929;
+}
diff --git a/static/css/style.css b/static/css/style.css
index c5975679..790a379d 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -2,7 +2,7 @@
 # Preloader
 --------------------------------------------------------------*/
 
-.loader{
+.loader {
   position: fixed;
   top: 0;
   left: 0;
@@ -19,8 +19,8 @@
   animation: vanish 1s forwards;
 }
 @keyframes vanish {
-  100%{
-    opacity:0;
+  100% {
+    opacity: 0;
     visibility: hidden;
     display: none;
   }
@@ -32,38 +32,57 @@
 # Navigation bar
 --------------------------------------------------------------*/
 
-.navbar{ 
-    background-color: #fff;
+.bi {
+  fill: #000;
+}
+
+.dark .bi {
+  fill: #fff;
+}
+
+.navbar {
+  background-color: #fff;
 }
 
 /* Nav Items */
-#navbarNavDropdown .nav-item a{
-    font-family: "Open Sans", sans-serif;
-    color:#111111;
+#navbarNavDropdown .nav-item a {
+  font-family: "Open Sans", sans-serif;
+  color: #111111;
+}
+
+.dark #navbarNavDropdown .nav-item a {
+  font-family: "Open Sans", sans-serif;
+  color: whitesmoke !important;
 }
 
 /* Donate Link */
-#navbarNavDropdown #donate a{
+#navbarNavDropdown #donate a {
   font-weight: 600;
   color: #d90429;
 }
 
 /* Nav Items Hover */
-#navbarNavDropdown .nav-item a:hover{
-color: #e76668;
+#navbarNavDropdown .nav-item a:hover {
+  color: #e76668;
 }
 
 /* Current Active Page */
-#navbarNavDropdown .navbar-nav .active a{
-  color:  #e03a3c;
+#navbarNavDropdown .navbar-nav .active a {
+  color: #e03a3c;
 }
 
-#navbarNavDropdown .dropdown-item{
-  background-color: white;
+.dark .dropdown-menu {
+  background-color: #111111 !important;
 }
 
-.pr-7{
-  padding-right: 0.7rem!important;
+.dark #navbarNavDropdown .nav-item a:hover {
+  background-color: #3b3b3b !important;
+  color: #e76668 !important;
+  border-radius: 40px;
+}
+
+.pr-7 {
+  padding-right: 0.7rem !important;
 }
 
 /*--------------------------------------------------------------
@@ -114,17 +133,17 @@ color: #e76668;
 --------------------------------------------------------------*/
 
 /*donate starts*/
-#donat .d-flex h2{
+#donat .d-flex h2 {
   color: #333;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid;
+  border-bottom: #e03a3c 5px solid;
 }
 
-#donat .d-flex h3{
+#donat .d-flex h3 {
   color: #16324f;
   font-size: 20px;
   font-weight: bold;
@@ -133,6 +152,11 @@ color: #e76668;
   margin-left: 10px;
 }
 
+.dark .donat .d-flex h2,
+.dark .donat .d-flex h3 {
+  color: whitesmoke;
+}
+
 .donat .info-box {
   color: #444444;
   box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
@@ -140,8 +164,8 @@ color: #e76668;
   border-radius: 4px;
 }
 
-.donat .info-box .bank-details{
-  background-color: #F7F7F7;
+.donat .info-box .bank-details {
+  background-color: #f7f7f7;
   color: #333;
   font-weight: bold;
   margin: 20px;
@@ -150,35 +174,35 @@ color: #e76668;
 
 .donat .icon-box {
   font-size: 150px;
-  color: #CCCCCC;
+  color: #cccccc;
   border-radius: 50%;
   padding: 8px;
   text-align: center;
 }
 
-.donat .bank-details .acc-details{
+.donat .bank-details .acc-details {
   color: black;
   margin: 20px;
   padding: 30px;
   font-weight: normal;
 }
 
-.donat .info-box .upi-details{
-  background-color: #F7F7F7;
+.donat .info-box .upi-details {
+  background-color: #f7f7f7;
   color: #333;
   font-weight: bold;
   margin: 20px;
   padding: 20px;
 }
 
-.donat .upi-details .upi-no{
+.donat .upi-details .upi-no {
   color: black;
   margin: 20px;
   padding: 30px;
   font-weight: normal;
 }
 
-.donat .qr-code{
+.donat .qr-code {
   background-color: white;
   height: 300px;
   min-height: 200px;
@@ -190,60 +214,68 @@ color: #e76668;
   text-align: center;
 }
 
-.donat .qr-code-img{
+.donat .info-box,
+.donat .info-box .bank-details,
+.donat .info-box .upi-details,
+.donat .qr-code {
+  color: whitesmoke;
+}
+
+.donat .qr-code-img {
   height: 60%;
-  position:relative;
+  position: relative;
   margin-top: 0%;
 }
 
-.donat .upi-logo{
+.donat .upi-logo {
   margin-top: 5px;
   height: 6%;
 }
+
 /*donate ends*/
 
 /*donate msg starts*/
 #message .carousel-img {
   width: 15%;
   height: 15%;
-  }
+}
 
-#message .carousel-indicators li{
+#message .carousel-indicators li {
   background-color: #16324f;
 }
 
-#message .carousel-icon i{
+#message .carousel-icon i {
   color: #16324f;
   font-size: 30px;
 }
 
-#message .d-flex h3{
+#message .d-flex h3 {
   color: #333;
   font-weight: bold;
   font-family: "Roboto", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 2px solid;
+  border-bottom: #e03a3c 2px solid;
 }
 
 #message .message-box {
-	position: relative;
-	padding: 60px;
+  position: relative;
+  padding: 60px;
   margin-top: -40px;
   text-align: center;
 }
 
 #message .message-box h3 {
-	margin-top: 15px;
+  margin-top: 15px;
   margin-bottom: 25px;
   color: #16324f;
   font-size: 25px;
-	font-weight: bold;
+  font-weight: bold;
 }
 
 #message .message-box h4 {
-	margin-top: 15px;
+  margin-top: 15px;
   margin-bottom: 25px;
   font-size: 15px;
   font-family: "Roboto", sans-serif;
@@ -256,15 +288,15 @@ color: #e76668;
 }
 
 #message .message-box:after {
-	content: '';
-	position: absolute;
-	left: 20px;
-	right: 20px;
-	bottom: 0;
-	top: 103px;
-	background-color: #f6f6f6;
-	border: 1px solid rgba(251, 90, 13, .1);
-	border-radius: 10px;
+  content: "";
+  position: absolute;
+  left: 20px;
+  right: 20px;
+  bottom: 0;
+  top: 103px;
+  background-color: #f6f6f6;
+  border: 1px solid rgba(251, 90, 13, 0.1);
+  border-radius: 10px;
   z-index: -1;
 }
 
@@ -291,7 +323,7 @@ color: #e76668;
 }
 
 #footer .footer-top .first::after {
-  content: '';
+  content: "";
   position: absolute;
   display: block;
   width: 90px;
@@ -301,7 +333,7 @@ color: #e76668;
   left: 0;
 }
 #footer .footer-top .second::after {
-  content: '';
+  content: "";
   position: absolute;
   display: block;
   width: 104px;
@@ -311,7 +343,7 @@ color: #e76668;
   left: 0;
 }
 #footer .footer-top .third::after {
-  content: '';
+  content: "";
   position: absolute;
   display: block;
   width: 154px;
@@ -385,40 +417,40 @@ color: #e76668;
   color: #fff;
   text-decoration: none;
 }
-@media (max-width: 768px){
-  .mid768{
+@media (max-width: 768px) {
+  .mid768 {
     display: flex;
     flex-direction: column;
     align-items: center;
   }
   #rows {
     display: flex;
-    flex-wrap: wrap; 
-    justify-content: space-between; 
+    flex-wrap: wrap;
+    justify-content: space-between;
     align-items: center;
   }
-  
+
   .footer-links {
     display: flex;
-    justify-content: center; 
-    align-items: center; 
-    width: 100%; 
+    justify-content: center;
+    align-items: center;
+    width: 100%;
     padding: 10px;
   }
   .col-lg-3 {
-    flex: 0 0 100%; 
-    margin-bottom: 10px; 
+    flex: 0 0 100%;
+    margin-bottom: 10px;
   }
 
   .footer-links:nth-child(1),
   .footer-links:nth-child(4) {
-    flex: 0 0 100%; 
+    flex: 0 0 100%;
   }
 
   .footer-links:nth-child(2),
   .footer-links:nth-child(3) {
     flex: 0 0 48%;
-    margin: 0 1%; 
+    margin: 0 1%;
   }
 }
 
@@ -426,17 +458,16 @@ color: #e76668;
 # Pagination
 --------------------------------------------------------------*/
 
- .pagination-container{
+.pagination-container {
   margin: 30px auto;
-	text-align: center;
+  text-align: center;
 }
-	
-        
- .pagination{
+
+.pagination {
   position: relative;
 }
 
- .pagination a{
+.pagination a {
   position: relative;
   display: inline-block;
   color: #e03a3c !important;
@@ -445,38 +476,36 @@ color: #e76668;
   padding: 8px 16px 10px;
 }
 
-.pagination a::before
-    {
-      z-index: -1;
-			position: absolute;
-			height: 100%;
-			width: 100%;
-			content: "";
-			top: 0;
-			left: 0;
-			background-color: #e03a3c;
-			border-radius: 24px;
-			transform: scale(0)	;				
-			transition: all 0.2s;
-    }
-
-    .pagination a:hover,
-    .pagination a .pagination-active {
-      color: #fff !important;
-    }
-    .pagination a:hover:before,
-    .pagination a .pagination-active:before {
-      transform: scale(0.5);
-    }
-    .pagination .pagination-active {
-      color: #fff !important;
-    }
-    .pagination .pagination-active:before {
-      transform: scale(1);
-    }
-		            
-	
- /* .pagination-newer{
+.pagination a::before {
+  z-index: -1;
+  position: absolute;
+  height: 100%;
+  width: 100%;
+  content: "";
+  top: 0;
+  left: 0;
+  background-color: #e03a3c;
+  border-radius: 24px;
+  transform: scale(0);
+  transition: all 0.2s;
+}
+
+.pagination a:hover,
+.pagination a .pagination-active {
+  color: #fff !important;
+}
+.pagination a:hover:before,
+.pagination a .pagination-active:before {
+  transform: scale(0.5);
+}
+.pagination .pagination-active {
+  color: #fff !important;
+}
+.pagination .pagination-active:before {
+  transform: scale(1);
+}
+
+/* .pagination-newer{
   margin-right: 50px;
 }
 	
@@ -485,3 +514,80 @@ color: #e76668;
 	margin-left: 50px;
 }
 */
+
+#darkmode-label {
+  width: 70px;
+  height: 30px;
+  position: relative;
+  display: block;
+  background: #ebebeb;
+  border-radius: 50px;
+  box-shadow: inset 0px 5px 15px rgba(0, 0, 0, 0.1),
+    inset 0px -5px 15px rgba(255, 255, 255, 0.1);
+  transition: 0.3s;
+  top: 5px;
+}
+
+#darkmode-label:after {
+  content: "";
+  height: 25px;
+  width: 25px;
+  position: absolute;
+  top: 2.8px;
+  left: 5px;
+  border-radius: 50%;
+  background: linear-gradient(180deg, #ffd105, #ffa621);
+  box-shadow: inset 0px 5px 10px rgba(0, 0, 0, 0);
+  transition: 0.3s;
+}
+
+input {
+  width: 0;
+  height: 0;
+  visibility: hidden;
+  position: absolute;
+}
+
+#darkmode-toggle:checked + #darkmode-label {
+  background-color: #565454;
+}
+
+#darkmode-toggle:checked + #darkmode-label:after {
+  left: 66px;
+  transform: translateX(-100%);
+  background: linear-gradient(180deg, #aaaaaa, #636262);
+}
+
+#darkmode-label svg {
+  position: relative;
+  width: 20px;
+  height: 20px;
+  top: 1px;
+  z-index: 10000;
+}
+
+#darkmode-label svg.sun {
+  left: 7.5px;
+  fill: #fff;
+  transition: 0.3s;
+}
+
+#darkmode-label svg.moon {
+  left: 20px;
+  fill: #7e7e7e;
+  transition: 0.3s;
+}
+
+#darkmode-toggle:checked + #darkmode-label svg.sun {
+  fill: #7e7e7e;
+}
+
+#darkmode-toggle:checked + #darkmode-label svg.moon {
+  fill: #fff;
+}
+
+.dark body,
+.dark .navbar {
+  background-color: black !important;
+  color: white !important;
+}
diff --git a/static/css/teams.css b/static/css/teams.css
index b84064ef..68f015e3 100644
--- a/static/css/teams.css
+++ b/static/css/teams.css
@@ -1,147 +1,153 @@
 /*--------------------------------------------------------------
 # Other Teams
 --------------------------------------------------------------*/
-.title .d-flex h2{
-    color: #333;
-    font-weight: 600;
-    font-family: "Poppins", sans-serif;
-    word-spacing: 10px;
-    letter-spacing: 2px;
-    line-height: 180%;
-    border-bottom:#e03a3c 5px solid
-  }
-  
-  section{
-	padding: 60px 0;
-}
-
-.accordion{
-    box-shadow: 0px 2px 12px rgb(0 0 0 / 30%);
+.title .d-flex h2 {
+  color: #333;
+  font-weight: 600;
+  font-family: "Poppins", sans-serif;
+  word-spacing: 10px;
+  letter-spacing: 2px;
+  line-height: 180%;
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark .title .d-flex h2 {
+  color: white;
+}
+
+section {
+  padding: 60px 0;
+}
+
+.accordion {
+  box-shadow: 0px 2px 12px rgb(0 0 0 / 30%);
 }
 /* #accordion-style-1 h1,
 #accordion-style-1 a{
     color:hsl(0, 62%, 51%);
 } */
 #accordion-style-1 .btn-link {
-    font-weight: 400;
-    color: #d03535;
-    background-color: transparent;
-    text-decoration: none !important;
-    font-size: 21px;
-    font-weight: bold;
-	padding-left: 25px;
+  font-weight: 400;
+  color: #d03535;
+  background-color: transparent;
+  text-decoration: none !important;
+  font-size: 21px;
+  font-weight: bold;
+  padding-left: 25px;
 }
 
 /* #accordion-style-1 .card-body {
     border-top: 2px solid #d03535;
 } */
 
-#accordion-style-1 .card-header .btn.collapsed .fa.main{
-	display:none;
+#accordion-style-1 .card-header .btn.collapsed .fa.main {
+  display: none;
 }
 
-#accordion-style-1 .card-header .btn .fa.main{
-	background: #e03a3c;
-    padding: 11px 10px;
-    color: #ffffff;
-    width: 35px;
-    height: 41px;
-    position: absolute;
-    left: -1px;
-    top: 10px;
-    border-top-right-radius: 7px;
-    border-bottom-right-radius: 7px;
-	display:block;
+#accordion-style-1 .card-header .btn .fa.main {
+  background: #e03a3c;
+  padding: 11px 10px;
+  color: #ffffff;
+  width: 35px;
+  height: 41px;
+  position: absolute;
+  left: -1px;
+  top: 10px;
+  border-top-right-radius: 7px;
+  border-bottom-right-radius: 7px;
+  display: block;
 }
-.others{
-    padding: 50px 0px;
+.others {
+  padding: 50px 0px;
 }
 .btn:focus {
-    outline: none;
-    box-shadow: none;
+  outline: none;
+  box-shadow: none;
+}
+
+.dark #accordionExample .card {
+  background-color: #1b1b1b;
 }
 
 /* --------------------------- */
 
 .team .member {
-    margin-bottom: 20px;
-    overflow: hidden;
-    border-radius: 5px;
-    background: #fff;
-    background: #cc1a1c;
-    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.3);
-  }
-.team .member:hover{
-    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.8);
-    transition: 0.3s;
-}
-  
-  .team .member .member-img {
-    position: relative;
-    overflow: hidden;
-  }
-  
-  .team .member .social {
-    position: absolute;
-    left: 0;
-    bottom: 30px;
-    right: 0;
-    opacity: 0;
-    transition: ease-in-out 0.3s;
-    text-align: center;
-  }
-  
-  .team .member .social a {
-    transition: color 0.3s;
-    color: #111111;
-    margin: 0 3px;
-    padding-top: 7px;
-    border-radius: 50px;
-    width: 36px;
-    height: 36px;
-    background: #e03a3c;
-    display: inline-block;
-    transition: ease-in-out 0.3s;
-    color: #fff;
-  }
-  
-  .team .member .social a:hover {
-    background: #111111;
-  }
-  
-  .team .member .social i {
-    font-size: 18px;
-  }
-  
-  .team .member .member-info {
-    padding: 20px 15px;
-  }
-  
-  .team .member .member-info h4 {
-    font-weight: 650;
-    margin-bottom: 5px;
-    font-size: 21px;
-    color: white;
-    letter-spacing: 1px;
-  }
-  
-  .team .member .member-info span {
-    display: block;
-    font-size: 14px;
-    font-weight: 400;
-    color: #efe2e2;
-  }
-  
-  .team .member .member-info p {
-    font-style: italic;
-    font-size: 14px;
-    line-height: 26px;
-    color: #777777;
-  }
-  
-  .team .member:hover .social {
-    opacity: 1;
-    bottom: 15px;
-  }
-  
-  
\ No newline at end of file
+  margin-bottom: 20px;
+  overflow: hidden;
+  border-radius: 5px;
+  background: #fff;
+  background: #cc1a1c;
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.3);
+}
+.team .member:hover {
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.8);
+  transition: 0.3s;
+}
+
+.team .member .member-img {
+  position: relative;
+  overflow: hidden;
+}
+
+.team .member .social {
+  position: absolute;
+  left: 0;
+  bottom: 30px;
+  right: 0;
+  opacity: 0;
+  transition: ease-in-out 0.3s;
+  text-align: center;
+}
+
+.team .member .social a {
+  transition: color 0.3s;
+  color: #111111;
+  margin: 0 3px;
+  padding-top: 7px;
+  border-radius: 50px;
+  width: 36px;
+  height: 36px;
+  background: #e03a3c;
+  display: inline-block;
+  transition: ease-in-out 0.3s;
+  color: #fff;
+}
+
+.team .member .social a:hover {
+  background: #111111;
+}
+
+.team .member .social i {
+  font-size: 18px;
+}
+
+.team .member .member-info {
+  padding: 20px 15px;
+}
+
+.team .member .member-info h4 {
+  font-weight: 650;
+  margin-bottom: 5px;
+  font-size: 21px;
+  color: white;
+  letter-spacing: 1px;
+}
+
+.team .member .member-info span {
+  display: block;
+  font-size: 14px;
+  font-weight: 400;
+  color: #efe2e2;
+}
+
+.team .member .member-info p {
+  font-style: italic;
+  font-size: 14px;
+  line-height: 26px;
+  color: #777777;
+}
+
+.team .member:hover .social {
+  opacity: 1;
+  bottom: 15px;
+}
diff --git a/static/css/testimonial.css b/static/css/testimonial.css
index 7427976d..43e2bd52 100644
--- a/static/css/testimonial.css
+++ b/static/css/testimonial.css
@@ -1,52 +1,60 @@
-
 /*--------------------------------------------------------------
 # Testimonials
 --------------------------------------------------------------*/
 
 /* Heading */
-.testimonials .d-flex h2{
+.testimonials .d-flex h2 {
   color: #333;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 180%;
-  border-bottom:#e03a3c 5px solid
+  border-bottom: #e03a3c 5px solid;
+}
+
+.dark .testimonials .d-flex h2 {
+  color: white;
 }
 
 /* -------------------------------------------------------------------------------------------------- */
 
-.testimonial{
-    text-align: center;
-    padding: 80px 50px 30px 70px;
-    margin: 70px 15px 35px;
-    background: #fff3f3;
-    box-shadow: 6px 4px 0 0 #ed5360;
-    /* box-shadow: 5px 4px rgba(255, 0, 0, 0.8); */
-    position: relative;
-}
-.testimonial .pic{
-    width: 120px;
-    height: 120px;
-    border: 5px solid #ed5360;
-    margin: 0 auto;
-    position: absolute;
-    top: -60px;
-    left: 0;
-    right: 0;
-}
-.testimonial .pic img{
-    width: 100%;
-    height: auto;
-}
-.testimonial .description{
-    font-size: 15px;
-    color: #1d1d1d;
-    line-height: 27px;
-    margin-bottom: 20px;
-    position: relative;
-    overflow-y: scroll;
-    height: 185px;
+.testimonial {
+  text-align: center;
+  padding: 80px 50px 30px 70px;
+  margin: 70px 15px 35px;
+  background: #fff3f3;
+  box-shadow: 6px 4px 0 0 #ed5360;
+  /* box-shadow: 5px 4px rgba(255, 0, 0, 0.8); */
+  position: relative;
+}
+
+.dark .testimonial {
+  background: #a5a4a4;
+}
+
+.testimonial .pic {
+  width: 120px;
+  height: 120px;
+  border: 5px solid #ed5360;
+  margin: 0 auto;
+  position: absolute;
+  top: -60px;
+  left: 0;
+  right: 0;
+}
+.testimonial .pic img {
+  width: 100%;
+  height: auto;
+}
+.testimonial .description {
+  font-size: 15px;
+  color: #1d1d1d;
+  line-height: 27px;
+  margin-bottom: 20px;
+  position: relative;
+  overflow-y: scroll;
+  height: 185px;
 }
 /* .description::-webkit-scrollbar {
     display: none;
@@ -57,128 +65,127 @@
     scrollbar-width: none;  
 } */
 
-.testimonial .description:before{
-    content: "\f10d";
-    font-family: "FontAwesome";
-    font-size: 32px;
-    color: #ed5360;
-    position: fixed;
-    /* top: -15px; */
-    /* left: -35px; */
-    width: inherit;
-    height: inherit;
-    margin: -30px;
-}
-.testimonial .testimonial-profile{
-    position: relative;
-    margin: 20px 0 10px 0;
-}
-.testimonial .testimonial-profile:after{
-    content: "";
-    width: 50px;
-    height: 2px;
-    background: #ed5360;
-    margin: 0 auto;
-    position: absolute;
-    bottom: -20px;
-    left: 0;
-    right: 0;
-}
-.testimonial .title{
-    display: inline-block;
-    font-size: 18px;
-    color: #832828;
-    letter-spacing: 1px;
-    text-transform: uppercase;
-    margin: 0;
-}
-
-.testimonial .post{
-    display: inline-block;
-    font-size: 15px;
-    color: #757575;
-    text-transform: capitalize;
-}
-.testimonial .year{
-    color: #757575;
-    margin-top: 7px;
-    font-size: 0.9rem;
-}
-.owl-theme .owl-controls{
-    margin-top: 10px;
-}
-.owl-theme .owl-controls .owl-page span{
-    background: #5e5f5f;
-    opacity: 1;
-    transition: all 0.4s ease 0s;
+.testimonial .description:before {
+  content: "\f10d";
+  font-family: "FontAwesome";
+  font-size: 32px;
+  color: #ed5360;
+  position: fixed;
+  /* top: -15px; */
+  /* left: -35px; */
+  width: inherit;
+  height: inherit;
+  margin: -30px;
+}
+.testimonial .testimonial-profile {
+  position: relative;
+  margin: 20px 0 10px 0;
+}
+.testimonial .testimonial-profile:after {
+  content: "";
+  width: 50px;
+  height: 2px;
+  background: #ed5360;
+  margin: 0 auto;
+  position: absolute;
+  bottom: -20px;
+  left: 0;
+  right: 0;
+}
+.testimonial .title {
+  display: inline-block;
+  font-size: 18px;
+  color: #832828;
+  letter-spacing: 1px;
+  text-transform: uppercase;
+  margin: 0;
+}
+
+.testimonial .post {
+  display: inline-block;
+  font-size: 15px;
+  color: #757575;
+  text-transform: capitalize;
+}
+.testimonial .year {
+  color: #757575;
+  margin-top: 7px;
+  font-size: 0.9rem;
+}
+.owl-theme .owl-controls {
+  margin-top: 10px;
+}
+.owl-theme .owl-controls .owl-page span {
+  background: #5e5f5f;
+  opacity: 1;
+  transition: all 0.4s ease 0s;
 }
 .owl-theme .owl-controls .owl-page.active span,
-.owl-theme .owl-controls.clickable .owl-page:hover span{
-    background: #ed5360;
+.owl-theme .owl-controls.clickable .owl-page:hover span {
+  background: #ed5360;
 }
-.owl-theme .owl-controls .owl-page.active span{
-    width: 22px;
-    height: 12px;
+.owl-theme .owl-controls .owl-page.active span {
+  width: 22px;
+  height: 12px;
 }
 
 .testimonial-profile .social {
-    left: 0;
-    right: 0;
-    transition: ease-in-out 0.3s;
-    text-align: center;
-  }
-  
-  .testimonial-profile .social a {
-    transition: color 0.3s;
-    color: #111111;
-    margin: 0 3px;
-    padding-top: 7px;
-    border-radius: 50px;
-    width: 36px;
-    height: 36px;
-    background: #e03a3c;
-    display: inline-block;
-    transition: ease-in-out 0.3s;
-    color: #fff;
-  }
-  
-  .testimonial-profile .social a:hover {
-    background: #111111;
-  }
-  
-  .testimonial-profile .social i {
-    font-size: 18px;
-  }
-  .owl-pagination{
-      padding-bottom: 25px;
-  }
+  left: 0;
+  right: 0;
+  transition: ease-in-out 0.3s;
+  text-align: center;
+}
+
+.testimonial-profile .social a {
+  transition: color 0.3s;
+  color: #111111;
+  margin: 0 3px;
+  padding-top: 7px;
+  border-radius: 50px;
+  width: 36px;
+  height: 36px;
+  background: #e03a3c;
+  display: inline-block;
+  transition: ease-in-out 0.3s;
+  color: #fff;
+}
 
+.testimonial-profile .social a:hover {
+  background: #111111;
+}
+
+.testimonial-profile .social i {
+  font-size: 18px;
+}
+.owl-pagination {
+  padding-bottom: 25px;
+}
 
 .description::-webkit-scrollbar {
-    width: 5px;
-	background-color: #F5F5F5;
+  width: 5px;
+  background-color: #f5f5f5;
 }
- 
+
 .description::-webkit-scrollbar-track {
-    -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
-	border-radius: 10px;
-	background-color: #F5F5F5;
+  -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
+  border-radius: 10px;
+  background-color: #f5f5f5;
 }
- 
+
 .description::-webkit-scrollbar-thumb {
-    border-radius: 10px;
-	-webkit-box-shadow: inset 0 0 6px rgba(255, 243, 243, 0.3);
-	background-color: #D62929;
+  border-radius: 10px;
+  -webkit-box-shadow: inset 0 0 6px rgba(255, 243, 243, 0.3);
+  background-color: #d62929;
 }
 .description {
-    overflow-y:scroll;
-    }
-    
-.description {
-    /* scrollbar-color:red yellow;
-    scrollbar-width:5px; */
+  overflow-y: scroll;
 }
 
-span{
-    margin: 0 -10px;
-}
\ No newline at end of file
+/* .description {
+    scrollbar-color:red yellow;
+    scrollbar-width:5px;
+} */
+
+span {
+  margin: 0 -10px;
+}
diff --git a/static/js/base.js b/static/js/base.js
index 4eb6d82a..01abe730 100644
--- a/static/js/base.js
+++ b/static/js/base.js
@@ -1,21 +1,19 @@
-var wow = new WOW(
-    {
-        boxClass: 'wow',      // animated element css class (default is wow)
-        animateClass: 'animated', // animation css class (default is animated)
-        offset: 0,          // distance to the element when triggering the animation (default is 0)
-        mobile: true,       // trigger animations on mobile devices (default is true)
-        live: true,       // act on asynchronously loaded content (default is true)
-        callback: function (box) {
-            // the callback is fired every time an animation is started
-            // the argument that is passed in is the DOM node being animated
-        },
-        scrollContainer: null // optional scroll container selector, otherwise use window
-    }
-);
-
-// $(window).on('load', function () { // makes sure the whole site is loaded 
-//     $('#status').fadeOut(); // will first fade out the loading animation 
-//     $('#preloader').delay(350).fadeOut('slow'); // will fade out the white DIV that covers the website. 
+var wow = new WOW({
+  boxClass: "wow", // animated element css class (default is wow)
+  animateClass: "animated", // animation css class (default is animated)
+  offset: 0, // distance to the element when triggering the animation (default is 0)
+  mobile: true, // trigger animations on mobile devices (default is true)
+  live: true, // act on asynchronously loaded content (default is true)
+  callback: function (box) {
+    // the callback is fired every time an animation is started
+    // the argument that is passed in is the DOM node being animated
+  },
+  scrollContainer: null, // optional scroll container selector, otherwise use window
+});
+
+// $(window).on('load', function () { // makes sure the whole site is loaded
+//     $('#status').fadeOut(); // will first fade out the loading animation
+//     $('#preloader').delay(350).fadeOut('slow'); // will fade out the white DIV that covers the website.
 //     $('body').delay(100).css({ 'overflow': 'visible' });
 // })
 var loader = document.querySelector(".loader");
@@ -23,9 +21,31 @@ var loader = document.querySelector(".loader");
 window.addEventListener("load", vanish);
 
 function vanish() {
-    wow.init();
-    // loader.fadeOut("slow");
-    // preloader.fadeOut("slow");
-    // bod.css({'overflow': 'visible'});
-    loader.classList.add("disappear");
+  wow.init();
+  // loader.fadeOut("slow");
+  // preloader.fadeOut("slow");
+  // bod.css({'overflow': 'visible'});
+  loader.classList.add("disappear");
 }
+
+let darkmode = localStorage.getItem("darkmode");
+const themeSwitch = document.getElementById("darkmode-toggle");
+
+const enableDarkmode = () => {
+  document.getElementById("darkmode-toggle").checked = true;
+  document.querySelector("html").classList.add("dark");
+  localStorage.setItem("darkmode", "active");
+};
+
+const disableDarkmode = () => {
+  document.getElementById("darkmode-toggle").checked = false;
+  document.querySelector("html").classList.remove("dark");
+  localStorage.setItem("darkmode", "inactive");
+};
+
+if (darkmode === "active") enableDarkmode();
+
+themeSwitch.addEventListener("change", () => {
+  darkmode = localStorage.getItem("darkmode");
+  darkmode !== "active" ? enableDarkmode() : disableDarkmode();
+});
diff --git a/templates/base.html b/templates/base.html
index 65c538b9..b395c953 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -60,7 +60,7 @@
 
       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown"
         aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation" style="border: none;">
-        <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="#000" class="bi bi-justify"
+        <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" class="bi bi-justify"
           viewBox="0 0 16 16" style="border: none;">
           <path fill-rule="evenodd"
             d="M2 12.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z" />
@@ -169,6 +169,26 @@
               </li>
             </ul>
           </li>
+          <li>
+            <input type="checkbox" class="nav-item" id="darkmode-toggle">
+            <label for="darkmode-toggle" id="darkmode-label">
+              <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
+              <!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+              <svg class="sun" fill="none" width="800px" height="800px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+              
+              <g id="SVGRepo_bgCarrier" stroke-width="0"/>
+              
+              <g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+              
+              <g id="SVGRepo_iconCarrier"> <path d="M11 1C11 0.447715 11.4477 0 12 0C12.5523 0 13 0.447715 13 1V3C13 3.55228 12.5523 4 12 4C11.4477 4 11 3.55228 11 3V1Z" fill="#0F0F0F"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M18 12C18 15.3137 15.3137 18 12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12ZM8.06167 12C8.06167 14.1751 9.82492 15.9383 12 15.9383C14.1751 15.9383 15.9383 14.1751 15.9383 12C15.9383 9.82492 14.1751 8.06167 12 8.06167C9.82492 8.06167 8.06167 9.82492 8.06167 12Z" fill="#0F0F0F"/> <path d="M20.4853 3.51472C20.0947 3.12419 19.4616 3.12419 19.0711 3.51472L17.6568 4.92893C17.2663 5.31946 17.2663 5.95262 17.6568 6.34315C18.0474 6.73367 18.6805 6.73367 19.0711 6.34315L20.4853 4.92893C20.8758 4.53841 20.8758 3.90524 20.4853 3.51472Z" fill="#0F0F0F"/> <path d="M1 13C0.447715 13 0 12.5523 0 12C0 11.4477 0.447715 11 1 11H3C3.55228 11 4 11.4477 4 12C4 12.5523 3.55228 13 3 13H1Z" fill="#0F0F0F"/> <path d="M3.51472 3.51472C3.1242 3.90524 3.1242 4.53841 3.51472 4.92893L4.92894 6.34315C5.31946 6.73367 5.95263 6.73367 6.34315 6.34315C6.73368 5.95262 6.73368 5.31946 6.34315 4.92893L4.92894 3.51472C4.53841 3.12419 3.90525 3.12419 3.51472 3.51472Z" fill="#0F0F0F"/> <path d="M11 21C11 20.4477 11.4477 20 12 20C12.5523 20 13 20.4477 13 21V23C13 23.5523 12.5523 24 12 24C11.4477 24 11 23.5523 11 23V21Z" fill="#0F0F0F"/> <path d="M6.34315 17.6569C5.95263 17.2663 5.31946 17.2663 4.92894 17.6569L3.51473 19.0711C3.1242 19.4616 3.1242 20.0948 3.51473 20.4853C3.90525 20.8758 4.53842 20.8758 4.92894 20.4853L6.34315 19.0711C6.73368 18.6805 6.73368 18.0474 6.34315 17.6569Z" fill="#0F0F0F"/> <path d="M21 13C20.4477 13 20 12.5523 20 12C20 11.4477 20.4477 11 21 11H23C23.5523 11 24 11.4477 24 12C24 12.5523 23.5523 13 23 13H21Z" fill="#0F0F0F"/> <path d="M17.6568 17.6569C17.2663 18.0474 17.2663 18.6805 17.6568 19.0711L19.0711 20.4853C19.4616 20.8758 20.0947 20.8758 20.4853 20.4853C20.8758 20.0948 20.8758 19.4616 20.4853 19.0711L19.0711 17.6569C18.6805 17.2663 18.0474 17.2663 17.6568 17.6569Z" fill="#0F0F0F"/> </g>
+              
+              </svg>
+              <?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+              <svg class="moon" width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M3.32031 11.6835C3.32031 16.6541 7.34975 20.6835 12.3203 20.6835C16.1075 20.6835 19.3483 18.3443 20.6768 15.032C19.6402 15.4486 18.5059 15.6834 17.3203 15.6834C12.3497 15.6834 8.32031 11.654 8.32031 6.68342C8.32031 5.50338 8.55165 4.36259 8.96453 3.32996C5.65605 4.66028 3.32031 7.89912 3.32031 11.6835Z" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+              </svg></label>
+          </li>
           <li class="nav-item {% if request.resolver_match.view_name == 'home:collaborate' %}active{% endif %} pr-7"
             id="donate">
             <a class="nav-link" href="{% url 'home:collaborate' %}">Collaborate</a>
diff --git a/templates/prosang.html b/templates/prosang.html
index 736fabc3..29ed0505 100644
--- a/templates/prosang.html
+++ b/templates/prosang.html
@@ -28,7 +28,7 @@ <h2 class="full-form">(Prodyogiki Sangam)</h2>
 
 <section id="services" class="services section-bg ">
     <div class="container" data-aos="fade-up">
-        <h4 class="p-3" style="color: black;">Every year ProSang witnesses:</h4>
+        <h4 class="p-3">Every year ProSang witnesses:</h4>
         <div class="row">
             <div class="col-md-6 mt-4 mt-md-0">
                 <div class="icon-box wow pulse" data-wow-delay="0.1">
@@ -87,7 +87,7 @@ <h3>Events by Professionals:</h3>
 
                 <!-- Accordion item 1 -->
                 <div class="card">
-                    <div id="headingOne" class="card-header bg-white shadow-sm border-0">
+                    <div id="headingOne" class="card-header shadow-sm border-0">
                         <h5 class="mb-0 font-weight-bold"><a href="#" data-toggle="collapse" data-target="#collapseOne"
                                 aria-expanded="false" aria-controls="collapseOne"
                                 class="d-block position-relative collapsible-link py-2">ProSang 2020</a></h5>
@@ -169,7 +169,7 @@ <h4>Mr. Vijay Kapoor</h4>
 
                 <!-- Accordion item 2 -->
                 <div class="card">
-                    <div id="headingTwo" class="card-header bg-white shadow-sm border-0">
+                    <div id="headingTwo" class="card-header shadow-sm border-0">
                         <h5 class="mb-0 font-weight-bold"><a href="#" data-toggle="collapse" data-target="#collapseTwo"
                                 aria-expanded="false" aria-controls="collapseTwo"
                                 class="d-block position-relative collapsed collapsible-link py-2">ProSang 2019</a></h5>