
*, *::before, *::after {
    box-sizing: border-box;
  }
   body {  font-family: "Radley", serif;
    font-weight: 400;
    font-style: normal;} 
    body p {padding:0;margin:0;}
    a, a:active, a:visited, a span, a strong, a h1, a h2, a h3, a h4, a h5, a h6 {
      color: #fff6c4;
      cursor: pointer;      }
  #body_dark {margin:0;padding:0;background:#a2bac6 url(../img/body-background.jpg) repeat-x}
  .container-big {overflow: auto;
  background:url(../img/shaiya-bg.jpg) no-repeat top center;
  display: flex;
      flex-direction: column;
      align-items: center;
      min-height:700px; 
  }
  .header-top {    display: flex;
      flex-direction: column; width: 100%; }
  .bg1 {background: #a2bac6 url(../img/shaiya-bg1.jpg) no-repeat top center;}
  .header-top nav ul { padding: 0%; margin: 0%;     display: flex;
      flex-direction: row;  }
  .header-top nav ul li {list-style: none; }
  .header-top nav ul li a {text-decoration: none;display:flex;}
  .header-top .kayit {width: 100%;padding:4px 0px;
      display: flex;
      flex-direction: row;
      justify-content: flex-end;}
  .giris-kayit {display: flex;}
  .header-top .kayit a.btnG  {color: #fff; padding: 4px 12px; border-radius: 4px;margin-right: 5px;font-size:12px;    -moz-box-shadow: inset 0 0px 0px 1px rgba(243, 244, 181, 0.26);
      -webkit-box-shadow: inset 0 0px 0px 1px rgba(243, 244, 181, 0.26);
      box-shadow: inset 0 0px 0px 1px rgba(243, 244, 181, 0.26); border: 1px solid #00000052;}
  .list1 a {   background: #5bc62b;  }
  .list2 a {  background: #6e6e6e;  }
  
  .ust-menu {height:66px;display: flex;
      align-items: center;}
  .ust-menu .logo a {width: 169px;
      height: 66px;}
  .ust-menu li {    display: flex;
      align-items: center;margin-right:20px}
  
  .ust-menu a {color:#fff6c4;font-size:16px;}
  
  .manset {width:100%; height:192px;display:flex;overflow:hidden}
  .manset .logo-mn {height: 227px;
      width: 375px;
      display: block; 
       left: 85px;
      position: relative;}
  
  .manset .logo-mn:hover {background: url(../img/page-header-dark-light-hovers.jpg) no-repeat 0 0;}
  .manset .indir-btn { 
      height: 227px;
      width: 180px;
      display: block;
      right: -310px;
      position: relative;
    } 
  
  .manset .indir-btn:hover{  background: url(../img/page-header-dark-light-hovers.jpg) no-repeat -410px 0;}
  .header a {text-decoration: none;color:#fff6c4;font-size:18px;padding:0 14px;}
  .header ul li {line-height:50px;}
  .header {min-height:50px;    display: flex;
      align-items: center;
      flex-direction: row;
       }
      .header ul li a {    align-items: center;}
  
  
  
  .container-min { display: flex;
      flex-direction: column;
      align-items: center;
      min-width:900px;min-height:700px;}
      .downi { margin-left:5px; width:9px;height: 12px;  background:   url(../img/interface-elements_1.png) 0 -2000px no-repeat;}
  
      .altmenu {
          opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    transform: translateY(10px);
          min-width:180px; background: #111 url(../img/page-header-dark-light-hovers.jpg) repeat-y -800px 0;padding:3px!important;flex-direction:column!important;display:flex!important;position:absolute; }
      .altmenu li {line-height:16px!important;min-height:26px!important;display:flex;}
      .altmenubg {background: #111 url(../img/page-header-dark-light-hovers.jpg) repeat-y -1100px 0;
      }
      .altmenu li a {font-size:14px;line-height:16px;width:100%;}
      .altmenu li:hover {background:#000000a6;}
      .altmenu li:hover a {color:#FF3}
  
      .header ul li:hover .altmenu {opacity: 1;
    visibility: visible;}
    .header ul li:hover .s {color:#FF3}
  
  
  
    .footerB {width:900px;height:80px;background: url(../img/page-footer.jpg);display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:14px;padding-right: 60px;  }
    .footerB .sosyalmedya    a {font-size:32px;color:#ffffffcf;margin:0 5px}
    .footerB .logofoot {width: 169px;
      height: 66px;
      display: block;  }
  
  
  #containerM { display: flex;
      flex-direction: column;
      align-items: center;
      width:896px;min-height:700px;
      background: #1a1a1a url(../img/shaiya-bg.jpg) no-repeat top center;
      background-position-x: -352px;
      background-position-y: -343px;}
  
  .homeP {display: flex;
      justify-content: space-between;
      width: 100%;padding:30px 20px}
  
  .homeP .sag {width:62%;}
  .homeP .sol {width:40%;max-width:300px;}
  .ipencere {display:flex}
  .hizlierisim {width:32%;padding:9px 0}
  .hizliMedya {width:68%;} 
  .eris a, .eris p, .eris h5 {padding:0;margin:0;text-decoration: none;color:#999;font-size:14px;}
  .eris h5 {color: #d3d3d3;margin-bottom:2px;font-weight:100;}
  .eris p {font-size:11px;font-weight:100;line-height:10px}
  .eris {background:url(../img/block-intro.jpg) no-repeat 0px -368px; padding:20px 10px;}
  .eris:hover {background-position: -180px bottom;}
  .hizliMedya {background:url(../img/block-intro.jpg) no-repeat; padding:5px 10px;height:335px;
      display: flex;
      flex-direction: column;
      align-items: center;}
  header.medya {    display: flex;
      justify-content: space-between;
      height: 34px;
      align-items: center;width: 100%;}
  header.medya p {font-size:18px;color:#fff}
  header.medya a {color:#fff6c4;font-size:12px;text-decoration: none;letter-spacing: -1px;}
  .videoOynat {    display: flex;
      justify-content: center;
      margin: 8px 0;
      padding: 5px;
      background:url(../img/block-intro.jpg) no-repeat -360px 0;width: 320px;
      height: 212px;
  }
  .digerV {display: flex;
      justify-content: flex-start;
      width: 100%;
      padding: 0 8px;}
      .digerV a {width: 70px;
      height: 50px;background: url(../img/interface-elements_1.png) no-repeat left -900px;    display: flex;
      justify-content: center;
      align-items: center;position: relative;}
      .digerV a .etiket { 
          
          width: 70px;
      height: 55px;
      position: absolute;
      top: 0px;
      left: 0px;
      display: block; background: url(../img/interface-elements_1.png) no-repeat left -700px;}
      .shaiyakarakterleri { margin-bottom: 20px;}
  
      #shaiya-simple-widget {background: url(../img/block-front-right.jpg) -600px 0!important;}
      .Sbaslik {background: url(../img/block-front-right.jpg) !important;height:40px;width: 100%;}
      .baslik1 {  
      font-size: 14px;
      line-height: 40px;
      padding-left:16px; 
      letter-spacing: 0px;color:#c1c1c1}
  
      .Tbtn {display:flex; margin-top: 15px;padding:0  10px}
      .tBtn1 {      display: flex;
      align-items: center;
      padding:5px 10px;  
      font-size:12px;
      color: #a5a5a5!important; 
      outline: 1px solid black!important;   /* En dıştaki ince siyah çizgi */
      position: relative;
      transition: all 0.3s ease;
      text-transform: uppercase;
      letter-spacing: 1px;}
  
      /* --- MAVİ VERSİYON (Orijinal) --- */
  .blue {
      background: linear-gradient(to bottom, 
          #3b7ea1 0%, 
          #2a5a75 20%, 
          #152e3b 80%, 
          #0a181f 100%)!important;
      box-shadow: inset 0px 5px 10px rgba(135, 206, 235, 0.3)!important; /* Üstteki parlama */
  }
  
  /* Mavi Hover (Görseldeki alt buton gibi koyu) */
  .blue:hover {
      background: linear-gradient(to bottom, 
          #1a3a4a 0%, 
          #0d1d26 50%, 
          #050a0d 100%);
      box-shadow: inset 0px 2px 5px rgba(0, 0, 0, 0.8)!important;
      color: #7a7a7a!important;
  }
  
  /* --- KIRMIZI VERSİYON --- */
  .red {
      background: linear-gradient(to bottom, 
          #a13b3b 0%, 
          #752a2a 20%, 
          #3b1515 80%, 
          #1f0a0a 100%)!important;
      box-shadow: inset 0px 5px 10px rgba(235, 135, 135, 0.3)!important;
  }
  
  /* Kırmızı Hover */
  .red:hover {
      background: linear-gradient(to bottom, 
          #4a1a1a 0%, 
          #260d0d 50%, 
          #0d0505 100%);
      box-shadow: inset 0px 2px 5px rgba(0, 0, 0, 0.8)!important;
      color: #7a7a7a!important;
  }
  .iBayrak {width: 25px;
      height: 25px;
      background: url(../img/faction.png) no-repeat;
      display: inline-block;
      margin-right: 8px;}
      .isikF {background-position-y:-25px ;}
  
  .sideBar {
      margin:20px 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      width: 100%; 
      background:url(../img/block-front-right.jpg) -600px 0!important
  }
  .sidebar {background: url(../img/block-front-right.jpg) !important;
      height: 40px;
      width: 100%;
  
  }
  
  .poll-box {
              width: 100%;  
              padding: 15px; 
          }
         .poll-box h2 { color: #3498db; font-size: 16px;margin:0 }
          .option { margin: 12px 0; color: #b3b3b3; display: flex; align-items: center; cursor: pointer; }
         .poll-box input[type="radio"] { margin-right: 15px; cursor: pointer; accent-color: #3498db; }
          /* 1 puan seçeneği için özel kırmızı halka efekti */
          .poor-option input[type="radio"] { accent-color: #e74c3c; }
          .vote-button {font-size: 11px;
      font-weight: bold;
      color: #000;
      text-align: center;
      padding: 7px 10px;
      border: none;
      font-family: Tahoma, Geneva;
      -moz-box-shadow: 0 2px 8px #000;
      -webkit-box-shadow: 0 2px 8px #000;
      box-shadow: 0 2px 8px #000;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      border-radius: 3px;
      background-color: #0d223b;
      background-image: -moz-linear-gradient(100% 100% 90deg, #0d223b, #469cd6);
      background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#469cd6), to(#0d223b));
      cursor: pointer; }
          .vote-button:hover { background: #357abd; }
  
          .hrbaslik {width:530px;height:45px;background: url(../img/block-front-left.png) no-repeat 0 0 ;background-size:445%;display:flex;
      justify-content: space-between; align-items: center;padding:0 15px}
              .gonderiler {margin:25px 0}
      .hrbaslik h5 {margin:0;color: #dfdfdf;text-shadow: 0 0 11px #576879;
      letter-spacing: -1px;font-size:19px;font-weight:100;}
      .hrbaslik a { font-size:10px;text-decoration: none;letter-spacing: -0,5px;}
      
      .haberi {
          width: 100%;
          display: flex;margin:15px 0
      }
    .lophaberi {    display: flex;
      flex-direction: column;
      padding-bottom:15px; 
  }
  
  .lophaberi:not(:last-child) {
      border-bottom: 1px solid #333; 
  }
  .lophaberi a {text-decoration: none;}
  .lophaber {width: 100%;}
  .minibaslik {font-size: 16px;
      color: #d3d3d3;
      letter-spacing: 0px;margin:0;margin-bottom:8px }
  .minibaslik:hover {color: #fff;}
  .lophaberi p  {font-size: 12px;
      color: #999;
      line-height: 10px;
      font-weight: 100;}
  .basl {     display: flex;
      justify-content: space-between;
      width: 100%;align-items: center;
  }
  .lophaberi span {font-size: 12px;
      color: #b6b6b6;
      font-weight: 100;}
  .pageM { display: flex;
      justify-content: flex-start;
      width: 100%;
      padding: 30px 20px;}
  .pagemenu {width:170px} 
  .pagemenu ul {padding:0;margin:0;}
  .pagemenu ul li {list-style: none;background: url(../img/block-nav-inside.jpg) no-repeat -600px bottom;}
  .pagemenu ul li:hover {background-position: -1000px -61px;}
  .pagemenu ul li a {text-decoration: none;color:#fff6c4;font-size:12px;display:block;padding:10px 15px}
  .pagemenu ul li:hover a {color:#FF3;}
  .pagemenuHead {height:45px;display: flex;
      align-items: center;
      background: url(../img/block-nav-inside.jpg) no-repeat 0 0 ; 
      justify-content: center;color:#fff;font-size:14px; } 
  
  
      .sayfaicerik {width: 686px;
      padding-left: 15px;
  }
  .sayfabaslik {width:100%;}
  .sayfabaslik h1 {color: #d3d3d3;
      letter-spacing:-0.5px;margin:0;margin-bottom:15px;font-size:26px;font-weight:500;}
      
.sayfaicerikT {width:100%}

.sayfaicerik p, .sayfaicerikT p {font-size:14px;color:#bfbfbf}
 

.sy-requirements-section {  
    color: #e0e0e0;
}

/* Başlık Alanı */
.sy-header {
    text-align: center;
    margin-bottom: 50px;
}

.sy-header h2 {
    color: #d8baa5; /* Metalik açık bronz */
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 2px;
    margin-bottom: 10px;
}

.sy-header p {
    color: #888;
    font-size: 14px;
}

/* Kartların Konteynerı */
.sy-cards-container {
    display: flex;
    justify-content: center;
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
}

/* Genel Kart Tasarımı */
.sy-card {
    background-color: #111111;
    border-radius: 6px;
    padding: 30px;
    width: 50%;
    box-sizing: border-box;
}

/* Minimum Kart (Daha sönük kenarlık) */
.sy-card-min {
    border: 1px solid #222222;
}

/* Önerilen Kart (Altın/Bronz kenarlık - Resimdeki gibi) */
.sy-card-rec {
    border: 1px solid #9e7b4f;
    box-shadow: 0 0 20px rgba(158, 123, 79, 0.05); /* Çok hafif bir ışıltı */
}

/* Kart İçi Başlık ve Rozet (Badge) Alanı */
.sy-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    border-bottom: 1px solid #222;
    padding-bottom: 20px;
}

.sy-card-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
}

.sy-card-min h3 {
    color: #cccccc;
}

.sy-card-rec h3 {
    color: #ffffff;
}

/* Rozetler (Düşük Ayarlar / Yüksek Kalite) */
.sy-badge {
    font-size: 11px;
    padding: 4px 12px;
    border-radius: 20px;
    letter-spacing: 0.5px;
}

.sy-badge-dark {
    background-color: #1a1a1a;
    color: #777;
    border: 1px solid #333;
}

.sy-badge-gold {
    background-color: rgba(158, 123, 79, 0.1);
    color: #9e7b4f;
    border: 1px solid #9e7b4f;
}

/* Liste Ayarları */
.sy-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.sy-list li {
    display: flex;
    padding: 15px 0;
    border-bottom: 1px solid #1c1c1c;
    font-size: 14px;
}

.sy-list li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

/* Etiketler (İşletim Sistemi vb.) */
.sy-label {
    width: 35%;
    color: #aaaaaa;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px; /* Emoji/İkon boşluğu */
}

/* Değerler (Windows 10, 8GB RAM vb.) */
.sy-value {
    width: 65%;
    color: #e0e0e0;
}

/* Mobil Cihazlar (Telefonlar için Alt Alta Geçme) */
@media screen and (max-width: 768px) {
    .sy-cards-container {
        flex-direction: column;
        align-items: center;
    }
    .sy-card {
        width: 100%;
    }
    .sy-label {
        width: 45%;
    }
    .sy-value {
        width: 55%;
    }
}


/* --- Shaiya İndirme ve Video Bölümü --- */

.sy-download-video-section {  
    color: #fff;
}

.sy-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    gap: 40px;
    align-items: flex-start;
}

/* Sütunlar */
.sy-download-column, .sy-video-column {
    flex: 1;
}

.sy-section-title {
    color: #d8baa5;
    font-size: 22px;
    letter-spacing: 2px;
    margin-bottom: 30px;
    border-left: 3px solid #9e7b4f;
    padding-left: 15px;
    font-weight: 500;
}

/* Buton Grubu ve Tasarımı */
.sy-button-group {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.sy-btn {
    display: flex;
    align-items: center;
    background-color: #121212;
    border: 1px solid #333;
    color: #e0e0e0;
    text-decoration: none;
    padding: 18px 25px;
    transition: all 0.3s ease;
    /* Sivri köşeler */
    border-radius: 0px; 
    font-weight: 600;
    letter-spacing: 1px;
    font-size: 14px;
}

.sy-btn:hover {
    background-color: #1a1a1a;
    border-color: #9e7b4f;
    color: #fff;
    transform: translateX(5px);  
}

.btn-icon {
    margin-right: 20px;
    font-size: 20px;
}

/* Bilgi Yazısı */
.sy-info-text {
    margin-top: 20px;
    font-size: 12px;
    color: #666;
}

/* Video Alanı Tasarımı */
.sy-video-wrapper {
    position: relative;
    padding-bottom: 56.25%;  
    height: 0;
    border: 1px solid #9e7b4f;  
    box-shadow: 0 0 30px rgba(0,0,0,0.5);
}

.sy-video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.ustmenu a {font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;}
/* Mobil Uyumluluk (Responsive) */
@media screen and (max-width: 992px) {
    .sy-container {
        flex-direction: column;
    }
    .sy-download-column, .sy-video-column {
        width: 100%;
    }
    .sy-video-column {
        margin-top: 40px;
    }
}

 
 .kayitUL {opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    transform: translateY(10px); 
    background: #111;
    padding: 3px !important;
    flex-direction: column !important;
    display: flex !important;
    position: absolute;}

    .list3 ul li:hover .kayitUl {
        opacity: 1;
        visibility: visible;}

          
 .kayitUl {opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    transform: translateY(3px);
    background: #dcdcdc;
    padding: 4px !important;
    flex-direction: column !important;
    display: flex !important;
    position: absolute;
    border-radius: 4px;
    -moz-box-shadow: inset 0 0px 0px 1px rgba(243, 244, 181, 0.26);
    -webkit-box-shadow: inset 0 0px 8px 4px rgb(255 255 255);
    box-shadow: inset 0 0px 8px 4px rgb(255 255 255);
    border: 1px solid #00000052;
}

    .giris-kayit .list3:hover .kayitUl {
        opacity: 1;
        visibility: visible;}
	
		.list3 .btnG {color: #dcdcdc !important;background: #26272c;}
        
        .kayitUl a {color:#333;font-size:15px;padding:5px}
.ust-menu { padding: 0 50px; }
.ust-menu .ustmenu li a {font:bold 14px/65px Arial;}
.ust-menu .ustmenu li a:hover {color:#FF3}