/* dark:#212529, dark-secondary:#6c757d, light:#f8f9fa, light-secondary:#EDEDED */
/* Importing Google font - Poppins */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
* {margin:0; padding:0; box-sizing:border-box; font-family:'Poppins', sans-serif;}
a{text-decoration:none}
h1 {font-size:1.5rem; font-weight:bold; color:#666; line-height:25px}
h2,h3,h4,h5,h6 {font-size:1.3rem; font-weight:bold; color:#666; line-height:25px}
p {font-size:1rem; color:#666; font-size:0.95rem;}
header {position:absolute; top:0; left:0; width:100%; padding:10px 0; background:transparent;}
header .navbar {display:flex; align-items:center; justify-content:space-between; max-width:90%; margin:0 auto;}
.logo img{height:60px}
#menu2{display:none}
#menu1 ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:row; gap:30px;}
#menu1 ul li{ float:left; }
#menu1 ul li a{ display:block; color:#f8f9fa; text-align:center; line-height:70px;}
#menu1 ul li a:hover{color:#ff7043;}
.ana-container {height:100vh; background-image:linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0)),url('resimler/bloghanem-anasayfa.webp'); background-position:center; background-size:cover; display:flex; align-items:center; padding:0;}
.ana-container .ana-slogan {margin:0 auto; width:90%; color: #fff;}
.ana-container .ana-slogan .ana-slogan-buyuk {font-size:2.2rem; max-width:600px; line-height:50px; color:white}
.ana-container .ana-slogan .ana-slogan-kucuk {font-size:1.1rem;font-weight:400; max-width:600px; margin-top:15px; color:white}
.ana-container .ana-slogan .ana-buton {background:#fff; padding:12px 30px; border:none; font-size:1rem; border-radius:6px; margin-top:38px; cursor:pointer; font-weight:500; transition: 0.2s ease;}
.ana-container .ana-slogan .ana-buton:hover {color:#fff; background:#ff7043;;}
.search-container {display: flex;}
.search-input {padding:10px; border:1px solid #ccc; border-radius:5px 0 0 5px; outline:none; background:transparent; color:#fff; width:150px}
.search-input:focus{outline:0; border:1px solid #ff7043; transition:0.3s ease;}
.search-button {padding: 10px; color:#fff; background-color:#ff7043; border:1px solid #ffffff50; border-radius:0 5px 5px 0; cursor:pointer; outline:none; transition:0.3s ease;}
.search-button:hover {color:#ff7043; background-color:#fff;}
.fade-in-out {opacity:0; transform:translateY(40px); animation:fadeInUp 1.5s ease-out forwards;}
@keyframes fadeInUp {to{opacity:1; transform:translateY(0);}}
.genel-container {width:90%; margin:0 auto; border:0px solid red; display:flex; flex-direction:row; justify-content:space-between; padding:30px 0}
.genel-container-sol {width:70%; border:0px solid red; display:flex; flex-direction:column;}
.genel-container-blog {width:100%; margin-bottom:10px; border:0px solid red; display:flex; flex-direction:column; cursor:pointer; border-radius:5px;}
.genel-container-blog p {text-indent:20px; margin-top:5px;}
.genel-container-blog ul li {margin-left:40px; color:#666; font-size:0.95rem;}
.genel-container-blog ol li {margin-left:40px; color:#666; font-size:0.95rem;}
.genel-container-blog a {color:#666}
.genel-container-blog form {border-radius: 10px; width:100%;}
.genel-container-blog label {display:block; color:#ff7043;}
.genel-container-blog input[type="email"], textarea {width:100%; padding:10px; margin:15px auto; border:1px solid #ccc; border-radius:4px; box-sizing: border-box;}
.genel-container-blog input[type="submit"] {color:#fff; background:#ff7043; padding:10px 15px; border: none; border-radius:4px; cursor:pointer;}
.genel-container-blog input[type="submit"]:hover {background:#e35022}
.genel-container-blog-ozet {width:100%; margin-bottom:10px; border:0px solid red; display:flex; flex-direction:column; padding:10px; cursor:pointer; border-radius:5px; background:#FFF}
.genel-container-blog-ozet p {color:#666; font-size:0.95rem;}
.genel-container-blog-ozet img {margin-right:10px; float:left; height:100px; max-width:50%; margin-top:5px}
.kategoriler-baslik {font-size:1.3rem; font-weight:bold; color:white; line-height:25px; background:#ff7043; padding:5px; border-radius:3px; margin-bottom:5px}
.devam-buton {color:#ff7043}
.devam-buton:hover {text-decoration: underline;}
.sayfalama{margin: 20px auto}
.genel-container-sag {width:25%; border:0px solid red; display:flex; flex-direction:column; background:#FFF;  padding:10px; margin-bottom:10px; border-radius:5px;}
.genel-container-sag ul{margin-left:25px}
.genel-container-sag ul li {cursor:pointer; color:#6c757d; font-size:0.95rem;}
.genel-container-sag ul li:hover {color:#ff7043}
.container-bulten{width:100%;  margin-bottom:50px; height:300px; background-image:linear-gradient(rgba(0,0,0,0.9),rgba(0,0,0,0.3)),url(''); background-position:center; background-size:cover; background-attachment:fixed; display:flex; align-items:center; vertical-align:center; flex-direction:column; justify-content:center}
.container-bulten p {color:#EDEDED; font-size:1.2rem; text-align:center}
.bulten-form {margin-top:10px; max-width:90%}
.bulten-form input {width: 70%;padding: 10px; border-radius:4px; border: none;outline: none;}
.bulten-form button {width: 28%;padding: 10px;background-color:#ff7043;color: #fff;border: none;border-radius: 4px;cursor: pointer;outline: none;}
.bulten-form button:hover {background-color:#e35022}

.containerSection{width:90%; margin:50px auto;}
.containerSection h1, .anasayfa-basliklar {font-size:1.6rem; font-weight:bold; text-indent:20px; margin:10px auto; text-align:center}
.containerSection img {float:right; width:400px; max-width:50%}
.containerSection p {text-indent:20px; margin-top:5px;}
.containerSectionlar{width:90%; margin:20px auto; display:flex; flex-wrap:wrap; flex-direction:row; justify-content:space-between}

.footer {width:100%; position:relative; margin-top:-160px; height:height; clear:both; background:#212529; font-size:0.9rem; color:silver; text-align:center; line-height:50px; text-decoration:none; margin:10px 0 0 0; padding:0 0 20px 0 }
.footerTop{ width:90%; margin:0 auto; position:relative; display:flex; flex-direction:row; justify-content:space-between; flex-wrap:wrap;}
.footer1{display:flex; flex-direction:column; width:20%; height:auto; display:flex; flex-direction:column; text-align:left}
.footerTitle{line-height:30px; margin-top:40px; color:white;}
.footerlink{padding:0; color:silver; line-height:30px; margin-top:10px; font-size:0.9rem; font-weight:normal;}
.footercizgi{width:90%; text-align:center; height:1px; background-color:rgba(255,255,255,.5); margin:20px auto; padding:20px auto }
.footerBottom{ width:90%; margin:0 auto; position:relative; display:flex; flex-direction:row; justify-content:space-between; flex-wrap:wrap;}
.footer a:hover{color:white}
.sosyal{width:40px}
.sosyal:hover{transform:rotate(360deg); transition:1s}

.contact-container{width:100%; margin:0 auto; display:flex; flex-direction:row; justify-content:space-between;}
.map-container{width:60%; height:auto; border:1px solid #ddd;}
.contact-info {width:40%; padding-left: 20px;}
.contact-info i {color:#ff7043;}

@media only screen and (min-width:768px) and (max-width:1000px){
.contact-container{width:90%; margin:0 auto; display:flex; flex-direction:column; justify-content:center;}
.map-container{width:100%; height:400px; border:1px solid #ddd;}
.contact-info {width:100%; padding-left:0; padding-top: 20px;}
}



@media (max-width:768px) {
#menu1{display:none}
#menu2{display:block}
.logo img{height:60px}
.menuac{background-color:transparent; border:none; color:white}
.menu-ac a{color: #fff; text-decoration:none;}
.overlay {display: none;position: fixed;width: 100%;height: 100%;top: 0;left: 0;background-color: rgba(0, 0, 0, 0.7);z-index: 1;}
.mobil-menu{height:100%; width:0px; position:fixed; z-index:1; top:0; left:0; background:#f8f9fa; overflow-x:hidden; padding-top:50px; transition:0.3s ease}
.mobil-menu a {padding-left:20px; margin-top:20px; color:#212529; text-decoration:none; font-size:20px; display:block}
.mobil-menu a:hover{color:#fea202;}
.menu-kapat{position:absolute; top:0; right:0; transition:0.5s}	
.search-container{display:none}
.search-container-mobil{margin-left:20px; margin-top:20px; display:flex; flex-direction:row; flex-wrap:no-wrap}
.search-input {width:75%}
.ana-container {height:93vh;}
.ana-container .ana-slogan {text-align:center;}
.ana-container .ana-slogan .ana-slogan-buyuk {font-size:1.5rem;line-height:35px;}
.ana-container .ana-slogan .ana-slogan-kucuk {font-weight:300;}
.ana-container .ana-slogan .ana-buton {padding:9px 18px;}

.genel-container {flex-direction:column}
.genel-container-sol {width:100%;}
.genel-container-blog {width:100%;}
.genel-container-blog h1 {font-size:1.4rem;}
.genel-container-sag {width:100%;}

.footerTop{flex-direction:column; justify-content:center; flex-wrap:wrap;}
.footer1{width:90%; height:auto; display:flex; flex-direction:column; text-align:left}
.footerBottom{flex-direction:column;}

.contact-container{width:100%; margin:0 auto; display:flex; flex-direction:column; justify-content:center;}
.map-container{width:100%; height:auto; border:1px solid #ddd;}
.contact-info {width:100%; padding-left:0; padding-top: 20px;}

}