

.bloglar{
	width: calc(25% - 40px);
	float: left;
	position: relative;
	margin:20px;
}

.bloglar .blog_resim{
	width: calc(100% - 0px);
	float: left;
	position: relative;
}

.bloglar .blog_resim img{
	width: calc(100% - 0px);
	height: calc(100% - 0px);
	float: left;
	position: relative;
	object-fit: cover;
}

.bloglar h2{
	width: calc(100% - 0px);
	line-height: 1.3;
	float: left;
	position: relative;
	text-align: center;
}











.kapak_foto{
	width: calc(100% - 0px);
	float: left;
	position: relative;
	object-fit: cover;
	margin-bottom: 10px;
}

.blog_baslik{
	width: calc(100% - 0px);
	line-height: 1.4;
	font-weight: bold;
	float: left;
	position: relative;
	font-size: 45px;
	color:#2d2d2d;
	margin:20px 0px;
}

.blog_bar{
	width: calc(100% - 0px);
	float: left;
	position: relative;
	margin:30px 0px;
}


.blog_bar .blog_zaman{
	float: left;
	position: relative;
	display: flex;
	align-items: center;
	font-size: 14px;
	color:#2c2460;
	letter-spacing: 0.5px;
}

.blog_bar .blog_zaman:before{
	content:'';
	display: inline-block; 
	width:17px; 
	height:17px; 
	margin-right: 7px;
	background-color: #2c2460; 
	position: relative; 
	mask: url(../images/date.svg) no-repeat center / contain; 
	-webkit-mask: url(../images/date.svg) no-repeat center / contain; 
}

.blog_begeni_but{
	line-height: 1.3;
	float: left;
	position: relative;
	background-color: var(--color);
	color:#fff;
	padding: 10px 30px;
	border-radius: 10px;
	letter-spacing: 1px;
	font-size: 15px;
	margin-right: 30px;
	cursor: pointer;
}

.blog_bar .blog_sayaclar{
	float: right;
	position: relative;
	display: flex;
	align-items: center;
}

.blog_bar .blog_sayaclar .blog_sayac{
	float: left;
	position: relative;
	margin-left: 15px;
	display: flex;
	align-items: center;
	font-size: 14px;
}

.blog_bar .blog_sayaclar .blog_sayac:before{
	content:'';
	display: inline-block; 
	margin-right: 7px;
	background-color: var(--color); 
	position: relative; 
}

.blog_bar .blog_sayaclar .kalp_icon:before{ width:18px; height:18px;  mask: url(../images/kalp.svg) no-repeat center / contain; -webkit-mask: url(../images/kalp.svg) no-repeat center / contain; }
.blog_bar .blog_sayaclar .show_icon:before{ width:18px; height:18px;  mask: url(../images/show.svg) no-repeat center / contain; -webkit-mask: url(../images/show.svg) no-repeat center / contain; }
.blog_bar .blog_sayaclar .yorumlar_icon:before{ width:18px; height:18px;  mask: url(../images/yorumlar.svg) no-repeat center / contain; -webkit-mask: url(../images/yorumlar.svg) no-repeat center / contain; }


.blog_icerik{
	width: calc(100% - 0px);
	float: left;
	position: relative;
	letter-spacing: 0.5px;
	margin-top:10px;
}





.blog_resimler{
	width: calc(100% - 0px);
	float: left;
	position: relative;
	margin:10px 0px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	-ms-flex-wrap: wrap;
}

.blog_resimler .blog_resim{
	width: calc(33.3% - 13px);
	float: left;
	position: relative;
	margin: 10px 0px;
}

.blog_resimler .blog_resim img{
	width: calc(100% - 0px);
	height: calc(100% - 0px);
	float: left;
	position: relative;
	object-fit: cover;
}



.yorum_sonuc{
	width: calc(100% - 20px);
	float: left;
	position: relative;
	color:#fff;
	padding: 10px;
	border-radius: 5px;
	margin-bottom: 8px;
}

