@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@100;300;400;500;600;700;900&family=Oswald:wght@300;400;500&display=swap&subset=latin-ext');
* { -moz-box-sizing: border-box; box-sizing: border-box; -webkit-box-sizing: border-box; outline: 0; }
:root{
    
    --text-color:#3f3f3f;
    --active-color:#ffce00;
     --soft-color:#888;
    
}

::-webkit-scrollbar {width: 7px;background-color: #f9f9f9;border-radius:50px;}
::-webkit-scrollbar-thumb {border-radius:50px;background: #ddd;}
html, body { width: 100%; height: 100%; padding: 0; margin: 0; }
body { font-family: 'Jost', sans-serif; font-weight: 400; font-size: 12px; height: 100%; color: #1D2023; background:#FFF; }

button,input,select{ font-family: 'Jost', sans-serif; border-radius:0; padding:0; }
body.ios_device button,body.ios_device textarea,body.ios_device input[type=text],body.ios_device select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; }
 

.paging { float: left; width: 100%; margin: 20px 0 10px 0; text-align: center; }
.paging a { padding: 10px 16px; margin: 0 5px; display: inline-block; border:3px solid #dddddd; border-radius:5px; font-size: 13px; color: #333; text-decoration: none; }
.paging a.active, .paging a:hover { color: #FFF; background:#E1251B; border-color:#E1251B; }


.contact-form{width:100%;float: left;display: flex; flex-direction: row;    justify-content: space-between;}
.contact-form > form{width:45%;}
.contact-form > .gmap{width:50%;}

.contact-detail {float: left;width: 100%;text-align: center;margin:50px 0;display: flex;flex-direction: row;justify-content: space-between;}
.contact-detail > div { float: left; width:33.333%; }
.contact-detail > div:last-child { float: left; width:40%; }
.contact-detail > div span { font-size: 19px; font-weight: 400; display: block; }
.contact-detail > div strong { font-size: 15px; font-weight: 400; max-width: 400px; display: block; margin: auto; }
.contact-detail i { color: #82BD31; }
.gmap iframe { float: left; width: 100%; height: 304px; border: 2px solid #ddd !important; }
form.styleinput input, form.styleinput select, form.styleinput textarea, form.styleinput button { font-family: 'Poppins', sans-serif; float: left; width: 100%; border: 0; border-bottom: 2px solid #ddd; background: transparent; font-size: 16px; font-weight: 400; }
form.styleinput input, form.styleinput select {height: 45px;padding-left: 10px;line-height: 45px;}
form.styleinput textarea { max-height: 180px; height: 80px; padding: 10px; max-width: 100%; }
form.styleinput input.error, form.styleinput textarea.error, form.styleinput select.error { border-color: #9F0000 !important; background: #FFF4F4 !important; }
form.styleinput label.error { display: none !important; }
form.styleinput .srow { margin-bottom: 20px; }
form.styleinput button { float: right; max-width: 175px; height: 50px; cursor: pointer; position: relative; overflow: hidden; }
form.styleinput button * { -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
form.styleinput button span { display: block; }
form.styleinput button:hover span { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); }
form.styleinput button i { position: absolute; width: 100%; text-align: center; top: 100%; left: 50%; padding: 10px; color: #82BD31; font-size: 20px; -webkit-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0); }
form.styleinput button:hover i { -webkit-transform: translate3d(-50%, -100%, 0); transform: translate3d(-50%, -100%, 0); }
a.captcha { float: left; padding-left: 20px; position: relative; background: #FFF; }
a.captcha:before { content: '\f021'; font-family: 'Font Awesome 5 Free'; color: #a89282; position: absolute; left: 0; top: 0; z-index: 3; font-size: 20px; line-height: 53px; padding: 0 10px 0 10px; }
a.captcha:hover:before { transform: rotate(90deg); -moz-transform: rotate(90deg); }
a.captcha img { float: left; height: 50px; }


.igallery { float: left; width: 70%; padding-top: 66px; background: #FFF; }
.igallery > a { float: left; width: 25%; }
.igallery > a span { float: left; width: 100%; height: auto; position: relative; overflow: hidden; }
.igallery > a span img { float: left; width: 100%; height: auto; -webkit-transition: all 4000ms cubic-bezier(.19, 1, .22, 1) 0ms; }
.igallery > a:hover span img { transform: scale(1.05); }
.igallery > a span:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #FFF; opacity: 0; transition: all 200ms linear; }
.igallery > a:hover span:after { opacity: .2; }
.tags { float: left; width: 100%; margin: 20px 0 20px 0; }
.tags:before { content: 'Etiketler'; float: left; width: 100%; margin: 0 0 5px 0; font-size: 14px; color: #999; }
.tags a { float: left; font-size: 11px; color: #CCC; margin: 0 10px 5px 0; text-decoration: none; }
.tags a:before { float: left; content: '#'; }
.tags-h1 { float: left; width: 100%; font-size: 35px; font-weight: 600; text-align: center; margin: 0; padding: 0; }
.tags-h1 h1 { margin: 0; padding: 0; display: inline-block; font-size: 25px; }
.tags-desc { float: left; width: 100%; font-size: 18px; font-weight: 400; color: #303134; text-align: center; margin: 5px 0 20px 0; }
.posts-list { float: left; width: 100%; margin: 0; padding: 0; }
.posts-list > li { float: left; width: 100%; padding: 10px 0 10px 0; border-bottom: 1px dotted #EEE; list-style: none; }
.posts-list > li h3 { float: left; width: 100%; margin: 0 0 5px 0; padding: 0; }
.posts-list > li h3 a { font-size: 20px; font-weight: 600; color: #333; }
.posts-list > li p { float: left; width: 100%; margin: 0; padding: 0; font-size: 14px; font-weight: 400; color: #666; }
.posts-list > li:last-child { border: 0; }


header { width: 100%;float: left;position: fixed;left: 0;right: 0;top: 0;display: flex;justify-content: space-between;align-items: center;z-index: 1;background: #FFF;}
header > .logo {max-width: 20%;overflow: hidden;display: flex;align-items: center;justify-content: center;padding: 3%;float: left;}
header > .logo > img {width: 100%; float: left;}

header .social{ float:left;display: flex;padding-left: 40px;}
header .social a{float:left;font-size:20px;color:var(--text-color);width: 30px;height: 30px;transition: color .5s;}
header .social a:hover{ color:var(--active-color); }
 

header > .nav {float:right;display: flex;padding-right: 5%;align-items: center;}
header > .nav > ul{padding:0;margin: 0;width: 100%;float: left;list-style: none;}
header > .nav > ul > li{width: auto;float: left;padding:0;position: relative;}
header > .nav > ul > li:before{content: ""; background:var(--active-color);position: absolute;left: 0;bottom:0;width: 0; height: 2px; transition: width .5s;}
header > .nav > ul > li:hover:before{width:100%;}
header > .nav > ul > li > a{width:auto;float: left;padding:7px 15px;text-decoration: none;font-family: 'Oswald', sans-serif;color:var(--text-color);font-size: 14px;font-weight: 300;}








aside{width:20%;float: left;display: flex;position: fixed;bottom: 25px;left: 0;top: 10%;min-width: 230px;min-width: 230px;overflow-y: auto;}
aside > nav{width: 100%;float:left;}
aside > nav > ul{padding:0;margin: 0;width: 100%;float: left;list-style: none;}
aside > nav > ul > li{width: 100%;float: left;padding: 0 0 0 15%;position: relative;}
aside > nav > ul > li:before{content: ""; background:var(--active-color);position: absolute;left: 0;top: 4px;bottom: 4px;width: 0;transition: width .5s;}
aside > nav > ul > li:hover:before{width:14%;}
aside > nav > ul > li > a{width: 100%;float: left;padding:4px;text-decoration: none;font-size: 20px; font-family: 'Oswald', sans-serif;color:var(--text-color);font-weight: 400;transition: color .3s;}

aside > nav > ul:hover > li > a{color:var(--soft-color);}
aside > nav > ul:hover > li:hover > a,
aside > nav > ul > li.active > a{color:var(--text-color);}
aside > nav > ul > li.active:before > a{width:14%;}


aside > nav > ul.is_mobil{margin-top:25px;}
aside > nav > ul.is_mobil > li > a{font-size: 14px;font-weight: 300;}
aside > nav > ul.is_mobil > li:before{top: 12px;bottom: 12px;}

main{ position: relative;float: left;width: 100%;}
main> .container{width: 100%;float: left;display: flex;padding-right: 5%;flex-direction: column;}

ul.gallery { padding:0;margin: 0;width: 100%;float: left;list-style: none;-moz-column-count: 5;-webkit-column-count: 5; column-count: 5; -moz-column-gap: .5em;-webkit-column-gap: .5em;column-gap: .5em;}
ul.gallery > li { display: inline-block;margin: 0 0 .5em;width: 100%;}





.page-container{width:100%;float: left;display: block;padding-left: 20px;margin-bottom: 70px;}
.page-container > .post {width:100%;float: left;}

.entry-title,
.entry-content{width: 100%;float: left;}

.entry-title {font-family: 'Oswald', sans-serif;font-weight: 500;padding: 0 0 10px 0;margin: 0;font-size: 2.5rem;border-bottom: 1px solid #ddd;text-align: right;}
.entry-content {display: block;margin-bottom: 20px;font-size: 16px;line-height: 1.7;font-weight: 300;zoom: 1;text-align: justify;}
.entry-content a{text-decoration:none;color: inherit;}
.entry-content iframe{width:100%;float: left;display: block;aspect-ratio:1 / 0.562;margin-bottom: 25px;border-radius: 7px;overflow: hidden;}
.entry-content strong{font-weight:500;}
.entry-content strong {/*color:#283448;*/ }
.entry-content a.link { color: #06c; font-weight: bold; position: relative; }
.entry-content a.link:hover { text-decoration: underline; }
.entry-content a.link:after { content: '👈'; margin-left: 3px; text-decoration: none; }
.entry-content li { list-style: inside; }
.entry-content img { max-width: 100% !important; height: auto !important; }


footer{padding: 5px; display: flex;position: fixed;bottom:0;left: 0;right: 0;color:var(--soft-color); font-family: 'Oswald', sans-serif;font-weight: 300;font-size: 13px;}





#bread-crumbs{float: left;width: 100%;position: relative;display: flex;justify-content: center; }
#bread-crumbs > ul{ margin:auto; display:flex; width:100%; padding:0; align-items: center;justify-content: flex-end; }
#bread-crumbs > ul > li{ float:left; color:var(--soft-color); font-size:12px; position:relative;}
#bread-crumbs > ul > li:after{content:'›'; margin: 0 7px;} 
#bread-crumbs > ul > li:last-child:after{content:'';}
#bread-crumbs > ul > li > a,#bread-crumbs > ul > li > span{ padding:0; float:left; height:100%; color:#999; text-decoration: none;}
#bread-crumbs > ul > li > a:hover{ color:var(--active-color); }
#bread-crumbs > ul > li > span{ color:var(--soft-color); }
#bread-crumbs > ul > li,#bread-crumbs > ul > li > a{ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}

#bread-crumbs > ul > li{display: none;}
#bread-crumbs > ul > li:nth-last-child(-n+3){display: block;}

 
a.gotopage{ transition: all 200ms linear; float: left; width: 100%; position: relative;max-width: 362px; line-height: 60px; color: #fff; background: #E1251B; border-radius:10px; font-size:17px; font-weight: 500; padding-left: 35px; }
a.gotopage i{ position: absolute; right:35px; top:22px; transition: all 200ms linear;  }
a.gotopage:hover{ background: #101010;  }
a.gotopage:hover i { right: 15px;  }
  
  

@media screen and (min-width:1024px) {
    .is_mobil{display:none;}
}

@media screen and (max-width:1600px) {
	 
}

@media screen and (max-width:1180px) {
	 
}
  
@media screen and (max-width:1100px) { 
	
}

@media screen and (max-width:1024px) {
	 
}

@media screen and (max-width:900px) {
 
}

@media screen and (max-width:680px) {
	 
}

@media screen and (max-width:580px) {
	 
}

@media screen and (max-width:400px) {
	 
}
