body { background-color:#FFF; }

#bg {
background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(83,144,190,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(83,144,190,1) 100%);
background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(83,144,190,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#5390be",GradientType=1);
}

#header { background-color:#b8e1fc; }

.nav > li > a { padding:4px 8px; font-size:13px; color:#666; }
.nav > li > a:hover, .nav > li > a:focus { color:#333; }
.nav > li.active > a, .nav > li.active > a:hover, .nav > li.active > a:focus { color:#333; }

.nav > li > a,
#jugs > div,
#posics > div,
#puntos > div,
.partido,
.pronos .resultado,
.puntpar { border-width:1px; border-style:solid; }


#fases { position:relative; height:35px; display:flex; justify-content:center; }
#fases ul { position:absolute; bottom:0px; }

#partidos { position:relative; padding-top:5px; height:80px; }
#partidos > div, #pronosticos { width:770px; }

#fases ul { xmargin-left:138px; }
#partidos { margin-left:190px; }

.partido, .pronos > div, #posics, #jugs, #pronosticos, #puntos { float:left; }

.partido { width:92px; font-weight:bold; }
.partido, .puntpar { margin-right:4px; }
.equipo { padding-top:0px; text-transform:uppercase; }
.partido .equipo { height:20px; }
.equipo { padding-left:38px; background-position:4px 3px; background-repeat:no-repeat; }
.equipo0 { padding-left:0px; text-align:center; }
.marcador { position:relative; }
.partido .marcador { border-top-width:1px; border-top-style:solid;
                     border-bottom-width:1px; border-bottom-style:solid; }
.tiempo { position:absolute; left:4px; top:7px; font-size:0.8em; }
.tiempo > div { font-size:0.7em; }
.tiempolim { position:absolute; right:4px; top:5px; font-size:0.8em; }
.simu { position:absolute; right:4px; top:5px; font-size:0.8em; }
.resultado { text-align:center; }
.partido .resultado { padding:2px 0px 2px 20px; font-size:1.2em; }
.resultado > .r { width:20px; }
.resultado > .r1 { padding-right:4px; text-align:right; }
.resultado > .r2 { padding-left:4px; text-align:left; }
#fprono input { display:inline-block; width:44px; text-align:center; }

#porra { position:absolute; top:116px; bottom:0px; font-weight:bold; overflow:auto; }

.fparts, .pronos { overflow:hidden; }
.pronos .resultado { margin-right:2px; width:60px; }

.puntpar { width:30px; text-align:center; }

#posics, #jugs, #puntos { margin-right:4px; }
#posics { width:30px; }
#posics > div, #puntos > div { text-align:center; }

#jugs { width:100px; }
#jugs > div, #posics > div, #puntos > div, .pronos > div { margin-bottom:2px; padding:3px; }

.nav > li > a { padding-top:4px; padding-bottom:4px; font-weight:bold; }

#puntos { width:48px; }
#puntos span { color:#444; font-size:0.8em; }

.btnProno { color:#000; }
.btnProno:hover { color:green; }

#jugs,
.pronosf,
#puntos { position:relative; min-height:1px; }
#jugs > div,
.pronosf > div,
#puntos > div { width:100%; }

.equipo,
.nav > li > a,
.partido,
#posics > div,
#jugs > div,
#puntos > div,
.pronos .resultado,
.puntpar,
.nav > li.active > a, .nav > li.active > a:hover, .nav > li.active > a:focus { border-color:#3366cc; }
  
.nav > li > a {
border-color:#fff;
background: -moz-linear-gradient(-45deg,  rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 55%, rgba(255,255,255,0) 60%, rgba(255,255,255,0) 70%, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 90%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,1) 55%,rgba(255,255,255,0) 60%,rgba(255,255,255,0) 70%,rgba(255,255,255,1) 80%,rgba(255,255,255,0) 90%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,1) 55%,rgba(255,255,255,0) 60%,rgba(255,255,255,0) 70%,rgba(255,255,255,1) 80%,rgba(255,255,255,0) 90%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.partido,
#posics > div,
#jugs > div,
#puntos > div,
.pronos .resultado,
.puntpar { border-radius:4px;
background: rgb(145,191,234); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(145,191,234,1) 0%, rgba(84,163,238,1) 75%, rgba(54,144,240,1) 76%, rgba(145,191,234,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(145,191,234,1) 0%,rgba(84,163,238,1) 75%,rgba(54,144,240,1) 76%,rgba(145,191,234,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(145,191,234,1) 0%,rgba(84,163,238,1) 75%,rgba(54,144,240,1) 76%,rgba(145,191,234,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#91bfea', endColorstr='#91bfea',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.pronos .oculto,
#puntos > div.oculto { border-color:#fff;
background: -moz-linear-gradient(-45deg,  rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 55%, rgba(255,255,255,0) 60%, rgba(255,255,255,0) 70%, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 90%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,1) 55%,rgba(255,255,255,0) 60%,rgba(255,255,255,0) 70%,rgba(255,255,255,1) 80%,rgba(255,255,255,0) 90%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,1) 55%,rgba(255,255,255,0) 60%,rgba(255,255,255,0) 70%,rgba(255,255,255,1) 80%,rgba(255,255,255,0) 90%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.nav > li.atencion > a { border-color:#fff;
background: rgb(206,178,255); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(206,178,255,1) 0%, rgba(165,130,229,1) 75%, rgba(136,83,237,1) 76%, rgba(206,178,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(206,178,255,1) 0%,rgba(165,130,229,1) 75%,rgba(136,83,237,1) 76%,rgba(206,178,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(206,178,255,1) 0%,rgba(165,130,229,1) 75%,rgba(136,83,237,1) 76%,rgba(206,178,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ceb2ff', endColorstr='#ceb2ff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.nav > li.active > a, .nav > li.active > a:hover, .nav > li.active > a:focus,
#jugs .yo,
#puntos .yo,
.pronos .yo {
background: rgb(55,198,242); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(55,198,242,1) 0%, rgba(53,135,234,1) 75%, rgba(27,123,226,1) 76%, rgba(55,198,242,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(55,198,242,1) 0%,rgba(53,135,234,1) 75%,rgba(27,123,226,1) 76%,rgba(55,198,242,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(55,198,242,1) 0%,rgba(53,135,234,1) 75%,rgba(27,123,226,1) 76%,rgba(55,198,242,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#37c6f2', endColorstr='#37c6f2',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.partido.atencion { border-color:#fff;
background: rgb(206,178,255); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(206,178,255,1) 0%, rgba(165,130,229,1) 75%, rgba(136,83,237,1) 76%, rgba(206,178,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(206,178,255,1) 0%,rgba(165,130,229,1) 75%,rgba(136,83,237,1) 76%,rgba(206,178,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(206,178,255,1) 0%,rgba(165,130,229,1) 75%,rgba(136,83,237,1) 76%,rgba(206,178,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ceb2ff', endColorstr='#ceb2ff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.pronos .atencion,
#puntos > div.atencion { border-color:#fff;
background: rgb(206,178,255); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(206,178,255,1) 50%, rgba(255,255,255,1) 55%, rgba(206,178,255,1) 60%, rgba(206,178,255,1) 70%, rgba(255,255,255,1) 80%, rgba(206,178,255,1) 90%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(206,178,255,1) 50%,rgba(255,255,255,1) 55%,rgba(206,178,255,1) 60%,rgba(206,178,255,1) 70%,rgba(255,255,255,1) 80%,rgba(206,178,255,1) 90%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(206,178,255,1) 50%,rgba(255,255,255,1) 55%,rgba(206,178,255,1) 60%,rgba(206,178,255,1) 70%,rgba(255,255,255,1) 80%,rgba(206,178,255,1) 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ceb2ff', endColorstr='#ceb2ff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.yoyo {
position: -webkit-sticky;
position: sticky;
top: 0;
bottom: 0;
z-index: 10;
}