/* Home Page Styles */
* p {
  font-family: 'Montserrat', sans-serif !important;
}

 a {
   color: black;
  text-decoration:none;
}

a:visited {
  text-decoration-color:darksalmon !important;
}

a:hover {
  color:darksalmon;
}

a:active {
  color: lightgreen;
}

/* Navbar */

.navbar {
  display: flex;
  flex: wrap;
  width: 100%;
  font-family: 'Montserrat', sans-serif;
  font-size: 120%;
  height: 22px;
  padding-top: 47px;
  padding-bottom:50px;
  /* outline: black solid 4px; */
  color: lightgrey;
}

#about {
  margin-left: 3%;
}

#linkedin {
  margin-left: 1%;
}

#resume {
  margin-left: 2%;
  margin-right: 1%;
}

#home {
  margin-right:55%;
  margin-left: 7%;
  cursor: pointer;
}

/* Footer */


#insidefoot{
  top: 40%;
  position:fixed;
  /* height:171px; */
  width:100%;
  /* outline: solid  blue  3px;   */
  /* display:flex; */
  font-family: 'Montserrat', sans-serif;
  /* background-color: bisque; */
  opacity: 0.8;
}

#insidefootright {
  top: 40%;
  position:fixed;
  margin-left: 95%;
  width:100%;
  font-family: 'Montserrat', sans-serif;
  opacity: 0.8;
}

#item1 {

  /* margin-left: 80%; */
}

.footeritem{
  width:60px;
  height:60px;
  color: black
}

.footeritem:hover{
  cursor: pointer;
  /* border-bottom: darksalmon solid 4px; */
}


#item1{
  transition:0.3s;
  /* outline: orange solid 2px; */
}

#item1:hover {
transform: scale(1.1);
transform: rotateZ(360deg);

}

#item2 {
  /* outline: orange solid 2px; */

  /* margin-left: 1%; */
  transition:0.3s
}

#item2:hover {
  transform: scale(1.1);
  transform: rotateZ(360deg);

}

#item3 {
  /* outline: orange solid 2px; */

  /* margin-left: 1%; */
  transition:0.3s
}
#item3:hover {
  transform: scale(1.1);
  transform: rotateZ(360deg);

}

#item4 {
  /* outline: orange solid 2px; */
/* 
  margin-left: 1%;
  margin-right:4%; */
  transition:0.3s
}

#item4:hover {
  transform: scale(1.1);
  transform: rotateZ(360deg);
}

.social {
  width: 50px;
  height:50px;
  transition: 0.3s;
}

.social:hover {
  transform: scale(1.1);
  /* background-color: lightgreen; */
  /* border-radius: 50%; */
  transform: rotateZ(360deg);

}

/* Typing Animation */
 
#testbox {
    width:  1000px;
    height:  150px;
    text-align: center;
    padding-left:100px;
    font-size:20px;
  }
  
  /* Background Image */
  #bgd-image-box {
    height: 170px;
    width:  99.8%; 
    padding-top: 53px;
    background-repeat: no-repeat;
  }

.container{
  display: flex;
  width: 83%;
  justify-content: space-around;
  /* outline: black solid 4px; */
  margin:auto;
  height: 450px;
  font-family: 'Montserrat', sans-serif !important;
}

.container .card{
  height: 450px;
  width: 437px;
  text-align:center;
  /* outline: black solid 1px; */
  /* box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 6px; */
  /* border-radius: 16px; */
  transition: all 0.3s ease;
  font-family: 'Montserrat', sans-serif !important;

}

.container .card:hover{
  box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 24px;
}
.container .card a{
  text-decoration: none;
  font-family: 'Montserrat', sans-serif !important;

}

.container .card a img{
  padding: 16px 16px 0px 16px;
  height: 250px;
  width: 370px;
  transition: 0.3s;

}

.container .card a img:hover{
  transform: scaleX(0.9);
  width: 370px;
}

.container .card a .konten{
  padding: 0px 16px 16px 16px;
  font-family: 'Montserrat', sans-serif !important;
}

.container .card a .konten:hover{
  padding: 0px 16px 16px 16px;
  font-family: 'Montserrat', sans-serif !important;
  color:lightgreen;
}

.container .card a .konten p{
  font-size: 18px;
  border-top: 1px solid lightgrey;
  font-family: 'Montserrat', sans-serif !important;
  padding-top: 19px;
  color: #1C1D1D;
  font-weight: 300;
  display: flex;
  flex: wrap;
}

.container .card a .konten p .card-text {
  font-family: 'Montserrat', sans-serif !important;
  display: flex;
  flex: wrap;
}

.konten {
  font-family: 'Montserrat', sans-serif !important;
}

#about-pic {
  background-image: url('https://i.ibb.co/VBmvz9x/bnw-matthew.jpg');
}

#about-text {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 19px;
}

#about-container {
  width: 85vw;
  height: 85vh;
  margin:auto;
}

#bnwpic {
  width: 85vw;
  height: 85vh;
}


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

.container .card {
  display: flex;
  flex: wrap;
}  

.container {
  display: flex;
  flex: wrap;
}

.card {
  display: flex;
  flex: wrap;
}

.footeritem{
  display: none;
  }
}

#page-container {
  /* outline: blue solid 4px; */
}

.eapps-instagram-feed-posts-slider {
  margin-bottom: 60px;
}

/* back to the top button */