*{
    padding:0;
    margin:0;
    box-sizing:border-box;
    font-family:"Lato"
}
::selection{
    background-color:#9F0C1D;
    color:#fff
}
ul,ol{
    list-style:none;
    margin:0;
    padding:0
}
a{
    text-decoration:none
}
img{
    max-width:100%;
    height:auto;
    display:block
}
p,h1,h2,h3,h4,h5,h6{
    margin:0
}
button,input{
    border:0;
    font-family:"Archivo"
}
button:focus,input:focus{
    border:0
}
body{
    font-family:"Archivo";
    background-color:#fff;
    overflow-x:hidden
}
html{
    scroll-behavior:smooth;
    font-size:62.5%
}
::-webkit-scrollbar{
    width:8px
}
::-webkit-scrollbar-track{
    background-color:#040405
}
::-webkit-scrollbar-thumb{
    background-color:#9F0C1D;
    border-radius:8px
}
header{
    padding:0px 30px;
    background:#040405;
    backdrop-filter:blur(24px);
    -webkit-backdrop-filter:blur(24px);
    border-bottom:1px solid #101013;
    z-index:999;
    width:100%;
    position:fixed;
    top:0;
    left:0
}
@media screen and (max-width: 992px){
    header{
        padding:0px 24px
    }
}
header .grid-layout nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    height:100px;
    padding:0px 8px
}
header .grid-layout nav img{
    width:100px;
}
header .grid-layout nav .nav-list{
    list-style:none;
    display:flex
}
header .grid-layout nav .nav-list li{
    margin-left:48px
}
@media screen and (max-width: 992px){
    header .grid-layout nav .nav-list li{
        margin-left:0px
    }
}
header .grid-layout nav .nav-list li a{
    color:#d8d8d8;
    position:relative;
    font-size:1.8rem
}
header .grid-layout nav .nav-list li a::after{
    content:"";
    position:absolute;
    width:100%;
    transform:scaleX(0);
    height:1px;
    bottom:-7px;
    left:0;
    background:linear-gradient(270deg, #9F0C1D 0%, #17161d 100%);
    transform-origin:bottom right;
    transition:transform .5s cubic-bezier(0.86, 0, 0.07, 1)
}
header .grid-layout nav .nav-list li a:hover::after{
    transform:scaleX(1);
    transform-origin:bottom left
}
header .grid-layout nav .nav-list li a:hover{
    color:#fff
}
.mobile-menu{
    display:none
}
.mobile-menu div{
    width:32px;
    height:1px;
    background-color:#fff;
    margin:8px;
    transition:.4s
}
.nav-list.active{
    visibility:initial;
    transition:1s all ease
}
@keyframes navLinkFade{
    from{
        opacity:0;
        transform:translateX(100px)
    }
    to{
        opacity:1;
        transform:translateX(0)
    }
}
.mobile-menu.active .line1{
    transform:rotate(-45deg) translate(-8px, 8px)
}
.mobile-menu.active .line2{
    opacity:0
}
.mobile-menu.active .line3{
    transform:rotate(45deg) translate(-5px, -5px)
}
@media screen and (max-width: 992px){
    body{
        overflow-x:hidden
    }
    .nav-list{
        text-align:center;
        position:absolute;
        top:100px;
        right:0;
        width:100vw;
        height:100vh;
        z-index:999;
        background-color:#09090b;
        flex-direction:column;
        padding-top:96px;
        visibility:hidden
    }
    header .grid-layout nav .nav-list li{
        opacity:0;
        margin-bottom:48px
    }
    header .grid-layout nav .nav-list li a{
        font-size:2.4rem
    }
    .mobile-menu{
        display:block
    }
}
#s-home{
    padding:0px 50px;
    background-color:#040405;
    position:relative
}
@media screen and (max-width: 992px){
    #s-home{
        padding:100px 20px
    }
}
#s-home .grid-layout #home{
    display:flex;
    align-items:center;
    min-height:90vh;
    padding:200px 0px;
    overflow:hidden;
    width:100%
}
@media screen and (max-width: 992px){
    #s-home .grid-layout #home{
        padding:0px
    }
}
#s-home .grid-layout #home #home-container-text{
    width:100%;
    flex-direction:column
}
@media screen and (max-width: 992px){
    #s-home .grid-layout #home #home-container-text{
        display:flex;
        flex-direction:column;
        align-items:center;
        width:100%;
        text-align:center;
        padding:0px
    }
}
#s-home .grid-layout #home #home-container-text h1{
    color:#fff;
    max-width:700px;
    line-height:140%;
    font-size:4rem;
    font-weight:500
}
@media screen and (max-width: 992px){
    #s-home .grid-layout #home #home-container-text h1{
        font-size:3.2rem
    }
}
#s-home .grid-layout #home #home-container-text h1 span{
    color:#9F0C1D
}
#s-home .grid-layout #home #home-container-text p{
    color:#d8d8d8;
    font-size:2rem;
    max-width:600px;
    margin-top:40px;
    font-weight:400;
    line-height:140%
}
#s-home .grid-layout #home #home-container-text a{
    background:#9F0C1D;
    color:#fff;
    backdrop-filter:blur(10px);
    padding:10px 16px;
    max-width:250px;
    display:flex;
    justify-content:center;
    align-items:center;
    transition:all .4s ease;
    margin-top:30px;
    margin-right: 30px;
    font-size:18px;
    font-weight:500
    
}

