/*
Theme Name: İlkbakis Sesli√¹
Theme URI: İlkbakis.COM & İlkbakis.CoM
Description: İlkbakis Sesli√¹ Teması.
Author:  İlkbakis Sesli√¹ HTML Tema * Domain Adına Lisanslanarak Kullanılmaktadır.
Version: 1.1
*/
/* İlkbakis */
@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@400;500;600;700;800;900;1000&display=swap');
::-webkit-scrollbar {width: 5px;background-color: #eaeaea;border-left: 0px solid #0f3b77;}
::-webkit-scrollbar-thumb {background-color: #ff4e4f;}
::-webkit-scrollbar-thumb:hover {background-color: #ff4e4f;}
h1,h2,h3,h4,h5 {font-family: 'Mulish', sans-serif !important;}
a {font-family: 'Mulish', sans-serif !important;}
b {font-family: 'Mulish', sans-serif !important; font-style: normal;}
span {font-family: 'Mulish', sans-serif !important; font-style: normal;}
em {font-family: 'Mulish', sans-serif !important; font-style: normal;}
li {font-family: 'Mulish', sans-serif !important;}
ul {font-family: 'Mulish', sans-serif !important; list-style-type: none !important; }
.btn {font-family: 'Mulish', sans-serif !important; font-style: normal;}
body, html {font-family: 'Mulish', sans-serif !important;}
a {transition: all 0.5s; text-decoration: none;}
a:hover {transition: all 0.5s;}
header {padding: 0px;background: rgb(16,15,31);
  background: linear-gradient(90deg, rgba(16,15,31,1) 0%, rgba(43,41,73,1) 50%, rgba(16,15,31,1) 100%);}
header {transition: all 0.2s;}
.header-geneli {background: rgb(16,15,31);
  background: linear-gradient(90deg, rgba(16,15,31,1) 0%, rgba(43,41,73,1) 50%, rgba(16,15,31,1) 100%); padding: 0px;}
.aspmenu {background-color: #192b35; position: fixed !important;top: 0;left: 0;width: 100%;animation: navbar-show .25s ease-in-out; box-shadow: 0 .275rem 1.25rem rgba(11, 15, 25, .05), 0 .25rem .5625rem rgba(11, 15, 25, .03);  z-index: 1031}
.menu .asp-buton {display: none;}
.aspmenu .menu .asp-buton {display:flex; background-color: #ff4e4f !important; padding: 10px; color: #fff;}
.aspmenu .menu .asp-buton:hover {background: #ff4e4f !important; color: rgb(255, 255, 255); transition: all 0.5s ease 0s;}
.nav-link {color: #fff; font-weight: 800;border-radius: 8px;}
.nav-link:hover {color: #fff; background-color: #ff4e4f; border-radius: 8px;}
.nav-link.active {color: #fff; background-color: #bb3a3b; border-radius: 8px;}
.nav-item {padding: 10px;}
.navbar-brand img {width: 292px; height:96px;}
.navbar-expand-lg .navbar-nav .dropdown-menu { border: none;box-shadow: 0 .625rem 1rem rgba(35,35,35,.1)!important;  background-color: #fff}
.dropdown-item {padding: 10px; color: #565973; font-weight: 700;}
.dropdown-menu {border-radius: 18px; padding: 10px;}
.dropdown-menu li a {border-radius: 8px;}
.dropdown-item:hover {background: #ff4e4f; color: #fff;}
ul .dropdown:hover > .dropdown-menu {display:block;  animation: dropdown-show .2s}
ul .dropdown > .dropdown-menu {display:none;}
.header-yazi {margin-top: 120px; position: relative; z-index: 999;}
.header-yazi p {color: #fff; font-weight: 900; font-size: 34px;}
.header-yazi span {color: #fff; font-size: 22px; margin-top: 25px; font-weight: 700;}
.yildizlar-svg {width: 400px; height: 400px; top: 170px; position: absolute; left: 70px; z-index: 1;}
.svg-dalga {padding: 0px;}
.svg-chat-resim {width: 90%; height: 500px; float: right; margin-top: 50px; position:relative; z-index: 10;}
.chat-resim-svg {position: relative;}
.chat-resim-svg i {font-size: 50px;}
.chat-resim-svg a {z-index: 999; position: absolute; top: 190px; left: 355px; padding: 8px; width: 70px; height: 70px; border-radius: 50%; background: #ff4e4f; color: #171629; line-height: 20px; font-weight: 800; letter-spacing: -1px;}
.sohbet-inputlari {margin-top: 50px;}
.form-control {height: 70px; border-radius: 12px 0px 0px 0px; font-weight: 700;}
.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 0px;
  border-radius: 12px 0px 0px 0px;
}
.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
  margin-left: 0px;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 0px;
  border-radius: 0px 12px 0px 0px;
}
.btn-baglan {background: #ff4e4f; color: #fff; border-radius: 0px 0px 12px 12px !important; font-size: 22px; padding: 15px; font-weight: 700; border: none !important;}
.form-control:focus {
  color: #212529;
  background-color: #fff;
  border-color: #ff4e4f;
  outline: 0;
  box-shadow: 0 0 0 0.15rem #ff4e4e5e;
}
.playstore {background-color: #67647e; padding: 15px 30px; color: #fff; font-weight: 700; border-radius:12px 0px 0px 12px ;}
.playstore:hover {background: #ff4e4f; color: #fff;}
.appstore {background-color: #67647e; padding: 15px 30px; color: #fff; font-weight: 700; border-radius:0px 12px 12px 0px ;}
.appstore:hover {background: #ff4e4f; color: #fff;}
.tmirc {padding: 15px; font-size: 16px; color: #fff; font-weight: 500; position: relative; z-index: 100;}
.tmirc b {position: relative; z-index: 1000; font-style: normal !important;text-shadow: 1px 1px #4b4a4a;}
span.tmirc-bg {z-index: 1; top: -28px; position:absolute; left: 15px;}
.tmirc:hover {color: #ff4e4f;}
.fill-warning {fill: rgb(25 23 44) !important;}
.bloglar-baslik-alani h2 {font-weight: 800; color: #ff4e4f; font-size: 28px !important; letter-spacing: -1px;}
.bloglar-baslik-alani i {color: #fff; background: #ff4e4f; padding: 5px; border-radius: 8px 4px 8px 4px;}
.blog-ic {padding: 10px; border-radius: 8px; margin-top: 25px;}
.blog-ic img{ border-radius: 8px;}
.blog-baslik {margin-top: 15px;}
.blog-baslik h2 a{font-size: 22px; font-weight: 800; color: #2a2847;letter-spacing: -1px;}
.blog-baslik h2 {line-height: 20px; margin-bottom: 15px;}
.blog-baslik p {color:#9691a4; font-weight:600; line-height: 20px; font-size: 15px;}
.blog-ic:hover .blog-baslik h2 a {color: #ff4e4f;}
.shadow {position: relative;}
.kisayol {position: relative; padding: 15px; border-radius: 22px;}
.kisayol:hover svg path {fill:#ff4e4f}
.kisayol svg path {transition: 0.5s;fill: #656691;}
.kisayol i {font-size: 36px; position: absolute; left: 45px; top: 45px; color: #fff;}
.kisayol h2 {font-weight: 900; font-size: 24px; letter-spacing: -1px; color:#464556; margin-top: 20px;}
.kisayol p {font-weight: 600; line-height: 20px; color: #4b4a4a;}
.makale-alani {margin-top: 50px;}
.sohbet-makale-ic h1  {font-weight: 800; font-size: 28px; letter-spacing: -1px; color: #464556; position: relative; margin-bottom: 25px;}
.sohbet-makale-ic h1:before {
  position: absolute;
  content: "";
  left: 0;
  bottom: -5px;
  height: 2px;
  width: 100px;
  background: #ff4e4f;
}
.sohbet-makale-ic h2  {font-weight: 800; font-size: 26px; letter-spacing: -1px; color: #464556; position: relative; margin-bottom: 25px;}
.sohbet-makale-ic h2:before {
  position: absolute;
  content: "";
  left: 0;
  bottom: -5px;
  height: 2px;
  width: 80px;
  background: #ff4e4f;
}
.sohbet-makale-ic p {font-weight: 600; line-height: 20px; color: #5b595f; text-align: justify; line-height: 25px;}
.sohbet-makale-ic a {color:#131224; font-weight: 700;}
.makale-resim img {width: 100%; height: auto; margin-top: 65px;}
.pozisyon-ver {position: absolute;z-index: 1; width: 98%;}
.fill-cyan {fill: #7d50fe!important;}
.fill-blue{
  fill: rgb(0, 183, 255) !important;
}
.fill-yellow {
  fill: #fc0 !important;
}
.fill-pink {
  fill: #ff4e4f !important;
}
.fill-purple {
  fill: #ff4e4f !important;
}
.fill-purple {
  fill: #ff4e4f !important;
}
.fill-cyan {
  fill: #ff4e4f !important;
}
.fill-purple {
  fill: #02c4b5 !important;
}
.sss {margin-top: 80px; background: #fff; border-radius: 150px 12px; position: relative;}
.sss-baslik h2 { font-weight: 800;font-size: 28px;letter-spacing: -1px;color:#ff4e4f;position: relative;margin-bottom: 25px;}
  .sss-baslik h2:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: -5px;
    height: 2px;
    width: 80px;
    background: #464556;
  }
.akordion {margin-bottom: 50px;position: relative; z-index: 999; border-right: 1px solid #ececec; padding: 5px 20px 5px 0px;}
.accordion-item {background: #0e0e2200 !important;}
.accordion-body {padding: 1rem 1.25rem;background: #22254600 !important; color: #464556; font-weight: 600;}
.accordion-button {background: #0e0e2200 !important; color: #464556; font-weight: 700;}
.accordion-item:first-of-type {border-top-left-radius: 0;border-top-right-radius: 0;}
.accordion-button:focus {box-shadow:none; color: #ff4e4f !important;}
.accordion-button:not(.collapsed) {color:#ff4e4f; font-weight: 700; background-color: none !important;box-shadow: inset 0 -1px 0 rgb(0 0 0 / 13%);}
.accordion-item {border: none;}
.kurallar-baslik h2 { font-weight: 800;font-size: 28px;letter-spacing: -1px;color:#464556;position: relative;margin-bottom: 25px;}
  .kurallar h2:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: -5px;
    height: 2px;
    width: 80px;
    background: #ff4e4f;
  }
  .kurallar {position: relative;z-index: 999;}
  ol.kurallarimiz li {padding: 15px; font-weight: 600; color: #464556;margin-bottom: 10px;}
  ol.kurallarimiz {
    list-style-type: none;
    counter-reset: ordered;
  }
  ol.kurallarimiz li::before {
    border: 1px solid #e74c3c;
    border-radius: 50%;
    color: #e74c3c;
    content: counter(ordered);
    counter-increment: ordered;
    display: inline-block;
    font-weight: 100;
    margin-left: -50px;
    margin-top: -7px;
    padding: 5px 12px;
    position: absolute;
  }
.sosyaller {background-color: #fff; margin-top: 50px;position: relative;z-index: 999; text-align: center; padding: 20px; border-radius: 0px 0px 22px 22px;}
.sosyaller a {padding: 10px; font-size: 20px; color: #464556; font-weight: 600; letter-spacing: -1px; border-radius: 12px;}
.sosyaller span { font-weight: 700; color: #131224;}
.sosyaller a:hover {background-color: #e74c3c; color: #fff;}
.footer {background: rgb(16,15,31); background: linear-gradient(90deg, rgba(16,15,31,1) 0%, rgba(43,41,73,1) 50%, rgba(16,15,31,1) 100%); z-index: 999; position: relative;}
.footer-ic {margin-top: 40px;}
.logo-vs {color: #fff; font-weight: 700; font-size: 14px; letter-spacing: -1px; border-right: 1px solid #363454;}
.footer-linkler {margin-top: 30px;}
.footer-linkler a {color: #fff; font-weight: 700; padding: 10px; border-radius: 12px; line-height: 35px;}
.footer-linkler a:hover {background: #ff4e4f; color: #fff;}
.yapimci {text-align: right;}
/*detay alanı*/
.detay-sohbet-alani {position: relative; z-index: 999;}
.detay-sohbet-alani p {color: #fff; font-size: 28px; font-weight: 800; color: #ff4e4f;}
.sohbet-alani-aciklama p {font-size: 16px; color: #fff; font-weight: 600;}
.sohbet-alani-aciklama p b {font-weight: 700; color:#ff4e4f;}
.sohbet-alani-aciklama p a {color: #4eff8d; margin-left: 15px; font-weight: 700; font-size: 22px;}
.sohbeticon {color: #fff; font-size: 34px;}
.kaydir-asagi {top: 150px;}
.detay-baslik-alani {padding-bottom:20px ;}
.header-baslik {margin-top: 50px;}
.detay-yazi-baslik h1 {color: #464556; font-size: 34px; font-weight: 800;}
.detay-yazi-baslik p {color: #fff; font-weight: 600;}
.detay-yazi-baslik p span {color: #ff4e4f;}
.detay-yildizlar-svg {width: 200px;height: 200px;top: 100px;position: absolute;left: 400px;z-index: 1;}
.detay-sohbet-inputlari {position: relative; z-index: 999;}
.detay-yazi-yeri {padding-left: 50px;}
.detay-yazi-yeri h1 {font-weight: 800;font-size: 30px;letter-spacing: -1px;color: #464556;position: relative;margin-bottom: 25px;}
.detay-yazi-yeri h2 {font-weight: 800;font-size: 26px;letter-spacing: -1px;color: #464556;position: relative;margin-bottom: 25px;}
.detay-yazi-yeri h3 {font-weight: 800;font-size: 22px;letter-spacing: -1px;color: #464556;position: relative;margin-bottom: 25px;}
.detay-yazi-yeri a {font-weight: 700; color: #ff4e4f;}
.detay-yazi-yeri p {font-weight: 600; color: #4b4a4a; text-align: justify;}
.detay-form {border-radius: 12px 0px 0px 12px !important;}
.detay-form2 {border-radius: 0px !important;}
.btn-baglan1 {background: #ff4e4f; color: #fff; border-radius: 0px 12px 12px 0px !important; font-size: 22px; padding: 15px; font-weight: 700; border: none !important;}
.bilgilendirmeler {background-color: #985c7e; color: #fff; padding: 30px 15px; border-radius: 22px;}
.bilgilendirmeler h2 {font-size: 24px; font-weight: 700;}
.bilgilendirmeler ul {padding: 15px;}
.bilgilendirmeler ul li { font-weight: 600; font-size: 14px; list-style-type: disc; margin-bottom: 10px;}

.komutlar {background-color: #656691; color: #fff; padding: 30px 15px; border-radius: 22px; margin-top: 30px;}
.komutlar h2 {font-size: 24px; font-weight: 700;}
.komutlar p {font-weight: 600; font-size: 14px;}
.komutlar p a {color:#171629; font-weight: 800;}
.yardim {background-color: #5c5971; color: #fff; padding: 30px 15px; border-radius: 22px; margin-top: 30px;}
.yardim h2 {font-size: 24px; font-weight: 700;}
.yardim p {font-weight: 600; font-size: 14px;}
.yardim p a {color:#171629; font-weight: 800;}
.mail {padding: 15px; border-radius: 12px; margin-bottom: 15px;}
.mail a {color: #464556; font-size: 18px;}
.mail a i {font-size: 30px; color: #ff4e4f; vertical-align: middle; margin-right: 15px;}
.skype {padding: 15px; border-radius: 12px; margin-bottom: 15px;}
.skype a {color: #464556; font-size: 18px;}
.skype a i {font-size: 30px; color: #02aaf4; vertical-align: middle; margin-right: 15px;}
.whatsapp {padding: 15px; border-radius: 12px; margin-bottom: 15px;}
.whatsapp a {color: #464556; font-size: 18px;}
.whatsapp a i {font-size: 30px; color: #4caf50; vertical-align: middle; margin-right: 15px;}
@media (max-width: 768px) {
  .navbar-brand img {width: 90%; height:80px;}
  .fa-bars {color: #fff; font-size: 30px;}
  .header-yazi {margin-top: 20px; padding: 25px;}
  .header-yazi p {line-height: 35px; font-size:32px;}
  .header-yazi span {display: none;}
  .sohbet-inputlari {margin-top: 20px;}
  .svg-dalga {width: 100%; height: auto;}
  .svg-dalga path {width: 100% !important;}
  .svg-chat-resim {display: none;}
  .chat-resim-svg a {display: none;}
  .tmirc {display: none;}
  .yildizlar-svg {display: none;}
  .form-control {width: 100% !important; border-radius: 12px;}
  .btn-baglan {width: 100% !important; display: block; border-radius: 0px 0px 12px 12px !important;}
  .input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) { border-radius: 12px 12px 0px 0px; }
  .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {border-radius: 0px 0px 0px 0px;}
  .makale-alani {margin-top: 5px;}
  .kisayolumuz {display: none;}
  .sohbet-makale-ic h1 {font-size: 24px;}
  .sohbet-makale-ic h2 {font-size: 22px;}
  .sohbet-makale-ic {padding: 15px;}
  .sohbet-makale-ic p {text-align: left;}
  .sosyaller {padding: 15px;}
  .sosyaller a {line-height: 40px;}
  .pozisyon-ver {display: none;}
  .detay-yildizlar-svg {display: none;}
  .btn-baglan1 {width: 100% !important; display: block; border-radius: 0px 0px 12px 12px !important;}
  .detay-yazi-yeri {padding: 15px;}
  .detay-form {border-radius:12px 12px 0px 0px !important}
  .makale-resim {display:none}
}

@media screen and (min-width:1024px) and (max-width:1366px) { 
  .mt-xl-n9 {margin-top: -14rem !important;}
  .sohbet-yazi {font-weight: 900;font-size: 2.5em;}
  .sohbet-alani-aciklama p {font-size: 15px;color: #fff;font-weight: 600;}
  .header-yazi p {color: #fff;font-weight: 900; font-size: 33px;}
  .kisayol h2 {font-size: 22px;}
  .chat-resim-svg a { top: 199px; left: 300px;}
}


@keyframes navbar-show {
  from {
      transform: translateY(-100%)
  }
  to {
      transform: translateY(0)
  }
}

@keyframes dropdown-show {
  from {
      transform: scale(0.9);
      opacity: 0
  }
  to {
      transform: scale(1);
      opacity: 1
  }
}


@keyframes star {
  to {
    zoom:10%;
    opacity:0;
  }
  from{
    zoom:100%;
      opacity:1;
  }
}
.star {
animation-name: star;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 2s;
animation-direction: alternate;

}
@keyframes star1 {
  to {
 
    opacity:0;
  }
  from{
 
      opacity:1;
  }
}
.star1 {
animation-name: star1;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 3s;
animation-direction: alternate;
}
@keyframes star2 {
  0% {
  opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}

}
.star2 {
animation-name: star2;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 5s;
animation-direction: alternate;
}