From 6450b892691f66f88d769c6fecb8206c0f2ada98 Mon Sep 17 00:00:00 2001
From: Adam Bardsley <adam.bardsley@gmail.com>
Date: Mon, 25 Nov 2024 15:36:35 +0000
Subject: [PATCH] Deployed to live

---
 docs/client/winchester/parallax.css | 251 +++++-----------------------
 1 file changed, 45 insertions(+), 206 deletions(-)

diff --git a/docs/client/winchester/parallax.css b/docs/client/winchester/parallax.css
index ebe42be..04a317d 100644
--- a/docs/client/winchester/parallax.css
+++ b/docs/client/winchester/parallax.css
@@ -163,174 +163,10 @@ section#introduction {
   }
 }
 
-#goals {
-  color: #fff;
-  padding-top: 300px;
-  /* width: 100%; */
-  /* mix-blend-mode:screen; */
-  border: solid 1px transparent; /* Triggers block */
-  /* border-color: hotpink; */
-  display: block;
-  overflow: hidden;
-  position: relative;
-}
-#goals h2 {
-  font-size: 3em;
-  text-transform: uppercase;
-  text-align: center;
-  margin-bottom: 1rem;
-}
-
-#goals .picture {
-  width: 100%;
-  border: 1px solid transparent;  
-  /* background-color: hotpink; */
-  display: block;
-  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570367/original/sports.png');
-  background-repeat: no-repeat;
-  background-position-x: right;
-  background-position-y: top;
-  background-size: 220%;
-  height: 700px;
-  position: absolute;
-  top: 0px;
-  left: 0;
-  /* mix-blend-mode: screen; */
-  /* overflow: hidden; */
-  /* overflow: visible; */
-  max-width: var(--max-column-width);
-  margin: 0 auto;
-}
-@media screen and (min-width: 1024px) {
-  #goals {
-    padding-top: 100px;
-    height: 100vh;
-  }
-  #goals h2 {
-    transform: translate(200px,0);
-  }
-  #goals .picture {
-    left: calc(50% - 770px);
-    height: 500px;
-    background-size: 90%;
-  }
-
-  
-}
 
-#goals .ripple {
-  margin-top: 200px;
-  background-color: var(--organisation);
-  background-size: cover;
-  clip-path: path('m5011.83,62.75c-43.56-14.48-51.33-36.84-100-49.33-15.12-3.88-55.5-12.28-101.33,0-49.96,13.39-49.96,36.23-100,49.33-9.77,2.56-51,12.49-98.67,0-50.03-13.1-50.01-35.93-100-49.33-10.15-2.72-52.7-13.19-101.33,0-49.44,13.41-49.23,36.08-98.67,49.33-46.99,12.59-88.17,3.09-100,0-50.67-13.23-50.8-36.15-101.33-49.33-10.92-2.85-52.39-12.6-100,0-49.92,13.22-49.94,36.07-100,49.33-48.41,12.83-90.4,2.54-100,0-49.95-13.23-49.94-36.07-100-49.33-9.82-2.6-51.75-12.83-100,0-49.96,13.28-50.04,36.21-100,49.33-46.95,12.33-87.78,2.82-98.67,0-48.98-12.69-56.07-36.08-101.33-49.33-16.3-4.77-35.62-7.66-58.29-6.41-15.62-.19-33.54,1.36-52.38,6.41-49.96,13.39-49.96,36.23-100,49.33-9.77,2.56-51,12.49-98.67,0-50.03-13.1-50.01-35.93-100-49.33-10.15-2.72-52.7-13.19-101.33,0-49.44,13.41-49.22,36.08-98.67,49.33-46.99,12.59-88.17,3.09-100,0-50.67-13.23-50.8-36.15-101.33-49.33-10.92-2.85-52.39-12.6-100,0-49.92,13.22-49.94,36.07-100,49.33-48.41,12.83-90.4,2.54-100,0-49.95-13.23-49.94-36.07-100-49.33-9.82-2.6-51.75-12.83-100,0-42.77,11.37-48.99,29.81-81.24,43.12-53.79,13.96-91.98,7.86-117.1-.49-43.56-14.48-51.33-36.84-100-49.33-15.12-3.88-55.5-12.28-101.33,0-49.96,13.39-49.96,36.23-100,49.33-9.77,2.56-51,12.49-98.67,0-50.03-13.1-50.01-35.93-100-49.33-10.15-2.72-52.7-13.19-101.33,0-49.44,13.41-49.22,36.08-98.67,49.33-46.99,12.59-88.17,3.09-100,0-50.67-13.23-50.8-36.15-101.33-49.33-10.92-2.85-52.39-12.6-100,0-49.92,13.22-49.94,36.07-100,49.33-48.41,12.83-90.4,2.54-100,0-49.95-13.23-49.94-36.07-100-49.33-9.82-2.6-51.75-12.83-100,0-49.96,13.28-50.04,36.21-100,49.33-46.95,12.33-87.78,2.82-98.67,0-48.98-12.69-56.07-36.08-101.33-49.33C74.73-.74,41.94-3.61.5,6.71v3865.33h5130.33V192.38c0,.11,0-6.16,0-25.26V62.75c-54.8,14.6-93.59,8.44-119,0Z');
-  padding: 100px 3rem 3rem;
-  height: calc(100% + 100px );
-}
-
-#goals .description {
-  position: relative;
-  overflow: visible;
-  height: 12rem;
-  width: 100%;
-}
-#goals .description .value {
-  position: absolute;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  /* left: 10%; */
-  font-size: 3.5rem;
-  width: 100%;
-  padding: 1em;
-  margin-top: 1em;
-  /* opacity:0; */
-  transform: translateX(100%) scale(0,0);
-  /* scale: 0%; */
-  /* min-height: 5rem; */
-}
-#goals #community { transform: translateX(0%), scale(1,1) }
-#goals #community { background-color: var(--purple); }
-#goals #familiarity { background-color: var(--red);}
-#goals #advocacy { background-color: var(--orange); color: #000;}
-#goals #support { background-color: var(--yellow); color: #000;}
+/*  Goals & Measures */
 