#s-home .buttons-social {
    display:flex;
    padding: 5px;
}
#s-home .grid-layout #home #home-container-text a:hover{
    padding:20px 45px;
    max-width:270px
}
#s-home .grid-layout #home #logo{
    position:absolute;
    right:100px;
    top:50%;
    transform:translate(0%, -50%)
}
@media screen and (max-width: 1200px){
    #s-home .grid-layout #home #logo{
        display:none
    }
}
#s-about{
    padding:96px 48px;
    background-color:#09090b
}
@media screen and (max-width: 992px){
    #s-about{
        padding:48px 24px
    }
}
#s-about .grid-layout #about{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap
}
#s-about .grid-layout #about-photo{
    width:50%;
    padding-right:100px;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
    transition:1s all ease
}
#s-about .grid-layout #about-photo #photo-iuricode{
    width:400px
}
#s-about .grid-layout #about-photo:hover{
    transform:scale(1.1)
}
#s-about .grid-layout #about-photo div{
    display:flex;
    justify-content:center;
    align-items:center
}
#s-about .grid-layout #about-photo div img{
    width:48px
}
#s-about .grid-layout #about-photo .about-figure{
    position:absolute;
    background-color:#040405;
    border-radius:4px;
    width:72px;
    height:72px
}
#s-about .grid-layout #about-photo .figure-one{
    top:40px;
    right:430px
}
#s-about .grid-layout #about-photo .figure-two{
    top:100px;
    right:150px
}
#s-about .grid-layout #about-photo .figure-three{
    top:250px;
    right:450px
}
#s-about .grid-layout #about-photo .icon-one{
    animation:icon-move 3s ease 2.9s infinite alternate
}
#s-about .grid-layout #about-photo .icon-two{
    animation:icon-move 3s ease 1.9s infinite alternate
}
#s-about .grid-layout #about-photo .icon-three{
    animation:icon-move 3s ease .6s infinite alternate
}
@keyframes icon-move{
    0%{
        transform:translate3d(0, 0, 0)
    }
    100%{
        transform:translate3d(10px, -40px, 0)
    }
}
#s-about .grid-layout #about-photo img{
    width:100%;
    max-width:400px
}
@media screen and (max-width: 1200px){
    #s-about .grid-layout #about-photo{
        display:none
    }
}
#s-about .grid-layout #about-text{
    width:50%
}
@media screen and (max-width: 1200px){
    #s-about .grid-layout #about-text{
        width:100%;
        display:flex;
        flex-direction:column;
        padding-left:0px
    }
}
#s-about .grid-layout #about-text h2{
    padding-bottom:24px;
    color:#fff;
    font-size:4rem;
    font-weight:500
}
#s-about .grid-layout #about-text h2 span{
    color:#9F0C1D
}
#s-about .grid-layout #about-text p{
    line-height:3.2rem;
    color:#d8d8d8;
    font-size:2rem;
    font-line-height:160%
}
#s-experience{
    background-color:#040405;
    color:#fff;
    padding:96px 48px
}
@media screen and (max-width: 992px){
    #s-experience{
        padding:48px 24px
    }
}
#s-experience .grid-layout h2{
    padding-bottom:24px;
    color:#fff;
    font-size:4rem;
    font-weight:500
}
#s-experience .grid-layout h2 span{
    color:#9F0C1D
}
#s-experience .grid-layout #experience{
    margin-top:32px;
    display:flex;
    gap:40px
}
@media screen and (max-width: 1200px){
    #s-experience .grid-layout #experience{
        flex-wrap:wrap
    }
}
#s-experience .grid-layout #experience .option-experience{
    display:flex;
    width:25%;
    flex-direction:column
}
@media screen and (max-width: 1200px){
    #s-experience .grid-layout #experience .option-experience{
        width:100%
    }
}
#s-experience .grid-layout #experience .option-experience .activeExperience{
    border-left:4px solid #9F0C1D;
    color:#9F0C1D
}
#s-experience .grid-layout #experience .option-experience>div{
    padding:24px 32px;
    text-align:left;
    background-color:#09090b;
    border-left:4px solid #040405
}
#s-experience .grid-layout #experience .option-experience>div:hover{
    cursor:pointer
}
#s-experience .grid-layout #experience .option-experience>div h3{
    font-size:1.8rem;
    font-weight:400
}
#s-experience .grid-layout #experience .text-experience{
    width:75%
}
@media screen and (max-width: 1200px){
    #s-experience .grid-layout #experience .text-experience{
        width:100%
    }
}
#s-experience .grid-layout #experience .text-experience>div{
    display:flex;
    align-items:center;
    justify-content:space-between
}
@media screen and (max-width: 1200px){
    #s-experience .grid-layout #experience .text-experience>div{
        flex-wrap:wrap;
        gap:32px
    }
}
#s-experience .grid-layout #experience .text-experience>div h4{
    font-size:2.4rem;
    font-weight:400
}
#s-experience .grid-layout #experience .text-experience>div p{
    font-size:1.8rem;
    color:#d8d8d8
}
#s-experience .grid-layout #experience .text-experience h5{
    font-size:1.8rem;
    margin:32px 0px;
    font-weight:400;
    color:#9F0C1D
}
#s-experience .grid-layout #experience .text-experience p{
    font-size:1.8rem;
    line-height:160%;
    color:#d8d8d8
}
#s-projects{
    padding:96px 48px;
    text-align:center;
    background-color:#09090b
}
@media screen and (max-width: 992px){
    #s-projects{
        padding:48px 24px
    }
}
#s-projects .grid-layout h2{
    padding-bottom:24px;
    color:#fff;
    font-size:4rem;
    font-weight:500
}
#s-projects .grid-layout h2 span{
    color:#9F0C1D
}
#s-projects .grid-layout #projects{
    margin:24px 0px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    text-align:left
}
#s-projects .grid-layout #projects .teslabank{
    border:1px solid #e51d37
}
#s-projects .grid-layout #projects .teslabank:hover{
    border:1px solid #e51d37
}
#s-projects .grid-layout #projects .naped{
    border:1px solid #00a3ff
}
#s-projects .grid-layout #projects .naped:hover{
    border:1px solid #00a3ff
}
#s-projects .grid-layout #projects .pokedex{
    border:1px solid #5856d6
}
#s-projects .grid-layout #projects .pokedex:hover{
    border:1px solid #5856d6
}
#s-projects .grid-layout #projects>article{
    background-color:#040405;
    height:auto;
    padding:32px;
    margin:8px;
    flex-basis:calc(33% - 20px);
    flex-grow:1;
    border:1px solid #040405;
    transition:1s all ease;
    min-height:275px
}
#s-projects .grid-layout #projects>article:hover{
    border:1px solid #9F0C1D
}
@media screen and (max-width: 1200px){
    #s-projects .grid-layout #projects>article{
        flex-basis:calc(50% - 20px)
    }
}
@media screen and (max-width: 768px){
    #s-projects .grid-layout #projects>article{
        flex-basis:calc(100% - 20px)
    }
}
#s-projects .grid-layout #projects>article h3{
    color:#fff;
    font-size:2.4rem;
    font-weight:500
}
#s-projects .grid-layout #projects>article p{
    line-height:24px;
    margin:24px 0px;
    color:#d8d8d8;
    line-height:3.2rem;
    font-size:1.8rem
}
#s-projects .grid-layout #teslabank{
    color:#e51d37
}
#s-projects .grid-layout #teslabank::after{
    background:linear-gradient(270deg, #e51d37 0%, #17161d 100%)
}
#s-projects .grid-layout #naped{
    color:#00a3ff
}
#s-projects .grid-layout #naped::after{
    background:linear-gradient(270deg, #00a3ff 0%, #17161d 100%)
}
#s-projects .grid-layout #pokedex{
    color:#5856d6
}
#s-projects .grid-layout #pokedex::after{
    background:linear-gradient(270deg, #5856d6 0%, #17161d 100%)
}
#s-projects .grid-layout a{
    color:#9F0C1D;
    position:relative;
    font-size:1.8rem;
    font-weight:400
}
#s-projects .grid-layout a::after{
    content:"";
    position:absolute;
    width:100%;
    transform:scaleX(0);
    height:1px;
    bottom:-7px;
    left:0;
    background:linear-gradient(270deg, #9F0C1D 0%, #17161d 100%);
    transform-origin:bottom right;
    transition:transform .5s cubic-bezier(0.86, 0, 0.07, 1)
}
#s-projects .grid-layout a:hover::after{
    transform:scaleX(1);
    transform-origin:bottom left
}
#s-projects .grid-layout a::after{
    content:"";
    position:absolute;
    width:100%;
    transform:scaleX(0);
    height:1px;
    bottom:-7px;
    left:0;
    transform-origin:bottom right;
    transition:transform .5s cubic-bezier(0.86, 0, 0.07, 1)
}
#s-projects .grid-layout a:hover::after{
    transform:scaleX(1);
    transform-origin:bottom left
}
#s-services{
    padding:96px 48px;
    background-color:#040405
}
@media screen and (max-width: 992px){
    #s-services{
        padding:48px 24px
    }
}
#s-services .grid-layout h2{
    text-align:center;
    padding-bottom:24px;
    color:#fff;
    font-size:4rem;
    font-weight:500
}
#s-services .grid-layout h2 span{
    color:#9F0C1D
}
#s-services .grid-layout #services{
    display:flex;
    height:auto;
    flex-wrap:wrap;
    margin:24px 0px
}
#s-services .grid-layout #services article{
    background-color:#09090b;
    height:auto;
    padding:32px;
    margin:8px;
    flex-basis:calc(33% - 20px);
    flex-grow:1;
    border:1px solid #040405;
    transition:1s all ease
}
#s-services .grid-layout #services article:hover{
    border:1px solid #9F0C1D
}
@media screen and (max-width: 1200px){
    #s-services .grid-layout #services article{
        flex-basis:calc(50% - 20px)
    }
}
@media screen and (max-width: 768px){
    #s-services .grid-layout #services article{
        flex-basis:calc(100% - 20px)
    }
}
#s-services .grid-layout #services article div{
    height:90px
}
#s-services .grid-layout #services article div img{
    width:70px
}
#s-services .grid-layout #services article h3{
    padding:24px 0px;
    color:#fff;
    font-size:2.4rem;
    font-weight:500
}
#s-services .grid-layout #services article p{
    line-height:3.2rem;
    color:#d8d8d8;
    font-size:1.8rem
}
#s-skills{
    padding:96px 48px;
    background-color:#09090b;
    padding-bottom:32px
}
@media screen and (max-width: 992px){
    #s-skills{
        padding:48px 24px
    }
}
#s-skills .grid-layout #skills{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    height:auto;
    padding:8px
}
#s-skills .grid-layout #skills div,#s-skills .grid-layout #skills article{
    width:50%
}
@media screen and (max-width: 1200px){
    #s-skills .grid-layout #skills div,#s-skills .grid-layout #skills article{
        width:100%
    }
}
#s-skills .grid-layout #skills #skills-text{
    min-height:300px
}
#s-skills .grid-layout #skills #skills-text h2{
    margin-bottom:32px;
    color:#fff;
    font-size:3.2rem;
    font-weight:500
}
#s-skills .grid-layout #skills #skills-text h2 span{
    color:#9F0C1D
}
#s-skills .grid-layout #skills #skills-text .changeDescription{
    transition:2s all ease
}
#s-skills .grid-layout #skills #skills-text p{
    max-width:500px;
    line-height:3.2rem;
    color:#d8d8d8;
    font-size:1.8rem
}
#s-skills .grid-layout #skills #skills-cards{
    display:flex;
    flex-wrap:wrap;
    gap:24px
}
@media screen and (max-width: 1200px){
    #s-skills .grid-layout #skills #skills-cards{
        margin-top:48px
    }
}
#s-skills .grid-layout #skills #skills-cards article{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    justify-content:center;
    width:20%;
    flex-grow:1;
    height:130px;
    background-color:#040405;
    position:relative;
    border:1px solid #040405;
    transition:1s all ease
}
#s-skills .grid-layout #skills #skills-cards article:hover{
    border:1px solid #9F0C1D
}
#s-skills .grid-layout #skills #skills-cards article:hover .skills-cards-name,#s-skills .grid-layout #skills #skills-cards article:hover .skills-cards-name-low,#s-skills .grid-layout #skills #skills-cards article:hover .skills-cards-name-high{
    display:block;
    text-align:center
}
@media screen and (max-width: 768px){
    #s-skills .grid-layout #skills #skills-cards article{
        width:40%;
        margin:20px 0px
    }
}
#s-skills .grid-layout #skills #skills-cards article .skills-cards-name,#s-skills .grid-layout #skills #skills-cards article .skills-cards-name-low,#s-skills .grid-layout #skills #skills-cards article .skills-cards-name-high{
    left:50%;
    height:auto;
    position:absolute;
    padding:5px;
    transform:translate(-50%, 0%);
    background-color:#040405;
    width:125px;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    display:none;
    font-size:1.8rem
}
#s-skills .grid-layout #skills #skills-cards article .skills-cards-name-high{
    top:-50px
}
#s-skills .grid-layout #skills #skills-cards article .skills-cards-name-low{
    bottom:-50px
}
#s-skills .grid-layout #skills #skills-cards article .aumento-hover{
    bottom:-75px
}
#s-skills .grid-layout #skills #skills-cards article .skills-icons{
    width:60px
}
footer{
    text-align:center;
    margin-top:72px
}
footer .grid-layout{
    border-top:1px solid rgba(114,114,126,.2);
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    text-align:center;
    width:100%;
    padding:8px
}
@media screen and (max-width: 768px){
    footer .grid-layout{
        justify-content:center
    }
}
footer .grid-layout #direitos-autorais{
    margin-top:24px
}
footer .grid-layout p{
    color:#d8d8d8;
    text-align:center;
    font-size:1.8rem
}
footer .grid-layout div{
    margin-top:24px;
    display:flex;
    align-items:center
}
footer .grid-layout div img{
    margin-left:8px
}
@media screen and (max-width: 768px){
    footer .grid-layout div{
        width:100%;
        justify-content:center
    }
}
.typewriter:after{
    content:"|";
    opacity:1;
    animation:blink 1s infinite;
    color:#9F0C1D
}
@keyframes blink{
    0%,100%{
        opacity:1
    }
    50%{
        opacity:0
    }
}
.grid-layout{
    max-width:1140px;
    margin:0 auto
}
.image {
    opacity: 1;
    display: block;
    width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
  }
  
  .middle {
    transition: opacity .2s ease-in-out;
    opacity: 0;
  }
  
  .container {
    position: relative;
    width: 70%;
  }
  .container:hover .image {
    opacity: 0.5;
  }
  
  .container:hover .middle {
    opacity: 0.8;
  }

  .middle {
	position: relative;
	max-width: fit-content;
	background-color: #fff;
    top: 100px;
    left: 100px;
	padding: 1.125em 1.5em;
	font-size: 1.25em;
	border-radius: 1rem;
  box-shadow:	0 0.125rem 0.5rem rgba(0, 0, 0, .3), 0 0.0625rem 0.125rem rgba(0, 0, 0, .2);
    }