.sonuc_yesil{ background-color: #61bd6d; }
.sonuc_kirmizi{ background-color:#f53c3c; }

.yorumlar{
	width: calc(100% - 0px);
	float: left;
	position: relative;
	margin-top:10px;
}

.yorumlar .yorumlar_baslik{
	width: calc(100% - 0px);
	line-height: 1.4;
	padding:10px 0px;
	float: left;
	position: relative;
	color:#3d3d3d;
	font-size: 30px;
	margin-bottom: 20px;
}

.yorumlar .yorumlar_baslik:before{
	content:'';
	width: calc(40% - 0px);
	height: 2px;
	float: left;
	position: absolute;
	bottom:0px;
	left: 0px;
	background-color: #3d3d3d;
}

.yorumlar .yorumlar_content{
	width: calc(100% - 0px);
	float: left;
	position: relative;
}


.yorum_balon{
	width: calc(100% - 0px);
	float: left;
	position: relative;
	margin:10px 0px;
}

.yorum_balon .yorum_yapan{
	width: calc(100% - 0px);
	line-height: 1.2;
	float: left;
	position: relative;
	text-transform: capitalize;
	font-size: 14px;
}

.yorum_balon .yorum_zaman{
	width: auto;
	line-height: 20px;
	font-size: 14px;
	float: right;
	position: relative;
	color:#5d5d5d;
}

.yorum_balon .yorum_metin{
	width: calc(100% - 20px);
	line-height: 20px;
	float: left;
	position: relative;
	background-color: #e2e2e2;
	border-radius:0px 20px 20px 0px;
	padding:10px 10px 30px 10px;
	letter-spacing: 0.5px;
	font-size: 14px;
}

.yorum_balon .yorum_butonlar{
	width: calc(40px - 0px);
	height: calc(40px - 0px);
	float: left;
	position: relative;
	border-radius: 50%;
	background-color:#e2e2e2;
	margin-left:10px;
	margin-top:-20px;
	z-index: 999;
}

.yorum_balon .yorum_butonlar .bgn_sayi{
	width: calc(17px - 0px);
	height: calc(17px - 0px);
	line-height: calc(17px - 0px);
	text-align: center;
	float: left;
	position: absolute;
	z-index: 999;
	border-radius: 50%;
	bottom:-5px;
	right:-5px;
	background-color: #e2e2e2;
	font-size: 13px;
}


.yorum_balon .yorum_butonlar:before{
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
    transition: all 100ms;
}


.cevapla_buton:before{ display: inline-block; width:18px; height:18px; position: relative; content:''; background-color:#4b77be; mask: url(../images/yorum_yanit.svg) no-repeat center / contain; -webkit-mask: url(../images/yorum_yanit.svg) no-repeat center / contain; }
.begen_buton:before{ display: inline-block; width:18px; height:18px; position: relative; content:''; background-color:#61bd6d; mask: url(../images/like.svg) no-repeat center / contain; -webkit-mask: url(../images/like.svg) no-repeat center / contain; }
.begenme_buton:before{ display: inline-block; width:18px; height:18px; position: relative; content:''; background-color:#3d3d3d; mask: url(../images/dislike.svg) no-repeat center / contain; -webkit-mask: url(../images/dislike.svg) no-repeat center / contain; }

.yorum_balon .yorum_butonlar:hover:before{ width:21px; height:21px; }

.begen_buton_aktif{ background-color: #61bd6d !important; }
.begen_buton_aktif:before{ background-color:#fff; }

.begenme_buton_aktif{ background-color: #3d3d3d !important; }
.begenme_buton_aktif:before{ background-color:#fff; }

.cevaplanan_yorum{
	width: calc(100% - 20px);
	line-height: 20px;
	float: left;
	position: relative;
	background-color: #ccc;
	border-radius:0px 15px 15px 0px;
	padding:10px 10px 10px 10px;
	margin-bottom:10px;
	letter-spacing: 0.5px;
}

.cevaplanan_yorum .cevaplanan_yorum_yapan{
	width: calc(100% - 0px);
	line-height: 20px;
	float: left;
	position: relative;
	text-transform: capitalize;
	border-bottom:1px solid #ddd;
	padding-bottom:5px;
	margin-bottom:5px;
}



.yorumlar .yorum_yap{
	width: calc(100% - 0px);
	float: left;
	position: relative;
	margin-top:40px;
}

.yorumlar .yorum_yap .cevaplanacak_yorum{
	width: calc(100% - 50px);
	max-height: 40px;
	float: left;
	position: relative;
	background-color: #3d3d3d;
	padding: 0px;
	color:#fff;
	overflow: hidden;
}

.yorumlar .yorum_yap .cevaplanacak_yorum_var{
	padding: 5px;
	padding-right:45px;
}

.yorumlar .yorum_yap .cevaplanacak_yorum .yorum_cover{
	width: calc(100% - 40px);
	height: 25px;
	float: left;
	position: absolute;
	top:25px;
	left:0px;
	background-image: linear-gradient(rgba(61,61,61,0), rgba(61, 61, 61, 0.8), rgba(61, 61, 61, 1));
}

.yorumlar .yorum_yap .cevaplanacak_yorum .cevap_kapat{
	width: calc(40px - 0px);
	height: 100%;
	background-color: #e26a6a;
	float: right;
	position: absolute;
	top:0px;
	right:0px;
}
.yorumlar .yorum_yap .cevaplanacak_yorum .cevap_kapat:before{
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	position: absolute;
}

.yorumlar .yorum_yap .cevaplanacak_yorum .cevap_kapat:before{ display: inline-block; width:20px; height:20px; content:''; transition: all 200ms; background-color:#fff; mask: url(../images/x.svg) no-repeat center / contain; -webkit-mask: url(../images/x.svg) no-repeat center / contain; }



.yorumlar .yorum_yap .yorum_textarea{
	width: calc(100% - 20px);
	height: calc(100px - 0px);
	float: left;
	position: relative;
	padding: 10px;
	outline:none;
	border:1px solid #bbb;
	border-radius:8px;
	resize: none;
	margin-bottom: 10px;
	background-color: transparent;
}

.yorumlar .yorum_yap .yorum_textarea:focus{ border-color:var(--color);}


.yorumlar .yorum_yap .yorum_text{
	width: calc(50% - 92px);
	height: calc(50px - 0px);
	float: left;
	position: relative;
	padding: 0px 10px;
	outline:none;
	border:1px solid #bbb;
	border-radius:8px;
	resize: none;
	margin-right: 10px;
	background-color: transparent;
}

.yorumlar .yorum_yap .yorum_text:focus{ border-color:var(--color);}



.yorumlar .yorum_yap .yorum_submit{
	width: calc(120px - 0px);
	height: calc(50px - 0px);
	line-height: calc(50px - 0px);
	float: left;
	position: relative;
	font-size: 13px;
	border: none;
	outline: none;
	background-color: var(--color);
	border-radius:8px;
	color:var(--color1_p);
	text-align: center;
	cursor: pointer;
}

.yorumlar .yorum_yap .yorum_submit:hover{
	width: calc(120px - 0px);
	height: calc(50px - 0px);
	line-height: calc(50px - 0px);
	float: left;
	position: relative;
	font-size: 13px;
	border: none;
	outline: none;
	background-color: var(--color);
	border-radius:8px;
	color:var(--color1_p);
	text-align: center;
}


