.radio_doboz{border: 1px solid var(--light_grey);color:var(--black);background-color: var(--background);}

.radio_fejlec{}
.radio_fejlec img{width:40%}
.radio {
  margin-bottom:0px;
}

.player {
  position: relative;text-align: center;
}

.cover {
  height: 150px;
  width: 150px;
  margin-top:10px;
  border: 1px solid var(--light_grey);
}


.info h1 {
  margin-top: 15px;
  margin-left: 135px;
}
.info h4 {
  margin-left: 150px;
  line-height: 20px;
  color: #636367;
}
.info h2 {
  margin-left: 150px;
}

.button-items {
  margin-top:10px;
}

#playimg1{width:100%;position: absolute;left: 0;bottom: 55px;}
#playimg2{width:100%;position: absolute;left: 0;bottom: 55px;}
#playimg3{width:100%;position: absolute;left: 0;bottom: 55px;}
#playimg4{width:100%;position: absolute;left: 0;bottom: 55px;}
#playimg5{width:100%;position: absolute;left: 0;bottom: 55px;}
#slider1 {
  width: 182px;
  height: 4px;
  background: #151518;
  border-radius: 2px;
  display: none;
}
#slider1 div {
  width: 4px;
  height: 4px;
  margin-top: 1px;
  background: #ef6dbc;
  border-radius: 2px;
}
#slider2 {
  width: 182px;
  height: 4px;
  background: #151518;
  border-radius: 2px;
  display: none;
}
#slider2 div {
  width: 4px;
  height: 4px;
  margin-top: 1px;
  background: #ef6dbc;
  border-radius: 2px;
}
#slider3 {
  width: 182px;
  height: 4px;
  background: #151518;
  border-radius: 2px;
  display: none;
}
#slider3 div {
  width: 4px;
  height: 4px;
  margin-top: 1px;
  background: #ef6dbc;
  border-radius: 2px;
}
#slider4 {
  width: 182px;
  height: 4px;
  background: #151518;
  border-radius: 2px;
  display: none;
}
#slider4 div {
  width: 4px;
  height: 4px;
  margin-top: 1px;
  background: #ef6dbc;
  border-radius: 2px;
}
#slider5 {
  width: 182px;
  height: 4px;
  background: #151518;
  border-radius: 2px;
  display: none;
}
#slider5 div {
  width: 4px;
  height: 4px;
  margin-top: 1px;
  background: #ef6dbc;
  border-radius: 2px;
}
#timer1 {
  color: var(--black);
line-height: 0;
font-size: 9pt;
}
#timer2 {
  color: var(--black);
line-height: 0;
font-size: 9pt;
}
#timer3 {
  color: var(--black);
line-height: 0;
font-size: 9pt;
}
#timer4 {
  color: var(--black);
line-height: 0;
font-size: 9pt;
}
#timer5 {
  color: var(--black);
line-height: 0;
font-size: 9pt;
}
.controls {
  margin-top: 40px;position: relative;height: 100px;
}
.controls svg:nth-child(2) {
  margin-left: 5px;
  margin-right: 5px;
}

#play1 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#play1 img{width:60px;}
#play2 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#play2 img{width:60px;}
#play3 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#play3 img{width:60px;}
#play4 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#play4 img{width:60px;}
#play5 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#play5 img{width:60px;}
.step-backward {
  width: 18px;
  height: 18px;
  x: 0px;
  y: 0px;
  enable-background: new 0 0 25 25;
  margin-bottom: 5px;
}
.step-backward g polygon {
  fill: #fefefe;
}

.step-foreward {
  width: 18px;
  height: 18px;
  x: 0px;
  y: 0px;
  enable-background: new 0 0 25 25;
  margin-bottom: 5px;
}
.step-foreward g polygon {
  fill: #fefefe;
}

#pause1 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#pause1 img{width:60px;}
#pause2 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#pause2 img{width:60px;}
#pause3 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#pause3 img{width:60px;}
#pause4 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#pause4 img{width:60px;}
#pause5 {
  bottom: 20px;
  left: calc(50% - 30px);
position: absolute;
cursor:pointer;
}
#pause5 img{width:60px;}
.step-backward g polygon:hover,
.step-foreward g polygon:hover {
  fill: #ef6dbc;
  cursor: pointer;
}

.social {
  text-align: center;
}

.twitter {
  color: #bdbdbd;
  font-family: sans-serif;
  text-decoration: none;
}
.twitter:hover {
  color: #ecf0f1;
}

.github {
  color: #bdbdbd;
  font-family: sans-serif;
  text-decoration: none;
}
.github:hover {
  color: #ecf0f1;
}

p {
  color: #bdbdbd;
}

#skip1 {
  float: right;
  margin-top: 10px;
}
#skip1 p {
  color: #2980b9;
}
#skip1 p:hover {
  color: #e74c3c;
  cursor: pointer;
}

#skip2 {
  float: right;
  margin-top: 10px;
}
#skip2 p {
  color: #2980b9;
}
#skip2 p:hover {
  color: #e74c3c;
  cursor: pointer;
}

#skip3 {
  float: right;
  margin-top: 10px;
}
#skip3 p {
  color: #2980b9;
}
#skip3 p:hover {
  color: #e74c3c;
  cursor: pointer;
}


#skip4 {
  float: right;
  margin-top: 10px;
}
#skip4 p {
  color: #2980b9;
}
#skip4 p:hover {
  color: #e74c3c;
  cursor: pointer;
}
#skip5 {
  float: right;
  margin-top: 10px;
}
#skip5 p {
  color: #2980b9;
}
#skip5 p:hover {
  color: #e74c3c;
  cursor: pointer;
}
.expend {
  padding: 0.5px;
  cursor: pointer;
  display: none;
}
.expend svg:hover g polygon {
  fill: #ef6dbc;
}
.info h1 {
  font-family: "Encode Sans Semi Expanded";
font-style: normal;
font-weight: 300;
font-size: 20px;
line-height: 25px;
color: var(--black);
}