.middle::before {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	bottom: 100%;
	left: 1.5em; 
	border: .75rem solid transparent;
	border-top: none;
	border-bottom-color: #fff;
	filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, .1));
}

body {
	background: #333;
}

.mouse_scroll {
    position: absolute;
    right: 15%;
    bottom: 50%;
	margin: 0 auto;
	width: 24px;
	height: 100px;
}


.m_scroll_arrows
{
  display: block;
  width: 5px;
  height: 5px;
  -ms-transform: rotate(45deg); /* IE 9 */
  -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  transform: rotate(45deg);
   
  border-right: 2px solid white;
  border-bottom: 2px solid white;
  margin: 0 0 3px 4px;
  
  width: 16px;
  height: 16px;
}


.unu
{
  margin-top: 1px;
}

.unu, .doi, .trei
{
    -webkit-animation: mouse-scroll 1s infinite;
    -moz-animation: mouse-scroll 1s infinite;
    animation: mouse-scroll 1s infinite;
  
}

.unu
{
  -webkit-animation-delay: .1s;
  -moz-animation-delay: .1s;
  -webkit-animation-direction: alternate;
  
  animation-direction: alternate;
  animation-delay: alternate;
}

.doi
{
  -webkit-animation-delay: .2s;
  -moz-animation-delay: .2s;
  -webkit-animation-direction: alternate;
  
  animation-delay: .2s;
  animation-direction: alternate;
  
  margin-top: -6px;
}

