eSales Media Git repositories
Browse code

Merge remote-tracking branch 'origin/master'

# Conflicts:
# files/themes/aldegott_2022/assets/css/inc/common.scss
# files/themes/aldegott_2022/assets/css/theme.scss

Benjamin Roth authored on21/02/2023 19:57:14
Showing0 changed files
Browse code

Progress

Benjamin Roth authored on21/02/2023 19:42:19
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @12e841b
... ... 
@@ -22,6 +22,8 @@
22 22
23 23 
 @if not-imported("custom-elements") { @import "inc/custom-elements"; }
24 24
25 
+@if not-imported("isotope") { @import "inc/isotope"; }
26 
+
25 27 
 html {
26 28 
   scroll-behavior: smooth;
27 29 
 }
... ... 
@@ -48,10 +50,27 @@ html {
48 50 
   padding-left: 150px;
49 51 
   position: relative;
50 52
53 
+  &.-arrow-negative-margin {
54 
+    margin-left: -150px;
55 
+    :not(.-arrow-left)& {
56 
+      margin-left: -75px;
57 
+    }
58 
+  }
59 
+
51 60 
   :not(.-arrow-left)& {
52 61 
     padding-left: 75px;
53 62 
   }
54 63
64 
+  &.-arrow-padding-only {
65 
+
66 
+    &:not(.ce_text),
67 
+    &.ce_text .text {
68 
+      &:before {
69 
+        display: none;
70 
+      }
71 
+    }
72 
+  }
73 
+
55 74 
   &:not(.ce_text) {
56 75
57 76 
     &:before {
... ... 
@@ -136,6 +155,145 @@ html {
136 155 
       }
137 156 
     }
138 157 
   }
158 
+
159 
+  @include for-tablet {
160 
+    padding-left: 90px;
161 
+
162 
+    &.-arrow-negative-margin {
163 
+      margin-left: -90px;
164 
+      :not(.-arrow-left)& {
165 
+        margin-left: -50px;
166 
+      }
167 
+    }
168 
+
169 
+    :not(.-arrow-left)& {
170 
+      padding-left: 60px;
171 
+    }
172 
+
173 
+    &:not(.ce_text),
174 
+    &.ce_text .text {
175 
+      &::before {
176 
+        width: 30px;
177 
+        height: 60px;
178 
+        left: -45px;
179 
+
180 
+        :not(.-arrow-left)& {
181 
+          width: 18px;
182 
+          height: 36px;
183 
+          left: -30px;
184 
+        }
185 
+      }
186 
+    }
187 
+  }
188 
+
189 
+  @include for-mobile {
190 
+    padding-left: 50px;
191 
+
192 
+    &.-arrow-negative-margin {
193 
+      margin-left: -50px;
194 
+      :not(.-arrow-left)& {
195 
+        margin-left: -40px;
196 
+      }
197 
+    }
198 
+
199 
+    :not(.-arrow-left)& {
200 
+      padding-left: 40px;
201 
+    }
202 
+
203 
+    &:not(.ce_text),
204 
+    &.ce_text .text {
205 
+      &::before {
206 
+        width: 22px;
207 
+        height: 44px;
208 
+        left: -25px;
209 
+
210 
+        :not(.-arrow-left)& {
211 
+          width: 12px;
212 
+          height: 24px;
213 
+          left: -17px;
214 
+        }
215 
+      }
216 
+    }
217 
+  }
218 
+}
219 
+
220 
+#image-film-link {
221 
+  z-index: 0;
222 
+  position: absolute;
223 
+  left: 40px;
224 
+  bottom: 120px;
225 
+  text-transform: uppercase;
226 
+  font-family: $font-family-alternate;
227 
+  font-weight: 700;
228 
+  font-size: font-size(10px);
229 
+  letter-spacing: 0.125em;
230 
+  color: $color-bg-tertiary;
231 
+
232 
+  padding-left: 42px;
233 
+  height: 32px;
234 
+  line-height: 32px;
235 
+
236 
+  &:before {
237 
+    position: absolute;
238 
+    top: 0;
239 
+    left: 0;
240 
+    width: 32px;
241 
+    height: 32px;
242 
+    background-color: $color-bg-tertiary;
243 
+    border-radius: 100%;
244 
+    box-sizing: border-box;
245 
+    content: '';
246 
+    -webkit-mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg width='100%25' height='100%25' viewBox='0 0 36 36' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M36,0l0,36l-36,0l0,-36l36,0Zm-13.08,18.533c0.225,-0.398 0.225,-0.998 0,-1.396l-5.753,-9.472c-0.225,-0.397 -0.81,-0.547 -1.125,-0.3l-2.385,1.2c-0.36,0.248 -0.45,0.9 -0.225,1.297l4.808,7.973l-4.763,7.875c-0.27,0.45 -0.135,1.095 0.135,1.298l2.43,1.244c0.36,0.248 0.9,0.053 1.125,-0.3l5.753,-9.42l0,0.001Z'/%3E%3C/svg%3E");
247 
+    mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg width='100%25' height='100%25' viewBox='0 0 36 36' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M36,0l0,36l-36,0l0,-36l36,0Zm-13.08,18.533c0.225,-0.398 0.225,-0.998 0,-1.396l-5.753,-9.472c-0.225,-0.397 -0.81,-0.547 -1.125,-0.3l-2.385,1.2c-0.36,0.248 -0.45,0.9 -0.225,1.297l4.808,7.973l-4.763,7.875c-0.27,0.45 -0.135,1.095 0.135,1.298l2.43,1.244c0.36,0.248 0.9,0.053 1.125,-0.3l5.753,-9.42l0,0.001Z'/%3E%3C/svg%3E");
248 
+    -webkit-mask-repeat: no-repeat;
249 
+    mask-repeat: no-repeat;
250 
+  }
251 
+  &:after {
252 
+    position: absolute;
253 
+    top: 0;
254 
+    left: 0;
255 
+    z-index: -1;
256 
+    content: '';
257 
+    width: 32px;
258 
+    height: 32px;
259 
+    box-shadow: 0 0 0 0 rgba(255, 255, 255, .1);
260 
+    border-radius: 100%;
261 
+    opacity: 0;
262 
+    -webkit-animation: pulsate 3s infinite;
263 
+    animation: pulsate 3s infinite;
264 
+    box-sizing: border-box;
265 
+  }
266 
+
267 
+  @-webkit-keyframes pulsate {
268 
+    0% {
269 
+      opacity: 0;
270 
+    }
271 
+    30% {
272 
+      opacity: 1;
273 
+    }
274 
+    60% {
275 
+      box-shadow: 0 0 0 20px rgba(255,255,255,.3);
276 
+      opacity: 0;
277 
+    }
278 
+    100% {
279 
+      opacity: 0;
280 
+    }
281 
+  }
282 
+  @keyframes pulsate {
283 
+    0% {
284 
+      opacity: 0;
285 
+    }
286 
+    30% {
287 
+      opacity: 1;
288 
+    }
289 
+    60% {
290 
+      box-shadow: 0 0 0 20px rgba(255,255,255,.3);
291 
+      opacity: 0;
292 
+    }
293 
+    100% {
294 
+      opacity: 0;
295 
+    }
296 
+  }
139 297 
 }
140 298
141 299 
 #player-audio-controls {
... ... 
@@ -297,7 +455,7 @@ html {
297 455 
   }
298 456 
 }
