@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;600&family=Merriweather:wght@400;700&display=swap');

@font-face{
	font-family:'TTN';
	src: url('https://www.zonared.com/css/fonts/Titling-Gothic-Narr-Medium.woff2') format("woff2"), url('https://www.zonared.com/css/fonts/Titling-Gothic-Narr-Medium.woff') format("woff");
	font-stretch:normal; font-style:normal; font-weight:400; font-display:swap;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio, video, button { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; font-synthesis:none; -moz-font-feature-settings: 'kern'; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased !important; box-sizing:border-box; }

html { scroll-behavior: smooth; }
body { font-family:sans-serif; }

.trending { background-color: #485461; background-image: linear-gradient(315deg, #485461 0%, #28313b 74%); height:28px; white-space:nowrap; overflow-x:scroll; -ms-overflow-style:none; scrollbar-width:none; }
.trending::-webkit-scrollbar { display:none; }
.trending .cnt { max-width:1200px; margin:0 auto; padding:6px 0 0 121px; display:flex; font-family:'Rubik'; font-size:15px; color:#FFF; }
.trending .cnt .tit { margin-right:5px; font-weight:bold; }
.trending .cnt ul { list-style:none; display:flex; }
.trending .cnt ul li { position:relative; padding:0 18px 0 0; }
.trending .cnt ul li a { color:#FFF; text-decoration:none; transition: .25s ease-in-out; text-decoration-color:#CCC; }
.trending .cnt ul li a:hover { text-decoration:underline; text-decoration-color:#CCC; }
.trending .cnt ul li::after { content:''; width:8px; height:3px; border-radius:6px; display:block; background:#fd0263; position:absolute; top:8px; right:5px; }
.trending .cnt ul li:last-child::after { display:none; }

.mainbar { background:#000; height:44px; width:100%; }
.mainbar .cnt { max-width:1200px; margin:0 auto; display:flex; }
.mainbar .menu { flex-grow:1; }

header { position:relative; z-index:9999999; }
header.fixed .mainbar { position:fixed; top:0; z-index:99999; }
body.fixed { margin-top:28px; }

.logo a { display:inline-block; background:url(https://www.zonared.com/images/zr_txt.png); width:186px; height:30px; background-size:186px 30px; position:relative; margin-top:7px; margin-left:80px; transition:width .25s ease-in-out; }
.logo a::before { content:''; display:inline-block; background:url(https://www.zonared.com/images/zr_x.png); width:75px; height:74px; background-size:75px 74px; position:absolute; top:-22px; left:-80px; transition:top .25s ease-in-out; }
.logo a::after { content:''; display:inline-block; background:url(https://www.zonared.com/images/zr_x.png); width:41px; height:40px; background-size:41px 40px; position:absolute; top:20px; left:-80px; transition:top .25s ease-in-out, opacity .05s ease-in-out; opacity:0; }
.logo a span { display:none; }

header.fixed .logo { width:45px; }
header.fixed .logo a { width:0; }
header.fixed .logo a::before { top:-100px; }
header.fixed .logo a::after { top:-5px; opacity:1; transition-delay:.35s; }

.sicon::before { content:''; display:block; width:28px; height:28px; background:url(https://www.zonared.com/images/search.svg); background-size:28px 28px; filter:invert(1); margin:7px 5px 0 0; }
.sicon span { display:none; }
.sicon:hover { cursor:pointer; }

.mainbar .cnt { position:relative; }
.searchform { position:absolute; top:0; bottom:0; left:40px; right:0; background:#000; height:44px; overflow:hidden; width:0; transition:opacity .25s ease-in-out; opacity:0; }
.searchform.active { opacity:1; width:auto; }
.searchform .scnt { margin:8px; border:2px solid #fd0263; border-radius:30px; background:#f3f4f5; overflow:hidden; display:flex; position:relative; }
.searchform .scnt input { width:100%; border:0; background:none; padding:4px 10px; font-size:15px; outline:none; font-weight:bold; }

.sclose::before { content:''; display:block; width:21px; height:21px; background:url(https://www.zonared.com/images/search.svg); background-size:21px 21px; position:absolute; top:2px; right:10px; }
.sclose:hover { cursor:pointer; }

.mbut { width:29px; margin-right:5px; margin-left:5px; position:relative; flex-shrink:0; }
.mbut:hover { cursor:pointer; }
.mbut span { display:block; width:100%; height:4px; background:#FFF; border-radius:5px; position:absolute; left:0; transition:.3s ease-in-out; }
.mbut span:nth-child(1) { top:12px; }
.mbut span:nth-child(2) { top:20px; }
.mbut span:nth-child(3) { top:28px; }
.mbut.active span:nth-child(1) { transform: rotate(135deg); top:20px; }
.mbut.active span:nth-child(2) { opacity:0; left:-60px; }
.mbut.active span:nth-child(3) { transform: rotate(-135deg); top:20px; }

.menu ul { display:flex; list-style:none; margin:6px 0 0 0; opacity:0; transition:opacity .3s ease-in-out; transition-delay:.0; }
.menu ul li { margin:0 2px; text-transform:uppercase; font-family:'TTN'; font-size:17px;}
.menu ul li a { color:#FFF; text-decoration:none; display:inline-block; padding:5px 8px; background:linear-gradient(90deg, #fb227b, #e20962) no-repeat right bottom / 0 100%; transition: background-size 350ms; }
.menu ul li a:hover { background-size: 100% 100%; background-position-x:left; }
header.fixed .menu ul { opacity:1; transition-delay:.45s; }

.bigmenu { width:100%; background:#222; position:fixed; top:-100px; z-index:999999; opacity:0; transition:.3s ease-in-out; overflow:hidden; }
.bigmenu.fixed { top:-100px; }
.bigmenu.fixed.active { top:44px; }
.bigmenu.active { opacity:1; top:100px; }

.bigmenu .cnt { max-width:1200px; margin:0 auto; padding:15px; }
.bigmenu ul { list-style:none; display:grid; grid-template-columns:1fr 1fr 1fr 1fr 1fr; }
.bigmenu ul li { margin:0 0 10px 0; }
.bigmenu ul li a { display:block; text-align:center; font-family:'TTN'; text-transform:uppercase; color:#FFF; text-decoration:none; padding:4px; }

.breadcrumb { background: linear-gradient(240deg, #a71374, #fd0263); background-size: 300% 300%; -webkit-animation: bcmove 14s ease infinite; -moz-animation: bcmove 14s ease infinite; animation: bcmove 14s ease infinite; height:28px; white-space:nowrap; overflow-x:scroll; -ms-overflow-style:none; scrollbar-width:none; position:relative; z-index:9999998; }
.breadcrumb::-webkit-scrollbar { display:none; }
.breadcrumb p { max-width:1200px; margin:0 auto; padding:6px 0 0 121px; display:flex; font-family:'Rubik'; font-size:14px; color:#FFF; }
.breadcrumb p a { color:#FFF; text-decoration:none; padding:0 20px 0 0; position:relative; background:linear-gradient(90deg, #FFF, #FFF) no-repeat right bottom / 0 3px; transition: background-size 350ms; padding-bottom:2px; }
.breadcrumb p a:hover { background-size:calc(100% - 20px) 1px; background-position-x:left; }
.breadcrumb p a:after { background:#ffc2da; content:''; display:block; width:9px; height:3px; border-radius:5px; position:absolute; top:9px; right:5px; transform: rotate(-45deg); }
.breadcrumb p a:before { background:#ffc2da; content:''; display:block; width:9px; height:3px; border-radius:5px; position:absolute; top:5px; right:5px; transform: rotate(45deg); }

 @-webkit-keyframes bcmove {
	0%{background-position:0% 50%}
	50%{background-position:100% 50%}
	100%{background-position:0% 50%}
}
@-moz-keyframes bcmove {
	0%{background-position:0% 50%}
	50%{background-position:100% 50%}
	100%{background-position:0% 50%}
}
@keyframes bcmove {
	0%{background-position:0% 50%}
	50%{background-position:100% 50%}
	100%{background-position:0% 50%}
}

#uhn { background-color: #ff5826; opacity: 1; background: linear-gradient(135deg, #f1272755 25%, transparent 25%) -27px 0/ 54px 54px, linear-gradient(225deg, #f12727 25%, transparent 25%) -27px 0/ 54px 54px, linear-gradient(315deg, #f1272755 25%, transparent 25%) 0px 0/ 54px 54px, linear-gradient(45deg, #f12727 25%, #ff5826 25%) 0px 0/ 54px 54px; }
#uhn #uhnc { max-width:1200px; margin:0 auto; padding:12px 0; color:#fff; font-family:'Rubik'; font-size:20px; }
#uhn #uhnc b { background:#e80000; border-radius:5px; display:inline-block; padding:2px 5px; font-weight:bold; }
#uhn #uhnc a { color:#FFF; text-decoration:none; font-weight:bold; text-shadow:0 0 2px rgba(0,0,0,.8); }

/* Publicidad */
.pub_home_top, .pub_interior_top { margin-top: 10px !important; margin-bottom: 10px !important; clear: both;  max-width:980px; margin:0 auto; background:#f7f7f7; margin:1em auto; text-align:center; min-height:250px;}

.pub_320x100{width:320px; min-height:100px; margin:1em auto;}
.pub_sticky_mob{width:320px; min-height:100px; position:sticky; bottom:0; margin:0 auto;}
.pub_300x600{width:300px; min-height:600px; margin:0 0 25px 0; background:#f7f7f7; }
.pub_300x600_not{display:none;}
.pub-sticky{position:sticky; top:60px; height:600px;}

.sticky-wrappl{height: auto; float:left;}
.sticky-wrappr{height: auto; float:right;}
.skylt{position:sticky; top:50px; margin-left:-175px; margin-bottom:18px;}
.skyrt{position:sticky; top:50px; margin-right:-175px; margin-bottom:18px;}

.topwrap { max-width:1200px; margin:0 auto; margin-bottom:22px; position:relative;}
.wrapper { max-width:1050px; margin:0 auto; display:flex; }
.wcenter { flex-grow:1; margin-right:25px; max-width: 750px; }
.wright { flex:0 0 300px; display:flex; flex-flow:column; }

footer { margin-top:30px; }
.own { background: linear-gradient(240deg, #a71374, #fd0263); background-size: 300% 300%; -webkit-animation: bcmove 14s ease infinite; -moz-animation: bcmove 14s ease infinite; animation: bcmove 14s ease infinite; padding:80px 5px; text-align:center; }
.own .cnt { max-width:1200px; margin:0 auto; }
.enlaces { background:#000; padding:60px 5px; }
.enlaces .wrap { max-width:1200px; margin:0 auto; }

.own .msg-social { display:inline-block; background: linear-gradient(240deg, #7d0854, #fd0263, #ffc2da); color:#FFF; background-size: 300% 300%; -webkit-animation: bcmove 14s ease infinite; -moz-animation: bcmove 14s ease infinite; animation: bcmove 14s ease infinite; font-family:'Rubik'; font-weight:bold; font-size:18px; padding:7px 18px; border-radius:10px; margin:0 0 12px 0; text-shadow:0 0 4px rgba(0,0,0,.4); }
.own .info { text-align:center; }
.own .info button { background:none; font-family:'Rubik'; font-size:14px; font-weight:bold; color:#FFF; margin:0 5px 10px 5px; }
.own .info button:hover { cursor:pointer; }
.own .iconos { height:60px; margin-bottom:20px; }
.own .iconos a { text-decoration:none; position:relative; width:50px; height:35px; display:inline-block; text-align:center; color:#fff; font-size:22px; padding-top:6px; box-sizing:border-box; margin:0 4px; transition:height .25s ease-in-out; border-radius:6px; }
.own .iconos a span { font-family:'Rubik'; display:block; width:50px; font-size:17px; font-weight:bold; position:absolute; top:32px; height:0; overflow:hidden; transition:height .25s ease-in-out; }
.own .iconos a:hover span { height:20px; }
.own .iconos a:hover { height:55px; }
.own .iconos a.rss { background:#FF9B00; }
.own .iconos a.fb { background:#3652A0; }
.own .iconos a.tw { background:#00A8F7; }
.own .iconos a.yt { background:#CF1D11; }
.own .iconos a.ig { background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%); }

.video-js.vjs-vtt-thumbnails {position: relative !important;}

.enlaces p { color:#DDD; margin:0 0 40px 0; font-size:14px; }
.enlaces .noxvo { display:inline-block; width:133px; height:26px; background:url(https://www.zonared.com/images/noxvo-gen.png); background-size:133px 26px; margin-right:8px; vertical-align:-8px; filter: grayscale(100%); opacity:.7; transition:.3s ease-in-out; }
.enlaces .noxvo:hover { cursor:pointer; opacity:1; filter: grayscale(0%); }
.enlaces .noxvo span { display:none; }

.enlaces .categoria { margin:0 0 20px 0; color:#FFF; display:flex; }
.enlaces .categoria span { position:relative; padding:0 20px 0 0; white-space:nowrap; }
.enlaces .categoria span:after { background:#ec3d14; content:''; display:block; width:9px; height:3px; border-radius:5px; position:absolute; top:9px; right:5px; transform: rotate(-45deg); }
.enlaces .categoria span:before { background:#ec3d14; content:''; display:block; width:9px; height:3px; border-radius:5px; position:absolute; top:5px; right:5px; transform: rotate(45deg); }
.enlaces .categoria ul { display:flex; list-style:none; flex-wrap: wrap; }
.enlaces .categoria ul li { margin-right:12px; }
.enlaces .categoria ul li a { color:#ddd; text-decoration:none; }

.subtit { font-family:'TTN'; margin:25px 0 10px 0; text-transform:uppercase; font-size:15px; border-bottom:1px solid #DDD; }

#resetUI { position:fixed; bottom:5px; left:5px; width:50px; height:50px; background:url('https://www.zonared.com/images/notification.png') no-repeat; background-size:50px 50px; }
#resetUI span { display:none; }
#resetUI:hover { cursor:pointer; }

#suggestions { transition:.3s ease-in-out; }
#suggestions .scnt { width: min(100%,1200px); margin-inline: auto; }
#busqueda { flex-grow:1; }

.resbox { border-bottom:1px dashed #CCC; padding:12px; display:flex; gap:15px; }
.resbox .portada { width:100px; }
.resbox .portada img { width:100px; border-radius:10px; }
.resbox .info { flex-grow:1; }
.resbox .tit { font-family:'TTN'; display:block; font-size:20px; color:#000; text-decoration:none; font-weight:bold; }
.resbox .data { font-family:'Rubik'; font-size:16px; text-transform:capitalize; color:#444; margin:0 0 3px 0; }
.resbox .data a { color:#333; }
.resbox .pld { font-family:'Rubik'; font-weight:600; font-size:13px; color:#999; margin:0 0 8px 0; }
.resbox .pld span { margin-right:4px; }
.resbox .enlaces { background:none; padding:0; }
.resbox .enlaces a { margin:0 6px 0 0; font-family: -apple-system, BlinkMacSystemFont, Helvetica, sans-serif; font-weight:700; color:#fd0263; font-size:16px; }

.moreresults { display:block; margin-top:15px; margin-bottom:20px; margin-inline:auto; width:200px; text-align:center; border:1px solid #DDD; border-radius:8px; color:#000; padding:8px 0; text-decoration:none; font-weight:bold; font-family:'Rubik'; }

@media (max-width:1050px) {
.wrapper { margin-left:8px; margin-right:8px; }
}

@media (max-width:800px) {
.wrapper { flex-wrap:wrap; }
.wcenter { margin-right:0; }
.wright { flex:100%; }
.menu ul { display:none; }
.pub_interior_top{ max-width:320px; margin:1em auto; text-align:center; min-height:120px; }
.pub_300x600_not{width:100%; min-height:600px; margin:1em auto; display:block;}
.pub_300x600{ width:100%; min-height:600px; margin:1em auto;}
}