/* FICHERO CON LOS CSS PARA LA APP DEL MOBILE */

/* PARA TODOS LOS DIVS DEL PROFILE */

.div-light {
    border-radius: 15px;
    background-color: #EEEEEE;
    width: 100%;
    /* height: 175px; */
    /*margin-top: 5px;*/
    padding: 5px;
    padding-top: 10px;
}

.div-light-grey {
    border-radius: 15px;
    background-color: #EEEEEE;
    width: 100%;
    /* height: 175px; */
    margin-top: 5px;
    padding: 10px;
}

.div-light-white {
    border-radius: 15px;
    background-color: #FFFFFF;
    width: 100%;
    /* height: 175px; */
    margin-top: 5px;
    padding: 10px;
}

.hidden {

	display: none;

}

.red {

	color: red !important;

} 

/* GRADIENT BUTTONS ECM */

.gradient-buttons {
    background-image: linear-gradient(to bottom, var(--color-gradient-button-pos0), var(--color-gradient-button-pos1) 49%, var(--color-gradient-button-pos2) 51%, var(--color-gradient-button-pos3)) !important;
    background-repeat: repeat-x;
}

.gradient-custom-buttons {
  /*background-image: linear-gradient(to bottom, #84fab0 0%, #8fd3f4 51%, #84fab0 100%);*/
  background-image: linear-gradient(to bottom, #a1c4fd 0%, #c2e9fb 51%, #a1c4fd 100%);
}
.gradient-custom-buttons:hover {
  background-position: right center; /* change the direction of the change here */
}

/* MODAL */

.modal-confirm-margin {
  margin-top:50px;
}

/* jquery gritter */
.gritter-item-wrapper {
  background-image: none !important;
  box-shadow: 0 2px 10px rgba(50, 50, 50, 0.5);
  background: rgba(50, 50, 50, 0.92);
}
.gritter-item-wrapper.gritter-info {
  background: rgba(49, 81, 133, 0.92);
}
.gritter-item-wrapper.gritter-error {
  background: rgba(153, 40, 18, 0.92);
}
.gritter-item-wrapper.gritter-success {
  background: rgba(89, 131, 75, 0.92);
}
.gritter-item-wrapper.gritter-warning {
  background: rgba(190, 112, 31, 0.92);
}
.gritter-item-wrapper.gritter-light {
  background: rgba(245, 245, 245, 0.95);
  border: 1px solid #BBB;
}
.gritter-item-wrapper.gritter-light.gritter-info {
  background: rgba(232, 242, 255, 0.95);
}
.gritter-item-wrapper.gritter-light.gritter-info .gritter-item {
  color: #4A577D;
}
.gritter-item-wrapper.gritter-light.gritter-error {
  background: rgba(255, 235, 235, 0.95);
}
.gritter-item-wrapper.gritter-light.gritter-error .gritter-item {
  color: #894A38;
}
.gritter-item-wrapper.gritter-light.gritter-success {
  background: rgba(239, 250, 227, 0.95);
}
.gritter-item-wrapper.gritter-light.gritter-success .gritter-item {
  color: #416131;
}
.gritter-item-wrapper.gritter-light.gritter-warning {
  background: rgba(252, 248, 227, 0.95);
}
.gritter-item-wrapper.gritter-light.gritter-warning .gritter-item {
  color: #946446;
}
.gritter-item p {
  line-height: 1.8;
}
.gritter-top,
.gritter-bottom,
.gritter-item {
  background-image: none;
}
.gritter-close {
  left: auto;
  right: 3px;
  background-image: none;
  width: 18px;
  height: 18px;
  line-height: 17px;
  text-align: center;
  border: 2px solid transparent;
  border-radius: 16px;
  color: #E17B67;
}
.gritter-close:before {
  font-family: FontAwesome;
  font-size: 16px;
  content: "\f00d";
}
.gritter-info .gritter-close {
  color: #FFA500;
}
.gritter-error .gritter-close,
.gritter-success .gritter-close,
.gritter-warning .gritter-close {
  color: #FFEA07;
}
.gritter-close:hover {
  color: #FFF !important;
}
.gritter-title {
  text-shadow: none;
}
.gritter-light .gritter-item,
.gritter-light .gritter-bottom,
.gritter-light .gritter-top,
.gritter-light .gritter-close {
  background-image: none;
  color: #444;
}
.gritter-light .gritter-title {
  text-shadow: none;
}
.gritter-light .gritter-close:hover {
  color: #8A3104 !important;
}

.gritter-mobile {
  	margin-bottom: 0px;
	position: fixed;
	bottom: 0px;
	left: -5%;
	width: 100%;
	height: 100%;
}

.gritter-center {
  position: fixed;
  left: 33%;
  right: 33%;
  top: 33%;
}
@media only screen and (max-width: 767px) {
  .gritter-center {
    left: 16%;
    right: 16%;
    top: 30%;
  }
}
@media only screen and (max-width: 480px) {
  .gritter-center {
    left: 30px;
    right: 30px;
  }
}
@media only screen and (max-width: 320px) {
  .gritter-center {
    left: 10px;
    right: 10px;
  }
}

/* ESTILOS DE CUADROS */

.hide {
	display: none;
}

.estat {
	background-color: #AAAAAA !important;
}

.peque {
	font-size: 80%;	
}

.estat100 {
	background-color: var(--color-gradient-button-pos1) !important;
	color: var(--color-fuente-cuadros) !important;
}

.ronda {
	margin-top: 8px;
	width: 30px;
	height: 30px;
	border-radius: 15px;
	border: 1px solid #000000;
	font-size: 20px;
	text-align: center;
}

.headerJugadors>div {
	font-weight: bold;
	font-size: 15px;
}

.partit {
	padding-top:4%;
	
	position: relative;
	width: 95%;
	height: 80px;
	border: 2px solid var(--color-gradient-button-pos1);
	border-radius: 5px;
	margin-left: 5%;
	text-align: center;
	font-size: 12px;
	background-color: var(--color-zebra-tablas);
	cursor: pointer;
	color:  var(--color-fuente-cuadros);
}

.espaiInicial {
	/*height: 20px;*/
}

.accions {
	height: 40px;
}

.col-4, .col-3, .col-2 {
	padding: 0px;
}

.cabeceraDiv {
	text-align: center;
	height: 30px;
	margin-bottom: 10px;
	padding-top: 4px;
}

.accionsInternes {
	height: 40px;
}

/* DRAG AND DROP */
.ui-draggable-dragging {
   background-color: grey !important;
}

.hoverClass {
  border: 2px solid red;
  background-color: yellow !important;
}

.dropdown-menu {
	padding: 5px;
}

/*
* ESTILS QUADRE
*/
.espaiDown33, .espaiDown44, .espaiDown55, .espaiDown66 {
	margin-bottom: 10px;
}
.bordeSupInicial21, .bordeSupInicial32, .bordeSupInicial43, .bordeSupInicial54, .bordeSupInicial65 {
	height: 20px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup21, .bordeSup32, .bordeSup43, .bordeSup54, .bordeSup65 {
	height: 20px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.accionsInternes21, .accionsInternes32, .accionsInternes43, .accionsInternes54, .accionsInternes65 {
	margin-top: 40px;
}
.bordeInf21, .bordeInf32, .bordeInf43, .bordeInf54, .bordeInfDown21, .bordeInfDown32, .bordeInfDown43, .bordeInfDown54 {
	margin-top: 30px; height : 20px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}

.bordeInf65 {
	margin-top: 15px; height : 35px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}

.bordeInfDown65 {
	margin-top: 30px; height : 37px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}

.espaiDown65 {
	height: 160px;
}
.bordeInfDown65 { /*RETOQUE PARA QUE QUEDE BIEN*/
	margin-top: 78px;
}

.accionsInternes62 {
	margin-top: 435px;
}

.accionsInternes61 {
	margin-top: 910px;
}

.espaiDown21 .bordeInf21, .espaiDown32 .bordeInf32, .espaiDown43 .bordeInf43, .espaiDown54 .bordeInf54, .bordeInfDown21, .bordeInfDown32, .bordeInfDown43, .bordeInfDown54 { /*RETOQUE PARA QUE QUEDE BIEN*/
	margin-top: 96px;
}
.espaiInicial21, .espaiInicial32, .espaiInicial43, .espaiInicial54, .espaiInicial65 {
	margin-top: 40px;
}
.espaiDown21, .espaiDown32, .espaiDown43, .espaiDown54 {
	height: 160px;
}
.accions21, .accions32, .accions43, .accions54, .accions65 {
	height: 150px;
}

.bordeSupInicial20, .bordeSupInicial31, .bordeSupInicial42, .bordeSupInicial53, .bordeSupInicial64 {
	height: 80px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup20, .bordeSup31, .bordeSup42, .bordeSup53, .bordeSup64 {
	height: 80px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.accionsInternes20, .accionsInternes31, .accionsInternes42, .accionsInternes53, .accionsInternes64 {
	margin-top: 110px;
}
.bordeInf20, .bordeInf31, .bordeInf42, .bordeInf53, .bordeInf64 {
	margin-top: 80px; height: 80px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInfDown20, .bordeInfDown31, .bordeInfDown42, .bordeInfDown53, .bordeInfDown64 {
	margin-top: 210px; height: 80px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.espaiInicial20, .espaiInicial31, .espaiInicial42, .espaiInicial53, .espaiInicial64 {
	margin-top: 95px;
}
.espaiDown20, .espaiDown31, .espaiDown42, .espaiDown53, .espaiDown64 {
	/**/
}
.accions20, .accions31, .accions42, .accions53, .accions64 {
	height: 390px;
}

.bordeSupInicial30, .bordeSupInicial41, .bordeSupInicial52, .bordeSupInicial63 {
	height: 195px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup30, .bordeSup41, .bordeSup52, .bordeSup63 {
	height: 195px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.accionsInternes30, .accionsInternes41, .accionsInternes52, .accionsInternes63 {
	margin-top: 220px;
}
.accionsInternes51 {
	margin-top: 400px;
}
.bordeInf30, .bordeInf41, .bordeInf52, .bordeInf63 {
	margin-top: 210px; height: 195px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInfDown30, .bordeInfDown41 {
	margin-top: 210px; height: 195px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInfDown52, .bordeInfDown63 {
	margin-top: 460px; height: 195px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.espaiInicial30, .espaiInicial41, .espaiInicial52, .espaiInicial63 {
	margin-top: 215px;
}
.espaiDown30, .espaiDown41, .espaiDown52 {
	/*margin-bottom: 480px;*/
}

.accions30, .accions41, .accions52, .accions63 {
	height: 860px;
}

/* ADAPTACIONES PARA EL CUADRO DE 32 */

.bordeSupInicial40, .bordeSupInicial51 {
	height: 435px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup40, .bordeSup51 {
	height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.bordeInf40 {
	height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInf51 {
	margin-top: 500px; height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}

.bordeSupInicial50 {
	height: 900px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup50 {
	height: 900px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.bordeInf50 {
	margin-top: 460px; height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}

/* ADAPTACIONES PARA EL CUADRO DE 64 */

/* SEMIFINALES */

.espaiInicial62 {
/* 	margin-bottom: 446px; */
}

.bordeSupInicial62 {
	margin-top: 446px; height: 435px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup62 {
	height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.bordeInf60 {
	margin-top: 446px; height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInf62 {
	margin-top: 470px; height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInfDown62 {
	margin-top: 930px; height : 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSupInicial60 {
	height: 1850px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup60 {
	height: 1850px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.bordeInf60 {
	margin-top: 460px; height: 435px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}

.accions62 {
	height: 1810px;
}

.espaiDown62 {
/* 	margin-top: 446px;  */
}


/* FINALES */

.espaiInicial61 {
	margin-top: 920px;
}

.bordeSupInicial61 {
	margin-top: 446px; height: 900px; width: 50%; 
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeSup61 {
	height: 910px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-bottom: 2px solid var(--color-flecha-cuadro);
}
.bordeInf60 {
	margin-top: 446px; height: 892px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInf61 {
	margin-top: 965px; height: 892px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}
.bordeInfDown61 {
	margin-top: 2750px; height: 950px; width: 50%;
	border-right: 2px solid var(--color-flecha-cuadro); border-top: 2px solid var(--color-flecha-cuadro);
}

.accions61 {
	height: 3700px;
}

.espaiInicial60 {
	margin-top: 1850px;
}

/* ESPACIOS GLOBALES */

.espaiInicial40, .espaiInicial51 {
	margin-top: 450px;
}
.espaiDown40, .espaiDown51 {
	/*margin-bottom: 480px;*/
}
.accions40, .accions60 {
	height: 860px;
}

.espaiInicial50 {
	margin-top: 930px;
}
.espaiDown50 {
	/*margin-bottom: 480px;*/
}

.accions51 {
	height: 1805px;
}


/* EMPARELLAMENTS TIPUS LLISTA */

.jugadors {
	text-align: center;
	font-size: 12px;
}

.ronda {
	margin-top: 8px;
	width: 30px;
	height: 30px;
	border-radius: 15px;
	border: 1px solid #000000;
	font-size: 20px;
	text-align: center;
}

.headerJugadors > div {
	font-weight: bold;
	font-size: 15px;
}

.resultat {
	width: 40px;
	height: 40px;
	border: 1px solid var(--color-flecha-cuadro);
	color: #999999;
	text-align: center;
	vertical-align: middle;
	margin: 5px;
	font-size: 25px;
	border-radius: 5px;
}

span.resultat {
	display: block;
	margin: auto;
	margin-top: 5px;
}

div.data a {
	font-size: 60% !important;
}
