/* ================================================================
   FOX PARTY RADIO – FINAL NEON THEME
   WEB-PHP / W-P Mobile
   Design by PofD IT Solutions
   ================================================================ */

:root{
  --fpr-bg:#010207;
  --fpr-panel:#06090f;
  --fpr-panel2:#0a0e15;
  --fpr-red:#ff171f;
  --fpr-red2:#d90914;
  --fpr-orange:#ff6b00;
  --fpr-blue:#00a8ff;
  --fpr-cyan:#25d9ff;
  --fpr-white:#fff;
  --fpr-muted:#b9c0ca;
  --fpr-line:rgba(255,28,35,.48);
  --fpr-glow:0 0 9px rgba(255,25,30,.55),0 0 26px rgba(255,25,30,.16);
}

html{scroll-behavior:smooth;background:#010207}
body{
  margin:0;
  color:#fff;
  font-family:Arial,Helvetica,sans-serif;
  font-size:14px;
  background:#010207 url(background.png) center top/cover fixed no-repeat!important;
}
a,a:visited{color:#fff;text-decoration:none;transition:.18s ease}
a:hover,a:focus{color:#ff3a3f;text-decoration:none}
a:active{color:#ff7c17}

.container{max-width:1320px!important;width:calc(100% - 36px)!important}
.padding_null_left{padding-left:0;padding-right:0}

/* ---------------- Header ---------------- */
.header{
  max-width:1400px;
  height:auto!important;
  max-height:250px!important;
  margin:0 auto;
  overflow:hidden;
  background:#000!important;
  border:0!important;
  box-shadow:0 10px 36px rgba(0,0,0,.65);
}
.header img{
  width:100%!important;
  height:auto!important;
  max-width:1400px!important;
  max-height:250px!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  margin:0 auto!important;
}
.carousel{display:none!important}

/* ---------------- Navigation ---------------- */
.navbar-inverse{
  max-width:1320px;
  margin:-1px auto 20px!important;
  min-height:58px;
  background:linear-gradient(180deg,#090d12 0%,#020407 100%)!important;
  border:1px solid rgba(255,255,255,.05)!important;
  border-bottom:3px solid #ff191f!important;
  border-radius:0 0 14px 14px!important;
  box-shadow:0 0 12px rgba(255,25,30,.45),0 12px 30px rgba(0,0,0,.65)!important;
}
.navbar-inverse .navbar-nav>li>a,
.navbar-inverse .navbar-brand{
  min-height:55px;
  padding-top:18px;
  color:#fff!important;
  font-weight:700;
  border-radius:10px;
}
.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.open>a,
.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus{
  color:#fff!important;
  background:linear-gradient(180deg,#df0e16,#900008)!important;
  box-shadow:inset 0 0 18px rgba(255,85,0,.35),0 0 15px rgba(255,15,20,.28)!important;
}
.navbar-inverse .navbar-toggle{
  border:1px solid #ff2229!important;
  background:#950009!important;
}
.navbar-inverse .navbar-toggle .icon-bar{background:#fff!important}
.dropdown-menu{
  background:#05080d!important;
  border:1px solid rgba(255,25,30,.55)!important;
  border-radius:10px!important;
  box-shadow:0 12px 30px rgba(0,0,0,.72),0 0 16px rgba(255,20,25,.18)!important;
}
.dropdown-menu>li>a{color:#fff!important}
.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus{background:#b80810!important;color:#fff!important}

/* ---------------- Main area ---------------- */
.mitte-mitte-wp{
  position:relative;
  max-width:1320px;
  margin:0 auto;
  padding:116px 14px 24px!important;
  color:#fff!important;
  background:rgba(1,3,7,.88)!important;
  border-radius:14px 14px 0 0;
  box-shadow:0 20px 55px rgba(0,0,0,.58);
  backdrop-filter:blur(4px);
}
.mitte-mitte-wp:before{
  content:"HERZLICH  WILLKOMMEN\A HITS, PARTY & GUTE LAUNE – RUND UM DIE UHR";
  white-space:pre;
  position:absolute;
  left:14px;right:14px;top:10px;
  height:86px;
  padding:15px 26px 12px;
  color:#fff;
  font-size:28px;
  font-weight:900;
  line-height:1.25;
  letter-spacing:.2px;
  background:
     url(equalizer.png) right 18px center/360px 55px no-repeat,
     linear-gradient(180deg,rgba(10,12,16,.97),rgba(4,6,9,.97));
  border:2px solid #ff191f;
  border-radius:13px;
  box-shadow:var(--fpr-glow);
  text-shadow:0 2px 2px #000;
}
.mitte-mitte-wp:after{
  content:"";
  position:absolute;
  left:31px;top:53px;
  width:235px;height:2px;
  background:linear-gradient(90deg,#ff191f,#ff6a00,transparent);
  box-shadow:0 0 10px #ff2028;
}

/* ---------------- Cards / panels ---------------- */
.main_panel{border:0!important;box-shadow:none!important;background:transparent!important;margin-bottom:18px!important}
.thumbnail,.main_boxen{
  overflow:hidden;
  color:#fff!important;
  background:linear-gradient(180deg,rgba(8,12,18,.98),rgba(2,5,9,.98))!important;
  border:1px solid rgba(255,35,38,.55)!important;
  border-radius:13px!important;
  box-shadow:0 12px 25px rgba(0,0,0,.48),0 0 13px rgba(255,20,25,.10)!important;
}
#main_heading,#main_heading_boxen{
  padding:10px 14px!important;
  min-height:47px;
  color:#fff!important;
  font-size:18px!important;
  font-weight:800!important;
  background:linear-gradient(90deg,#d90914 0%,#ee1817 55%,#ff7500 100%)!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  border-radius:12px 12px 0 0!important;
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.35),0 0 14px rgba(255,28,32,.20)!important;
  text-shadow:0 1px 2px #670000;
}
#main_heading_text{font-size:18px!important;color:#fff!important;font-weight:800!important}
.main_body,.main_body_boxen{color:#fff!important;background:transparent!important}
.main_body_boxen{padding:14px!important}
.main_body_boxen_hr{border-color:rgba(255,255,255,.10)!important}
.main_body_list-group-item{background:transparent!important;color:#fff!important;border:0!important}
.list-group-item.main_active{
  color:#fff!important;
  background:#06090d!important;
  border-color:rgba(255,28,32,.32)!important;
}
a.list-group-item.main_active:hover,
a.list-group-item.main_active:focus{
  color:#fff!important;
  background:linear-gradient(90deg,rgba(210,0,9,.30),rgba(255,90,0,.13))!important;
  border-color:#ff2028!important;
}

/* panel images */
.main_boxen img,.thumbnail img{
  max-width:100%;
  height:auto;
}

/* ---------------- Buttons / forms ---------------- */
.btn-primary,.btn-danger,.btn-success{
  color:#fff!important;
  font-weight:700!important;
  border:1px solid #ff3b22!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#f31b20,#b9060d)!important;
  box-shadow:0 0 13px rgba(255,31,32,.32)!important;
}
.btn-primary:hover,.btn-danger:hover,.btn-success:hover{
  background:linear-gradient(180deg,#ff5a19,#e31716)!important;
  border-color:#ff8a23!important;
}
.form-control{
  color:#fff!important;
  background:#03070b!important;
  border:1px solid rgba(255,31,35,.45)!important;
  border-radius:8px!important;
}
.form-control:focus{
  border-color:#ff2229!important;
  box-shadow:0 0 0 2px rgba(255,28,32,.16),0 0 13px rgba(255,25,30,.24)!important;
}

/* ---------------- User/profile ---------------- */
.profile-userpic img,.profile-userpic_list img,.profile-userpic_list_user img{
  float:none!important;
  margin:0 auto!important;
  width:50%!important;
  height:auto!important;
  padding:4px!important;
  background:#05080c!important;
  border:2px solid #ff1a22!important;
  border-radius:12px!important;
  box-shadow:0 0 15px rgba(255,25,30,.25)!important;
}
.profile-usertitle-name{font-size:14px;font-weight:700;text-align:center}

/* ---------------- Tables ---------------- */
.table{color:#fff!important}
.table th,.table td{
  border-color:rgba(255,255,255,.09)!important;
  background:transparent!important;
}

/* ---------------- Footer ---------------- */
.footer_innen{
  max-width:1320px;
  margin:0 auto;
  padding:26px 18px!important;
  color:#fff!important;
  background:linear-gradient(180deg,#05070b,#010205)!important;
  border-top:2px solid #ff1b22!important;
  box-shadow:0 -2px 15px rgba(255,24,30,.22),0 -14px 35px rgba(0,0,0,.42)!important;
}
.footer{overflow:hidden;color:#fff!important}
.footer_bottom{
  max-width:1320px;
  margin:0 auto;
  color:#c8cdd3!important;
  background:#010205!important;
  padding:11px 15px 16px!important;
}
#footer_bottom a{color:#ff3038!important}
.title-widget{font-weight:800;font-size:16px;color:#fff!important}
.widget_nav_menu ul{list-style:none;padding-left:0}
.widget_nav_menu ul li{margin-bottom:7px;padding-bottom:7px}
#main_fuss{color:#ddd!important}
#main_fuss:hover{color:#ff3038!important}
.footerp p{color:#b9bec7!important}

/* ---------------- Scroll up ---------------- */
.scrollup{
  width:40px;height:40px;
  position:fixed;right:18px;bottom:18px;
  background:linear-gradient(135deg,#e10812,#ff7100)!important;
  border:1px solid #ff343b;
  border-radius:50%;
  box-shadow:0 0 16px rgba(255,22,28,.35);
  z-index:999;
}
a.scrollup{text-align:center}
a.scrollup i{margin-top:6px;color:#fff!important}

/* ---------------- Responsive ---------------- */
.tab_aus,.handy_aus{display:inline}
.tab_an,.handy_an{display:none}
#nav1.affix{top:0;left:0;z-index:1000;margin-bottom:0}
.affix{position:fixed;width:100%!important}

@media(max-width:1024px){
  .container{width:calc(100% - 20px)!important}
  .navbar-header{float:none}
  .navbar-left,.navbar-right{float:none!important}
  .navbar-toggle{display:block}
  .navbar-collapse.collapse{display:none!important}
  .collapse.in{display:block!important}
  .tab_aus{display:none}.tab_an{display:inline}
  .mitte-mitte-wp:before{
    font-size:23px;
    background-size:280px 48px;
  }
}
@media(max-width:767px){
  body{font-size:13px;background-attachment:scroll!important}
  .container{width:100%!important;padding-left:8px!important;padding-right:8px!important}
  .header{max-height:170px!important}
  .header img{max-height:170px!important;object-fit:cover!important}
  .navbar-inverse{margin-bottom:10px!important;border-radius:0!important}
  .no_handy,.handy_aus{display:none}
  .handy_an{display:inline}
  .mitte-mitte-wp{
    padding:102px 6px 14px!important;
    border-radius:0;
  }
  .mitte-mitte-wp:before{
    left:6px;right:6px;top:5px;
    height:80px;
    padding:13px 15px;
    font-size:20px;
    line-height:1.35;
    background-image:linear-gradient(180deg,rgba(10,12,16,.97),rgba(4,6,9,.97));
  }
  .mitte-mitte-wp:after{left:22px;top:47px;width:185px}
  #main_heading,#main_heading_boxen,#main_heading_text{font-size:16px!important}
  .footer_innen{padding:20px 10px!important}
}
@media(max-width:460px){
  .header{max-height:132px!important}
  .header img{max-height:132px!important}
  .mitte-mitte-wp:before{
    font-size:17px;
    height:76px;
  }
}

/* =========================================================
   V4 – Layoutkorrektur nach Live-Test
   ========================================================= */

/* Header größer wie im Entwurf */
.header{
  max-width:1460px!important;
  max-height:330px!important;
  height:auto!important;
}
.header img{
  width:100%!important;
  max-width:1460px!important;
  max-height:330px!important;
  height:auto!important;
  object-fit:cover!important;
  object-position:center!important;
}

/* Navigation auf gleiche Breite wie Header/Inhalt */
.navbar-inverse{
  max-width:1400px!important;
}

/* Willkommen-Balken über volle Inhaltsbreite, ohne Grid zu beeinflussen */
.mitte-mitte-wp{
  max-width:1400px!important;
  padding-top:126px!important;
}
.mitte-mitte-wp:before{
  left:14px!important;
  right:14px!important;
  width:auto!important;
  box-sizing:border-box!important;
  height:96px!important;
  padding:14px 390px 12px 27px!important;
  font-size:27px!important;
  line-height:1.35!important;
  letter-spacing:.5px!important;
  background:
    url(equalizer.png) right 28px center/350px 62px no-repeat,
    linear-gradient(180deg,rgba(9,12,16,.97),rgba(3,5,8,.98))!important;
}
.mitte-mitte-wp:after{
  left:42px!important;
  top:58px!important;
  width:270px!important;
}

/* Inhalt darunter darf wieder die volle CMS-Breite verwenden */
.mitte-mitte-wp > .container,
.mitte-mitte-wp .container{
  max-width:100%!important;
}

/* etwas hellerer Seitenhintergrund wie im Referenzbild */
body{
  background-color:#040711!important;
  background-image:
    linear-gradient(rgba(0,0,0,.06),rgba(0,0,0,.06)),
    url(background.png)!important;
}

@media(max-width:1024px){
  .header{max-height:270px!important}
  .header img{max-height:270px!important}
  .mitte-mitte-wp:before{
    padding-right:300px!important;
    background-size:265px 52px!important;
    font-size:23px!important;
  }
}
@media(max-width:767px){
  .header{max-height:205px!important}
  .header img{max-height:205px!important}
  .mitte-mitte-wp{padding-top:105px!important}
  .mitte-mitte-wp:before{
    left:6px!important;right:6px!important;
    height:82px!important;
    padding:12px 14px!important;
    font-size:19px!important;
    background-image:linear-gradient(180deg,rgba(9,12,16,.97),rgba(3,5,8,.98))!important;
  }
  .mitte-mitte-wp:after{left:22px!important;top:49px!important;width:205px!important}
}


/* =========================================================
   PofD IT Solutions – FINAL V7
   Navigation sichtbar + Welcome-Bar mittig darunter
   ========================================================= */

.mitte-mitte-wp{
    margin-top:0 !important;
    padding-top:108px !important;
    overflow:visible !important;
}

.mitte-mitte-wp:before{
    content:"HERZLICH WILLKOMMEN\A HITS, PARTY & GUTE LAUNE – RUND UM DIE UHR" !important;
    white-space:pre-line !important;

    position:absolute !important;
    top:8px !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;

    width:calc(100% - 90px) !important;
    max-width:1180px !important;
    height:88px !important;
    min-height:88px !important;
    box-sizing:border-box !important;

    margin:0 !important;
    padding:14px 220px 12px !important;

    color:#fff !important;
    font-family:Arial,Helvetica,sans-serif !important;
    font-size:25px !important;
    line-height:1.28 !important;
    font-weight:900 !important;
    letter-spacing:.5px !important;
    text-align:center !important;
    text-shadow:0 2px 3px #000 !important;

    background:
        url(equalizer.png) left 20px center/185px 50px no-repeat,
        url(equalizer.png) right 20px center/185px 50px no-repeat,
        linear-gradient(180deg,rgba(7,10,14,.98),rgba(2,4,8,.99)) !important;

    border:1px solid #ff2435 !important;
    border-bottom:2px solid #ff2435 !important;
    border-radius:12px !important;
    box-shadow:0 0 16px rgba(255,20,35,.20),
               inset 0 1px 0 rgba(255,255,255,.04) !important;
    overflow:hidden !important;
}

/* Die alte zusätzliche Linie/Equalizer-Zeile abschalten */
.mitte-mitte-wp:after{
    display:none !important;
    content:none !important;
}

/* Navigation sicher sichtbar halten */
.navbar-inverse{
    position:relative !important;
    z-index:50 !important;
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
}

.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-nav{
    visibility:visible !important;
    opacity:1 !important;
}

@media (max-width:999px){
    .mitte-mitte-wp{
        margin-top:0 !important;
        padding-top:98px !important;
    }

    .mitte-mitte-wp:before{
        width:calc(100% - 20px) !important;
        max-width:none !important;
        height:78px !important;
        min-height:78px !important;
        padding:12px 16px !important;
        font-size:18px !important;
        background:
            linear-gradient(180deg,rgba(7,10,14,.98),rgba(2,4,8,.99)) !important;
    }
}


/* =========================================================
   PofD IT Solutions – Formular/Profile Fix 2
   Profilkacheln und Eingabefelder getrennt behandeln
   ========================================================= */

/* Benutzerkonto-/Profil-Kacheln */
.list-group-item,
a.list-group-item,
button.list-group-item{
  color:#fff !important;
  background:#070b10 !important;
  border:1px solid rgba(255,31,35,.55) !important;
}
a.list-group-item:hover,
a.list-group-item:focus,
button.list-group-item:hover,
button.list-group-item:focus{
  color:#fff !important;
  background:linear-gradient(90deg,rgba(210,0,9,.28),rgba(255,90,0,.10)) !important;
  border-color:#ff2028 !important;
}

/* Einzeilige CMS-Felder / Shoutbox:
   helles Feld beibehalten, aber eingegebenen Text dunkel sichtbar machen */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"],
input[type="number"]{
  color:#111 !important;
  background:#fff !important;
  border:1px solid #c9c9c9 !important;
  caret-color:#111 !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* Textbereiche wie Wunsch-/Grußbox passend zum dunklen Theme */
textarea{
  color:#fff !important;
  background:#090d12 !important;
  border:1px solid rgba(255,31,35,.60) !important;
  caret-color:#fff !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus{
  color:#111 !important;
  background:#fff !important;
  border-color:#ff2229 !important;
  outline:none !important;
  box-shadow:0 0 0 2px rgba(255,28,32,.15) !important;
}

textarea:focus{
  color:#fff !important;
  background:#090d12 !important;
  border-color:#ff2229 !important;
  outline:none !important;
}

input::placeholder{
  color:#666 !important;
  opacity:1 !important;
}
textarea::placeholder{
  color:#b8bec6 !important;
  opacity:1 !important;
}

/* Browser-Autofill ebenfalls lesbar halten */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-text-fill-color:#111 !important;
  -webkit-box-shadow:0 0 0 1000px #fff inset !important;
  caret-color:#111 !important;
}


/* =========================================================
   PofD IT Solutions – Shoutbox Eingabefeld Fix
   W-P Mobile verwendet teils Textinputs ohne type="text".
   ========================================================= */

/* Auch Inputs OHNE type-Attribut erfassen */
.main_boxen input:not([type]),
.panel input:not([type]),
form input:not([type]){
  width:100% !important;
  max-width:100% !important;
  min-width:60px !important;
  height:32px !important;
  min-height:32px !important;
  margin:4px 0 7px 0 !important;
  padding:5px 8px !important;
  box-sizing:border-box !important;
  color:#111 !important;
  background:#fff !important;
  border:1px solid #c9c9c9 !important;
  border-radius:4px !important;
  font-size:14px !important;
  line-height:20px !important;
  caret-color:#111 !important;
}

/* Explizite Textfelder innerhalb der Seitenboxen ebenfalls sicher anzeigen */
.main_boxen input[type="text"],
.panel input[type="text"]{
  width:100% !important;
  max-width:100% !important;
  min-width:60px !important;
  height:32px !important;
  min-height:32px !important;
  margin:4px 0 7px 0 !important;
  padding:5px 8px !important;
  box-sizing:border-box !important;
  color:#111 !important;
  background:#fff !important;
  border:1px solid #c9c9c9 !important;
  border-radius:4px !important;
  font-size:14px !important;
  line-height:20px !important;
  caret-color:#111 !important;
}


/* =========================================================
   PofD IT Solutions – helle Menü-/Profil-Kacheln
   Globales a{color:#fff} hatte die Beschriftung unsichtbar gemacht.
   ========================================================= */
.btn-default,
a.btn-default,
button.btn-default,
input.btn-default,
.btn-default:visited,
a.btn-default:visited{
  color:#333 !important;
  background:#fff !important;
  border-color:#ddd !important;
  text-shadow:none !important;
}

.btn-default i,
.btn-default .fa,
.btn-default .fas,
.btn-default .far,
.btn-default .fab,
.btn-default .glyphicon{
  color:#555 !important;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
a.btn-default:hover,
a.btn-default:focus,
a.btn-default:active,
button.btn-default:hover,
button.btn-default:focus{
  color:#111 !important;
  background:#f2f2f2 !important;
  border-color:#ff3038 !important;
  text-shadow:none !important;
}

.btn-default:hover i,
.btn-default:focus i,
.btn-default:hover .fa,
.btn-default:focus .fa,
.btn-default:hover .fas,
.btn-default:focus .fas,
.btn-default:hover .glyphicon,
.btn-default:focus .glyphicon{
  color:#333 !important;
}

/* Registrierung: versteckte Anti-Spam-Felder bleiben unsichtbar. */
input[name="www"], input[name="https_ceck"]{display:none !important;visibility:hidden !important;}