/* ============
   SPLIT PANELS
   ============  */

.m__split-panels {
  overflow: hidden;
  text-align: left;
  background: linear-gradient(to right, var(--color__navy__3) 50%, var(--color__gray__05) 50%); }

.split-panels { 
   display: flex; }

.split-panels .split-panels__column {
   padding: var(--spacing__md) var(--spacing__lg);
   width: 50%; }
   
.split-panels__column__1 {
   color: var(--color__white); }
      
.split-panels__column__2 {
   color: var(--color__navy__3); }

      
@media (max-width:800px) {

   .m__split-panels { 
      background: none;
      text-align: center; }
   
   .split-panels { 
      flex-wrap: wrap; }
   
   .split-panels .split-panels__column {
      padding: var(--spacing__md);
      width: 100%; }
      
   .split-panels__column__1 {
      background: var(--color__navy__3); }
      
   .split-panels__column__2 {
      background: var(--color__gray__05); }

}


@media (max-width:500px) {

  .split-panels .split-panels__column {
    padding: var(--spacing__md) var(--spacing__sm); }

}



/* Animation */
.js .split-panels .split-panels__column {
  opacity: 0;
 transition: transform .8s, opacity .6s; }

.mc__module .split-panels__column__1 {
  transform: translateX(-50%); }
      
.mc__module .split-panels__column__2 {
   transform: translateX(50%); }

.inview .mc__module .split-panels__column__1,
.inview .mc__module .split-panels__column__2 {
  opacity: 1;
  transform: translateX(0) !important; }