diff --git a/css/header.css b/css/header.css index 18da062..bcbe260 100644 --- a/css/header.css +++ b/css/header.css @@ -33,6 +33,60 @@ color: rgb(151, 12, 179); filter: drop-shadow(0px 4px 1px rgb(151, 12, 179)); } + +.menu-geral{ + display: grid; + gap: 20px; + grid-template-columns: 2fr 50px; + margin-right: 10px; +} +.modo-tela{ + margin-top: 10px; +} +.checkbox { + opacity: 0; + position: absolute; +} +.label { + background-color: #111; + border: 1px solid #67dd0a; + transition: 1s; + filter: drop-shadow(0px 2px 1px rgb(138, 217, 19)); + border-radius: 50px; + cursor: pointer; + display: flex; + justify-content: space-between; + align-items: center; + + padding: 5px; + position: relative; + height: 15px; + width: 40px; + transform: scale(1.5); +} +.label:hover{ + filter: drop-shadow(0px 2px 1px rgb(151, 12, 179)); +} +.label .ball { + background-color: #fff; + border-radius: 50%; + position: absolute; + top: 2px; + left: 2px; + height: 22px; + width: 22px; + transform: translateX(0px); + transition: transform 0.2s linear; +} +.checkbox:checked + .label .ball { + transform: translateX(24px); +} +.fa-moon { + color: #f1c40f; +} +.fa-sun { + color: #f39c12; +} @media (max-width: 800px) { .header{ flex-direction: column; @@ -46,6 +100,16 @@ margin-top: 40px; } } +@media (max-width: 450px){ + .menu-geral{ + grid-template-columns: 1fr; + margin-right: 0px; + } + .modo-tela{ + justify-self: end; + margin-right: 10px; + } +} @media (max-width: 350px){ .header-menu a{ padding: 10px 5px; diff --git a/css/style.css b/css/style.css index 83337fe..2074490 100644 --- a/css/style.css +++ b/css/style.css @@ -1,3 +1,4 @@ +/*cleancss -o css/style.min.css css/style.css --with-rebase*/ @import './animacao.css'; @import './global.css'; @import './header.css'; diff --git a/css/style.min.css b/css/style.min.css index bff9fdf..b029741 100644 --- a/css/style.min.css +++ b/css/style.min.css @@ -1,4 +1,4 @@ -.js .fadeInDown{transform:translate3d(0,-20px,0)}.js .fadeInUp{transform:translate3d(0,20px,0)}.js .fadeInRight{transform:translate3d(20px,0,0)}.js .fadeInLeft{transform:translate3d(-20px,0,0)}.js [data-anime]{opacity:0}.js .anime{opacity:1;transform:none;transition:transform .8s,opacity .8s}:root{--fundo-0:#000000;--fundo-1:#ffffff;--fundo-2:#141414;--fundo-3:#f5f5f5;--fundo-4:#efefef;--fonte-cor-1:#141414;--fonte-cor-2:#525252;--fonte-cor-3:#141414;--icone-link:url("../img/link-preto.svg") no-repeat center center;--logo:url("../img/marcaA.svg") no-repeat center center;--mix-blend-mode:screen}@media (prefers-color-scheme:dark){:root{--fundo-0:#ffffff;--fundo-1:#181a1b;--fundo-2:#0f1011;--fundo-3:#1e2021;--fundo-4:#4d4d4d;--fonte-cor-1:#cacaca;--fonte-cor-2:#b4aea4;--fonte-cor-3:#e8e6e3;--icone-link:url("../img/link-branco.svg") no-repeat center center;--logo:url("../img/marcaB.svg") no-repeat center center;--mix-blend-mode:darken}}*{margin:0;padding:0}html{scroll-behavior:smooth;background-color:var(--fundo-1)}body{font-family:"Fira Sans",Arial,sans-serif;color:#141414}ul{list-style:none}a{text-decoration:none;font-family:"Fira Sans",Arial,sans-serif}img{max-width:100%;height:auto;display:block}strong:hover{color:#67dd0a!important}.subtitulo{font-size:8rem;line-height:1;text-transform:uppercase;word-break:break-all;max-width:4ch}@media (max-width:800px){img[src^="./img/marcaA"]{margin-top:30px}.subtitulo{font-size:3rem;text-transform:capitalize;max-width:initial!important}}.experiencia,.footer{overflow:hidden}.js .js-scroll{opacity:0;transform:translate3d(-30px,0,0);transition:.3s}.js .js-scroll.tipo2{transform:translate3d(0,30px,0)}.js .js-scroll.tipo3{transform:translate3d(30px,0,0)}.js .js-scroll.ativo{opacity:1;transform:translate3d(0,0,0)}@media (max-width:600px){.js .footer-informacoes.js-scroll.tipo3{transform:translate3d(0,0,0);opacity:1}}.header{max-width:1200px;margin:0 auto;padding:40px 20px;display:flex;justify-content:space-between;align-items:center;background-color:var(--fundo-1)}.logo{width:150px;height:38px;background:var(--logo)}.header-menu{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.header-menu a{font-size:1.125rem;line-height:1.3;padding:10px 20px;color:var(--fonte-cor-1);display:block;background:var(--fundo-3);border-radius:.3rem;filter:drop-shadow(0px 4px 1px rgb(138, 217, 19));transition:1s}.header-menu a:hover{color:#970cb3;filter:drop-shadow(0px 4px 1px rgb(151, 12, 179))}@media (max-width:800px){.header{flex-direction:column;gap:40px;padding:10px}.header-menu a{padding:10px 10px}.logo{margin-top:40px}}@media (max-width:350px){.header-menu a{padding:10px 5px}}.introducao{max-width:1200px;margin:0 auto;padding:40px 20px;display:grid;grid-template-columns:1fr 2fr;gap:100px;align-items:center;background-color:var(--fundo-1);color:var(--fonte-cor-1)}.introducao img{border-radius:5%;transition:1s}.introducao h1{font-size:4.5rem;line-height:1.125;margin-bottom:30px;position:relative}.introducao h1::before{content:"";display:block;width:130px;height:100px;background:url("../img/detalhe.svg") no-repeat center;position:absolute;top:-15px;left:-40px;z-index:-1}.introducao p{font-size:1.5rem;color:var(--fonte-cor-2);padding-right:20px}.localizacaoPlaneta{position:relative}@keyframes seta{from{transform:translateY(-30%)}}.emotePlaneta{position:absolute;animation:seta .5s ease-in 0s infinite alternate}@media (max-width:1000px){.introducao h1{font-size:3rem}}@media (max-width:800px){.introducao{grid-template-columns:1fr 1fr;gap:40px}.introducao h1{font-size:2rem}.introducao h1::before{width:30px;height:10px;left:0}}@media (max-width:500px){.introducao{grid-template-columns:1fr}.introducao img{display:none}}.slide-container{max-width:1200px;margin:0 auto;padding:60px 20px;background-color:var(--fundo-1)}.slider{position:relative;overflow:hidden;height:120px;border-radius:20px}.slide-track{position:absolute;animation:scroll 10s linear infinite;display:flex}.slide-track:hover{animation-play-state:paused}.slide{height:100px;width:140px}@keyframes scroll{0%{transform:translateX(0)}100%{transform:translateX(calc(-140px * 10))}}@media (max-width:500px){.slide-container{padding:20px 20px}}.experiencia{max-width:1199.9px;padding:40px 20px;margin:0 auto;display:grid;grid-template-columns:1fr 2fr;gap:100px;background-color:var(--fundo-1);color:var(--fonte-cor-1)}.experiencia .subtitulo{color:#e0e0e0}.experiencia-texto{font-size:1.5rem;line-height:1.33;max-width:50ch;margin-bottom:60px;color:var(--fonte-cor-2)}.experiencia-texto strong{color:var(--fonte-cor-3)}.empresa{display:grid;gap:10px 20px;grid-template-columns:1fr 1fr;padding:20px;background:var(--fundo-3);position:relative;transition:1s}.empresa+.empresa{margin-top:20px}.empresa::before{content:"";display:block;width:4px;height:20px;background:linear-gradient(#b6f829,#67dd0a);position:absolute;top:20px;left:-4px}.empresa:hover::before{background:linear-gradient(#aa98a8,#980bb4)}.empresa-ano{position:absolute;top:22px;left:-100px;color:var(--fonte-cor-2);font-size:.875rem;width:80px;text-align:right}.empresa-titulo{font-size:1.125rem;line-height:1.1;font-weight:700}.empresa-texto{font-size:.875rem;line-height:1.4;color:var(--fonte-cor-2)}.empresa-habilidades{display:flex;flex-wrap:wrap;gap:10px;align-content:start}.empresa-habilidades li{font-size:.875rem;line-height:1.4;border-radius:4px;background:var(--fundo-1);padding:5px 10px;color:var(--fonte-cor-1)}.empresa-links{display:flex;flex-wrap:wrap}.empresa-links a{margin-top:3px;padding:5px 15px;text-align:center;position:relative;color:var(--fonte-cor-2)}.empresa-links a:hover{color:#980bb4}.empresa-links a::before{display:block;content:'';background:var(--icone-link);width:15px;height:15px;position:absolute;left:-3px;top:6px}.scroll-projetos{height:500px;overflow-y:scroll;padding-left:50px;border-top:3px solid var(--fundo-4);border-bottom:3px solid var(--fundo-4);border-radius:5px}.scroll-projetos::-webkit-scrollbar{width:15px}.scroll-projetos::-webkit-scrollbar-thumb{background-color:#67dd0a;border-left:4px solid var(--fundo-3);border-right:4px solid var(--fundo-3)}.scroll-projetos::-webkit-scrollbar-track{background-color:var(--fundo-3)}.container-subtitulo{position:relative}.banner{position:absolute;width:100%;height:100%;overflow:hidden;display:flex;justify-content:center;align-items:center}.banner video{position:absolute;top:0;left:0;max-width:280px;height:90%;object-fit:cover}.banner h2{position:absolute;height:91%;top:0;left:0;background:var(--fundo-1);color:var(--fundo-0)!important;mix-blend-mode:var(--mix-blend-mode)}.banner-b h2{background:#141414!important;color:#fff!important;mix-blend-mode:darken}.banner-b video{max-width:350px}@media (max-width:800px){.container-subtitulo{margin-bottom:50px}.banner{height:100vh}.banner video{display:none}.banner h2{height:auto}.banner-b h2{mix-blend-mode:normal}.experiencia{grid-template-columns:1fr;gap:40px}.experiencia .subtitulo{color:#141414}.experiencia-texto{font-size:1.25rem}.empresa-ano{position:initial;order:1;width:initial;text-align:left}.empresa-ano::before{content:"Ano: "}.scroll-projetos{padding-left:0}}@media (max-width:400px){.empresa{grid-template-columns:1fr}}.formacao{background:#141414;color:#fff;width:100%!important}.formacao-container{max-width:1200px;margin:0 auto;padding:40px 20px;margin:0 auto;display:grid;grid-template-columns:1fr 2fr;gap:100px;position:relative}.formacao .subtitulo{color:#000;max-width:5ch}.formacao-texto{font-size:1.5rem;line-height:1.33;max-width:40ch;margin-bottom:60px;color:#a3a3a3}.formacao-texto strong{color:#fff}.faculdade-lista{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:60px}.faculdade{flex:1;background:#000;padding:20px;border-radius:4px;display:flex;flex-direction:column}.faculdade-tipo{font-size:.875rem;text-transform:uppercase;color:#a3a3a3;margin-top:10px}.faculdade-curso{font-size:1.125rem;line-height:1.4;margin-bottom:40px;position:relative;flex:1}.faculdade-curso::before{content:"";display:block;width:4px;height:20px;background:linear-gradient(#b6f829,#67dd0a);position:absolute;left:-24px}.faculdade-curso:hover::before{background:linear-gradient(#aa98a8,#980bb4)}.faculdade-instituicao{font-size:1.125rem;color:#a3a3a3}.cursos{margin-bottom:60px}.formacao-extra h3{font-size:.875rem;line-height:1.4;color:#8f8f8f;text-transform:uppercase;margin-bottom:30px;position:relative}.formacao-extra h3::before{display:block;content:'';width:24px;height:24px;position:absolute;left:-32px;top:-4px}.cursos h3::before{background:url('../img/cursos.svg') no-repeat center center}.formacao-extra li{font-size:1.125rem;line-height:1.1;margin-bottom:20px}.formacao-extra span{color:#8f8f8f}.cursos li{display:flex;justify-content:space-between;align-items:center}.cursos a{color:#fff}.cursos a:hover{color:#67dd0a}.cursos a:hover::before{content:'→';display:inline-block;width:30px}.cursando{position:relative}.cursando img{position:absolute;display:inline-block;top:-5px}@media (max-width:370px){.cursando img{display:none}}@media (max-width:800px){.formacao-container{grid-template-columns:1fr;padding:60px 20px;gap:40px}.formacao .subtitulo{color:#fff}.formacao-texto{font-size:1.25rem}.formacao-extra h3::before{position:initial;margin-bottom:10px}.formacao-container::after{width:100px;background-size:cover}}.all-bubbles{display:grid;grid-template-rows:1fr 10rem auto;grid-template-areas:"main" "." "footer";overflow-x:hidden}.all-bubbles{background:var(--fundo-1)}.footer-bubbles{background:#000}.all-bubbles .footer-bubbles{--footer-background:#000;display:grid;position:relative;grid-area:footer;min-height:12rem}.all-bubbles .footer-bubbles .bubbles{position:absolute;top:0;left:0;right:0;height:1rem;background:var(--footer-background);filter:url("#blob")}.all-bubbles .footer-bubbles .bubbles .bubble{position:absolute;left:var(--position,50%);background:var(--footer-background);border-radius:100%;animation:bubble-size var(--time,4s) ease-in infinite var(--delay,0s),bubble-move var(--time,4s) ease-in infinite var(--delay,0s);transform:translate(-50%,100%)}@keyframes bubble-size{0%,75%{width:var(--size,4rem);height:var(--size,4rem)}100%{width:0;height:0}}@keyframes bubble-move{0%{bottom:-4rem}100%{bottom:var(--distance,10rem)}}@media (max-width:500px){.all-bubbles{display:none}}.footer{background-color:#000;padding:0 20px}.footer-container{display:grid;grid-template-columns:minmax(120px,1fr) minmax(200px,2fr) 1fr;gap:40px;padding-top:10px;padding-bottom:45px;justify-content:space-between;justify-items:center}.footer h3{color:#fff;margin-bottom:32px}.footer-contato ul{margin-bottom:32px;color:#b2b2b2}.footer-contato :is(a[href^=tel],a[href^=mailto],li[class^=ender],a[href^="https://www.google.com/maps/"]){position:relative;margin-left:24px}.footer-contato :is(a,li)::before{display:block;content:"";width:24px;height:24px;position:absolute;left:-32px;top:-4px}.footer-contato a[href^=tel]::before{background:url("../img/icones/telefone.svg") no-repeat center center}.footer-contato a[href^=mailto]::before{background:url("../img/icones/email.svg") no-repeat center center}.footer-contato li[class^=ender]::before{background:url("../img/icones/local.svg") no-repeat center center}.footer-contato a[href^="https://www.google.com/maps/"]::before{background:url("../img/icones/planeta-terra.svg") no-repeat center center}.footer-contato li:nth-child(3):after,.footer-contato li:nth-child(5):after{content:"";display:block;max-width:360px;height:2px;background:#9c9c9c;margin-top:16px}.footer-informacoes li{box-shadow:0 2px 1px #8ad913;display:flex}.footer-informacoes li:hover{box-shadow:0 3px 1px #9f0}.footer-informacoes li+li{margin-top:20px}.footer-informacoes a{border-radius:5px;padding:5px 30px;width:100%}.footer li{margin-bottom:16px}.footer-redes{display:flex;gap:15px;justify-content:center}.footer a{color:#b2b2b2}.footer a:hover{color:#67dd0a}.footer-copy{color:#ddd;grid-column:1/-1;margin-top:60px;text-align:center;position:relative;padding-bottom:50px}.footer-copy::before{content:"";display:block;width:90%;height:2px;left:5%;right:5%;background:#9c9c9c;position:absolute;top:-45px}.footer-copy a{color:#67dd0a}.footer-copy a:hover{color:#6fff00}.link-github{position:relative;padding-right:130px}.link-github img{position:absolute;margin-top:-1px;display:inline-block}.link-mit{position:relative;padding-right:85px}.link-mit img{position:absolute;display:inline-block;left:5px}@media (max-width:425px){.link-github{padding-right:0}.link-github img{display:none}}@media (max-width:770px){.footer h3{text-align:center}}@media (max-width:600px){.footer-container{grid-template-columns:1fr;margin-top:60px}.footer-informacoes ul{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.footer-informacoes li{text-align:center}.footer-informacoes li+li{margin-top:0}.footer-informacoes a{padding:5px 5px}}:root{--dur:3s;--arrowA:polygon( +.js .fadeInDown{transform:translate3d(0,-20px,0)}.js .fadeInUp{transform:translate3d(0,20px,0)}.js .fadeInRight{transform:translate3d(20px,0,0)}.js .fadeInLeft{transform:translate3d(-20px,0,0)}.js [data-anime]{opacity:0}.js .anime{opacity:1;transform:none;transition:transform .8s,opacity .8s}:root{--fundo-0:#000000;--fundo-1:#ffffff;--fundo-2:#141414;--fundo-3:#f5f5f5;--fundo-4:#efefef;--fonte-cor-1:#141414;--fonte-cor-2:#525252;--fonte-cor-3:#141414;--icone-link:url("../img/link-preto.svg") no-repeat center center;--logo:url("../img/marcaA.svg") no-repeat center center;--mix-blend-mode:screen}@media (prefers-color-scheme:dark){:root{--fundo-0:#ffffff;--fundo-1:#181a1b;--fundo-2:#0f1011;--fundo-3:#1e2021;--fundo-4:#4d4d4d;--fonte-cor-1:#cacaca;--fonte-cor-2:#b4aea4;--fonte-cor-3:#e8e6e3;--icone-link:url("../img/link-branco.svg") no-repeat center center;--logo:url("../img/marcaB.svg") no-repeat center center;--mix-blend-mode:darken}}*{margin:0;padding:0}html{scroll-behavior:smooth;background-color:var(--fundo-1)}body{font-family:"Fira Sans",Arial,sans-serif;color:#141414}ul{list-style:none}a{text-decoration:none;font-family:"Fira Sans",Arial,sans-serif}img{max-width:100%;height:auto;display:block}strong:hover{color:#67dd0a!important}.subtitulo{font-size:8rem;line-height:1;text-transform:uppercase;word-break:break-all;max-width:4ch}@media (max-width:800px){img[src^="./img/marcaA"]{margin-top:30px}.subtitulo{font-size:3rem;text-transform:capitalize;max-width:initial!important}}.experiencia,.footer{overflow:hidden}.js .js-scroll{opacity:0;transform:translate3d(-30px,0,0);transition:.3s}.js .js-scroll.tipo2{transform:translate3d(0,30px,0)}.js .js-scroll.tipo3{transform:translate3d(30px,0,0)}.js .js-scroll.ativo{opacity:1;transform:translate3d(0,0,0)}@media (max-width:600px){.js .footer-informacoes.js-scroll.tipo3{transform:translate3d(0,0,0);opacity:1}}.header{max-width:1200px;margin:0 auto;padding:40px 20px;display:flex;justify-content:space-between;align-items:center;background-color:var(--fundo-1)}.logo{width:150px;height:38px;background:var(--logo)}.header-menu{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.header-menu a{font-size:1.125rem;line-height:1.3;padding:10px 20px;color:var(--fonte-cor-1);display:block;background:var(--fundo-3);border-radius:.3rem;filter:drop-shadow(0px 4px 1px rgb(138, 217, 19));transition:1s}.header-menu a:hover{color:#970cb3;filter:drop-shadow(0px 4px 1px rgb(151, 12, 179))}.menu-geral{display:grid;gap:20px;grid-template-columns:2fr 50px;margin-right:10px}.modo-tela{margin-top:10px}.checkbox{opacity:0;position:absolute}.label{background-color:#111;border:1px solid #67dd0a;transition:1s;filter:drop-shadow(0px 2px 1px rgb(138, 217, 19));border-radius:50px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:5px;position:relative;height:15px;width:40px;transform:scale(1.5)}.label:hover{filter:drop-shadow(0px 2px 1px rgb(151, 12, 179))}.label .ball{background-color:#fff;border-radius:50%;position:absolute;top:2px;left:2px;height:22px;width:22px;transform:translateX(0);transition:transform .2s linear}.checkbox:checked+.label .ball{transform:translateX(24px)}.fa-moon{color:#f1c40f}.fa-sun{color:#f39c12}@media (max-width:800px){.header{flex-direction:column;gap:40px;padding:10px}.header-menu a{padding:10px 10px}.logo{margin-top:40px}}@media (max-width:450px){.menu-geral{grid-template-columns:1fr;margin-right:0}.modo-tela{justify-self:end;margin-right:10px}}@media (max-width:350px){.header-menu a{padding:10px 5px}}.introducao{max-width:1200px;margin:0 auto;padding:40px 20px;display:grid;grid-template-columns:1fr 2fr;gap:100px;align-items:center;background-color:var(--fundo-1);color:var(--fonte-cor-1)}.introducao img{border-radius:5%;transition:1s}.introducao h1{font-size:4.5rem;line-height:1.125;margin-bottom:30px;position:relative}.introducao h1::before{content:"";display:block;width:130px;height:100px;background:url("../img/detalhe.svg") no-repeat center;position:absolute;top:-15px;left:-40px;z-index:-1}.introducao p{font-size:1.5rem;color:var(--fonte-cor-2);padding-right:20px}.localizacaoPlaneta{position:relative}@keyframes seta{from{transform:translateY(-30%)}}.emotePlaneta{position:absolute;animation:seta .5s ease-in 0s infinite alternate}@media (max-width:1000px){.introducao h1{font-size:3rem}}@media (max-width:800px){.introducao{grid-template-columns:1fr 1fr;gap:40px}.introducao h1{font-size:2rem}.introducao h1::before{width:30px;height:10px;left:0}}@media (max-width:500px){.introducao{grid-template-columns:1fr}.introducao img{display:none}}.slide-container{max-width:1200px;margin:0 auto;padding:60px 20px;background-color:var(--fundo-1)}.slider{position:relative;overflow:hidden;height:120px;border-radius:20px}.slide-track{position:absolute;animation:scroll 10s linear infinite;display:flex}.slide-track:hover{animation-play-state:paused}.slide{height:100px;width:140px}@keyframes scroll{0%{transform:translateX(0)}100%{transform:translateX(calc(-140px * 10))}}@media (max-width:500px){.slide-container{padding:20px 20px}}.experiencia{max-width:1199.9px;padding:40px 20px;margin:0 auto;display:grid;grid-template-columns:1fr 2fr;gap:100px;background-color:var(--fundo-1);color:var(--fonte-cor-1)}.experiencia .subtitulo{color:#e0e0e0}.experiencia-texto{font-size:1.5rem;line-height:1.33;max-width:50ch;margin-bottom:60px;color:var(--fonte-cor-2)}.experiencia-texto strong{color:var(--fonte-cor-3)}.empresa{display:grid;gap:10px 20px;grid-template-columns:1fr 1fr;padding:20px;background:var(--fundo-3);position:relative;transition:1s}.empresa+.empresa{margin-top:20px}.empresa::before{content:"";display:block;width:4px;height:20px;background:linear-gradient(#b6f829,#67dd0a);position:absolute;top:20px;left:-4px}.empresa:hover::before{background:linear-gradient(#aa98a8,#980bb4)}.empresa-ano{position:absolute;top:22px;left:-100px;color:var(--fonte-cor-2);font-size:.875rem;width:80px;text-align:right}.empresa-titulo{font-size:1.125rem;line-height:1.1;font-weight:700}.empresa-texto{font-size:.875rem;line-height:1.4;color:var(--fonte-cor-2)}.empresa-habilidades{display:flex;flex-wrap:wrap;gap:10px;align-content:start}.empresa-habilidades li{font-size:.875rem;line-height:1.4;border-radius:4px;background:var(--fundo-1);padding:5px 10px;color:var(--fonte-cor-1)}.empresa-links{display:flex;flex-wrap:wrap}.empresa-links a{margin-top:3px;padding:5px 15px;text-align:center;position:relative;color:var(--fonte-cor-2)}.empresa-links a:hover{color:#980bb4}.empresa-links a::before{display:block;content:'';background:var(--icone-link);width:15px;height:15px;position:absolute;left:-3px;top:6px}.scroll-projetos{height:500px;overflow-y:scroll;padding-left:50px;border-top:3px solid var(--fundo-4);border-bottom:3px solid var(--fundo-4);border-radius:5px}.scroll-projetos::-webkit-scrollbar{width:15px}.scroll-projetos::-webkit-scrollbar-thumb{background-color:#67dd0a;border-left:4px solid var(--fundo-3);border-right:4px solid var(--fundo-3)}.scroll-projetos::-webkit-scrollbar-track{background-color:var(--fundo-3)}.container-subtitulo{position:relative}.banner{position:absolute;width:100%;height:100%;overflow:hidden;display:flex;justify-content:center;align-items:center}.banner video{position:absolute;top:0;left:0;max-width:280px;height:90%;object-fit:cover}.banner h2{position:absolute;height:91%;top:0;left:0;background:var(--fundo-1);color:var(--fundo-0)!important;mix-blend-mode:var(--mix-blend-mode)}.banner-b h2{background:#141414!important;color:#fff!important;mix-blend-mode:darken}.banner-b video{max-width:350px}@media (max-width:800px){.container-subtitulo{margin-bottom:50px}.banner{height:100vh}.banner video{display:none}.banner h2{height:auto}.banner-b h2{mix-blend-mode:normal}.experiencia{grid-template-columns:1fr;gap:40px}.experiencia .subtitulo{color:#141414}.experiencia-texto{font-size:1.25rem}.empresa-ano{position:initial;order:1;width:initial;text-align:left}.empresa-ano::before{content:"Ano: "}.scroll-projetos{padding-left:0}}@media (max-width:400px){.empresa{grid-template-columns:1fr}}.formacao{background:#141414;color:#fff;width:100%!important}.formacao-container{max-width:1200px;margin:0 auto;padding:40px 20px;margin:0 auto;display:grid;grid-template-columns:1fr 2fr;gap:100px;position:relative}.formacao .subtitulo{color:#000;max-width:5ch}.formacao-texto{font-size:1.5rem;line-height:1.33;max-width:40ch;margin-bottom:60px;color:#a3a3a3}.formacao-texto strong{color:#fff}.faculdade-lista{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:60px}.faculdade{flex:1;background:#000;padding:20px;border-radius:4px;display:flex;flex-direction:column}.faculdade-tipo{font-size:.875rem;text-transform:uppercase;color:#a3a3a3;margin-top:10px}.faculdade-curso{font-size:1.125rem;line-height:1.4;margin-bottom:40px;position:relative;flex:1}.faculdade-curso::before{content:"";display:block;width:4px;height:20px;background:linear-gradient(#b6f829,#67dd0a);position:absolute;left:-24px}.faculdade-curso:hover::before{background:linear-gradient(#aa98a8,#980bb4)}.faculdade-instituicao{font-size:1.125rem;color:#a3a3a3}.cursos{margin-bottom:60px}.formacao-extra h3{font-size:.875rem;line-height:1.4;color:#8f8f8f;text-transform:uppercase;margin-bottom:30px;position:relative}.formacao-extra h3::before{display:block;content:'';width:24px;height:24px;position:absolute;left:-32px;top:-4px}.cursos h3::before{background:url('../img/cursos.svg') no-repeat center center}.formacao-extra li{font-size:1.125rem;line-height:1.1;margin-bottom:20px}.formacao-extra span{color:#8f8f8f}.cursos li{display:flex;justify-content:space-between;align-items:center}.cursos a{color:#fff}.cursos a:hover{color:#67dd0a}.cursos a:hover::before{content:'→';display:inline-block;width:30px}.cursando{position:relative}.cursando img{position:absolute;display:inline-block;top:-5px}@media (max-width:370px){.cursando img{display:none}}@media (max-width:800px){.formacao-container{grid-template-columns:1fr;padding:60px 20px;gap:40px}.formacao .subtitulo{color:#fff}.formacao-texto{font-size:1.25rem}.formacao-extra h3::before{position:initial;margin-bottom:10px}.formacao-container::after{width:100px;background-size:cover}}.all-bubbles{display:grid;grid-template-rows:1fr 10rem auto;grid-template-areas:"main" "." "footer";overflow-x:hidden}.all-bubbles{background:var(--fundo-1)}.footer-bubbles{background:#000}.all-bubbles .footer-bubbles{--footer-background:#000;display:grid;position:relative;grid-area:footer;min-height:12rem}.all-bubbles .footer-bubbles .bubbles{position:absolute;top:0;left:0;right:0;height:1rem;background:var(--footer-background);filter:url("#blob")}.all-bubbles .footer-bubbles .bubbles .bubble{position:absolute;left:var(--position,50%);background:var(--footer-background);border-radius:100%;animation:bubble-size var(--time,4s) ease-in infinite var(--delay,0s),bubble-move var(--time,4s) ease-in infinite var(--delay,0s);transform:translate(-50%,100%)}@keyframes bubble-size{0%,75%{width:var(--size,4rem);height:var(--size,4rem)}100%{width:0;height:0}}@keyframes bubble-move{0%{bottom:-4rem}100%{bottom:var(--distance,10rem)}}@media (max-width:500px){.all-bubbles{display:none}}.footer{background-color:#000;padding:0 20px}.footer-container{display:grid;grid-template-columns:minmax(120px,1fr) minmax(200px,2fr) 1fr;gap:40px;padding-top:10px;padding-bottom:45px;justify-content:space-between;justify-items:center}.footer h3{color:#fff;margin-bottom:32px}.footer-contato ul{margin-bottom:32px;color:#b2b2b2}.footer-contato :is(a[href^=tel],a[href^=mailto],li[class^=ender],a[href^="https://www.google.com/maps/"]){position:relative;margin-left:24px}.footer-contato :is(a,li)::before{display:block;content:"";width:24px;height:24px;position:absolute;left:-32px;top:-4px}.footer-contato a[href^=tel]::before{background:url("../img/icones/telefone.svg") no-repeat center center}.footer-contato a[href^=mailto]::before{background:url("../img/icones/email.svg") no-repeat center center}.footer-contato li[class^=ender]::before{background:url("../img/icones/local.svg") no-repeat center center}.footer-contato a[href^="https://www.google.com/maps/"]::before{background:url("../img/icones/planeta-terra.svg") no-repeat center center}.footer-contato li:nth-child(3):after,.footer-contato li:nth-child(5):after{content:"";display:block;max-width:360px;height:2px;background:#9c9c9c;margin-top:16px}.footer-informacoes li{box-shadow:0 2px 1px #8ad913;display:flex}.footer-informacoes li:hover{box-shadow:0 3px 1px #9f0}.footer-informacoes li+li{margin-top:20px}.footer-informacoes a{border-radius:5px;padding:5px 30px;width:100%}.footer li{margin-bottom:16px}.footer-redes{display:flex;gap:15px;justify-content:center}.footer a{color:#b2b2b2}.footer a:hover{color:#67dd0a}.footer-copy{color:#ddd;grid-column:1/-1;margin-top:60px;text-align:center;position:relative;padding-bottom:50px}.footer-copy::before{content:"";display:block;width:90%;height:2px;left:5%;right:5%;background:#9c9c9c;position:absolute;top:-45px}.footer-copy a{color:#67dd0a}.footer-copy a:hover{color:#6fff00}.link-github{position:relative;padding-right:130px}.link-github img{position:absolute;margin-top:-1px;display:inline-block}.link-mit{position:relative;padding-right:85px}.link-mit img{position:absolute;display:inline-block;left:5px}@media (max-width:425px){.link-github{padding-right:0}.link-github img{display:none}}@media (max-width:770px){.footer h3{text-align:center}}@media (max-width:600px){.footer-container{grid-template-columns:1fr;margin-top:60px}.footer-informacoes ul{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.footer-informacoes li{text-align:center}.footer-informacoes li+li{margin-top:0}.footer-informacoes a{padding:5px 5px}}:root{--dur:3s;--arrowA:polygon( 33% 0%, 67% 0%, 67% 60%, diff --git a/index.html b/index.html index f77022a..6c51de7 100644 --- a/index.html +++ b/index.html @@ -16,7 +16,7 @@ @@ -313,6 +318,7 @@

Navegação

+