/* stylelint-disable property-no-vendor-prefix */
/*
 * Globals
 */
/* Links */
a, a:focus, a:hover {
	color: #333;
  }
  /* Custom default button */
  .btn-default, .btn-default:hover, .btn-default:focus {
	  color: #333;
	  text-shadow: none;
	background-color: #fff;
	border: solid 1px #fff;
  }
  /* Fonts */
  @import url('../fonts/Belleza.ttf') format('truetype');
  /*
   * Base structure
   */
  html, body {
	  height: 100%;
  }
  body {
	  color: #333;
	text-align: center;
  }
  /* Extra markup and styles for table-esque vertical and horizontal centering */
  .site-wrapper {
	display: table;
	width: 100%;
	height: 100%;
	min-height: 100%;
	  border: solid 4px #fff;
	-webkit-box-shadow: inset 0 0 50px rgba(0, 0, 0, .1);
	box-shadow: inset 0 0 50px rgba(0, 0, 0, .1);
	  padding: 40px 0px;
  }
  .site-wrapper-inner {
	display: table-cell;
	vertical-align: top;
  }
  .cover-container {
	margin-right: auto;
	margin-left: auto;
  }
  /* Padding for spacing */
  .inner {
	padding: 10px;
  }
  /*
   * Header
   */
  .masthead-brand {
	margin-top: 10px;
	margin-bottom: 10px;
  }
  .masthead-nav > li {
	display: inline-block;
  }
  /*
   * Cover
   */
  .cover {
	padding: 0px 20px;
  }
  .cover .btn-lg {
	font-weight: 700;
	  padding: 10px 20px;
  }
  /*
   * Footer
   */
  .mastfoot {
	color: #999; /* IE8 proofing */
  }
  .mastfoot p {
	  text-align: center !important;
  }
  /*
   * Affix and center
   */
  @media (min-width: 768px) {
	.mastfoot {
	  position: fixed;
		  right: 0px;
	  bottom: 0px;
		  left: 0px;
	}
	.site-wrapper-inner {
	  vertical-align: middle;
	}
   .mastfoot, .cover-container {
	  width: 100%;
	  }
  }
  @media (min-width: 768px) {
	.mastfoot, .cover-container {
	  width: 100;
	}
  }
  /* Corporate */
  .corporate {
	  color: #003366;
	  background-color: #fff;
	  max-width: 100%;
	  display: inline-block;
	  padding: 15px;
	  margin: 0px auto;
	  list-style: none;
	  border-top: none;
	  -webkit-border-bottom-right-radius: 12px;
	  -webkit-border-bottom-left-radius: 12px;
	  -moz-border-radius-bottomright: 12px;
	  -moz-border-radius-bottomleft: 12px;
	  border-bottom-right-radius: 12px;
	  border-bottom-left-radius: 12px;
  }
  .corporate li {
	  
	  min-height: 50px;
	  display: flex;
	  flex-direction: column;
	  justify-content: center;
  }
  .corporate li:last-child {
	  border: none;
  }
  .corporate h1 {
	  font-family: 'Belleza', sans-serif;
	  font-size: 32px;
	  line-height: 32px;
  }
  .corporate h5 {
	  font-size: 12px;
	  line-height: normal;
  }

.teamA{
	color:#00b048 !important ;
}

.teamB{
	color: #f5983b !important;
}

.status {
	font-size: 18px;
	font-weight: normal;
	color: #003366;
	line-height: normal;
	margin-left: 5px;
	margin-bottom: 5px;
}

