@media (min-width: 600px) and (max-width: 1024px)  { 

.nav-bar {
    font-size: 2rem;
}
.sou-bryan {
   font-size: 0.7rem;
   margin-left: -53%;
}
.front-end {
    font-size: 3rem;
    margin-left: 20%;
}
.developer {
    font-size: 5rem;
    margin-top: -20px;
    margin-left: -3%;
}
.wave {
    margin-left: 15%;
}
.oi {
    font-size: 0.7rem;
    margin-left: -73%;
}
.info-1 {
    font-size: 0.7rem;
    transform: translateX(-150px);
    
}
.info-2 {
   font-size: 0.7rem;
   margin-left: -20%;
}
#btn2, img {
    width: 50%;
    height: auto;
    margin-left: -300%;
    max-width: 35px;
    max-height: 35px;
    display: block;
    margin: 0 auto;
    margin-top: 140%;
    margin-left: -210%;
}
.nav-link {
   display: none;
}
.slack1{
    display: none;
}
.cardBryan{
    margin-top: 60%;
    max-width: 600px;
}
#sobre {
   width: 85%;
   height: 11%;
}
.cardBryan img {
    position: static;
    width: 100%;
    height: auto;
    margin-left: 5%;
    max-width:150px;
    max-height: 400px;
    margin-top: 0%;
}
#paragrafo {
    font-size: 12px;
    text-align: justify;
    text-indent: 30px;
    max-width: 600px;
    margin-left: 23px;
    width: 90%;
}

.card {
    margin-top: 50%;
}
#Projetos {
    width: 70%;
    margin-bottom: 180px;
}
.card img {
    width: 100%;
    max-height: 300px;
}
.card2 img {
    width: 100%;
    max-height: 300px;
}
.card2 {
    margin-top: 10%;
    margin-left: 19%;
}
.card3 {
    margin-left: 19%;
}
.card3 img {
    width: 100%;
    max-height: 290px;
}
.icon-item img {
  align-items: center;
  margin: 10px;
}

#Projetosh1 {
  display: flex;
  position: static;
  font-family: sans-serif;
  color: #fcfcfca0;
  margin-left: 40%;
 
}
.box {
    margin-left: 12%;
}

.scroll-down {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 3rem;
    animation: bounce 0.9s infinite;
    color: #fbfbfb;
    opacity: 0.8;
}
@keyframes bounce {
0%, 100% {
    transform: translateX(-50%) translateY(0);
} 50% {
    transform: translateX(-50%) translateY(10px);
}
}
}


@media (max-width: 600px) {

.nav-bar {
    font-size: 2rem;
}
.sou-bryan {
   font-size: 0.6rem;
   margin-left: -76%;
}
.front-end {
    font-size: 2rem;
    margin-left: 9%;
    margin-top: 10%;
}
.developer {
    font-size: 3rem;
    margin-top: -15px;
    margin-left: -51%;
}
.wave {
    margin-left: 4%;
}
.oi {
    font-size: 0.6rem;
    margin-left: -95%;
}
.info-1 {
    font-size: 0.5rem;
    transform: translateX(-390px);
    
}
.info-2 {
   font-size: 0.5rem;
   margin-left: -70%;
}
#btn2, img {
    width: 50%;
    height: auto;
    margin-left: -300%;
    max-width: 20px;
    max-height: 20px;
    display: flex;
    margin: 0 auto;
    margin-top: 440%;
    margin-left: -1099%;
    
}
.nav-link {
   display: none;
}
.slack1{
    display: none;
}
.cardBryan{
    margin-top: 150%;
    max-width: 700px;
}
#sobre {
   width: 85%;
   height: 18%;
}
.cardBryan img {
    position: static;
    width: 100%;
    height: auto;
    margin-left: 25%;
    max-width:150px;
    max-height: 150px;
    margin-top: -100%;
}

#paragrafo {
    position: static;
    font-size: 12px;
    text-align: justify;
    text-indent: 80px;
    max-width: 600px;
    margin-top: 105%;
    margin-left: -90%;
    width: 259px;
    height: 1px;
}
.cardBryan h3 {
    position: static;
    margin-top: -130%;
    margin-left: -180%;
}
.card {
    margin-top: 100%;
}
#Projetos {
    position: static;
    width: 90%;
    margin-bottom: 180px;
    margin-left: 6%;
}
.card img {
    width: 100%;
    max-height: 300px;
    margin-top: 10px;
}
.card2 img {
    width: 100%;
    max-height: 300px;
    margin-top: 10px;
}

.card3 img {
    width: 100%;
    max-height: 290px;
    margin-top: 10px;
}
.buttons  {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 10px;
}


.icon-item img {
  align-items: center;
  margin: 20px;
}

#Projetosh1 {
  display: flex;
  position:relative;
  font-family: sans-serif;
  color: #fcfcfcde;
  margin-left: 34%;
  margin-top: 90%;
 
}
.box {
    margin-left: 12%;
}

.scroll-down {
    position: absolute;
    bottom: 140px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 3rem;
    animation: bounce 0.9s infinite;
    color: #fbfbfb;
    opacity: 0.8;
   
}
@keyframes bounce {
0%, 100% {
    transform: translateX(-50%) translateY(0);
} 50% {
    transform: translateX(-50%) translateY(10px);
}
}
}
.contact-card {
   margin-left: 12%;
}