* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body, html {
    min-height: 100dvh;
    overflow-y: hidden;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
}

#container {
    overflow-x: scroll;
    overflow-y: hidden;
}
        /* ===== Scrollbar CSS ===== */
          /* Firefox */
          * {
            scrollbar-width: thin;
            scrollbar-color: #55a3f3 #0f172a;
        }
        
          /* Chrome, Edge, and Safari */
        *::-webkit-scrollbar {
            width: 10px;
            background-color:#0f172a;
        }
        
        
        *::-webkit-scrollbar-thumb {
            background-color: #55a3f3;
            border-radius: 10px;
            border: 2px none #ffffff;
            
        }   

        #slide_0 {
            width:100vw;
            background-color: blueviolet;
        }
        #slide_5_5 {
          float:right;
          text-align: right;
        }
        #celular {
            align-content:center;
            margin: auto;
            overflow-y: hidden;
            border: none;
            padding: 0vw;
            width: 100vw;
            height: 100vh;
            background-color: rgba(0,0,0,0.8); 
        }
        #celular::backdrop {
            background-color: rgba(0,0,0,1);  
            backdrop-filter: blur(7px);
            cursor: pointer;
        }
        .w-full {
            margin: auto;
            display: block;
            width:100%;
            height:auto;
        }
.box {
    display: flex;
    align-items: stretch;
}
.img_teste {
    height: 100dvh;
    width: auto;
    object-position: bottom left;
}
.relative {
    position: relative;
}
.overlay {
    left:0;
    top:0;
    position:absolute;
}
.testando {
    top:-200;
}

.swipe-section {
    position: relative;
    height: 100vh;
    width: 100%;
    overflow: visible;
}
.progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 10px;
    background: red;
    transform: scaleX(0);
    transform-origin: 0%;
    z-index: 50;
}

.progress {
    z-index: 51;
    position: fixed;
    bottom: 20px;
    left: 10px;
    padding: 10px;
    background: #eeeeee;
    color: #222222;
    font-size: 18px;
    font-weight: bold;
    width: 100px;
    text-align: center;
    border-radius: 5px;
}

#anim_1 {
    margin-left:2.5vw;
}

#slide_1_0,#slide_1_1,#slide_1_2,#slide_1_3,#slide_1_4,#slide_1_5,#slide_1_6,#slide_2_1,#slide_2_3,#slide_2_4,#slide_3_0,#slide_3_1,#slide_3_2,#slide_3_3,#slide_3_4,#slide_3_5,#slide_4_1 {
    opacity: 0;
}
#slide_1_2 {
    top:50px;
}
#slide_1_3 {
    top:-50px;
}
#slide_1_4 {
    left:-50px;
}
#slide_1_5 {
    top:-100px;
}
#slide_2_1 {
    top:100px;
}
#slide_3_1 {
    left:-50px;
}
#slide_3_3 {
    left:-50px;
}
#slide_3_5 {
    top:100px;
}
#slide_4_1 {
    left:-150px;
}

dialog:not([open]) {
    display: none !important;
}

dialog::backdrop {
  background-color: rgba(255,255,255,0.1);  
  backdrop-filter: blur(7px);
  cursor: pointer;
}
#botoes-slide-1, #botoes-slide-2, #botoes-slide-3 {
    opacity:0;
}
#coopNumeros, #dezMotivos, #economiaMundial, #ajudaOnu {
    margin: auto;
    overflow-y: hidden;
    border: solid 2px #eeeeee;
    padding: 0vw;
    width: 70vw;
}
.dialog_texto {
    margin: auto;
    padding: 2vw;
    border: none;
    width: 75vw;
    overflow-y: hidden;
}
.dialog_texto h3 {
    font-size: 1.7rem;
    color:#65BAB8;
}
.dialog_texto p {
    font-size: 1rem;
    color:#171C67;
}

.cls-1 {
    fill: #ffffff;
}

.cls-1, .cls-2 {
    stroke-width: 0px;
    cursor: pointer;
}
.cls-3 {
    stroke-width: 4px;
    stroke:#65BAB8;
    fill:none;
}

.cls-2 {
    fill: #2C54AC;
}

.sl-logo {
    fill: transparent;
  }

  .sl-logo, .cls-2, .cls-3, .cls-4 {
    stroke-width: 0px;
  }

  .icons-1 {
    fill: transparent;
  }

  .icons-1, .icons-2, .icons-3 {
    stroke-width: 0px;
  }

  .icons-2 {
    fill: none;
  }

  .icons-3 {
    fill: #fff;
  }

  .action-1 {
    fill: none;
  }

  .action-1, .action-2 {
    stroke-width: 0px;
  }

  .action-2 {
    fill: transparent;
  }

  .cls-2 {
    fill: none;
  }

  .cls-3 {
    fill: #92b940;
  }

  .cls-4 {
    fill: #fff;
  }

  /* MOUSE CLIQUE 1 */

  .mc-1-1 {
    fill: #65bab8;
  }

  .mc-1-1, .mc-1-2, .mc-1-3 {
    stroke-width: 0px;
  }

  .mc-1-2 {
    fill: #171c67;
  }

  .mc-1-3 {
    fill: transparent;
  }

  .mc-1-4 {
    fill: #fff;
  }

