@charset "utf-8";
/* CSS Document */

body {
  background: #000000;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #434343, #000000);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #434343, #000000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.player

{
	width: 370px;
	height: 300px;
	font-size: 16px;
	font-family: 'Roboto', sans-serif;
	font-family: 'Saira Condensed', sans-serif;
	color: #fafafa;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	border-radius: 50px;
	border-color: #FAFAFA;
	position: relative;
	top: 15px;
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: center;
	justify-content: center;
	background: #870000;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #190A05, #870000);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #190A05, #870000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

body,td,th {
	color: #FFF;
}
a:link {
	color: #F00;
}
a:visited {
	color: #09F;
}

.playpause-track,
    .prev-track,
    .next-track {
	opacity: 0.8;
	position: absolute;
	/* Smoothly transition the opacity */
	transition: opacity .2s;
	width: 150px;
	height: 150px;
	left: 213px;
	top: 15px;
    }

    .playpause-track:hover,
    .prev-track:hover,
    .next-track:hover {
      opacity: 1.0;
    }
	.slider_container {
      width: 100%;
      max-width: 400px;
      display: flex;
      justify-content: center;
      align-items: center;
    }
	 .current-time,
    .total-duration {
      padding: 10px;
    }
	}
   .result {
      font-size: 20px;
      font-weight: 500;
   }
.player header .namestation {
	font-size: 16px;
}
.player header #button {
	font-size: small;
}

  /* pantalla maximo 980px */
@media screen and (max-width:1280px) {
  .player {
    width:100%;
	height:100%;
	
  }
 
}