body{padding:0;margin:0;background-color:#ededed;font-family:'lucida grande',tahoma,verdana,arial,sans-serif;}
	a{color:#000;  text-decoration: none;}
	
	h1 {font-size:24px;}
	h2 {font-size:22px;}
	h3 {font-size:20px;}
	h4 {font-size:18px;}
	
	blockquote {
    background-color: #fff;
	border-radius:5px;
    border-left: solid 2px #343e47;
    border-right: solid 2px #343e47;
    margin-left: 5px;
    padding: 3px 10px;
    color: #343e47; 
	}
     blockquote blockquote {
     border-color: #00BCD4;
     color: #00BCD4; 
	}
    blockquote blockquote blockquote {
     border-color: #43A047;
     color: #43A047; 
	}


	
	
	.getir{cursor:pointer;}
	
	.table {width:100%; max-width:1200px; margin:0 auto; position:relative; display: flex; justify-content: space-between; }
	.alan {width:100%; display:block; padding:0; margin:0;}
	
	#ust, #orta, #alt {width:100%; display:table; margin:0; padding:0;}
	#ust, #alt {width:100%; display:table; margin:0; padding:10px 0; background: #3c728c;  color:#ffffff;} /*3c728c*/
	#ust {position: sticky;  top: 0; padding-top:0; z-Index:100; }
	#ust .ikon{font-size:1.6em; margin:7px;}
	#ust .mobilmenu{display:none;}
	#alt h3{padding:5px 0; margin:0;}
	#alt ul{padding:0; margin:0;}
	#alt li{padding:0; margin:6px 0; list-style:none; font-size:16px; color:#fff;}
	#alt li em{font-size:14px; color:#f1f1f1;}
	#alt li a{color:#fff;}
	#alt .social{ display: grid; 	  grid-template-columns: repeat(5, 1fr); gap: 15px; }
	#alt .social i{ font-size:2em;}
		
	.copys {padding:10px 0; font-size:12px; border-top: 1px solid #ffffff;}
	.copys .alan{ font-size:12px; }
	
	
	#logo {max-width:200px;}
	#logo img{width:150px; height:auto;}
	
	
	#ust ikon{display:none;}
	#ust .arama{position:absolute; max-width:300px; z-index:100; right:0; padding:10px; background: #343e47; display: -webkit-flex;  justify-content: flex-end; display:none;}
	#ust .arama em{font-size:1.6em; border-radius: 0 5px 5px 0; padding: 0 5px; max-width:40px; position:absolute;  left;2px; background: #4e5a64;}
	#ust .arama em, #ust .arama input{margin:0px 2px; }
	#ust .arama input{border:0; font-size:16px; padding:2px 30px 1px 5px; width:90%; background-color: #ffffff;border: 1px solid #c0c0c0; border-radius:5px;  font-weight:300; font-family:calibri; }
	#ust .arama input:focus{outline:none;	border: 0px solid #a5c2f2;   	box-shadow: 0 0 5px rgba(81, 203, 238, 1);	border: 0px solid rgba(81, 203, 238, 1); }

	#navi ul{width:100%; padding:0; margin:0; text-align:center;  display: -webkit-flex;  justify-content: flex-end;}
	#navi ul a{  color:#fff;}
	#navi ul li{ cursor:pointer; font-size:18px; width:100%; max-width:120px; user-select: none; display:block; margin:5px 1px;  list-style:none;  text-align:center; position:relative;}
	#navi ul .borders{width:0px; height:30px;  display:block;  position:absolute; font-size:5px; color:#208ccb; border-radius:5px; border:0; left:50%; bottom:1px; background:#073455; z-Index:15; transition: all 0.5s;}
	#navi ul .texts{border-bottom: 0px solid #208ccb; border-radius:5px; position:relative;  display:table; width:calc(100% - 20px);  color:#fff;  padding:5px 10px; text-align:center; left:0; z-Index:16; transition: all 0.5s;} 

	#navi ul li:hover .borders, #navi ul .secili .borders{ width:100%; left:0; transition: all 0.5s;}
	#navi ul li:hover .texts, #navi ul .secili .texts{ color:#ffffff; transition: all 0.8s;}


	#slider { background-color: rgba(255, 255, 255, 0.6); position:sticky; position:relative; overflow: hidden;  width:100%; max-width:100%; display:block;}
	
	
	#slider .table{position:relative; margin:0; padding:0; display:block; width:100%; max-width:100%;  overflow: hidden; height:90vh; }  
	#slider .table img{width:100%; height:auto;} /*ebenin ki*/
	
	#slider .desc {
	  position: absolute;
	  display: table;
	  width: calc(100% - 50px);
	  max-width: calc(1200px - 50px);
	  background-color: rgba(14, 131, 175, 0.6);
	  padding: 10px 25px;
	  bottom: 5px;
	  left: 50%; 
	  border-radius:0px;
	  transform: translateX(-50%); 
	  color:#ffffff;
	  animation: slideOuts 0.3s ease-out forwards;
	  animation-delay: 0s;
	}
	#slider .active .desc {
	  animation: descSlideUp 0.6s ease-out forwards;
	  animation-delay: 0.2s;
	}
	#slider .desc h2 {
	  font-size: 26px;
	  transform: translateY(50px);
	  opacity: 0;
	}
	#slider .active .desc h2 {
	  animation: slideUps 0.5s ease-out forwards;
	  animation-delay: 0.8s;
	}

	#slider .desc p {
	  font-size: 18px;
	  transform: translateY(50px);
	  opacity: 0;
	}
	#slider .active .desc p {
	  animation: slideUps 0.5s ease-out forwards;
	  animation-delay: 1.4s;
	}
	@keyframes slideUps {
	  to {
		transform: translateY(0);
		opacity: 1;
	  }
	}
	@keyframes slideOuts {
	  to {
		transform: translateX(-50%);
		opacity: 0;
	  }
	}
	/* DESC sadece yukarı çıkıyor, X sabit */ 
	@keyframes descSlideUp {
	  from {
		transform: translateX(-50%) translateY(100px);
		opacity: 0;
	  }
	  to {
		transform: translateX(-50%) translateY(0);
		opacity: 1;
	  }
	}
	/* h2 ve p için ortak animasyon */



	
	.icerik {display:block; background-color: rgba(255, 255, 255, 0.5);  margin:5px 0; border-radius:5px; padding:15px;}
	.icerik.onizle {display: flex; justify-content: space-between;}
	.icerik.onizle .alan{width:100%; padding:15px;}
	.icerik.onizle img{width:100%; max-width:40%; height:auto; border-radius: 70px 0 70px 0;}
	.icerik .yorumlar{}
	.icerik .yorum{margin-bottom:15px; border-radius:10px; font-size:14px; padding:15px 5px 5px 15px; display:block; background-color: #c4f0ea; }
	.icerik .yorum .baslik{padding:2px 0px 10px 0px; margin:0; }
	.icerik .tarih{margin:0 10px; padding:0; font-size:12px; font-weight:300; }

	.icerik .info{display:flex; display: -webkit-flex;  justify-content:flex-end; color:#000; width:calc(100% - 10px); font-size:12px; padding:0px; margin:5px 0 0 0; }
	.icerik .info div{display:block; width:100%; margin:2px; padding:5px; }
	.icerik .info .begeni, .icerik .info .yorum{position:relative;max-width:100px; background:#f1f1f1; border-radius:5px;transition:all 0.5s;}
	.icerik .info .aktif{background:#008775; color:#fff; transition:all 0.5s;}
	.icerik .say{position:absolute; right:2px; top:4px; border-radius:50%; background-color:#000000; display:none; color:#fff; padding:2px 1px; min-width:15px; text-align:center; font-size:10px;}
	.icerik .info .aktif .say{background:#fff; color:#008775; transition:all 0.5s;}
	
	
	
.icerdgdgik .code { display:block; width:auto; padding:0; margin:10px 0; background-color: #1e1e1e;}
.icerik pre {
	scrollbar-width:thin; scrollbar-color: #999 #000;
	max-height:300px;
  overflow-x: auto;
  padding: 1em;
  background-color: #1e1e1e;
  color: #f8f8f2;
  border-radius: 8px;
  margin-bottom: 1rem;
  max-width: 100%;
  display: block;
  box-sizing: border-box;
  white-space: pre; /* satır kaydırma yok, yatay scroll */
  word-wrap: normal; /* kelime kırmasın */
}

.icerik code { 
  font-family: 'Fira Code', monospace;
  font-size: 14px;
  line-height: 1.5;
  display: inline-block;
  white-space: pre;
}
	.sidebar .listele{ display:block; width:100%; margin:0px 0; border-radius:0px; padding:0px;}
	.sidebar .liste { background-color: rgba(255, 255, 255, 0.3); cursor:pointer; width:calc(100% - 20px); font-size:16px; position:relative; display:block; margin : 1px 0; padding: 5px 10px;  border-radius:5px;  transition:all 0.5s; }
	.sidebar .liste:hover {background-color:#fff; transition:all 0.5s;}
	
	.pages .listele{ background-color: rgba(255, 255, 255, 0.3); margin:5px 0; border-radius:5px; padding:15px;}
	.pages .listele h1{padding:0; margin:0 0 10px 0;  }
	.pages .listele .alan-baslik{padding:3px 0 3px 5px; margin:0 0 10px 0; display:block; border-left: 10px solid #3c728c; border-right: 2px solid #3c728c;} 
	.pages .listele .grid-container {	  display: grid;	  grid-template-columns: repeat(3, 1fr); gap: 15px; transition:all 0.5s;	}
	.pages .listele .grid-container.iletisim {	 grid-template-columns: repeat(2, 1fr); 	}
	.pages .listele .grid-container.iletisim .liste{display:flex; padding: 5px 15px 5px 15px;  justify-content:flex-start; border-radius:5px;	background-color:#41628b;color:#ffffff;	}
	.pages .listele .grid-container.iletisim .liste i{ display:block; font-size:3em;	}
	.pages .listele .grid-container.iletisim .liste .dat{width:100%; display:block; font-size:25px; padding:10px 10px;	}   
	
	.pages .listele .liste {background:#fff; width:calc(100% - 30px); position:relative; border-radius:10px; display:block; margin : 0; padding: 15px 15px 15px 15px;}


	.pages .list .liste {margin-bottom:5px;}
	.pages .listele .liste .veri { width:100%; display:block;}
	.pages .listele .liste .veri a{color:#000;  text-decoration: none;}
	.pages .listele .liste .veri .baslik{ padding:0; margin:0; font-size:18px;}
	.pages .listele .liste .veri .text{ font-size:14px; padding:5px 0; margin:0;}
	.pages .listele .liste .resim{width:100%;  display:block; overflow: hidden; border-radius:10px; max-height:200px; margin:5px 0; transition:all 0.5s;}
	.pages .listele .liste .resim img{width:100%; height:auto; border-radius:10px; }
	.pages .listele .liste .resim i{font-size:6em; margin-bottom:10px; color:#2aa1b7; text-align:center; width:100%; }
	.pages .listele .liste .info{background:#fff; display:flex; display: -webkit-flex;  justify-content:flex-end; left:5px; position:absolute;bottom:5px; color:#000; width:calc(100% - 10px); font-size:12px; padding:0px; margin:0; }
	.pages .listele .liste .info .alan{display:block; width:100%; margin:2px; padding:5px; }
	.pages .listele .liste .info .begeni, .pages .listele .liste .info .yorum{position:relative;max-width:70px; background:#f1f1f1; border-radius:5px;transition:all 0.5s;}
	.pages .listele .liste .info .aktif{background:#008775; color:#fff; transition:all 0.5s;}
	.pages .listele .liste .say{position:absolute; right:2px; top:4px; border-radius:50%; background-color:#000000; display:none; color:#fff; padding:2px 1px; min-width:15px; text-align:center; font-size:10px;}
	.pages .listele .liste .info .aktif .say{background:#fff; color:#008775; transition:all 0.5s;}

	.pages .listele .grid-container.kategori {	 grid-template-columns: repeat(1, 1fr);	} 
	.pages .listele .grid-container.kategori .liste { display:flex; display: -webkit-flex;  justify-content: flex-end; transition:all 0.5s;}
	.pages .listele .grid-container.kategori .liste .resim{width:100%; display:block; max-width:200px; margin:5px; display:block;transition:all 0.5s;}
	.pages .listele .grid-container.kategori .liste .resim img{width:100%; border-radius:5px; transition:all 0.5s;}

	.pages .listele .grid-container.hizmet { grid-template-columns: repeat(3, 1fr);	}
	.pages .listele .grid-container.hizmet .liste { width:100%;  border-radius:10px; padding: 0px; }  
	.pages .listele .grid-container.hizmet .liste .veri{color:#fff; font-size:.8em; background-color: rgba(14, 131, 175, 0.7); position:absolute; width:calc(100% - 40px); bottom:5px; left:5px; padding:15px 15px; border-radius:10px; }   
	.pages .listele .grid-container.hizmet .liste .veri a{color:#fff;  text-decoration: none;} 
	.pages .listele .grid-container.hizmet .liste .resim{width:100%; max-height:350px; display:block; max-width:100%; margin:0px; display:block;transition:all 0.5s;}
	.pages .listele .grid-container.hizmet .liste .resim img{width:100%;  border-radius:5px; } 

/*background-color: rgba(88, 102, 140, 0.8);*/

	.animasyon {opacity: 0; } 
	.animasyon .veri{transform: translateY(100px);   opacity: 0;  animation: listeUp 0.5s ease-out forwards; animation-delay: 0.6s; }
	.leftoynat {transform: translateX(-100px); opacity: 0;	animation: listecenter 0.5s ease-out forwards; }
	.rightoynat {transform: translateX(100px); opacity: 0;	animation: listecenter 0.5s ease-out forwards; }
	.bottomoynat {transform: translateY(100px); opacity: 0;	animation: listeUp 0.5s ease-out forwards; }
	.animasyon .veri, 
	.leftoynat, 
	.rightoynat, 
	.bottomoynat {
	  will-change: transform, opacity;
	}

	@keyframes listeUp { 
	  to {
		opacity: 1;
		transform: translateY(0);
	  }
	}
	@keyframes listecenter { 
	  to {
		opacity: 1;
		transform: translateX(0);
	  }
	}
	



/*background-color: rgba(14, 131, 175, 0.7);  */

	.sidebar{ max-width: 320px; margin:5px 0; border-radius:5px; padding:15px;}
	.sidebar .sticky{ position: sticky;  top: 0px; }
	.sidebar .hucre{display:block; width:calc(100% - 10px);;  margin-bottom:10px; padding:5px; border-radius:5px; border-bottom: 2px solid #3c728c; }
	.sidebar .hucre .baslik{padding:5px; margin:0; color: #3c728c;}
	.sidebar .hucre .baslik i{color: #3c728c;}
	.sidebar .listele.social {display: grid;	  grid-template-columns: repeat(3, 1fr); gap: 5px;}
	.sidebar .listele.social .liste.ikon {font-size:3.5em; text-align:center; color: #343e47;}



	.JsonList { display:block; border-radius:0 0 5px 5px; width:250px; padding:2px 0 10px 0; position:absolute; top:0px; right:0;  background-image: linear-gradient(to top, #f1f1f1 , #e3e2e1); z-index:200; text-align:left; box-shadow: .5px 1.5px 1.5px rgba(0, 0, 0, .2);}	 

	.JsonList .title{ font-size:18px; color: #42485f; font-weight:300;border-bottom: 0px solid #ee6d17; padding:5px 5px; margin:0; font-family:'lucida grande',tahoma,verdana,arial,sans-serif;}	 
	.JsonList .title i{ font-size:20px; text-align:center; width:25px;}	 
	.JsonList ul{ display:block; padding:0px 1%; margin:0; width:98%; list-style:none; }	 
	.JsonList li{ display:table; width:96%; background:#fff; cursor:pointer; padding:5px 2%; margin:3px 0; border-radius:3px; font-size: 15px;  color:#000;  border-bottom: 0px solid #fff; transition: all 0.3s;}	
	.JsonList li:hover{ background:#f1f1f1; border-bottom: 0px solid #fff; color:#555; transition: all 0.3s;}	
	.JsonList li i{ width:30px; max-width:30px; color:000; font-size:18px; padding:0; margin:1px; text-align:center; }	
	.JsonList li span{ font-size: 15px; padding:1px; margin:0; font-weight:300; }	
	.JsonList .kapat{ position:absolute; font-size:2em; top:5px; right:5px; color:#000; cursor:pointer;}	

	#pagenavi {	display:block; width:100%; position: sticky;  top: 0px; z-Index:99; }
	#pagenavi .listele{background:#fff; margin:5px 0; border-radius:5px; padding:15px;}
	#pagenavi a{padding:5px;}



form  {padding:10px;}
form  label{padding:2px 0; margin:3px 0; display: flex; justify-content: space-between; width:100%; font-family:tahoma; font-size:12px;}
form  .title{width:100%; max-width:200px; padding:5px 1%; text-align:right; margin:0; color:#000; font-size:16px;}
form  .inp{width:100%; display: flex; justify-content: space-between;  font-family:'lucida grande',tahoma,verdana,arial,sans-serif;}

form input, form textarea, form select{border:0; font-size:18px; padding:5px 4%; width:100%; background-color: #ffffff;border: 1px solid #c0c0c0; border-radius:10px;  font-weight:300; font-family:calibri; 
}
form textarea{height:100px;}
form input:focus, form textarea:focus, form select:focus{
	border: 1px solid #a5c2f2;   
	box-shadow: 0 0 5px rgba(81, 203, 238, 1);
	border: 1px solid rgba(81, 203, 238, 1); 
}



.butonset button {font-size:18px; padding:0; width:100%; background-color: #588faa;border: 0px solid #02a193; font-weight:300; font-family:calibri; font-size:18px; font-weight:900; margin:3px 0; text-align:left;color:#fff; border-radius:5px; position:relative; cursor:pointer;box-shadow: 0.5px 0.5px 3px rgba(0, 0, 0, .5); display: flex; justify-content: space-between;  align-items: center; height:35px; transition: all 0.05s;}
.butonset button .blayer{position:absolute; overflow:hidden; border-radius:5px 0 0 5px; left:0px; top:0px; width:100%; max-width:50px; height:35px;padding:0; margin:0;background-color: #3c728c; display:block; z-Index:4; transition: all 0.65s;cursor:pointer;}
.butonset button i{text-align:center; width:100%;  display:block; max-width:50px;  font-size:1.3em; z-Index:10;transform: rotate(0deg);transition: all 0.75s;}

.butonset button .btext{text-transform: uppercase; width:100%; font-size:20px; padding:0 0 0 10px ;  margin:0;display:block; z-Index:10;cursor:pointer;}
.butonset button:hover .blayer, .butonset button:focus .blayer{ border-radius:5px; width:100%;  max-width:100%; border-radius:5px; transition: all 0.65s;}
.butonset button:hover i{  transition: all 0.75s;}
.butonset button:focus{ box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); transition: all 0.02s;}



.Bilgi-mesaji {position:relative;  width: 98%; display: -webkit-flex;  justify-content: space-between; color:#000; margin:5px 0; padding: 10px 1%; border-radius:5px; background-color:#f6f3bc; border: 0px solid #eae45f; cursor:pointer;  transition: all 0.65s;}
.Bilgi-mesaji span, .Bilgi-mesaji p, .Bilgi-mesaji h4,  .Bilgi-mesaji ul{position:relative; display:block; width:100%; padding:2px; margin:0; text-align:left;}
.Bilgi-mesaji h4{font-weight:900; padding:0 2px;}
.Bilgi-mesaji .isclose{font-size:1.6em; color:#555555; position:absolute; top:2px; right:5px;} 
.Bilgi-mesaji .detay{background-color:#fff; border-radius:5px; width:100%; overflow: auto; max-height:100px;} 
.Bilgi-mesaji li{list-style:none; padding:2px; font-size:14px;}
.Bilgi-mesaji .liste{text-align:left; border:0; }
.Bilgi-mesaji .liste label{text-align:left; width:100%;}
.Bilgi-mesaji .icon{ display:block; text-align:center; width:100%; max-width:60px; min-width:50px; font-size:2em;}

.error{ background-color:#ffe2e0; color:#000; border: 0px solid #ff837b; cursor:pointer;  transition: all 0.65s;}
.error .icon{ color:#ff837b; cursor:pointer;}

.success{ background-color:#c6facb; color:#000; border: 0px solid #4af159; cursor:pointer;  transition: all 0.65s;}
.success .icon{ color:#4af159; cursor:pointer;}

@media only screen and (max-width: 1200px) {
	.sidebar{ max-width: 300px; margin:5px; border-radius:5px; padding:10px; transition:all 0.5s;}
	.pages .listele .grid-container {grid-template-columns: repeat(1, 1fr); transition:all 0.5s;}
	.pages .listele .liste { display:flex; display: -webkit-flex;  justify-content: flex-end; transition:all 0.5s;}
	.pages .listele .liste .resim{width:100%; display:block; max-width:200px; margin:5px; display:block;transition:all 0.5s;}
	.pages .listele .liste .resim img{width:100%; border-radius:5px; transition:all 0.5s;}
}
@media only screen and (max-width: 800px) {
	.sidebar{ max-width: calc(100% - 20px); margin:5px; border-radius:5px; padding:5px;transition:all 0.5s;}
	#slider .table{position:relative; height:70vh; transition:all 0.5s;}
	#slider .desc h2 {	  font-size: 24px;	}
	#slider .desc p {	  font-size: 16px;	}

	.table { display: table; }
	#ust {padding:2px 0; }
	#ust .table {display:none;  display: flex; justify-content: space-between; }
	#alt .alan, #ust .alan{width:calc(100% - 20px); padding: 5px 10px;}
	.menu {display:block; width:90%; position:fixed;  background-color: #343e47; z-Index:999; min-height:92vh; left:-100%; top:50px; transition: all 0.5s;}
	.mobilnavi{display:block; width:90%; position:fixed;  background-color: #343e47; z-Index:999; min-height:calc(100vh - 50px); left:0; top:50px; transition: all 0.5s;}
	#navi ul{width:100%; padding:0; margin:0; text-align:left;  display:block;}
	#navi ul li{max-width:100%; padding:0;margin:0;  text-align:left;  display:block;}
	#logo {max-width:100%; text-align:center; }
	#logo img{width:120px; height:auto;}

	#ust .ikon{font-size:1.6em; margin:10px; width:40px;}
	#ust .mobilmenu{display:block;}
	

	
	.pages .listele{margin:5px 0px; border-radius:0px; display:block; padding:10px 10px;transition:all 0.5s;}
	.pages .listele .liste, .pages .listele .grid-container.kategori .liste { display:block; width:calc(100% - 10px); padding: 5px; transition:all 0.5s;}
	.pages .listele .liste .resim, .pages .listele .grid-container.kategori .liste .resim {width:100%; overflow: hidden; max-width:100%; display:block; max-height:200px; margin:0px; transition:all 0.5s;}
	.pages .listele .liste img{width:100%; border-radius:5px; transition:all 0.5s;}
	.pages .listele .grid-container.hizmet {	 grid-template-columns: repeat(1, 1fr);	}
	.pages .listele .grid-container.hizmet .liste {  border-radius:10px; padding: 0px; } 

	.icerik.onizle {display: block;}
	.icerik.onizle .alan{width:calc(100% - 10px); padding:10px 5px;}
	.icerik.onizle img{width:calc(100% - 10px); max-width:calc(100% - 10px); height:auto; border-radius: 70px 0 70px 0;}
	.hizlibuton {position:fixed; bottom:0; margin:0; padding:0; z-index:999;}
	.hizlibuton .pages{padding:0; margin:0;transition:all 0.5s;}  
	.hizlibuton .pages .listele{background-color: rgba(255, 255, 255, 0.7); width:calc(100% - 10px); padding:5px; margin:0; transition:all 0.5s;}  

	
	.pages .listele .grid-container.iletisim {	 grid-template-columns: repeat(2, 1fr); gap:5px;	}
	.pages .listele .grid-container.iletisim .liste{display:flex; padding: 5px ;  justify-content:flex-start; border-radius:5px;	background-color:#41628b;color:#ffffff;	}
	.pages .listele .grid-container.iletisim .liste i{ display:block; font-size:2em;	}
	.pages .listele .grid-container.iletisim .liste .dat{width:100%; display:block; font-size:18px; padding:5px;	}  
	.pages .listele .grid-container.iletisim .liste .dat small{display:none;	}  
	
	
	.icerik pre {	  max-width: 320px;}

	.JsonList { display:block; border-radius:0 0 5px 5px; width:100%; padding:2px 0 10px 0; position:fixed; top:100vh;  right:0;  background-image: linear-gradient(to top, #f1f1f1 , #e3e2e1); z-index:200; text-align:left; box-shadow: .5px 1.5px 1.5px rgba(0, 0, 0, .2); animation: slideUp 0.6s ease forwards;}


	form  label{padding:2px 0; margin:3px 0; display: block; width:100%; font-family:tahoma; font-size:12px;}
	form  .title{width:100%; max-width:100%; padding:5px 0; display:none; text-align:left; margin:0; color:#000; font-size:14px;}

	

}



.skeleton-card {
  animation: pulse 1.5s infinite ease-in-out;
}

.skeleton-card .veri {
	margin-top:10px;
}
.skeleton-card .veri .baslik{
	height:20px;
	background: #f1f1f1;
	border-radius: 5px;
	margin:5px 0;
	width:100%;
}
.skeleton-card .veri .saat{
	height:16px;
	width:150px;
	background: #f1f1f1;
	border-radius: 5px;
	margin:3px 0;
}
.skeleton-card .veri .bosluk{
	height:5px;
	display:block;
}
.skeleton-card .veri .text{
	height:100px;
	display:block;
	background: #f1f1f1;
	border-radius: 5px;
	width:100%;
}
.skeleton-card .resim {
  background: #000;
  height: 140px;
  background: #d8d6d6;
  border-radius: 10px;
}

@keyframes pulse {
  0% {
    background-color: #e0e0e0;
  }
  50% {
    background-color: #ffffff;
  }
  100% {
    background-color: #e0e0e0;
  }
}

@keyframes slideUp {
  0% {
    top: 100vh;
    opacity: 0;
  }
  100% {
    top: calc(100vh - 200px); /* ekranın altından 200px yukarı çıkacak şekilde ayarla */
    opacity: 1;
  }
}
@media only screen and (min-width: 800px) {
#fix-iletisim {
  position: fixed;
  right: 5%;
  top: 100px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 999;
}

#fix-iletisim .alan {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 40px; 
  height: 40px;
  padding: 10px;
  border-radius: 50px;
  border: solid 2px #f7f7f7;
  background: #444;
  overflow: visible;
  transition: all 0.3s ease;
  text-decoration: none;
}

#fix-iletisim .alan i {
  font-size: 30px;
  color: #fff;
  width: 40px;
  min-width: 30px;
  text-align: center;
  z-index: 2;
}

#fix-iletisim .alan span {
  position: absolute;
  right: 30px; 
  background: inherit;
  color: #fff;
  border-left: solid 2px #f7f7f7;
  padding: 15px 20px;
  white-space: nowrap;
  border-radius: 30px 0 0 30px;
  opacity: 0;
  transform: translateX(10px)
  pointer-events: none;
  transition: all 0.7s ease;
  font-size: 16px;
}

#fix-iletisim .alan:hover span {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-10px);
}
}
@media only screen and (max-width: 800px) {
#fix-iletisim {
  position: fixed;
  right: 15px;
  bottom: 10px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  z-index: 999;
}

#fix-iletisim .alan {
  border: solid 2px #f7f7f7;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 40px; 
  height: 40px;
  padding: 5px;
  border-radius: 50px;
  background: #444;
  overflow: visible;
  transition: all 0.3s ease;
  text-decoration: none;
}

#fix-iletisim .alan i {
  font-size: 30px;
  color: #fff;
  width: 40px;
  min-width: 30px;
  text-align: center;
  z-index: 2;
}

#fix-iletisim .alan span {
  position: absolute;
  right: 20px; 
  background: inherit;
  color: #fff;
  padding: 5px 20px;
  white-space: nowrap;
  border-radius: 30px 0 0 30px;
  border-left: solid 2px #f7f7f7;
  opacity: 1;
  transform: translateX(10px)
  pointer-events: none;
  transition: all 1.3s ease;
  font-size: 14px;
}

#fix-iletisim .alan:hover span {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-10px);
}
}