@charset "utf-8";
/* CSS Document */

@media (min-width: 62em){
#mainheader .hamburger{display:none;}
#mainheader .logo{width:252px; margin:0 auto;}
#mainheader .logo svg .b{fill:#25408F;}
#mainheader .headtop{ border-bottom:5px solid #25408F;}
#mainheader .container.top{display:flex; align-items:center; min-height:130px; position:relative; z-index:3; padding:0 20px;}

.mainmenu{background-image: linear-gradient(145deg, #38ef7d 0%, #11998e 100%) !important;}
#main-navigation{position:relative; z-index:2;}
#main-navigation:after{content:""; display:block; clear:both;}
#main-navigation ul{display:block; list-style:none; margin:0; padding:0; text-align:center;}
#main-navigation>ul>li.main{display:inline-block; margin:0 0 0 15px; padding:0; line-height:1.1875rem; z-index:2; position:static;}
#main-navigation>ul>li.main:nth-child(2){margin-left:0;}
#main-navigation>ul>li.main>a{font-size:1.06255rem; font-weight:600; line-height:1em; padding:21px; display:inline-block; position:relative; transition:color .3s ease-out; color:#FFF;}
#main-navigation>ul>li.main:hover>a{color:#014785;}

#main-navigation>ul>li.main.hassub2{position:relative;}
#main-navigation>ul>li.main.hassub>.sub{position:absolute; max-height:0; top:59px; left:0; right:0; padding:30px; transition:all .3s ease-out; opacity:0; overflow:hidden; visibility:hidden; min-width:241px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f9f9f9+49,efefef+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #EEE 49%, #DDD 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffffff 0%,#EEE 49%,#DDD 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffffff 0%,#EEE 49%,#DDD 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#DDD',GradientType=0 ); /* IE6-9 */}
#main-navigation>ul>li.main.hassubright>.sub{left:auto; right:0;}
#main-navigation>ul>li.main.hassub>.sub:before{position:absolute; left:0; right:0; height:0; display:block; top:0; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#494949+0,969696+60,ffffff+100&1+0,0+100 */
background: -moz-linear-gradient(top, rgba(73,73,73,1) 0%, rgba(150,150,150,0.4) 60%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(73,73,73,1) 0%,rgba(150,150,150,0.4) 60%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(73,73,73,1) 0%,rgba(150,150,150,0.4) 60%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#494949', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */}
#main-navigation>ul>li.main.hassub:hover>.sub{max-height:500px; opacity:1; visibility:visible;}
#main-navigation>ul>li.main.hassub:hover>a{background: #FFF;}
#main-navigation>ul>li.main.hassub>.sub .owl-carousel{padding:0 40px;}
#main-navigation>ul>li.main.hassub>.sub .s-item2 header h4{color:#FFF; font-weight:300; font-size:1.0625rem; text-align:center;}
#main-navigation>ul>li.main.hassub>.sub .owl-prev{position:absolute; left:0; top:50%; margin-top:-32px;}
#main-navigation>ul>li.main.hassub>.sub .owl-next{position:absolute; right:0; top:50%; margin-top:-32px;}
#main-navigation>ul>li.main.hassub>.sub.sub2{padding:50px 40px 40px 254px; color:#60656c;}
#main-navigation>ul>li.main.hassub2>.sub.sub2{padding:30px 20px 20px 20px;}
#main-navigation>ul>li.main.hassub>.sub.sub2 h4{position:absolute; left:10px; top:40px; padding-left:33px; font-size:1.5625rem; font-weight:400;}
#main-navigation>ul>li.main.hassub>.sub.sub2 h4:before{content:""; height:2px; background:#60656c; position:absolute; left:0; top:14px; width:25px; display:block;}
#main-navigation>ul>li.main.hassub>.sub.sub2 ol{list-style:none; max-width:241px; margin:0 auto; padding:15px 0 0 0; border-top:solid 8px #ff6100;}
#main-navigation>ul>li.main.hassub>.sub.sub2 ol li{display:block;}
#main-navigation>ul>li.main.hassub>.sub.sub2 ol li a{display:block; color:#60656c; font-size:1.0625rem; padding:10px;}
#main-navigation>ul>li.main.hassub>.sub.sub2 ol li a:hover{background:#CCC;}

#showcase .container{ position:relative;}
#showcase .baskan{ position:absolute; right:0; top:0; width:320px;}
#showcase .baskan ul{display:flex; justify-content:center; align-items:center; list-style:none; margin:20px 0 0 0; padding:0;}
#showcase .baskan ul li{margin:0 10px; padding:0;}
#showcase .baskan ul li a{font-size:1.3rem; color:#23408f;}
#showcase .baskan ul li a span{display:none;}

}

@media (max-width: 61.95em){
body{padding:60px 0 0 0; background:#FFF;}
.amblem{display:none;}
#topmenu{position:fixed; bottom:0; left:0; right:0; padding:15px 0; display:none; z-index:100;}
#topmenu ul{margin-left:0;}
#topmenu ul.quicklinks{display:none;}
#topmenu ul.callcenter{display:block; margin-right:auto; margin-left:0;}
#topmenu ul.callcenter li a{line-height:33px;}
#topmenu ul.social li{margin-left:10px;}
#topmenu ul.social li a{font-size:1.25rem; width:33px; height:33px; line-height:33px; background:#FFF; border-radius:50%; text-align:center;}

#mainheader{background:#23408f; z-index:100; min-height:60px; position:fixed; top:0; left:0; right:0;}
#mainheader .container.head{height:60px; position:fixed; top:0; left:0; right:0; padding:5px;overflow:hidden; max-width:100%;}
#mainheader .hamburger{border:none; outline:none; background:none; width:60px; height:60px; position:absolute; left:0; top:0; z-index:100; overflow:hidden;}
#mainheader .hamburger:before, #mainheader .hamburger:after, #mainheader .hamburger span{width:30px; height:3px; position:absolute; left:15px; content:""; background:#FFF; -webkit-transition: none 0.3s ease 0.3s;transition: none 0.3s ease 0.3s; -webkit-transition-property: transform, top, bottom, left, opacity; transition-property: transform, top, bottom, left, opacity;}
#mainheader .hamburger i{position:absolute; top:38px; left:15px; opacity:0; font-size:9px; color:#FFF; -webkit-transition: none 0.3s ease 0.3s;transition: none 0.3s ease 0.3s; font-style:normal; transition-property: transform, top, bottom, left, opacity;}
#mainheader .hamburger i:before{content:"KAPAT"}
#mainheader .hamburger:before{top:21px;}
#mainheader .hamburger span{top:29px;}
#mainheader .hamburger:after{top:37px}
#mainheader .logo{display:block; width:180px; margin:0 auto; position:relative; transition:all .3s ease-out;}
#mainheader .logo svg .a, #mainheader .logo svg .b{fill:#FFFFFF;}
#mainheader .search{padding:0 5px 5px 5px; margin:10px 15px 0 65px; position:relative; opacity:0; transition:all .3s ease-out; border-bottom:solid 1px rgba(255,255,255,.8);}
#mainheader .search input{display:block; width:100%; border:none; background:none; outline:none; box-shadow:none; color:#FFF; padding-right:27px; line-height:1.5;}
#mainheader .search input::placeholder{color:#FFF;}
#mainheader .search button{position:absolute; border:none; background:none; outline:none; box-shadow:none; color:#FFF; font-weight:600; right:0; top:0; font-size:1.2em;}
#mainheader .container.head .ataturk{}
#mainheader .headtop {height:60px; position:fixed; top:0; left:0; right:0; padding:5px; overflow:hidden; max-width:100%;}

.mainmenu{display:none; position:fixed; top:60px; bottom:63px; left:0; right:0; padding:10px 20px; overflow-y:scroll; background:#FFF;}
#main-navigation ul, #main-navigation ol{list-style:none; margin:0; padding:0;}
#main-navigation ul li, #main-navigation ol li{display:block; position:relative; border-bottom:solid 2px #e3e3e3; transition:all .3s ease-out; height:54px; overflow:hidden;}
#main-navigation ul li a, #main-navigation ol li a{display:block; position:relative; font-size:.9375rem; padding:15px 30px 15px 5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#main-navigation ul li a:after, #main-navigation ol li a:after{position:absolute; content:"\f107"; font-family:"Font Awesome 5 Free"; font-weight:900; right:15px; top:50%; margin-top:-11px; transition:all .3s ease-out;}
#main-navigation>ul>li.main:after{top:0; bottom:0; left:0; right:0; z-index:2; position:absolute; content:"";}
#main-navigation>ul>li.main>.sub{z-index:3; position:relative;}
#main-navigation>ul>li.main:not(.hassub):after{display:none;}
#main-navigation>ul>li.main:not(.hassub)>a:after{display:none;}
#main-navigation>ul>li.main>a{font-weight:600; z-index:1;transition:all .3s linear;}
#main-navigation>ul>li.main.passive a{color:#e3e3e3;}
#main-navigation>ul>li.main.active>a{padding-bottom:0;}
#main-navigation>ul>li.main.active>a:after{transform:rotate(180deg); margin-top:-5px;}
#main-navigation>ul>li.main ol{opacity:0; transition:all .3s ease-out; padding-left:20px;}
#main-navigation>ul>li.main ol>li{border-bottom:none;border-top:solid 1px #e3e3e3;}
#main-navigation>ul>li.main ol:first-child>li:first-child{border-top:none;}
#main-navigation>ul>li.main ol>li>a:after{transform:rotate(270deg);}
#main-navigation>ul>li.main.active{height:auto;}
#main-navigation>ul>li.main.active ol{opacity:1;}
#main-navigation>ul>li.mainlast{height:auto;}
#main-navigation>ul>li.mainlast:after{display:none;}
#main-navigation>ul>li.mainlast>a{display:none;}
#main-navigation>ul>li.mainlast ol{opacity:1; transition:all .3s ease-out; padding-left:0;}
#main-navigation>ul>li.mainlast ol>li{border-top-width:2px;}
#main-navigation>ul>li.mainlast ol>li>a{font-weight:600; text-transform:uppercase;}
#main-navigation>ul>li.mainlast ol>li>a:after{display:none;}

body.menu-opened #mainheader .hamburger:before, body.menu-opened #mainheader .hamburger:after{top: 22px;}
body.menu-opened #mainheader .hamburger i{opacity:1}
body.menu-opened #mainheader .hamburger span{left:-60px; opacity:0;}
body.menu-opened #mainheader .hamburger:before{transform: rotate( 45deg );}
body.menu-opened #mainheader .hamburger:after{transform: rotate( -45deg );}
body.menu-opened #mainheader .logo{margin-top:-53px; opacity:0;}
body.menu-opened #mainheader .search{margin-bottom:0; opacity:1;}
body.menu-opened #topmenu{display:block;}
body.menu-opened .mainmenu{display:block;}

#showcase{padding:0 0 20px 0;}
#showcase .owl-nav {opacity: 1;}
#showcase .container{padding:0; max-width:100%;}
#showcase ul li header{bottom:0; left:15%; right:15%; padding:20px; background:#23408f; color:#FFF; min-width:0; border-left:none; text-align:center;}
#showcase .baskan{display:none;}
#showcase ul li header:before{display:none;}	
	
#footer .ftr-bottom .menu ul li { margin: 15px 10px;}
#footer .ftr-bottom .menu ul li a {font-size: 15px;}	
#footer .ftr-bottom .link ul li {margin:15px 20px;}	
#footer .ftr-bottom .link ul li a { font-size: 14px;}

#mapHeadquarter { margin-bottom:50px;}

#selection .title h2{ font-size:30px;}
#selection a.blue-bg { min-height: auto; padding: 30px 0; margin-bottom:25px;}	
#selection a.blue-bg img{ width:70px; height:auto;}
#selection .title img { width: 40px; height: auto;}

#projeler .title img { width: 40px; height: auto;}

.news .title img { width: 40px; height: auto;}

.atik-icerik .atikimg img, .atik-icerik img.fullwidth{ margin-bottom:15px;}
.organik-atik .atikimg img.one{ margin-top:0;}
.organik-atik .atikimg img.two{ margin-top:0;}
}


@media (max-width: 47.95em){
#selection {padding:50px 0 0 0;}
#selection .title h2{ font-size:20px;}


#footer .ftr-bottom .menu ul li { margin:20px; display:block;}
#footer .ftr-bottom .social ul li { margin:10px;}

.content { padding:30px 0;}	
#breadcrumb .container {padding:0; text-align:center;}
#breadcrumb .breadcrumb {justify-content: center;}
.content .icerik { padding: 0 15px;}
.content h1 {font-size: 1.4rem;}

.ktg .s-item2.std header { padding: 10px;}

#projeler {padding: 100px 0 100px 0;}
#projeler .grid-wrapper {display:block;}
#projeler .title h2 { font-size:20px;}
#projeler .grid-wrapper > a { margin-bottom:20px;}

.news {padding: 10px 0 100px 0;}
.news .title h2 {font-size: 20px;}
.news .s-item2.std header { padding:15px;}
.news .s-item2.std header h3 {font-size: 16px; line-height: 1.8rem;}
.news .s-item2.std header h4 { font-size: 15px; line-height: 1.5rem;}

#ebrosur .brosur-bg h5 {font-size:17px; text-align:center;}
#ebrosur .brosur-bg {padding: 100px 0;}
#ebrosur .brosur-bg a {padding:10px; font-size: 15px;}

#maincontent .home-renewable-left{ display:none;}
#maincontent .home-renewable-right{ display:none;}
#maincontent .home-renewable-right-2{ display:none;}

.carbonyeriresults {padding:50px 0 0 0;}
.carbonyeriresults .carbonyeri {padding: 20px;}
.carbonyeriresults .form4 .carbonyeri {margin-bottom:20px;}


.kagit-karton h1, .tekstil h1, .organik-atik h1, .ilac h1, .bitkisel-yag h1, .cam h1, .pil h1,  .tehlikeli-atik h1, .hacimli-atik h1, .metal h1, .elektronik h1, .plastik h1{margin:16px 15px 40px 15px;}
}

@media (max-width: 35.95em){
#showcase ul li header h4{font-size:0.9rem;}
#showcase .owl-next, #showcase .owl-prev{width:45px;}
#showcase .owl-next img, #showcase .owl-prev img{width:20px;}
.sectiontitle {font-size: 1.3rem;}
.news .s-item2.std header { min-height:auto;}

.ktg .s-item2.std header { padding: 15px;}
}

@media (max-width: 25em){
.mobileshowcase{width:100% !important; height:auto !important;}
#footer .ftr-bottom .link ul li { margin: 15px 0; display:block;}
}


@media (min-width: 48em) and (max-width: 61.95em){
.ktg .s-item2.std header { padding: 15px;}

#projeler .title h2 { font-size:30px;}

.news .title h2 {font-size: 30px;}
.news .s-item2.std header { padding:15px;}
.news .s-item2.std header h3 {font-size: 16px; line-height: 1.8rem;}
.news .s-item2.std header h4 { font-size: 15px; line-height: 1.5rem;}
}


@media (min-width: 62em) and (max-width: 74.95em){

#main-navigation>ul>li.main>a {font-size: 1rem; padding: 21px 13px;}

#selection a.blue-bg {min-height: 250px;}	
#selection a.blue-bg img{ width:40%; height:auto;}
#selection .blue-bg span {font-size: 16px;}


}