#calculadoraPrimas > div > h2, #calculadoraPrimas ~ div > h2 {text-transform:uppercase;font-size: 2.2rem;line-height: 1.3;text-align:center;padding:2rem 0;font-weight: 300;letter-spacing: 1pt;width: 100%;margin: 0 auto;}

.primasBox {background:#f2f2f2;padding:1%;border-top:0.1rem solid #d7d7d7;/*width: 50%*/;margin: 0 auto;}
.primasBox h3 {text-transform:uppercase;text-align:center;font-weight:500; font-size:1.6rem; line-height:2rem; letter-spacing:3.5px;color:#2b2b2b;padding:1rem;width: 100%;}
.primasBox > div {margin: 3.5% 0;}

/* equipos */
.primasBox .equipoBox {text-align:center;background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 51%, rgba(0,0,0,0) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( 		 startColorstr='#00000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */}
.primasBox .equipoBox li {display:inline-block;cursor: pointer;position:relative;}
.primasBox .equipoBox [name="equipos"] {position: absolute;top: auto;left: 0;bottom: 0;overflow: hidden;height: 100%;width: 100%;transform: scale(0,0);z-index: 2;}
.primasBox .equipoBox [name="equipos"]:checked ~ label {display:block;background: #a9afb6}

/* primas */
.moneyBox {display:table;width:100%;padding:1% 2% 4.5% 2%;border-bottom: 0.1rem solid #d7d7d7;}
.moneyBox .selectCell,.moneyBox .resultCell {display:table-cell;height:25rem}
.moneyBox .selectCell {width:52%;}
.moneyBox .resultCell {width:48%;}

/* colores */
.primasBox .prima {background:#3f2b5c;}
.primasBox .ganado_fases {background:#1b587b;}
.primasBox .empate_fases {background:#007ca2;}
.primasBox .octavos {background:#22c3b4;}
.primasBox .cuartos {background:#64ba95;}
.primasBox .semifin {background:#ffa8a0;}
.primasBox .final {background:#ff0e55;}
.primasBox .victoria {background:#bf162a;}

/* selectores */
.moneyBox .selectCell {text-align:center;padding:0 3% 0 0;}
.moneyBox .selectCell li {width: 25%;height: 6vw;min-height: 10rem;float: left;border: .1rem solid transparent;position: relative;}
.moneyBox .selectCell li strong, .moneyBox .selectCell li span label {display: block;position: absolute;bottom: auto;top: 0;left: 0;width: 100%;text-align: center;font-size: 1.1rem;line-height: 1.8;color: #f5f5f5;z-index: 1;text-transform: uppercase;background: #06244b;}
.moneyBox .selectCell li strong {width: 200%;font-weight: 300;margin:0 0 0 .1rem}
.moneyBox .selectCell li:nth-child(2) span label, .moneyBox .selectCell li:nth-child(3) span label,
.moneyBox .selectCell li:nth-child(7) span label, .moneyBox .selectCell li:nth-child(8) span label {bottom:0;top:auto;text-transform: inherit;background:transparent;font-weight: 700;font-size: 1.2rem;}
.moneyBox .selectCell li span select option {font-size: 1.6rem;line-height: 2rem;color: #f5f5f5;display:block;cursor:pointer}
.moneyBox .selectCell li span select, .moneyBox .selectCell li span input {width: 100%;height: 100%;display: block;opacity:1;appearance:button;-webkit-appearance: button;-moz-appearance: button;border: 0;font-size: 2rem;line-height: 1.2;color: #f5f5f5;cursor:pointer;background-image:url("i/mas.png");background-repeat:no-repeat;background-position: center center;}
/*For IE10+*/
.moneyBox .selectCell li span select::-ms-expand {display: none;}
.moneyBox .selectCell li span input::-ms-check {opacity:0}

/* checked y disabled */
.moneyBox .selectCell li span select {color:transparent; text-align-last: center;text-align: center;-ms-text-align-last: center;-moz-text-align-last: center;}
.moneyBox .selectCell select.item-selected, .moneyBox .selectCell li span input:checked {background-blend-mode: color-burn;color: #f5f5f5;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";}
.moneyBox .selectCell li span input.prima {cursor:default}
.moneyBox .selectCell li span input[disabled="disabled"]:not([checked="checked"]),
.moneyBox .selectCell select[disabled="disabled"] {opacity:.5;cursor:default}

/* resultados */
.moneyBox .resultCell {position:relative;background: #e6e6e6;}
.moneyBox .resultCell h3 {position: absolute;top: 0; z-index: 1;padding: 4%;}
.moneyBox .resultCell h3 strong {display:block}
.moneyBox .resultCell input {position:absolute;top:0;left:0;width:100%;height:100%;min-height:25rem;text-align:center;font-size: 7rem;font-weight: 700;background: #e6e6e6;color: #2b2b2b;box-shadow: inset -0.1rem 0.3rem 0.5rem #a9afb6;border: 0;padding-top:40%;background-image:url("i/cajon.jpg");background-repeat:no-repeat;background-position: center center;}
.moneyBox .resultCell:after {content:'(en mill. €)';display:block;width:100%;font-size:1.6rem;color:#2b2b2b;line-height:2;position:absolute;top:auto;bottom:5%;left:0;text-align:center;font-weight: 300;}

/* leyenda */
.leyendBox {width:100%;padding:0 2.25%;}
.leyendBox h3 {padding-bottom: 4%;}
.leyendBox span {padding:0 1rem;display:inline-block;}
.leyendBox ul {column-count:2;-moz-column-count:2;-webkit-column-count:2;column-gap:4.5%;-moz-column-gap:4.5%;-webkit-column-gap:4.5%;column-gap:4.5%;}
.leyendBox li {font-size:1.6rem;padding-bottom: 3%;color: #2b2b2b; display:block;width:100%}
.leyendBox li span {font-weight:500;text-align:center;min-width:5.2rem;margin-right:5%;color:#f5f5f5;}


@media only screen and (min-width:1128px){
.primasBox .equipoBox li:hover {background: #a9afb6}
.moneyBox .selectCell li span select:focus {border:0;outline:none}
.moneyBox .selectCell li span:hover select:not([disabled="disabled"]):not(.item-selected),
.moneyBox .selectCell li span:hover input:not([disabled="disabled"]):not(:checked) {opacity:.8;}
}

@media only screen and (max-width:1024px) and (orientation:portrait){
body {font-size:0.8em;}
.moneyBox .selectCell li {height: 12vw;}
.moneyBox .selectCell {width:58%}
.moneyBox .resultCell {width:42%}
}

@media only screen and (max-width:900px) and (orientation:portrait){
	.primasBox, .moneyBox .selectCell, .moneyBox .resultCell {width:100%;display:block;}
	.leyendBox ul {column-count:1;-moz-column-count:1;-webkit-column-count:1;}
  .leyendBox li {padding-bottom: 0.5rem;}
  .leyendBox li span {margin-right: 1rem;}
	.moneyBox .resultCell input {padding-top:10%;position: relative;}
	.moneyBox .selectCell, .moneyBox .resultCell {height:30rem;padding:0}
}

@media only screen and (max-width:600px) and (orientation:portrait){
	.moneyBox .selectCell li {width:25%;height: 10rem;}
	.moneyBox .selectCell {height:30rem;}
	.moneyBox .resultCell {height:20rem;}
	.moneyBox .resultCell input {min-height:10rem}
}