.trei
{
  -webkit-animation-delay: .3s;
  -moz-animation-delay: .3s;
  -webkit-animation-direction: alternate;
  
  animation-delay: .3s;
  animation-direction: alternate;
  
  
  margin-top: -6px;
}

.mouse {
  height: 42px;
  width: 24px;
  border-radius: 14px;
  transform: none;
  border: 2px solid white;
  top: 170px;
}

.wheel {
  height: 5px;
  width: 2px;
  display: block;
  margin: 5px auto;
  background: white;
  position: relative;
  
  height: 4px;
  width: 4px;
  border: 2px solid #fff;
  -webkit-border-radius: 8px;
          border-radius: 8px;
}

.wheel {
  -webkit-animation: mouse-wheel 0.6s linear infinite;
  -moz-animation: mouse-wheel 0.6s linear infinite;
  animation: mouse-wheel 0.6s linear infinite;
}

@-webkit-keyframes mouse-wheel{
   0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
  }
}
@-moz-keyframes mouse-wheel {
  0% { top: 1px; }
  25% { top: 2px; }
  50% { top: 3px;}
  75% { top: 2px;}
  100% { top: 1px;}
}
@-o-keyframes mouse-wheel {

   0% { top: 1px; }
  25% { top: 2px; }
  50% { top: 3px;}
  75% { top: 2px;}
  100% { top: 1px;}
}
@keyframes mouse-wheel {

   0% { top: 1px; }
  25% { top: 2px; }
  50% { top: 3px;}
  75% { top: 2px;}
  100% { top: 1px;}
}

@-webkit-keyframes mouse-scroll {

  0%   { opacity: 0;}
  50%  { opacity: .5;}
  100% { opacity: 1;}
}
@-moz-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@-o-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}


/*# sourceMappingURL=style.css.map */