:root {
	--renk1 : #000;
	--renk2 : #f00;
	--yok   : none;
	--fs1   : 18px;
	--fs2   : 14px;
}

body { 
	font-family : -apple-system, BlinkMacSystemFont,"Segoe UI", Roboto, "Helvetica Neue", Arial,sans-serif;
	font-size : var(--fs1);
	color: #222;
	background: #eee;
}

#logo { display: block; padding: 10px 0; margin: 10px 0 }
#preloade {
    background: #fff none repeat scroll 0 0;
    bottom: 0;
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99999;
    text-align: center;
}

#preloadex {
    position: absolute;
    left:50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 300px;
    height: 400px;
    background: url(/image/logo/logo.png) center center no-repeat;
}
.ortala { background: #fff }
#sol { padding: 0 30px; position: relative; overflow: hidden; }

a, a:link, a:visited { font-size: var(--fs1); color:#000; text-decoration:none }

h1 { font-size: 30px; margin-bottom: 20px }
h2 { font-size: 24px; margin-bottom: 10px }
h3 { font-size: 20px; margin-bottom: 8px }

.alt_baslik { padding: 10px; position: sticky; top:0px; background: var(--renk1); color: #fff }
.anakat { margin-bottom: 30px; margin-left: -10px; margin-right: -10px }
.anakat b, h3 { text-transform: capitalize; }

#ekmek { color: #000 }
#ekmek ul li { list-style-type: none; position: relative; display: inline-block; margin-right: 10px }
#ekmek ul li a { display: block; padding: 10px 5px; }
#ekmek ul li:after {
	content: "\f105"; position: absolute; 
	right: -20px; top: 5px; width: 25px;
	text-align: center;	font: normal normal normal 30px/1 FontAwesome;

}
#ekmek ul li:last-child:after { 
	content: '';
}
#uye-giris { margin-top: 15px; margin-bottom: 25px }

.arama_form {
    margin-bottom: 25px
}

#sosyal { margin-bottom: 25px }
.arama { margin: 15px 0; display: flex; }
.arama input { height: 40px; font-size: 20px; padding-left: 8px; width: 100% }
.arama button { background: #000; color: #fff; height: 40px; width: 40px;
    line-height: 40px; text-align: center; border: none; outline: none }

.tarif, .malzeme { margin-bottom: 50px }
.tanim { margin: 15px 0 }

.tanim .fa { font-size: 50px }
.tanim .td div { display: flex; }
.tanim .td div div { display: block; margin-left: 10px }
.tanim .td div div span { display: block; text-align: center; margin-top: -8px }
.tanim .td div div span:nth-child(1) { font-size: 35px; font-weight: bold }

.sticky { position:sticky; top: 0px; z-index: 3 }

.baslik { padding:10px; background: #fff; }
.baslik h1 { text-transform: capitalize; margin-bottom: 10px; }
.tarif_alan {margin: 15px }
.tarif_alan li {
	padding: 5px 0 10px 5px;
    margin: 5px 0 5px 30px;
}

.detaylar .td { text-align: center; font-size: 14px }

.konu_foto { position: relative; overflow: hidden; padding:10px; border:1px solid #ddd; 
	display: inline-block; margin-bottom: 20px
}

.icerik p { margin:13px 0; }
#top {
    position: fixed;
    bottom: 30px;
    right: 40px;
    display: none;
}
#top i {
    background: var(--renk1);
    color: #fff;
    font-size: 30px;
    padding: 3px 10px 8px 10px;
}

footer { padding:20px 0; }
@media ( max-width: 980px) {
	#tarif_foto { margin: 0 !important }
}
@media (max-width: 560px) {
	#tarif_foto #zor { font-size: 20px; line-height: 20px; padding:5px; }
}
.zor0 { background: green; color: white }
.zor1 { background: orange; color: white }
.zor2 { background: red; color: white }

nav { background: var(--renk1); }
nav .ortala { background: none; }
nav .ortala .jqueryslidemenu ul ul { z-index: 9999 }