@import url('../_ext/fonts.googleapis.com/css._q_fcac053dc7d2292c693d18ac2d6b877a.css'); 
@import url('../_ext/fonts.googleapis.com/css._q_d728dd4e20b8ded04beaa1b2e80a6b1e.css'); 
@import url(../_ext/fonts.googleapis.com/css._q_4b01ac21b55deaff2a66e165349920b9.css);

* {
    border: 0;
    padding: 0;
    margin: 0;
}
body {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 14px;
    color: #888888;
    font-weight: 400;
    background-color: #aeaeae;
    overflow-x: hidden; /* Bu kod en alttaki scroll'u yok etmek için */
    
}
h1,h2,h3 {
    font-family: 'Source Sans Pro', sans-serif;
}
h1 {
    font-size: 40px;
}
h2 {
    font-size: 35px;
}
h3 {
    font-size: 30px;
    font-weight: 700;
}
img {
    max-width: 100%;
}
ul {
    list-style: none;
}
.clearfix {
    clear: both;
    background-color: #fff;
    padding-bottom: 30px;
}
/* Genel Ayarlar Bitiş */

.top-bar { 
    width: 100%;
    height: 30px;
    background:#a60000;
    position: relative;
    top: 0;    
}
.top-bar-sol {
    float: left;
    text-align: left;
    width: 60%;
    padding-left: 10px;
}
.top-bar-sag {
    float: right;
    text-align: right;
    width: 40%;
    padding-right: 10px;
}
.top-bar-sol p {
    text-align: left;
    margin-top: 5px;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 14px;
    font-weight: 300;
    color: rgba(255,255,255,0.7);
    display: inline-block;
}
.fa-caret-right {
    color: #a60000;
    font-size: 1px;
    padding-right: 5px;
    padding-left: 25px;
}
.top-bar-sol .fa {
    color: rgba(255,255,255,0.9);
    padding-right: 5px;
}
.top-bar-sag .fa {
    color: rgba(255,255,255,0.9);
    padding-right: 5px;
    padding-left: 10px;
}

.top-bar-sag p {
    text-align: right;
    margin-top: 5px;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 14px;
    font-weight: 300;
    color: rgba(255,255,255,0.7);
    display: inline-block;
}
header {
    width: 100%;
    height: 120px;
    position: absolute;
    z-index: 10000;
    background: #FFF;
    box-shadow: 0px 2px 3px #999;
}
.header-inner {
    max-width: 1200px;
    margin: 0 auto;
}
#logo {
    float: left;
    background: url("../img/logo.jpg");
    width: 321px;
    height: 68px;
    margin: 25px 0 10px 0;
    margin-left: 10px;
}
nav {
    float: right;
    padding: 30px 1px 0 0;
}
#menu-icon i {
    text-align: right;
    color: #a60000;
    font-size: 45px;
    display: none;
}
nav ul li {
    display: inline-block;
    float: left;
    padding: 25px 20px 0 0;
}
nav ul li a {
    font-family: 'Roboto+Condensed', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #555;
    text-decoration: none;
    transition: color 0.5s ease;
	-webkit-transition: color 0.5s ease;
	-moz-transition: color 0.5s ease;
	-o-transition: color 0.5s ease;
}
nav ul li a:hover {
    color: #a60000;
    text-decoration: none;
}
nav ul li a.active {
    color: #fff;
    bottom: 0;
    width: 50px;
    height: 2px;
    background-color: #a60000;
    margin: 0 auto;
    padding: 57px 10px 45px 10px;
}
    
/* Header Bitiş */

.flexslider {
    max-width: 100%;
    max-height: 650px;
    padding: 120px 0 0 0;
}
.flex-direction-nav {
    display: block;
}
.flex-control-nav {
    display: block;
}
/* Slider Bitiş */


#slogan {
    width: 100%;
    background: #eaeaea;
    position: relative;
}
.col-md-4 {
    text-align: center;
}
.slogan {
    margin-top: -50px;
    position: relative;
}
#slogan h3 {
    font-family: 'Source Sans Pro', sans-serif;
    color: #a60000; 
    font-style: italic;
    padding-bottom: 60px; 
}
/* Slogan Bitiş */

