morty

1
.modal-overlay {
2
  position: fixed;
3
  top: 0;
4
  left: 0;
5
  width: 100%;
6
  height: 100%;
7
  background-color: rgba(0, 0, 0, 0.5);
8
  z-index: 9999;
9
  display: flex;
10
  justify-content: center;
11
  align-items: center;
12

13
  .modal {
14
    width: 200px;
15
    height: 200px;
16
    background-color: white;
17
    padding: 20px;
18
    border-radius: 5px;
19
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
20
  }
21

22
  .modal-content {
23
    position: relative;
24

25
    .modal-info {
26
      height: 200px;
27
      display: flex;
28
      flex-direction: column;
29
      justify-content: center;
30
      align-items: center;
31
      gap: 40px;
32
    }
33

34
    .more {
35
      font-size: 14px;
36
      padding: 5px 10px 5px 10px;
37
      border-radius: 5px;
38
      border: none;
39
      background-color: #ffff32;
40
      cursor: pointer;
41
      color: #000;
42
      transition: all 0.2s;
43

44
      &:hover {
45
        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
46
      }
47
    }
48
  }
49

50
  .close {
51
    position: absolute;
52
    top: -10px;
53
    right: 0;
54
    cursor: pointer;
55
  }
56
}
57