.sv-class-1 {
fill: none;
stroke: #65bab8;
stroke-width: 2px;
stroke-miterlimit: 10;
}

.sv-class-2 {
fill: #2c54ac;
}

.sv-class-2, .sv-class-3 {
stroke-width: 0px;
}

.sv-class-3 {
fill: #fff;
}

.txt_btn-1 {
fill: #65bab8;
}

.txt_btn-1, .txt_btn-2 {
stroke-width: 0px;
}

.txt_btn-3 {
fill: none;
stroke: #2c54ac;
stroke-miterlimit: 10;
stroke-width: 2px;
}

.txt_btn-2 {
fill: #fff;
}

.btn-more {
  width:2.8vw;
  height:2.8vw;
  /* opacity: 0; */
}

.read-more {
  width:2.8vw;
  height:2.8vw;
  opacity: 0;
}

.btn-read-info {
  width:3vw;
  height:3vw;
  opacity: 0;
}

.btn-more, .read-more, .btn-read-info, .mc-1-3, .btn-icons{
cursor: pointer;
}
      
.close-button, .close-button-text {
    z-index:999;
    width:2vw;
    height: 2vw;
    top:0.5vh;
    left:77vw;
    cursor:pointer;
}
.close-button-text {
    left:72.5vw;
}
.z-100 {
    z-index:100;
}


@media (max-aspect-ratio: 17/9) {
    #coopNumeros, #dezMotivos, #economiaMundial, #ajudaOnu {
        padding: 1vw;
        width: 80vw;
    }

    .close-button {
        left:77vw;
    }

    #btn-coop-numeros {
        top:11vh;
        left: 36dvw;
    }

    #btn-dez-motivos {
        top:11vh;
        left:83vw;
    }
    #slide-1-txt-1 {
        top:23vh;
        left:117dvw;
    }

    #ajuda-onu {
        top:10vh;
        left:25vw;
    }

    #economia-mundial {
        top:75vh;
        left:12vw;
    }

    #slide-3-txt-1 {
        top:4vh;
        left:22vw;
    }

    #slide-3-txt-2 {
        top:38vh;
        left:66vw;
    }

}

@media (min-aspect-ratio: 17/9) {

    #coopNumeros, #dezMotivos, #economiaMundial, #ajudaOnu {
        padding: 1vw;
        width: 80vw;
    }
    
    .close-button {
        left:77vw;
    }
    #slide_4_1 {
        left:-250px;
    }
    #btn-coop-numeros {
        top:10vh;
        left: 30dvw;
    }

    #btn-dez-motivos {
        top:10vh;
        left:70vw;
    }
    #slide-1-txt-1 {
        top:22vh;
        left:77vw;
    }

    #ajuda-onu {
        top:10vh;
        left:25vw;
    }

    #economia-mundial {
        top:75vh;
        left:10vw;
    }

    #slide-3-txt-1 {
        top:5vh;
        left:17vw;
    }

    #slide-3-txt-1 {
        top:5vh;
        left:17vw;
    }
    
    #slide-3-txt-2 {
        top:38vh;
        left:63vw;
    }
}

@media (min-aspect-ratio: 19/9) {

    #coopNumeros, #dezMotivos, #economiaMundial, #ajudaOnu {
        padding: 1vw;
        width: 80vw;
    }
    
    .close-button {
        left:77vw;
    }

    #slide_4_1 {
        left:-150px;
    }


    #btn-coop-numeros {
        top:10vh;
        left: 28dvw;
    }

    #btn-dez-motivos {
        top:10vh;
        left:65vw;
    }
    #slide-1-txt-1 {
        top:23vh;
        left:92vw;
    }      
    #ajuda-onu {
        top:9vh;
        left:22vw;
    }
    #economia-mundial {
        top:75vh;
        left:10vw;
    }

    #slide-3-txt-1 {
        top:5vh;
        left:17vw;
    }
    
    #slide-3-txt-2 {
        top:38vh;
        left:53vw;
    }
}

@media (min-aspect-ratio: 21/9) {

    #coopNumeros, #dezMotivos, #economiaMundial, #ajudaOnu {
        padding: 1vw;
        width: 70vw;
    }

    .close-button {
        left:67vw;
    }
    #slide_4_1 {
        left:-150px;
    }
    #btn-coop-numeros {
        top:9vh;
        left: 25dvw;
    }

    #btn-dez-motivos {
        top:9vh;
        left:58vw;
    }
    #slide-1-txt-1 {
        top:20vh;
        left:83vw;
    }      
    #ajuda-onu {
        top:6vh;
        left:18vw;
    }
    #economia-mundial {
        top:65vh;
        left:8vw;
    }

    #slide-3-txt-1 {
        top:3vh;
        left:15vw;
    }
    
    #slide-3-txt-2 {
        top:32vh;
        left:47vw;
    }
}