html{
    scroll-behavior: smooth;
}


.neon-nombre{
    text-shadow: 
        0 0 5px white,
        0 0 7px white,
        0 0 9px blue,
        0 0 11px blue,
        0 0 13px blue;
    animation: neonway infinite 3s alternate;
}
@keyframes neonway{
    from {
        opacity: 0.7;
        text-shadow: 
        0 0 5px white,
        0 0 7px white,
        0 0 9px white,
        0 0 11px blue,
        0 0 13px blue;
    }
    to{
        opacity: 1;
        text-shadow: 
        0 0 7px white,
        0 0 9px white,
        0 0 11px blue,
        0 0 12px blue,
        0 0 15px blue
    }
}

.bg-lines{
    background: linear-gradient(dimgrey, grey);
}

.bg-nav{
    background-color: rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px); /* Desenfoque de 10px */
    border-radius: 10px;
}

.nav-link{
    color: black !important;
    border-radius: 50px !important;
}

.typing{
    
    display: block;
    white-space: nowrap;
    border-right: 4px solid gray;
    width: 24ch;
    animation: typing 2s steps(24), blink .5s infinite step-end alternate;
    overflow: hidden;
}

@keyframes typing {
    from{width: 0;}
}

@keyframes blink{
    50%{border-color: transparent;}
}

.html{
    filter: drop-shadow(6px 7px 4px  orange);
}

.text-gray{
    color: darkgray;
}

.css{
    filter: drop-shadow(6px 7px 4px cornflowerblue);
}

.javascript{
    filter: drop-shadow(6px 3px 4px yellow);
}

.bootstrap{
    filter: drop-shadow(6px 7px 4px rebeccapurple);
}

.tec-card{
    background-color:dimgrey !important;
}

.remarcado{
    text-decoration: underline;
    font-size: 5px;
}

.header-tec{
    text-shadow: 
        0 0 7px black,
        0 0 10px gray,
        0 0 21px black,
        0 0 42px gray,
        0 0 44px black,
        0 0 88px black,
        0 0 16px black,
        0 0 16px black;
    animation: neonheader infinite 2s alternate;
    
}

@keyframes neonheader{
    0%{
        text-shadow: 
        0 0 7px black,
        0 0 9px gray,
        0 0 11px black,
        0 0 13px gray;
    }
    100%{
        text-shadow: 
        0 0 9px black,
        0 0 9px black,
        0 0 13px black,
        0 0 13px gray;
    }
}

.tecnologias-card{
    outline: 2px solid gray;
    outline-offset: 1px;
}

.tecnologias-card:hover{
    outline: 6px solid gray;
    outline-offset: -3px;
    transform: translate(6px, -10px)!important;
    transition: 0.2s all !important;
    
}



.was-validated .form-control:invalid{
    border: solid !important;
    border-color: rebeccapurple !important;
}

.invalid-feedback{
    color: rebeccapurple !important;
}

.valid-feedback{
    color: cornflowerblue !important;
}

.was-validated .form-control:valid{
    border: solid cornflowerblue !important;
}

.btn-submit{
    background-color: darkcyan !important;
}

.btn-submit:hover{
    background-color: #007878 !important;
    transform: scale(1.10) !important;
}

.btn-submit:active{
   background-color: #006666 !important;
}


.tecnologias img{
    width: 90px;
    text-align: center;
}

.bg-red{
    background-color: #7E0506 !important;
}

.bg-bluff{
    background-color: #015301 !important;
}

.btn-redbluff{
    color: white !important;
    background-color: #7E0506 !important;
}

.btn-redbluff:hover{
    background-color: #015301 !important;
}

.btn-redbluff:active{
    background-color: #014701 !important;
    color: gray !important;
}

.card-soon{
    background-color:darkslategrey !important;
}

.bg-card{
    background-color:darkgray
}

.card-project:hover{
    outline: 2px solid gray;
    transform: scale(1.02)!important;
    transition: all 0.2s !important;
}

.social-media-icon{
    font-size: 30px;
    color: darkgrey;
    display: inline-block
}
.social-media-icon:hover{
    transform: scale(1.5);
    color:gray;
    transition: all 0.5s;
}

.social-media-icon:active{
    color: darkgray;
}

.text-footer{
    color: darkgrey;
}