.project-section-1{
  min-height:83vh;
}




.project-section-1 > .title-style {
  -webkit-text-stroke: 0.10rem var(--third-col);
  color: var(--second-col);
  text-shadow: 0 0 10px var(--second-col), 0 0 15px var(--third-col);
  font-weight: bold;
  font-size: 2.5rem;
  margin:2rem 0 2.5rem;
  z-index:1;
}


.project-section-1 ul{
  list-style-type: none;
  overflow-y: scroll;
  max-height:80vh;
}

.list-project li {
  background-color:var(--main-col);
  margin-bottom: 30px;
  border-radius: 35px;
  padding:17px 15px;
}

.project-item-top{
  color:var(--third-col);
  text-shadow: 0 0 13px var(--third-col);
  /*  padding-bottom:20px; */
  transition: all ease-in-out 400ms;
}

.project-item-top h3:hover{
  color:var(--fourth-col);
  text-shadow: 0 0 10px var(--bg-col);
  cursor: pointer;
}

.add_padding{
  padding-bottom: 15px;
}

.project-item-bottom{
  background-color:hsla(0, 0%, 100%, 0.185);
  border-radius: 35px;
  display:flex;
  flex-wrap: warp;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-height:0px;
  overflow: hidden;
  transition: all ease-in-out 300ms;
}

.show_project_item{
  padding:10px 25px;
  max-height:5000px;
  overflow:visible;
}


.project-item-description{
  padding:10px;
}
.bottom-color{
  color:var(--bg-col) !important;
}

.project-item-info {
  padding:10px;
  width:100%;
}

.project-button{
  background-color: var(--second-col);
  color: var(--bg-col);
  border: 3px solid var(--fourth-col);
  padding:15px 30px;
  border-radius: 25px;
  font-weight: bold;
  margin:15px;
  transition: all ease-in-out 200ms;
}

.project-button:hover{
  background: var(--fourth-col);
  color: var(--second-col);
  border-color: var(--second-col);
  box-shadow: 0 0 10px var(--bg-col);
}

.project-button:active{
  transform: scale(0.9);
}

.project-separator{
  width:80%;
  background-color:var(--main-col);
  height:3px;
  border-radius: 3px;
  margin:10px 0;
}

.project-lable{
  color:var(--main-col);
  font-size: 45px;
  margin-top:10px;
  -webkit-text-stroke: 0.5px white;;
}
 
a{ color:var(--fourth-col); }
a:hover{
  color:var(--third-col);
  text-shadow: 0 0 5px var(--fourth-col);
}