|
@@ -40,7 +40,9 @@ body {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
-/****** viewports - waypoints ******/
|
|
|
|
|
|
+/*########################################
|
|
|
|
+############## Waypoints #################
|
|
|
|
+#########################################*/
|
|
.viewport {
|
|
.viewport {
|
|
position: fixed;
|
|
position: fixed;
|
|
height: 100%;
|
|
height: 100%;
|
|
@@ -70,7 +72,7 @@ body {
|
|
|
|
|
|
.page-view {
|
|
.page-view {
|
|
padding: 7rem 0;
|
|
padding: 7rem 0;
|
|
- transition: opacity 0.4s ease;
|
|
|
|
|
|
+ transition: opacity 0.5s ease;
|
|
opacity: 0;
|
|
opacity: 0;
|
|
position: relative;
|
|
position: relative;
|
|
background: transparent !important;
|
|
background: transparent !important;
|
|
@@ -79,7 +81,7 @@ body {
|
|
}
|
|
}
|
|
|
|
|
|
.page-view>* {
|
|
.page-view>* {
|
|
- transition: all 0.4s ease;
|
|
|
|
|
|
+ transition: all 0.5s ease;
|
|
}
|
|
}
|
|
|
|
|
|
.page-view:after {
|
|
.page-view:after {
|
|
@@ -103,27 +105,6 @@ body {
|
|
z-index: 0;
|
|
z-index: 0;
|
|
}
|
|
}
|
|
|
|
|
|
-.page-view {
|
|
|
|
- padding: 7rem 0;
|
|
|
|
- transition: opacity 0.4s ease;
|
|
|
|
- opacity: 0;
|
|
|
|
- position: relative;
|
|
|
|
- background: transparent !important;
|
|
|
|
- scroll-snap-align: start;
|
|
|
|
- min-height: 100vh;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.page-view>* {
|
|
|
|
- transition: all 0.4s ease;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.page-view:after {
|
|
|
|
- content: '';
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.no-js .page-view {
|
|
|
|
- opacity: 1;
|
|
|
|
-}
|
|
|
|
|
|
|
|
/*########################################
|
|
/*########################################
|
|
################# TYPE ###################
|
|
################# TYPE ###################
|
|
@@ -708,9 +689,9 @@ h5.how {
|
|
#########################################*/
|
|
#########################################*/
|
|
|
|
|
|
#backgroundsvg {
|
|
#backgroundsvg {
|
|
- background-image: url('/img/web.svg');
|
|
|
|
|
|
+ background-image: url('/img/background.svg');
|
|
background-repeat: no-repeat;
|
|
background-repeat: no-repeat;
|
|
- background-position: 5% top;
|
|
|
|
|
|
+ background-position: 0% 0%;
|
|
background-size: cover;
|
|
background-size: cover;
|
|
position: fixed;
|
|
position: fixed;
|
|
top: 0;
|
|
top: 0;
|
|
@@ -720,9 +701,9 @@ h5.how {
|
|
opacity: .75;
|
|
opacity: .75;
|
|
}
|
|
}
|
|
#backgroundsvg2 {
|
|
#backgroundsvg2 {
|
|
- background-image: url('/img/hello.svg');
|
|
|
|
|
|
+ background-image: url('/img/background2.svg');
|
|
background-repeat: no-repeat;
|
|
background-repeat: no-repeat;
|
|
- background-position: 50% 50%;
|
|
|
|
|
|
+ background-position: 0% 0%;
|
|
background-size: cover;
|
|
background-size: cover;
|
|
position: fixed;
|
|
position: fixed;
|
|
top: 0;
|
|
top: 0;
|
|
@@ -732,9 +713,9 @@ h5.how {
|
|
opacity: .75;
|
|
opacity: .75;
|
|
}
|
|
}
|
|
#backgroundsvg3 {
|
|
#backgroundsvg3 {
|
|
- background-image: url('/img/footer.svg');
|
|
|
|
|
|
+ background-image: url('/img/background3.svg');
|
|
background-repeat: no-repeat;
|
|
background-repeat: no-repeat;
|
|
- background-position: 5% top;
|
|
|
|
|
|
+ background-position: 0% 0%;
|
|
background-size: cover;
|
|
background-size: cover;
|
|
position: fixed;
|
|
position: fixed;
|
|
top: 0;
|
|
top: 0;
|
|
@@ -745,7 +726,7 @@ h5.how {
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
-
|
|
|
|
|
|
+/***************************************************
|
|
.hello {
|
|
.hello {
|
|
background-image: url('/img/hello.svg') !important;
|
|
background-image: url('/img/hello.svg') !important;
|
|
background-size:cover !important;
|
|
background-size:cover !important;
|
|
@@ -758,17 +739,13 @@ h5.how {
|
|
}
|
|
}
|
|
#dw-footer {
|
|
#dw-footer {
|
|
background-image: url('/img/footer.svg');
|
|
background-image: url('/img/footer.svg');
|
|
- /**
|
|
|
|
- -webkit-mask-image: url(/img/web.svg);
|
|
|
|
- mask-image: url(/img/web.svg);
|
|
|
|
- **/
|
|
|
|
background-size:100% 100%;
|
|
background-size:100% 100%;
|
|
background-size:cover;
|
|
background-size:cover;
|
|
-
|
|
|
|
background-repeat: no-repeat;
|
|
background-repeat: no-repeat;
|
|
background-position: top left, 50%, 50%;
|
|
background-position: top left, 50%, 50%;
|
|
z-index:11;
|
|
z-index:11;
|
|
}
|
|
}
|
|
|
|
+***************************************************/
|
|
|
|
|
|
.lead {
|
|
.lead {
|
|
font-weight: 400;
|
|
font-weight: 400;
|