@import url('../font/font.css');
html {overflow-x: hidden;}
html , body{
    margin: 0;
    padding: 0;
    border: 0;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
    font-family:Century Gothic,Myriad Pro,Trebuchet MS,Arial;
    background-color: #ffffff;
	
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
a{display:block;text-decoration:none;border: none;}
img{border:0;}
.clear{clear:both;}
.white{color:white !important;}

a.sosyal1 {background-image: url('../images/icon/sosyal1.png');display: inline-table;width: 30px;height: 27px;margin: 3px;float: left;margin-right: 25px;}
a.sosyal3 {background-image: url('../images/icon/sosyal.png');display: inline-table;width: 16px;height: 16px;margin: 2px;}

.sosyalalansbu {clear: both;float: left;width: 100%;}
a.facebookc{background-position: 0px;}
a.googlec{background-position: -28px;}
a.instagramc{background-position: 30px;}
a.pinterestc{background-position: -95px;}
a.twitterc{background-position: -195px;}
a.linkedinc{background-position: 75px;}
a.youtubec{background-position: -42px;}

a.facebookd{background-position: 0px;}
a.twitterd{background-position: -21px;}
a.tumblrd{background-position: -42px;}
a.linkedind{background-position: -63px;}
a.googled{background-position: -84px;}


#slide1 {clear: both;float: left;}

.ortalama{width:1175px;margin:auto;}
.menulogo {z-index: 9;float: left;width: 100%;position: relative;border-bottom: 3px solid rgba(255, 255, 255, 0.5);}
.logoalan{clear:both;float: left;width: 200px;text-align: center;height: 100px;}
.logoalan table{width: 100%;height: 100%;}
.technoone {float: right;font-family: 'MyriadPro-Cond',Trebuchet MS,Arial;color: #464646;}



.menualan{float: left;width: calc(100% - 200px);margin-top: 15px;}
#dilalanibu {position: absolute;right: -15px;bottom:0px;border: 1px solid #fff;padding-left: 10px;}
#dilalanibu table {height: 100%;width: 100%;}
#dilalanibu .dillers {float: left;color: #FFF;margin: 0px 5px;font-family: "MyriadPro-Cond";font-size: 16px;font-weight: bold;}
#dilalanibu .dillers:last-child {display: none;}

.logovarmimenualamn {display: none;height: 60px;margin-top: 3px;margin-bottom: -31px;}
.menuyakala .logovarmimenualamn {display: initial;height: 40px;}

.logo{float:left;}
.menu{float:left;width: 100%;margin-top: 3px;padding: 5px 0px;}
.menu .logoms {float:left;margin-top:20px;margin-bottom: 20px;}
.menu .container{float: left;width: 100%;}
#telefon {float: right;margin-top: 18px;}
#undefined-sticky-wrapper {width: 100%;margin: 0px auto;}


.aramacbuk {float: right;width: calc(100% - 765px);margin-top: 15px;}
.aramacbuk input[type="text"] {float: left;background-color: #c7c9cb;border: none;border-radius: 1px;width: calc(100% - 45px);height: 15px;margin-top: 1px;}
.aramacbuk input[type="submit"] {float:right;background-image: url("../images/icon/arama.png");width: 19px;height: 19px;padding: 0px;border: none;background-color: rgba(0, 0, 0, 0);cursor: pointer;}


.baslikalan{width:320px;height:20px;padding:17px;font-size:22px;color:#4a5558;margin:auto;position:relative;letter-spacing:1px;}


.baslikalani {position: relative;clear: both;float: left;width: 100%;margin-bottom: 15px;}
.baslikalani .baslik {float: left;width: 400px;padding-left: 5px;font-family: 'MyriadPro-Cond';font-size: 43px;color: #737373;text-align: center;}
.baslikalani .sagcizgi {right: 0px;bottom: 15px;position: absolute;border-bottom: 1px solid rgba(115, 115, 115, 0.2);width: calc(100% - 400px);}
.baslikalani .solcizgi {left: 0px;bottom: 15px;position: absolute;border-bottom: 1px solid rgba(115, 115, 115, 0.2);}
.baslikalani .sagcizgi2 {right: 0px;bottom: 15px;position: absolute;border-bottom: 1px solid rgba(115, 115, 115, 0.2);}

.ustsiyahalan {clear: both;float: left;width: 100%;background-color: #363636;}
.ustsiyahalan .telefon {float: left;padding: 10px 10px 5px 0px;color: #898989;margin-right: 15px;font-size: 15px;font-family: 'myriad';}
.ustsiyahalan .telefon img {float: left;margin: 0px 7px 5px 0px;}


#slider {clear: both;float: left;width: 100%;height: auto;margin-top: -3px;}
#slider .slider {width: 100%;height: 100%;background-position: center center;background-size: auto 100%;}
#slider .slider img {width: 100%;}


#slide2 {position: relative;margin-top: 0px;padding-top: 25px;clear: both;float: left;width: 100%;color: #58585A;font-family: "myriad";font-size: 22px;background-color: #ffffff;}
#slide2 .baslik {clear:both;float: left;width: 100%;font-size: 30px;color:#363636;text-align: center;font-family: 'ralewaybold';padding-top: 20px;}
#slide2 .baslik span{border-bottom: 2px solid #363636;padding: 15px 20px;}
#slide2 .yazialani {float: right;width: 650px;}

#slide4 {position: relative;margin-top: 0px;padding-top: 25px;clear: both;float: left;width: 100%;color: #58585A;font-family: "ralewayregular";font-size: 20px;background-color: #ffffff;}
#slide4 .baslik {clear:both;float: left;width: 100%;font-size: 30px;color:#363636;text-align: center;font-family: 'ralewaybold';padding-top: 20px;}
#slide4 .baslik span{border-bottom: 2px solid #363636;padding: 15px 20px;}
#slide4 .yazialani {float: right;width: 650px;}
#slide4 p strong {font-family: 'ralewaybold';}


#hakkimizda23 {float:left;clear:both;color: #707070;font-family: 'myriad';font-size: 22px;width: 100%;background-color: #363636;padding: 40px 0px;position: relative;}
#hakkimizda23 h2 {text-align: center;color: #959595;margin: 0px;padding: 0px;line-height: 35px;font-family: 'ralewaybold';font-size: 32px;}
#hakkimizda23 p {padding: 0px;margin: 0px;}
#hakkimizda23:after {content: " ";position: absolute;bottom: 0px;right: calc(50% - 10px);border-width:16px;border-style: solid;border-color: transparent transparent #fafafa transparent;}

#slide9 {position:relative;margin-top: 55px;padding-top: 0px;clear: both; float: left; width: 100%;color: #58585A;font-family: "myriad";font-size: 14px;overflow: hidden;background: url('../images/sayfalar/govde.jpg') 100% 100%;}
#slide9 .tamekranclasres {position: absolute;top: 0px;left: 0px;min-height: 100%;min-width: 100%;z-index: -1;}


#slide5 {position:relative;margin-top: 55px;padding-top: 0px;clear: both; float: left; width: 100%;color: #58585A;font-family: "myriad";font-size: 14px;overflow: hidden;}
#slide5 .tamekranclasres {position: absolute;top: 0px;left: 0px;min-height: 100%;min-width: 100%;z-index: -1;}
#referanslar {clear: both;float: left;width: 100%;position: relative;margin: 70px 0px;}
#referanscik {clear: both;float: left;width: 98%;position: relative;margin: 1%;overflow: hidden;}
#referanscik .resims {float: left;position: relative;width: 201px;text-align: center;height: 100px;margin-left:28px;}
#referanscik .resims table{width: 100%;height: 100%;}
#referanscik .resims img {max-width: 201px;max-height: 100px;}
#solreficons {background-image: url('../images/sayfalar/referans/refsol.png');width: 30px;height: 30px;position: absolute;left: -15px;top: calc(50% - 15px);cursor: pointer;}
#sagreficons {background-image: url('../images/sayfalar/referans/refsag.png');width: 30px;height: 30px;position: absolute;right: -10px;top: calc(50% - 15px);cursor: pointer;}
#kayandivreferans {width: 999999%;position: relative;}


#cozumlersi {clear: both;float: left;width: 100%;margin: 60px 0px;text-align: center;}
#cozumlersi .satirdv {margin: 30px 20px;display: inline-block;width: calc(33% - 40px);vertical-align: top;cursor: pointer;}
#cozumlersi .satirdv .icon{clear: both;float: left;width: 100%;}
#cozumlersi .satirdv .icon img{height: 55px;}
#cozumlersi .satirdv .baslik{clear: both;float: left;width: 100%;font-size: 24px;font-family: 'ralewaybold';color: #939598;margin-top: 20px;height: 58px;overflow: hidden;}
#cozumlersi .satirdv .icerik{clear: both;float: left;width: 100%;font-size: 14px;font-family: 'robotoregular';color: #636466;margin-top: 30px;}
#cozumlersi .satirdv:hover .baslik{color: #e5493a;}
#cozumlersi .satirdv:hover .icerik{color: #ffffff;}


 #arabizdenkareler {clear: both;float: left;width: 100%;margin-top: 50px;position: relative;}
#arabizdenkareler>img {width: 100%;}
#arabizdenkareler .baslikarka {width: 100%;position: absolute;bottom:0px;}
#arabizdenkareler .baslikarka img {float: right;margin-right: 125px;}

#slide5 {clear: both;float: left;width: 100%;margin-top: 55px;padding-top: 0px;color: #58585A;font-family: "MyriadPro-Cond";font-size: 22px; background: url('../images/sayfalar/referans/arkaplan.jpg') 100% 100%;}
#slide5 .baslikalan {background-color: #e92d30; color: #fff; font-family: Century Gothic; width: 698px; margin-left: 165px; z-index: 9; margin-top: -32px; padding-top: 60px; padding-bottom: 3px; font-size: 35px;}
/*#slide5 .projec:hover .resim>img {-webkit-filter: grayscale(100%); filter: grayscale(100%);}*/
.projec .hoveratico {position: absolute;bottom: -157px;left: 0px;height: 100%;width: 100%;text-align: center;background-color: rgba(0, 0, 0, 0.47);}
.projec .hoveratico table{height: 100%;width: 100%;}
.projec {overflow: hidden;
    -moz-box-shadow: 3px 3px 6px 1px #808080;
    -webkit-box-shadow: 3px 3px 6px 1px #808080;
    box-shadow: 3px 3px 6px 1px #808080;
    position: relative;
}
#slide5 .projec .hovbaslik {font-size: 14px;background-color: rgba(255, 255, 255, 0.5);width: 100%;position: absolute;bottom: -50px;padding: 15px 5px;overflow: hidden;color:#fff;text-align: center;white-space: nowrap; text-overflow: ellipsis;}

#slide6 {width: 100%;clear: both;float: left;position: relative;color: #58585A;font-family: "MyriadPro-Cond";font-size: 22px;background-color: #252525;}
#slide6 .baslikalan {background-color: #e92d30; color: #fff; font-family: Century Gothic; width: 698px; margin-left: 165px; z-index: 9; margin-top: 420px; padding-top: 60px; padding-bottom: 10px; font-size: 35px;}

#haritaalan {width: 100%;clear: both;float: left;position: relative;}
#haritaalan .baliksbuharita { position: absolute; bottom: 4px; width: 100%; }
#haritaalan .baliksbuharita img {float: right;margin-right: 125px;}

#yoltarigial {position: absolute;top: -40px;left: calc(50% - 155px);background-image: url('../images/icon/yoltarifi.png');width: 311px;height: 20px;}
#ortaalans2 {position: relative;margin-top: 58px;clear: both; float: left; width: 100%;}
#ortaalans2>.ortalama>img {position: relative;z-index: 10; margin-left: 8px;}
#ortaalans2 .resimarka {width: 100%;position: absolute;top:0px;z-index: 1;min-height: 400px;}


#adres {width: 47%;float: left; color: #717171;; font-size: 18px; text-align: left;font-family: 'robotoregular'; }
#adres h3,#forum h3 {font-size: 17px;font-weight: bold;margin: 0px;padding: 0px;color: #737373;font-family: 'robotobold';}
#adres b{font-weight: bold;}
#forum {width: 45%;float: right; font-size: 14px; text-align: left; font-size: 14px; }

.iletisim{clear: both;float: left;margin-top: 100px;width: 100%;margin-bottom: 100px;}
.iletisim #forum div{margin-bottom: 10px;}
.iletisim textarea{background-color: #464646;height: 120px;color: #939598;width: calc(100% - 20px);font-size: 20px;border: none;padding: 10px;font-family: 'robotoregular';}
.iletisim input[type="text"]{width: calc(100% - 20px);outline: 0px none;height: 20px;color: #939598;background-color: #464646;font-size: 20px;border: none;padding: 10px;font-family: 'robotoregular';}
.iletisim  input[type="submit"]{outline: 0px none;border: 0px none;background: #939598;color: #030000;cursor: pointer;float: right;font-family: 'robotoregular';font-size: 20px;padding: 6px 30px;margin-top: -12px;}


#footer{padding:20px 0px;background-color: #E92D32; clear: both;float: left;width: 100%;}
.copyright{float:left;font-size:14px;padding-left:10px;}
.webtasarim{position:fixed;bottom:0px;right:0px;}

.menuyakala{position: fixed;left: 0px;top: -3px;z-index: 10;width: 100%;background: #fff;}
.menuyakalss{width: 1030px !important;margin: auto;float: initial !important;}
.menuyakala #telefon {display: none;}
.menuyakala ul.navigation2 li {padding: 0px 15px 10px;}
.menuyakala .logoms {height: 30px;margin-top: 10px; margin-bottom: 10px;}

.formhata{background:red;color:#fff;padding:10px;border:2px dashed #ddd;}
.formhata span{padding:5px;padding-left:0px;color:#960000;cursor:pointer;}


.container .logommin {width: 150px;float: left;display: none;}
.menuyakala .logommin{display: block;}
.menuyakala .logommin img {height: 29px;margin-top: 0px;margin-bottom: 0px;}
.menuyakala .aramacbuk {float: right;width: calc(100% - 875px);margin-top: 9px;}


#solokalansdf {position: absolute;left: 0px;top:calc(50% - 21px);background-image: url('../images/slider/solok.png');height: 42px;width: 42px;z-index: 3;cursor: pointer;}
#sagokalansdf {position: absolute;right: 0px;top:calc(50% - 21px);background-image: url('../images/slider/sagok.png');height: 42px;width: 42px;z-index: 3;cursor: pointer;}


#kurmuzualans {clear: both;float: left;width: 100%;background-color: #e5493a;margin-top: -3px;font-family: 'robotomedium';color: #ffffff;}
#kurmuzualans .baslik {float: left;padding: 20px 0px;font-size: 18px;}
#kurmuzualans .dizayns {float: right;}
#kurmuzualans .dizayns li {float: left;color: #f4897e;}
#kurmuzualans .dizayns li.aktif {float: left;color: #ffffff;}
#kurmuzualans .dizayns li a{color: #f4897e;padding: 9px;font-size: 12px;}
#kurmuzualans .dizayns li.aktif a{color: #ffffff;}


.solalans {clear:both;float:left;width: 70%;position: relative;}
#solokalansd {position: absolute;top: calc(50% - 82px);left:0px;background-image: url('../images/sayfalar/portfolyo/solok.png');width: 42px;height: 42px;cursor: pointer;}
#sagokalansd {position: absolute;top: calc(50% - 82px);right:0px;background-image: url('../images/sayfalar/portfolyo/sagok.png');width: 42px;height: 42px;cursor: pointer;}

.sagalans {float: right;width: calc(30% - 30px);position: relative;}
.sagalans h3 {color: #363636;font-size: 24px;font-family: 'ralewaybold';}
.sagalans p {color: #959595;font-size: 14px;font-family: 'robotoregular';}
.sagalans table {width: 100%;font-family: 'robotoregular';font-size: 14px;color: #363636;}
.sagalans table tr {border-bottom: 1px solid #fafafa;}
.sagalans table tr:last-child {border: none;}
.sagalans table td {padding: 10px 0px;}

#sonrakionceki {float: left;width: 100%;clear: both;background-color: #fafafa;padding: 50px 0px;margin-bottom: -55px;font-size: 14px;font-family: 'robotoregular';}
#sonrakionceki #onceki {float: left;width: 40%;color: #cccccc;}
#sonrakionceki #ortaalans {float: left;width: 20%;text-align: center;color: #cccccc;}
#sonrakionceki #sonraki {float: right;width: 40%;color: #cccccc;}

#sonrakionceki .onceki {font-family: 'ralewaysemibold';font-size: 18px;color: #363636;}
#sonrakionceki a:hover .onceki{color: #e5493a;}

#onceki .solokbu{float: left;background-image: url('../images/icon/onceki.png');width: 20px;height: 34px;}
#onceki .iceriks{float: right;width: calc(100% - 40px);}

#sonraki .sagokbu{float: right;background-image: url('../images/icon/sonraki.png');width: 20px;height: 34px;}
#sonraki .iceriks{float: left;width: calc(100% - 40px);text-align: right;}


/* Navigation */
.navigation2{
    list-style: none;
    margin: 0;
}
ul.navigation2 {position: relative;margin: 0 auto;padding: 0;height: 34px;z-index: 1;float: left;left: 80px;}
.navigation2 li{
    position:relative;
    float: left;
    text-align:left;
    padding: 9px 15px 10px;
    background:none;
    font-family: 'ralewayheavy';
    font-weight:400;
    font-size:14px;
    line-height:20px;
    color:#555555;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.navigation2 li .yazi{float:left;}
.navigation2 li .cizgi{ position: absolute; right: -4px; top: 5px; font-size: 11px;color:#fff}
.navigation2 li:hover,
.navigation2 .active {
    color: #e5493a;
    cursor: pointer;
}
.navigation2 li .cizgis {clear: both;float: left;width: 20%;
    border-top: 2px solid rgba(0, 0, 0, 0);
    cursor: pointer;
    margin-bottom: 5px;
}
.navigation2 li:hover .cizgis, .navigation2 .active .cizgis
{
    border-top: 2px solid rgba(229, 73, 58, 0);
}

.btn_dropdown {
    display:none;
    cursor:pointer;
    background:#fff;
    margin:20px 30px 0 0;
    width:130px;
    height:36px;
    text-align:center;
    font-weight:700;
    font-size:18px;
    line-height:36px;
    color:#3e3e3e;
    border-radius:5px;
}
.btn_dropdown:hover {color:#3e3e3e;}




.icon-marka {display:inline-block;background-image: url('../images/icon/marka.png');width: 63px;height: 62px;}
.satirdv:hover .icon-marka{background-image: url('../images/icon/markaa.png');}

.icon-reklam {display:inline-block;background-image: url('../images/icon/reklam.png');width: 53px;height: 51px;}
.satirdv:hover .icon-reklam {background-image: url('../images/icon/reklama.png');}

.icon-bilinir {display:inline-block;background-image: url('../images/icon/bilinir.png');width: 39px;height: 51px;}
.satirdv:hover .icon-bilinir {background-image: url('../images/icon/bilinira.png');}

.icon-musteri {display:inline-block;background-image: url('../images/icon/musteri.png');width: 63px;height: 62px;}
.satirdv:hover .icon-musteri {background-image: url('../images/icon/musteria.png');}

.icon-fikir {display:inline-block;background-image: url('../images/icon/fikir.png');width: 53px;height: 50px;}
.satirdv:hover .icon-fikir {background-image: url('../images/icon/fikira.png');}

.icon-gelisim {display:inline-block;background-image: url('../images/icon/gelisim.png');width: 52px;height: 50px;}
.satirdv:hover .icon-gelisim {background-image: url('../images/icon/gelisima.png');}





@media screen and (max-width: 1190px)
{
    .menualan {width: calc(100% - 300px);}
    .aramacbuk {float: right;width: calc(100% - 710px);margin-top: 15px;}
}
@media screen and (max-width: 1080px)
{
    .menualan {width: calc(100% - 350px);}
    .aramacbuk {float: right;width: calc(100% - 700px);margin-top: 15px;}
    .ortalama {width: calc(100% - 20px);padding-left: 10px;padding-right: 10px;}
}
@media screen and (max-width: 1030px)
{
    ul.navigation2 {left:0px;}
    .menualan {width: calc(100% - 200px);}
    .aramacbuk {width: 200px;}

    .menuyakala ul.navigation2 {margin-right: 30px;}
    .menuyakalss {width: 100% !important;}
    .projec .resim>img {min-height: 100%;min-width: 100%;width: inherit;}
}
@media screen and (max-width: 990px)
{
    .aramacbuk input[type="text"] {width: calc(100% - 30px);}
    .menuyakala .aramacbuk {width: calc(100% - 810px);}
}
@media screen and (max-width: 980px)
{
    .menuyakala .aramacbuk {width: calc(100% - 790px);}
}
@media screen and (max-width: 810px)
{
    .navigation2 li {font-size: 12px;}
    .menu .container {width: auto;}
    .menuyakalss>a{text-align: center;}
    .logovarmimenualamn {margin-bottom: 20px;}
    .projec {width: 29%;}
    .menuyakala .aramacbuk {width: calc(100% - 700px);}
    .solalans,.sagalans{clear: both;float: left;width: 100%;}
}
#responmenu {display: none;}
@media screen and (max-width: 750px)
{
    #responmenu {display:block;cursor:pointer;float: right;margin: 12px;}
    .aramacbuk {display:none;clear: both;margin-top: 1px;margin-right: 15px;}
    .menu .container {width: 100%;}
    ul.navigation2 {display:none;position: absolute;top: 100px;width: 96%;margin: 0px 2%;height: auto;}
    .navigation2 li {clear: both;float: left;width: calc(100% - 30px);text-align: center;border-bottom: 1px solid #B43D3D;background-color: rgba(39, 39, 39, 0.9);color: #fff;}
    .navigation2 li:last-child{border: none;}
    .navigation2 li .cizgis {display: none;}
    .navigation2 li .yazi {width: 100%;}
    .menuyakala ul.navigation2 {width: 96%;margin: -55px 2%;}
    .menuyakala ul.navigation2 li {padding: 9px 15px 10px;font-size: 12px;}
    .menuyakala #responmenu {margin: 3px 12px;}

    #cozumlersi .satirdv {width: calc(50% - 45px);}
    #adres, #forum {clear: both;width: 100%;}
}
@media screen and (max-width: 470px)
{
    #cozumlersi .satirdv {width: calc(100% - 45px);}
    #hakkimizda23 h2 {line-height: 28px;font-size: 28px;}
    #hakkimizda23 p {font-size: 18px; }
}
@media screen and (max-width: 400px)
{
    .baslikalani .baslik {width: 100%;}
    .projec {width: 95%;}
    .ustsiyahalan .telefon {font-size: 12px;}
}
@media screen and (max-width: 350px)
{
    .ustsiyahalan .telefon {font-size: 10px;}
}
@media screen and (max-width: 270px)
{
    .navigation2 li {font-size: 16px;padding: 9px 5px 7px;}

}