body {font-family: 'Exo 2', sans-serif;}
#sp-header {background:#27292b; }
.anasayfa #sp-header {background: none !important; z-index: 1000; position: absolute; top:20px; box-shadow: none !important;}
.anasayfa #sp-header .container {background: #27292b !important; border-radius: 15px; box-shadow:0px 0px 5px #fff;  }
.iletisimsayfa #sp-main-body {padding:0px 0px 0px 0px !important;}
#sp-menu a {font-weight:300 !important; text-transform:none !important;}
#sp-footer {background-color:#27292b !important;}
.offcanvas-toggler a{color:#fff !important;}
.sp-dropdown-inner{border-bottom:2px solid #e61515; background-color:#27292b !important;}
.sp-module ul > li > a {line-height:30px !important; font-size:12px !important; }
.sp-module ul > li {border-bottom-color:#999 !important;}
.beyaz {background-color:#fff !important;transition:all 0.4s ease 0s !important;}
.beyaz i, h3 {color:#e61515 !important; font-weight:500;}
.beyaz:hover {box-shadow:0 10px 25px rgba(0,0,0,0.9) !important; background-color:#27292b !important; color:#fff !important; outline:1px solid #fff !important;  transition:all 0.4s ease 0s !important; }
.gri img {filter:grayscale(100%);}

.makale {max-width:880px; min-height:255px;}
.makaleicresim { width:30%; float:left;}
.makaleicresim img{ width:100%;}
.makaleic {width:70%; float:left; min-height:255px; }
.makaleic p{padding-left:20px;}
.tablo1 {font-weight: bold; width: 25%;}
.tablo2 {font-weight: bold; width: 5%;}
.tablo3 {width: 70%;}

.urunlermenu li  {line-height: 30px !important;}
.urunlermenu h2 {line-height: 36px !important; background-color: #333; color:#fff; padding-left: 10px; font-size:24px; letter-spacing: 1px; font-weight: normal;}
.urunlermenu h2::before {content:"\f02c"; font-family:"FontAwesome"; font-weight: 400; font-size: 18px; padding-right: 10px;}
.ikon1 {font-size:14px !important; color:#333;}
.ikon2 {font-size:14px !important; color:#333;}
.ikon3 {font-size:14px !important; color:#333;}
.ikon4 {font-size:14px !important; color:#333;}
.ikon5 {font-size:14px !important; color:#333;}

.ikon10  {font-size:14px !important; color:#333; padding-left:20px;}
/*
.ikon1::before {content:"\f196"; font-family:"FontAwesome"; font-weight: 400; font-size: 12px; padding-right: 10px; }
.ikon2::before {content:"\f196"; font-family:"FontAwesome"; font-weight: 400; font-size: 12px; padding-right: 10px;}
.ikon3::before {content:"\f196"; font-family:"FontAwesome"; font-weight: 400; font-size: 12px; padding-right: 10px;}
.ikon4::before {content:"\f196"; font-family:"FontAwesome"; font-weight: 400; font-size: 12px; padding-right: 10px;}
.ikon5::before {content:"\f196"; font-family:"FontAwesome"; font-weight: 400; font-size: 12px; padding-right: 10px;}

.ikon10 {padding-left: 20px;}
.ikon10::before {content:"\f096"; font-family:"FontAwesome"; font-weight: 400; font-size: 12px; padding-right: 10px;}
*/
.urunler .blog .col-sm-3 {border:1px dotted #eee; box-shadow: 0px 0px 5px #ddd; transition: all 1s; }
.urunler .blog .col-sm-3 h2 {font-size:16px; text-align: center;}
.urunler .blog .col-sm-3 .btn {font-size:16px; text-align: center; width: 100%;}
.urunler .blog .col-sm-3:hover{border:1px dotted #e61c19;  box-shadow: 0px 0px 5px #e61c19; background-color: #fff;}

.entry-header h2 {font-size:20px; color:#e61c19;}
.fancybox-title {display:none !important;}
.rl_tabs-tab {min-width: 15%; text-align: center;}

ul.sigFreeClassic li.sigFreeThumb a.sigFreeLink {transition: all 1s !important;}
/*ul.sigFreeClassic li.sigFreeThumb a.sigFreeLink:hover::after {background: none !important;}*/
.cat-children {display: none !important;}
.iform textarea {width: 100%; height: 200px;border-radius: 0 !important;}
.iform input {width: 100%; border-radius: 0 !important;}
.iform button {width: 25%; line-height: 40px; background-color:#b20; color:#fff; border-color: #b20 !important; font-size: 16px;transition: all 0.3s ease-in-out; border-radius: 0 !important;}
.iform button:hover {width: 25%; line-height: 40px; background-color:#fff; color:#b20; border-color: #b20 !important; font-size: 16px;}
.bmenu li {padding-right:10px !important; float:left !important; border: none !important;}
.anaslayt a {color:#fff;transition: all 0.3s !important;}
.anaslayt a:hover {color:#fff; font-weight:500; }
.alan1 {width:100%;border-radius:7px; font-size:12px;}

.baslik {background-color: #27292b;
 padding-top:20px;text-transform: uppercase;
border-top-left-radius: 7px;
border-top-right-radius: 7px;
text-align: center; color:#fff; font-size:40px; line-height:60px;min-height:100px;}
.fiyat {background: rgba(255,255,255,0.05);
margin-top: 20px;
font-size: 32px;
line-height: 50px;
color: #fff;}
.fiyat a {color:#fff; font-size:14px;display:none !important;}
.ortabaslik {padding: 15px;color: rgba(0,0,0,0.6);
background: #fff; text-align:center; display:none !important;}
.ozellikler {min-height:250px;}
.ozellikler ul {padding:20px !important; margin:0 !important;}
.ozellikler li {color: #b4b4b4;
border-bottom: 1px dotted rgba(0,0,0,0.1);
margin-bottom: 5px; list-style:none !important; padding-right:10px; line-height:16px;
}
.ozellikler li {width:50%; float:left;}
.ozellikler .var {color:#e61c19 ; float:left;}
.ozellikler li p {font-family:'Exo 2', sans-serif;float:right;}
.clear {clear:left;}
.altalan {background-color: #27292b;
text-align: center;
border-bottom-left-radius: 7px;
border-bottom-right-radius: 7px;
padding: 10px;
color: rgba(255,255,255,0.5);
font-weight: 100; 
min-height: 20px;}
.tikla {width:50%; margin-left:25%; line-height:40px; border:1px solid  #fff; border-radius:10px;text-align:center; margin-top:10px;transition: all 0.5s ease;}
.tikla a {color:#fff;}
.tikla:hover  {background-color:#e61515; color:#fff;}
.tikla:hover a { color:#fff;}
.cizgili {border:1px dotted #999;}
.sp-page-title h3 {color:#fff !important;}
.sp-contact-info a {color:#fff !important;}
.sp-contact-info a:hover {color:#b20 !important;}
.sp-dropdown-items {display:none !important;}
.sp-module {margin-top:0px !important;}
.offcanvas-inner li a {font-size:11px !important; line-height:16px !important; text-transform:inherit !important;}
#offcanvas-toggler i{color:#fff !important;}

#collapse-menu-128 li a{font-size:11px !important; line-height:16px !important; text-transform:inherit !important;}

.sp-module .menu li a::before {content:"\f111" !important;}
.sp-module .menu .deeper li a::before {content:"\f192" !important;color:#e61515 !important;}
.sp-module .menu .deeper .deeper li a::before {content:"\f22d" !important; 
color:#fff !important;}
.urunlermenu .menu li a::before{content:none !important; 
color:#e61515 !important;}
.altmenu li {width:33% !important;}


@media only screen and (max-width: 600px) {
.blog .col-sm-3 {width:50% !important; float:left !important;}
.blog h2 {font-size:12px !important; min-height:40px !important;}
.sp-dropdown-items {display:block !important;}
.urunlermenu {display:none !important;}

}
@import url(https://fonts.googleapis.com/css?family=Raleway:400,200,300,800);
@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
figure.referans {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  margin: 10px 1%;
  min-width: 33%;
  max-width: 33%;
  width: 100%;
  background: #ffffff;
  color: #000000;
}
figure.referans * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
figure.referans .image {
  width: 50%;
  overflow: hidden;
  z-index: 1;
  -webkit-transform: skewX(-15deg);
  transform: skewX(-15deg);
}
figure.referans .image img {
  position: relative;
  display: block;
  left: -15%;
  z-index: 1;
  -webkit-transform: skew(15deg);
 transform: skew(15deg);
}
figure.referans:before {
  position: absolute;
  content: '';
  height: 100%;
  width: 45%;
  background: rgba(0, 0, 0, 0.2);
  -webkit-transform: skewX(-17deg);
  transform: skewX(-17deg);
  -webkit-box-shadow: 15px 0px 25px rgba(0, 0, 0, 0.7);
  box-shadow: 15px 0px 25px rgba(0, 0, 0, 0.7);
}
figure.referans figcaption {
  padding: 20px 30px 20px 20px;
  position: absolute;
  right: 0;
  bottom: 30px;
  width: 50%;
}
figure.referans figcaption h2,
figure.referans figcaption p {
  margin: 0;
  text-align: right;
  padding: 10px 0;
  width: 100%;
}
figure.referans figcaption h2 {
  font-size: 1.3em;
  font-weight: 300;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
figure.referans figcaption h2 span {
  font-weight: 800;
}
figure.referans figcaption p {
  font-size: 0.9em;
  opacity: 0.8;
}
figure.referans figcaption .icons {
  width: 100%;
  text-align: right;
}
figure.referans figcaption .icons i {
  font-size: 26px;
  padding: 5px;
  top: 50%;
  color: #000000;
  opacity: 0;
}
figure.referans figcaption a {
  opacity: 0.3;
}
figure.referans figcaption a:hover {
  opacity: 0.8;
}
figure.referans .position {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: right;
  padding: 15px 30px;
  font-size: 0.9em;
  opacity: 1;
  font-style: italic;
  color: #ffffff;
  background: #000000;
}
figure.referans.blue .position {
  background: #20638f;
}
figure.referans.red .position {
  background: #962d22;
}
figure.referans.yellow .position {
  background: #bf6516;
}
figure.referans.green .position {
  background: #2DB200;
}
figure.referans:hover figcaption,
figure.referans.hover figcaption {
  bottom: 40px;
}
figure.referans:hover .icons i,
figure.referans.hover .icons i {
  opacity: 1;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.referans:hover:before,
figure.referans.hover:before {
  -webkit-animation: shadow 0.6s ease-in-out;
  animation: shadow 0.6s ease-in-out;
}
@-webkit-keyframes shadow {
  0% {
    left: 0px;
  }
  50% {
    left: -5px;
  }
  100% {
    left: 0px;
  }
}
@keyframes shadow {
  0% {
    left: 0px;
  }
  50% {
    left: -5px;
  }
  100% {
    left: 0px;
  }
}