Connectaksa commited on
Commit
8f6c143
·
verified ·
1 Parent(s): 49c9426

revise the image size dont change the image size just change the cards size of missions and others they are big

Browse files
Files changed (1) hide show
  1. index.html +13 -16
index.html CHANGED
@@ -107,20 +107,20 @@
107
  #consulta-hospitality .cards-container {
108
  display: flex;
109
  flex-wrap: wrap;
110
- gap: 20px;
111
- max-width: 1200px;
112
  margin: 0 auto;
113
  justify-content: center;
114
  position: relative;
115
  padding: 0 20px;
116
- transform: translate(80px, -220px); /* cards moved even further down */
117
  }
118
  /* Base card styles */
119
  #consulta-hospitality .box {
120
  background: rgba(255, 255, 255, 0.1);
121
  backdrop-filter: blur(8px);
122
  border-radius: 12px;
123
- padding: 30px 25px 40px 25px;
124
  color: #fff;
125
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
126
  display: flex;
@@ -128,14 +128,13 @@
128
  justify-content: space-between;
129
  transition: transform .25s ease, box-shadow .25s ease, background .3s ease, opacity .6s ease, filter .6s ease;
130
  cursor: pointer;
131
- flex: 1 1 320px;
132
- max-width: 380px;
133
  opacity: 0; /* for reveal */
134
  transform: translateY(22px);/* for reveal */
135
  filter: blur(4px); /* for reveal softness */
136
  }
137
-
138
- #consulta-hospitality .box.revealed {
139
  opacity: 1;
140
  transform: translateY(0px);
141
  filter: blur(0px);
@@ -146,19 +145,17 @@
146
  transform: translateY(-4px);
147
  box-shadow: 0 8px 26px rgba(0,0,0,0.35);
148
  }
149
-
150
  #consulta-hospitality .icon {
151
- width: 40px; height: 40px; margin-bottom: 20px;
152
  stroke: #fff; stroke-width: 1.5; fill: none; stroke-linejoin: round; stroke-linecap: round;
153
  }
154
- #consulta-hospitality .box h3 { font-weight: 700; font-size: 22px; margin-bottom: 12px; line-height: 1.2; }
155
- #consulta-hospitality .box p { font-weight: 400; font-size: 15px; line-height: 1.4; color: #ddd; flex-grow: 1; }
156
-
157
  #consulta-hospitality .arrow {
158
- align-self: flex-start; margin-top: 25px; stroke: #fff; stroke-width: 2;
159
- width: 24px; height: 24px; fill: none; stroke-linejoin: round; stroke-linecap: round; transition: transform 0.3s ease;
160
  }
161
- #consulta-hospitality .box:hover .arrow { transform: translateX(6px); }
162
 
163
  /* NAV BUTTONS (visible on mobile/tablet) */
164
  #consulta-hospitality .nav-arrows {
 
107
  #consulta-hospitality .cards-container {
108
  display: flex;
109
  flex-wrap: wrap;
110
+ gap: 18px;
111
+ max-width: 1100px;
112
  margin: 0 auto;
113
  justify-content: center;
114
  position: relative;
115
  padding: 0 20px;
116
+ transform: translate(60px, -180px); /* adjusted positioning for smaller cards */
117
  }
118
  /* Base card styles */
119
  #consulta-hospitality .box {
120
  background: rgba(255, 255, 255, 0.1);
121
  backdrop-filter: blur(8px);
122
  border-radius: 12px;
123
+ padding: 25px 20px 30px 20px;
124
  color: #fff;
125
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
126
  display: flex;
 
128
  justify-content: space-between;
129
  transition: transform .25s ease, box-shadow .25s ease, background .3s ease, opacity .6s ease, filter .6s ease;
130
  cursor: pointer;
131
+ flex: 1 1 280px;
132
+ max-width: 320px;
133
  opacity: 0; /* for reveal */
134
  transform: translateY(22px);/* for reveal */
135
  filter: blur(4px); /* for reveal softness */
136
  }
137
+ #consulta-hospitality .box.revealed {
 
138
  opacity: 1;
139
  transform: translateY(0px);
140
  filter: blur(0px);
 
145
  transform: translateY(-4px);
146
  box-shadow: 0 8px 26px rgba(0,0,0,0.35);
147
  }
 
148
  #consulta-hospitality .icon {
149
+ width: 36px; height: 36px; margin-bottom: 16px;
150
  stroke: #fff; stroke-width: 1.5; fill: none; stroke-linejoin: round; stroke-linecap: round;
151
  }
152
+ #consulta-hospitality .box h3 { font-weight: 700; font-size: 20px; margin-bottom: 10px; line-height: 1.2; }
153
+ #consulta-hospitality .box p { font-weight: 400; font-size: 14px; line-height: 1.4; color: #ddd; flex-grow: 1; }
 
154
  #consulta-hospitality .arrow {
155
+ align-self: flex-start; margin-top: 20px; stroke: #fff; stroke-width: 2;
156
+ width: 22px; height: 22px; fill: none; stroke-linejoin: round; stroke-linecap: round; transition: transform 0.3s ease;
157
  }
158
+ #consulta-hospitality .box:hover .arrow { transform: translateX(6px); }
159
 
160
  /* NAV BUTTONS (visible on mobile/tablet) */
161
  #consulta-hospitality .nav-arrows {