299 457
300 
-.messagebox {
458 
+/*.messagebox {
301 459 
   position: relative;
302 460 
   min-height: 45px;
303 461 
   padding: 5px 15px 5px 45px;
... ... 
@@ -345,7 +503,7 @@ html {
345 503 
       color: $color-bg-secondary;
346 504 
     }
347 505 
   }
348 
-}
506 
+}*/
349 507
350 508 
 .jBox-overlay {
351 509 
   background-color: rgba(#000,0.82);
... ... 
@@ -354,6 +512,31 @@ html {
354 512 
   }
355 513 
 }
356 514
515 
+.jBox-wrapper.jBox-Tooltip {
516 
+  .jBox-container {
517 
+    @include border-radius(3px);
518 
+    @include box-shadow(1px 1px 3px 0 rgba(0,0,0,0.4));
519 
+  }
520 
+  .jBox-content {
521 
+    @include border-radius(3px);
522 
+    background-color: $color-bg-tertiary;
523 
+    font-family: $font-family-alternate;
524 
+    letter-spacing: 0.125em;
525 
+    font-weight: 700;
526 
+    font-size: font-size(9px);
527 
+    color: $color-bg-primary;
528 
+    padding: 4px 5px 2px;
529 
+    text-transform: uppercase;
530 
+  }
531 
+  .jBox-pointer {
532 
+    height: 9px;
533 
+    &::after {
534 
+      background-color: $color-bg-tertiary;
535 
+      @include box-shadow(1px 1px 3px 0 rgba(0,0,0,0.4));
536 
+    }
537 
+  }
538 
+}
539 
+
357 540 
 .jBox-wrapper {
358 541 
   .jBox-container {
359 542 
     @include border-radius(unset);
... ... 
@@ -798,6 +981,14 @@ html {
798 981 
     display: flex;
799 982 
     align-items: center;
800 983 
     justify-content: center;
984 
+
985 
+    @include font-size(48px,$mm:0.46,$tm:0.56);
986 
+    .-fs-medium& {
987 
+      @include font-size(32px);
988 
+    }
989 
+    .-fs-small& {
990 
+      @include font-size(27px);
991 
+    }
801 992 
   }
802 993
803 994 
   .slide-text {
... ... 
@@ -807,7 +998,7 @@ html {
807 998 
     margin: 0;
808 999 
     line-height: 1.3;
809 1000 
     font-family: $font-family-alternate;
810 
-    font-size: font-size(40px);
1001 
+    //font-size: font-size(48px);
811 1002 
     //text-shadow: $text-shadow-image;
812 1003 
     letter-spacing: 0.15em;
813 1004 
     font-weight: 700;
... ... 
@@ -966,16 +1157,26 @@ html {
966 1157 
     }
967 1158 
   }
968 1159
1160 
+  && .-emphasised-block.-emphasised-block {
1161 
+    font-size: inherit;
1162 
+  }
1163 
+
969 1164 
   .hero-text,
970 1165 
   .slide-text {
971 
-    margin-top: 150px;
972 
-    margin-bottom: 150px;
1166 
+    margin-top: 1.5vw;
1167 
+    margin-bottom: 1.5vw;
973 1168 
   }
974 1169
975 1170 
   &.-text-pos-left-top {
976 1171 
     .hero-content,
977 1172 
     .slide-content{
978 
-      @include text-position-wrapper(left,top);
1173 
+      @include text-position-wrapper(left,bottomtop);
1174 
+    }
1175 
+  }
1176 
+  &.-text-pos-left-bottomtop {
1177 
+    .hero-content,
1178 
+    .slide-content{
1179 
+      @include text-position-wrapper(left,bottomtop);
979 1180 
     }
980 1181 
   }
981 1182 
   &.-text-pos-left-topmiddle {
... ... 
@@ -996,17 +1197,115 @@ html {
996 1197 
       @include text-position-wrapper(left,bottommiddle);
997 1198 
     }
998 1199 
   }
1200 
+  &.-text-pos-left-topbottom {
1201 
+    .hero-content,
1202 
+    .slide-content {
1203 
+      @include text-position-wrapper(left,topbottom);
1204 
+    }
1205 
+  }
999 1206 
   &.-text-pos-left-bottom {
1000 1207 
     .hero-content,
1001 1208 
     .slide-content {
1002 
-      @include text-position-wrapper(left,bottom);
1209 
+      @include text-position-wrapper(left,topbottom);
1210 
+    }
1211 
+  }
1212 
+
1213 
+  &.-text-pos-centerleft-top {
1214 
+    .hero-content,
1215 
+    .slide-content {
1216 
+      @include text-position-wrapper(centerleft,bottomtop);
1217 
+    }
1218 
+  }
1219 
+  &.-text-pos-centerleft-bottomtop {
1220 
+    .hero-content,
1221 
+    .slide-content {
1222 
+      @include text-position-wrapper(centerleft,bottomtop);
1223 
+    }
1224 
+  }
1225 
+  &.-text-pos-centerleft-topmiddle {
1226 
+    .hero-content,
1227 
+    .slide-content {
1228 
+      @include text-position-wrapper(centerleft,topmiddle);
1229 
+    }
1230 
+  }
1231 
+  &.-text-pos-centerleft-middle {
1232 
+    .hero-content,
1233 
+    .slide-content {
1234 
+      @include text-position-wrapper(centerleft,middle);
1235 
+    }
1236 
+  }
1237 
+  &.-text-pos-centerleft-bottommiddle {
1238 
+    .hero-content,
1239 
+    .slide-content {
1240 
+      @include text-position-wrapper(centerleft,bottommiddle);
1241 
+    }
1242 
+  }
1243 
+  &.-text-pos-centerleft-topbottom {
1244 
+    .hero-content,
1245 
+    .slide-content {
1246 
+      @include text-position-wrapper(centerleft,topbottom);
1247 
+    }
1248 
+  }
1249 
+  &.-text-pos-centerleft-bottom {
1250 
+    .hero-content,
1251 
+    .slide-content {
1252 
+      @include text-position-wrapper(centerleft,topbottom);
1253 
+    }
1254 
+  }
1255 
+
1256 
+  &.-text-pos-centerright-top {
1257 
+    .hero-content,
1258 
+    .slide-content {
1259 
+      @include text-position-wrapper(centerright,bottomtop);
1260 
+    }
1261 
+  }
1262 
+  &.-text-pos-centerright-bottomtop {
1263 
+    .hero-content,
1264 
+    .slide-content {
1265 
+      @include text-position-wrapper(centerright,bottomtop);
1266 
+    }
1267 
+  }
1268 
+  &.-text-pos-centerright-topmiddle {
1269 
+    .hero-content,
1270 
+    .slide-content {
1271 
+      @include text-position-wrapper(centerright,topmiddle);
1272 
+    }
1273 
+  }
1274 
+  &.-text-pos-centerright-middle {
1275 
+    .hero-content,
1276 
+    .slide-content {
1277 
+      @include text-position-wrapper(centerright,middle);
1278 
+    }
1279 
+  }
1280 
+  &.-text-pos-centerright-bottommiddle {
1281 
+    .hero-content,
1282 
+    .slide-content {
1283 
+      @include text-position-wrapper(centerright,bottommiddle);
1284 
+    }
1285 
+  }
1286 
+  &.-text-pos-centerright-topbottom {
1287 
+    .hero-content,
1288 
+    .slide-content {
1289 
+      @include text-position-wrapper(centerright,topbottom);
1290 
+    }
1291 
+  }
1292 
+  &.-text-pos-centerright-bottom {
1293 
+    .hero-content,
1294 
+    .slide-content {
1295 
+      @include text-position-wrapper(centerright,topbottom);
1003 1296 
     }
1004 1297 
   }
1005 1298
1006 1299 
   &.-text-pos-center-top {
1007 1300 
     .hero-content,
1008 1301 
     .slide-content {
1009 
-      @include text-position-wrapper(center,top);
1302 
+      @include text-position-wrapper(center,bottomtop);
1303 
+    }
1304 
+  }
1305 
+  &.-text-pos-center-bottomtop {
1306 
+    .hero-content,
1307 
+    .slide-content {
1308 
+      @include text-position-wrapper(center,bottomtop);
1010 1309 
     }
1011 1310 
   }
1012 1311 
   &.-text-pos-center-topmiddle {
... ... 
@@ -1027,17 +1326,29 @@ html {
1027 1326 
       @include text-position-wrapper(center,bottommiddle);
1028 1327 
     }
1029 1328 
   }
1329 
+  &.-text-pos-center-topbottom {
1330 
+    .hero-content,
1331 
+    .slide-content {
1332 
+      @include text-position-wrapper(center,topbottom);
1333 
+    }
1334 
+  }
1030 1335 
   &.-text-pos-center-bottom {
1031 1336 
     .hero-content,
1032 1337 
     .slide-content {
1033 
-      @include text-position-wrapper(center,bottom);
1338 
+      @include text-position-wrapper(center,topbottom);
1034 1339 
     }
1035 1340 
   }
1036 1341
1037 1342 
   &.-text-pos-right-top {
1038 1343 
     .hero-content,
1039 1344 
     .slide-content {
1040 
-      @include text-position-wrapper(right,top);
1345 
+      @include text-position-wrapper(right,bottomtop);
1346 
+    }
1347 
+  }
1348 
+  &.-text-pos-right-bottomtop {
1349 
+    .hero-content,
1350 
+    .slide-content {
1351 
+      @include text-position-wrapper(right,bottomtop);
1041 1352 
     }
1042 1353 
   }
1043 1354 
   &.-text-pos-right-topmiddle {
... ... 
@@ -1058,10 +1369,16 @@ html {
1058 1369 
       @include text-position-wrapper(right,bottommiddle);
1059 1370 
     }
1060 1371 
   }
1372 
+  &.-text-pos-right-topbottom {
1373 
+    .hero-content,
1374 
+    .slide-content {
1375 
+      @include text-position-wrapper(right,topbottom);
1376 
+    }
1377 
+  }
1061 1378 
   &.-text-pos-right-bottom {
1062 1379 
     .hero-content,
1063 1380 
     .slide-content {
1064 
-      @include text-position-wrapper(right,bottom);
1381 
+      @include text-position-wrapper(right,topbottom);
1065 1382 
     }
1066 1383 
   }
1067 1384 
 }
... ... 
@@ -1106,6 +1423,7 @@ html {
1106 1423
1107 1424 
   .swiper-container {
1108 1425 
     margin-bottom: -50px;
1426 
+    padding-left: 50px;
1109 1427
1110 1428 
     .swiper-slide {
1111 1429 
       height: auto;
... ... 
@@ -1193,36 +1511,47 @@ html {
1193 1511 
   align-items: center;
1194 1512 
   justify-content: center;
1195 1513
1514 
+  .hero-wrapper &,
1515 
+  .swiper-slide & {
1516 
+    &:not([class*="color-"]) {
1517 
+      color: $color-text-invert;
1518 
+    }
1519 
+  }
1520 
+
1196 1521 
   .positional-text-content {
1197 1522 
     z-index: 1;
1198 
-    margin-top: 150px;
1199 
-    margin-bottom: 150px;
1523 
+    margin-top: 1.5vw;
1524 
+    margin-bottom: 1.5vw;
1200 1525 
     display: inline-block;
1201 1526 
     max-width: 100%;
1202 1527 
     text-align: left;
1203 1528 
     line-height: 1.3;
1204 1529 
     font-family: $font-family-alternate;
1205 
-    font-size: font-size(40px);
1530 
+    @include font-size(40px);
1206 1531 
     //text-shadow: $text-shadow-image;
1207 1532 
     letter-spacing: 0.15em;
1208 1533 
     font-weight: 700;
1209 1534 
     text-transform: uppercase;
1210 
-    color: $color-text-invert;
1211 1535
1212 
-    &.-fs-medium {
1213 
-      font-size: font-size(32px);
1536 
+    a {
1537 
+      color: inherit;
1538 
+    }
1214 1539
1540 
+    &.-fs-medium {
1541 
+      @include font-size(32px);
1215 1542 
     }
1216 1543
1217 1544 
     &.-fs-small {
1218 
-      font-size: font-size(27px);
1219 
-
1545 
+      @include font-size(27px);
1220 1546 
     }
1221 1547 
   }
1222 1548
1223 1549 
   &.-text-pos-left-top {
1224 1550 
     @include text-position-wrapper(left,top);
1225 1551 
   }
1552 
+  &.-text-pos-left-bottomtop {
1553 
+    @include text-position-wrapper(left,bottomtop);
1554 
+  }
1226 1555 
   &.-text-pos-left-topmiddle {
1227 1556 
     @include text-position-wrapper(left,topmiddle);
1228 1557 
   }
... ... 
@@ -1232,13 +1561,63 @@ html {
1232 1561 
   &.-text-pos-left-bottommiddle {
1233 1562 
     @include text-position-wrapper(left,bottommiddle);
1234 1563 
   }
1564 
+  &.-text-pos-left-topbottom {
1565 
+    @include text-position-wrapper(left,topbottom);
1566 
+  }
1235 1567 
   &.-text-pos-left-bottom {
1236 1568 
     @include text-position-wrapper(left,bottom);
1237 1569 
   }
1238 1570
1571 
+  &.-text-pos-centerright-top {
1572 
+    @include text-position-wrapper(centerright,top);
1573 
+  }
1574 
+  &.-text-pos-centerright-bottomtop {
1575 
+    @include text-position-wrapper(centerright,bottomtop);
1576 
+  }
1577 
+  &.-text-pos-centerright-topmiddle {
1578 
+    @include text-position-wrapper(centerright,topmiddle);
1579 
+  }
1580 
+  &.-text-pos-centerright-middle {
1581 
+    @include text-position-wrapper(centerright,middle);
1582 
+  }
1583 
+  &.-text-pos-centerright-bottommiddle {
1584 
+    @include text-position-wrapper(centerright,bottommiddle);
1585 
+  }
1586 
+  &.-text-pos-centerright-topbottom {
1587 
+    @include text-position-wrapper(centerright,topbottom);
1588 
+  }
1589 
+  &.-text-pos-centerright-bottom {
1590 
+    @include text-position-wrapper(centerright,bottom);
1591 
+  }
1592 
+
1593 
+  &.-text-pos-centerleft-top {
1594 
+    @include text-position-wrapper(centerleft,top);
1595 
+  }
1596 
+  &.-text-pos-centerleft-bottomtop {
1597 
+    @include text-position-wrapper(centerleft,bottomtop);
1598 
+  }
1599 
+  &.-text-pos-centerleft-topmiddle {
1600 
+    @include text-position-wrapper(centerleft,topmiddle);
1601 
+  }
1602 
+  &.-text-pos-centerleft-middle {
1603 
+    @include text-position-wrapper(centerleft,middle);
1604 
+  }
1605 
+  &.-text-pos-centerleft-bottommiddle {
1606 
+    @include text-position-wrapper(centerleft,bottommiddle);
1607 
+  }
1608 
+  &.-text-pos-centerleft-topbottom {
1609 
+    @include text-position-wrapper(centerleft,topbottom);
1610 
+  }
1611 
+  &.-text-pos-centerleft-bottom {
1612 
+    @include text-position-wrapper(centerleft,bottom);
1613 
+  }
1614 
+
1239 1615 
   &.-text-pos-center-top {
1240 1616 
     @include text-position-wrapper(center,top);
1241 1617 
   }
1618 
+  &.-text-pos-center-bottomtop {
1619 
+    @include text-position-wrapper(center,bottomtop);
1620 
+  }
1242 1621 
   &.-text-pos-center-topmiddle {
1243 1622 
     @include text-position-wrapper(center,topmiddle);
1244 1623 
   }
... ... 
@@ -1248,6 +1627,9 @@ html {
1248 1627 
   &.-text-pos-center-bottommiddle {
1249 1628 
     @include text-position-wrapper(center,bottommiddle);
1250 1629 
   }
1630 
+  &.-text-pos-center-topbottom {
1631 
+    @include text-position-wrapper(center,topbottom);
1632 
+  }
1251 1633 
   &.-text-pos-center-bottom {
1252 1634 
     @include text-position-wrapper(center,bottom);
1253 1635 
   }
... ... 
@@ -1255,6 +1637,9 @@ html {
1255 1637 
   &.-text-pos-right-top {
1256 1638 
     @include text-position-wrapper(right,top);
1257 1639 
   }
1640 
+  &.-text-pos-right-bottomtop {
1641 
+    @include text-position-wrapper(right,bottomtop);
1642 
+  }
1258 1643 
   &.-text-pos-right-topmiddle {
1259 1644 
     @include text-position-wrapper(right,topmiddle);
1260 1645 
   }
... ... 
@@ -1264,7 +1649,23 @@ html {
1264 1649 
   &.-text-pos-right-bottommiddle {
1265 1650 
     @include text-position-wrapper(right,bottommiddle);
1266 1651 
   }
1652 
+  &.-text-pos-right-topbottom {
1653 
+    @include text-position-wrapper(right,topbottom);
1654 
+  }
1267 1655 
   &.-text-pos-right-bottom {
1268 1656 
     @include text-position-wrapper(right,bottom);
1269 1657 
   }
1270 1658 
 }
1659 
+
1660 
+svg {
1661 
+  &.kuckkuck-stoerer {
1662 
+    width: 150px;
1663 
+    height: auto;
1664 
+  }
1665 
+}
1666 
+
1667 
+
1668 
+.feature-wrapper .content-col {
1669 
+  //display: none !important;
1670 
+  //overflow: hidden;
1671 
+}
Browse code

Remote Progress

Benjamin Roth authored on19/12/2022 15:18:45
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @9d55508
... ... 
@@ -138,6 +138,85 @@ html {
138 138 
   }
139 139 
 }
140 140
141 
+#image-film-link {
142 
+  z-index: 0;
143 
+  position: absolute;
144 
+  left: 40px;
145 
+  bottom: 120px;
146 
+  text-transform: uppercase;
147 
+  font-family: $font-family-alternate;
148 
+  font-weight: 700;
149 
+  font-size: font-size(10px);
150 
+  letter-spacing: 0.125em;
151 
+  color: $color-bg-tertiary;
152 
+
153 
+  padding-left: 42px;
154 
+  height: 32px;
155 
+  line-height: 32px;
156 
+
157 
+  &:before {
158 
+    position: absolute;
159 
+    top: 0;
160 
+    left: 0;
161 
+    width: 32px;
162 
+    height: 32px;
163 
+    background-color: $color-bg-tertiary;
164 
+    border-radius: 100%;
165 
+    box-sizing: border-box;
166 
+    content: '';
167 
+    -webkit-mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg width='100%25' height='100%25' viewBox='0 0 36 36' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M36,0l0,36l-36,0l0,-36l36,0Zm-13.08,18.533c0.225,-0.398 0.225,-0.998 0,-1.396l-5.753,-9.472c-0.225,-0.397 -0.81,-0.547 -1.125,-0.3l-2.385,1.2c-0.36,0.248 -0.45,0.9 -0.225,1.297l4.808,7.973l-4.763,7.875c-0.27,0.45 -0.135,1.095 0.135,1.298l2.43,1.244c0.36,0.248 0.9,0.053 1.125,-0.3l5.753,-9.42l0,0.001Z'/%3E%3C/svg%3E");
168 
+    mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg width='100%25' height='100%25' viewBox='0 0 36 36' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M36,0l0,36l-36,0l0,-36l36,0Zm-13.08,18.533c0.225,-0.398 0.225,-0.998 0,-1.396l-5.753,-9.472c-0.225,-0.397 -0.81,-0.547 -1.125,-0.3l-2.385,1.2c-0.36,0.248 -0.45,0.9 -0.225,1.297l4.808,7.973l-4.763,7.875c-0.27,0.45 -0.135,1.095 0.135,1.298l2.43,1.244c0.36,0.248 0.9,0.053 1.125,-0.3l5.753,-9.42l0,0.001Z'/%3E%3C/svg%3E");
169 
+    -webkit-mask-repeat: no-repeat;
170 
+    mask-repeat: no-repeat;
171 
+  }
172 
+  &:after {
173 
+    position: absolute;
174 
+    top: 0;
175 
+    left: 0;
176 
+    z-index: -1;
177 
+    content: '';
178 
+    width: 32px;
179 
+    height: 32px;
180 
+    box-shadow: 0 0 0 0 rgba(255, 255, 255, .1);
181 
+    border-radius: 100%;
182 
+    opacity: 0;
183 
+    -webkit-animation: pulsate 3s infinite;
184 
+    animation: pulsate 3s infinite;
185 
+    box-sizing: border-box;
186 
+  }
187 
+
188 
+  @-webkit-keyframes pulsate {
189 
+    0% {
190 
+      opacity: 0;
191 
+    }
192 
+    30% {
193 
+      opacity: 1;
194 
+    }
195 
+    60% {
196 
+      box-shadow: 0 0 0 20px rgba(255,255,255,.3);
197 
+      opacity: 0;
198 
+    }
199 
+    100% {
200 
+      opacity: 0;
201 
+    }
202 
+  }
203 
+  @keyframes pulsate {
204 
+    0% {
205 
+      opacity: 0;
206 
+    }
207 
+    30% {
208 
+      opacity: 1;
209 
+    }
210 
+    60% {
211 
+      box-shadow: 0 0 0 20px rgba(255,255,255,.3);
212 
+      opacity: 0;
213 
+    }
214 
+    100% {
215 
+      opacity: 0;
216 
+    }
217 
+  }
218 
+}
219 
+
141 220 
 #player-audio-controls {
142 221 
   position: absolute;
143 222 
   right: 40px;
Browse code

Remote Progress

Benjamin Roth authored on19/12/2022 12:33:32
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @5b1b49d
... ... 
@@ -966,10 +966,14 @@ html {
966 966 
     }
967 967 
   }
968 968
969 
+  && .-emphasised-block.-emphasised-block {
970 
+    font-size: inherit;
971 
+  }
972 
+
969 973 
   .hero-text,
970 974 
   .slide-text {
971 
-    margin-top: 150px;
972 
-    margin-bottom: 150px;
975 
+    margin-top: 1.5vw;
976 
+    margin-bottom: 1.5vw;
973 977 
   }
974 978
975 979 
   &.-text-pos-left-top {
... ... 
@@ -978,6 +982,12 @@ html {
978 982 
       @include text-position-wrapper(left,top);
979 983 
     }
980 984 
   }
985 
+  &.-text-pos-left-bottomtop {
986 
+    .hero-content,
987 
+    .slide-content{
988 
+      @include text-position-wrapper(left,bottomtop);
989 
+    }
990 
+  }
981 991 
   &.-text-pos-left-topmiddle {
982 992 
     .hero-content,
983 993 
     .slide-content {
... ... 
@@ -996,6 +1006,12 @@ html {
996 1006 
       @include text-position-wrapper(left,bottommiddle);
997 1007 
     }
998 1008 
   }
1009 
+  &.-text-pos-left-topbottom {
1010 
+    .hero-content,
1011 
+    .slide-content {
1012 
+      @include text-position-wrapper(left,topbottom);
1013 
+    }
1014 
+  }
999 1015 
   &.-text-pos-left-bottom {
1000 1016 
     .hero-content,
1001 1017 
     .slide-content {
... ... 
@@ -1003,12 +1019,104 @@ html {
1003 1019 
     }
1004 1020 
   }
1005 1021
1022 
+  &.-text-pos-centerleft-top {
1023 
+    .hero-content,
1024 
+    .slide-content {
1025 
+      @include text-position-wrapper(centerleft,top);
1026 
+    }
1027 
+  }
1028 
+  &.-text-pos-centerleft-bottomtop {
1029 
+    .hero-content,
1030 
+    .slide-content {
1031 
+      @include text-position-wrapper(centerleft,bottomtop);
1032 
+    }
1033 
+  }
1034 
+  &.-text-pos-centerleft-topmiddle {
1035 
+    .hero-content,
1036 
+    .slide-content {
1037 
+      @include text-position-wrapper(centerleft,topmiddle);
1038 
+    }
1039 
+  }
1040 
+  &.-text-pos-centerleft-middle {
1041 
+    .hero-content,
1042 
+    .slide-content {
1043 
+      @include text-position-wrapper(centerleft,middle);
1044 
+    }
1045 
+  }
1046 
+  &.-text-pos-centerleft-bottommiddle {
1047 
+    .hero-content,
1048 
+    .slide-content {
1049 
+      @include text-position-wrapper(centerleft,bottommiddle);
1050 
+    }
1051 
+  }
1052 
+  &.-text-pos-centerleft-topbottom {
1053 
+    .hero-content,
1054 
+    .slide-content {
1055 
+      @include text-position-wrapper(centerleft,topbottom);
1056 
+    }
1057 
+  }
1058 
+  &.-text-pos-centerleft-bottom {
1059 
+    .hero-content,
1060 
+    .slide-content {
1061 
+      @include text-position-wrapper(centerleft,bottom);
1062 
+    }
1063 
+  }
1064 
+
1065 
+  &.-text-pos-centerright-top {
1066 
+    .hero-content,
1067 
+    .slide-content {
1068 
+      @include text-position-wrapper(centerright,top);
1069 
+    }
1070 
+  }
1071 
+  &.-text-pos-centerright-bottomtop {
1072 
+    .hero-content,
1073 
+    .slide-content {
1074 
+      @include text-position-wrapper(centerright,bottomtop);
1075 
+    }
1076 
+  }
1077 
+  &.-text-pos-centerright-topmiddle {
1078 
+    .hero-content,
1079 
+    .slide-content {
1080 
+      @include text-position-wrapper(centerright,topmiddle);
1081 
+    }
1082 
+  }
1083 
+  &.-text-pos-centerright-middle {
1084 
+    .hero-content,
1085 
+    .slide-content {
1086 
+      @include text-position-wrapper(centerright,middle);
1087 
+    }
1088 
+  }
1089 
+  &.-text-pos-centerright-bottommiddle {
1090 
+    .hero-content,
1091 
+    .slide-content {
1092 
+      @include text-position-wrapper(centerright,bottommiddle);
1093 
+    }
1094 
+  }
1095 
+  &.-text-pos-centerright-topbottom {
1096 
+    .hero-content,
1097 
+    .slide-content {
1098 
+      @include text-position-wrapper(centerright,topbottom);
1099 
+    }
1100 
+  }
1101 
+  &.-text-pos-centerright-bottom {
1102 
+    .hero-content,
1103 
+    .slide-content {
1104 
+      @include text-position-wrapper(centerright,bottom);
1105 
+    }
1106 
+  }
1107 
+
1006 1108 
   &.-text-pos-center-top {
1007 1109 
     .hero-content,
1008 1110 
     .slide-content {
1009 1111 
       @include text-position-wrapper(center,top);
1010 1112 
     }
1011 1113 
   }
1114 
+  &.-text-pos-center-bottomtop {
1115 
+    .hero-content,
1116 
+    .slide-content {
1117 
+      @include text-position-wrapper(center,bottomtop);
1118 
+    }
1119 
+  }
1012 1120 
   &.-text-pos-center-topmiddle {
1013 1121 
     .hero-content,
1014 1122 
     .slide-content {
... ... 
@@ -1027,6 +1135,12 @@ html {
1027 1135 
       @include text-position-wrapper(center,bottommiddle);
1028 1136 
     }
1029 1137 
   }
1138 
+  &.-text-pos-center-topbottom {
1139 
+    .hero-content,
1140 
+    .slide-content {
1141 
+      @include text-position-wrapper(center,topbottom);
1142 
+    }
1143 
+  }
1030 1144 
   &.-text-pos-center-bottom {
1031 1145 
     .hero-content,
1032 1146 
     .slide-content {
... ... 
@@ -1040,6 +1154,12 @@ html {
1040 1154 
       @include text-position-wrapper(right,top);
1041 1155 
     }
1042 1156 
   }
1157 
+  &.-text-pos-right-bottomtop {
1158 
+    .hero-content,
1159 
+    .slide-content {
1160 
+      @include text-position-wrapper(right,bottomtop);
1161 
+    }
1162 
+  }
1043 1163 
   &.-text-pos-right-topmiddle {
1044 1164 
     .hero-content,
1045 1165 
     .slide-content {
... ... 
@@ -1058,6 +1178,12 @@ html {
1058 1178 
       @include text-position-wrapper(right,bottommiddle);
1059 1179 
     }
1060 1180 
   }
1181 
+  &.-text-pos-right-topbottom {
1182 
+    .hero-content,
1183 
+    .slide-content {
1184 
+      @include text-position-wrapper(right,topbottom);
1185 
+    }
1186 
+  }
1061 1187 
   &.-text-pos-right-bottom {
1062 1188 
     .hero-content,
1063 1189 
     .slide-content {
... ... 
@@ -1193,10 +1319,17 @@ html {
1193 1319 
   align-items: center;
1194 1320 
   justify-content: center;
1195 1321
1322 
+  .hero-wrapper &,
1323 
+  .swiper-slide & {
1324 
+    &:not([class*="color-"]) {
1325 
+      color: $color-text-invert;
1326 
+    }
1327 
+  }
1328 
+
1196 1329 
   .positional-text-content {
1197 1330 
     z-index: 1;
1198 
-    margin-top: 150px;
1199 
-    margin-bottom: 150px;
1331 
+    margin-top: 1.5vw;
1332 
+    margin-bottom: 1.5vw;
1200 1333 
     display: inline-block;
1201 1334 
     max-width: 100%;
1202 1335 
     text-align: left;
... ... 
@@ -1207,7 +1340,10 @@ html {
1207 1340 
     letter-spacing: 0.15em;
1208 1341 
     font-weight: 700;
1209 1342 
     text-transform: uppercase;
1210 
-    color: $color-text-invert;
1343 
+
1344 
+    a {
1345 
+      color: inherit;
1346 
+    }
1211 1347
1212 1348 
     &.-fs-medium {
1213 1349 
       font-size: font-size(32px);
... ... 
@@ -1223,6 +1359,9 @@ html {
1223 1359 
   &.-text-pos-left-top {
1224 1360 
     @include text-position-wrapper(left,top);
1225 1361 
   }
1362 
+  &.-text-pos-left-bottomtop {
1363 
+    @include text-position-wrapper(left,bottomtop);
1364 
+  }
1226 1365 
   &.-text-pos-left-topmiddle {
1227 1366 
     @include text-position-wrapper(left,topmiddle);
1228 1367 
   }
... ... 
@@ -1232,13 +1371,63 @@ html {
1232 1371 
   &.-text-pos-left-bottommiddle {
1233 1372 
     @include text-position-wrapper(left,bottommiddle);
1234 1373 
   }
1374 
+  &.-text-pos-left-topbottom {
1375 
+    @include text-position-wrapper(left,topbottom);
1376 
+  }
1235 1377 
   &.-text-pos-left-bottom {
1236 1378 
     @include text-position-wrapper(left,bottom);
1237 1379 
   }
1238 1380
1381 
+  &.-text-pos-centerright-top {
1382 
+    @include text-position-wrapper(centerright,top);
1383 
+  }
1384 
+  &.-text-pos-centerright-bottomtop {
1385 
+    @include text-position-wrapper(centerright,bottomtop);
1386 
+  }
1387 
+  &.-text-pos-centerright-topmiddle {
1388 
+    @include text-position-wrapper(centerright,topmiddle);
1389 
+  }
1390 
+  &.-text-pos-centerright-middle {
1391 
+    @include text-position-wrapper(centerright,middle);
1392 
+  }
1393 
+  &.-text-pos-centerright-bottommiddle {
1394 
+    @include text-position-wrapper(centerright,bottommiddle);
1395 
+  }
1396 
+  &.-text-pos-centerright-topbottom {
1397 
+    @include text-position-wrapper(centerright,topbottom);
1398 
+  }
1399 
+  &.-text-pos-centerright-bottom {
1400 
+    @include text-position-wrapper(centerright,bottom);
1401 
+  }
1402 
+
1403 
+  &.-text-pos-centerleft-top {
1404 
+    @include text-position-wrapper(centerleft,top);
1405 
+  }
1406 
+  &.-text-pos-centerleft-bottomtop {
1407 
+    @include text-position-wrapper(centerleft,bottomtop);
1408 
+  }
1409 
+  &.-text-pos-centerleft-topmiddle {
1410 
+    @include text-position-wrapper(centerleft,topmiddle);
1411 
+  }
1412 
+  &.-text-pos-centerleft-middle {
1413 
+    @include text-position-wrapper(centerleft,middle);
1414 
+  }
1415 
+  &.-text-pos-centerleft-bottommiddle {
1416 
+    @include text-position-wrapper(centerleft,bottommiddle);
1417 
+  }
1418 
+  &.-text-pos-centerleft-topbottom {
1419 
+    @include text-position-wrapper(centerleft,topbottom);
1420 
+  }
1421 
+  &.-text-pos-centerleft-bottom {
1422 
+    @include text-position-wrapper(centerleft,bottom);
1423 
+  }
1424 
+
1239 1425 
   &.-text-pos-center-top {
1240 1426 
     @include text-position-wrapper(center,top);
1241 1427 
   }
1428 
+  &.-text-pos-center-bottomtop {
1429 
+    @include text-position-wrapper(center,bottomtop);
1430 
+  }
1242 1431 
   &.-text-pos-center-topmiddle {
1243 1432 
     @include text-position-wrapper(center,topmiddle);
1244 1433 
   }
... ... 
@@ -1248,6 +1437,9 @@ html {
1248 1437 
   &.-text-pos-center-bottommiddle {
1249 1438 
     @include text-position-wrapper(center,bottommiddle);
1250 1439 
   }
1440 
+  &.-text-pos-center-topbottom {
1441 
+    @include text-position-wrapper(center,topbottom);
1442 
+  }
1251 1443 
   &.-text-pos-center-bottom {
1252 1444 
     @include text-position-wrapper(center,bottom);
1253 1445 
   }
... ... 
@@ -1255,6 +1447,9 @@ html {
1255 1447 
   &.-text-pos-right-top {
1256 1448 
     @include text-position-wrapper(right,top);
1257 1449 
   }
1450 
+  &.-text-pos-right-bottomtop {
1451 
+    @include text-position-wrapper(right,bottomtop);
1452 
+  }
1258 1453 
   &.-text-pos-right-topmiddle {
1259 1454 
     @include text-position-wrapper(right,topmiddle);
1260 1455 
   }
... ... 
@@ -1264,7 +1459,17 @@ html {
1264 1459 
   &.-text-pos-right-bottommiddle {
1265 1460 
     @include text-position-wrapper(right,bottommiddle);
1266 1461 
   }
1462 
+  &.-text-pos-right-topbottom {
1463 
+    @include text-position-wrapper(right,topbottom);
1464 
+  }
1267 1465 
   &.-text-pos-right-bottom {
1268 1466 
     @include text-position-wrapper(right,bottom);
1269 1467 
   }
1270 1468 
 }
1469 
+
1470 
+svg {
1471 
+  &.kuckkuck-stoerer {
1472 
+    width: 150px;
1473 
+    height: auto;
1474 
+  }
1475 
+}
Browse code

Progress

Benjamin Roth authored on16/12/2022 19:54:08
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @6839c36
... ... 
@@ -138,18 +138,123 @@ html {
138 138 
   }
139 139 
 }
140 140
141 
+#player-audio-controls {
142 
+  position: absolute;
143 
+  right: 40px;
144 
+  bottom: 120px;
145 
+  height: 32px;
146 
+  width: 39px;
147 
+
148 
+  a {
149 
+    opacity: 0;
150 
+    visibility: hidden;
151 
+    @include transition(opacity 0.25s ease-in-out);
152 
+
153 
+    &:before {
154 
+      display: block;
155 
+      visibility: hidden;
156 
+      opacity: 0;
157 
+      font-family: $font-family-alternate;
158 
+      font-size: font-size(10px);
159 
+      white-space: nowrap;
160 
+      position: absolute;
161 
+      right: 100%;
162 
+      margin-right: 20px;
163 
+      top: 50%;
164 
+      @include transform(translate3d(0,-50%,0));
165 
+      content: attr(data-label);
166 
+      background-color: rgba($color-bg-tertiary, 0.8);
167 
+      color: $color-bg-primary;
168 
+      padding: 2px 5px 0;
169 
+      line-height: 2;
170 
+      text-transform: uppercase;
171 
+      @include transition(all 0.25s ease-in-out);
172 
+
173 
+    }
174 
+
175 
+    &.-show {
176 
+      opacity: .8;
177 
+      visibility: visible;
178 
+    }
179 
+
180 
+    &:hover {
181 
+      opacity: 1;
182 
+
183 
+      &:before {
184 
+        opacity: 1;
185 
+        visibility: visible;
186 
+      }
187 
+    }
188 
+  }
189 
+
190 
+  svg {
191 
+    height: 32px;
192 
+    width: auto;
193 
+    position: absolute;
194 
+    fill: $color-bg-tertiary;
195 
+  }
196 
+}
197 
+
141 198 
 #scroll-down-indicator {
142 199 
   z-index: 10;
143 200 
   position: fixed;
144 201 
   right: 40px;
145 202 
   bottom: 40px;
146 
-  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
147 
-  mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
148 
-  -webkit-mask-repeat: no-repeat;
149 
-  mask-repeat: no-repeat;
150 203 
   width: 40px;
151 204 
   height: 20px;
152 
-  background-color: rgba($color-bg-tertiary,0.8);
205 
+
206 
+  span {
207 
+    display: block;
208 
+    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
209 
+    mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
210 
+    -webkit-mask-repeat: no-repeat;
211 
+    mask-repeat: no-repeat;
212 
+    width: 40px;
213 
+    height: 20px;
214 
+    background-color: rgba($color-bg-tertiary, 0.8);
215 
+    @include transition(all 0.25s ease-in-out);
216 
+  }
217 
+
218 
+  &:before {
219 
+    display: block;
220 
+    visibility: hidden;
221 
+    opacity: 0;
222 
+    font-family: $font-family-alternate;
223 
+    font-size: font-size(10px);
224 
+    white-space: nowrap;
225 
+    position: absolute;
226 
+    right: 100%;
227 
+    margin-right: 20px;
228 
+    top: 50%;
229 
+    @include transform(translate3d(0,-50%,0));
230 
+    content: attr(data-label-down);
231 
+    background-color: rgba($color-bg-tertiary, 0.8);
232 
+    color: $color-bg-primary;
233 
+    padding: 2px 5px 0;
234 
+    line-height: 2;
235 
+    text-transform: uppercase;
236 
+    @include transition(all 0.25s ease-in-out);
237 
+
238 
+  }
239 
+
240 
+  &.-at-bottom {
241 
+    span {
242 
+      @include transform(rotate(180deg));
243 
+    }
244 
+    &:before {
245 
+      content: attr(data-label-top);
246 
+    }
247 
+  }
248 
+
249 
+  &:hover {
250 
+    span {
251 
+      background-color: rgba($color-bg-tertiary, 1);
252 
+    }
253 
+    &:before {
254 
+      opacity: 1;
255 
+      visibility: visible;
256 
+    }
257 
+  }
153 258 
 }
154 259
155 260 
 .widget p.error {
Browse code

Remote Progress

Benjamin Roth authored on15/12/2022 14:35:11
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @1e0cb0b
... ... 
@@ -22,6 +22,9 @@
22 22
23 23 
 @if not-imported("custom-elements") { @import "inc/custom-elements"; }
24 24
25 
+html {
26 
+  scroll-behavior: smooth;
27 
+}
25 28
26 29 
 #wrapper {
27 30 
   padding: 0;
Browse code

Remote Progress

Benjamin Roth authored on15/12/2022 11:11:34
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @9a7f07e
... ... 
@@ -618,9 +618,10 @@
618 618 
 .ce_accordion {
619 619 
   position: relative;
620 620 
   padding-bottom: 40px;
621 
-  + .ce_accordion {
621 
+  margin-bottom: 1.5rem;
622 
+  /*+ .ce_accordion {
622 623 
     margin-top: 5px;
623 
-  }
624 
+  }*/
624 625 
   .toggler {
625 626 
     cursor: pointer;
626 627 
     display: block;
Browse code

Progress

Benjamin Roth authored on14/12/2022 22:15:45
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @43183ab
... ... 
@@ -616,92 +616,60 @@
616 616
617 617
618 618 
 .ce_accordion {
619 
+  position: relative;
620 
+  padding-bottom: 40px;
619 621 
   + .ce_accordion {
620 622 
     margin-top: 5px;
621 623 
   }
622 624 
   .toggler {
623 625 
     cursor: pointer;
624 626 
     display: block;
625 
-    background-color: $color-bg-tertiary;
626 
-    color: $color-text-invert;
627 
-    font-size: font-size(25px);
628 
-    padding: 10px 50px 10px 15px;
629 
-    line-height: 30px;
630 
-    position: relative;
631 
-    outline: none;
632 
-    overflow: hidden;
633 
-    @include transition(all 0.25s ease);
627 
+    @include headline($font-size: font-size(22px), $color: $color-bg-primary);
628 
+    letter-spacing: 0.125em;
629 
+    text-transform: uppercase;
630 
+    margin: 0;
631 
+    line-height: 1.3;
634 632
635 
-    .arrow {
636 
-      position: absolute;
637 
-      top:0;
638 
-      bottom: 0;
639 
-      right: 0;
640 
-      width: 50px;
641 
-      fill: $color-bg-secondary;
642 
-      @include transition(all 0.25s ease);
633 
+    .title {
634 
+      padding-bottom: 0.3em;
635 
+      position: relative;
636 
+
637 
+      &:after {
638 
+        position: absolute;
639 
+        left: 0;
640 
+        right: 0;
641 
+        height: 0;
642 
+        @include border-radius(99em);
643 
+        border-color: currentColor;
644 
+        content: "";
645 
+        bottom: -0.15em;
646 
+        border-bottom-width: 8px;
647 
+        border-bottom-style: solid;
648 
+      }
643 649 
     }
644 650
645 
-    /*&:before {
651 
+    .ui-accordion-header-icon {
646 652 
       position: absolute;
647 
-      top:0;
653 
+      left: 0;
648 654 
       bottom: 0;
649 
-      right: 0;
650 
-      width: 50px;
651 
-      content: '';
652 
-      background: url('data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%22%20height%3D%22100%22%20fill%3D%22%23000000%22%20viewBox%3D%220%200%20100%20100%22%20preserveAspectRatio%3D%22none%22%20%3E%3Cpath%20d%3D%22M10%2C0%20L100%2C0%20L100%2C100%20L10%2C100%20L0%2C50z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E') no-repeat 100% 50%;
653 
-      -webkit-background-size: 100% 100%;
654 
-      background-size: 100% 100%;
655 
-      //@include transform(translate(50%,-50%));
656 
-      @include transition(transform 0.25s ease);
657 
-    }*/
658 
-
659 
-    &:before,
660 
-    &:after {
661 
-      z-index: 1;
662 
-      position: absolute;
663 
-      top: 50%;
664 
-      font-size: 35px;
665 
-      @include transform(translate(50%,-50%));
666 
-      @include transition(all 0.25s ease);
667 
-    }
668 
-
669 
-    &:before {
670 
-      right: 20px;
671 
-      content: '+';
672 
-      opacity: 1;
673 
-      visibility: visible;
674 
-    }
675 
-    &:after {
676 
-      top: 22px;
677 
-      right: 25px;
678 
-      content: '–';
679 
-      opacity: 0;
680 
-      visibility: hidden;
655 
+      -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
656 
+      mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
657 
+      -webkit-mask-repeat: no-repeat;
658 
+      mask-repeat: no-repeat;
659 
+      width: 40px;
660 
+      height: 20px;
661 
+      background-color: $color-bg-secondary;
681 662 
     }
682 663
683 664 
     &.ui-state-active {
684 
-      background-color: $color-bg-secondary;
685 
-      color: $color-text-invert;
686 
-      &:before {
687 
-        opacity: 0;
688 
-        visibility: hidden;
689 
-      }
690 
-      &:after {
691 
-        opacity: 1;
692 
-        visibility: visible;
693 
-      }
694 
-      .arrow {
695 
-        @include transform(rotate(-90deg));
696 
-        fill: $color-bg-tertiary;
697 
-        max-height:50px;
665 
+      .ui-accordion-header-icon {
666 
+        @include transform(rotate(180deg));
698 667 
       }
699 668 
     }
700 669 
   }
701 670
702 671 
   .accordion {
703 
-    padding: 1.5rem 1rem;
704 
-    background: $color-bg-primary;
672 
+    padding: 1.75em 0 0;
705 673 
   }
706 674 
 }
707 675
Browse code

Progress live

Benjamin Roth authored on14/12/2022 13:32:50
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @f030173
... ... 
@@ -740,7 +740,7 @@
740 740 
 }
741 741
742 742 
 .hero-wrapper,
743 
-.swiper-slide {
743 
+.swiper-slide{
744 744
745 745 
   .hero-text {
746 746 
     a {
... ... 
@@ -825,6 +825,7 @@
825 825 
             }
826 826 
           }
827 827 
           @supports not (-moz-appearance:none) {
828 
+            display: inline;
828 829 
             &:after {
829 830 
               position: absolute;
830 831 
               left: 0;
... ... 
@@ -896,7 +897,7 @@
896 897
897 898 
   &.-text-pos-left-top {
898 899 
     .hero-content,
899 
-    .slide-content {
900 
+    .slide-content{
900 901 
       @include text-position-wrapper(left,top);
901 902 
     }
902 903 
   }
... ... 
@@ -1103,3 +1104,90 @@
1103 1104 
     }
1104 1105 
   }
1105 1106 
 }
1107 
+
1108 
+.positional-text {
1109 
+  height: 100%;
1110 
+  position: absolute;
1111 
+  left: 0;
1112 
+  top: 0;
1113 
+  bottom: 0;
1114 
+  right: 0;
1115 
+  display: flex;
1116 
+  align-items: center;
1117 
+  justify-content: center;
1118 
+
1119 
+  .positional-text-content {
1120 
+    z-index: 1;
1121 
+    margin-top: 150px;
1122 
+    margin-bottom: 150px;
1123 
+    display: inline-block;
1124 
+    max-width: 100%;
1125 
+    text-align: left;
1126 
+    line-height: 1.3;
1127 
+    font-family: $font-family-alternate;
1128 
+    font-size: font-size(40px);
1129 
+    //text-shadow: $text-shadow-image;
1130 
+    letter-spacing: 0.15em;
1131 
+    font-weight: 700;
1132 
+    text-transform: uppercase;
1133 
+    color: $color-text-invert;
1134 
+
1135 
+    &.-fs-medium {
1136 
+      font-size: font-size(32px);
1137 
+
1138 
+    }
1139 
+
1140 
+    &.-fs-small {
1141 
+      font-size: font-size(27px);
1142 
+
1143 
+    }
1144 
+  }
1145 
+
1146 
+  &.-text-pos-left-top {
1147 
+    @include text-position-wrapper(left,top);
1148 
+  }
1149 
+  &.-text-pos-left-topmiddle {
1150 
+    @include text-position-wrapper(left,topmiddle);
1151 
+  }
1152 
+  &.-text-pos-left-middle {
1153 
+    @include text-position-wrapper(left,middle);
1154 
+  }
1155 
+  &.-text-pos-left-bottommiddle {
1156 
+    @include text-position-wrapper(left,bottommiddle);
1157 
+  }
1158 
+  &.-text-pos-left-bottom {
1159 
+    @include text-position-wrapper(left,bottom);
1160 
+  }
1161 
+
1162 
+  &.-text-pos-center-top {
1163 
+    @include text-position-wrapper(center,top);
1164 
+  }
1165 
+  &.-text-pos-center-topmiddle {
1166 
+    @include text-position-wrapper(center,topmiddle);
1167 
+  }
1168 
+  &.-text-pos-center-middle {
1169 
+    @include text-position-wrapper(center,middle);
1170 
+  }
1171 
+  &.-text-pos-center-bottommiddle {
1172 
+    @include text-position-wrapper(center,bottommiddle);
1173 
+  }
1174 
+  &.-text-pos-center-bottom {
1175 
+    @include text-position-wrapper(center,bottom);
1176 
+  }
1177 
+
1178 
+  &.-text-pos-right-top {
1179 
+    @include text-position-wrapper(right,top);
1180 
+  }
1181 
+  &.-text-pos-right-topmiddle {
1182 
+    @include text-position-wrapper(right,topmiddle);
1183 
+  }
1184 
+  &.-text-pos-right-middle {
1185 
+    @include text-position-wrapper(right,middle);
1186 
+  }
1187 
+  &.-text-pos-right-bottommiddle {
1188 
+    @include text-position-wrapper(right,bottommiddle);
1189 
+  }
1190 
+  &.-text-pos-right-bottom {
1191 
+    @include text-position-wrapper(right,bottom);
1192 
+  }
1193 
+}
Browse code

Progress

Benjamin Roth authored on14/12/2022 00:09:31
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @bd9ee9a
... ... 
@@ -839,6 +839,7 @@
839 839 
                 width: 0;
840 840
841 841 
                 .-show-underline.-in-view&,
842 
+                .hero-wrapper.-in-view&,
842 843 
                 .swiper-slide-duplicate& {
843 844 
                   width: 100%;
844 845 
                 }
Browse code

Progress live

Benjamin Roth authored on12/12/2022 16:42:07
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @be9e748
... ... 
@@ -783,24 +783,65 @@
783 783 
     .hero-text,
784 784 
     .slide-text {
785 785 
       > * {
786 
-        display: inline;
786 
+        //display: inline;
787 787 
         position: relative;
788 
+
788 789 
         &:last-child {
789 
-          &:after {
790 
-            position:absolute;
791 
-            left:0;
792 
-            width:100%;
793 
-            height:0;
794 
-            @include border-radius(99em);
795 
-            border-color: inherit;
796 
-            content:"";
797 
-
798 
-            .is-animated& {
799 
-              @include transition(width 1.25s 0.25s cubic-bezier(0.45, 0, 0.55, 1));
800 
-              width: 0;
801 
-              .-show-underline.-in-view&,
802 
-              .swiper-slide-duplicate& {
790 
+
791 
+          @supports (-moz-appearance:none) {
792 
+            :not(.-underline-bottom)& {
793 
+              &:after {
794 
+                position: absolute;
795 
+                left: 0;
803 796 
                 width: 100%;
797 
+                height: 0;
798 
+                @include border-radius(99em);
799 
+                border-color: inherit;
800 
+                content: "";
801 
+
802 
+                .is-animated& {
803 
+                  @include transition(width 1.25s 0.25s cubic-bezier(0.45, 0, 0.55, 1));
804 
+                  width: 0;
805 
+
806 
+                  .-show-underline.-in-view&,
807 
+                  .swiper-slide-duplicate& {
808 
+                    width: 100%;
809 
+                  }
810 
+                }
811 
+              }
812 
+            }
813 
+
814 
+            :not(.-underline-top)& {
815 
+              overflow: hidden;
816 
+              &:after {
817 
+                content: '';
818 
+                display: inline-block;
819 
+                vertical-align: -0.7em;
820 
+                height: 10px;
821 
+                box-shadow: -100vw 100vw 0 100vw;
822 
+                @include border-radius(99em);
823 
+                overflow: hidden;
824 
+              }
825 
+            }
826 
+          }
827 
+          @supports not (-moz-appearance:none) {
828 
+            &:after {
829 
+              position: absolute;
830 
+              left: 0;
831 
+              width: 100%;
832 
+              height: 0;
833 
+              @include border-radius(99em);
834 
+              border-color: inherit;
835 
+              content: "";
836 
+
837 
+              .is-animated& {
838 
+                @include transition(width 1.25s 0.25s cubic-bezier(0.45, 0, 0.55, 1));
839 
+                width: 0;
840 
+
841 
+                .-show-underline.-in-view&,
842 
+                .swiper-slide-duplicate& {
843 
+                  width: 100%;
844 
+                }
804 845 
               }
805 846 
             }
806 847 
           }
... ... 
@@ -814,11 +855,13 @@
814 855 
     .slide-text {
815 856 
       > * {
816 857 
         &:last-child {
817 
-          padding-bottom: 0.3em;
818 
-          &:after {
819 
-            bottom: -0.15em;
820 
-            border-bottom-width: 10px;
821 
-            border-bottom-style: solid;
858 
+          @supports not (-moz-appearance:none) {
859 
+            padding-bottom: 0.3em;
860 
+            &:after {
861 
+              bottom: -0.15em;
862 
+              border-bottom-width: 10px;
863 
+              border-bottom-style: solid;
864 
+            }
822 865 
           }
823 866 
         }
824 867 
       }
... ... 
@@ -832,6 +875,7 @@
832 875 
         display: inline-block;
833 876 
         &:last-child {
834 877 
           padding-top: 0.3em;
878 
+
835 879 
           &:after {
836 880 
             top: -0.15em;
837 881 
             right: 0;
Browse code

Progress

Benjamin Roth authored on12/12/2022 00:17:47
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @fe1cbe6
... ... 
@@ -40,21 +40,53 @@
40 40 
   }
41 41 
 }
42 42
43 
-.-arrow-left-top {
43 
+.-arrow-left,
44 
+.-arrow-left-small {
44 45 
   padding-left: 150px;
45 46 
   position: relative;
46 47
48 
+  :not(.-arrow-left)& {
49 
+    padding-left: 75px;
50 
+  }
51 
+
47 52 
   &:not(.ce_text) {
48 53
49 54 
     &:before {
50 55 
       content: '';
51 56 
       width: 50px;
52 57 
       height: 100px;
53 
-      background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
58 
+      -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
59 
+      mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
60 
+      -webkit-mask-repeat: no-repeat;
61 
+      mask-repeat: no-repeat;
62 
+      background: $color-bg-secondary;
63 
+      //background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
54 64 
       position: absolute;
55 65 
       left: 75px;
56 
-      top: 0;
57 66 
       @include transform(translate(-50%,0));
67 
+
68 
+      #footer & {
69 
+        background: $color-text-footer;
70 
+      }
71 
+
72 
+      :not(.-arrow-left)& {
73 
+        left: 40px;
74 
+        width: 25px;
75 
+        height: 50px;
76 
+      }
77 
+
78 
+      .-arrow-left-top& {
79 
+        top: 0;
80 
+      }
81 
+
82 
+      .-arrow-left-middle& {
83 
+        top: 50%;
84 
+        @include transform(translate(-50%,-50%));
85 
+      }
86 
+
87 
+      .-arrow-left-bottom& {
88 
+        bottom: 0;
89 
+      }
58 90 
     }
59 91 
   }
60 92
... ... 
@@ -66,11 +98,38 @@
66 98 
         content: '';
67 99 
         width: 50px;
68 100 
         height: 100px;
69 
-        background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
101 
+        -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
102 
+        mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
103 
+        -webkit-mask-repeat: no-repeat;
104 
+        mask-repeat: no-repeat;
105 
+        background: $color-bg-secondary;
106 
+        //background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
70 107 
         position: absolute;
71 108 
         left: -75px;
72 
-        top: 0;
73 109 
         @include transform(translate(-50%,0));
110 
+
111 
+        #footer & {
112 
+          background: $color-text-footer;
113 
+        }
114 
+
115 
+        :not(.-arrow-left)& {
116 
+          left: -35px;
117 
+          width: 25px;
118 
+          height: 50px;
119 
+        }
120 
+
121 
+        .-arrow-left-top& {
122 
+          top: 0;
123 
+        }
124 
+
125 
+        .-arrow-left-middle& {
126 
+          top: 50%;
127 
+          @include transform(translate(-50%,-50%));
128 
+        }
129 
+
130 
+        .-arrow-left-bottom& {
131 
+          bottom: 0;
132 
+        }
74 133 
       }
75 134 
     }
76 135 
   }
... ... 
@@ -998,4 +1057,4 @@
998 1057 
       height: 50px;
999 1058 
     }
1000 1059 
   }
1001 
-}
1002 1060 
\ No newline at end of file
1061 
+}
Browse code

Remote Progress

Benjamin Roth authored on08/12/2022 15:25:46
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @5d319ba
... ... 
@@ -924,6 +924,14 @@
924 924
925 925 
   .swiper-container {
926 926 
     margin-bottom: -50px;
927 
+
928 
+    .swiper-slide {
929 
+      height: auto;
930 
+    }
931 
+
932 
+    .content {
933 
+      height: 100%;
934 
+    }
927 935 
   }
928 936
929 937 
   ul {
Browse code

Remote Progress

Benjamin Roth authored on21/11/2022 12:28:49
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @7a03ca5
... ... 
@@ -683,6 +683,12 @@
683 683 
 .hero-wrapper,
684 684 
 .swiper-slide {
685 685
686 
+  .hero-text {
687 
+    a {
688 
+      color: inherit;
689 
+    }
690 
+  }
691 
+
686 692 
   &.-color- {
687 693 
     &platin {
688 694 
       .hero-text,
Browse code

Progress

Benjamin Roth authored on18/11/2022 00:02:26
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @77aeeb1
... ... 
@@ -652,6 +652,7 @@
652 652 
   }
653 653
654 654 
   .slide-content {
655 
+    @include centered;
655 656 
     height: 100%;
656 657 
     position: absolute;
657 658 
     left: 0;
Browse code

Progress

Benjamin Roth authored on17/11/2022 20:40:21
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @f1373af
... ... 
@@ -727,7 +727,16 @@
727 727 
             height:0;
728 728 
             @include border-radius(99em);
729 729 
             border-color: inherit;
730 
-            content:""
730 
+            content:"";
731 
+
732 
+            .is-animated& {
733 
+              @include transition(width 1.25s 0.25s cubic-bezier(0.45, 0, 0.55, 1));
734 
+              width: 0;
735 
+              .-show-underline.-in-view&,
736 
+              .swiper-slide-duplicate& {
737 
+                width: 100%;
738 
+              }
739 
+            }
731 740 
           }
732 741 
         }
733 742 
       }
Browse code

Progress

Benjamin Roth authored on17/11/2022 19:43:56
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @ee8f8ad
... ... 
@@ -646,12 +646,46 @@
646 646 
   }
647 647 
 }
648 648
649 
+.swiper-slide {
650 
+  .swiper-slide-image {
651 
+    background-position: 50% 50%;
652 
+  }
653 
+
654 
+  .slide-content {
655 
+    height: 100%;
656 
+    position: absolute;
657 
+    left: 0;
658 
+    top: 0;
659 
+    bottom: 0;
660 
+    right: 0;
661 
+    display: flex;
662 
+    align-items: center;
663 
+    justify-content: center;
664 
+  }
665 
+
666 
+  .slide-text {
667 
+    display: inline-block;
668 
+    max-width: 100%;
669 
+    text-align: left;
670 
+    margin: 0;
671 
+    line-height: 1.3;
672 
+    font-family: $font-family-alternate;
673 
+    font-size: font-size(40px);
674 
+    //text-shadow: $text-shadow-image;
675 
+    letter-spacing: 0.15em;
676 
+    font-weight: 700;
677 
+    text-transform: uppercase;
678 
+    color: $color-text-invert;
679 
+  }
680 
+}
681 
+
649 682 
 .hero-wrapper,
650 683 
 .swiper-slide {
651 684
652 685 
   &.-color- {
653 686 
     &platin {
654 
-      .hero-text {
687 
+      .hero-text,
688 
+      .slide-text {
655 689 
         color: $color-bg-secondary;
656 690 
         > *:last-child:after {
657 691 
           border-color: $color-bg-secondary;
... ... 
@@ -659,7 +693,8 @@
659 693 
       }
660 694 
     }
661 695 
     &white {
662 
-      .hero-text {
696 
+      .hero-text,
697 
+      .slide-text {
663 698 
         color: $color-white;
664 699 
         > *:last-child:after {
665 700 
           border-color: $color-white;
... ... 
@@ -667,7 +702,8 @@
667 702 
       }
668 703 
     }
669 704 
     &brown {
670 
-      .hero-text {
705 
+      .hero-text,
706 
+      .slide-text {
671 707 
         color: $color-bg-primary;
672 708 
         > *:last-child:after {
673 709 
           border-color: $color-bg-primary;
... ... 
@@ -678,7 +714,8 @@
678 714
679 715 
   &.-underline-bottom,
680 716 
   &.-underline-top {
681 
-    .hero-text {
717 
+    .hero-text,
718 
+    .slide-text {
682 719 
       > * {
683 720 
         display: inline;
684 721 
         position: relative;
... ... 
@@ -698,7 +735,8 @@
698 735 
   }
699 736
700 737 
   &.-underline-bottom {
701 
-    .hero-text {
738 
+    .hero-text,
739 
+    .slide-text {
702 740 
       > * {
703 741 
         &:last-child {
704 742 
           padding-bottom: 0.3em;
... ... 
@@ -713,7 +751,8 @@
713 751 
   }
714 752
715 753 
   &.-underline-top {
716 
-    .hero-text {
754 
+    .hero-text,
755 
+    .slide-text {
717 756 
       > * {
718 757 
         display: inline-block;
719 758 
         &:last-child {
... ... 
@@ -728,6 +767,105 @@
728 767 
       }
729 768 
     }
730 769 
   }
770 
+
771 
+  .hero-text,
772 
+  .slide-text {
773 
+    margin-top: 150px;
774 
+    margin-bottom: 150px;
775 
+  }
776 
+
777 
+  &.-text-pos-left-top {
778 
+    .hero-content,
779 
+    .slide-content {
780 
+      @include text-position-wrapper(left,top);
781 
+    }
782 
+  }
783 
+  &.-text-pos-left-topmiddle {
784 
+    .hero-content,
785 
+    .slide-content {
786 
+      @include text-position-wrapper(left,topmiddle);
787 
+    }
788 
+  }
789 
+  &.-text-pos-left-middle {
790 
+    .hero-content,
791 
+    .slide-content {
792 
+      @include text-position-wrapper(left,middle);
793 
+    }
794 
+  }
795 
+  &.-text-pos-left-bottommiddle {
796 
+    .hero-content,
797 
+    .slide-content {
798 
+      @include text-position-wrapper(left,bottommiddle);
799 
+    }
800 
+  }
801 
+  &.-text-pos-left-bottom {
802 
+    .hero-content,
803 
+    .slide-content {
804 
+      @include text-position-wrapper(left,bottom);
805 
+    }
806 
+  }
807 
+
808 
+  &.-text-pos-center-top {
809 
+    .hero-content,
810 
+    .slide-content {
811 
+      @include text-position-wrapper(center,top);
812 
+    }
813 
+  }
814 
+  &.-text-pos-center-topmiddle {
815 
+    .hero-content,
816 
+    .slide-content {
817 
+      @include text-position-wrapper(center,topmiddle);
818 
+    }
819 
+  }
820 
+  &.-text-pos-center-middle {
821 
+    .hero-content,
822 
+    .slide-content {
823 
+      @include text-position-wrapper(center,middle);
824 
+    }
825 
+  }
826 
+  &.-text-pos-center-bottommiddle {
827 
+    .hero-content,
828 
+    .slide-content {
829 
+      @include text-position-wrapper(center,bottommiddle);
830 
+    }
831 
+  }
832 
+  &.-text-pos-center-bottom {
833 
+    .hero-content,
834 
+    .slide-content {
835 
+      @include text-position-wrapper(center,bottom);
836 
+    }
837 
+  }
838 
+
839 
+  &.-text-pos-right-top {
840 
+    .hero-content,
841 
+    .slide-content {
842 
+      @include text-position-wrapper(right,top);
843 
+    }
844 
+  }
845 
+  &.-text-pos-right-topmiddle {
846 
+    .hero-content,
847 
+    .slide-content {
848 
+      @include text-position-wrapper(right,topmiddle);
849 
+    }
850 
+  }
851 
+  &.-text-pos-right-middle {
852 
+    .hero-content,
853 
+    .slide-content {
854 
+      @include text-position-wrapper(right,middle);
855 
+    }
856 
+  }
857 
+  &.-text-pos-right-bottommiddle {
858 
+    .hero-content,
859 
+    .slide-content {
860 
+      @include text-position-wrapper(right,bottommiddle);
861 
+    }
862 
+  }
863 
+  &.-text-pos-right-bottom {
864 
+    .hero-content,
865 
+    .slide-content {
866 
+      @include text-position-wrapper(right,bottom);
867 
+    }
868 
+  }
731 869 
 }
732 870
733 871 
 .mod_team_list {
Browse code

Progress

Benjamin Roth authored on15/11/2022 16:38:13
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @68914d2
... ... 
@@ -828,4 +828,12 @@
828 828 
       margin-top: 0.25em;
829 829 
     }
830 830 
   }
831 
+
832 
+  @include for-max-size(989px) {
833 
+    .nav-holder {
834 
+      position: relative;
835 
+      top: auto;
836 
+      height: 50px;
837 
+    }
838 
+  }
831 839 
 }
832 840 
\ No newline at end of file
Browse code

Progress

Benjamin Roth authored on15/11/2022 15:35:41
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @39e3ec0
... ... 
@@ -732,11 +732,44 @@
732 732
733 733 
 .mod_team_list {
734 734
735 
+  .nav-holder {
736 
+    position: absolute;
737 
+    top: 50%;
738 
+    width: 100%;
739 
+  }
740 
+
735 741 
   .swiper-button-prev,
736 742 
   .swiper-button-next {
737 743 
     &:after {
738 744 
       background: $color-bg-secondary;
739 745 
     }
746 
+
747 
+    &.swiper-button-disabled {
748 
+      cursor: not-allowed;
749 
+      pointer-events: unset;
750 
+    }
751 
+
752 
+    &:not(.swiper-button-disabled) {
753 
+      &.swiper-button-next {
754 
+        &:after {
755 
+          -webkit-animation: swiperNextAnimation 4s linear infinite;
756 
+          animation: swiperNextAnimation 4s linear infinite;
757 
+          //content: 'next';
758 
+        }
759 
+      }
760 
+
761 
+      &.swiper-button-prev {
762 
+        &:after {
763 
+          -webkit-animation: swiperNextAnimation 4s linear infinite;
764 
+          animation: swiperNextAnimation 4s linear infinite;
765 
+          //content: 'prev';
766 
+        }
767 
+      }
768 
+    }
769 
+  }
770 
+
771 
+  .swiper-container {
772 
+    margin-bottom: -50px;
740 773 
   }
741 774
742 775 
   ul {
... ... 
@@ -745,7 +778,7 @@
745 778
746 779 
     li {
747 780 
       @include box-sizing(border-box);
748 
-      padding: 100px 75px 0 0;
781 
+      padding: 130px 75px 50px 0;
749 782 
     }
750 783
751 784 
     .content {
Browse code

Remote Progress

Benjamin Roth authored on15/11/2022 13:29:09
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @1ada865
... ... 
@@ -741,11 +741,11 @@
741 741
742 742 
   ul {
743 743 
     margin: 0;
744 
-    padding: 100px 0 0;
744 
+    padding: 0;
745 745
746 746 
     li {
747 747 
       @include box-sizing(border-box);
748 
-      padding-right: 75px;
748 
+      padding: 100px 75px 0 0;
749 749 
     }
750 750
751 751 
     .content {
Browse code

Remote Progress

Benjamin Roth authored on15/11/2022 13:22:22
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @87d03ce
... ... 
@@ -728,4 +728,71 @@
728 728 
       }
729 729 
     }
730 730 
   }
731 
+}
732 
+
733 
+.mod_team_list {
734 
+
735 
+  .swiper-button-prev,
736 
+  .swiper-button-next {
737 
+    &:after {
738 
+      background: $color-bg-secondary;
739 
+    }
740 
+  }
741 
+
742 
+  ul {
743 
+    margin: 0;
744 
+    padding: 100px 0 0;
745 
+
746 
+    li {
747 
+      @include box-sizing(border-box);
748 
+      padding-right: 75px;
749 
+    }
750 
+
751 
+    .content {
752 
+      @include box-sizing(border-box);
753 
+      background-color: $color-bg-tertiary;
754 
+      padding: 205px 15px 10px;
755 
+      max-width: 250px;
756 
+      margin: 0 ;
757 
+      position: relative;
758 
+      line-height: 1.3;
759 
+      font-size: font-size(16px);
760 
+    }
761 
+
762 
+    figure {
763 
+      width: 275px;
764 
+      height: 275px;
765 
+      position: absolute;
766 
+      right:-25%;
767 
+      top: -33.333%;
768 
+
769 
+      a,
770 
+      img {
771 
+        @include border-radius(999em);
772 
+        overflow: hidden;
773 
+      }
774 
+
775 
+      img {
776 
+        @include box-sizing(border-box);
777 
+        width: 275px;
778 
+        border: 10px $color-white solid;
779 
+      }
780 
+    }
781 
+
782 
+    .name,
783 
+    .position {
784 
+      font-family: $font-family-alternate;
785 
+      font-size: font-size(16px);
786 
+      font-weight: 700;
787 
+      letter-spacing: 0.125em;
788 
+    }
789 
+
790 
+    .name {
791 
+      color: $color-text-invert
792 
+    }
793 
+
794 
+    .comment {
795 
+      margin-top: 0.25em;
796 
+    }
797 
+  }
731 798 
 }
732 799 
\ No newline at end of file
Browse code

Remote Progress

Benjamin Roth authored on08/11/2022 13:28:37
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @bf2fc2b
... ... 
@@ -644,4 +644,88 @@
644 644 
     padding: 1.5rem 1rem;
645 645 
     background: $color-bg-primary;
646 646 
   }
647 
+}
648 
+
649 
+.hero-wrapper,
650 
+.swiper-slide {
651 
+
652 
+  &.-color- {
653 
+    &platin {
654 
+      .hero-text {
655 
+        color: $color-bg-secondary;
656 
+        > *:last-child:after {
657 
+          border-color: $color-bg-secondary;
658 
+        }
659 
+      }
660 
+    }
661 
+    &white {
662 
+      .hero-text {
663 
+        color: $color-white;
664 
+        > *:last-child:after {
665 
+          border-color: $color-white;
666 
+        }
667 
+      }
668 
+    }
669 
+    &brown {
670 
+      .hero-text {
671 
+        color: $color-bg-primary;
672 
+        > *:last-child:after {
673 
+          border-color: $color-bg-primary;
674 
+        }
675 
+      }
676 
+    }
677 
+  }
678 
+
679 
+  &.-underline-bottom,
680 
+  &.-underline-top {
681 
+    .hero-text {
682 
+      > * {
683 
+        display: inline;
684 
+        position: relative;
685 
+        &:last-child {
686 
+          &:after {
687 
+            position:absolute;
688 
+            left:0;
689 
+            width:100%;
690 
+            height:0;
691 
+            @include border-radius(99em);
692 
+            border-color: inherit;
693 
+            content:""
694 
+          }
695 
+        }
696 
+      }
697 
+    }
698 
+  }
699 
+
700 
+  &.-underline-bottom {
701 
+    .hero-text {
702 
+      > * {
703 
+        &:last-child {
704 
+          padding-bottom: 0.3em;
705 
+          &:after {
706 
+            bottom: -0.15em;
707 
+            border-bottom-width: 10px;
708 
+            border-bottom-style: solid;
709 
+          }
710 
+        }
711 
+      }
712 
+    }
713 
+  }
714 
+
715 
+  &.-underline-top {
716 
+    .hero-text {
717 
+      > * {
718 
+        display: inline-block;
719 
+        &:last-child {
720 
+          padding-top: 0.3em;
721 
+          &:after {
722 
+            top: -0.15em;
723 
+            right: 0;
724 
+            border-top-width: 10px;
725 
+            border-top-style: solid;
726 
+          }
727 
+        }
728 
+      }
729 
+    }
730 
+  }
647 731 
 }
648 732 
\ No newline at end of file
Browse code

Progress

Benjamin Roth authored on07/11/2022 23:42:50
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @9e3b418
... ... 
@@ -76,23 +76,18 @@
76 76 
   }
77 77 
 }
78 78
79 
-.arrow_right {
80 
-  background-color: $color-bg-tertiary;
81 
-  color: $color-text-invert;
82 
-
83 
-  position: relative;
84 
-  min-height: 450px;
85 
-  &:before {
86 
-    position: absolute;
87 
-    top:0;
88 
-    bottom: 0;
89 
-    left: 100%;
90 
-    width: 50px;
91 
-    content: '';
92 
-    background: url('data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%22100%22%20fill%3D%22%23000000%22%20viewBox%3D%220%200%2010%20100%22%20preserveAspectRatio%3D%22none%22%20%3E%3Cpath%20d%3D%22M0%2C0%20L0%2C100%20L10%2C50z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E') no-repeat 100% 50%;
93 
-    -webkit-background-size: 100% 100%;
94 
-    background-size: 100% 100%;
95 
-  }
79 
+#scroll-down-indicator {
80 
+  z-index: 10;
81 
+  position: fixed;
82 
+  right: 40px;
83 
+  bottom: 40px;
84 
+  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
85 
+  mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
86 
+  -webkit-mask-repeat: no-repeat;
87 
+  mask-repeat: no-repeat;
88 
+  width: 40px;
89 
+  height: 20px;
90 
+  background-color: rgba($color-bg-tertiary,0.8);
96 91 
 }
97 92
98 93 
 .widget p.error {
... ... 
@@ -101,16 +96,6 @@
101 96 
   color: #a00;
102 97 
 }
103 98
104 
-.boxed {
105 
-  @include box;
106 
-
107 
-  .boxed & {
108 
-    background-color: inherit;
109 
-    padding: 0;
110 
-    @include box-sizing(border-box);
111 
-  }
112 
-}
113 
-
114 99 
 .mod_login {
115 100 
   .lostPassword {
116 101 
     padding: 0 10px;
... ... 
@@ -261,119 +246,6 @@
261 246 
   }
262 247 
 }
263 248
264 
-#cconsent-bar {
265 
-  &#cconsent-bar {
266 
-    padding: 15px 45px;
267 
-    color: $color-text;
268 
-    font-size: font-size(16px) !important;
269 
-    @include for-tablet {
270 
-      padding: 15px 30px;
271 
-    }
272 
-    @include for-mobile {
273 
-      padding: 15px;
274 
-    }
275 
-  }
276 
-  .ccb__wrapper {
277 
-    font-family: $font-family;
278 
-
279 
-    button,
280 
-    .ccb__edit {
281 
-      @include button($color: $color-text,$background-color: $color-text-invert, $border-color: $color-text-invert, $color-hover: $color-text-invert, $background-color-hover: $color-bg-secondary, $border-color-hover: $color-bg-secondary);
282 
-      letter-spacing: 0.1em;
283 
-      text-decoration: none;
284 
-    }
285 
-  }
286 
-}
287 
-#cconsent-modal {
288 
-  .ccm__content.ccm__content {
289 
-    font-family: $font-family;
290 
-    font-size: font-size(16px);
291 
-    background-color: $color-bg-senary;
292 
-
293 
-    > .ccm__content__heading.ccm__content__heading {
294 
-      background-color: $color-bg-senary;
295 
-      h2 {
296 
-        @include small-caps;
297 
-        font-size: font-size(30px);
298 
-        letter-spacing: normal;
299 
-      }
300 
-    }
301 
-    > .ccm__content__body.ccm__content__body {
302 
-      .ccm__tabgroup {
303 
-        .ccm__tab-head {
304 
-          background-color: $color-bg-primary;
305 
-          color: $color-text;
306 
-          font-weight: 600;
307 
-          text-transform: uppercase;
308 
-          letter-spacing: 0.1em;
309 
-
310 
-          &:before {
311 
-            position: absolute;
312 
-            left: 1em;
313 
-            top: 50%;
314 
-            margin-top: -0.5em;
315 
-            font-size: 1.25em;
316 
-            width: 1em;
317 
-            height: 1em;
318 
-            content: '';
319 
-            background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23990000" viewBox="0 0 32 32"%3E%3Cpath d="M6.393 26.806l10.192-10.192c0.327-0.327 0.327-0.859 0-1.186s-0.859-0.327-1.186 0l-10.192 10.192c-0.327 0.327-0.327 0.859 0 1.186s0.859 0.327 1.186 0z"%3E%3C/path%3E%3Cpath d="M5.165 6.38l10.235 10.235c0.327 0.327 0.859 0.327 1.186 0s0.327-0.859 0-1.186l-10.235-10.235c-0.327-0.327-0.859-0.327-1.186 0s-0.327 0.859 0 1.186z"%3E%3C/path%3E%3Cpath d="M25.607 26.806l-10.192-10.192c-0.327-0.327-0.327-0.859 0-1.186s0.859-0.327 1.186 0l10.192 10.192c0.327 0.327 0.327 0.859 0 1.186s-0.859 0.327-1.186 0z"%3E%3C/path%3E%3Cpath d="M26.835 6.38l-10.235 10.235c-0.327 0.327-0.859 0.327-1.186 0s-0.327-0.859 0-1.186l10.235-10.235c0.327-0.327 0.859-0.327 1.186 0s0.327 0.859 0 1.186z"%3E%3C/path%3E%3C/svg%3E') no-repeat 50% 50%;
320 
-          }
321 
-        }
322 
-        .ccm__tab-content {
323 
-          h3 {
324 
-            @include small-caps;
325 
-            font-size: font-size(25px);
326 
-            letter-spacing: normal;
327 
-          }
328 
-        }
329 
-        &.ccm__tabgroup--open {
330 
-          .ccm__tab-head {
331 
-            background-color: $color-bg-quinary;
332 
-          }
333 
-
334 
-          .ccm__tab-content {
335 
-            background-color: $color-bg-senary;
336 
-          }
337 
-        }
338 
-
339 
-        &.checked-5jhk {
340 
-          .ccm__tab-head {
341 
-            &:before {
342 
-              background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%2328A834" viewBox="0 0 32 32"%3E%3Cpath d="M12.259 21.696l9.465-15.941c0.437-0.736 1.388-0.978 2.124-0.541s0.978 1.388 0.541 2.124c0 0-9.465 15.941-9.465 15.941l-2.241 3.773c0 0-2.807-3.373-2.807-3.373l-5.509-6.619c-0.547-0.657-0.458-1.635 0.2-2.183s1.635-0.458 2.183 0.2l5.509 6.619z"%3E%3C/path%3E%3C/svg%3E') no-repeat 50% 50%;
343 
-            }
344 
-          }
345 
-        }
346 
-      }
347 
-    }
348 
-    .ccm__footer.ccm__footer {
349 
-      background-color: $color-bg-senary;
350 
-
351 
-      button {
352 
-        @include button;
353 
-        letter-spacing: 0.1em;
354 
-        text-decoration: none;
355 
-      }
356 
-    }
357 
-  }
358 
-}
359 
-
360 
-.mountain {
361 
-  color: $color-bg-tertiary;
362 
-  text-align: center;
363 
-  img {
364 
-    font-size: 40vh;
365 
-    vertical-align: bottom;
366 
-  }
367 
-
368 
-  margin-bottom: -100px;
369 
-}
370 
-
371 
-.client-showcase {
372 
-	.swiper-wrapper {
373 
-		align-items: flex-end;
374 
-	}
375 
-}
376 
-
377 249 
 .swiper-holder {
378 250 
   &.-full-vh {
379 251
... ... 
@@ -684,83 +556,6 @@
684 556 
 }
685 557
686 558
687 
-/* ------ Fusion Popup ------ */
688 
-@mixin fp_center_wrapper {
689 
-  text-align: center;
690 
-  display: flex;
691 
-  align-items: center;
692 
-  > * {
693 
-    flex: 1 0 auto;
694 
-    max-width: 100%;
695 
-  }
696 
-}
697 
-.fusion_popup {
698 
-  background: #fff;
699 
-  /*position: fixed;
700 
-  left: 50%;
701 
-  top: 50%;
702 
-  @include transform(translate(-50%,-50%));
703 
-  max-width: 650px;
704 
-  width: 100%;*/
705 
-  .fp-title {
706 
-    background: url("../images/fusion_popup/hero_popup.jpg") center bottom no-repeat;
707 
-    -webkit-background-size: cover;
708 
-    background-size: cover;
709 
-    @include aspect-ratio(5,2,true);
710 
-    @include fp_center_wrapper;
711 
-    padding: 7.5% 0 11.55%;
712 
-  }
713 
-
714 
-  .fp-body {
715 
-    @include fp_center_wrapper;
716 
-    padding: 1em 0 0;
717 
-  }
718 
-
719 
-  .fp-action {
720 
-    background: url("../images/fusion_popup/footer_black@2x.jpg") center top no-repeat;
721 
-    -webkit-background-size: cover;
722 
-    background-size: cover;
723 
-    @include fp_center_wrapper;
724 
-    padding: 11.55% 0 7.5%;
725 
-
726 
-    a {
727 
-      font-size: font-size(55px);
728 
-      color: #fff;
729 
-
730 
-      @include for-max-size(650px) {
731 
-        font-size: 8.9vw;
732 
-      }
733 
-    }
734 
-  }
735 
-
736 
-  &,
737 
-  p,
738 
-  h3,
739 
-  .image_container {
740 
-    @include headline();
741 
-    margin: 0 0 0.5em;
742 
-    line-height: 1.15;
743 
-    font-size: font-size(45px);
744 
-
745 
-    &:last-child {
746 
-      margin-bottom: 0;
747 
-    }
748 
-
749 
-    @include for-max-size(650px) {
750 
-      font-size: 7.3vw;
751 
-    }
752 
-  }
753 
-
754 
-  .image_container {
755 
-    margin: 0 25px;
756 
-    img {
757 
-      vertical-align: middle;
758 
-      width: 350px;
759 
-      max-width: 100%;
760 
-    }
761 
-  }
762 
-}
763 
-
764 559 
 .ce_accordion {
765 560 
   + .ce_accordion {
766 561 
     margin-top: 5px;
... ... 
@@ -849,30 +644,4 @@
849 644 
     padding: 1.5rem 1rem;
850 645 
     background: $color-bg-primary;
851 646 
   }
852 
-}
853 
-
854 
-#eye-catcher {
855 
-  @include centered();
856 
-  z-index: 1;
857 
-
858 
-  figure {
859 
-    position: absolute;
860 
-    right: 0;
861 
-    bottom: 100%;
862 
-    margin-bottom: 5vw;
863 
-    @include for-max-size(1230px) {
864 
-      right: 15px;
865 
-    }
866 
-
867 
-    a {
868 
-      &:before {
869 
-        display: none;
870 
-      }
871 
-    }
872 
-
873 
-    img {
874 
-      max-width: 33vw;
875 
-      width: 300px;
876 
-    }
877 
-  }
878 647 
 }
879 648 
\ No newline at end of file
Browse code

Progress

Benjamin Roth authored on07/11/2022 18:15:35
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @6f8cc39
... ... 
@@ -44,15 +44,35 @@
44 44 
   padding-left: 150px;
45 45 
   position: relative;
46 46
47 
-  &:before {
48 
-    content: '';
49 
-    width: 50px;
50 
-    height: 100px;
51 
-    background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
52 
-    position: absolute;
53 
-    left: 75px;
54 
-    top: 0;
55 
-    @include transform(translate(-50%,0));
47 
+  &:not(.ce_text) {
48 
+
49 
+    &:before {
50 
+      content: '';
51 
+      width: 50px;
52 
+      height: 100px;
53 
+      background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
54 
+      position: absolute;
55 
+      left: 75px;
56 
+      top: 0;
57 
+      @include transform(translate(-50%,0));
58 
+    }
59 
+  }
60 
+
61 
+  &.ce_text {
62 
+    .text {
63 
+      position: relative;
64 
+
65 
+      &:before {
66 
+        content: '';
67 
+        width: 50px;
68 
+        height: 100px;
69 
+        background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
70 
+        position: absolute;
71 
+        left: -75px;
72 
+        top: 0;
73 
+        @include transform(translate(-50%,0));
74 
+      }
75 
+    }
56 76 
   }
57 77 
 }
58 78
... ... 
@@ -354,17 +374,41 @@
354 374 
 	}
355 375 
 }
356 376
377 
+.swiper-holder {
378 
+  &.-full-vh {
379 
+
380 
+    .swiper-slide {
381 
+      min-height: 100vh;
382 
+    }
383 
+  }
384 
+}
385 
+
386 
+.swiper-button-prev,
387 
+.swiper-button-next {
388 
+  width: 25px;
389 
+  height: 50px;
390 
+  margin-top: -25px;
391 
+}
392 
+
357 393 
 .swiper-button-prev,
358 394 
 .swiper-container-rtl .swiper-button-next {
359 395 
   &:after {
360 396 
     content: '';
361 
-    background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M22,0L20,0L0,40L20,80L22,80L2,40L22,0Z" style="fill:white;"/%3E%3C/svg%3E');
362 
-    width: 22px;
363 
-    height: 80px;
397 
+    //background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M22,0L20,0L0,40L20,80L22,80L2,40L22,0Z" style="fill:white;"/%3E%3C/svg%3E');
398 
+    background: $color-white;
399 
+    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M1.678,65.45c-1.409,-2.509 -1.409,-5.581 0,-8.09l36.13,-54.92c1.41,-2.31 5.08,-3.18 7.05,-1.74l15,7c2.22,1.39 2.78,5.14 1.37,7.46l-30.23,46.24l29.95,45.67c1.69,2.6 0.84,6.36 -0.85,7.52l-15.24,7.22c-2.25,1.45 -5.64,0.29 -7.05,-1.73l-36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
400 
+    mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M1.678,65.45c-1.409,-2.509 -1.409,-5.581 0,-8.09l36.13,-54.92c1.41,-2.31 5.08,-3.18 7.05,-1.74l15,7c2.22,1.39 2.78,5.14 1.37,7.46l-30.23,46.24l29.95,45.67c1.69,2.6 0.84,6.36 -0.85,7.52l-15.24,7.22c-2.25,1.45 -5.64,0.29 -7.05,-1.73l-36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
401 
+    -webkit-mask-repeat: no-repeat;
402 
+    mask-repeat: no-repeat;
403 
+    width: 25px;
404 
+    height: 50px;
405 
+    opacity: 0.7;
406 
+    @include transition(opacity 0.25s ease);
364 407 
   }
365 408 
   &:hover {
366 409 
     &:after {
367 
-      background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M22,0L20,0L0,40L20,80L22,80L2,40L22,0Z" style="fill:%23BA0C2F;"/%3E%3C/svg%3E');
410 
+      //background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M22,0L20,0L0,40L20,80L22,80L2,40L22,0Z" style="fill:%23BA0C2F;"/%3E%3C/svg%3E');
411 
+      opacity: 1;
368 412 
     }
369 413 
   }
370 414 
 }
... ... 
@@ -372,13 +416,21 @@
372 416 
 .swiper-container-rtl .swiper-button-prev {
373 417 
   &:after {
374 418 
     content: '';
375 
-    background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M0,0L2,0L22,40L2,80L0,80L20,40L0,0Z" style="fill:white;"/%3E%3C/svg%3E');
376 
-    width: 22px;
377 
-    height: 80px;
419 
+    //background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M0,0L2,0L22,40L2,80L0,80L20,40L0,0Z" style="fill:white;"/%3E%3C/svg%3E');
420 
+    background: $color-white;
421 
+    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
422 
+    mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");
423 
+    -webkit-mask-repeat: no-repeat;
424 
+    mask-repeat: no-repeat;
425 
+    width: 25px;
426 
+    height: 50px;
427 
+    opacity: 0.7;
428 
+    @include transition(opacity 0.25s ease);
378 429 
   }
379 430 
   &:hover {
380 431 
     &:after {
381 
-      background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M0,0L2,0L22,40L2,80L0,80L20,40L0,0Z" style="fill:%23BA0C2F;"/%3E%3C/svg%3E');
432 
+      //background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M0,0L2,0L22,40L2,80L0,80L20,40L0,0Z" style="fill:%23BA0C2F;"/%3E%3C/svg%3E');
433 
+      opacity: 1;
382 434 
     }
383 435 
   }
384 436 
 }
Browse code

Initial commit

Benjamin Roth authored on07/11/2022 09:19:06
Showing1 changed files
files/themes/aldegott_2022/assets/css/theme.scss
History View file @6e83285
1 1 
new file mode 100644
... ... 
@@ -0,0 +1,826 @@
1 
+@if not-imported("import_once_func") { @import "inc/import_once_func"; }
2 
+//@import "inc/normalize.css"; // Normalize browser defaults
3 
+
4 
+@if not-imported("framework") { @import "inc/framework"; } // Load framework
5 
+
6 
+/* ------ COMMON CLASSES ------ */
7 
+@if not-imported("common") { @import "inc/common"; }
8 
+/* ------ BASE FONT STYLING ------ */
9 
+@if not-imported("font") { @import "inc/font"; }
10 
+/* ------ BASE FORM STYLING ------ */
11 
+@if not-imported("form") { @import "inc/form"; }
12 
+/* ------ HEADER ------ */
13 
+@if not-imported("header") { @import "inc/header"; }
14 
+/* ------ HERO ------ */
15 
+@if not-imported("hero") { @import "inc/hero"; }
16 
+/* ------ CONTENT ------ */
17 
+@if not-imported("content") { @import "inc/content"; }
18 
+/* ------ FOOTER ------ */
19 
+@if not-imported("footer") { @import "inc/footer"; }
20 
+
21 
+@if not-imported("slick-theme") { @import "inc/slick-theme"; }
22 
+
23 
+@if not-imported("custom-elements") { @import "inc/custom-elements"; }
24 
+
25 
+
26 
+#wrapper {
27 
+  padding: 0;
28 
+  position: relative;
29 
+  min-height: 100vh;
30 
+  -webkit-box-sizing: border-box;
31 
+  -moz-box-sizing: border-box;
32 
+  box-sizing: border-box;
33 
+
34 
+  @media screen and (max-width: 1120px) {
35 
+    padding-top: 0;
36 
+  }
37 
+
38 
+  @media screen and (max-width: 900px) {
39 
+    padding-bottom: 0;
40 
+  }
41 
+}
42 
+
43 
+.-arrow-left-top {
44 
+  padding-left: 150px;
45 
+  position: relative;
46 
+
47 
+  &:before {
48 
+    content: '';
49 
+    width: 50px;
50 
+    height: 100px;
51 
+    background: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 62 123' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M60.32,65.45c1.409,-2.509 1.409,-5.581 0,-8.09l-36.13,-54.92c-1.41,-2.31 -5.08,-3.18 -7.05,-1.74l-15,7c-2.22,1.39 -2.78,5.14 -1.37,7.46l30.23,46.24l-29.95,45.67c-1.69,2.6 -0.84,6.36 0.85,7.52l15.24,7.22c2.25,1.45 5.64,0.29 7.05,-1.73l36.13,-54.63Z' style='fill:%23#{str-replace($color-bg-secondary,'#','')};fill-rule:nonzero;'/%3E%3C/svg%3E") 0 0 no-repeat;
52 
+    position: absolute;
53 
+    left: 75px;
54 
+    top: 0;
55 
+    @include transform(translate(-50%,0));
56 
+  }
57 
+}
58 
+
59 
+.arrow_right {
60 
+  background-color: $color-bg-tertiary;
61 
+  color: $color-text-invert;
62 
+
63 
+  position: relative;
64 
+  min-height: 450px;
65 
+  &:before {
66 
+    position: absolute;
67 
+    top:0;
68 
+    bottom: 0;
69 
+    left: 100%;
70 
+    width: 50px;
71 
+    content: '';
72 
+    background: url('data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%22100%22%20fill%3D%22%23000000%22%20viewBox%3D%220%200%2010%20100%22%20preserveAspectRatio%3D%22none%22%20%3E%3Cpath%20d%3D%22M0%2C0%20L0%2C100%20L10%2C50z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E') no-repeat 100% 50%;
73 
+    -webkit-background-size: 100% 100%;
74 
+    background-size: 100% 100%;
75 
+  }
76 
+}
77 
+
78 
+.widget p.error {
79 
+  margin-top: 0.125em;
80 
+  font-size: font-size(16px);
81 
+  color: #a00;
82 
+}
83 
+
84 
+.boxed {
85 
+  @include box;
86 
+
87 
+  .boxed & {
88 
+    background-color: inherit;
89 
+    padding: 0;
90 
+    @include box-sizing(border-box);
91 
+  }
92 
+}
93 
+
94 
+.mod_login {
95 
+  .lostPassword {
96 
+    padding: 0 10px;
97 
+    clear: left;
98 
+    a {
99 
+      font-size: font-size(10px);
100 
+      text-transform: uppercase;
101 
+      letter-spacing: 0.1em;
102 
+      color: $color-text;
103 
+      font-weight: 600;
104 
+    }
105 
+  }
106 
+}
107 
+
108 
+.mod_lostPassword,
109 
+.mod_changePassword,
110 
+.mod_closeAccount {
111 
+  .widget {
112 
+    width: 33.333%;
113 
+  }
114 
+
115 
+  @include for-max-size(43em) {
116 
+    .widget {
117 
+      float: none;
118 
+      width: 100% !important;
119 
+    }
120 
+  }
121 
+}
122 
+.mod_changePassword {
123 
+  .widget:nth-child(2) {
124 
+    clear: left;
125 
+  }
126 
+}
127 
+
128 
+.messagebox {
129 
+  position: relative;
130 
+  min-height: 45px;
131 
+  padding: 5px 15px 5px 45px;
132 
+  display: flex;
133 
+  align-items: center;
134 
+  background-color: $color-bg-quaternary;
135 
+  color: $color-text-invert;
136 
+  font-size: font-size(12px);
137 
+  font-weight: 600;
138 
+  line-height: 1.3;
139 
+  letter-spacing: 0.1em;
140 
+  text-transform: uppercase;
141 
+  @include box-sizing(border-box);
142 
+
143 
+  &:before {
144 
+    position: absolute;
145 
+    left: 5px;
146 
+    top: 5px;
147 
+    width: 35px;
148 
+    height: 35px;
149 
+    content: '';
150 
+    background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23ffffff" width="1.725em" height="1.725em" viewBox="0 0 32 32"%3E%3Cpath d="M16 4.992c-6.075 0-11.008 4.932-11.008 11.008s4.932 11.008 11.008 11.008c6.075 0 11.008-4.933 11.008-11.008s-4.933-11.008-11.008-11.008zM16 6.746c5.108 0 9.254 4.147 9.254 9.254s-4.147 9.254-9.254 9.254c-5.108 0-9.254-4.147-9.254-9.254s4.147-9.254 9.254-9.254z"%3E%3C/path%3E%3Cpath d="M14.636 15.225v7.010c0 0.753 0.611 1.364 1.364 1.364s1.364-0.611 1.364-1.364v-7.010c0-0.753-0.611-1.364-1.364-1.364s-1.364 0.611-1.364 1.364z"%3E%3C/path%3E%3Cpath d="M17.364 10.549v-0.779c0-0.753-0.611-1.364-1.364-1.364s-1.364 0.611-1.364 1.364v0.779c0 0.753 0.611 1.364 1.364 1.364s1.364-0.611 1.364-1.364z"%3E%3C/path%3E%3C/svg%3E') no-repeat 50% 50%;
151 
+  }
152 
+
153 
+  &.confirm {
154 
+    &:before {
155 
+      background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23ffffff" width="1.725em" height="1.725em" viewBox="0 0 32 32"%3E%3Cpath d="M12.259 21.696l9.465-15.941c0.437-0.736 1.388-0.978 2.124-0.541s0.978 1.388 0.541 2.124c0 0-9.465 15.941-9.465 15.941l-2.241 3.773c0 0-2.807-3.373-2.807-3.373l-5.509-6.619c-0.547-0.657-0.458-1.635 0.2-2.183s1.635-0.458 2.183 0.2l5.509 6.619z"%3E%3C/path%3E%3C/svg%3E') no-repeat 50% 50%;
156 
+    }
157 
+  }
158 
+
159 
+  &.error {
160 
+  &:before {
161 
+      background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23ffffff" width="1.725em" height="1.725em" viewBox="0 0 32 32"%3E%3Cpath d="M14.428 6.454c-2.155 3.629-8.034 13.53-10.228 17.226-0.335 0.565-0.342 1.267-0.017 1.838s0.932 0.924 1.589 0.924c4.349 0 16.107 0 20.456 0 0.657 0 1.264-0.353 1.589-0.924s0.319-1.273-0.017-1.838c-2.194-3.696-8.073-13.597-10.228-17.226-0.329-0.555-0.927-0.895-1.572-0.895s-1.243 0.34-1.572 0.895v0zM15.96 7.363c0.008-0.014 0.024-0.023 0.040-0.023s0.032 0.009 0.040 0.023c2.155 3.629 8.034 13.53 10.228 17.226 0.009 0.015 0.009 0.032 0 0.047s-0.024 0.024-0.041 0.024c-4.349 0-16.107 0-20.456 0-0.017 0-0.032-0.009-0.041-0.024s-0.008-0.033 0-0.047l10.228-17.226z"%3E%3C/path%3E%3Cpath d="M15.109 11.113v7.063c0 0.491 0.399 0.891 0.891 0.891s0.891-0.399 0.891-0.891v-7.063c0-0.492-0.399-0.891-0.891-0.891s-0.891 0.399-0.891 0.891z"%3E%3C/path%3E%3Cpath d="M15.109 21.269v1.188c0 0.491 0.399 0.891 0.891 0.891s0.891-0.399 0.891-0.891v-1.188c0-0.492-0.399-0.891-0.891-0.891s-0.891 0.399-0.891 0.891z"%3E%3C/path%3E%3C/svg%3E') no-repeat 50% 50%;
162 
+    }
163 
+  }
164 
+
165 
+  a {
166 
+    color: $color-text-invert;
167 
+    border-bottom: 1px $color-text-invert solid;
168 
+    @include transition(color 0.2s ease, border-color 0.2s ease);
169 
+
170 
+    &:hover,
171 
+    &:active {
172 
+      border-bottom-color: $color-bg-secondary;
173 
+      color: $color-bg-secondary;
174 
+    }
175 
+  }
176 
+}
177 
+
178 
+.jBox-overlay {
179 
+  background-color: rgba(#000,0.82);
180 
+  &.jBox-overlay-Image {
181 
+    background: $color-bg-secondary;
182 
+  }
183 
+}
184 
+
185 
+.jBox-wrapper {
186 
+  .jBox-container {
187 
+    @include border-radius(unset);
188 
+  }
189 
+  .jBox-title {
190 
+    background-color: $color-bg-secondary;
191 
+    color: $color-text-invert;
192 
+    @include border-radius(unset);
193 
+    text-align: center;
194 
+    h3 {
195 
+      font-family: $font-family;
196 
+      color: $color-text-invert;
197 
+      font-weight: 400;
198 
+      font-size: font-size(20px);
199 
+      //text-transform: uppercase;
200 
+      //letter-spacing: 0.1em;
201 
+      margin: 0;
202 
+      text-align: center;
203 
+    }
204 
+    .jBox-closeButton-title& {
205 
+      padding-left: 65px;
206 
+    }
207 
+  }
208 
+
209 
+  .jBox-closeButton-box& {
210 
+    .jBox-closeButton {
211 
+      width: 35px;
212 
+      height: 35px;
213 
+      background: $color-bg-secondary;
214 
+      svg {
215 
+        width: 20px;
216 
+        height: 20px;
217 
+        margin-top: -10px;
218 
+        margin-right: -10px;
219 
+      }
220 
+      path {
221 
+        fill: #fff;
222 
+      }
223 
+    }
224 
+  }
225 
+
226 
+  .jBox-iframe& {
227 
+    .jBox-content {
228 
+      @include box-sizing(border-box);
229 
+      overflow: hidden;
230 
+      > iframe {
231 
+        width: 100%;
232 
+        height: 100%;
233 
+      }
234 
+    }
235 
+  }
236 
+
237 
+  .jBox-noPadding& {
238 
+    .jBox-content {
239 
+      padding: 0;
240 
+    }
241 
+  }
242 
+}
243 
+
244 
+#cconsent-bar {
245 
+  &#cconsent-bar {
246 
+    padding: 15px 45px;
247 
+    color: $color-text;
248 
+    font-size: font-size(16px) !important;
249 
+    @include for-tablet {
250 
+      padding: 15px 30px;
251 
+    }
252 
+    @include for-mobile {
253 
+      padding: 15px;
254 
+    }
255 
+  }
256 
+  .ccb__wrapper {
257 
+    font-family: $font-family;
258 
+
259 
+    button,
260 
+    .ccb__edit {
261 
+      @include button($color: $color-text,$background-color: $color-text-invert, $border-color: $color-text-invert, $color-hover: $color-text-invert, $background-color-hover: $color-bg-secondary, $border-color-hover: $color-bg-secondary);
262 
+      letter-spacing: 0.1em;
263 
+      text-decoration: none;
264 
+    }
265 
+  }
266 
+}
267 
+#cconsent-modal {
268 
+  .ccm__content.ccm__content {
269 
+    font-family: $font-family;
270 
+    font-size: font-size(16px);
271 
+    background-color: $color-bg-senary;
272 
+
273 
+    > .ccm__content__heading.ccm__content__heading {
274 
+      background-color: $color-bg-senary;
275 
+      h2 {
276 
+        @include small-caps;
277 
+        font-size: font-size(30px);
278 
+        letter-spacing: normal;
279 
+      }
280 
+    }
281 
+    > .ccm__content__body.ccm__content__body {
282 
+      .ccm__tabgroup {
283 
+        .ccm__tab-head {
284 
+          background-color: $color-bg-primary;
285 
+          color: $color-text;
286 
+          font-weight: 600;
287 
+          text-transform: uppercase;
288 
+          letter-spacing: 0.1em;
289 
+
290 
+          &:before {
291 
+            position: absolute;
292 
+            left: 1em;
293 
+            top: 50%;
294 
+            margin-top: -0.5em;
295 
+            font-size: 1.25em;
296 
+            width: 1em;
297 
+            height: 1em;
298 
+            content: '';
299 
+            background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23990000" viewBox="0 0 32 32"%3E%3Cpath d="M6.393 26.806l10.192-10.192c0.327-0.327 0.327-0.859 0-1.186s-0.859-0.327-1.186 0l-10.192 10.192c-0.327 0.327-0.327 0.859 0 1.186s0.859 0.327 1.186 0z"%3E%3C/path%3E%3Cpath d="M5.165 6.38l10.235 10.235c0.327 0.327 0.859 0.327 1.186 0s0.327-0.859 0-1.186l-10.235-10.235c-0.327-0.327-0.859-0.327-1.186 0s-0.327 0.859 0 1.186z"%3E%3C/path%3E%3Cpath d="M25.607 26.806l-10.192-10.192c-0.327-0.327-0.327-0.859 0-1.186s0.859-0.327 1.186 0l10.192 10.192c0.327 0.327 0.327 0.859 0 1.186s-0.859 0.327-1.186 0z"%3E%3C/path%3E%3Cpath d="M26.835 6.38l-10.235 10.235c-0.327 0.327-0.859 0.327-1.186 0s-0.327-0.859 0-1.186l10.235-10.235c0.327-0.327 0.859-0.327 1.186 0s0.327 0.859 0 1.186z"%3E%3C/path%3E%3C/svg%3E') no-repeat 50% 50%;
300 
+          }
301 
+        }
302 
+        .ccm__tab-content {
303 
+          h3 {
304 
+            @include small-caps;
305 
+            font-size: font-size(25px);
306 
+            letter-spacing: normal;
307 
+          }
308 
+        }
309 
+        &.ccm__tabgroup--open {
310 
+          .ccm__tab-head {
311 
+            background-color: $color-bg-quinary;
312 
+          }
313 
+
314 
+          .ccm__tab-content {
315 
+            background-color: $color-bg-senary;
316 
+          }
317 
+        }
318 
+
319 
+        &.checked-5jhk {
320 
+          .ccm__tab-head {
321 
+            &:before {
322 
+              background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%2328A834" viewBox="0 0 32 32"%3E%3Cpath d="M12.259 21.696l9.465-15.941c0.437-0.736 1.388-0.978 2.124-0.541s0.978 1.388 0.541 2.124c0 0-9.465 15.941-9.465 15.941l-2.241 3.773c0 0-2.807-3.373-2.807-3.373l-5.509-6.619c-0.547-0.657-0.458-1.635 0.2-2.183s1.635-0.458 2.183 0.2l5.509 6.619z"%3E%3C/path%3E%3C/svg%3E') no-repeat 50% 50%;
323 
+            }
324 
+          }
325 
+        }
326 
+      }
327 
+    }
328 
+    .ccm__footer.ccm__footer {
329 
+      background-color: $color-bg-senary;
330 
+
331 
+      button {
332 
+        @include button;
333 
+        letter-spacing: 0.1em;
334 
+        text-decoration: none;
335 
+      }
336 
+    }
337 
+  }
338 
+}
339 
+
340 
+.mountain {
341 
+  color: $color-bg-tertiary;
342 
+  text-align: center;
343 
+  img {
344 
+    font-size: 40vh;
345 
+    vertical-align: bottom;
346 
+  }
347 
+
348 
+  margin-bottom: -100px;
349 
+}
350 
+
351 
+.client-showcase {
352 
+	.swiper-wrapper {
353 
+		align-items: flex-end;
354 
+	}
355 
+}
356 
+
357 
+.swiper-button-prev,
358 
+.swiper-container-rtl .swiper-button-next {
359 
+  &:after {
360 
+    content: '';
361 
+    background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M22,0L20,0L0,40L20,80L22,80L2,40L22,0Z" style="fill:white;"/%3E%3C/svg%3E');
362 
+    width: 22px;
363 
+    height: 80px;
364 
+  }
365 
+  &:hover {
366 
+    &:after {
367 
+      background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M22,0L20,0L0,40L20,80L22,80L2,40L22,0Z" style="fill:%23BA0C2F;"/%3E%3C/svg%3E');
368 
+    }
369 
+  }
370 
+}
371 
+.swiper-button-next,
372 
+.swiper-container-rtl .swiper-button-prev {
373 
+  &:after {
374 
+    content: '';
375 
+    background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M0,0L2,0L22,40L2,80L0,80L20,40L0,0Z" style="fill:white;"/%3E%3C/svg%3E');
376 
+    width: 22px;
377 
+    height: 80px;
378 
+  }
379 
+  &:hover {
380 
+    &:after {
381 
+      background: url('data:image/svg+xml;utf8,%3Csvg width="100%" height="100%" viewBox="0 0 22 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"%3E%3Cpath d="M0,0L2,0L22,40L2,80L0,80L20,40L0,0Z" style="fill:%23BA0C2F;"/%3E%3C/svg%3E');
382 
+    }
383 
+  }
384 
+}
385 
+
386 
+.mod_cfg_instagram {
387 
+  .items {
388 
+    display: flex;
389 
+    flex-wrap: wrap;
390 
+    align-items: stretch;
391 
+  }
392 
+  .item {
393 
+    text-align: center;
394 
+    font-size: font-size(16px);
395 
+    line-height: 1.3;
396 
+    flex: 0 1 25%;
397 
+    margin: 0;
398 
+    overflow: hidden;
399 
+    padding: 0;
400 
+    //border: 1px solid $color-stroke;
401 
+    outline: none;
402 
+    color: $color-text;
403 
+    -webkit-box-sizing: border-box;
404 
+    -moz-box-sizing: border-box;
405 
+    box-sizing: border-box;
406 
+    position: relative;
407 
+
408 
+    .image_container {
409 
+      vertical-align: middle;
410 
+      position: relative;
411 
+
412 
+      &:before,
413 
+      &:after {
414 
+        @include transition(all 1.5s cubic-bezier(0.45, 0, 0.55, 1));
415 
+      }
416 
+
417 
+      &:before {
418 
+        z-index: 1;
419 
+        background: rgba($color-bg-secondary, 0.5);
420 
+        position: absolute;
421 
+        top: 0;
422 
+        bottom: 0;
423 
+        left: 0;
424 
+        right: 0;
425 
+        visibility: hidden;
426 
+        opacity: 0;
427 
+        content: '';
428 
+      }
429 
+      /*&:after {
430 
+        @include icon('\e912',26px);
431 
+        z-index: 2;
432 
+        position: absolute;
433 
+        left: 50%;
434 
+        top: 50%;
435 
+        visibility: hidden;
436 
+        opacity: 0;
437 
+        margin: -13px 0 0 -13px;
438 
+        color: rgba(255, 255, 255, 0.75);
439 
+        -webkit-transform: scale3d(0.5,0.5,1);
440 
+        -moz-transform: scale3d(0.5,0.5,1);
441 
+        -ms-transform: scale3d(0.5,0.5,1);
442 
+        -o-transform: scale3d(0.5,0.5,1);
443 
+        transform: scale3d(0.5,0.5,1);
444 
+      }*/
445 
+
446 
+      img {
447 
+        @include object-fit;
448 
+        @include transform(translateZ(0));
449 
+        @include transition(all 1.5s cubic-bezier(0.45, 0, 0.55, 1));
450 
+      }
451 
+    }
452 
+
453 
+    .show-link {
454 
+      margin: 0;
455 
+      span {
456 
+        @include button($color: $color-text-invert, $border-color: $color-stroke-grey, $background-color: rgba(#000,0.2));
457 
+        z-index: 2;
458 
+        position: absolute;
459 
+        bottom: 1em;
460 
+        left: 50%;
461 
+        @include transform(translateX(-50%));
462 
+      }
463 
+    }
464 
+
465 
+    .close-link,
466 
+    .show-link span {
467 
+      cursor: pointer;
468 
+    }
469 
+
470 
+    .meta {
471 
+      z-index: 2;
472 
+      opacity: 0;
473 
+      visibility: hidden;
474 
+      position: absolute;
475 
+      left: 0;
476 
+      right: 0;
477 
+      top: 0;
478 
+      bottom: 0;
479 
+      text-align: left;
480 
+      background-color: rgba($color-bg-tertiary,0.8);
481 
+      padding: font-size(22px) font-size(27px) font-size(90px);
482 
+      color: $color-text-invert;
483 
+      @include transition(all 0.5s ease);
484 
+
485 
+      .close-link {
486 
+        float: right;
487 
+        font-size: font-size(32px);
488 
+        line-height: 1;
489 
+        margin: -10px -10px 5px 10px;
490 
+      }
491 
+
492 
+      ul {
493 
+        position: absolute;
494 
+        bottom: 3.5rem;
495 
+        left: font-size(27px);
496 
+        right: font-size(27px);
497 
+        font-size: font-size(14px);
498 
+        margin: 0;
499 
+
500 
+        li {
501 
+          position: relative;
502 
+          color: $color-text-invert;
503 
+
504 
+          svg {
505 
+            font-size: 1.5em;
506 
+          }
507 
+          &[data-icon] {
508 
+            padding-left: 17px;
509 
+
510 
+            &:before {
511 
+              line-height: #{font-size(14px) * 1.5};
512 
+              font-size: font-size(12px);
513 
+              position: absolute;
514 
+              left: 0;
515 
+              top: 0;
516 
+            }
517 
+          }
518 
+        }
519 
+      }
520 
+    }
521 
+
522 
+    .insta-link {
523 
+      @include button($color: $color-text-invert, $border-color: $color-stroke-grey, $background-color: rgba(#000,0.2));
524 
+      position: absolute;
525 
+      left: 50%;
526 
+      bottom: 1rem;
527 
+      z-index: 1;
528 
+      @include transform(translateX(-50%));
529 
+    }
530 
+
531 
+    &:hover {
532 
+      .image_container {
533 
+        &:before,
534 
+        &:after {
535 
+          opacity: 1;
536 
+          visibility: visible;
537 
+        }
538 
+
539 
+        img {
540 
+          @include transform(scale(1.15,1.15) translateZ(0));
541 
+        }
542 
+
543 
+        &:after {
544 
+          -webkit-transform: scale3d(1,1,1);
545 
+          -moz-transform: scale3d(1,1,1);
546 
+          -ms-transform: scale3d(1,1,1);
547 
+          -o-transform: scale3d(1,1,1);
548 
+          transform: scale3d(1,1,1);
549 
+        }
550 
+      }
551 
+    }
552 
+
553 
+    &.show {
554 
+      .meta {
555 
+        opacity: 1;
556 
+        visibility: visible;
557 
+      }
558 
+      .show-link {
559 
+        opacity: 0;
560 
+        visibility: hidden;
561 
+      }
562 
+    }
563 
+  }
564 
+
565 
+  @media screen and (max-width: 900px) {
566 
+    .item {
567 
+      flex-basis: 50%;
568 
+    }
569 
+  }
570 
+
571 
+  @media screen and (max-width: 599px) {
572 
+    .items {
573 
+      margin-left: 0;
574 
+    }
575 
+    .item {
576 
+      flex-basis: 100%;
577 
+      margin-left: 0;
578 
+    }
579 
+  }
580 
+}
581 
+
582 
+.contao-cookiebar.contao-cookiebar {
583 
+  .cc-btn{
584 
+    &, &.success {
585 
+      background: $color-bg-secondary;
586 
+      border-color: $color-bg-secondary;
587 
+      color: $color-text-invert;
588 
+      @include border-radius(0);
589 
+    }
590 
+  }
591 
+
592 
+  p {
593 
+    color: $color-text-invert;
594 
+  }
595 
+
596 
+  .cc-inner {
597 
+    color: $color-text-invert;
598 
+    font-size: font-size(16px);
599 
+    @include border-radius(0);
600 
+    background: rgba(#202533,0.95);
601 
+  }
602 
+
603 
+  .cc-cookies {
604 
+    background: rgba(#202533,1);
605 
+
606 
+    .cc-cookie .cc-cookie-info {
607 
+      background: #12171d;
608 
+      color: #fff;
609 
+      border-color: #363d4f;
610 
+    }
611 
+
612 
+    .cc-cookie .cc-cookie-desc {
613 
+      h1,h2,h3,h4,h5,h6 {
614 
+        font-size: 1.15em;
615 
+        color: $color-text-invert;
616 
+      }
617 
+      p {
618 
+        margin-bottom: 0.75em;
619 
+        &:last-child {
620 
+          margin-bottom: 0;
621 
+        }
622 
+      }
623 
+      a {
624 
+        color: #ff4268;
625 
+
626 
+        &:hover {
627 
+          color: mix(#ff4268,#000,80%);
628 
+        }
629 
+      }
630 
+    }
631 
+  }
632 
+}
633 
+
634 
+
635 
+/* ------ Fusion Popup ------ */
636 
+@mixin fp_center_wrapper {
637 
+  text-align: center;
638 
+  display: flex;
639 
+  align-items: center;
640 
+  > * {
641 
+    flex: 1 0 auto;
642 
+    max-width: 100%;
643 
+  }
644 
+}
645 
+.fusion_popup {
646 
+  background: #fff;
647 
+  /*position: fixed;
648 
+  left: 50%;
649 
+  top: 50%;
650 
+  @include transform(translate(-50%,-50%));
651 
+  max-width: 650px;
652 
+  width: 100%;*/
653 
+  .fp-title {
654 
+    background: url("../images/fusion_popup/hero_popup.jpg") center bottom no-repeat;
655 
+    -webkit-background-size: cover;
656 
+    background-size: cover;
657 
+    @include aspect-ratio(5,2,true);
658 
+    @include fp_center_wrapper;
659 
+    padding: 7.5% 0 11.55%;
660 
+  }
661 
+
662 
+  .fp-body {
663 
+    @include fp_center_wrapper;
664 
+    padding: 1em 0 0;
665 
+  }
666 
+
667 
+  .fp-action {
668 
+    background: url("../images/fusion_popup/footer_black@2x.jpg") center top no-repeat;
669 
+    -webkit-background-size: cover;
670 
+    background-size: cover;
671 
+    @include fp_center_wrapper;
672 
+    padding: 11.55% 0 7.5%;
673 
+
674 
+    a {
675 
+      font-size: font-size(55px);
676 
+      color: #fff;
677 
+
678 
+      @include for-max-size(650px) {
679 
+        font-size: 8.9vw;
680 
+      }
681 
+    }
682 
+  }
683 
+
684 
+  &,
685 
+  p,
686 
+  h3,
687 
+  .image_container {
688 
+    @include headline();
689 
+    margin: 0 0 0.5em;
690 
+    line-height: 1.15;
691 
+    font-size: font-size(45px);
692 
+
693 
+    &:last-child {
694 
+      margin-bottom: 0;
695 
+    }
696 
+
697 
+    @include for-max-size(650px) {
698 
+      font-size: 7.3vw;
699 
+    }
700 
+  }
701 
+
702 
+  .image_container {
703 
+    margin: 0 25px;
704 
+    img {
705 
+      vertical-align: middle;
706 
+      width: 350px;
707 
+      max-width: 100%;
708 
+    }
709 
+  }
710 
+}
711 
+
712 
+.ce_accordion {
713 
+  + .ce_accordion {
714 
+    margin-top: 5px;
715 
+  }
716 
+  .toggler {
717 
+    cursor: pointer;
718 
+    display: block;
719 
+    background-color: $color-bg-tertiary;
720 
+    color: $color-text-invert;
721 
+    font-size: font-size(25px);
722 
+    padding: 10px 50px 10px 15px;
723 
+    line-height: 30px;
724 
+    position: relative;
725 
+    outline: none;
726 
+    overflow: hidden;
727 
+    @include transition(all 0.25s ease);
728 
+
729 
+    .arrow {
730 
+      position: absolute;
731 
+      top:0;
732 
+      bottom: 0;
733 
+      right: 0;
734 
+      width: 50px;
735 
+      fill: $color-bg-secondary;
736 
+      @include transition(all 0.25s ease);
737 
+    }
738 
+
739 
+    /*&:before {
740 
+      position: absolute;
741 
+      top:0;
742 
+      bottom: 0;
743 
+      right: 0;
744 
+      width: 50px;
745 
+      content: '';
746 
+      background: url('data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%22%20height%3D%22100%22%20fill%3D%22%23000000%22%20viewBox%3D%220%200%20100%20100%22%20preserveAspectRatio%3D%22none%22%20%3E%3Cpath%20d%3D%22M10%2C0%20L100%2C0%20L100%2C100%20L10%2C100%20L0%2C50z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E') no-repeat 100% 50%;
747 
+      -webkit-background-size: 100% 100%;
748 
+      background-size: 100% 100%;
749 
+      //@include transform(translate(50%,-50%));
750 
+      @include transition(transform 0.25s ease);
751 
+    }*/
752 
+
753 
+    &:before,
754 
+    &:after {
755 
+      z-index: 1;
756 
+      position: absolute;
757 
+      top: 50%;
758 
+      font-size: 35px;
759 
+      @include transform(translate(50%,-50%));
760 
+      @include transition(all 0.25s ease);
761 
+    }
762 
+
763 
+    &:before {
764 
+      right: 20px;
765 
+      content: '+';
766 
+      opacity: 1;
767 
+      visibility: visible;
768 
+    }
769 
+    &:after {
770 
+      top: 22px;
771 
+      right: 25px;
772 
+      content: '–';
773 
+      opacity: 0;
774 
+      visibility: hidden;
775 
+    }
776 
+
777 
+    &.ui-state-active {
778 
+      background-color: $color-bg-secondary;
779 
+      color: $color-text-invert;
780 
+      &:before {
781 
+        opacity: 0;
782 
+        visibility: hidden;
783 
+      }
784 
+      &:after {
785 
+        opacity: 1;
786 
+        visibility: visible;
787 
+      }
788 
+      .arrow {
789 
+        @include transform(rotate(-90deg));
790 
+        fill: $color-bg-tertiary;
791 
+        max-height:50px;
792 
+      }
793 
+    }
794 
+  }
795 
+
796 
+  .accordion {
797 
+    padding: 1.5rem 1rem;
798 
+    background: $color-bg-primary;
799 
+  }
800 
+}
801 
+
802 
+#eye-catcher {
803 
+  @include centered();
804 
+  z-index: 1;
805 
+
806 
+  figure {
807 
+    position: absolute;
808 
+    right: 0;
809 
+    bottom: 100%;
810 
+    margin-bottom: 5vw;
811 
+    @include for-max-size(1230px) {
812 
+      right: 15px;
813 
+    }
814 
+
815 
+    a {
816 
+      &:before {
817 
+        display: none;
818 
+      }
819 
+    }
820 
+
821 
+    img {
822 
+      max-width: 33vw;
823 
+      width: 300px;
824 
+    }
825 
+  }
826 
+}
0 827 
\ No newline at end of file