*{
  padding: 0;
  margin: 0;
  background-color: black;
  color: white;
  font-family: "Poppins", sans-serif , "Roboto", sans-serif;
}

.instagram{
  height: 100vh;
  width: 100%;
  display: flex;
}
  /* LEFT BAR */

.left_bar{
  height: 100vh;
  width: 18%;
  border-right: 1px solid #504949;
}

#logo{
  font-family: "Lobster", cursive;
  font-size: 30px;
}

.left_bar .items{
display: flex;
text-align: center;
align-items: center;
padding: 10px;
margin: 10px;
font-size: 20px;

}

.left_bar .items .material-symbols-outlined{
  font-size: 30px;
  margin-right: 10px;
}


/* POST SECTION */

.post_section{
  height: 100vh;
  width: 55%;
}


.post_section .story{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px;
}

.post_section .story .items{

  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px;
  font-size: 12px;
  font-weight: 200;
  padding-left: 20px;  

}

.post_section .story .items .profile{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.post_section .story .items .profile .img{
  background-image: conic-gradient(#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5,#feda75);
  padding: 2px;
  border-radius: 50%;
  display: inline-block;
}


.post_section .story .items .profile .img img{
  height: 60px;
  width: 60px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  padding : 3px;
}



.post_section .main_post{
  height:75vh;
  width:75%;
  margin-left: 60px;

}

.post_section .main_post .profile{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  margin: 10px;

}

.post_section .main_post .profile img{
  height: 40px;
  width: 40px;
  background-image: conic-gradient(#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5,#feda75);
  padding: 2px;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
}

.post_section .main_post .img{
  display: flex;
  justify-content: center;
  align-items: center;
}

.post_section .main_post .img img{
  height:auto;
  width: 100%;
  border-radius: 10px;

}


.post_section .main_post .engagement{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 10px;
}


.post_section .main_post .engagement .material-symbols-outlined{
  font-size: 30px;
  margin-right: 10px;
}

/* SUGGESTION SECTION */

.suggestion_section{
  height: 100vh;
  width: 25%;
  margin-top: 25px;
  border-left: 1px solid #504949;
}

.suggestion_section .suggestion{
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
font-size: 14px;
}

.suggestion_section .suggestion .profile{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.suggestion_section .suggestion .profile .img img{
height: 50px;
width: 50px;
border-radius: 50%;
}

.suggestion_section .suggestion .follow{
  color:blueviolet;
}


.suggestion_section .suggestion .profile p{
  color: #bcbab7;
}

.suggestion_section .suggestion .profile .See_All{
  color: white;
}