.menuc { font-family: "Poppins", "Roboto", Arial, sans-serif; }

    @keyframes fadeIn { from {opacity: 0;} to {opacity:1;} }

    .dropdown-menu.show { display:block !important; animation: fadeIn 0.3s alternate; }
 
    
    .dropdown {z-index: 1002;}


    .icons a { transition: all 0.2s ease-in-out; padding: 0.2rem 0.4rem; color:#ccc !important; text-decoration:none; }
    .icons a:hover { color:white; text-shadow:0 0 30px white; }


    .overlay {z-index: 1001; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.8); display:none; align-items:center; justify-content:center; z-index:9999; }
    .overlay.active { display:flex; }
    .search-modal { background:#2a2a2a; width:800px; max-width:95%; border-radius:8px; display: block; align-items: center; text-align: center; margin: 0; padding:16px; box-shadow:0 0 30px rgba(0,0,0,0.8); color:#fff; }
    .search-header { display:flex; align-items:center; margin-bottom:16px; }
    .search-header input { flex:1; padding:10px 14px; border-radius:6px; border:1px solid #444; background:#1e1e1e; color:#fff; font-size:14px; }
    .search-header input:focus { outline:none; border-color:#777; }
    .search-header button { margin-left:8px; background:#3a3a3a; border:none; padding:8px 14px; color:#fff; border-radius:6px; cursor:pointer; }
    .search-header button:hover { background:#555; }
    .filters { display:flex; flex-wrap:wrap; margin-bottom:16px; }
    .filters button { background:#3a3a3a; border:none; color:#fff; margin:4px; padding:6px 16px; border-radius:20px; cursor:pointer; font-size:14px; }
    .filters button:hover { background:#ffae42; color:#000; }
    .games h6 { margin:0 0 8px; font-size:14px; color:#bbb; }
    .games p { display:flex; align-items:center; margin:6px 0; font-size:14px; color:#fff; cursor:pointer; }
    .games p:hover { color:#ffae42; }
    .games img { width:22px; height:22px; margin-right:10px; }
    .bottom-bar { display:flex; justify-content:space-between; align-items:center; margin-top:16px; font-size:12px; color:#aaa; }
    .bottom-bar span {z-index: 1002; margin-right:10px; padding:3px 6px; background:#444; border-radius:4px; font-size:11px; }
.overlay {

  justify-content: center; 
  align-items: center;     
  height: 100vh;          
}


    @media (min-width: 992px) {
      .navbar .container-fluid { border:none; display:flex; justify-content:center; align-items:center; position:relative; }
      .navbar-brand { position:absolute; left:15px; z-index: 1010;}
      .navbar-nav.me-auto { justify-content:center; flex:1; }
      .navbar-nav.ms-auto { position:absolute; right:0; display:flex; align-items:center; background-color: transparent;}
   
      .navbar .dropdown:hover > .dropdown-menu { display:block; }
      .navbar .dropdown-menu .dropend:hover > .dropdown-menu { display:block; margin-left: .15rem; top:0; }
      .navbar .dropdown-toggle::after { vertical-align:.155em; }
    }

    footer .main-footer{	padding: 20px 0;	background: #252525;}
footer ul{	padding-left: 0;	list-style: none;}


.footer-copyright {	background: #222;	padding: 5px 0;}
.footer-copyright .logo {    display: inherit;}
.footer-copyright nav {    float: right;    margin-top: 5px;}
.footer-copyright nav ul {	list-style: none;	margin: 0;	padding: 0;}
.footer-copyright nav ul li {	border-left: 1px solid #505050;	display: inline-block;	line-height: 12px;	margin: 0;	padding: 0 8px;}
.footer-copyright nav ul li a{	color: #969696;}
.footer-copyright nav ul li:first-child {	border: medium none;	padding-left: 0;}
.footer-copyright p {	color: #969696;	margin: 2px 0 0;}


.footer-top{	background: #252525;	padding-bottom: 30px;	margin-bottom: 30px;	border-bottom: 3px solid #222;}


footer.transparent .footer-top, footer.transparent .main-footer{	background: transparent;}
footer.transparent .footer-copyright{	background: none repeat scroll 0 0 rgba(0, 0, 0, 0.3) ;}


footer.light .footer-top{	background: #f9f9f9;}
footer.light .main-footer{	background: #f9f9f9;}
footer.light .footer-copyright{	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.3) ;}


.footer- .logo {    display: inline-block;}


.widget{	padding: 20px;	margin-bottom: 40px;}
.widget.widget-last{	margin-bottom: 0px;}
.widget.no-box{	padding: 0;	background-color: transparent;	margin-bottom: 40px;
	box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none;}
.widget.subscribe p{	margin-bottom: 18px;}
.widget li a{	color: #647FBC;}
.widget li a:hover{	color: #4b92dc;}
.widget-title {margin-bottom: 20px;}
.widget-title span {background: #839FAD none repeat scroll 0 0;display: block; height: 1px;margin-top: 25px;position: relative;width: 20%;}
.widget-title span::after {background: inherit;content: "";height: inherit;    position: absolute;top: -4px;width: 50%;}
.widget-title.text-center span,.widget-title.text-center span::after {margin-left: auto;margin-right:auto;left: 0;right: 0;}
.widget .badge{	float: right;	background: #7f7f7f;}

.typo-light h1, 
.typo-light h2, 
.typo-light h3, 
.typo-light h4, 
.typo-light h5, 
.typo-light h6,
.typo-light p,
.typo-light div,
.typo-light span,
.typo-light small{	color: #fff;}

ul.social-footer2 {	margin: 0;padding: 0;	width: auto;}
ul.social-footer2 li {display: inline-block;padding: 0;}
ul.social-footer2 li a:hover {background-color:#647FBC;}
ul.social-footer2 li a {display: block;	height:30px;width: 30px;text-align: center;}
.btn{background-color: #647FBC; color:#fff;}
.btn:hover, .btn:focus, .btn.active {background: #4b92dc;color: #fff;
-webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
-ms-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
-o-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
-webkit-transition: all 250ms ease-in-out 0s;
-moz-transition: all 250ms ease-in-out 0s;
-ms-transition: all 250ms ease-in-out 0s;
-o-transition: all 250ms ease-in-out 0s;
transition: all 250ms ease-in-out 0s;

}
    .navbar-brand {color: #647FBC !important;}


       .navbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: #111827;
      padding: 14px 40px;
      position: relative;
      z-index: 1000;
    }

    .navbar .logo {
      font-size: 22px;
      font-weight: 700;
      color: #fff;
    }
    .navbar .logo span:first-child {
      color: #4f46e5;
    }

    .navbar .menu {
      display: flex;
      gap: 28px;
      transition: max-height 0.3s ease-in-out;
    }
    .navbar .menu a {
      color: #fff;
      text-decoration: none;
      font-weight: 500;
      position: relative;
      padding-bottom: 4px;
      transition: color 0.3s;
    }
    .navbar .menu a:hover {
      color: #2563eb;
    }
    .navbar .menu a.active {
      color: #2563eb;
    }
    .navbar .menu a.active::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 2px;
      background: #2563eb;
    }

    .navbar .right {
      display: flex;
      align-items: center;
      gap: 20px;
    }

    .discord-btn {
      background: #4338ca;
      color: #fff;
      border-radius: 6px;
      padding: 8px 16px;
      text-decoration: none;
      font-weight: 500;
      transition: background 0.3s;
    }
    .discord-btn:hover {
      background: #4f46e5;
    }

    .icons {
      display: flex;
      align-items: center;
      gap: 18px;
      font-size: 18px;
      color: #fff;
      cursor: pointer;
    }

    .cart {
      position: relative;
    }
    .cart span {
      position: absolute;
      top: -8px;
      right: -12px;
      background: #2563eb;
      color: #fff;
      font-size: 12px;
      border-radius: 50%;
      padding: 2px 6px;
    }

    .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      width: 25px;
      height: 20px;
      justify-content: center;
    }
    .hamburger div {
      width: 25px;
      height: 3px;
      background: #fff;
      transition: 0.3s;
    }

    .hamburger.active div:nth-child(1) {
      transform: rotate(45deg) translate(5px, 5px);
    }
    .hamburger.active div:nth-child(2) {
      opacity: 0;
    }
    .hamburger.active div:nth-child(3) {
      transform: rotate(-45deg) translate(5px, -5px);
    }

    @media (max-width: 992px) {
      .navbar {
        padding: 14px 20px;
      }

      .menu {
        overflow: hidden;
        flex-direction: column;
        background: #111827;
        position: absolute;
        top: 60px;
        left: 0;
        right: 0;
        max-height: 0;
      }

      .menu.open {
        max-height: 400px;
        padding: 20px;
      }

      .hamburger {
        display: flex;
      }

      .right {
        gap: 10px;
      }

      .discord-btn {
        display: none;
      }
    }



.games p {
  transition: all 0.3s ease;
  opacity: 1;
  height: auto;
  overflow: hidden;
}

.games p.hidden {
  opacity: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

a {text-decoration: none;}


.df4gdfgdf { display: flex; justify-content: center; padding: 20px 0; width: 100%; }
.fg34fgfg { display: flex; flex-direction: row; backdrop-filter: blur(8px);  background: rgba(15, 23, 42, 0.4); color: #ffffff; border-radius: 8px; overflow: hidden; width: 100%; gap: 20px; flex-wrap: wrap; margin: 0 auto; }
.gdfg34fg { flex: 0 0 450px; height: 450px; overflow: hidden; position: relative; }
.gf3gfgfg { width: 100%; height: 100%; object-fit: cover; }

.dfg34df { flex: 1; display: flex; flex-direction: column; justify-content: flex-start; gap: 12px; position: relative; }

.fg-blur {
    
    padding: 10px 20px;
    border-radius: 8px;
    margin-top: 20px;
}

.fg34dfg { font-size: 2rem; font-weight: 700; color: #4ade80; margin:0; }
.gfg-title { font-size: 1rem; color: #9ca3af; margin:5px 0 0 0; }
.gfg34dfg { font-size: 1rem; color: #d1d5db; margin:5px 0 0 15px; text-align: justify; }

.d34fgdf { display: flex; flex-direction: column; justify-content: center; align-items: center; flex: 0 0 180px; }

.fg-butondv { display: flex; flex-direction: column; gap: 10px; align-items: center; }

.fg34gdf { background-color: #3b82f6; border: none; border-radius: 4px; color: white; cursor: pointer; font-weight: 600; width: 100%; padding: 10px 0; }
.fg34gdf:disabled { background-color: #6b7280; cursor: not-allowed; }

.dfg34fgs { font-size: 0.9rem; color: #facc15; text-align: center; }
.dfg34fgx { font-size: large; color: #15aafa; text-align: center; }
@media (max-width: 900px) {
    .fg34fgfg { flex-direction: column; align-items: center; width: 95%; }
    .gdfg34fg { width: 250px; height: 300px; }
    .d34fgdf { flex-direction: row; justify-content: space-between; width: 100%; margin-top:10px;}
    .fg-blur { margin-top: -50px; }
}