body {
  background-image: url("img/blur-16.jpg");
}
.heading {
  background-color: rgb(153, 153, 153);
  color: rgb(169, 112, 66);
  text-align: center;
  margin: 0 auto;
  margin-top: 50px;
  padding: 1em;
  width: 100%;
}
.card-header {
  background-color: rgb(153, 153, 153);
  color: rgb(169, 112, 66);
  font-size: 30px;
  font-weight: bolder;
}
/* in main page */
.profile-pic {
  margin-left: 30px;
  border-radius: 50%;
  width: 290px;
}
.skills {
  font-size: 40px;
  text-align: center;
  color: rgb(169, 112, 66);
  background-color: rgb(153, 153, 153);
  /* max-width: 800px; */
  margin: 0 auto;
  /* margin-bottom: 50px; */
  /* padding: 1em; */
  }
  #icon {
    color: rgb(25, 29, 72);
    padding: 1em;
  }
/*in portfolio page*/
#portfolio-card {
  background-color:  rgb(153, 153, 153);
}
.card {
  margin: 0 auto;
  height: 100%;
  background-color:  rgb(153, 153, 153);
}
#star-wars-pic {
  margin: 0 auto;
  height: 40%;

}
.btn {
  background-color: rgb(25, 29, 72);
  color: rgb(169, 112, 66);
  border-color:  rgb(169, 112, 66);;
}
.row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 90px;
}

/* in contact page */
.form-group {
  margin-bottom: 100px;
  font-size: 120%;
  padding: 1em;
}
.card-body {
  background-color: rgb(25, 29, 72);
  color:  rgb(153, 153, 153);
}
/*in all pages */
.panel-footer {
  font-size: 30px;
  align-content: space-around;
  color: rgb(169, 112, 66);
  background-color: rgb(153, 153, 153);
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  display: flex;
  
}
.fa-envelope {
  color: rgb(169, 112, 66);
  border-radius: 20%;
  padding: 20px;
  margin-left: 40%;
}
.fa:hover {
  opacity: 0.7;
}
.fa-linkedin {
  color: rgb(169, 112, 66);
  border-radius: 20%;
  padding: 20px;
}
.fa-facebook {
  color: rgb(169, 112, 66);
  border-radius: 20%;
  padding: 20px;
}
.fa-github {
  color: rgb(169, 112, 66);
  border-radius: 20%;
  padding: 20px;
}
.fa-file {
  color: rgb(169, 112, 66);
  border-radius: 20%;
  padding: 20px;
}
/* Need help with the website link */
/* .fa-website {
  color: rgb(169, 112, 66);
} */
@media screen and (min-width: 771px) {
  body {
    background-color: whitesmoke;
  }
  .profile-pic {
    margin-left: 10px;
    border-radius: 50%;
    width: 230px;
  }
}
@media screen and (min-width: 1000px) {
  .profile-pic {
    margin-left: 10px;
    border-radius: 50%;
    width: 300px;
  }
}
@media screen and (max-width: 579px) {
  .container {
    margin-right: -15px;
  }
}
@media screen and (max-width: 1432px) {
  .card {
    width: 100%;
  }
}
@media screen and (max-width: 1203px) {
  .skills {
margin-bottom: 20%;
}
}