-.rotator { 
-  display:flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 1rem;
-  max-width: var(--max-column-width);
-  /* overflow: hidden; */
-  margin: 0 auto;
-}
-#goals .ripple h2 {
-  font-size: 5rem;
-}
-.rotator #goal-wheel-wrap {
-  width: 80%;
-  padding-top: 80px;
-  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570372/original/arrow2.png');
-  background-repeat: no-repeat;
-  background-position-x: 45%;
-  background-position-y: 0px;
-  background-size: 200px;
-  position: relative;
-}
-.rotator #goal-wheel-wrap img {
-  max-height: 100%;
-  display: block;
-}
-
-.rotator #goal-wheel-wrap .logo {
-  width: 100%; height: calc(100% - 80px);
-  position: absolute;
-  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570369/original/swirl.png');
-  background-position: center center;
-  background-repeat: no-repeat;
-  background-size: 15% 15%;
-  z-index: 10;
-}
-@media screen and (min-width: 1024px) {
-
-  #goals .ripple {
-    max-height: 100%;;
-  }
-  
-  .rotator {
-    flex-direction: row;
-    align-items: center;
-  }
-  #goals .description {
-    width: 100%;
-  }
-  .rotator #goal-wheel-wrap {
-    /* max-width: 50%; */
-    width: 65%;
-    /* max-height: 100%; */
-  }
-  .rotator #goal-wheel-wrap img {
-    aspect-ratio: 1/1 ;
-  }
-  #goals .description .value {
-    font-size: 3rem;
-    margin-top:0;
-  }
-  .ripple {
-    border: solid 1px green;
-  }
-  .rotator { 
-  }
-  .rotator #goal-wheel-wrap {
-    margin: -7rem auto 0;
-  }
-}
-
-
-/*  Measures */
-
-#measures {
+#goals, #measures {
   color: #fff;
   padding-top: 300px;
   /* width: 100%; */
@@ -341,19 +177,19 @@ section#introduction {
   overflow: hidden;
   position: relative;
 }
+#goals h2, 
 #measures h2 {
   font-size: 3em;
   text-transform: uppercase;
   text-align: center;
   margin-bottom: 1rem;
 }
-
+#goals .picture,
 #measures .picture {
   width: 100%;
   border: 1px solid transparent;  
   /* background-color: hotpink; */
   display: block;
-  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570366/original/students.png');
   background-repeat: no-repeat;
   background-position-x: left;
   background-position-y: top;
@@ -368,24 +204,25 @@ section#introduction {
   max-width: var(--max-column-width);
   margin: 0 auto;
 }
+#measures .picture {   background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570366/original/students.png');}
+#goals .picture {   background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570367/original/sports.png');}
+
 @media screen and (min-width: 1024px) {
-  #measures {
+  #goals,#measures {
     padding-top: 100px;
     height: 100vh;
   }
