ux_ui_designer

1
.main {
2
  background-image: url("../../assets/images/Background.png");
3
  background-size: cover;
4
  background-repeat: no-repeat;
5
  background-position: center;
6
  border-radius: 0 0 20px 20px;
7

8
  &__content {
9
    margin: 180px auto 0 auto;
10
    max-width: 1400px;
11
    padding: 0 100px;
12
    @media screen and (max-width: 987px) {
13
      padding: 0 50px;
14
    }
15
    @media screen and (max-width: 525px) {
16
      padding: 0 30px;
17
    }
18
    @media screen and (max-width: 414px) {
19
      padding: 0 16px;
20
    }
21
    @media screen and (max-width: 320px) {
22
      padding: 0 10px;
23
    }
24
  }
25

26
  &__title {
27
    font-size: 195px;
28
    font-weight: 100;
29
    letter-spacing: 0.25em;
30
    text-align: center;
31
    color: #eda424;
32
    text-transform: uppercase;
33
    max-width: 1400px;
34
    font-family: "Hoves thin";
35

36
    @media (max-width: 1350px) {
37
      font-size: 180px;
38
    }
39
    @media (max-width: 1276px) {
40
      font-size: 150px;
41
    }
42
    @media (max-width: 1072px) {
43
      font-size: 120px;
44
    }
45
    @media (max-width: 881px) {
46
      font-size: 110px;
47
    }
48
    @media (max-width: 842px) {
49
      font-size: 100px;
50
    }
51
    @media (max-width: 761px) {
52
      font-size: 80px;
53
    }
54
    @media (max-width: 659px) {
55
      font-size: 70px;
56
    }
57
    @media (max-width: 525px) {
58
      font-size: 60px;
59
    }
60
    @media (max-width: 414px) {
61
      font-size: 50px;
62
    }
63
  }
64
  &__subtitle {
65
    color: #a5a5a5;
66
    font-size: 30px;
67
    text-transform: uppercase;
68
    @media (max-width: 414px) {
69
      font-size: 20px;
70
    }
71
  }
72
  &__year {
73
    color: #a5a5a5;
74
    font-size: 17px;
75
    text-transform: uppercase;
76
    padding-top: 211px;
77
    padding-bottom: 50px;
78
  }
79
}
80