h2.status {
	font-size: 20px;
	font-weight: normal;
	color: #000000;
	line-height: normal;
	margin-bottom: 5px;
	
}
  h1.status {
	  font-size: 21px;
	  font-weight: normal;
	  color: #003366;
	  line-height: normal;
	  background-color: #fff;
	  display: inline-block;
	  padding: 10px 15px;
	  margin: 0px auto 20px;
	  text-shadow: 1px 1px 1px rgba(255,255,255,1);
	  -webkit-border-radius: 18px;
	  -moz-border-radius: 18px;
	  border-radius: 19px;
	  margin-bottom: 5px;
  }
  h1.status span.brand {
	  font-family: 'Belleza', sans-serif !important;
	  font-size: 105%;
	  font-weight: bold;
  }
  /* Forms */
  .forms {
	  margin-top: 200px;
  }
  form label {
	  color: #003366;
  }
  /* Circle */
  .scoreboard {
	  display: flex;
	  flex-direction: column;
	  padding: 0px;
	  margin: 40px;
  }
  .scoreboard li {
	  display: inline-block;
	  
  }
  .scoreboard li {
	  font-size: 32px;
	  font-weight: bold;
	  color: #333;
	  line-height: 32px;
	  background-color: #fff;
	  padding: 5px 15px;
	  margin: 5px 5px;
	  -webkit-transition: all 200ms linear;
	  -moz-transition: all 200ms linear;
	  -o-transition: all 200ms linear;
	  -ms-transition: all 200ms linear;
	  transition: all 200ms linear;
	  border: solid 4px #999;
	  -webkit-border-radius: 12px;
	  -moz-border-radius: 12px;
	  border-radius: 12px;
	  outline: none;
  }
  .scoreboard li .hw-acierto {
	  color: #00b048;
  }
  .scoreboard li .hw-fallo {
	  color: #b61000;
  }
  .scoreboard li:last-child {
	  color: #fff;
	  background: rgb(51,51,51);
	  background: linear-gradient(0deg, rgba(51,51,51,1) 0%, rgba(85,85,85,1) 100%);
  }

  @media (min-width: 768px) {
	.scoreboard {
		display: block;
		padding: 0px;
		margin: 20px auto;
	}
	.scoreboard li {
		display: inline-block;
	}
	.scoreboard li {
		font-size: 32px;
		font-weight: bold;
		color: #333;
		line-height: 32px;
		background-color: #fff;
		padding: 5px 15px;
		margin: 0px 5px;
		-webkit-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
		-o-transition: all 200ms linear;
		-ms-transition: all 200ms linear;
		transition: all 200ms linear;
		border: solid 4px #999;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px;
		outline: none;
	}
	.scoreboard li .hw-acierto {
		color: #00b048;
	}
	.scoreboard li .hw-fallo {
		color: #b61000;
	}
	.scoreboard li:last-child {
		color: #fff;
		background: rgb(51,51,51);
		background: linear-gradient(0deg, rgba(51,51,51,1) 0%, rgba(85,85,85,1) 100%);
	}
}
  .circle-container {
	  width: 100%;
  }
  @media (min-width: 768px) {
	  .circle-container {
		  width: 100%;
		  height: 100%;
		  padding-top: 0px;
		  position: relative;
	  }
	  
  }
  .title-container {
	width: 75%!important;
    margin-top: 120px!important;
    margin-left: -200px!important;
    margin-right: 5px!important;
    z-index: 9!important;
  }

  .title-container h2 {
	  font-size: 30px!important;
	  line-height: 30px!important;
	  text-align: center!important;
	  font-weight: bold!important;
	  word-break: break-all!important;
	  font-family: 'Belleza', sans-serif!important;
  }
  .circle {
	width: 35em;
	height: 35em;
	border-radius: 50%;
	padding: 0px;
	  margin: 0px auto;
	list-style: none;
	  position: relative;
  }
  .circle > * {
	  display: block;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  width: 1.5em;
	  height: 1.5em;
	  margin: -1.25em;
  }
  .circle > *:nth-of-type(1) {
	transform: rotate(270deg) translate(11em) rotate(-270deg);
}
.circle > *:nth-of-type(2) {
	transform: rotate(283.3deg) translate(11em) rotate(-283.3deg);
}
.circle > *:nth-of-type(3) {
	transform: rotate(296.6deg) translate(11em) rotate(-296.6deg);
}
.circle > *:nth-of-type(4) {
	transform: rotate(309.9deg) translate(11em) rotate(-309.9deg);
}
.circle > *:nth-of-type(5) {
	transform: rotate(323.2deg) translate(11em) rotate(-323.2deg);
}
.circle > *:nth-of-type(6) {
	transform: rotate(336.5deg) translate(11em) rotate(-336.5deg);
}
.circle > *:nth-of-type(7) {
	transform: rotate(349.8deg) translate(11em) rotate(-349.8deg);
}
.circle > *:nth-of-type(8) {
	transform: rotate(363.1deg) translate(11em) rotate(-363.1deg);
}
.circle > *:nth-of-type(9) {
	transform: rotate(376.4deg) translate(11em) rotate(-376.4deg);
}
.circle > *:nth-of-type(10) {
	transform: rotate(389.7deg) translate(11em) rotate(-389.7deg);
}
.circle > *:nth-of-type(11) {
	transform: rotate(403deg) translate(11em) rotate(-403deg);
}
.circle > *:nth-of-type(12) {
	transform: rotate(416.3deg) translate(11em) rotate(-416.3deg);
}
.circle > *:nth-of-type(13) {
	transform: rotate(429.6deg) translate(11em) rotate(-429.6deg);
}
.circle > *:nth-of-type(14) {
	transform: rotate(442.9deg) translate(11em) rotate(-442.9deg);
}
.circle > *:nth-of-type(15) {
	transform: rotate(456.2deg) translate(11em) rotate(-456.2deg);
}
.circle > *:nth-of-type(16) {
	transform: rotate(469.5deg) translate(11em) rotate(-469.5deg);
}
.circle > *:nth-of-type(17) {
	transform: rotate(482.8deg) translate(11em) rotate(-482.8deg);
}
.circle > *:nth-of-type(18) {
	transform: rotate(496.1deg) translate(11em) rotate(-496.1deg);
}
.circle > *:nth-of-type(19) {
	transform: rotate(509.4deg) translate(11em) rotate(-509.4deg);
}
.circle > *:nth-of-type(20) {
	transform: rotate(522.7deg) translate(11em) rotate(-522.7deg);
}
.circle > *:nth-of-type(21) {
	transform: rotate(536deg) translate(11em) rotate(-536deg);
}
.circle > *:nth-of-type(22) {
	transform: rotate(549.3deg) translate(11em) rotate(-549.3deg);
}
.circle > *:nth-of-type(23) {
	transform: rotate(562.6deg) translate(11em) rotate(-562.6deg);
}
.circle > *:nth-of-type(24) {
	transform: rotate(575.9deg) translate(11em) rotate(-575.9deg);
}
.circle > *:nth-of-type(25) {
	transform: rotate(589.2deg) translate(11em) rotate(-589.2deg);
}
.circle > *:nth-of-type(26) {
  transform: rotate(602.5deg) translate(11em) rotate(-602.5deg);
}
.circle > *:nth-of-type(27) {
  transform: rotate(615.8deg) translate(11em) rotate(-615.8deg);
}
 
  @media (min-width: 768px) {
	  .circle {
		  background-color: #fff;
		  width: 40em;
		  height: 40em;
		  position: relative;
		  -webkit-border-radius: 50%;
		  -moz-border-radius: 50%;
		  border-radius: 50%;
		  padding: 0px;
		  list-style: none;
		  margin: 0px auto !important;
		  -webkit-box-shadow: 0px 0px 4px 0px rgba(51,51,51,0.05);
		  -moz-box-shadow: 0px 0px 4px 0px rgba(51,51,51,0.05);
		  box-shadow: 0px 0px 4px 0px rgba(51,51,51,0.05);
	  }
	  .circle.actived {
		  -webkit-box-shadow: 0px 0px 12px 0px rgba(51,51,51,0.5);
		  -moz-box-shadow: 0px 0px 12px 0px rgba(51,51,51,0.5);
		  box-shadow: 0px 0px 12px 0px rgba(51,51,51,0.5);
	  }
	  .circle > * {
		  display: block;
		  position: absolute;
		  top: 50%;
		  left: 50%;
		  width: 2.5em;
		  height: 2.5em;
		  margin: -1.25em;
	  }
	  .circle > *:nth-of-type(1) {
		  transform: rotate(270deg) translate(11em) rotate(-270deg);
	  }
	  .circle > *:nth-of-type(2) {
		  transform: rotate(283.3deg) translate(11em) rotate(-283.3deg);
	  }
	.circle > *:nth-of-type(3) {
		  transform: rotate(296.6deg) translate(11em) rotate(-296.6deg);
	  }
	  .circle > *:nth-of-type(4) {
		  transform: rotate(309.9deg) translate(11em) rotate(-309.9deg);
	  }
	  .circle > *:nth-of-type(5) {
		  transform: rotate(323.2deg) translate(11em) rotate(-323.2deg);
	  }
	  .circle > *:nth-of-type(6) {
		  transform: rotate(336.5deg) translate(11em) rotate(-336.5deg);
	  }
	  .circle > *:nth-of-type(7) {
		  transform: rotate(349.8deg) translate(11em) rotate(-349.8deg);
	  }
	  .circle > *:nth-of-type(8) {
		  transform: rotate(363.1deg) translate(11em) rotate(-363.1deg);
	  }
	  .circle > *:nth-of-type(9) {
		  transform: rotate(376.4deg) translate(11em) rotate(-376.4deg);
	  }
	  .circle > *:nth-of-type(10) {
		  transform: rotate(389.7deg) translate(11em) rotate(-389.7deg);
	  }
	  .circle > *:nth-of-type(11) {
		  transform: rotate(403deg) translate(11em) rotate(-403deg);
	  }
	  .circle > *:nth-of-type(12) {
		  transform: rotate(416.3deg) translate(11em) rotate(-416.3deg);
	  }
	  .circle > *:nth-of-type(13) {
		  transform: rotate(429.6deg) translate(11em) rotate(-429.6deg);
	  }
	  .circle > *:nth-of-type(14) {
		  transform: rotate(442.9deg) translate(11em) rotate(-442.9deg);
	  }
	  .circle > *:nth-of-type(15) {
		  transform: rotate(456.2deg) translate(11em) rotate(-456.2deg);
	  }
	  .circle > *:nth-of-type(16) {
		  transform: rotate(469.5deg) translate(11em) rotate(-469.5deg);
	  }
	  .circle > *:nth-of-type(17) {
		  transform: rotate(482.8deg) translate(11em) rotate(-482.8deg);
	  }
	  .circle > *:nth-of-type(18) {
		  transform: rotate(496.1deg) translate(11em) rotate(-496.1deg);
	  }
	  .circle > *:nth-of-type(19) {
		  transform: rotate(509.4deg) translate(11em) rotate(-509.4deg);
	  }
	  .circle > *:nth-of-type(20) {
		  transform: rotate(522.7deg) translate(11em) rotate(-522.7deg);
	  }
	  .circle > *:nth-of-type(21) {
		  transform: rotate(536deg) translate(11em) rotate(-536deg);
	  }
	  .circle > *:nth-of-type(22) {
		  transform: rotate(549.3deg) translate(11em) rotate(-549.3deg);
	  }
	  .circle > *:nth-of-type(23) {
		  transform: rotate(562.6deg) translate(11em) rotate(-562.6deg);
	  }
	  .circle > *:nth-of-type(24) {
		  transform: rotate(575.9deg) translate(11em) rotate(-575.9deg);
	  }
	  .circle > *:nth-of-type(25) {
		  transform: rotate(589.2deg) translate(11em) rotate(-589.2deg);
	  }
	  .circle > *:nth-of-type(26) {
		transform: rotate(602.5deg) translate(11em) rotate(-602.5deg);
	  }
	  .circle > *:nth-of-type(27) {
		transform: rotate(615.8deg) translate(11em) rotate(-615.8deg);
	  }

	  .circle .item {
		font-size: 1.5em !important;
	  }
  }
  .circle .item {
	  font-family: Arial, Helvetica, sans-serif !important;
	  font-size: 1em;
	  color: #fff;
	  line-height: 2.25em;
	  text-align: center;
	  text-decoration: none;
	  display: block;
	  width: 2.5em;
	  height: 2.5em;
	  border: solid 3px #fff;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  border-radius: 50%;
	  background-image: radial-gradient(circle, #00a7ce, #0055bd);
	  text-shadow: 2px 2px 4px rgba(0,85,189,1);
	  cursor: default;
	  transition: all .3s ease-in-out;
	  -webkit-box-shadow: 0px 0px 8px 0px rgba(51,51,51,0.25);
	  -moz-box-shadow: 0px 0px 8px 0px rgba(51,51,51,0.25);
	  box-shadow: 0px 0px 8px 0px rgba(51,51,51,0.25);
  }
  .circle .item--success {
	  background-image: radial-gradient(circle, #67d428, #00b048);
	  text-shadow: 2px 2px 4px rgba(0,176,72,1);
  }
  .circle .item--failure {
	  background-image: radial-gradient(circle, #ff3f02, #b61000);
	  text-shadow: 2px 2px 4px rgba(182,16,0,1);
  }
  .circle .item--current{
	  background-image: radial-gradient(circle, #ffc200, #ff8105);
	  text-shadow: 2px 2px 4px rgba(255,129,0,1);
  }
  .controls {
	  margin: 20px auto;
  }
  .controls .btn, .letter .btn {
	  font-size: 14px;
	  -webkit-transition: all 200ms linear;
	  -moz-transition: all 200ms linear;
	  -o-transition: all 200ms linear;
	  -ms-transition: all 200ms linear;
	  transition: all 200ms linear;
  }

  @media (min-width: 768px) {
	.controls .btn, .letter .btn {
		font-size: 24px !important;
		
	}
  }
  .letter .btn {
	  color: #fff;
	  background: rgb(255,129,5);
	  background: linear-gradient(0deg, rgba(255,129,5,1) 0%, rgba(255,194,0,1) 100%);
	  padding: 2px 15px;
	  border: solid 4px #999;
	  -webkit-border-radius: 12px;
	  -moz-border-radius: 12px;
	  border-radius: 12px;
	  cursor: default;
	  outline: none;
  }
  .letter .btn:focus, .letter .btn:active {
	  color: #fff;
	  outline: none;
	  border-color: #999;
	  box-shadow: none;
  }
  .controls .btn {
	  background: rgb(248,248,248);
	  background: linear-gradient(180deg, rgba(248,248,248,1) 0%, rgba(201,208,211,1) 100%);
	  padding: 2px 10px;
	  border: solid 4px #999;
	  -webkit-border-radius: 12px;
	  -moz-border-radius: 12px;
	  border-radius: 12px;
	  text-shadow: 1px 1px 2px rgba(255,255,255,1);
	  outline: none;
  }
  .controls .btn:hover, .controls .btn:active {
	  background: rgb(248,248,248);
	  background: linear-gradient(180deg, rgba(201,208,211,1) 0%, rgba(248,248,248,1) 100%);
	  outline: none;
	  text-shadow: -1px -1px 2px rgba(255,255,255,1);
  }
  .controls .btn {
	  border-right: solid 2px #999;
	  border-left: solid 2px #999;
  }
  .controls .btn:first-of-type {
	  border-left: solid 4px #999;
  }
  .controls .btn:last-of-type {
	  border-right: solid 4px #999;
  }
  .mini-controls {
	  background-color: #fff;
	  display: inline-block;
	  padding: 2px;
	  -webkit-border-radius: 8px;
	  -moz-border-radius: 8px;
	  border-radius: 8px;
  }
  .mini-controls .hw-bien, .mini-controls .hw-mal, .mini-controls .hw-reloj {
	  cursor: default;
  }
  .mini-controls .btn {
	  color: #333;
	  background-color: transparent;
	  padding: 0px;
	  outline: none !important;
	  font-size: 30px;
  }
  .mini-controls .btn:hover, .mini-controls .btn:active {
	  color: #666;
  }
  .hw-reloj:hover, .hw-reloj:active, .hw-bien:hover, .hw-bien:active, .hw-mal:hover, .hw-mal:active {
	  color: #333 !important;
  }
  body {
	background-color: #eee;
  }
  .mastfoot a {
	  color: #003366;
  }
  .image{
	height: 19px;
    display: flex;
    align-items: center;
  }

  .container-form{
	width: 20rem;
    display: flex;
	margin: 25%;
	flex-direction: column;
    align-items: center;
	justify-content: center;
	font-size: small;
  }



  @media (min-width: 768px){
	.image{
		height: 32px !important;
		
	  }

	  .container-form{
		width: 100%;
		display: block;
		margin-top: 30%;
		margin-left: 0%;
		font-size: x-large;
		
	  }

	  .status {
		font-size: 22px;
		
	}

	  h2.status {
		font-size: 40px;
		
	}

	h1.status {
		font-size: 40px;
		
	}

	.corporate li {
		
		max-width: 33.33%;
		min-height: 50px;
		vertical-align: middle;
		display: inline-block;
		border-right: solid 1px #999;
		padding: 0px 20px;
		
	}

	  

	  
  }