#Red-Square {
    width: 100%;
    height: 575px;
    background-image: url(../img/Red-Square.jpg);
   
}
.Red-Square-Content {
    margin-top: 115px;
    width: 88%;
}
#Red-Square h1 {
    font-family: 'Source Sans Pro', sans-serif;
    color: #fff;
    font-weight: 700;
}
#Red-Square h1::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #f1a800;
    margin: 5px 0 0 auto;
}
#Red-Square p {
    color: #fff;
    font-weight: 300;
}
#Red-Square img {
    text-align: center;
    padding-top: 150px;
}
/* Red-Square Bitiş */

#hizmetlerimiz {
    width: 100%;
    background: #eaeaea;
    padding-bottom: 90px;
}
#hizmetlerimiz h2 {
    padding-top: 100px;
    color: #a60000;
    font-weight: 700;
}
#hizmetlerimiz h2::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #a60000;
    margin: 5px 0 0 auto;
}
#hizmetlerimiz h3 {
    color: #a60000;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: 5px;
    font-size: 25px;
}
#hizmetlerimiz img {
    border: 2px solid #a60000;
}

#hizmetlerimiz h3::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #a60000;
    margin: 5px 0 0 auto;
}
#hizmetlerimiz p {
    font-weight: 300;
    padding-bottom: 10px;
}
/* Hizmetlerimiz Bitiş */


#parallax {
    width: 100%;
    padding-bottom: 100px;
    background: url("../img/parallax.jpg") repeat fixed 100%;
}
#parallax .col-md-3{
    margin-top: 20px;
}
#parallax h2 {
    padding-top: 100px;
    color: #fff;
    font-weight: 700;
}
#parallax h2::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #f1a800;
    margin: 5px 0 0 auto;
}
#parallax p {
    color: #fff;
    font-weight: 300;
}
.arac-park-kutu {
    width: 100%;
    height: 200px;
    background: url("../img/arac-park-bg.png");
    border: 2px solid #fff;
    display: table;
    position: relative;
    overflow: hidden;
    text-align:center;
    margin:0 auto;
}
.arac-park-kutu img {
    width: 266px;
    height: 200px;
}
/* Parallax - Araç Parkı Bitiş */

#partnerlerimiz {
    width: 100%;
    background-color: #fff;   
    padding-bottom: 100px;
}
#partnerlerimiz h2 {
    padding-top: 100px;
    color: #a60000;
    font-weight: 700;
    padding-bottom: 15px;
}
#partnerlerimiz h2::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #a60000;
    margin: 5px 0 0 auto;
}

/* Referanslar slider */
.thumbnail {
  border: none;
  border-radius: 0;
  -webkit-transition: all .2s ease-in-out;
       -o-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}


/* Referanlar Bitiş */

footer {
    background-color: #000;
    padding-top: 100px;
    padding-bottom: 20px;
}
footer img {
    padding-bottom: 15px;
}
footer .footer-yazi {
    color: #fff;
    font-size: 14px;
}
footer .footer-yazi::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #a60000;
    margin: 15px 0 0 auto;
}
.footer-map {
    width: 272px;
    height: 223px; 
}
footer h3 {
    color: #fff;
    margin-top:  0;
    padding-bottom: 15px;
}
footer h3::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #a60000;
    margin: 15px 0 0 auto;
}
footer i {
    padding-bottom: 10px;
    padding-right: 10px;
}
footer-nav ul li {
    display: inline-block;
    float: left;
    padding: 18px 5px 0 0;
}
footer-nav ul li a {
    font-family: 'Roboto+Condensed', sans-serif;
    font-size: 11px;
    font-weight: 300;
    color: rgba(255,255,255,0.5);
    text-decoration: none;
}
footer-nav ul li a:hover {
    color: rgba(255,255,255,1);
    text-decoration: none;
}
footer-nav ul li a.active {
    color: rgba(255,255,255,1);
    text-decoration: none;
}
/* Footer Bitiş */

#footer-alt {
    width: 100%;
    height: 45px;
    background-color: #262626;;
}
#footer-alt p {
    color: rgba(255,255,255,0.5);
    padding-top: 10px;
}
.footer-alt-sag {
    float: right;
}
.footer-alt-sag a {
    color: rgba(255,255,255,0.5);
}
.footer-alt-sag a:hover {
    color: #a60000;
    text-decoration: underline;
}
/* Footer Alt Bitiş */


