html, body{
  width: 100%;
}

.projeto img{
  display: none;
}
.fade-in-up {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1s ease-out, transform 1s ease-out;
}

.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}


.projeto div{
  margin-top: 5rem;
  margin-left: -5rem;
}

.projeto h1{
  color: rgba(251, 108, 4, 0.88);
margin-left: 2.5rem;
text-align: center;
/* text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); */
font-family: "Source Sans 3", sans-serif;
font-size: 50px;
font-style: normal;
font-weight: 600;
}

.spanText{
  color: #3F3F3F;
font-family: "Source Sans 3", sans-serif;
font-size: 44px;
font-style: normal;
font-weight: 300;
line-height: normal;
}

.spanText2{
  color: #3F3F3F;
font-family: "Source Sans 3", sans-serif;
font-size: 44px;
font-style: normal;
font-weight: 600;
line-height: normal;
}

.projeto p{
  color: #000;
text-align: left;
/* text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); */
font-family: "Source Sans 3", sans-serif;
font-size: 21px;
font-style: normal;
font-weight: 400;
line-height: normal;
width: 450px;
padding-left: 6rem;
padding-top: 45px;
}


.objetivo{
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* align-items: center; */
  margin: 0 auto;
  width: 450px;
   margin-top: 3rem;
 
  
}

.objetivoTitle{
  color: #FB6C04;
font-family: "Source Sans 3", sans-serif;
font-size: 30px;
font-style: normal;
font-weight: 700;
line-height: normal;
padding-left: 2rem;
}

.objetivoParag{
  color: #1E1E1E;
font-family: "Source Sans 3", sans-serif;
font-size: 21px;
font-style: normal;
font-weight: 400;
line-height: normal;
width: 350px;
text-align: left;
padding-left: 2rem;

}

.objetivo ul li{
  list-style: none;
  margin-left: 2rem;
  width: 350px;
  color: #1E1E1E;
font-family: "Source Sans 3", sans-serif;
font-size: 21px;
font-style: normal;
font-weight: 400;
line-height: normal;

}

.objetivo ul li:last-child{
  padding-top: 1rem;
  font-family:"Source Sans 3", sans-serif;
  font-size: 21px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  
}

.objetivo div{
  padding-top: 2rem;
}

.objetivo div:last-child{
  padding-bottom: 2rem;
}

#conclusao{
  width: 390px;
}

.imgDesk{
  display: none;
}

.imgMb{
  display: flex;
  margin:  0 auto;
}


@media screen and (max-width:425px) {

  .projeto img{
    display: none;
  }

  .projeto div{
    width: 100%;
    margin-left: 0;
   
  }

  .projeto p{
    width: 100% !important;
    padding: 2em;
  }

}

@media screen and (min-width:426px) and (max-width:768px){

  .projeto img{
    display: none;
  }

 .projeto{
  height: 761px;
    display: flex;
    justify-content: center;
    width: 100%;
    padding-top: 2rem;
 }

 .projeto div{
  margin-top: 0;
  margin-left: -2rem;
}

 .projeto h1, .spanText, .spanText2{
  width: 100%;
  padding-right: 0.5em;
 }
  
 .projeto p{
  font-size: 20px;
  width: 95%;
  padding-left: 4rem;
 }

 .objetivo{
  width:100%;
    margin-top: 3rem;
 }

 .objetivoTitle {
  width: 100%;
 }

 .objetivoParag, .objetivo ul li{
  width: 90%;
 }

 #conclusao{
  width: 100%;
 }

}




/*PC telas pequenas*/
@media screen and (min-width:769px) and (max-width:1440px){
  .projeto{
    background-image: url('assets/vetor1.png');
    background-repeat: no-repeat;
    background-position: center right;
    height: 761px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    
  }

  .projeto img{
    display: flex;
    width: 238px;
  height: 305px;
  
  }
  
 .projeto div{
  padding-bottom: 2rem;
 }

 .projeto h1, .spanText, .spanText2{
  width: 100%;
 }
  
 .projeto p{
  font-size: 20px;
  width: 900px;
 }

 .objetivo{
  width:100%;
 }

 .objetivoTitle, .objetivoParag, .objetivo ul li{
  width: 100%;
 }

 #conclusao{
  width: 100%;
 }

 .imgDesk{
  display: flex;
  margin:  0 auto;
}

.imgMb{
  display: none;
  
}


}

/*Grandes telas*/
@media screen and (min-width:1441px) and (max-width:1920px){
  .projeto{
    background-image: url('assets/vetor1.png');
    background-repeat: no-repeat;
    background-position: center right;
    height: 761px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
   padding-bottom: 5rem;
  }

  .projeto img{
    display: flex;
    width: 238px;
  height: 305px;
  
  }
  
 .projeto div{
  padding-bottom: 2rem;
 }


 .projeto h1, .spanText, .spanText2{
  width: 100%;
 }
  
 .projeto p{
  font-size: 20px;
  width: 900px;
 }


 .objetivo{
  width:100%;
 }

 .objetivoTitle, .objetivoParag, .objetivo ul li{
  width: 100%;
 }

 #conclusao{
  width: 100%;
 }
 .imgDesk{
  display: flex;
  margin:  0 auto;
}

.imgMb{
  display: none;
  
}


}