@import 'reset.css';
@font-face {
    font-family: 'Harabara';
    src: url('../js/wfont/harabara-webfont.eot');
    src: url('../js/wfont/harabara-webfont.eot?#iefix') format('embedded-opentype'),
         url('../js/wfont/harabara-webfont.woff') format('woff'),
         url('../js/wfont/harabara-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Dekar';
    src: url('../js/wfont/dekar-webfont.eot');
    src: url('../js/wfont/dekar-webfont.eot?#iefix') format('embedded-opentype'),
         url('../js/wfont/dekar-webfont.woff') format('woff'),
         url('../js/wfont/dekar-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
html{ height:100%}
body{ background:url(../img/bg.jpg); font-family:Harabara; color:#FFF; height:100%}

.top{ position:relative; float:left; width:100%; height:80px; background:url(../img/top_bg.jpg) top center}
.top .container{ position:relative; width:960px; height:80px; margin:0 auto}
.top .container .logo{ position:absolute; top:30px; left:20px}
.top .container .contactt{ position:absolute; top:30px; right:20px; font-size:22px; color:#FFF}
.top .container .contactt a{ color:#FFF; text-decoration:none}
.top .container .contactt a:hover{ color:#FFF; text-decoration:underline}

.promo{ position:relative; float:left; width:100%; height:302px; background:url(../img/promo_bg.jpg) top center}

.references{ position:relative; float:left; width:100%; height:207px; background:url(../img/references_bg.png) top center}
.references .container{ position:relative; width:960px; height:207px; margin:0 auto; background:url(../img/references_line.png) center center no-repeat}
.references .container .sabanci{ position:absolute; top:40px; left:70px}
.references .container .castrol{ position:absolute; top:46px; left:215px}
.references .container .beta{ position:absolute; top:46px; left:375px}
.references .container .nuruziya{ position:absolute; top:36px; left:540px}
.references .container .lacucina{ position:absolute; top:46px; left:670px}
.references .container .antyapi{ position:absolute; top:46px; left:800px}
.references .container .ezic{ position:absolute; top:130px; left:77px}
.references .container .faruksarac{ position:absolute; top:138px; left:208px}
.references .container .ttnet{ position:absolute; top:138px; left:373px}
.references .container .saygi{ position:absolute; top:125px; left:540px}
.references .container .propa{ position:absolute; top:132px; left:677px}
.references .container .peymane{ position:absolute; top:126px; left:834px}

.contact{ position:relative; float:left; width:100%}
.contact .container{ position:relative; width:960px; margin:0 auto}
.contact .container .contact_info{ position:relative; float:left; width:540px; font-family:Dekar; color:#FFFFFF; font-weight:bold; font-size:22px}
.contact .container .contact_info .title{ position:relative; float:left; font-size:45px; margin:100px 0 0 60px}
.contact .container .contact_info .address{ position:relative; float:left; margin:50px 0 0 50px; padding:5px 0 0 40px; background:url(../img/address.png) left center no-repeat}
.contact .container .contact_info .tel{ position:relative; float:left; width:200px; margin:30px 0 0 50px; padding:5px 0 0 40px; background:url(../img/tel.png) left center no-repeat}
.contact .container .contact_info .mobile{ position:relative; float:left; margin:30px 0 0 0; padding:5px 0 0 32px; background:url(../img/mobile.png) left center no-repeat}
.contact .container .contact_info .fax{ position:relative; float:left; margin:15px 0 0 50px; padding:5px 0 0 32px; background:url(../img/fax.png) left center no-repeat}
.contact .container .contact_info .mail{ position:relative; float:left; width:300px; margin:40px 0 0 50px; padding:5px 0 0 32px; background:url(../img/mail.png) left center no-repeat}

.contact .container .maps{ position:relative; float:left; width:420px; margin-top:50px}

.contact .container .contact_form{ position:relative; float:left; width:960px; height:380px; font-family:Dekar; color:#FFFFFF; font-weight:bold; font-size:22px}
.contact .container .contact_form .input{width:207px; height:30px; font-size:14px; color:#000000; font-family:"Trebuchet MS"; margin-top:4px; font-weight:bold; padding:4px; resize:none; border:0px; border-radius:4px; overflow:hidden; background:#FFF}
.contact .container .contact_form .textarea2{width:308px; height:116px; font-size:14px; color:#000000; font-family:"Trebuchet MS"; margin-top:4px; padding:4px; resize:none; border:0px; border-radius:4px; overflow:auto; background:#FFF}

.contact .container .contact_form .title{ position:relative; font-size:45px; margin:70px 0 0 60px}
.contact .container .contact_form .form_area{ position:relative; font-size:22px; margin:20px 0 0 60px}
.contact .container .contact_form .form_area .name{ position:absolute; top:0px; left:0px}
.contact .container .contact_form .form_area .tel{ position:absolute; top:86px; left:0px}
.contact .container .contact_form .form_area .city{ position:absolute; top:0px; left:235px}
.contact .container .contact_form .form_area .mail{ position:absolute; top:86px; left:235px}
.contact .container .contact_form .form_area .message{ position:absolute; top:0; left:470px}
.contact .container .contact_form .form_area .button{ position:absolute; top:26px; right:0px}
.contact .container .contact_form .form_area .sonuc2{ position:absolute; top:170px; left:0px; font-size:15px; font-family:"Trebuchet MS"; color:#ed1c24}

.footer{ position:relative; float:left; width:100%; height:70px; background:url(../img/footer_bg.png)}
.footer .container{ position:relative; width:960px; margin:0 auto}
.footer .container .copyright{ position:relative; float:left; width:400px; font-size:15px; font-weight:bold; color:#FFFFFF; font-family:Dekar; margin:25px 0 0 60px}
.footer .container .redif{ position:relative; float:left; width:500px; margin:28px 0 0 0; text-align:right}