More color adjustment

Author: javuto

assets/css/main.css

@@ -24,6 +24,7 @@
   --theme-white: #ffffff;
   --theme-dark-navy-blue: #223f5a;
   --theme-five-more-pixs: #2f3963;
+  --theme-five-more-pixs-light: #bcd8eb;
   --theme-call-me-gwapo-light: #a0c3a0;
   --theme-call-me-gwapo: #a0c3a0;
   --theme-call-me-gwapo-dark: #317d32;
@@ -128,6 +129,14 @@ h1 {
   text-transform: none;
   color: #232020;
 }
+.fivemorepixs {
+  color: #ffffff;
+}
+
+.fivemorepixs {
+  color: #ffffff;
+}
+
 p {
   font-size: var(--font-size-p);
   font-family: "Kumbh Sans", sans-serif;
@@ -519,6 +528,9 @@ footer .bottom .bottom-inner p span {
 .theme-navy a {
   color: var(--theme-white);
 }
+.theme-five-more-pixs {
+  background-color: var(--theme-five-more-pixs);
+}
 .container,
 footer .top .top-inner,
 footer .bottom .bottom-inner,
@@ -640,6 +652,8 @@ footer .bottom .bottom-inner,
 #homepage-layout #five-more-pixs-wrap {
   position: relative;
   padding-top: 80px;
+  color: var(--theme-white);
+  background-color: var(--theme-five-more-pixs);
 }
 #homepage-layout #call-me-gwapo-wrap {
   position: relative;
@@ -810,7 +824,7 @@ html {
   border-radius: 100%;
 }
 .slider-with-text-wrap .arrow:hover {
-  background-color:var(--theme-call-me-gwapo-dark);
+  background-color: var(--theme-call-me-gwapo-dark);
 }
 .slider-with-text-wrap .arrow--left {
   left: 5px;
@@ -1123,6 +1137,7 @@ html {
 .reviews-heading {
   text-align: center;
   margin-bottom: 2rem;
+  color: var(--theme-white);
 }
 
 .reviews-container {
@@ -1137,7 +1152,7 @@ html {
 .review-item {
   display: flex;
   flex-direction: column;
-  background-color: rgba(255, 255, 255, 0.7);
+  background-color: var(--theme-five-more-pixs-light);
   border-radius: 8px;
   padding: 1.5rem;
   box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
@@ -1195,7 +1210,12 @@ html {
 
 .review-divider {
   height: 1px;
-  background: linear-gradient(to right, transparent, rgba(0, 0, 0, 0.2), transparent);
+  background: linear-gradient(
+    to right,
+    transparent,
+    rgba(0, 0, 0, 0.2),
+    transparent
+  );
   margin: 0.5rem 0;
 }
 

index.html

@@ -109,11 +109,11 @@ <h1><b>MURIEL TRONC</b></h1>
         <main role="main">
 	        <div id="homepage-layout">
 
-            <div class='controlHandler' id='controlHandle1'>
-              <div class='control' id='control1'>
-                <div class="keen-slider-wrap slider-with-text-wrap">
+            <div class="controlHandler theme-call-me-gwapo-light" id="controlHandle1">
+              <div class="control" id="control1">
+                <div class="keen-slider-wrap slider-with-text-wrap theme-call-me-gwapo-light">
                   <div class="navigation-wrapper">
-                    <div style="width:100%;" class="keen-slider" id="keen-slider-news">
+                    <div style="width:100%;" class="keen-slider theme-call-me-gwapo-light" id="keen-slider-news">
                       <div style="width:100%;" class="keen-slider__slide theme-call-me-gwapo-light" >
                         <div class="slide-inner theme-call-me-gwapo-light">
                           <div class="text-wrap">
@@ -138,14 +138,14 @@ <h1 style="margin-top:0;">Sextortion Awareness Session</h1>
                       </div>
                     </div>
                     <svg id="arrow-left"
-                      class="arrow arrow--left"
+                      class="arrow arrow--left theme-call-me-gwapo-light"
                       xmlns="http://www.w3.org/2000/svg"
                       viewBox="0 0 24 24">
                       <path d="M16.67 0l2.83 2.829-9.339 9.175 9.339 9.167-2.83 2.829-12.17-11.996z"></path>
                     </svg>
                     <svg
                       id="arrow-right"
-                      class="arrow arrow--right"
+                      class="arrow arrow--right theme-call-me-gwapo-light"
                       xmlns="http://www.w3.org/2000/svg"
                       viewBox="0 0 24 24">
                       <path d="M5 3l3.057-3 11.943 12-11.943 12-3.057-3 9-9z"></path>
@@ -156,11 +156,11 @@ <h1 style="margin-top:0;">Sextortion Awareness Session</h1>
               </div>
             </div> <!-- end container announcements -->
 
-		        <div id="five-more-pixs-wrap" class="container">
+		        <div id="five-more-pixs-wrap" class="container theme-five-more-pixs">
               <div class='controlHandler' id='controlHandle3'>
                 <div class='control' id='control3'>
                   <div id="fivemorepixs" class="cmscontent">
-                    <h1><b>Five More Pixs</b></h1>
+                    <h1 class="fivemorepixs"><b>Five More Pixs</b></h1>
                   </div>
                 </div>
               </div>
@@ -173,22 +173,22 @@ <h1><b>Five More Pixs</b></h1>
                       </div>
                       <div class="col-md-8" style="display:flex; flex-direction:column;">
                         <div>
-<p>Meet Jane, Caitlin, Sofia and their online friends. Jane is devastated when her best friend Kate is admitted to the hospital after a suicide attempt. But while she struggles with her friend&rsquo;s coma, she also meets Kate&rsquo;s cousin online and falls head over heels for the mysterious young man.</p>
+<p class="fivemorepixs">Meet Jane, Caitlin, Sofia and their online friends. Jane is devastated when her best friend Kate is admitted to the hospital after a suicide attempt. But while she struggles with her friend&rsquo;s coma, she also meets Kate&rsquo;s cousin online and falls head over heels for the mysterious young man.</p>
 
-<p>Caitlin desperately embraces anorexia after her father&rsquo;s deadly car accident. Online, she meets Sara, an admin of an app centered around eating disorders, and the first person to finally understand what she&rsquo;s going through.</p>
+<p class="fivemorepixs">Caitlin desperately embraces anorexia after her father&rsquo;s deadly car accident. Online, she meets Sara, an admin of an app centered around eating disorders, and the first person to finally understand what she&rsquo;s going through.</p>
 
-<p>Sofia has decided to learn French to impress her big sister who&rsquo;s moved to France. She joins an app to find pen pals and meets the ideal gay best friend any girl would dream to have.</p>
+<p class="fivemorepixs">Sofia has decided to learn French to impress her big sister who&rsquo;s moved to France. She joins an app to find pen pals and meets the ideal gay best friend any girl would dream to have.</p>
 
-<p>With social media accounts at the heart of the lives of the three Californian teenagers, they seek human connections at a time when the rest of the world doesn&rsquo;t seem to understand them. They&rsquo;ll find support, friendship and love in messages received on their phones. They&rsquo;ll share their most hidden secrets with their new best friend. They&rsquo;ll send their intimate pictures to their first love.</p>
+<p class="fivemorepixs">With social media accounts at the heart of the lives of the three Californian teenagers, they seek human connections at a time when the rest of the world doesn&rsquo;t seem to understand them. They&rsquo;ll find support, friendship and love in messages received on their phones. They&rsquo;ll share their most hidden secrets with their new best friend. They&rsquo;ll send their intimate pictures to their first love.</p>
 
-<p>They will find out you really never know someone you&rsquo;ve never met IRL.</p>
+<p class="fivemorepixs">They will find out you really never know someone you&rsquo;ve never met IRL.</p>
                         </div>
                       </div>
                     </div> <!-- end row -->
                     <div class="row">
-                      <div class="theme-light-greenish-gray">
+                      <div class="theme-five-more-pixs-light">
                         <div id="book-cms-wrap">
-                          <div class="theme-light-greenish-gray-inner">
+                          <div class="theme-five-more-pixs-light">
                             <div class='controlHandler' id='controlHandle8'>
                               <div class='control' id='control8'>
                                 <div class="cmscontent">