/* Live */ 
.live{
	.colLeftLive{
		position: relative;
		top: 38px;
		margin-bottom: 22px;
		.boxField{
			position: relative;
			margin: 50px 20px;
			z-index: 0;
			.boxIncidences{
				position: absolute;
				width: 62%;
				min-height: 60%;
				top: 12px;
				left: 0;
				right: 0;
				margin: 0 auto;
				.iconsheet(); 
				background-color: #000000;
				background:url('../images/ico_brillo_vivo.png') no-repeat scroll top right #000000;
				box-shadow: 0 0px 10px 0px #000000;
				.progressRadial{
				  	position: relative;
				  	width: 22%;
				  	height: 70%;
				  	border-radius: 50%;
				  	background-color: #3E3E40;
				  	display: inline-block;
				  	margin: 5% 5% 0;
				  	.overlay{
						position: absolute;
						width: 76%;
						height: 76%;
						background-color:#000;
						border-radius: 50%;
						top: 12%;
						left: 0;
						right: 0;
						margin: 0 auto;
						text-align: center;
						padding-top: 22%;
					}
					&:after{
						content: "";
						width: 0;
						height: 0;
						border-left: 7px solid transparent;
						border-right: 7px solid transparent;
						border-top: 13px solid @referenceColor01;
						position: absolute;
						top: -15%;
						left: 0;
						right: 0;
						margin: 0 auto;
					}
			  	}
			  	span{
			  		display: inline-block;
					vertical-align: top;
					font-weight: bold;
					text-transform: uppercase;
					color: #FFFFFF;
					font-size: 16px;
					margin-top: 10%;
					width: 60%;
			  	}
			  	.fRight{
		  			float: right;
		  		}
		  		&.times{
		  			height: 54%;
		  		}
			  	&.endFirstHalf{
			  		.progressRadial{
			  			background-image: linear-gradient(-90deg, @referenceColor01 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0)), linear-gradient(270deg, @referenceColor01 50%, #3E3E40 50%, #3E3E40);
			  			margin-top: 3%;
			  			&:after{
			  				border-left: 7px solid transparent;
							border-right: 7px solid transparent;
							border-bottom: 13px solid #90e24a;
							border-top:none;
							top:100%;
			  			}
			  		}
			  	}
			  	&.secondHalf{
			  		.progressRadial{
			  			background-image: linear-gradient(-90deg, @referenceColor01 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0)), linear-gradient(270deg, @referenceColor01 50%, #3E3E40 50%, #3E3E40);
			  			margin-top: 3%;
			  			&:after{
			  				border-left: 7px solid transparent;
							border-right: 7px solid transparent;
							border-bottom: 13px solid #90e24a;
							border-top:none;
							top:100%;
			  			}
			  		}
			  		span{
			  			margin-left: 5%;
			  			width: 65%;
			  		}
			  	}
			  	&.endGame{
			  		.progressRadial{
			  			background-image: linear-gradient(-90deg, @referenceColor01 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0)), linear-gradient(270deg, @referenceColor01 100%, #3E3E40 50%, #3E3E40);
			  		}
			  	}
			  	&.changes{
			  		.timePosition{
			  			font-size: 18px;
			  			font-family: @type_Special;
			  			color: #FFFFFF;
			  			text-align: center;
			  			padding: 5px 0 0;
			  		}
			  		.iconsPosition{
			  			position: absolute;
			  			left: 0;
			  			right: 0;
			  			margin: 0 auto;
			  			width: 40%;
			  			text-align: center;
			  		}
			  		.shieldPosition{
			  			position: absolute;
			  			left: 0;
			  			right: 0;
			  			margin: 0 auto;
			  			width: 33px;
			  			text-align: center;
			  		}
			  	}
			  	&.liveComments{
			  		.fanIco{
			  			.iconsheet(); 
					   	background-position: -436px -115px; 
				   		width: 93px;
				   		height: 108px;
					   	display: block;
			  			margin-top: -5%;
			  			position: absolute;
			  			right: 0;
			  		}
			  		.fansIco{
			  			.iconsheet(); 
					   	background-position: -442px -223px; 
				   		width: 210px;
				   		height: 88px;
					   	display: block;
			  			margin-top: -5%;
			  			position: absolute;
			  			right: 0;
			  		}
			  		.celebrate{
			  			background:url('../images/ico_papeles_vivo.png') no-repeat scroll top right;
			  			width: 100%;
			  			height: 181px;
						position: absolute;
						top: -34%;
						left: 0;
			  		}
			  		.icon{
			  			display: inline-block;
			  			float: left;
			  			width: 30%;
			  			padding-top: 4%;
			  		}
			  		.title{
		  				margin-top: 2%; 
		  				display: block;
		  				width: 100%;
		  			}
			  		&.cards{
			  			.icon{
			  				margin-top: -2%;
			  				padding-top: 0;
			  			}
			  		}
			  	}
			  	.icons{
					.iconsheet(); 
					display: inline-block;
					&.iWhistle{
						background-position: -580px -75px; 
						width: 33px;
						height: 20px;
						margin-top: 8%;
					}
	  				&.in{
	  					background-position: -360px -118px;
	  					float: left;
	  					width: 30px;
	  					height: 39px;
	  					margin-top: 0;
	  				}
	  				&.out{
	  					background-position: -403px -118px; 
	  					float: right;
	  					width: 30px;
	  					height: 39px;
	  					margin-top: 0;
	  				}
	  				&.corner{
	  					background-position: -326px -306px;
						width: 95px;
						height: 89px;
	  				}
	  				&.goalKick{
	  					background-position: -668px -225px;
						width: 80px;
						height: 90px;
	  				}
	  				&.freeKick{
	  					background-position: -434px -304px;
						width: 100px;
						height: 90px;
	  				}
	  				&.flag{
	  					background-position: -547px -324px; 
						width: 100px;
						height: 80px;
	  				}
	  				&.goal{
	  					background-position: -800px -120px; 
						width: 95px;
						height:90px;
	  				}
	  				&.yellowCard{
	  					background-position: -10px -345px;
						width:95px;
						height: 119px;
	  				}
	  				&.redCard{
	  					background-position: -110px -345px;
						width:95px;
						height: 119px;
	  				}
	  				&.redDblYellow{
	  					background-position: -220px -345px;
						width:95px;
						height: 119px;
	  				}
				}
			}
			.dataIncidences{
	  			display: block;
			    left: 18%;
			    margin: 0 auto;
			    position: absolute;
			    right: 0;
			    top: 32%;
			    width: 42%;
			    color: #FFFFFF;
	  			.time{
	  				display: inline-block;
	  				float: left;
	  				margin-right: 4%;
	  				font-family: @type_Special;
	  				font-size: 16px;
	  				span{
	  					display: block;
	  					margin-top: 0;
	  				}
	  			}
	  			.team{
	  				display: inline-block;
	  				float: left;
	  				margin-right: 4%;
	  			}
	  			.text{
	  				text-transform: none; 
	  				font-weight: normal; 
	  				width:auto;
					margin: 0;
					display: block;
					font-size: 14px;
	  			}
  				&.textGoal{
  					left: 14%;
  					width: 50%;
  					span{
  						text-shadow: 0px 0px 30px @referenceColor01;
	  					margin-top: 0;
	  					font-size: 30px;
						width: auto;
  					}
  				}
  				&.textTimes{
  					left: 18%;
  					width: 43%;
  					span{
	  					font-weight: bold;
						text-transform: uppercase;
						color: #FFFFFF;
						font-size: 20px;
  					}
  				}
  				&.rightPosition{
  					right: 30%;
  					width: 43%;
  				}
  				&.playersPosition{
  					left: 0;
  					width: 60%;
  					top: 23%;
  					.colLeft, .colRight{
  						width: 30%;
  						text-align: center;
  						.circle{
  							display: block;
  							float: none;
  							margin: 0 auto;
  						}
  						.name{
			  				text-transform: uppercase;
							margin: 0;
							font-size: 12px;
							font-weight: normal;
			  			}
  					}
  					.colLeft{
  						float: left;
  					}
  					.colRight{
  						float: right;
  					}
		  		}
	  		}
	  		.closeBox{
  				-ms-transform: rotate(45deg);
	            -webkit-transform: rotate(45deg);
	            -moz-transform: rotate(45deg);
	            -o-transform: rotate(45deg);
	            transform: rotate(45deg);
	            width: 20px;
	            text-align: center;
	            font-weight: normal;
	            font-size: 32px;
	            top: 50%;
			    cursor: pointer;
			    left: 0;
			    margin: 0 auto;
			    position: absolute;
			    right: 0;
			    color: #FFFFFF;
  			}
		}
	}
	.colRightLive{
		.boxContainer{
			width: 95%;
			margin: 20px auto;
			height: 400px;
			border: 1px solid darken(@bg,20%);
			border-top: 0;
			box-shadow: 0px 5px 9px -2px lighten(@color02, 50%);
			.innerContent{
				overflow-y: auto;
				overflow-x: hidden;
				height: 370px;
				.commentary.maxSize-479{
					.lines{
						width: 100%;
					}
					.teams {
						.container{
							width: 22%;
						}
					}
					.position-circle{
						.time{
							display: block !important;
						}
					}
				}
			}
			&.owl-carousel {
				.owl-wrapper-outer{
					height: 360px;
				}
			}
			.teamComparison{
				>.content{
					overflow: auto;
    				height:360px;
    				.blockCards{
    					.colLeft, .colRight{
    						text-align: center;
    						.onLive{
    							width: 100%;
    							.position{
	    							width: 100%;
	    							img{
	    								float: none;
	    								display: inline-block;
	    							}
	    							.circle{
										margin:0;
										display: inline-block;
	    							}
	    						}
    						}
    						
    					}
    				}
    				.blockShots {
    					.content {
    						.colLeft, .colRight {
    							.total{
    								width: 100%;
    							}
    							.onLive{
    								width: 100%;
    							}
    						}
							.onLiveTooltip{
								display: block !important;
							}
    					}
    				}
    				.blockPasses {
    					.content {
    						.onLive{
	    						display: block !important;
	    						width: 100%;
	    					}
    						.teamComparison{
    							.comparing{
    								.bar{
    									width: 70%;
    								}
    							}
    						}
    					}
    				}
				}
			}
			.GC_title{
				font-size: 18px;
			}
		}
		&:after{
			.G_divider;
			left: -1px;
		}
	}
	&.maxSize-991{
		.colLeftLive{
			.boxField{
				.boxIncidences{
				  	span{
						margin-top: 12%;
				  	}
				  	&.changes{
						min-height: 62%;
					}
				}
				.closeBox{
					top: 36%;
				}
			}
		}
	}
	&.maxSize-767{
		.colLeftLive{
			top: 23px;
			.boxField{
				margin: 0 10px;
				.boxIncidences{
					.progressRadial{
						&:after{
							border-left: 5px solid transparent;
							border-right: 5px solid transparent;
							border-top: 11px solid @referenceColor01;
						}
				  	}
				  	span{
						margin-top: 8%;
				  	}
				  	&.endFirstHalf{
				  		.progressRadial{
				  			&:after{
								border-top: none;
								border-bottom: 11px solid @referenceColor01;
				  			}
				  		}
				  	}
				  	&.secondHalf{
				  		.progressRadial{
				  			&:after{
				  				border-left: 5px solid transparent;
								border-right: 5px solid transparent;
								border-bottom: 11px solid #90e24a;
								border-top: 0;
				  			}
				  		}
				  	}
				  	&.changes{
						min-height: 60%;
					}
				}
				.closeBox{
					top: 50%;
				}
			}
		}
		.colRightLive{
			.boxContainer{
				margin-top: 40px;
				.teamComparison{
					.blockPasses {
						.content {
							.onLive{
	    						display: none !important;
	    						width: 100%;
	    					}
							.teamComparison{
								.comparing{
									.bar{
										width: 70%;
									}
								}
							}
							.mobileTablet {
								.colLeft, .colRight{
									.graphic{
										width: 100%;
									}
									.data{
										width: 100%;
										.number{
											width: 60%;
											font-size: 20px;
											margin: 0 auto;
											float: none;
											text-align: left;
										}
										.text{
											width: 60%;
											font-size: 12px;
											display: block;
											margin: 0 auto;
											text-transform: uppercase;
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
	&.maxSize-479{
		.colLeftLive{
			top: 23px;
			.boxField{
				margin: 0 0 50px;
				.boxIncidences{
					.progressRadial{
					  	.overlay{
					  		padding-top: 3%;
						}
						&:after{
							border-left: 3px solid transparent;
							border-right: 3px solid transparent;
							border-top: 5px solid @referenceColor01;
						}
				  	}
				  	&.times{
				  		text-align: center;
				  	}
				  	&.endFirstHalf{
				  		.progressRadial{
				  			.overlay{
						  		padding-top: 3%;
							}
							&:after{
								border-bottom: 5px solid @referenceColor01;
								border-top: none;
							}
				  		}
				  	}
				  	&.secondHalf{
				  		.progressRadial{
				  			&:after{
				  				border-left: 5px solid transparent;
								border-right: 5px solid transparent;
								border-bottom: 11px solid #90e24a;
				  			}
				  			float: none;
				  		}
				  	}
				  	&.endGame{
				  		.progressRadial{
				  			float: none;
				  		}
				  	}
				  	&.liveComments{
				  		.icon{
				  			width: 26%;
				  			padding-top: 3%;
				  			margin-right: 10%;
				  		}
				  		.title{
				  			font-size: 12px;
				  			margin-top: 8%;
				  		}
				  		.fansIco{
				  			height: 65px;
				  			width: 150px;
				  		}
				  		.fanIco{
				  			height: 65px;
				  		}
				  	}
				  	&.changes{
				  		.timePosition{
				  			position: absolute;
			  				left: 6%;
			  				font-size: 14px;
			  				width: 18px;
			  				top: 6%;
				  		}
				  		.shieldPosition{
				  			left: 65%;
				  			top: 10%;
				  		}
				  		.iconsPosition{
				  			top: 8%;
				  			width: 44%;
				  			img{
				  				float: none;
				  			}
				  		}
				  	}
				  	.icons{
						&.iWhistle{
							background-position: -750px -37px;
			    			background-size: 462px auto;
							height: 14px;
						    margin-top: 30%;
						    width: 20px;
						}
						&.corner{
							background-position: -624px -154px; 
			    			background-size: 462px auto;
							height: 50px;
						    width: 50px;
						}
						&.goalKick{
		  					background-position: -796px -112px; 
							background-size: 462px auto;
							width: 40px;
							height: 50px;
		  				}
		  				&.freeKick{
		  					background-position: -676px -154px; 
							background-size: 462px auto;
							width: 50px;
							height: 50px;
		  				}
		  				&.flag{
		  					background-position: -728px -164px; 
							background-size: 462px auto;
							width: 50px;
							height: 40px;
		  				}
		  				&.goal{
		  					background-position: -862px -60px;
							background-size: 462px auto;
							width: 50px;
							height: 50px;
		  				}
		  				&.yellowCard{
		  					background-position: -10px -172px;
							background-size: 462px auto;
							width: 50px;
							height: 55px;
		  				}
		  				&.redCard{
		  					background-position: -60px -172px;
							background-size: 462px auto;
							width: 50px;
							height: 55px;
		  				}
		  				&.redDblYellow{
		  					background-position: -110px -172px;
							background-size: 462px auto;
							width: 50px;
							height: 55px;
		  				}
					}
				}
				.dataIncidences{
				    left: 0%;
				    top: 103%;
				    width: 100%;
				    background: #000000;
				    padding: 5px 22px;
				    &.textGoal{
	  					span{
		  					font-size: 26px;
	  					}
	  				}
	  				&.textTimes{
	  					text-align: center;
	  					span{
	  						font-size: 16px;
	  					}
	  				}
	  				&.playersPosition{
	  					padding: 5px;
	  					.colLeft, .colRight {
	  						width: 44%;
	  						text-align: left;
	  						.circle{
	  							float: left;
	  							width: 28px;
	  							height: 28px;
	  							line-height: 28px;
	  							margin-right: 4%;
	  							font-size: 15px;
	  						}
	  						.name{
	  							text-align: left;
	  							font-size: 11px;
	  						}
	  					}
	  				}
		  		}
		  		.closeBox {
				    top: 103%;
				}
			}
		}
	}
}
   /* Fin Live */