html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0}ol,ul,li{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}
html{height:100%;}
body{
height:100%;
background:#fff;
color:#333;
font-family: 'Roboto', sans-serif;
font-size:17px;
font-weight:300;
}
.radius3{-webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px;}
.radius5{-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
.circle{-webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;}
.transition{-webkit-transition:all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s;}
.shadow{-moz-box-shadow:0px 1px 3px 0px rgba(0, 0, 0, 0.21); -webkit-box-shadow:0px 1px 3px 0px rgba(0, 0, 0, 0.21);  box-shadow:0px 1px 3px 0px rgba(0, 0, 0, 0.21);}
.shadow5{-webkit-box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15); -moz-box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15); box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15);}
.shadow6{box-shadow: 0 5px 25px 0 rgba(41,128,185,.15);}
.borderbox{box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.cover{-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: center;}
.background{background: rgba(0,43,94,0.9);}
.height10{height:10px; width:100%; float:left;}
.height20{height:20px; width:100%; float:left;}
.height30{height:30px; width:100%; float:left;}
.height40{height:40px; width:100%; float:left;}
.height50{height:50px; width:100%; float:left;}
.temizle{ clear:both;}
.temizlesol{clear:left;}
.temizlesag{clear:right;}
a{color:#59626c; text-decoration:none;}
a:hover{color:#4185c6; text-decoration:none;}
#row{width:100%; height:auto; float:left;}
#container{width:80%; height:auto; float:left; margin:0px 10%;}
.colorline{ width:100%; height:3px; float:left; background:url(../images/colourfull-line.jpg);}
/**********/
#top{width:90%; height:40px; padding:0px 5%; float:left; color:#8ca1b9; background:#ebebeb;}
#top ul{width:auto; height:40px; float:left;}
#top ul li{width:auto; height:40px; float:left; font-size:15px; line-height:40px; margin-right:12px;}

#header{width:90%; height:90px; padding:0px 5%; float:left; color:#8ca1b9; position:relative;}

ul#menu{width:10%; height:80%; float:left; background:#fff; position: fixed; left:0; top:10%; bottom:10%; display:none; z-index:999999; border:1px solid #d1d1d1; border-left:0px;}
ul#menu li{width:100%; height:40px; float:left; line-height:40px; }

#header figure{width:300px; height:80px; position:absolute; left:50%; top:5px; margin-left:-150px; text-align:center; cursor:pointer;}
#header figure img{width:auto; height:80px; margin:0px auto;}


#header ul{width:auto; height:40px; float:right; margin:25px 0;}
#header ul li{width:auto; height:40px; float:left; line-height:40px; font-size:16px; font-weight:600; margin-right:8px;}
#header ul li:last-child{margin-right:0px;}
#header ul li a{color:#4185c6;}
#header ul li a:Hover{color:#ccc;}
#header ul li i{width:40px; height:40px; text-align:center; line-height:40px; font-size:24px;}
#header ul li a.aktifdil{color:#ff0000;}




/************/
/************/
.sidebar {height: 100%; width: 0; position: fixed; z-index:999999; top: 0; left: 0; background-color: #f5f5f5; overflow-x: hidden; transition: 0.5s; padding-top: 60px;}
.sidebar .closebtn {position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; color:#ccc;}
.sidebar a{ display:block; color:#8ca1b9; padding:12px 5%; font-size:16px; font-weight:400; border-bottom:1px dotted #d1d1d1;}
.sidebar a:Hover{color:#ccc;}

.openbtn {width:50px; height:50px; float:left; line-height:50px; margin:20px 0px; font-size:18px; cursor:pointer;  transition:0.3s; z-index:9999; position:relative;}
.openbtn span {position: absolute; height:3px; width: 25px; background: #8ca1b9; top: 50%; left: 50%; transform: translate(-50%,-50%); transition: 0.3s;}
.openbtn span:before {content: ''; position:absolute; top: -8px; left:0; background: #8ca1b9; height: 3px; width: 25px; transition: 0.3s; }
.openbtn span:after {content: ''; position:absolute; top: 8px; left:0; background: #8ca1b9; height: 3px; width: 25px; transition: 0.3s;}
.openbtn.active span { background-color: transparent; }
.openbtn.active span:before { transform: rotate(45deg);top: 0; }
.openbtn.active span:after { transform: rotate(-45deg);top: 0; }

#main {
transition: margin-left .5s;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidebar {padding-top: 15px;}
  .sidebar a {font-size: 18px;}
}


#topimg{width:100%; height:300px; float:left; background-image:url(../images/img1.jpg); background:#4185c6; margin:0px 0% 30px 0%;}
#topimg section{display:table; color:#FFFFFF; width:100%; height:100%; text-align:center; font-size:32px; font-weight:400;}
#topimg section article{display:table-cell; vertical-align: middle; width:100%; height:auto; line-height:60px;}

/***************  / Petek Tasarim/  ***************/
#index{width:90%; height:auto; float:left; margin:0px 5%;}
#index section{display:table; color:#FFFFFF; width:100%; height:100%; text-align:center; font-size:23px; font-weight:400;}
#index section article{display: table-cell; vertical-align: middle;}

.i{position:relative; overflow:hidden; cursor:pointer;}
.i:Hover .iii{color:rgba(255,255,255,0.1); font-size:160px!important; }
.iii{position:absolute; right:10px; bottom:10px; color:rgba(255,255,255,0.2); font-size:200px!important; -webkit-transition:all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s;}


#indexsol{width:33%; height:auto; float:left; position:relative; z-index:10;}
#indexsol1{width:90%; height:300px; padding:5%; float:left; background-color:#78af7c;
margin-bottom:30px;background-image:url(../images/img6.jpg); background-repeat:no-repeat; background-position:bottom left;}
#indexsol2{width:100%; height:600px; float:left; background:#ef7as80; overflow:hidden; position:relative; background-image:url(../images/img3.jpg)}
#indexsol2 p{ position:absolute; top:10px; left:5%; right:5%; width:90%; font-size:16px; color:#FFFFFF;}

#indexsag{width:63%; height:450px; float:left; position:relative; z-index:10; margin-left:4%; }
#indexsag1{width:100%; height:450px; float:left; background-image:url(../images/img5.png); background-repeat:no-repeat; background-position:bottom left; background-color:#cf004d; margin-bottom:30px;}
#indexsag1 a{color:#FFFFFF; font-weight:400; font-size:23px;}
#indexsag2{width:48%; height:450px; float:left;}
#indexsag2 div:first-child{width:100%; height:230px; float:left; background:#fab975; margin-bottom:30px;}
#indexsag2 div:last-child{width:100%; height:230px; float:left; background:#83c482;}
#indexsag3{width:48%; height:490px; float:left; margin-left:4%; background:#ef7a80;}



#indexalt{width:90%; height:auto; float:left; padding:50px 5%; background:#8081c4;  color:rgba(255,255,255,1); text-align:center;}
#indexalt h2{ width:100%; height:auto; float:left;font-size:28px; font-weight:400; line-height:50px;}
#indexalt p{ width:100%; height:auto; float:left;font-size:15px; font-weight:300;}



#indexaltsol i:nth-child(3){width:auto; height:auto; position:absolute; left:200px; bottom:10px; font-size:96px;}



#indexiletisim{ width:100%; height:auto; float:left; background:#009ba5; padding:30px 0px; text-align:center; color:#FFFFFF;}
#indexiletisim span{width:100px; height:100px; padding:30px; background:#FFFFFF; color:#000000; font-size:72px; line-height:100px;}
#indexiletisim .homebuton{width:100px; height:60px; background:#FF6600; color:#fff; font-size:21px; padding:14px 21px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px;}



ul#urunler{width:90%; height:auto; float:left; position:relative; margin:0px 5%;}
ul#urunler li{width:100%; height:auto; float:left; text-align:center; padding:2%; background:#FFFFFF; cursor:pointer;}
ul#urunler li:Hover{-webkit-box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15); -moz-box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15); box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15);}
ul#urunler li figure{width:100%; height:auto; float:left; overflow:hidden;}
ul#urunler li figure img{width:100%; height:auto; float:left;}
ul#urunler li h3{width:100%; height:60px; float:left; font-size:1.05em; display:block; margin:10px 0px;}
ul#urunler li p{width:100%; height:auto; float:left; font-size:14px; display:block; color:#909090;}
ul#urunler li.urunkutu1{margin-right:0%; margin-bottom:2%;}
ul#urunler li.urunkutu2{margin-right:0%; margin-bottom:2%;}

ul#basindabiz{width:90%; height:auto; float:left; position:relative; margin:0px 5%;}
ul#basindabiz li{width:23.5%; height:auto; float:left; text-align:center; padding:2%; background:#fff; cursor:pointer;}
ul#basindabiz li:Hover{-webkit-box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15); -moz-box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15); box-shadow: 0 18px 42px 0 rgba(28, 30, 35, 0.15);}
ul#basindabiz li figure{width:100%; height:auto; float:left; overflow:hidden;}
ul#basindabiz li figure img{width:100%; height:auto; float:left;}
ul#basindabiz li h3{width:100%; height:60px; float:left; font-size:1.05em; display:block; margin:10px 0px;}
ul#basindabiz li p{width:100%; height:auto; float:left; font-size:14px; display:block; color:#909090;}
ul#basindabiz li.basindabizkutu1{margin-right:2%; margin-bottom:2%;}
ul#basindabiz li.basindabizkutu2{margin-right:0%; margin-bottom:2%;}


/***************  / Petek Tasarim/  ***************/
.bread{width:80%; height:auto; margin:0px 0% 30px 0%; padding:28px 10%; float:left; font-weight:300; font-size:13px; background:#4185c6; color:#FFFFFF;}
.bread h3{width:100%; height:auto; float:left; font-size:26px; margin-bottom:10px;}
.bread p{width:100%; height:auto; float:left; font-size:13px;}
.bread a{color:#ffffff;}
.bread a:hover{color:#ffffff;}

#detay{width:90%; height:auto; padding:20px 5%; float:left;}
#detaysol{width:40%; height:auto; float:left;}
#detaysol figure{width:100%; height:auto; float:left;}
#detaysol figure img{width:100%; height:auto; float:left;}
#detaysag{width:55%; height:auto; margin-left:5%; float:left; overflow:hidden;}
#detaysag pre{max-width:100%; height:auto; float:left;}

#kariyer{width:60%; height:auto; padding:20px 20%; float:left;}
#kariyer figure{width:100%; height:auto; float:left;}
#kariyer figure img{width:100%; height:auto; float:left;}
#kariyer h2{width:100%; height:auto; float:left; font-size:28px; margin:10px 0px; font-weight:300;}
#kariyer p{width:100%; height:auto; float:left; font-size:15px; font-weight:300;}

#sitemap{width:60%; height:auto; padding:20px 20%; float:left;}
#sitemap ul{width:100%; height:auto; float:left; line-height:32px;}
#sitemap ul li{width:100%; height:auto; float:left;}


#map{width:90%; height:300px; margin:0px 5%; float:left;}
ul#form{width:100%; height:auto; float:left; border:1px solid #d1d1d1; background:#fff; padding:2%; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;}
ul#form li{width:100%; height:auto; float:left; margin-bottom:10px;}
ul#form li input{width:32%; height:48px; float:left; border:1px solid #d1d1d1; background:#FFFFFF; padding:2%; outline:0; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;font-size:1.1em; font-weight:400;}
ul#form li textarea{width:100%; height:100px; float:left; border:1px solid #d1d1d1; background:#FFFFFF; outline:0; padding:2%; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;font-size:1.1em; font-weight:400;}
ul#form li button{width:100%; height:50px; float:left; line-height:50px; background:#666; border:0; cursor:pointer; color:#FFFFFF; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;}
ul#form li input::-webkit-input-placeholder,#iletisim form ul li textarea::-webkit-input-placeholder,#iletisim form ul li select::-webkit-input-placeholder {color:#999999;}
ul#form li input::-moz-placeholder,#iletisim form ul li textarea::-moz-placeholder,#iletisim form ul li select::-moz-placeholder{color: #999999;}
ul#form li input:-ms-input-placeholder,#iletisim form ul li textarea:-ms-input-placeholder,#iletisim form ul li select:-ms-input-placeholder{color: #999999;}
ul#form li input:-moz-placeholder,#iletisim form ul li textarea:-moz-placeholder,#iletisim form ul li select:-moz-placeholder {color:#999999;}
ul#form li input:Focus,#iletisim form ul li textarea:Focus,#iletisim form ul li select:Focus{border: 1px solid #666; color:#000000;}
ul#form li input.ortainput{margin-left:2%;}
ul#form li input.saginput{margin-left:2%;}
ul#iletisimbilgileri{width:38%; height:auto; float:left; border:1px solid #d1d1d1; background:#fff; padding:2%; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; margin-left:2%;}
.iletisimmap{width:100%; height:300px; float:left; border:1px solid #d1d1d1; padding:2%; margin:20px 0px; overflow:hidden;-webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;}

/***************  / Petek Tasarim/  ***************/
footer{width:80%; height:auto; padding:20px 10%; float:left; background:#fff; color:#4185c6; font-size:12px;}
footer a{color:#4185c6;}
footer a:Hover{color:#4185c6;}
footer .footerust{width:100%; height:auto; float:left;}
footer .footerust ul{width:100%; height:auto; float:left; text-align:center;}
footer .footerust ul li{width:28px; height:28px; margin:0px auto; line-height:24px; display:inline-block;}
footer .footerust ul li i{ width:24px; height:24px; text-align:center; color:#FFFFFF; line-height:24px; background:#4185c6!important;}
footer .footeralt{width:100%; height:auto; float:left;}
footer .footeralt ul{width:100%; height:auto; float:left; text-align:center;}
footer .footeralt ul li{width:auto; height:auto; line-height:24px; display:inline-block; margin-right:20px;}
footer .footeralt ul li:last-child{margin-right:0px;}

#footerbottom{width:90%; height:40px; padding:10px 5%; float:left; background:#f4f4f4; line-height:40px; font-size:13px;}
#footerbottom ul{width:100%; height:40px; float:left;}
#footerbottom ul li{width:auto; height:40px; float:left; margin-right:8px;}
#footerbottom ul li a{-webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; background:#fff; display:block; padding:0px 13px; color:#4185c6;}


@media (min-width: 992px) {}
@media (min-width: 768px) {}
@media (min-width: 993px) {ul#hmenu{display:none!important;}}
@media (max-width: 992px) {

#header ul{width:auto; height:40px; float:right; margin:25px 0;}
#header ul li{width:auto; height:40px; float:left; line-height:40px; font-size:16px; font-weight:600; margin-right:8px;}
#header ul li:last-child{margin-right:0px;}
#header ul li:nth-child(1){display:none;}
#header ul li:nth-child(2){display:none;}

.bread{width:80%; height:auto; margin:0px 0% 30px 0%; padding:30px 10%;}



#index{width:90%; height:auto; float:left; margin:0px 5%;}
#index section{display:table; color:#FFFFFF; width:100%; height:100%; text-align:center; font-size:23px; font-weight:400;}
#index section article{display: table-cell; vertical-align: middle;}

.i{position:relative; overflow:hidden; cursor:pointer;}
.i:Hover .iii{color:rgba(255,255,255,0.1); font-size:160px!important; }
.iii{position:absolute; right:10px; bottom:10px; color:rgba(255,255,255,0.2); font-size:200px!important; -webkit-transition:all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s;}


#indexsol{width:100%; margin-bottom:30px;}
#indexsol1{width:90%; height:200px; padding:5%; float:left; background:#ff0000; margin-bottom:30px;}
#indexsol2{width:100%; height:200px; float:left; background:#ef7as80; overflow:hidden; position:relative; background-image:url(../images/img3.jpg); background-color:0,0,0,0.5;}
#indexsol2 p{ position:absolute; top:10px; left:5%; right:5%; width:90%; font-size:16px; color:#FFFFFF;}

#indexsag{width:100%; height:auto; margin-left:0%; }
#indexsag1{width:100%; height:200px; float:left; background-image:url(../images/img5.png); background-repeat:no-repeat; background-position:bottom left; background-color:#cf004d; margin-bottom:30px;}
#indexsag2{width:100%; height:430px; float:left; margin-bottom:30px;}
#indexsag2 div:first-child{width:100%; height:200px; float:left; background:#fab975; margin-bottom:30px;}
#indexsag2 div:last-child{width:100%; height:200px; float:left; background:#83c482;}
#indexsag3{width:100%; height:200px; float:left; margin-left:0%; background:#ef7a80;}


ul#urunler li{width:100%;}
ul#urunler li.urunkutu1{margin-right:0%;}

ul#basindabiz li{width:100%;}
ul#basindabiz li.basindabizkutu1{margin-right:0%;}




#detay{width:96%; height:auto; padding:20px 2%; float:left;}
#detaysol{width:100%; height:auto; float:left; margin-bottom:30px;}
#detaysag{width:100%; height:auto; margin-left:0%; margin-bottom:10px; float:left;}
ul#form li input{width:100%; height:48px; float:left; border:1px solid #d1d1d1; background:#FFFFFF; padding:2%; margin-bottom:10px;}
ul#form li input.ortainput{margin-left:0%;}
ul#form li input.saginput{margin-left:0%;}


#footerbottom{width:98%; height:40px; padding:10px 1%;}
#footerbottom ul li{width:auto; height:40px; float:left; margin-right:3px;}
#footerbottom ul li a{-webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; background:#fff; display:block; padding:0px 7px; color:#4185c6;}

}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}