Blog-Review-Card/Style.css at main · binyamyd/Blog-Review-Card · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
body {
  background-color: hsl(47, 88%, 63%);
  font-size: 16px;
  font-family: "Figtree", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

.container {
  height: 0px;
}
.inner_container {
  background-color: hsl(0, 0%, 100%);
  /* margin: 100px auto; */
  border-radius: 1rem;
  padding: 20px 20px;
  width: 87%;
  box-shadow: 7px 7px;
  border: 1.5px solid;
}

.image_container {
  object-fit: cover;
  padding-bottom: 20px;
}
.image_container img {
  width: 100%;
  border-radius: 1rem;
}

.text_container h2 {
  font-weight: 900;
}
.text_container button {
  background-color: hsl(47, 88%, 63%);
  border: none;
  padding: 8px 15px;
  border-radius: 0.3rem;
  font-weight: 900;
  /* letter-spacing: 0.8px; */
}

.info_paragraph {
  color: hsl(0, 0%, 42%);
}

.name_container {
  display: flex;
  gap: 15px;
  font-weight: 900;
}
.name_container img {
  width: 40px;
  object-fit: contain;
}

@media screen and (min-width: 376px) {
  .container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
  }

  .inner_container {
    width: 41vh;
  }
}