@@ -201,7 +201,7 @@ a:visited {
   flex: 50%;
   width: 90%;
   height: 100%;
-  background-color: rgba(0, 0, 0, 0.4);
+  background-color: rgba(23, 22, 22, 0.4);
   box-shadow: 0 0 transparent, 0 0 transparent, 0 0 transparent, 0 0 transparent,
     0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
   border-radius: 10px;
@@ -225,6 +225,37 @@ a:visited {
   text-align: left;
 }
 
+.description{
+  width: 100%;
+  height: 80%;
+  top: 0;
+  left: 0;
+  background-color: #2d3436;
+  background-image: linear-gradient(315deg, #2d3436 0%, #000000 74%);
+  display: none;
+  position: absolute;
+  overflow: hidden;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  opacity: 0;
+  /* transition: transform 0.9s ease-in-out 0s; */
+  color: #fff;
+  padding: 10px;
+  border-top-left-radius: 10px;
+  border-top-right-radius: 10px;
+}
+
+.description p{
+  margin: 5px 10px 5px 10px;
+}
+
+.item:hover .description{
+  display: flex;
+  opacity: 1;
+  overflow: hidden;
+}
+
 .main {
   /* padding: 20px;
   width: 90vw; */