body{margin: 0; padding: 0;  font-family: 'Poppins', sans-serif; background: url(../img/bg/bg-light2.webp) no-repeat right top fixed #353536; background-size: cover; color:#FFF; font-size: 16px;}
body.dark{position: relative;}
body.dark::after{content: ''; z-index: -1; position: fixed; left: 0; top: 0; width:100vw; height: 100vh; background-color: rgba(53, 53, 54, .8);}
.bre{font-family: 'Bree Serif', serif;}
.clear{clear: both}
a{text-decoration: none; color:#FFF;}
h1,h2,h3,h4,h5,h6,p{margin-top: 0;}
h1,h2{font-family: 'Bree Serif', serif;}
#header{padding-top: 40px; position: relative; padding-left: 40px; margin-bottom:80px; }

.content{margin-left: 85px;}
.page-left{float: left; padding-top: 80px;}
.page-right{float: left; width:730px; padding-top: 80px;}

#home-menu{padding-top: 20px;}
#home-menu ul,#home-menu ul li{margin: 0; padding: 0; list-style: none;}
#home-menu ul li a{display: inline-block; background-color: #9a9a9b; font-size:55px;color:#373638; line-height: 100%; padding: 0 15px; transition: font-size .15s;}
#home-menu ul li a.opened{font-size:85px; transition: font-size .15s;}
#home-menu ul>li a:hover{background-color: #FFF;}
#home-menu ul li{margin-bottom: 15px;}
#home-menu ul li ul{display: none; margin: 20px; margin-left: 40px; }
#home-menu ul li ul li a{background-color:transparent; color:#FFF; font-size: 36px;}
#home-menu ul li ul li a:hover{background-color:transparent;}

#top-menu{position: absolute; right:0; top:50%;}
#top-menu ul, #top-menu li{margin: 0; padding: 0; list-style: none;}
#top-menu ul li{display: inline-block; padding: 0 40px; text-align: center; position: relative}
#top-menu ul li a{display: inline-block; color: #FFF; font-size:18px; line-height: 18px; padding: 5px 10px; }

#top-menu ul li ul{display: none; position: absolute; top:100%; left: 0; box-sizing: border-box; padding: 2px; width:100%; z-index: 9; padding-top: 10px;}



#page-content{margin-left: 60px !important;width:600px; padding-bottom: 30px; font-weight: normal; }
#page-content.full-page{width:calc(100% - 60px) !important;}
#page-content h1{font-family: 'Bree Serif', serif; background-color: #ffffff; color: #373638; font-size: 90px; display: inline-block; line-height: 100%; padding: 0 10px; font-weight: normal; position: relative;}
#page-content h1 small{background: transparent; color: #FFF; display: block; position: absolute; bottom: -40px; right: 10px; font-size:32px; line-height: 32px; }
#page-content h1::after{content: ''; position: absolute; left: -13px; width:13px; height: 100%; background-color: #00a79d; display: block; top: 0}

#page-content ul{margin-left: 0; padding-left: 0}
#page-content ul li{list-style: none; background: url(../img/bullet.png) no-repeat left 5px; padding-left: 20px; margin-bottom: 10px;}

.bilgi{font-weight:300; font-size:14px; color:#959595; font-style:italic}

#dergi-wrapper a{display:block; width:calc(33.33% - 30px); float: left; margin: 15px; max-width: 210px;}
#dergi-wrapper a:nth-child(1),
#dergi-wrapper a:nth-child(2),
#dergi-wrapper a:nth-child(3){
	margin-top: 0;
}
#dergi-wrapper a img{width:100%; display:block;}

#roportajlar-wrapper{position: relative;}
#roportajlar-wrapper .item-wrapper{margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #4a4a4a; position: relative;}
#roportajlar-wrapper .item-wrapper:last-child{border-bottom: none;}
#roportajlar-wrapper .item{border-radius: 5px; position: relative; padding: 20px; font-weight: 300; font-style: italic; font-size:14px; padding-left: 110px; box-sizing: border-box; width:100%; cursor: pointer; min-height: 124px;}
#roportajlar-wrapper .item-wrapper:hover .item,
#roportajlar-wrapper .item-wrapper.active .item{background-color: #262626;}
#roportajlar-wrapper .buyuk-resim{background: url(../img/sade-isler/roportajlar/cerceve.png) no-repeat left top; width:487px; height: 500px; position: absolute; left: 100%; display: block; top:0; box-sizing: border-box; padding-left:20px; padding-top: 20px; display: none; margin-left: 35px;}


#roportajlar-wrapper .item img{position:absolute; left:10px;}
#roportajlar-wrapper .item p{position:relative; padding:0 20px; }
#roportajlar-wrapper .item p i{position: absolute; left: 0; top: 5px; background: url(../img/sade-isler/roportajlar/tirnak-ac.png) no-repeat left top; width:11px; height: 9px;}
#roportajlar-wrapper .item p b{position: absolute; right: 0; top: 5px; background: url(../img/sade-isler/roportajlar/tirnak-kapa.png) no-repeat left top; width:11px; height: 9px;}
#roportajlar-wrapper .item p span{display: block; text-align: right; font-size: 20px; font-style: normal;}

#roportaj-title-text{position: absolute; text-align: center; bottom:30px; left: 0; width:100%; padding-right: 50px; box-sizing: border-box; color:#494949;}

#items-container{height:300px; overflow-y:scroll; padding-right:20px; }



#items-container::-webkit-scrollbar-track
{

	border-radius: 2px;
	background-color: #323233;
}

#items-container::-webkit-scrollbar
{
	width: 4px;
	background-color: #323233;
}

#items-container::-webkit-scrollbar-thumb
{
	border-radius: 4px;
	
	background-color: #fff;
}

#sosyal-medya-gorsel{width:100%; max-width: 730px; box-sizing: border-box; padding: 0 20px; }
#sosyal-medya-gorsel img{width:100%; display: block;}


#videolar-wrapper{display: flex; flex-direction: row; flex-wrap: wrap;}
#videolar-wrapper .item-wrapper{width:100%; max-width:600px; margin-right:65px; margin-bottom: 65px; opacity: .5}
#videolar-wrapper .item-wrapper:hover{opacity: 1}
.video-wrapper{width:100%; padding-top:60%; position:relative; margin-bottom: 30px;}
.video-wrapper iframe,.video-wrapper img{width:100%;height:100%; position:absolute; left:0; top:0;}

.video-info{text-align: center;}
.video-title{font-size:32px;}
.video-desc{font-style:italic;color:#fefefe; font-size:14px;}


.iletisim-item{width:390px; border-bottom:1px solid #5d5d5e; background:url(../img/iletisim/tel.png) no-repeat left bottom; padding-left:80px; display:flex; align-items:center; height:80px; box-sizing: border-box}
.iletisim-item.mail{background-image:url(../img/iletisim/mail.png);}
.iletisim-item.mail a{unicode-bidi:bidi-override; direction: rtl}
.iletisim-item.tel{font-size:30px; font-weight:600;border-top:1px solid #5d5d5e; }
.iletisim-item.social{text-align: center; background:none; border-bottom: none; justify-content: center; padding-left: 0;}
.iletisim-item.social a{display: inline-block; margin: 0 20px;}