*{margin: 0; /*  border: 1px solid red; */ font-family: "Poppins"; box-sizing: border-box; text-wrap: wrap;}

a{text-decoration: none; user-select: none;}

body{background-color: #ececec;}

button{border: none;}

img{user-select: none; pointer-events: none;}












.content{width: 100%; background-color: #ececec; display: flex; justify-content: center; height: auto; min-height: 100vh;}


.page{max-width: 1100px; width: auto; min-width: 0px; display: flex; justify-content: center; }


.sonucveside{margin-top: 75px; background-color: #ececec; width: 1100px; display: flex; flex-wrap: wrap; padding: 0; justify-content: space-between;}



.sonuclar{
    margin: 0;
    background-color: #ececec;
    padding: 8px;
    width: 880px;
  
   box-shadow: 0 0 20px 5px rgb(200 200 200 / 60%);
   filter: drop-shadow(0 0 20px 5px rgb(200 200 200 / 60%));
   border-radius: 10px;

   transition: height 5s ease-in-out;
   margin-bottom: 50px;
   height: max-content;
   
}


   .posttab{display: flex; flex-direction: column;}

   .filtreler{display: flex; flex-wrap: nowrap; text-align: center; height: 40px; justify-content: space-between; font-size: 16px;}
   #filtre1,#filtre2,#filtre3,#filtre4{border-radius: 6px;}

#filtre1{ width: 30%; background-color: #7d2ae8; color: #fff; display: flex; justify-content: center; align-items: center; font-size: 16px; cursor: pointer;  }
#filtre2,
#filtre3,
#filtre4
{
  color: #7d2ae8;
  cursor: pointer;
  width: 22%;

  background-color: #fff; color: #7d2ae8; display: flex; justify-content: center; align-items: center; font-size: 16px; cursor: pointer;
}
   
      
   
     


   .posts{width: 100%; height: auto;  }

   .post{width: 100%; color: black; height: 68px; display: flex; border-radius: 5px; background-color: #fefefe; box-sizing: border-box; border: none; cursor: pointer; /*border: 1px solid rgb(197, 192, 192);*/ user-select: none; margin-top: 10px; transition: all 0.4s ease;}
   .post p{transition: all 0.1s linear(-0.48 -19.41%, 1.04 21.76%);}
   
   
   
   .post:hover{box-shadow: 0px 0px 20px 1px rgba(100, 100, 100, 0.205); color: #7d2ae8;}
   
   
   .profilfoto{width: 68px; height: 68px; min-width: 68px; min-height: 68px; display: flex; align-items: center; justify-content: center;}
   .profilfotopic{width: 50px; height: 50px; border-radius: 50%; overflow: hidden;}
   
   
   
   .titleveyazar{text-wrap: wrap; width: 400px; height: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
   
   .title{ height: 70%;  font-size: 16px; align-items: center; display: flex; font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal; padding-right: 10px; font-weight: 500; }
   .yazar{ height: 30%; font-size: 13px;  display: flex; font-stretch: 100%; font-optical-sizing: auto;  font-kerning: auto; font-feature-settings: normal;}
   
   .tittlep{font-family: "Poppins";  white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
   
   .mesajvegoruntulenme{width: 166px; color: black; height: 100%; min-width: 166px; display: flex; justify-content: center; flex-direction: column; align-items: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
   .mesaj{font-size: 15px; font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal; display: flex; justify-content: left;}
   
   
   .onayveyazar{width: 166px; min-width: 60px; color: black; height: 100%; display: flex; justify-content: center; flex-direction: column; text-align: right; padding-right: 8px; justify-content: center;}
   .onaydurumu{font-size: 15px; display: flex; justify-content: right;}
   .onayp{width: 120px; text-align: center;}
   .yazardiv{font-size: 14px; display: flex; justify-content: right;}
   .yazardiv p{margin-right: 5px; margin-top: 5px;}





.sidebar{height: 300px; margin: 0; min-width: 210px; user-select: none; display: flex; flex-direction: column; align-items: center;}

.modlar{display: flex; flex-direction: column; width: 200px; height: auto;   margin: 0; margin-top: 5px;
    background-color: #7d2ae8;

  
   box-shadow: 0 0 20px 5px rgb(200 200 200 / 60%);
   border-radius: 10px;}


   .modlarflag{background-color: #7d2ae8; letter-spacing: 0.7px; color: #fefefe; display: flex; justify-content: center; align-items: center; margin-left: 5px; margin-right: 5px; margin-top: 3px;}

   .modlarlist{display: flex; flex-direction: column; align-items: center; padding: 5px;  height: auto; background-color: #ececec; user-select: none; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; z-index: 99;}
   
   .moderator{display: flex; height: 48px; min-height: 48px; align-items: center; width: calc(100% - 5px); margin-top: 5px; border-radius: 10px; background-color: #f5f5f5;}
   .modfoto{width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; user-select: none; margin-left: 3px;}
   .modfotopic{width: 32px; height: 32px; user-select: none; border-radius: 50%; overflow: hidden;}
   .modadi{width: 132px; margin-left: 10px;}

   .transition {
    transition: all 0.3s ease; /* Geçiş süresi ve kolaylık ayarlarını istediğiniz gibi değiştirebilirsiniz. */
}











.footer{width: 100%; height: auto; min-height: 90px; background-color: #481788; display: flex; justify-content: center; align-items: center; padding: 0 20px; z-index: 80; user-select: none;}


.footer_icerikleri{display: flex; width: 800px; height: 100%; justify-content: center; align-items: center; flex-wrap: wrap;}
.footer_logo{display: flex; color: #fff; font-size: 22px;  height: 75px; width: 160px; align-items: center;}
.footer_anlasma{display: flex; flex-direction: column; color: #fff; font-size: 12px; ; word-wrap: normal; height: 75px; width: 220px; justify-content: center;}
.footer_sosyal{display: flex; flex-direction: column; color: #fff; font-size: 12px;   height: 75px; width: 140px; justify-content: center;}
.footer_iletisim{display: flex; flex-direction: column; color: #fff; font-size: 12px;  height: 75px; width: 180px   ; }




.aradigin{width: 100%; display: flex; text-align: center; justify-content: center; align-items: center; flex-direction: column; height: 160px; border: 1.5px solid #7d2ae8; margin-top: 15px; border-radius: 5px;}
.aradigin h1{font-size: 16px; color: #7219E6; font-weight: 500;}
.create-post{width: 125px; margin-top: 15px; height: 30px; border-radius: 13px; border: 2px solid #7d2ae8; color:#7d2ae8; font-size: 14px; font-weight: 500; display: flex; justify-content: center; align-items: center; transition: all 0.2s ease;}
.create-post:hover{background-color: #7d2ae8; color: #fff;}





@media only screen and (max-width:1100px) {
    .sonucveside{justify-content: center; width: 100%;}
    .menu{display: none;}

}

@media only screen and (max-width:900px) {
    .sonuclar{ width: 100%;}
    .search-input{width: 250px;}
    .menu{display: none;}

}
@media only screen and (max-width:800px){
    .titleveyazar{text-wrap: wrap; width: 300px; height: 100%; }
    .title{height: 70%; font-size: 16px; align-items: center; display: flex; font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal;}
    .yazar{ height: 30%; font-size: 12px;  display: flex; font-stretch: 100%; font-optical-sizing: auto;}
    #filtre1,#filtre2,#filtre3{font-size: 15px;}
    .search-input{width: 220px;}
    .menu{display: none;}

}

@media only screen and (max-with:735px) {
    .footer_icerikleri{width: 430px;}
    .footer_logo{width: 170px; margin-bottom: 10px; padding-left: 20px; padding-top: 5px; align-items: start;}
    .footer_anlasma{width: 200px; margin-bottom: 10px; padding-top: 10px; justify-content: flex-start; padding-left: 10px;}
    .footer_sosyal{width: 170px; margin-bottom: 10px; padding-left: 20px;}
    .footer_iletisim{width: 200px; justify-content: flex-start; margin-bottom: 10px; padding-left: 10px;}
}

@media only screen and (max-width:650px){
    .profilfoto{width: 65px; text-align: left; justify-content: left; min-width: 65px;}
    .titleveyazar{width: 70%; min-width: 100px; min-height: 65px; justify-content: center; display: flex; flex-direction: column;}
    .mesajvegoruntulenme{flex-basis: 49%; min-width: 0px; width: 49%; text-align: left;}
    .mesaj{font-size: 14px;}
    #filtre1,#filtre2,#filtre3{font-size: 14px;}
    .post{ height: auto; flex-wrap: wrap; }
    .onayveyazar{flex-basis: 48%; min-width: 0px; width: 48%;}
    .onaydurumu{font-size: 14px;}
    .yazardiv{font-size: 13px;}

    .createpost{width: 24px; border-radius: 30px; transition: all 50ms ease; display: flex; align-items: center; padding: 0;}
    .createpost p{display: none;}
    .createpost i{display: block; font-size: 16px;}

    .menu{display: none;}
}
@media only screen and (max-width:550px){
    .search{width: 0px; display: none;}
    .ara_form{display: none;}
   
    
    .postvehesab{display: none;}
    .hamburger-menu{display: flex;}
}
@media only screen and (max-width:450px) {
    #filtre1,#filtre2,#filtre3{font-size: 12px;}
    .createpost{transition: all 50ms ease; }
}
@media only screen and (max-width:415px){
    .footer_logo{justify-content: center; padding: 0; width: 172px; height: 40px; padding-top: 10px;}
    .footer_anlasma{padding: 0; width: 172px; text-align: center;}
    .footer_sosyal{padding: 0; width: 172px; text-align: center;}
    .footer_iletisim{padding: 0; width: 172px; text-align: center;}

}
