section.home{
    display: flex;
    align-items: center;
    padding: 4%;
    justify-content: space-around;
}

section.home .main-content{
    max-width: 650px;
}

section.home .main-content h2{
    font-size: 30px;
}

section.home p{
    font-size: 20px;
}

section.home input[type=button]{
    margin-top: 40px;
}

section.home .main-content .main-title .profile-title:after{
    color: #f17448;
    font-size: 34px;
    font-family: 'Clicker Script', sans-serif;
    content: ' Márcio Vinícius';
}

section.home .main-title h2:last-of-type:after{
    color: #f17448;
    animation: 8s conteudo ease-in-out infinite;
    content: '';
}

section.home .profile-img{
    position: relative;
    max-width: 98%;
    width: 345px;
    aspect-ratio: 345 / 440;
    background-image: url(../images/profile.png);
    background-size: cover;
}

section.home .profile-img:before{
    content: '';
    position: absolute;
    left: -40px;
    top: -40px;
    height: 70px;
    width: 70px;
    border-left: 10px solid #f17448;
    border-top: 10px solid #f17448;
}

section.home .profile-img:after{
    content: '';
    position: absolute;
    right: -40px;
    bottom: -40px;
    height: 70px;
    width: 70px;
    border-right: 10px solid #f17448;
    border-bottom: 10px solid #f17448;
}


@keyframes conteudo{
    0%{
        content: ' estudante';
        opacity: 1;
    }

    25%{
        opacity: 0;
    }

    50%{
        content: ' desenvolvedor';
        opacity: 1;
    }

    75%{
        opacity: 0;
    }

    100%{
        opacity: 1;
        content: ' estudante';
    }
}

@media (max-width: 1000px){
    section.home{
        height: max-content;
        flex-wrap: wrap;
    }

    section.home .main-content{
        margin: 60px auto;
    }

    section.home .profile-img{
        margin: 40px auto;
    }
}

@media (max-width: 500px){

    section.home .main-content{
        padding-right: 20px;
    }

    h2{
        font-size: 27px;
        margin-bottom: 20px;
    }

    p{
        font-size: 17px;
    }

    .profile-title:after{
        font-size: 27px;
    }

}

@media (max-width: 450px) {
    section.home .profile-img:before{
        left: -10px;
        top: -10px;
    }

    section.home .profile-img:after{
        right: -10px;
        bottom: -10px;
    }
}

@media (max-width: 300px) {
    section.home .profile-img{
        border-radius: 10px;
    }

    section.home .profile-img:before{
        left: -5px;
        top: -5px;
    }

    section.home .profile-img:after{
        right: -5px;
        bottom: -5px;
    }
}