@charset "utf-8";

.konteyner-blog {
	width: 60%;
	height: auto;
	position: relative;
	margin-top: 100px;
	float: left;
	margin-left: 20%;
}
.konteyner-resim-sticky {
	width:98%;
	left: 1%;
	position: relative;
	background-image:url("../img/blog/reduktor.jpg");
	background-size: cover;
	height: 300px;
	border-radius: 50%;
	margin-top: 10px;
}
.konteyner-resim-baslik {
	background-color:hsla(207,90%,54%,1.00);
	color: hsla(0,0%,0%,1.00);
	font-size: 64px; 
	font-weight: bolder;
	padding: 50px;
	width: 70%;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	mix-blend-mode:screen;
	border-radius: 50%;
	transition: 0.5s;
}
.konteyner-resim-baslik:hover {
	font-size: 70px;
	transform: translate(-50%, -50%) skewX(10deg);
}
.konteyner-blog-detay-icerik {
	width: 100%;
	height:auto;
	float: left;
	padding: 20px;
	margin-top: 20px;
	background-color: hsla(0,0%,50%,1.00);
	border-radius: 10px;
}
.konteyner-blog-detay-icerik-baslik {
	width: 100%;
	float: left;
	text-align: center;
	padding: 10px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 24px;
	color: hsla(0,0%,100%,1.00);
	background-color: hsla(0,0%,30%,1.00);
	transform: skewX(-10deg);
	border-radius: 10px;
	margin-bottom: 20px;
}
.blog-detay-iframe-kapsul {
	overflow: hidden;
    position: relative;
    width:100%;
}
.blog-detay-iframe-kapsul::after {
    padding-top: 56.25%;
    display: block;
    content: '';
}
.blog-detay-video-iframe {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border-radius: 10px;
}
.konteyner-blog-detay-icerik-yazi {
	width: 100%;
	height: auto;
	float: left;
	margin-top: 20px;
	text-align: justify;
	padding: 20px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 16px;
	color: hsla(0,0%,100%,1.00);
	background-color: hsla(0,0%,30%,1.00);
	border-radius: 10px;
	overflow: hidden; /* taşanları gizle */
    text-overflow: ellipsis; /* eğer uzunsa üç nokta koy */	
}
.konteyner-blog-icerik-yorum {
	width: 100%;
	float: left;
	text-align: center;
	margin-top: 20px;
	padding: 10px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 20px;
	color: hsla(0,0%,100%,1.00);
	background-color: hsla(359,100%,31%,1.00);
	transform: skewX(-10deg);
	border-radius: 5px;
}
.konteyner-blog-yorumlar {
	width: 100%;
	height:auto;
	float: left;
	padding: 20px;
	background-color: hsla(180,5%,48%,1.00);
	border-radius: 10px;
	margin-top: 20px;
}
.konteyner-blog-yorumlar-ad {
	float: left;
	text-align: left;
	padding: 10px 2px 10px 10px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 16px;
	color: hsla(0,0%,100%,1.00);
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.konteyner-blog-yorumlar-soyad {
	float: left;
	text-align: left;
	padding: 10px 10px 10px 2px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 16px;
	color: hsla(0,0%,100%,1.00);
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.konteyner-blog-yorumlar-tek {
	float: left;
	text-align: left;
	padding: 10px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 16px;
	color: hsla(0,0%,100%,1.00);
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.konteyner-blog-yorumlar-mesaj {
	width: 100%;
	float: left;
	text-align: left;
	padding: 10px;
	margin-top: 10px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 16px;
	color: hsla(0,0%,100%,1.00);
	border-radius: 5px;
	clear: left;
}
.blog-model {
	width:20%;
	float: left;
	margin-top: 20px;
	border-radius: 10px;
	transition: 0.5s;
}
.blog-model:hover {
	width: 100%;
}
.blog-form-model {
	width: 100%;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	background-color: hsla(0,0%,40%,1.00);
	border:none;
	border-radius: 5px;
	display:none;
	padding: 20px;
}
.cizgi {
	width: 100%;
	float: left;
	height: 3px;
	border-radius: 3px;
	background-color: hsla(359,100%,31%,1.00);
}
.blog-yazi-yorum {
	width: 100%;
	text-align: center;
	float: left;
	margin-top: 10px;
	padding: 10px;
	font-family: "Comic Sans MS", Arial, "Times New Roman";
	font-size: 16px;
	color: hsla(0,0%,50%,1.00);
}
.blog-model-baslik {
	width: 100%;
	padding: 10px;
	margin-left: auto;
	margin-right: auto;
	font-size: 16px;
	color: hsla(0,0%,100%,1.00);
	background-color: hsla(0,0%,40%,1.00);
	border-radius: 5px;
	text-align: center;
	cursor: pointer;
	transform: skewX(-10deg);
}

.blog-model:hover .blog-model-baslik {
	background-color: hsla(207,90%,54%,1.00);
}
.blog-model:hover .blog-form-model {
	display: block;
}
.blog-model-ana-icerik {
	width: 100%;
}
.blog-model-ana-icerik-input{
	padding: 10px;
	border: 1px solid hsla(0,3%,81%,1.00);
	box-sizing: border-box;
	border-radius: 5px;
}
.input-sol {
	width: 32.33%;
	margin-top:10px;
	margin-bottom:10px;
}
.input-sag {
	width: 32.33%;
	margin-top:10px;
	margin-bottom:10px;
	margin-left: 1%;
}
.blog-model-ana-icerik-textarea{
	width: 100%;
	height: 80px;
	padding: 10px;
	margin-top: 10px;
	margin-bottom:10px;
	border: 1px solid hsla(0,3%,81%,1.00);
	color: hsla(0,0%,0%,1.00);
	box-sizing: border-box;
	border-radius: 5px;
}
.blog-giris-buton {
	width: 100%;
	margin-top:10px;
	padding: 10px;
	background-color:hsla(158,95%,34%,1.00);
	color:hsla(0,0%,100%,1.00);
	border: none;
	cursor: pointer;
	border-radius: 5px;
}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

.blog-up-down-tetik-sol {
	width: 10%;
	height: auto;
	position: fixed;
	left: 1%;
	top:90px;
	padding: 10px;
	margin-top: 5px;
	font-size: 16px;
	text-align: center;
	background-color: hsla(207,90%,54%,1.00);
	color: hsla(0,0%,100%,1.00);
	border: none;
	border-radius: 5px;
	transition: 0.5s;
	z-index: 3;
	cursor: pointer;
}
.blog-up-down-tetik-sol:hover .blog-up-down-sol-kapsul {
	display: block;
}
.blog-up-down-sol-kapsul {
	width: 10%;
	height: 600px;
	position: fixed;
	left: 1%;
	top:140px;
	z-index: 3;
	display: none;
	overflow: auto;
}
.blog-up-down-tetik-sag {
	width: 10%;
	height: auto;
	position: fixed;
	right: 1%;
	top:90px;
	padding: 10px;
	margin-top: 5px;
	font-size: 16px;
	text-align: center;
	background-color: hsla(207,90%,54%,1.00);
	color: hsla(0,0%,100%,1.00);
	border: none;
	border-radius: 5px;
	transition: 0.5s;
	z-index: 3;
	cursor: pointer;
}
.blog-up-down-sag-kapsul {
	width: 10%;
	height: 600px;
	position: fixed;
	right: 1%;
	top:140px;
	z-index: 3;
	display: none;
	overflow: auto;
}
.blog-up-down-menu {
	width: 100%;
    padding: 5px;
	margin-top: 5px;
	font-size: 16px;
	text-align: center;
	background-color: hsla(158,92%,29%,1.00);
	color: hsla(0,0%,100%,1.00);
	border-radius: 5px;
	transition: 0.5s;
}
.blog-up-down-menu:hover {
	background-color: hsla(207,90%,54%,1.00);
}
.blog-up-down-sembol {
	width: 50px;
	height: 50px;
	line-height: 50px;
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
	font-size: 24px;
	text-align: center;
	background-color: hsla(158,92%,29%,1.00);
	color: hsla(0,0%,100%,1.00);
	border-radius: 50%;
	transition: 0.5s;
}
.blog-up-down-sembol:hover {
	background-color: hsla(207,90%,54%,1.00);
}


/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

@media screen and (min-width : 250px ) and ( max-width : 1200px )
{
	.konteyner-blog {
		width: 96%;
		margin-left: 2%;
		margin-top: 50px;
	}
	.konteyner-resim-sticky {
		height: 150px;
	}
	.konteyner-resim-baslik {
		font-size: 26px;
		padding: 20px;
	}
	.konteyner-resim-baslik:hover {
		font-size: 28px;
	}
	.konteyner-blog-detay-icerik {
		padding: 10px;
		margin-top: 10px;
		border-radius: 5px;
	}
	.konteyner-blog-detay-icerik-baslik {
		padding: 10px;
		font-size: 16px;
		border-radius: 5px;
		margin-bottom: 10px;
	}
	.blog-detay-video-iframe {
		border-radius: 5px;
	}
	.konteyner-blog-detay-icerik-yazi {
		margin-top: 10px;
		padding: 10px;
		font-size: 16px;
		border-radius: 5px;
	}
	.konteyner-blog-icerik-yorum {
		margin-top: 10px;
		padding: 10px;
		font-size: 16px;
		border-radius: 5px;
	}
	.blog-model {
		width:35%;
	}
	.blog-yazi-yorum {
		margin-top: 10px;
		padding: 10px;
		font-size: 14px;
	}
	.blog-model-baslik {
		padding: 10px;
		font-size: 14px;
		border-radius: 5px;
	}
	.input-sol {
		width: 100%;
	}
	.input-sag {
		width: 100%;
		margin-left: 0%;
	}
	.blog-up-down-tetik-sol {
		display: none;
	}
	.blog-up-down-sol-kapsul {
		display: none;
	}
	.blog-up-down-tetik-sag {
		display: none;
	}
	.blog-up-down-sag-kapsul {
		display: none;
	}
}