-  #measures h2 {
-    transform: translate(-200px,0);
-  }
+  #measures h2 { transform: translate(-200px,0); }
+  #goals h2 { transform: translate(200px,0); }
+
+  #goals .picture, 
   #measures .picture {
     left: calc(50% - 770px);
     height: 500px;
-    background-size: 100%;
-    border: dashed 1px greenyellow;
+    background-size: 100%; /* 90% for goals? */
   }
-
-  
 }
-
+#goals .ripple,
 #measures .ripple {
   margin-top: 200px;
   background-color: var(--organisation);
@@ -394,13 +231,14 @@ section#introduction {
   padding: 100px 3rem 3rem;
   height: calc(100% + 100px );
 }
-
+#goals .description,
 #measures .description {
   position: relative;
   overflow: visible;
   height: 12rem;
   width: 100%;
 }
+#goals .description .value,
 #measures .description .value {
   position: absolute;
   display: flex;
@@ -411,7 +249,7 @@ section#introduction {
   font-size: 3.5rem;
   /* width: calc(80% - 2em); */
   padding: 1em;
-  margin-top: 1em;
+  /* margin-top: 1em; */
   /* opacity:0; */
   transform: translateX(100%) scale(0,0);
   /* scale: 0%; */
@@ -423,9 +261,15 @@ section#introduction {
 #measures #impact { background-color: var(--orange); color: #000;}
 #measures #engagement { background-color: var(--yellow); color: #000;}
 
+#goals #community { transform: translateX(0%), scale(1,1) }
+#goals #community { background-color: var(--purple); }
+#goals #familiarity { background-color: var(--red);}
+#goals #advocacy { background-color: var(--orange); color: #000;}
+#goals #support { background-color: var(--yellow); color: #000;}
+
+#goals .rotator,
 #measures .rotator { 
   display:flex;
-  flex-direction: column-reverse;
   align-items: center;
   justify-content: center;
   gap: 1rem;
@@ -433,10 +277,16 @@ section#introduction {
   /* overflow: hidden; */
   margin: 0 auto;
 }
+
+#goals .rotator {flex-direction: column;}
+#measures .rotator {flex-direction: column-reverse;}
+
+#goals .ripple h2,
 #measures .ripple h2 {
   font-size: 5rem;
 }
-.rotator #goal-wheel-wrap {
+.rotator #goal-wheel-wrap,
+.rotator #goal-wheel-wrap-2 {
   width: 80%;
   padding-top: 80px;
   background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570372/original/arrow2.png');
@@ -446,12 +296,13 @@ section#introduction {
   background-size: 200px;
   position: relative;
 }
-.rotator #goal-wheel-wrap img {
+.rotator #goal-wheel-wrap img,
+.rotator #goal-wheel-wrap-2 img {
   max-height: 100%;
   display: block;
 }
-
-.rotator #goal-wheel-wrap .logo {
+.rotator #goal-wheel-wrap .logo,
+.rotator #goal-wheel-wrap-2 .logo {
   width: 100%; height: calc(100% - 80px);
   position: absolute;
   background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570369/original/swirl.png');
@@ -461,55 +312,43 @@ section#introduction {
   z-index: 10;
 }
 @media screen and (min-width: 1024px) {
-
+  #goals .ripple,
   #measures .ripple {
     max-height: 100%;;
   }
   
+  #goals .rotator,
   #measures .rotator {
     flex-direction: row;
     align-items: center;
   }
+  #goals .description,
   #measures .description {
     width: 100%;
   }
-  .rotator #goal-wheel-wrap {
+  .rotator #goal-wheel-wrap,
+  .rotator #goal-wheel-wrap-2 {
     /* max-width: 50%; */
     width: 65%;
     /* max-height: 100%; */
+  
   }
-  .rotator #goal-wheel-wrap img {
+  .rotator #goal-wheel-wrap img,
+  .rotator #goal-wheel-wrap-2 img {
     aspect-ratio: 1/1 ;
   }
   #measures .description .value {
     font-size: 3rem;
     margin-top:0;
   }
-  .ripple {
-    border: solid 1px green;
-  }
-  .rotator { 
-  }
-  .rotator #goal-wheel-wrap {
+  .rotator #goal-wheel-wrap,
+  .rotator #goal-wheel-wrap-2 {
     margin: -7rem auto 0;
   }
 }
 
 
 
-
-
-
-
-
-
-#measures {
-  /* width: 100%; */
-  /* background-color: var(--logo-light); */
-  /* mix-blend-mode:screen; */
-  
-
-}
 #priorities, #priorities * {
   box-sizing: content-box;
 }