diff --git a/public/css/modal.css b/public/css/modal.css
new file mode 100644
index 0000000..79aee1b
--- /dev/null
+++ b/public/css/modal.css
@@ -0,0 +1,48 @@
+/*  MODAL */
+.modal{
+  position:fixed;
+  left:0;
+  top:0;
+  width:100%;
+  height:100%;
+  background:red;
+  background: #5b5b5bde;
+  
+}
+
+.modal-content{
+  position:absolute;
+  top:50%;
+  left:50%;
+  transform: translate(-50%,-50%);
+  background: white;
+  padding: 10px;
+    opacity: 0;
+    display: block;
+      animation: fadeIn 1s forwards;
+}
+
+.modal.no-active{
+display:none;
+
+}
+
+.modal-close{
+  position: absolute;
+top: 0;
+right: 10px;
+font-size: 36px;
+color: var(--main);
+cursor: pointer;
+}
+
+@keyframes fadeIn {
+    from { opacity: 0; }
+      to { opacity: 1;}
+}
+
+@media(max-width:760px){
+  .modal-content{
+    width:95%;
+  }
+}