/* KURUMSAL BAŞLANGIÇ */
.sayfa-tepe {
    width: 100%;
    height: 245px;
    background: url("../img/ozaslan-header-ic1920.jpg");    
    margin-top: 120px;
}
.sayfa-tepe img {
    position: absolute;
    right: 0;
    top: 28px;  
}
.sayfa-baslik {
    background: #a60000;
    width: 100%;
    height: 50px;
}
.sayfa-baslik h1 {
    color: #fff;
    font-weight: 700;
    margin-top: 3px;
}
#icerik {
    width: 100%;
    background: #fff;
    padding-top: 20px;
}
#icerik p {
    float: left;
    font-size: 15px;
    color: #555;
    padding-left: 25px;
    padding-bottom: 15px;
}
#icerik ul li {
    font-family: Roboto Condensed;
    text-align: left;
    font-size: 14px;
    color: #555;
    padding-left: 25px;
    padding-bottom: 15px;
}

#icerik h3 {
    color: #000;
    font-size: 20px;
    padding-left: 25px;
    padding-bottom: 15px;
}

#icerik .icerik-ozel-alan {
    width: 100%;
    margin-top: 20px;
}
#icerik .icerik-sol {
    width: 50%;
}
#icerik .icerik-sag {
    width: 50%;
}
#icerik .spotluk {
    float: right;
    text-align: right;
    color: red;
    font-size: 18px;
    font-style: italic;
    margin-top: 75px;    
}
#icerik .resimlik {
    float: right;
    right: 0;
    border-top: 5px solid red;
    margin-top: 10px;
}

/* KURUMSAL BİTİŞ */

#galeri{
    width: 100%;
    background-color: #fff;
}
.line {
    width: 100%;
    height: 2px;
    background: #ddd;
    margin-top: 5px;
    margin-bottom: 50px;
}
.referans-line {
    width: 100%;
    height: 2px;
    background: #ddd;
    margin-top: 50px;
    margin-bottom: 10px;
}
.galeri-line {
    width: 100%;
    height: 1px;
    background: #ddd;
    margin-top: 25px;
    margin-bottom: 25px;
}
.galeri-linealt {
    width: 100%;
    height: 1px;
    background: #ddd;
    margin-top: 5px;
    margin-bottom: 25px;
}
#referanslar{
    width: 100%;
    background: #fff;
    padding-top: 25px;
}
#referanslar h2 {
    color: #555;
    font-size: 30px;
    padding-bottom: 25px;
    border-bottom: 1px solid #ddd;
}
#referanslar h3 {
    color: #555;
    font-size: 20px;
}
#referanslar ul li {
    font-family: Roboto Condensed;
    text-align: left;
    font-size: 14px;
    color: #555;
    padding-left: 25px;
    padding-bottom: 15px;
}
#referanslar ul li .fa {
    font-size: 12px;
    color: #000;
    padding-right: 10px;
}
#iletisim {
    width: 100%;
    background: #fff;
    padding-top: 20px;
}
#iletisim h1 {
    font-weight: 700;
    text-align: left;
    text-decoration: none;
    font-style: normal;
    color: #555;
    border-bottom: 1px solid #555;

}
#iletisim p {
    font-family: 'Source Sans Pro', sans-serif;
    font-style: normal;
    font-weight: 400;
    float: left;
    font-size: 15px;
    color: #aaa;
    padding-bottom: 15px;
    padding-right: 20px;
}
#iletisim .iletisim-sol {
    width: 100;
    height: 410px;
    background-color: #ddd;
    padding-top: 15px;
}
#iletisim .fa {
    font-size: 20px;
    color: #aaa;
    padding-right: 10px;
}

#iletisim .iletisim-sag {
    float: left;
    text-align: left;
    color: red;
    font-size: 18px;
    font-style: italic;
    margin-top: 75px;    
}



@media screen and (max-width: 1200px) {
     #slogan {
        padding-top: 25px;
        padding-bottom: 25px;
    }
    #slogan img {
        width: 60px;
        height: 61px;    
    }  
    .slogan {
        margin-top: 0;
    }
    #slogan h3 {
        padding-bottom: 0; 
        font-size: 25px;
    }
    .footer-map {
        width: 225px;
        height: 250px; 
    }
       
    #icerik .icerik-sol {
        width: 100%;
    }
    #icerik .icerik-sag {
        width: 100%;
    }
    #icerik .icerik-sag {
    margin-left: 25px;
    }
    
    #icerik .spotluk {
        width: 50%;
        float: left;
        text-align: left;
        margin-top: 10px;
    }
    #icerik .resimlik {
        float: left;
        border-top: 5px solid red;
        margin-top: 10px;
    }

}

