style.css

body{
  margin:0;
 
}
h1,h2{
   font-family: 'Krona One', sans-serif;
}
p{
  font-family: 'Mulish', sans-serif;
}
h3,h4{
  font-family: 'Roboto Mono',monospace;
}

a{
  text-decoration: none;
}
.btn{
  color:#fff;
}
.myimage{
  margin-top:1rem;

} 
#welcome-section{
  height:70vh;
  width:40%;
}
.intro{
  width:60%;
  position: absolute;
  top:20%;
  left:40%;
}
.projects-title{
  text-align: center;
}

/*project card images*/
.card{
  margin-bottom: 3%;
  height:30rem;
  width: 18.8rem;
  text-align:center;
   background-color: rgba(245, 245, 245, 0.4); 
   /* box-shadow:  3px 5px rgba(240, 228, 228, 0.4);  */
}
.card:hover{
  box-shadow:  5px 7px rgba(240, 228, 228, 0.4); 
}
.cards{
  width:100%;
  margin:7% 0;
}

.card-img-top{ 
  height:300px;
  border: none;
}
.col-lg-12{
   border: none;
}

.js,.bootstrap,.python,.jquery,.html,.css{
margin:5% 0 0 7%;
width: 85%;
}
.css{
  width: 250px;
  height:300px;
  text-align: center;
}
 .css-card{
  position: relative;
  top:-24px;
}
.jquery{
  margin:0 0 0 1.5em;
}

footer{
  margin:0 auto;
  padding:0 10%;
  display: flex;

}
.fa{
   clear: "";
  display: flex;
  align-items:center;
  margin-left:10px;
}
/* click effect */


.press
{
 filter:brightness(18px);
 width:19rem;
}

@media (max-width:770px){
 

 .myimage{
   margin:1rem auto;
   
 }
 #welcome-section {
padding-bottom:2%;
 }
.card{
    margin:2% auto;
  }
  
  footer  {
    display: flex;
    justify-content:center;
    align-items:center;
    align-content:center;
  }
  .fa{
   
  }
}
@media only screen and (max-width: 750px)
{
#Projects{
  position: relative;
  top:100px;
}
#achieve-Skill{
margin-top:200px;
}
}