* { padding: 0; margin: 0; outline: 0; }

body { font-size: 12px; font-family: Arial, "Trebuchet MS", sans-serif; background:#f7f8f7; color:#816969; }

a { color: #816969; text-decoration: underline; }
a:hover { color: #816969; text-decoration: none; }

.cl, .clear { display: block; height: 0; font-size: 0; line-height: 0; text-indent: -4000px; clear: both; }

.shell { width:881px; padding-left:51px; margin:0 auto; }

input, textarea, select { font-family: Arial, Helvetica, Sans-Serif; font-size:11px; }

h3 { font-family:"Trebuchet MS", Arial, Sans-Serif; font-size:25px; color:#575957; padding-bottom:5px; } 
/*
	Header
*/

#header { background:#000000; height:150px; }

#logo { float:left; font-size:25px; padding-top:20px; }
#logo a { color:#d3c6c6; text-decoration:none; }
#logo a span { display:block; text-align:right; font-size:12px; font-weight:normal; color:#484949; }

#header .socials { float:right; padding-top:29px; padding-right:2px; }
#header .socials a { width:23px; height:22px; float:left; font-size:0; line-height:0; text-indent:-4000px; margin-left:8px; }
#header .socials a.link-x { background:url(images/link-x.png); }
#header .socials a.link-linkedin {  background:url(images/link-linkedin.gif);}
#header .socials a.link-facebook {  background:url(images/link-facebook.gif);}
#header .socials a.link-insta {  background:url(images/link-insta.jpg);}
/*
	Navigation
*/

#navigation,
#navigation .shell { background:url(images/navigation.gif) left top repeat-x; height:53px; }
#navigation .shell { overflow:hidden; width:878px; padding: 1px 8px 0 53px; position: relative; }
#navigation ul { list-style:none; padding:0 1px 0 0; background:url(images/navigation-separator.gif) right top no-repeat; }
#navigation ul li { float:left; background:url(images/navigation-separator.gif) left top no-repeat; padding-left:1px; height:52px; line-height:52px; }
#navigation ul li a { float:left;  height:47px; line-height:47px; padding:3px 17px 0 20px; font-weight:bold; color:#fff; text-decoration:none; }
#navigation ul li a:hover,
#navigation ul li a.active { background-color:#5843b5; }

#search { position: absolute; width:  202px; margin:10px 1px 0 0; right: 8px; background:#1a4473; border:1px solid #6788b8; }
#search form {  }
#search .field { float:left; color:#c6ddc0; background:#1a3673; border:0; width:140px; padding:10px 17px 5px 16px; }
#search .submit { border:0; cursor:pointer; background:url(images/search-submit.gif); width:18px; height:28px; float:left; margin-right:9px; }

/*
	Intro
*/

#intro { background:url(images/intro.gif) left top repeat-x; }

#intro .shell { background:url(images/intro-slider.jpg) left 289px no-repeat;  height:376px; overflow:hidden; padding:14px 0 0 82px; width:918px; position:relative; }

.slider-holder { width:800px; height:315px; position:relative; }

.slider-holder ul,
.slider-holder .jcarousel-clip { width:800px; height:313px; overflow:hidden; position:relative; z-index:10; }

.slider-holder ul li { width:800px; height:313px; position:relative; }
.slider-holder ul li .post-image { position:absolute; top:0; left:0; z-index:11; }
.slider-holder ul li .post-data { position:absolute; left:0; bottom:0; height:66px; width:800px; background:url(images/transparent-70.png) repeat 0 0 ; z-index:12; }
.slider-holder ul li .post-data h2 { padding:16px 0 0 30px;  font-size:20px; float:left; color:#fff; }
.slider-holder ul li .post-data h2 a { color:#fff; }

.slider-holder .buttons { float:right; padding:8px 32px 0 0; }
.slider-holder .buttons a,
.slider-holder .buttons a span { float:left; font-size:11px; color:#feffff; height:38px; line-height:38px; background:url(images/intro-button.gif);  }
.slider-holder .buttons a { background-position:left; padding-left:17px; text-decoration:none; }
.slider-holder .buttons a span { background-position:right; padding-right:18px; }

.slider-navigation { position:absolute; left:31px; bottom:15px; }
.slider-navigation ul { list-style:none; }
.slider-navigation ul li { float:left; padding-right:5px; }
.slider-navigation ul li a { float:left; width:22px; height:24px; background:url(images/slider-navigation-normal.gif); font-size:0; line-height:0; text-indent:-4000px; }
.slider-navigation ul li a.active { background:url(images/slider-navigation-active.gif); }

.slider-frame { z-index:15; background:url(images/hole.png); width:844px; height:20px; position:absolute; left:-22px; bottom:0px; }

/*
	Main
*/

#main { border-bottom:1px solid #d5d7d3; padding:13px 0 25px 0; }
#main .shell { width:937px; padding-left:0; }

.box { float:left; width:286px; padding-right:18px; }
.last-box { padding-right:0; }

#main .box .box-image { padding-bottom:6px; }
#main .box .box-image img { border:2px solid #c3c3c3; }

#main .entry { height:169px; }
#main .box p { line-height:18px; padding-bottom:17px; text-align:justify;}

#main .partners ul { list-style:none; padding-top:2px; }
#main .partners ul li { background:url(images/li-border.gif) left bottom repeat-x; padding-bottom:8px; margin-bottom:7px; }
#main .partners ul li a { padding-left:14px; background:url(images/ul-arrow.gif) left 2px no-repeat; color:#035787; text-decoration:none; }
#main .partners ul li a:hover { text-decoration:underline; }

#main .blog-posts ul { list-style:none; position:relative; top:-2px; }
#main .blog-posts ul li { background:url(images/li-border.gif) left bottom repeat-x; line-height:18px; color:#34616d; padding-bottom:5px; margin-bottom:5px; }
#main .blog-posts ul li a { color:#035787; text-decoration:none; }
#main .blog-posts ul li a:hover { text-decoration:underline; }
#main .blog-posts ul li p { padding-bottom:0; margin-bottom:0; }

#main .buttons a,
#main .buttons a span { float:left; height:32px; line-height:32px; text-decoration:none; background:url(images/main-button.gif) left top; }
#main .buttons a { padding-left:12px; font-size:10px; color:#feffff; }
#main .buttons a span { padding-right:13px; background-position:right; }
/*
	Footer
*/
#footer { font-size:10px; color:#969696; padding:8px 0; }
#footer .shell { width:919px; padding-right:19px; padding-left:0; }

#footer a { color:#969696; text-decoration:none; }
#footer a:hover { text-decoration:underline; }
#footer .footer-navigation ul { list-style:none; }
#footer .footer-navigation ul li { float:left; font-size:10px; color:#969996; padding-right:7px; margin-right:7px; border-right:1px solid #969696; }
#footer .footer-navigation ul li.last { border-right:0; }

#footer p.right { float:right; }
#footer p.right a { font-weight:bold; text-decoration:underline; color:#6e726e; }
#footer p.right a:hover { text-decoration:none; }

@media (max-width: 768px) {
   #logo {
    text-align: center !important; /* Logoyu ortala */
    margin: 0 auto !important; /* Otomatik margin ile ortala */
    padding: 10px 0 !important; /* Üst ve alt boşluk ekle */
}

    #logo img {
        max-width: 80%; /* Logonun boyutunu artır */
        height: auto; /* Yüksekliği otomatik ayarla */
    }

    #header {
        display: flex; /* Flexbox kullan */
        flex-direction: column; /* Dikey hizala */
        align-items: center; /* Ortala */
    }
}


#header {
    background: #000000;
    height: 150px;
    display: flex; /* Flexbox kullanarak hizalama */
    justify-content: space-between; /* Aralarındaki boşluğu eşit dağıt */
    align-items: center; /* Dikey hizalama */
}

.shell {
    display: flex; /* Flexbox kullanarak shell içindeki öğeleri hizalayın */
    justify-content: space-between; /* Aralarındaki boşluğu eşit dağıt */
    align-items: center; /* Dikey hizalama */
    width: 100%; /* Shell genişliğini %100 yapın */
    max-width: 1200px; /* İsteğe bağlı: maksimum genişlik ayarı */
    margin: 0 auto; /* Ortalamak için otomatik margin */
    padding: 0 20px; /* Yanlarda boşluk bırakın */
}

#logo {
    display: flex; /* Flexbox kullanarak logo ve yazıyı hizalayın */
    align-items: center; /* Dikey hizalama */
}

.logo-text {
    font-size: 48px; /* Yazı boyutunu artırın */
    font-weight: bold; /* Kalın yazı */
    color: #f7f6f6; /* Yazı rengi */
    margin-left: 5px; /* Logonun sol tarafında boşluk */
    vertical-align: middle; /* Dikey hizalama */
    font-family: 'Arial', sans-serif; /* Yazı tipi */
}

.socials {
    display: flex; /* Sosyal medya bağlantılarını yan yana hizalayın */
    align-items: center; /* Dikey hizalama */
}

.socials a {
    margin-left: 10px; /* Sosyal medya bağlantıları arasında boşluk bırakın */
}