@media screen and (max-width: 1023px) {
    header {
        position: absolute;
        width: 100%;
        height: 100px;
        z-index: 100;
        box-shadow: 0px 2px 3px #aaa;
    }
    #logo {
        margin-left: 10px;
        margin-top: 10px;
    }
    nav ul {
        display: none;
    }
    #menu-icon i {
        display: block;
        margin-top: -5px;
        padding-right: 10px;
    }
    nav ul.show {
        display: inline-flex;
        position: absolute;
        z-index: 1000;
        width: 100%;
        height: 329px;
        padding: 0 0px 5px 5px;
        margin: 15px;
        left: -15px;
        top: 85px;
        background: rgba(255,255,255,.9)
    }
    nav ul li a {
       font-size: 15px;
        color: #000;
        text-decoration: none;
        font-weight: 700;
    }
    nav ul li {
        width: 100%;
        text-align: center;
        text-transform: uppercase;
        color: #000;
    }
nav ul li a:hover {
    color: #a60000;
    text-decoration: none;
}
nav ul li a.active {
    color: #fff;
    bottom: 0;
    width: 50px;
    height: 2px;
    background-color: #a60000;
    margin: 0 auto;
    padding: 10px 30% 10px 30%;
}       
    .flexslider {
        padding: 100px 0 0 0;
    }
    #Red-Square {
        height: 100%;
        background-image: none;
        background-color: #6d0000;
    }
    .Red-Square-Content {
        margin-top: 75px;
    }
    #Red-Square img {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    footer {
        padding-top: 30px;
    }

    footer-nav ul li {
        padding-bottom: 25px;
    }
    .footer-map {
        width: 100%;
        height: 225px;
        margin-bottom: 70px;
    }
    .footer-alt-sol {
        float: right;
    }
    .footer-alt-sag {
        float: left;
    }
    .sayfa-tepe {  
        margin-top: 100px;
    }

@media screen and (max-width: 768px) {
    
    .top-bar-sol {
        display: none;
    }
    .top-bar-sag  {
        width: 100%;
        text-align: center;
    }
    h1 {
        font-size: 35px;
        text-align: center;
    }
    h2 {
        font-size: 30px;
        text-align: center;
    }
    h3 {
        font-size: 25px;
        text-align: center;
    } 
    p {
        text-align: center;
    }
    #menu-icon i {
        margin-top: -5px;
    }
    .flex-direction-nav {
        display: none;
    }
    .flex-control-nav {
        display: none;
    }
    .Red-Square-Content {
        margin-top: 50px;
        width: 100%;
    }
    #hizmetlerimiz {
        padding-bottom: 50px;
    }
    #hizmetlerimiz h2 {
        padding-top: 30px;
    }
    #parallax {
        padding-bottom: 40px;
    }
    #parallax h2 {
        padding-top: 40px;
    }
    #partnerlerimiz {
        padding-bottom: 40px;
    }
    #partnerlerimiz h2 {
        padding-top: 40px;
    }
    #partnerlerimiz .col-md-3 {
        width: 100%;
        display: table;
        position: relative;
        overflow: hidden;
        text-align:center;
        margin:20px 0 0 0;  
    }
    footer img {
        padding-bottom: 15px;
        padding-left: 25%;
    }
        #icerik .spotluk {
        width: 92%;
        text-align: center;
    }
}

@media screen and (max-width: 480px) {
    #logo {
        background: url("../img/logo-min.jpg");
        width: 250px;
        height: 53px;
        margin: 20px 0 10px 0;
    }
    
    h1 {
        font-size: 30px;
        }
    h2 {
        font-size: 25px;
    }
    h3 {
        font-size: 20px;
    }   
    #menu-icon i {
        margin-top: 0;
    }
    #slogan {
        margin-bottom: 0;
    }
    #slogan h3 {
        margin-top: 0;
        margin-bottom: 30px;
    }
        #hizmetlerimiz {
        padding-bottom: 25px;
    }
    
    footer img {
        padding-left: 10%;
    }
    footer-nav ul  {
        display: none;
    }
    footer h3 {
        margin-top: -40px;
    }
    #footer-alt {
        height: 90px;
    }
        .footer-alt-sol {
        float:inherit;
    }
    .footer-alt-sag {
        float:inherit;
    }
}

@media screen and (max-width: 400px) {
    #logo {
        background: url("../img/logo-min2.jpg");
        width: 200px;
        height: 42px;
        margin: 30px 0 10px 0;
    }
}
