body{background:radial-gradient(circle, #0000, #0009),url(../../midias/wallpaper.png);
    background-repeat:no-repeat;background-size:cover;font-family:monospace;
    background-position:center center;background-attachment:fixed
}

/*Janela-----------------------------------*/
.janela{width:1000px;height:500px;box-sizing:border-box;
    top:50%;left:50%;position:absolute;overflow:hidden;
    -webkit-transform:translate(-50%,-50%);padding:0px;
    -ms-transform:translate(-50%,-50%);user-select:none;
    transform:translateZ(0)translate(-50%,-50%)scale(1);
    backdrop-filter:blur(10px);transition:all 0.1s;
    color:#fff;resize:both;
    border-radius:8px;border:1px solid#555a;
    box-shadow:0 0 30px #0005;max-width:calc(100% - 10px);
    animation:entrada 0.3s ease-out}.barra{color:#CCC;
    z-index:5;padding:12px;top:0;left:0;font-size:14px;
    position:absolute;font-size:16px;
    background:linear-gradient(to bottom,#3339,#2229);
    box-shadow:0 0 25px #0005;overflow:hidden;right:0;
    text-align:center;padding-left:16px;white-space:nowrap}
    .barra img{position:absolute;right:7px;margin-top:-4px;
    width:25px;height:25px}.barra zzz{position:absolute;top:8px;
    right:45px;font-size:19px;cursor:pointer;color:#ddd}
    bbb{width:12px;height:12px;margin-right:7px;cursor:pointer;
    position:relative;float:left;margin-top:4px;border-radius:50%;
    background:#FF5F57}bbb::before,bbb::after{width:100%;
    height:100%;cursor:pointer;position:absolute;content:'';
    border-radius:50%}bbb::before{background:#FECF1A;left:20px}
    bbb::after{background:#46D755;left:40px}.janela .lateral{
    position:absolute;background-color:#111a;padding:0;overflow:hidden;
    width:130px;top:41px;left:0;bottom:0}.lateral button{width:calc(100% - 4px)}
    .conteudo{position:absolute;width:calc(100% - 150px);padding:10px;
    overflow:auto;top:41px;bottom:0;right:0;scrollbar-width:thin;
    transition:all 0.5s ease;background-color:#333e;
    scrollbar-color:#222#333}#modalJJ{position:fixed;z-index:10;
    display:none;left:0;top:0;width:100%;height:100%;overflow:hidden;
    background-color:#0005}#modalJJ .JJ{color:#fff;
    width:530px;margin:auto;padding:0px;font-size:16px;
    border-radius:8px;overflow:hidden;box-sizing:border-box;
    backdrop-filter:blur(10px);border:1px solid#555;max-width:calc(100% - 40px);
    box-shadow:0 0 30px #0005;animation:entradaPP 0.2s ease-out}
    .JJ .barraA{top:0;left:0;right:0;text-align:center;z-index:5;
    position:relative;font-size:14px;
    background:linear-gradient(to bottom,#3335,#2225);
    box-shadow:0 0 25px #000;overflow:hidden;color:#CCC;
    padding:12px;margin:0;padding-left:16px;white-space:nowrap}
    .barraA img{position:absolute;right:7px;margin-top:-4px;
    width:25px;height:25px}.JJ .close{position:relative;float:left;
    margin-top:4px;cursor:pointer;width:12px;height:12px;margin-right:7px;
    border-radius:50%;background:#FF5F57}.conteudoo{margin:0;
    padding:10px;background-color:#333d}button{text-decoration:none;
    border-radius:4px;padding:5px 20px 7px 20px;font-size:12px;
    display:inline-block;margin:6px 2px 6px 2px;color:#fffc;
    text-align:center;transition: all 0.2s;cursor:pointer;
    border:1px solid #fff5;background-color:#2225}button:hover
    {border-color:#fff}.conteudo a{text-decoration:none;color:#aaa;
    font-size:16px;transition:all 0.3s ease;
    position:relative}.conteudo a:hover{color:#fff}.conteudo a::before
    {content:'';position:absolute;width:0%;height:4px;bottom:0;left:0;
    transition:all 0.1s ease;background:linear-gradient(to right,#888,#ccc)}
    .conteudo a:hover::before{width:100%;cursor:pointer}
    @keyframes entrada{0%{opacity:0;width:0px;height:42px}
    50%{opacity:1;width:1000px;height:42px}100%{height:500px}}
    @keyframes entradaPP{0%{opacity:0;width:0px}100%{opacity:1;width:50%}}
    #slink{position:absolute;top:10px;left:75px;font-size:18px;cursor:pointer;
    color:#ddd}.conteudo.expandido{background-color:#333;width:calc(100% - 20px)}
    @media only screen and (max-width:768px){.janela{resize:vertical}
    .conteudo{width:calc(100% - 20px);background-color:#333}
    .conteudo.expandido{width:calc(100% - 150px);background-color:#333e}}
    /*Janela-----------------------------------*/

h1 {
    color: #fff;
    text-align: center;
}

img {
    align-items: center;
    width: 250px;
}

#apoiadores {
    overflow:hidden;
    scrollbar-width: thin;
}

.card {
    width: 360px;
    height: 250px;
    padding: 20px;
    border-bottom: 1px solid #e0e0e0;
    align-items: center;
    margin: 10px;
    color: #fff;
    background: linear-gradient(to bottom, #444, #222);
    border: 1px solid #777;
    box-shadow: 0 0 10px #000;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    text-align: left;
    margin: 10px;
    display: inline-block;
    vertical-align: top;
    overflow: hidden;
    transition: all 0.1s ease;
    box-sizing: border-box
}

.card:hover {
    padding: 17px;
}

.fotoNome {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card img {
    border-radius: 50%;
    width: 100px;
    margin-right: 5px;
}

.card h3 {
    font-size: 26px;
    margin: 0;
}

.barraProgF {
    width: 100%;
    background-color: #e0e0e0;
    height: 10px;
    border-radius: 5px;
    margin: 8px 0;
}

.barraProgD {
    height: 100%;
    border-radius: 5px;
    background-color: #4caf50;
}

#Modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
}

.modal-content {
    background-color: #333;
    border: 1px solid #777;
    color: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 0 10px #0005;
    max-width: 400px;
    width: 100%;
    text-align: center;
    margin: auto;
    display: block;
    width: 300px
}
.modal-content img{width: 150px}
.modal{display:none;height:100%;
  position:fixed;padding-top:50px;
  z-index:1;width:100%;
  left:0;top:0;overflow:auto;
  background-color:#000}
.copiado{background-color:#080;color:#fff !important}
.closeE {position:absolute;top:50px;left:calc(50% - 6px);cursor:pointer;
    margin-top:4px;cursor:pointer;width:12px;height:12px;margin-right:20px;
    border-radius:50%;background:#FF5F57
}.logo{width:116px;cursor:pointer;position:absolute;top:10px;left:26px}