plataforma-fundacao-componentes 2.22.27 → 2.23.1

package/dist/index.css

@@ -135,10 +135,75 @@ h5 {
   .scroll-white::-webkit-scrollbar-thumb:hover {
     background-color: #bfc7bf; }
 
-.component-collapse {
-  width: 100%;
-  overflow: hidden;
-  transition: height 0.3s ease, opacity 0.3s ease; }
+.percent-loader-icon {
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  font-size: 1.5rem;
+  flex-shrink: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  fill: none;
+  stroke-width: 6;
+  transform: rotateZ(-90deg); }
+  .percent-loader-icon circle:first-of-type {
+    stroke: #cdd3cd; }
+  .percent-loader-icon circle:last-of-type {
+    stroke: currentColor;
+    stroke-linecap: round;
+    stroke-dasharray: 264;
+    transition: stroke-dashoffset 0.3s ease, stroke-dasharray 0.3s ease; }
+  .percent-loader-icon path {
+    stroke: currentColor;
+    stroke-linecap: round;
+    stroke-linejoin: round;
+    transform: translate(390px, -676px) rotateZ(90deg);
+    transition: stroke-dashoffset 0.3s ease, stroke-dasharray 0.3s ease; }
+
+.percent-loader-icon.indefinido {
+  -webkit-animation: spinNoventa 0.6s linear infinite;
+          animation: spinNoventa 0.6s linear infinite; }
+
+@-webkit-keyframes spinNoventa {
+  0% {
+    transform: rotateZ(-90deg); }
+  100% {
+    transform: rotateZ(270deg); } }
+
+@keyframes spinNoventa {
+  0% {
+    transform: rotateZ(-90deg); }
+  100% {
+    transform: rotateZ(270deg); } }
+
+.refresh-icon {
+  fill: currentColor;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  font-size: 1.5rem;
+  flex-shrink: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+  .refresh-icon.animate {
+    -webkit-animation: spin 0.4s linear infinite;
+            animation: spin 0.4s linear infinite; }
+
+@-webkit-keyframes spin {
+  0% {
+    transform: rotateZ(0); }
+  100% {
+    transform: rotateZ(180deg); } }
+
+@keyframes spin {
+  0% {
+    transform: rotateZ(0); }
+  100% {
+    transform: rotateZ(180deg); } }
 
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -265,49 +330,13 @@ h5 {
   .scroll-white::-webkit-scrollbar-thumb:hover {
     background-color: #bfc7bf; }
 
-.component-accordion {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  background-color: #fefefe;
-  border-radius: 4px; }
-  .component-accordion .component-accordion-first-content {
-    display: flex;
-    height: 73px;
-    padding: 24px 20px;
-    width: 100%;
-    align-items: center;
-    justify-content: space-between;
-    transition: border-bottom 0.3s ease;
-    border-bottom: 1px solid rgba(0, 0, 0, 0); }
-    .component-accordion .component-accordion-first-content .component-accordion-label-icon {
-      display: flex;
-      align-items: center; }
-      .component-accordion .component-accordion-first-content .component-accordion-label-icon .component-accordion-icon {
-        margin-right: 16px;
-        color: #323c32; }
-      .component-accordion .component-accordion-first-content .component-accordion-label-icon .component-accordion-label {
-        cursor: default;
-        -webkit-user-select: none;
-           -moz-user-select: none;
-            -ms-user-select: none;
-                user-select: none;
-        font-weight: 600;
-        font-size: 18px;
-        color: #323c32; }
-    .component-accordion .component-accordion-first-content .component-accordion-arrow {
-      color: #3fa110;
-      cursor: pointer;
-      transition: transform 0.3s ease;
-      display: flex;
-      align-items: center;
-      justify-content: center; }
-  .component-accordion.component-accordion-opened .component-accordion-first-content {
-    border-bottom: 1px solid #cdd3cd; }
-  .component-accordion.component-accordion-opened .component-accordion-arrow {
-    transform: rotateZ(180deg); }
-  .component-accordion.component-accordion-shadow {
-    box-shadow: 0 1px 2px 0 rgba(90, 100, 90, 0.3); }
+.sicredi-logo #Caminho_17 {
+  transform: translateX(286.845px) translateY(657.948px);
+  transform-origin: left center;
+  transition: transform 0.3s ease, opacity 0.3s ease; }
+  .sicredi-logo #Caminho_17.sicredi-logo-hide-letters {
+    transform: translateX(270px) translateY(657.948px);
+    opacity: 0; }
 
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -467,7 +496,7 @@ h5 {
   .loader-three-dots.loader-three-dots-secondary > div {
     background-color: #fefefe; }
   .loader-three-dots.loader-three-dots-dark > div {
-    background-color: #5a645a; }
+    background-color: #323c32; }
   .loader-three-dots div {
     width: var(--tdBallSize);
     height: var(--tdBallSize);
@@ -493,6 +522,70 @@ h5 {
     opacity: 0.4;
     transform: translate(0, var(--tdTransformYTo)); } }
 
+:export {
+  rootClassName: catavento-verde-icon-ui-component; }
+
+.catavento-verde-icon-ui-component {
+  width: 100px;
+  height: 100px; }
+  .catavento-verde-icon-ui-component #um {
+    -webkit-animation: piscar 700ms infinite;
+            animation: piscar 700ms infinite; }
+  .catavento-verde-icon-ui-component #dois {
+    -webkit-animation: piscar 700ms infinite;
+            animation: piscar 700ms infinite;
+    -webkit-animation-delay: 100ms;
+            animation-delay: 100ms; }
+  .catavento-verde-icon-ui-component #tres {
+    -webkit-animation: piscar 700ms infinite;
+            animation: piscar 700ms infinite;
+    -webkit-animation-delay: 200ms;
+            animation-delay: 200ms; }
+  .catavento-verde-icon-ui-component #quatro {
+    -webkit-animation: piscar 700ms infinite;
+            animation: piscar 700ms infinite;
+    -webkit-animation-delay: 300ms;
+            animation-delay: 300ms; }
+  .catavento-verde-icon-ui-component #cinco {
+    -webkit-animation: piscar 700ms infinite;
+            animation: piscar 700ms infinite;
+    -webkit-animation-delay: 400ms;
+            animation-delay: 400ms; }
+  .catavento-verde-icon-ui-component #seis {
+    -webkit-animation: piscar 700ms infinite;
+            animation: piscar 700ms infinite;
+    -webkit-animation-delay: 500ms;
+            animation-delay: 500ms; }
+  .catavento-verde-icon-ui-component #sete {
+    -webkit-animation: piscar 700ms infinite;
+            animation: piscar 700ms infinite;
+    -webkit-animation-delay: 600ms;
+            animation-delay: 600ms; }
+
+@-webkit-keyframes piscar {
+  0% {
+    opacity: 1; }
+  25% {
+    opacity: 0.8; }
+  50% {
+    opacity: 0.2; }
+  75% {
+    opacity: 0.8; }
+  100% {
+    opacity: 1; } }
+
+@keyframes piscar {
+  0% {
+    opacity: 1; }
+  25% {
+    opacity: 0.8; }
+  50% {
+    opacity: 0.2; }
+  75% {
+    opacity: 0.8; }
+  100% {
+    opacity: 1; } }
+
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
 :export {
@@ -618,16 +711,61 @@ h5 {
   .scroll-white::-webkit-scrollbar-thumb:hover {
     background-color: #bfc7bf; }
 
-.component-video-player {
-  display: flex;
-  width: 100%;
-  height: 100%;
-  min-height: 50px; }
-  .component-video-player.blackground {
-    background-color: #121212; }
-  .component-video-player iframe {
-    height: 100%;
-    width: 100%; }
+.loader-icon {
+  fill: currentColor;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  font-size: 1.5rem;
+  flex-shrink: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+  .loader-icon circle {
+    fill: #33820d;
+    -webkit-animation: loaderAnimation 1000ms linear infinite;
+            animation: loaderAnimation 1000ms linear infinite; }
+  .loader-icon #Elipse_0 {
+    -webkit-animation-delay: -875ms;
+            animation-delay: -875ms; }
+  .loader-icon #Elipse_1 {
+    -webkit-animation-delay: -750ms;
+            animation-delay: -750ms; }
+  .loader-icon #Elipse_2 {
+    -webkit-animation-delay: -625ms;
+            animation-delay: -625ms; }
+  .loader-icon #Elipse_3 {
+    -webkit-animation-delay: -500ms;
+            animation-delay: -500ms; }
+  .loader-icon #Elipse_4 {
+    -webkit-animation-delay: -375ms;
+            animation-delay: -375ms; }
+  .loader-icon #Elipse_5 {
+    -webkit-animation-delay: -250ms;
+            animation-delay: -250ms; }
+  .loader-icon #Elipse_6 {
+    -webkit-animation-delay: -125ms;
+            animation-delay: -125ms; }
+  .loader-icon #Elipse_7 {
+    -webkit-animation-delay: 0ms;
+            animation-delay: 0ms; }
+
+@-webkit-keyframes loaderAnimation {
+  0% {
+    opacity: 1; }
+  50% {
+    opacity: 0.05; }
+  100% {
+    opacity: 0.05; } }
+
+@keyframes loaderAnimation {
+  0% {
+    opacity: 1; }
+  50% {
+    opacity: 0.05; }
+  100% {
+    opacity: 0.05; } }
 
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -754,91 +892,10 @@ h5 {
   .scroll-white::-webkit-scrollbar-thumb:hover {
     background-color: #bfc7bf; }
 
-.component-aconteceu {
-  border-radius: 8px;
+.component-collapse {
   width: 100%;
-  height: 100%;
-  box-shadow: 0 1px 2px 0 rgba(90, 100, 90, 0.3);
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-  justify-content: stretch; }
-  .component-aconteceu .component-aconteceu-header {
-    -webkit-user-select: none;
-       -moz-user-select: none;
-        -ms-user-select: none;
-            user-select: none;
-    height: 48px;
-    border-radius: 8px 8px 0 0;
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    padding: 8px;
-    background-color: #f06666;
-    color: #fefefe; }
-    .component-aconteceu .component-aconteceu-header svg {
-      width: 20px;
-      height: 20px; }
-    .component-aconteceu .component-aconteceu-header label {
-      font-weight: 700;
-      font-size: 24px;
-      margin: 0 0 0 8px; }
-  .component-aconteceu .component-aconteceu-content {
-    border-radius: 0 0 8px 8px;
-    position: relative;
-    background-color: #fefefe;
-    padding: 4px 10px 30px;
-    height: calc(100% - 50px);
-    display: flex;
-    flex-direction: column;
-    align-items: stretch;
-    justify-content: space-between; }
-    .component-aconteceu .component-aconteceu-content .component-aconteceu-text {
-      display: block;
-      padding: 4px 4px 4px;
-      margin-bottom: 4px;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      font-weight: 600;
-      color: #323c32; }
-    .component-aconteceu .component-aconteceu-content .component-aconteceu-video {
-      height: calc(100% - 27px); }
-      .component-aconteceu .component-aconteceu-content .component-aconteceu-video.full-height {
-        height: 100%; }
-    .component-aconteceu .component-aconteceu-content iframe {
-      height: 100% !important; }
-    .component-aconteceu .component-aconteceu-content .component-aconteceu-see-more {
-      position: absolute;
-      bottom: 0;
-      right: 0;
-      font-size: 14px;
-      font-weight: 700;
-      outline: none;
-      border: none;
-      cursor: pointer;
-      background-color: #fefefe;
-      padding: 5px 10px 5px;
-      border-radius: 20px;
-      color: #323c32;
-      transition: transform 0.3s ease;
-      transform-origin: center;
-      -webkit-user-select: none;
-         -moz-user-select: none;
-          -ms-user-select: none;
-              user-select: none; }
-      .component-aconteceu .component-aconteceu-content .component-aconteceu-see-more:active {
-        transform: scale(0.95); }
-    .component-aconteceu .component-aconteceu-content .component-aconteceu-loader {
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      background-color: #fefefe;
-      display: flex;
-      align-items: center;
-      justify-content: center; }
+  overflow: hidden;
+  transition: height 0.3s ease, opacity 0.3s ease; }
 
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -965,18 +1022,534 @@ h5 {
   .scroll-white::-webkit-scrollbar-thumb:hover {
     background-color: #bfc7bf; }
 
-.action-card {
-  position: relative;
-  border-radius: 8px;
-  padding: 16px 24px;
-  width: 100%; }
-  .action-card .action {
-    margin-top: 12px; }
-  .action-card .bar {
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 8px;
+.component-accordion {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  background-color: #fefefe;
+  border-radius: 4px; }
+  .component-accordion .component-accordion-first-content {
+    display: flex;
+    height: 73px;
+    padding: 24px 20px;
+    width: 100%;
+    align-items: center;
+    justify-content: space-between;
+    transition: border-bottom 0.3s ease;
+    border-bottom: 1px solid rgba(0, 0, 0, 0); }
+    .component-accordion .component-accordion-first-content .component-accordion-label-icon {
+      display: flex;
+      align-items: center; }
+      .component-accordion .component-accordion-first-content .component-accordion-label-icon .component-accordion-icon {
+        margin-right: 16px;
+        color: #323c32; }
+      .component-accordion .component-accordion-first-content .component-accordion-label-icon .component-accordion-label {
+        cursor: default;
+        -webkit-user-select: none;
+           -moz-user-select: none;
+            -ms-user-select: none;
+                user-select: none;
+        font-weight: 600;
+        font-size: 18px;
+        color: #323c32; }
+    .component-accordion .component-accordion-first-content .component-accordion-arrow {
+      color: #3fa110;
+      cursor: pointer;
+      transition: transform 0.3s ease;
+      display: flex;
+      align-items: center;
+      justify-content: center; }
+  .component-accordion.component-accordion-opened .component-accordion-first-content {
+    border-bottom: 1px solid #cdd3cd; }
+  .component-accordion.component-accordion-opened .component-accordion-arrow {
+    transform: rotateZ(180deg); }
+  .component-accordion.component-accordion-shadow {
+    box-shadow: 0 1px 2px 0 rgba(90, 100, 90, 0.3); }
+
+@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
+:export {
+  white: #fefefe;
+  darkenWhite: #efefef;
+  black: #121212;
+  transparent: rgba(0, 0, 0, 0);
+  primary: #3fa110;
+  primaryDark: #33820d;
+  primaryLight: #d7e6c8;
+  secondaryDarker: #323c32;
+  secondaryDark: #5a645a;
+  secondary: #828a82;
+  secondaryLight: #cdd3cd;
+  secondaryLighter: #f8f9f7;
+  danger: #e60000;
+  dangerLight: #ffb4b4;
+  dangerDark: #ab4745;
+  warning: #ffcd00;
+  warningLight: #ffeb98;
+  warningDark: #765f00; }
+
+:root {
+  --rowPadding: 0;
+  --colPadding: 8px; }
+
+:export {
+  widthXs: 575.98px;
+  widthSm: 767.98px;
+  widthMd: 991.98px;
+  widthLg: 1199.98px; }
+
+body.sb-show-main.sb-main-padded {
+  padding: 15px; }
+
+*.nunito {
+  font-family: "Nunito", sans-serif; }
+
+*:not(.nunito) {
+  font-family: "Exo 2", sans-serif; }
+
+.document-grabbing {
+  cursor: -webkit-grabbing !important;
+  cursor: grabbing !important; }
+
+h1 {
+  font-size: 36px;
+  font-weight: 600;
+  margin: 0; }
+
+h2 {
+  font-size: 32px;
+  font-weight: 500;
+  margin: 0; }
+
+h3 {
+  font-size: 24px;
+  font-weight: 500;
+  margin: 0; }
+
+h4 {
+  font-size: 18px;
+  font-weight: 500;
+  margin: 0; }
+
+h5 {
+  font-family: "Nunito", sans-serif;
+  font-size: 24px;
+  font-weight: 400;
+  margin: 0; }
+
+.fade-enter {
+  transition: opacity 0.2s ease;
+  position: absolute;
+  opacity: 0; }
+
+.fade-enter-active {
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit {
+  transition: opacity 0.15s ease;
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit-active {
+  position: absolute;
+  opacity: 0; }
+
+.fade-exit-done {
+  position: absolute;
+  opacity: 0; }
+
+* {
+  box-sizing: border-box; }
+  *::-webkit-scrollbar-track {
+    background-color: #f8f9f7;
+    border-radius: 20px; }
+  *::-webkit-scrollbar {
+    width: 12px;
+    height: 12px; }
+  *::-webkit-scrollbar-thumb {
+    -webkit-transition: all 0.3s ease;
+    transition: all 0.3s ease;
+    border-radius: 10px;
+    background-color: #cdd3cd;
+    border-width: 3px;
+    border-style: solid;
+    border-color: #f8f9f7; }
+    *::-webkit-scrollbar-thumb:hover {
+      border-width: 2px;
+      background-color: #bfc7bf; }
+  *::-webkit-scrollbar-button {
+    display: none; }
+
+.scroll-white::-webkit-scrollbar-track {
+  background-color: #fefefe;
+  border-radius: 20px; }
+
+.scroll-white::-webkit-scrollbar-thumb {
+  background-color: #cdd3cd;
+  border-color: #fefefe; }
+  .scroll-white::-webkit-scrollbar-thumb:hover {
+    background-color: #bfc7bf; }
+
+.component-video-player {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  min-height: 50px; }
+  .component-video-player.blackground {
+    background-color: #121212; }
+  .component-video-player iframe {
+    height: 100%;
+    width: 100%; }
+
+@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
+:export {
+  white: #fefefe;
+  darkenWhite: #efefef;
+  black: #121212;
+  transparent: rgba(0, 0, 0, 0);
+  primary: #3fa110;
+  primaryDark: #33820d;
+  primaryLight: #d7e6c8;
+  secondaryDarker: #323c32;
+  secondaryDark: #5a645a;
+  secondary: #828a82;
+  secondaryLight: #cdd3cd;
+  secondaryLighter: #f8f9f7;
+  danger: #e60000;
+  dangerLight: #ffb4b4;
+  dangerDark: #ab4745;
+  warning: #ffcd00;
+  warningLight: #ffeb98;
+  warningDark: #765f00; }
+
+:root {
+  --rowPadding: 0;
+  --colPadding: 8px; }
+
+:export {
+  widthXs: 575.98px;
+  widthSm: 767.98px;
+  widthMd: 991.98px;
+  widthLg: 1199.98px; }
+
+body.sb-show-main.sb-main-padded {
+  padding: 15px; }
+
+*.nunito {
+  font-family: "Nunito", sans-serif; }
+
+*:not(.nunito) {
+  font-family: "Exo 2", sans-serif; }
+
+.document-grabbing {
+  cursor: -webkit-grabbing !important;
+  cursor: grabbing !important; }
+
+h1 {
+  font-size: 36px;
+  font-weight: 600;
+  margin: 0; }
+
+h2 {
+  font-size: 32px;
+  font-weight: 500;
+  margin: 0; }
+
+h3 {
+  font-size: 24px;
+  font-weight: 500;
+  margin: 0; }
+
+h4 {
+  font-size: 18px;
+  font-weight: 500;
+  margin: 0; }
+
+h5 {
+  font-family: "Nunito", sans-serif;
+  font-size: 24px;
+  font-weight: 400;
+  margin: 0; }
+
+.fade-enter {
+  transition: opacity 0.2s ease;
+  position: absolute;
+  opacity: 0; }
+
+.fade-enter-active {
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit {
+  transition: opacity 0.15s ease;
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit-active {
+  position: absolute;
+  opacity: 0; }
+
+.fade-exit-done {
+  position: absolute;
+  opacity: 0; }
+
+* {
+  box-sizing: border-box; }
+  *::-webkit-scrollbar-track {
+    background-color: #f8f9f7;
+    border-radius: 20px; }
+  *::-webkit-scrollbar {
+    width: 12px;
+    height: 12px; }
+  *::-webkit-scrollbar-thumb {
+    -webkit-transition: all 0.3s ease;
+    transition: all 0.3s ease;
+    border-radius: 10px;
+    background-color: #cdd3cd;
+    border-width: 3px;
+    border-style: solid;
+    border-color: #f8f9f7; }
+    *::-webkit-scrollbar-thumb:hover {
+      border-width: 2px;
+      background-color: #bfc7bf; }
+  *::-webkit-scrollbar-button {
+    display: none; }
+
+.scroll-white::-webkit-scrollbar-track {
+  background-color: #fefefe;
+  border-radius: 20px; }
+
+.scroll-white::-webkit-scrollbar-thumb {
+  background-color: #cdd3cd;
+  border-color: #fefefe; }
+  .scroll-white::-webkit-scrollbar-thumb:hover {
+    background-color: #bfc7bf; }
+
+.component-aconteceu {
+  border-radius: 8px;
+  width: 100%;
+  height: 100%;
+  box-shadow: 0 1px 2px 0 rgba(90, 100, 90, 0.3);
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  justify-content: stretch; }
+  .component-aconteceu .component-aconteceu-header {
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none;
+    height: 48px;
+    border-radius: 8px 8px 0 0;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    padding: 8px;
+    background-color: #f06666;
+    color: #fefefe; }
+    .component-aconteceu .component-aconteceu-header svg {
+      width: 20px;
+      height: 20px; }
+    .component-aconteceu .component-aconteceu-header label {
+      font-weight: 700;
+      font-size: 24px;
+      margin: 0 0 0 8px; }
+  .component-aconteceu .component-aconteceu-content {
+    border-radius: 0 0 8px 8px;
+    position: relative;
+    background-color: #fefefe;
+    padding: 4px 10px 30px;
+    height: calc(100% - 50px);
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    justify-content: space-between; }
+    .component-aconteceu .component-aconteceu-content .component-aconteceu-text {
+      display: block;
+      padding: 4px 4px 4px;
+      margin-bottom: 4px;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      font-weight: 600;
+      color: #323c32; }
+    .component-aconteceu .component-aconteceu-content .component-aconteceu-video {
+      height: calc(100% - 27px); }
+      .component-aconteceu .component-aconteceu-content .component-aconteceu-video.full-height {
+        height: 100%; }
+    .component-aconteceu .component-aconteceu-content iframe {
+      height: 100% !important; }
+    .component-aconteceu .component-aconteceu-content .component-aconteceu-see-more {
+      position: absolute;
+      bottom: 0;
+      right: 0;
+      font-size: 14px;
+      font-weight: 700;
+      outline: none;
+      border: none;
+      cursor: pointer;
+      background-color: #fefefe;
+      padding: 5px 10px 5px;
+      border-radius: 20px;
+      color: #323c32;
+      transition: transform 0.3s ease;
+      transform-origin: center;
+      -webkit-user-select: none;
+         -moz-user-select: none;
+          -ms-user-select: none;
+              user-select: none; }
+      .component-aconteceu .component-aconteceu-content .component-aconteceu-see-more:active {
+        transform: scale(0.95); }
+    .component-aconteceu .component-aconteceu-content .component-aconteceu-loader {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-color: #fefefe;
+      display: flex;
+      align-items: center;
+      justify-content: center; }
+
+@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
+:export {
+  white: #fefefe;
+  darkenWhite: #efefef;
+  black: #121212;
+  transparent: rgba(0, 0, 0, 0);
+  primary: #3fa110;
+  primaryDark: #33820d;
+  primaryLight: #d7e6c8;
+  secondaryDarker: #323c32;
+  secondaryDark: #5a645a;
+  secondary: #828a82;
+  secondaryLight: #cdd3cd;
+  secondaryLighter: #f8f9f7;
+  danger: #e60000;
+  dangerLight: #ffb4b4;
+  dangerDark: #ab4745;
+  warning: #ffcd00;
+  warningLight: #ffeb98;
+  warningDark: #765f00; }
+
+:root {
+  --rowPadding: 0;
+  --colPadding: 8px; }
+
+:export {
+  widthXs: 575.98px;
+  widthSm: 767.98px;
+  widthMd: 991.98px;
+  widthLg: 1199.98px; }
+
+body.sb-show-main.sb-main-padded {
+  padding: 15px; }
+
+*.nunito {
+  font-family: "Nunito", sans-serif; }
+
+*:not(.nunito) {
+  font-family: "Exo 2", sans-serif; }
+
+.document-grabbing {
+  cursor: -webkit-grabbing !important;
+  cursor: grabbing !important; }
+
+h1 {
+  font-size: 36px;
+  font-weight: 600;
+  margin: 0; }
+
+h2 {
+  font-size: 32px;
+  font-weight: 500;
+  margin: 0; }
+
+h3 {
+  font-size: 24px;
+  font-weight: 500;
+  margin: 0; }
+
+h4 {
+  font-size: 18px;
+  font-weight: 500;
+  margin: 0; }
+
+h5 {
+  font-family: "Nunito", sans-serif;
+  font-size: 24px;
+  font-weight: 400;
+  margin: 0; }
+
+.fade-enter {
+  transition: opacity 0.2s ease;
+  position: absolute;
+  opacity: 0; }
+
+.fade-enter-active {
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit {
+  transition: opacity 0.15s ease;
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit-active {
+  position: absolute;
+  opacity: 0; }
+
+.fade-exit-done {
+  position: absolute;
+  opacity: 0; }
+
+* {
+  box-sizing: border-box; }
+  *::-webkit-scrollbar-track {
+    background-color: #f8f9f7;
+    border-radius: 20px; }
+  *::-webkit-scrollbar {
+    width: 12px;
+    height: 12px; }
+  *::-webkit-scrollbar-thumb {
+    -webkit-transition: all 0.3s ease;
+    transition: all 0.3s ease;
+    border-radius: 10px;
+    background-color: #cdd3cd;
+    border-width: 3px;
+    border-style: solid;
+    border-color: #f8f9f7; }
+    *::-webkit-scrollbar-thumb:hover {
+      border-width: 2px;
+      background-color: #bfc7bf; }
+  *::-webkit-scrollbar-button {
+    display: none; }
+
+.scroll-white::-webkit-scrollbar-track {
+  background-color: #fefefe;
+  border-radius: 20px; }
+
+.scroll-white::-webkit-scrollbar-thumb {
+  background-color: #cdd3cd;
+  border-color: #fefefe; }
+  .scroll-white::-webkit-scrollbar-thumb:hover {
+    background-color: #bfc7bf; }
+
+.action-card {
+  position: relative;
+  border-radius: 8px;
+  padding: 16px 24px;
+  width: 100%; }
+  .action-card .action {
+    margin-top: 12px; }
+  .action-card .bar {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 8px;
     border-top-left-radius: 8px;
     border-bottom-left-radius: 8px;
     height: 100%; }
@@ -8100,33 +8673,6 @@ h5 {
   opacity: 0;
   transform: translateY(10px); }
 
-.refresh-icon {
-  fill: currentColor;
-  width: 1em;
-  height: 1em;
-  display: inline-block;
-  font-size: 1.5rem;
-  flex-shrink: 0;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none; }
-  .refresh-icon.animate {
-    -webkit-animation: spin 0.4s linear infinite;
-            animation: spin 0.4s linear infinite; }
-
-@-webkit-keyframes spin {
-  0% {
-    transform: rotateZ(0); }
-  100% {
-    transform: rotateZ(180deg); } }
-
-@keyframes spin {
-  0% {
-    transform: rotateZ(0); }
-  100% {
-    transform: rotateZ(180deg); } }
-
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
 :export {
@@ -9694,8 +10240,10 @@ h5 {
   display: flex;
   flex-flow: column; }
   .full-height-container .full-height-container-row-header {
-    flex: 0 1 auto; }
+    flex: 0 1 auto;
+    z-index: +2; }
   .full-height-container .full-height-container-row-content {
+    z-index: +1;
     display: flex;
     flex-flow: column;
     flex: 1 1 auto;
@@ -9709,7 +10257,8 @@ h5 {
       padding-left: 12px;
       padding-right: 12px; }
   .full-height-container .full-height-container-row-footer {
-    flex: 0 1 auto; }
+    flex: 0 1 auto;
+    z-index: +2; }
 
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -11370,240 +11919,74 @@ h5 {
   .component-input-area-input:disabled:-ms-input-placeholder {
     color: #828a82 !important; }
   .component-input-area-input:disabled::placeholder {
-    color: #828a82 !important; }
-
-.component-input-area:not(.component-input-area-error):not(.force-focus):not(.component-input-area-disabled):not(.component-input-area-loading) .component-input-area-input-container:focus-within::before {
-  opacity: 1;
-  visibility: visible;
-  content: '';
-  height: 2px;
-  display: block;
-  position: absolute;
-  bottom: -2px;
-  background-color: #33820d;
-  -webkit-animation: inputFocus 0.3s ease forwards;
-          animation: inputFocus 0.3s ease forwards; }
-
-.component-input-area:not(.component-input-area-error):not(.force-focus):not(.component-input-area-disabled):not(.component-input-area-loading) .component-input-area-input-container:not(:focus-within):not(.force-focus)::before {
-  opacity: 0;
-  content: '';
-  height: 2px;
-  display: block;
-  position: absolute;
-  bottom: -2px;
-  background-color: #33820d;
-  -webkit-animation: inputFocusReverse 0.3s ease forwards;
-          animation: inputFocusReverse 0.3s ease forwards; }
-
-.component-input-area:not(.component-input-area-error).force-focus .component-input-area-input-container::before {
-  opacity: 1;
-  visibility: visible;
-  content: '';
-  height: 2px;
-  display: block;
-  position: absolute;
-  bottom: -2px;
-  background-color: #33820d;
-  -webkit-animation: inputFocus 0.3s ease forwards;
-          animation: inputFocus 0.3s ease forwards; }
-
-@-webkit-keyframes inputFocus {
-  0% {
-    width: 0;
-    left: 50%; }
-  100% {
-    left: 0;
-    width: 100%; } }
-
-@keyframes inputFocus {
-  0% {
-    width: 0;
-    left: 50%; }
-  100% {
-    left: 0;
-    width: 100%; } }
-
-@-webkit-keyframes inputFocusReverse {
-  0% {
-    left: 0;
-    width: 100%; }
-  100% {
-    width: 0;
-    left: 50%; } }
-
-@keyframes inputFocusReverse {
-  0% {
-    left: 0;
-    width: 100%; }
-  100% {
-    width: 0;
-    left: 50%; } }
-
-@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
-:export {
-  white: #fefefe;
-  darkenWhite: #efefef;
-  black: #121212;
-  transparent: rgba(0, 0, 0, 0);
-  primary: #3fa110;
-  primaryDark: #33820d;
-  primaryLight: #d7e6c8;
-  secondaryDarker: #323c32;
-  secondaryDark: #5a645a;
-  secondary: #828a82;
-  secondaryLight: #cdd3cd;
-  secondaryLighter: #f8f9f7;
-  danger: #e60000;
-  dangerLight: #ffb4b4;
-  dangerDark: #ab4745;
-  warning: #ffcd00;
-  warningLight: #ffeb98;
-  warningDark: #765f00; }
-
-:root {
-  --rowPadding: 0;
-  --colPadding: 8px; }
-
-:export {
-  widthXs: 575.98px;
-  widthSm: 767.98px;
-  widthMd: 991.98px;
-  widthLg: 1199.98px; }
-
-body.sb-show-main.sb-main-padded {
-  padding: 15px; }
-
-*.nunito {
-  font-family: "Nunito", sans-serif; }
-
-*:not(.nunito) {
-  font-family: "Exo 2", sans-serif; }
-
-.document-grabbing {
-  cursor: -webkit-grabbing !important;
-  cursor: grabbing !important; }
-
-h1 {
-  font-size: 36px;
-  font-weight: 600;
-  margin: 0; }
-
-h2 {
-  font-size: 32px;
-  font-weight: 500;
-  margin: 0; }
-
-h3 {
-  font-size: 24px;
-  font-weight: 500;
-  margin: 0; }
-
-h4 {
-  font-size: 18px;
-  font-weight: 500;
-  margin: 0; }
-
-h5 {
-  font-family: "Nunito", sans-serif;
-  font-size: 24px;
-  font-weight: 400;
-  margin: 0; }
-
-.fade-enter {
-  transition: opacity 0.2s ease;
-  position: absolute;
-  opacity: 0; }
-
-.fade-enter-active {
-  position: absolute;
-  opacity: 1; }
+    color: #828a82 !important; }
 
-.fade-exit {
-  transition: opacity 0.15s ease;
+.component-input-area:not(.component-input-area-error):not(.force-focus):not(.component-input-area-disabled):not(.component-input-area-loading) .component-input-area-input-container:focus-within::before {
+  opacity: 1;
+  visibility: visible;
+  content: '';
+  height: 2px;
+  display: block;
   position: absolute;
-  opacity: 1; }
+  bottom: -2px;
+  background-color: #33820d;
+  -webkit-animation: inputFocus 0.3s ease forwards;
+          animation: inputFocus 0.3s ease forwards; }
 
-.fade-exit-active {
+.component-input-area:not(.component-input-area-error):not(.force-focus):not(.component-input-area-disabled):not(.component-input-area-loading) .component-input-area-input-container:not(:focus-within):not(.force-focus)::before {
+  opacity: 0;
+  content: '';
+  height: 2px;
+  display: block;
   position: absolute;
-  opacity: 0; }
+  bottom: -2px;
+  background-color: #33820d;
+  -webkit-animation: inputFocusReverse 0.3s ease forwards;
+          animation: inputFocusReverse 0.3s ease forwards; }
 
-.fade-exit-done {
+.component-input-area:not(.component-input-area-error).force-focus .component-input-area-input-container::before {
+  opacity: 1;
+  visibility: visible;
+  content: '';
+  height: 2px;
+  display: block;
   position: absolute;
-  opacity: 0; }
-
-* {
-  box-sizing: border-box; }
-  *::-webkit-scrollbar-track {
-    background-color: #f8f9f7;
-    border-radius: 20px; }
-  *::-webkit-scrollbar {
-    width: 12px;
-    height: 12px; }
-  *::-webkit-scrollbar-thumb {
-    -webkit-transition: all 0.3s ease;
-    transition: all 0.3s ease;
-    border-radius: 10px;
-    background-color: #cdd3cd;
-    border-width: 3px;
-    border-style: solid;
-    border-color: #f8f9f7; }
-    *::-webkit-scrollbar-thumb:hover {
-      border-width: 2px;
-      background-color: #bfc7bf; }
-  *::-webkit-scrollbar-button {
-    display: none; }
-
-.scroll-white::-webkit-scrollbar-track {
-  background-color: #fefefe;
-  border-radius: 20px; }
-
-.scroll-white::-webkit-scrollbar-thumb {
-  background-color: #cdd3cd;
-  border-color: #fefefe; }
-  .scroll-white::-webkit-scrollbar-thumb:hover {
-    background-color: #bfc7bf; }
+  bottom: -2px;
+  background-color: #33820d;
+  -webkit-animation: inputFocus 0.3s ease forwards;
+          animation: inputFocus 0.3s ease forwards; }
 
-.percent-loader-icon {
-  width: 1em;
-  height: 1em;
-  display: inline-block;
-  font-size: 1.5rem;
-  flex-shrink: 0;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
-  fill: none;
-  stroke-width: 6;
-  transform: rotateZ(-90deg); }
-  .percent-loader-icon circle:first-of-type {
-    stroke: #cdd3cd; }
-  .percent-loader-icon circle:last-of-type {
-    stroke-linecap: round;
-    stroke-dasharray: 264;
-    transition: stroke-dashoffset 0.3s ease, stroke-dasharray 0.3s ease; }
-  .percent-loader-icon path {
-    stroke-linecap: round;
-    stroke-linejoin: round;
-    transform: translate(390px, -676px) rotateZ(90deg);
-    transition: stroke-dashoffset 0.3s ease, stroke-dasharray 0.3s ease; }
+@-webkit-keyframes inputFocus {
+  0% {
+    width: 0;
+    left: 50%; }
+  100% {
+    left: 0;
+    width: 100%; } }
 
-.percent-loader-icon.indefinido {
-  -webkit-animation: spinNoventa 0.6s linear infinite;
-          animation: spinNoventa 0.6s linear infinite; }
+@keyframes inputFocus {
+  0% {
+    width: 0;
+    left: 50%; }
+  100% {
+    left: 0;
+    width: 100%; } }
 
-@-webkit-keyframes spinNoventa {
+@-webkit-keyframes inputFocusReverse {
   0% {
-    transform: rotateZ(-90deg); }
+    left: 0;
+    width: 100%; }
   100% {
-    transform: rotateZ(270deg); } }
+    width: 0;
+    left: 50%; } }
 
-@keyframes spinNoventa {
+@keyframes inputFocusReverse {
   0% {
-    transform: rotateZ(-90deg); }
+    left: 0;
+    width: 100%; }
   100% {
-    transform: rotateZ(270deg); } }
+    width: 0;
+    left: 50%; } }
 
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -12173,143 +12556,6 @@ h5 {
   .scroll-white::-webkit-scrollbar-thumb:hover {
     background-color: #bfc7bf; }
 
-.sicredi-logo {
-  display: flex;
-  align-items: center;
-  justify-content: center; }
-  .sicredi-logo #Caminho_17 {
-    transform: translateX(286.845px) translateY(657.948px);
-    transform-origin: left center;
-    transition: transform 0.3s ease, opacity 0.3s ease; }
-    .sicredi-logo #Caminho_17.sicredi-logo-hide-letters {
-      transform: translateX(270px) translateY(657.948px);
-      opacity: 0; }
-
-@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
-:export {
-  white: #fefefe;
-  darkenWhite: #efefef;
-  black: #121212;
-  transparent: rgba(0, 0, 0, 0);
-  primary: #3fa110;
-  primaryDark: #33820d;
-  primaryLight: #d7e6c8;
-  secondaryDarker: #323c32;
-  secondaryDark: #5a645a;
-  secondary: #828a82;
-  secondaryLight: #cdd3cd;
-  secondaryLighter: #f8f9f7;
-  danger: #e60000;
-  dangerLight: #ffb4b4;
-  dangerDark: #ab4745;
-  warning: #ffcd00;
-  warningLight: #ffeb98;
-  warningDark: #765f00; }
-
-:root {
-  --rowPadding: 0;
-  --colPadding: 8px; }
-
-:export {
-  widthXs: 575.98px;
-  widthSm: 767.98px;
-  widthMd: 991.98px;
-  widthLg: 1199.98px; }
-
-body.sb-show-main.sb-main-padded {
-  padding: 15px; }
-
-*.nunito {
-  font-family: "Nunito", sans-serif; }
-
-*:not(.nunito) {
-  font-family: "Exo 2", sans-serif; }
-
-.document-grabbing {
-  cursor: -webkit-grabbing !important;
-  cursor: grabbing !important; }
-
-h1 {
-  font-size: 36px;
-  font-weight: 600;
-  margin: 0; }
-
-h2 {
-  font-size: 32px;
-  font-weight: 500;
-  margin: 0; }
-
-h3 {
-  font-size: 24px;
-  font-weight: 500;
-  margin: 0; }
-
-h4 {
-  font-size: 18px;
-  font-weight: 500;
-  margin: 0; }
-
-h5 {
-  font-family: "Nunito", sans-serif;
-  font-size: 24px;
-  font-weight: 400;
-  margin: 0; }
-
-.fade-enter {
-  transition: opacity 0.2s ease;
-  position: absolute;
-  opacity: 0; }
-
-.fade-enter-active {
-  position: absolute;
-  opacity: 1; }
-
-.fade-exit {
-  transition: opacity 0.15s ease;
-  position: absolute;
-  opacity: 1; }
-
-.fade-exit-active {
-  position: absolute;
-  opacity: 0; }
-
-.fade-exit-done {
-  position: absolute;
-  opacity: 0; }
-
-* {
-  box-sizing: border-box; }
-  *::-webkit-scrollbar-track {
-    background-color: #f8f9f7;
-    border-radius: 20px; }
-  *::-webkit-scrollbar {
-    width: 12px;
-    height: 12px; }
-  *::-webkit-scrollbar-thumb {
-    -webkit-transition: all 0.3s ease;
-    transition: all 0.3s ease;
-    border-radius: 10px;
-    background-color: #cdd3cd;
-    border-width: 3px;
-    border-style: solid;
-    border-color: #f8f9f7; }
-    *::-webkit-scrollbar-thumb:hover {
-      border-width: 2px;
-      background-color: #bfc7bf; }
-  *::-webkit-scrollbar-button {
-    display: none; }
-
-.scroll-white::-webkit-scrollbar-track {
-  background-color: #fefefe;
-  border-radius: 20px; }
-
-.scroll-white::-webkit-scrollbar-thumb {
-  background-color: #cdd3cd;
-  border-color: #fefefe; }
-  .scroll-white::-webkit-scrollbar-thumb:hover {
-    background-color: #bfc7bf; }
-
 .component-menu-toggle {
   transition: left 0.3s ease;
   position: fixed;