1 | * {
|
---|
2 | margin: 0;
|
---|
3 | padding: 0;
|
---|
4 | box-sizing: border-box;
|
---|
5 | scroll-behavior: smooth;
|
---|
6 | font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
|
---|
7 | list-style: none;
|
---|
8 | text-decoration: none;
|
---|
9 | }
|
---|
10 |
|
---|
11 | .container {
|
---|
12 | width: 90%;
|
---|
13 | padding: 2.25rem;
|
---|
14 | margin: 1.0rem auto 5.0rem auto;
|
---|
15 | border: 2px solid black;
|
---|
16 | border-radius: 40px;
|
---|
17 | }
|
---|
18 |
|
---|
19 | #container-section-label {
|
---|
20 | font-size: 2.5rem;
|
---|
21 | margin-bottom: 1.75rem;
|
---|
22 | }
|
---|
23 |
|
---|
24 | .personal-information-container {
|
---|
25 | display: flex;
|
---|
26 | gap: 3.2rem;
|
---|
27 | font-size: 2.25rem;
|
---|
28 | align-items: center;
|
---|
29 | background-color: rgb(251, 251, 251);;
|
---|
30 | border-radius: 40px;
|
---|
31 | }
|
---|
32 |
|
---|
33 | .edit-profile-link {
|
---|
34 | font-size: 1.5rem;
|
---|
35 | color: black;
|
---|
36 | text-decoration: underline;
|
---|
37 | }
|
---|
38 |
|
---|
39 | .edit-profile-link:hover {
|
---|
40 | color: turquoise
|
---|
41 | }
|
---|
42 |
|
---|
43 | .profile-picture-container {
|
---|
44 |
|
---|
45 | }
|
---|
46 |
|
---|
47 | .profile-name-label {
|
---|
48 | font-size: 2.2rem;
|
---|
49 | margin-bottom: 1.35rem;
|
---|
50 | }
|
---|
51 |
|
---|
52 | #profile-picture {
|
---|
53 | width: 10.5rem;
|
---|
54 | height: 10.5rem;
|
---|
55 | border-radius: 50%;
|
---|
56 | padding: 5px 0px 5px 0px;
|
---|
57 | }
|
---|
58 |
|
---|
59 | .personal-information-details {
|
---|
60 | display: flex;
|
---|
61 | gap: 25px;
|
---|
62 | flex-wrap: wrap;
|
---|
63 | }
|
---|
64 |
|
---|
65 | .personal-information-card {
|
---|
66 |
|
---|
67 | }
|
---|
68 |
|
---|
69 | .persononal-information-card-header {
|
---|
70 | font-size: 1.5rem;
|
---|
71 | margin-bottom: 0.5rem;
|
---|
72 | }
|
---|
73 |
|
---|
74 | .personal-information-card-value {
|
---|
75 | font-size: 1.1rem;
|
---|
76 | }
|
---|
77 |
|
---|
78 | .order-information-container {
|
---|
79 |
|
---|
80 | }
|
---|
81 |
|
---|
82 | .order-information {
|
---|
83 | display: grid;
|
---|
84 | grid-template-columns: auto auto;
|
---|
85 | width: 100%;
|
---|
86 | }
|
---|
87 |
|
---|
88 | .order {
|
---|
89 | margin-bottom: 2.1rem;
|
---|
90 | padding: 1rem;
|
---|
91 | border-radius: 40px;
|
---|
92 | background-color: rgb(251, 251, 251);
|
---|
93 | display: flex;
|
---|
94 | flex-direction: row;
|
---|
95 | align-items: center;
|
---|
96 | column-gap: 3.1rem;
|
---|
97 | }
|
---|
98 |
|
---|
99 | .order-card {
|
---|
100 | display: flex;
|
---|
101 | align-items: baseline;
|
---|
102 | gap: 10px;
|
---|
103 | }
|
---|
104 |
|
---|
105 | .order-card-header {
|
---|
106 | font-size: 1.35rem;
|
---|
107 | font-weight: bold;
|
---|
108 | }
|
---|
109 |
|
---|
110 | .order-card-value {
|
---|
111 | font-size: 1.10rem;
|
---|
112 | }
|
---|
113 |
|
---|
114 | header {
|
---|
115 | position: relative;
|
---|
116 | }
|
---|
117 |
|
---|
118 | .footer-class{
|
---|
119 | background-color: #f5eaea;
|
---|
120 | padding: 5% 10%;
|
---|
121 | }
|
---|
122 |
|
---|
123 | .footer-div{
|
---|
124 | display: grid;
|
---|
125 | grid-template-columns: repeat(auto-fit, minmax(170px, auto));
|
---|
126 | gap: 3rem;
|
---|
127 | }
|
---|
128 |
|
---|
129 | .info-footer-first img{
|
---|
130 | width: 140px;
|
---|
131 | height: auto;
|
---|
132 |
|
---|
133 | }
|
---|
134 |
|
---|
135 | .footer-div h4{
|
---|
136 | color: #212529;
|
---|
137 | font-size: 14px;
|
---|
138 | text-transform: uppercase;
|
---|
139 | margin-bottom: 10px;
|
---|
140 | padding: 30px 0px 30px 0px;
|
---|
141 | }
|
---|
142 |
|
---|
143 | .footer-div p{
|
---|
144 | color: #565656;
|
---|
145 | font-size: 14px;
|
---|
146 | font-weight: 400;
|
---|
147 | /*text-transform: capitalize;*/
|
---|
148 | line-height: 1.5;
|
---|
149 | margin-bottom: 10px;
|
---|
150 | cursor: pointer;
|
---|
151 | transition: all .42s;
|
---|
152 | }
|
---|
153 |
|
---|
154 | .footer-div p:hover{
|
---|
155 | color:turquoise;
|
---|
156 | }
|
---|
157 |
|
---|
158 | .footer-div p a{
|
---|
159 | color: #565656;
|
---|
160 | transition: color .42 ease;
|
---|
161 | }
|
---|
162 |
|
---|
163 | .footer-div p a:hover{
|
---|
164 | color: turquoise;
|
---|
165 | }
|
---|