
*{margin: 0;  /* border: 1px solid red; */ font-family: "Poppins"; box-sizing: border-box; font-display: swap; text-wrap: wrap; white-space: wrap; word-wrap: break-word; }

a{text-decoration: none; user-select: none;}

body{background-color: #ececec;}

img{user-select: none; pointer-events: none;}

strong{font-weight: 500;}









.content{width: 100%; background-color: #ececec; display: flex; justify-content: center; height: auto;}

.page{max-width: 1000px; width: auto; min-width: 0px; display: flex; width: 1000px;}

.main{width: 800px; height: auto; }

.sidebar{height: 300px; margin: 0; min-width: 210px; user-select: none; display: flex; flex-direction: column; align-items: center;}

.modlar{display: none; flex-direction: column; width: 200px; height: auto;   margin: 0; margin-top: 135px;
    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;}
   
.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;}


.benzerler{display: flex; flex-direction: column; align-items: center; width: 200px;  height: auto; margin: 0; margin-top: 185px; border-radius: 10px;box-shadow: 0 0 20px 5px rgb(200 200 200 / 60%); }
.similar_posts{display: flex; flex-direction: column; align-items: center; width: 100%; height: auto; padding: 1px 5px 6px 5px; text-align: center; }

.similar_post{display: flex; flex-direction: column; overflow: hidden; width: 100%; padding: 0 5px; margin-top: 5px; background-color: #f5f5f5; border-radius: 8px; color: black;}
.similar_p_t{display: flex; width: 100%;}
.similar_p{display: flex; justify-content: center; align-items: center; max-width: 44px; max-height: 44px; height: 100%; width: 100%; border-radius: 50%; /*object-fit: cover;*/ overflow: hidden;}
.similar_p img{width:100%; height:100%; min-width: 44px; min-height: 44px;}
.similar_t{display: flex;  text-overflow: ellipsis; text-align: left; white-space: normal; overflow: hidden; max-height: 44px; width: 100%; padding: 0 10px; font-size: 14px; padding-top: 3px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.similar_n_d{display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 3px;}
.similar_n{max-width: 90%;  font-size: 13px; margin-left: 5px;}
.similar_d{font-size: 13px; margin-left: 5px; padding-right: 10px; text-align: right; max-width: 86px; }






.baslikyazarvetarih{display: flex; flex-direction: column; margin-top: 30px; text-wrap: wrap; white-space: none;}

.baslik h1{
    font-size: 22px;
    font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal;
}
.baslik{width: auto;}

.yazarvetarih{display: flex; }
.usttarih{margin-left: 15px;}

.yazarvetarih p{
    color: #4a4a4a;
    font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal;
}

.yorumlar{
    display: flex; flex-direction: column;
}



.cVerilen{display: -webkit-box; padding: 7px 8px; font-size: 14px; border: 1px solid gray; color: slategray; background-color: lightgray; margin-bottom: 7px;}
.cVerilen p{display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; color: slategray; background-color: lightgray;}

.soru{width: 790px; border-radius: 12px; display: flex; height: auto; min-height: 250px; margin-top: 50px; margin-bottom: 50px; box-shadow: 0px 5px 10px 0px rgba(70, 70, 70, 0.205);     background-image: linear-gradient(to right, #ececec, #fff , #ffff ,#fff);}


.detay{flex-basis: 20%; display: flex; flex-direction: column; text-wrap: wrap; white-space: none;}
.pp{width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; overflow: hidden;}
.pp img{width: 128px; height: 128px; border-radius: 50%; overflow: hidden; user-select: none; pointer-events: none;}

.nick{width: 100%;height: 100px; display: flex; justify-content: center; font-size: 18px; font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal; text-wrap: wrap; white-space: none;}
.nick p {text-align: center; font-size: 16px; color: black; height: min-content; padding-bottom: 5px; transition: color 200ms;}
.nick p:hover{color: #7d2ae8;}

.icerik{flex-basis: 80%; display: flex; flex-direction: column;}
.tarihveshare{width: 627px; height: 20px; margin-left: 3px; margin-right: 3px; border: none; border-bottom: 1.5px solid #aaaaaa; display: flex; justify-content: space-between; align-items: center; user-select: none; padding-left: 5px; padding-right: 5px;}
.tarihveshare .post_Yorum_Tarih{ font-size: 12px; color: lightslategrey;}
.tarihveshare span{ display: flex;  }
.reply{font-size: 13px; margin-right: 8px; cursor: pointer;}
.shrea{margin-right: 8px; font-size: 14px; cursor: pointer; display: flex; align-items: center;}
.reporta{display: flex; align-items: center;}

.yazi{width: 627px; height: auto; min-height: 230px; padding-left: 10px ; padding-top: 10px; padding-bottom: 10px; padding-right: 10px; display: flex; flex-direction: column; justify-content: space-between;}
.resimler{height: auto; margin-bottom: 10px; user-select: none;}
.resimdiv{max-width: 120px; width: 100%; height: 60px; display: flex; position: relative; border-radius: 6px;}
.resim{width: 100%; height: 100%; object-fit: cover; border-radius: 6px;}
.overlayy{position: absolute; top: 0; left: 0; border-radius: 6px; /*transform: translateY(-50%);*/ width: 100%; height: 100%; background-color: rgba(5, 5, 5, 0.6);}
.actext{width: 100%; height: 50%; position: absolute; top: 50%; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; display: flex; justify-content: center; align-items: center; font-size: 16px; cursor: pointer; color: #fff; background-color: rgba(5, 5, 5, 0.637); transition: all 250ms ease;}
.overlayy:hover .actext{height: 90%; top: 10%;}





.cevaplar{width: 790px; height: auto; /*min-height: 100px; margin-bottom: 130px;*/}

.cevap{width: 790px; border-radius: 12px; display: flex; height: auto; min-height: 250px; margin-top: 10px; box-shadow: 0px 5px 10px 0px rgba(70, 70, 70, 0.205);     background-image: linear-gradient(to right, #ececec, #fff , #ffff ,#fff);}



.cevapver{width: 790px; height: 300px; }

.cevapyaz{width: 100%; border-radius: 12px; height: auto; min-height: 200px; background-image: linear-gradient(to right, #ececec, #fff , #ffff ,#fff); box-shadow: 0px 5px 10px 0px rgba(70, 70, 70, 0.205); display: flex; flex-direction: column;}
.cevapbaslik{border: none; border-bottom: 1.5px solid #aaaaaa; user-select: none;}
.cevapbaslik p{margin-left: 5px; font-size: 15px;}

.yorumform{display: flex; flex-direction: column; align-items: center;}

#yVerilen{text-align: center; width: 100%; max-width: 117px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 6px 7px; color: #fff; background-color: #7d2ae8; cursor: pointer; border-radius: 12px; font-weight: 500; font-size: 12px;}
#kimeBTNS{position: absolute; display: none; align-items: center; width: 100%; height: 100%; border-radius: 12px; overflow: hidden; color: #ececec;}
#yVerilenAna:hover #kimeBTNS{display: flex;}
#yVerilenAna{min-width: 65px;}

.yorumform textarea{width: 780px; height: 150px; resize: none;font-size: 14px;
    outline: none;
    line-height: 1.5;
    border: 1.2px solid #aaaaaa;
    transition: all 0.2s ease;
    color: #333;
    margin-top: 10px;
    padding-top: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    padding-right: 10px;
}
.yorumform textarea:focus{   border: 1.2px solid #7d2ae8; color: black;}

.btndiv{width: 780px; display: flex; justify-content: right;}
.yorumform button{ width: 80px; height: 30px; margin-top: 10px; margin-bottom: 5px; color: #fff;  background: #7219E6;; border-radius: 11px; border: 1px solid #a367f0; cursor: pointer;

}





.girisyapmalisiniz{display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 16px; color: #7d2ae8; border: 1px solid #7219E6; margin: 3px; width: 98%; height: 96%; border-end-end-radius: 8px; border-end-start-radius: 8px; text-align: center; user-select: none;}

.butonlar{display: flex; justify-content: center; align-items: center;}

.girisyapbtn{width: 105px; height: 24px; border: 2px solid #7219E6; background: none;  margin-right: 10px; color: #7219E6; border-radius: 10px; text-align: center; font-size: 12px; display: flex; justify-content: center; align-items: center; }
.girisyapbtn p{text-align: center;}
.kayitolbtn{width: 105px; height: 24px; border: 2px solid #7219E6; background: none;  margin-left: 10px; color: #7219E6; border-radius: 10px; text-align: center; font-size: 12px; display: flex; justify-content: center; align-items: center; }
.kayitolbtn p{text-align: center;}








.redirect-link{color: #7d2ae8; font-style: italic; cursor: pointer; font-family: 'Gotham-Rounded-Book'; margin-right: 1px;}

.redirect{user-select: none; background-color: #fff; display: none; flex-direction: column; width: 100%; justify-content: center; max-width: 420px; padding: 20px 30px; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 101; overflow: hidden; border-radius: 10px;}
.redirect-p{margin-bottom: 50px; text-align: center; display: flex; flex-direction: column; justify-content: center;}
.redirect-p strong{font-size: 18px; color: #7219E6;} .redirect-p p{font-size: 14px; margin-top: 10px; text-align: center;}
.redirect-a{margin: 0; display: flex; flex-direction: column; align-items: center;}
.r-g{display: flex; cursor: pointer; justify-content: center; align-items: center; background-color: #7219E6; color: #fff; font-weight: 500; margin-bottom: 10px; width: 165px; height: 40px; border-radius: 16px; padding: 0;}
.r-v{ display: flex; cursor: pointer; justify-content: center; align-items: center; background-color: transparent; border-bottom: 1px solid #7219E6; color: #7219E6; width: 80px;}

.r-g:hover{background-color: #6c16dd;}
.r-v:hover{border-bottom: 1px solid #6c16dd; color: #6c16dd;}

.unlem{font-size: 14px; cursor: pointer; }




.aynilar{display: flex; flex-direction: column; align-items: center; width: 100%;  height: auto; margin: 0; margin-top: 50px; margin-bottom: 135px; user-select: none;  border-radius: 10px;box-shadow: 0 0 20px 5px rgb(200 200 200 / 60%); }
.ayni_posts{display: flex; flex-direction: column; align-items: center; width: 100%; height: auto; padding: 1px 5px 6px 5px; text-align: center; }















.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Overlay rengi ve saydamlığı */
    z-index: 98; /* Sikayet panelin altında kalacak */
    display: none;
    backdrop-filter: blur(5px); /* Geri kalan içeriği blur etmek için */
  }
  
.sikayetpanel {
    width: 500px;
    height: 500px;
    display: none;
    flex-direction: column;
    position: fixed;
    z-index: 99;
    background-color: #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 12px;
    user-select: none;
}



.usttaraf{width: 100%; height: 45px;}
.usttaraf h2{position: absolute;     
    left: 50%;
    top:10px;
    transform: translate(-50%); 
}

.usttaraf a{position: absolute; right: 25px; width: 20px; height: 20px; top: 15px; display: flex; font-size: 26px; justify-content: center; align-items: center; cursor: pointer; }

.alttaraf{height: 455px; width: 100%; display: flex; padding: 10px;}


.suclar{width: 100%; height: 100%; display: flex; flex-direction: column; padding: 0; margin: 0; padding-left: 7px; align-items: center;}

.yazi1{width: 100%; height: 30px; display: flex; padding-left: 7px; align-items: center; color: #7d2ae8; font-size: 18px; font-weight: 500; }




.suclist1{width: 100%; height: 345px; display: flex; flex-direction: column; justify-content: center;}

.checkbox{width: 430px; height: 40px; border: 1px solid #4a4a4a; margin-bottom: 10px;  display: flex; align-items: center; padding-left: 5px; cursor: pointer; }

.sozlesmee{margin-left: 0px; font-weight: 500; letter-spacing: 0.7px; cursor: pointer; font-family: 'Open Sans';}




.check {

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    opacity: 0;
    pointer-events: none;
}
.uil-check{
    color: #fff;
    font-size: 28px;
    margin-bottom: 0px
}





.sikayet_btn_1{width: 100%; height: 60px; display: flex; justify-content: center; }

.sikayet_btn_2{width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; font-size: 38px; color: #fff; background-color: #7d2ae8; border: none; border-radius: 18px; cursor: pointer; }
.sikayet_btn_3{width: 60px; height: 60px; margin-right: 50px;  display: flex; justify-content: center; align-items: center; font-size: 32px; color: #fff; background-color: #7d2ae8; border: none; border-radius: 18px; cursor: pointer; }
.btn_geri{width: 40px; height: 30px; display: flex; margin-right: 10px; justify-content: center; margin-top: 20px; align-items: center; font-size: 26px; color: black; background-color: #fff; border: none; border-radius: 16px; cursor: pointer; }

.sendd{font-size: 30px;}


.yorumekle{width: 100%; height: 345px; display: flex; flex-direction: column; }


.yekle{
    width: 435px;
    height: 200px;
    min-height: 200px;
    margin-top: 15px; margin-left: 13px; margin-right:13px;
    resize:none;
    font-size: 14px;
    outline: none;
    line-height: 1.5;
    border: 1.2px solid #aaaaaa;
    transition: all 0.2s ease;
    color: #333;
    padding-top: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    padding-right: 10px;
}
.yekle:focus{   border: 1.2px solid #7d2ae8; color: black;}





/***************************/
.kategories{display: flex; width: 100%;}
.category{display: flex; width: 100%;}

.annen{font-size: 12px; height: 32px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: sandybrown; border-radius: 12px; margin: 7px 7px 7px 0px; color: #fff; padding: 7px; padding-left: 8px; padding-right: 8px; font-weight: 500; cursor: pointer;}
.annen p{overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
/***************************/







/***************************************/

    .filters{flex-direction: row-reverse;}
    .-list-selected-div{position: relative; width: 130px;}

    .-list-selected-a{height: 37px; min-width: 124px; padding: 8px 9px; align-items: center; color: #525252; transition: all 300ms linear; justify-content: center; border-radius: 7px; position: absolute; top: -37px; }
    .-list-selected-a:hover{background-color: #f7f7f7; border-radius: 7px; box-shadow: 1px 8px 14px 0px #adadad; color: #7d2ae8; }
    .fa-chevron-down{transition: rotate 300ms linear;}


    .-list-filters-list {
        display: none;
        flex-direction: column;
        padding: 0 3px 5px 3px;
        position: absolute;
        width: 100%;
        background-color: #f7f7f7;
        height: 0; /* Başlangıçta 0 yapın */
        width: 150px;
        left: -20px;
        transition: height 300ms ease;
        overflow: hidden;
        border-radius: 0 0 7px 7px;
    }
    
    .-list-filters-list-filter {
        display: flex;
        justify-content: center;
        margin-top: 8px;
        border-radius: 7px;
        color: #525252;
        border: none;
        background-color: #fff;
        width: 100%;
        padding: 3px 8px;
        min-height: 40px;
        align-items: center;
        cursor: pointer;
    }
    .-list-filters-list-filter:hover{color: #7d2ae8;}
    
    .-list-selected-a.active + .-list-filters-list {
        height: 100%; /* 'auto' yerine '100%' kullanın */
    }

    .-list-selected-a.active{width : 150px; left: -20px;  color :#7d2ae8; background-color: #f7f7f7; }
    .-list-selected-a.active:hover{box-shadow: 0px 0px 0px 0px transparent;}

/***************************************/

















.girisgerekli{width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center;}


.yazi2{width: 100%; height: 30px; display: flex; padding-left: 7px; align-items: center; color: #7d2ae8; font-size: 18px; font-weight: 500; text-align: center; justify-content: center;}



.btnler{width: 100%; height: 345px; display: flex; flex-direction: column; justify-content: center; align-items: center;}


.raporGiris{width: 65%; height: 65px; border: none; border-radius: 12px; background-color: #7d2ae8; cursor: pointer; color: #fff;  margin-bottom: 50px; display: flex; justify-content: center; align-items: center; font-size: 20px; font-weight: 500; }
.raporGiris:hover{background-color: #7219E6;}

.raporKayit{width: 65%; height: 65px; border: none; border-radius: 12px; background-color: #7d2ae8; cursor: pointer; color: #fff; display: flex; justify-content: center; align-items: center; font-size: 20px; font-weight: 500; }
.raporKayit:hover{background-color: #7219E6;}







.bresim{display: none; width: max-content; max-width: 800px;  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 101; overflow: hidden; border-radius: 10px; }
.resimust{width: 100%; position: absolute; height: 0px; background-color: rgba(20, 20, 20, 0.86); display: flex; justify-content: right; align-items: center; padding-right: 20px; font-size: 0px; color: #fff; transition: all 500ms ease; }


.resimbuyuk{max-width: 100vw; max-height: calc(100vh - 20px); align-self: center;}
.bresim:hover .resimust{height: 40px; font-size: 24px;}
.bresim:hover .resimalt{height: 40px; font-size: 24px; top: calc(100% - 40px);}
.resimust a{cursor: pointer;}

.resimalt{width: 100%; position: absolute; height: 0px; top: calc(100%); background-color: rgba(20, 20, 20, 0.86); display: flex; justify-content: right; align-items: center; padding-right: 20px; font-size: 0px; color: #fff; transition: all 500ms ease;}
.resimalt a{cursor: pointer;}






.sharem{background-color: #fff; display: none; flex-direction: column; width: 100%; justify-content: center; max-width: 420px; padding: 20px 30px; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 101; overflow: hidden; border-radius: 10px;}
.paylaskapa{display: flex; align-items: center; justify-content: right; position: absolute; right: 15px; top: 10px; font-size: 24px; cursor: pointer;}

.urlspan{display: flex; width: 100%; height: 70px; background-color: rgb(252, 252, 252); margin-top: 20px; align-items: center;}
.pURL{width: calc(100% - 60px); outline: none; border: none; background-color: transparent; margin-left: 10px;  height: 40px; display: flex; align-items: center; padding-right: 10px; resize: none; text-wrap: nowrap; overflow: auto; overflow-y: hidden;  text-align: center; font-size: 16px;}
#pURL::-webkit-scrollbar {

    height: 0px;
}
  
  /* Scrollbar için arkaplan rengi */
  #pURL::-webkit-scrollbar-track {
    background: transparent;
  }
  

  /* Scrollbar'ın kendisi */
  #pURL::-webkit-scrollbar-thumb {
    background: #888;
    max-width: 10px;
    border-radius: 50px;
    visibility: hidden;
  }
  
  /* Scrollbar'ın üzerine gelindiğinde */
  #pURL::-webkit-scrollbar-thumb:hover {
    background: #7d2ae8;
  }
  
.urlKop{width: 40px; cursor: pointer; margin-left: 10px; margin-right: 10px; height: 40px; border-radius: 8px; background-color: rgb(119, 0, 255); color: #fff; display: flex; justify-content: center; align-items: center;}
.smler{display: none; width: 100%; height: 80px; margin-bottom: 10px; background-color: rgb(252, 252, 252); justify-content: space-between; align-items: center;}

#pFacebook,#pReddit,#pTwitter,#pWhatsapp,#pMail{width: 55px; height: 55px; display: flex; justify-content: center; align-items: center;  font-size: 36px; color: #888;  cursor: pointer;}
#pMail{font-size: 34px;}

#pFacebook:hover{color: rgb(0, 94,255); font-size: 44px;}
#pReddit:hover{color: #db0000;font-size: 44px;}
#pTwitter:hover{color: black;font-size: 44px;}
#pWhatsapp:hover{color: #00ff4c;font-size: 44px;}
#pMail:hover{color: rgb(119,0,255);font-size: 42px;}











.create-{color: #7d2ae8;}
.create-:hover{color: #fff; background-color: #7d2ae8;}





.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;  }




/***************************************/

@media only screen and (max-width: 1050px) {
    .baslikyazarvetarih{margin-left: 50px;}
}



@media only screen and (max-width: 1000px) {
    .main{width: 680px;}
    .page{justify-content: center;}

    .baslikyazarvetarih{margin-left: 50px; max-width: 501px;}

    .yorumlar{width: auto; min-width: 500px; max-width: 700px;}
    .soru{width: auto; min-width: 500px; max-width: 700px;}
    .cevap{width: auto; min-width: 500px; max-width: 700px;}
    .cevapver{width: auto; min-width: 500px; max-width: 700px;}
    .cevaplar{width: auto; min-width: 500px; max-width: 700px;}

    .cevapbaslik{margin-left: 10px;}
    .yorumform textarea{width: 680px; min-width: 500px;}
    .btndiv{width: 680px;}


    .baslik{width: 500px;}

    .tarihveshare{width: auto; min-width: 400px;}


    .detay{width: 130px;}
    .icerik{width: 570px;}

    .yazi{width:100%;}

    .nick{width: 100%;height: 100px; display: flex; justify-content: center;}
    .nick p{font-size: 14px; /* Metin boyutunu ayarlayın */
        line-height: 16px; /* Satır yüksekliğini ayarlayın */
        max-width: 100%; /* Metnin maksimum genişliğini ayarlayın */
        overflow: hidden; /* Taşan içeriği gizleyin */
        text-overflow: ellipsis; /* Taşan metni üç nokta (...) ile kırpın */
        white-space: nowrap; /* Metni alt satıra geçirmeden koruyun */
        font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal; 
    }

    .benzerler{margin-top: 215px}

}
@media only screen and (max-width:900px) {

    .search-input{width: 250px;}
    .menu{display: none;}
    .page{flex-direction: column; align-items: center;}
    .benzerler{margin-top: 0px; width: 100%;}
    .sidebar{height: auto; margin-bottom: 50px; width: 680px;}
    .aynilar{margin-bottom: 15px;}

}
@media only screen and (max-width:800px){

    .search-input{width: 220px;}
    .menu{display: none;}

}


@media only screen and (max-width: 735px) {
    .main{width: 500px;}
    .sidebar{width: 500px;}

    .pp{width: 100px; height: 100px;}
    .pp img{width: 90px; height: 90px;}

    .baslikyazarvetarih{margin-left: 50px; max-width: 400px;}
    .page{flex-direction: column; align-items: center;}
    .yorumlar{width: auto; min-width: 500px; max-width: 700px;}
    .soru{width: auto; min-width: 500px; max-width: 700px;}
    .cevap{width: auto; min-width: 500px; max-width: 700px;}
    .cevapver{width: auto; min-width: 500px; max-width: 700px;}
    .cevaplar{width: auto; min-width: 500px; max-width: 700px;}

    .cevapbaslik{margin-left: 10px;}
    .yorumform textarea{width: 498px; min-width: 480px;}
    .btndiv{width: 100%;}


    .baslik{width: 398px; word-wrap: break-word;}

    .tarihveshare{width: auto; max-width: 400px; min-width: 0px;}


    .detay{width: 100px;}
    .icerik{width: 400px;}

    .yazi{width: 399px; height: auto; max-height: 2000px; text-wrap: wrap; text-overflow: clip; font-size: 14px; word-wrap: break-word;}


.nick{width: 100%;height: 100px; display: flex; justify-content: center;}
.nick p{font-size: 12px; /* Metin boyutunu ayarlayın */
        line-height: 16px; /* Satır yüksekliğini ayarlayın */
        max-width: 100%; /* Metnin maksimum genişliğini ayarlayın */
        overflow: hidden; /* Taşan içeriği gizleyin */
        text-overflow: ellipsis; /* Taşan metni üç nokta (...) ile kırpın */
        white-space: nowrap; /* Metni alt satıra geçirmeden koruyun */
        font-stretch: 100% ; font-optical-sizing: auto; font-kerning: auto; font-feature-settings: normal; word-wrap: break-word; 
}

.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) {
    .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;}


    .resimbuyuk{width: calc(100vw - 10px);}
    .sharem{ width: calc(100% - 10px); padding: 20px 15px; min-width: 240px;}


    .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: 520px) {
    .main{width: 100%;}
    .sidebar{width: 100%;}
    .baslikyazarvetarih{width: 100%; margin-left: 0;}
    .baslik{width: 100%; word-wrap: break-word; text-overflow: clip; text-wrap: wrap; padding-left: 10px;}
    .yazarvetarih{width: 100%; font-family: 12px;  word-wrap: break-word; text-overflow: clip; text-wrap: wrap; padding-left: 10px;}
    .kategories{padding-left: 8px;}

    .yorumlar{width: 100%; min-width: 0; align-items: center; padding: 0 4px;}

    .soru{width: 100%; display: flex; flex-direction: column; min-width: 0; max-width: 500px; margin-right: 0; border-radius: 6px;}
    .detay{flex-direction: row; width: 100%;}
    .pp{min-width: 85px; height: 85px; margin-left: 3px;}
    .pp img{width: 80px; height: 80px; }
    .nick{height: 85px; font-size: 16px; word-wrap: break-word; text-overflow: clip; text-wrap: wrap; justify-content: left; padding-top: 10px; padding-left: 10px;}
    .nick p{font-size: 16px;}

    .icerik{flex-direction: column-reverse; width: 100%;}
    .tarihveshare{border-bottom: none; border-top: 1.5px solid #aaaaaa; width: 100%; max-width: 500px; margin-left: 0;}
    .yazi{width: 100%;}

    .cevap{width: 100%; display: flex; flex-direction: column; min-width: 0; max-width: 500px; border-radius: 6px}
    .cevaplar{width: 100%; display: flex; flex-direction: column; min-width: 0; max-width: 500px; margin-right: 0;}


    .cevapver{width: 100%; min-width: 0; max-width: 500px;}
    .cevapyaz{width: 100%; min-width: 0; max-width: 500px;}
    .cevapbaslik{width: 100%; margin-left: 0; padding-left: 10px;}
    .yorumform{width: 100%; min-width: 0; max-width: 500px; padding-left: 3px; padding-right: 3px;}
    .yorumform textarea{ width: 100%;min-width: 0; max-width: 500px;}
    .btndiv{width: 100%; min-width: 0; max-width: 500px;}

    




    .sikayetpanel{width: 90%; height: auto; min-height: 500px;}
    .yazi1{font-size: 16px;}
    .checkbox{width: 100%; height: auto; min-height: 40px; max-height: 60px; margin-left: 0px; margin-right: 0px; font-size: 14px; font-weight: 400;}
    .yekle{font-size: 14px; width: 100%; margin-left: 0; margin-right: 0;}
    .suclar{padding-left: 5px;}
}

@media only screen and (max-width:415px){
    .yazi1{font-size: 14px; text-align: center; margin-left: 0px; padding: 0;}
    .checkbox{padding-right: 5px;}
    .sozlesmee{font-size: 12px;}
    .yekle{font-size: 12px; width: 100%; margin-left: 0; margin-right: 0;}
    .pp{margin-left: 3px;}

    .resimust{max-height: 30px; padding-right: 15px;}
    .resimalt{max-height: 30px; padding-right: 15px;}
    .bresim:hover .resimust{font-size: 18px;}
    .bresim:hover .resimalt{font-size: 18px; top: calc(100% - 30px);}

    .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;}

}

/***************************************/









/* background: */
progress::-webkit-progress-bar {background-color: #ececec; width: 100%;}
progress {background-color: #ececec;}

/* value: */
progress::-webkit-progress-value {background-color: #7d2ae8 !important;}
progress::-moz-progress-bar {background-color: #7d2ae8 !important;}
progress {color: #7d2ae8;}

