html, body {margin: 0; height: 100%; overflow: hidden}


#playerbaroff {
height: 120px;
width: 1216px;
margin-bottom: 6px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#050609+0,050609+2,181c28+4,282f42+95,282f42+96,050609+98,050609+100 */
background: rgb(5,6,9); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(5,6,9,1) 0%, rgba(5,6,9,1) 2%, rgba(24,28,40,1) 4%, rgba(40,47,66,1) 95%, rgba(40,47,66,1) 96%, rgba(5,6,9,1) 98%, rgba(5,6,9,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050609', endColorstr='#050609',GradientType=0 ); /* IE6-9 */
}

#playerbaroff2 {
height: 120px;
width: 1216px;
margin-bottom: 6px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#050609+0,050609+2,181c28+4,282f42+95,282f42+96,050609+98,050609+100 */
background: rgb(5,6,9); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(5,6,9,1) 0%, rgba(5,6,9,1) 2%, rgba(24,28,40,1) 4%, rgba(40,47,66,1) 95%, rgba(40,47,66,1) 96%, rgba(5,6,9,1) 98%, rgba(5,6,9,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050609', endColorstr='#050609',GradientType=0 ); /* IE6-9 */
}

#playerbaroff3 {
height: 120px;
width: 1216px;
margin-bottom: 6px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#050609+0,050609+2,181c28+4,282f42+95,282f42+96,050609+98,050609+100 */
background: rgb(5,6,9); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(5,6,9,1) 0%, rgba(5,6,9,1) 2%, rgba(24,28,40,1) 4%, rgba(40,47,66,1) 95%, rgba(40,47,66,1) 96%, rgba(5,6,9,1) 98%, rgba(5,6,9,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050609', endColorstr='#050609',GradientType=0 ); /* IE6-9 */
}

#playerbaroff4 {
height: 120px;
width: 1216px;
margin-bottom: 6px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#050609+0,050609+2,181c28+4,282f42+95,282f42+96,050609+98,050609+100 */
background: rgb(5,6,9); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(5,6,9,1) 0%, rgba(5,6,9,1) 2%, rgba(24,28,40,1) 4%, rgba(40,47,66,1) 95%, rgba(40,47,66,1) 96%, rgba(5,6,9,1) 98%, rgba(5,6,9,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050609', endColorstr='#050609',GradientType=0 ); /* IE6-9 */
}

#playerbargreen {
height: 113px;
width: 1216px;
top: 4px;
margin-bottom: 14px;
background-color: green;
}

#playerbargreen2 {
height: 113px;
  width: 1216px;
  top: 4px;
  margin-bottom: 14px;
  background-color: green;
}

#playerbargreen3 {
height: 113px;
  width: 1216px;
  top: 4px;
  margin-bottom: 14px;
  background-color: green;
}

#playerbargreen4 {
height: 113px;
  width: 1216px;
  top: 4px;
  margin-bottom: 14px;
  background-color: green;
}

#playerbaron {
  height: 113px;
  width: 1216px;
  top: 4px;
  margin-bottom: 14px;
background: red;
}

#playerbaron2 {
  height: 113px;
  width: 1216px;
  top: 4px;
  margin-bottom: 14px;
  background: red;
}

#playerbaron3 {
  height: 113px;
  width: 1216px;
  top: 4px;
  margin-bottom: 14px;
  background: red;
}
#playerbaron4 {
  height: 113px;
  width: 1216px;
  top: 4px;
  margin-bottom: 14px;
  background: red;
}

#rundown {
height: 30px;
width: 1260px;
margin-top: 64px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#050609+0,050609+2,181c28+4,282f42+95,282f42+96,050609+98,050609+100 */
background: rgb(5,6,9); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(5,6,9,1) 0%, rgba(5,6,9,1) 2%, rgba(24,28,40,1) 4%, rgba(40,47,66,1) 95%, rgba(40,47,66,1) 96%, rgba(5,6,9,1) 98%, rgba(5,6,9,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(5,6,9,1) 0%,rgba(5,6,9,1) 2%,rgba(24,28,40,1) 4%,rgba(40,47,66,1) 95%,rgba(40,47,66,1) 96%,rgba(5,6,9,1) 98%,rgba(5,6,9,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050609', endColorstr='#050609',GradientType=0 ); /* IE6-9 */

}

#headerbar {
height: 30px;
width: 200px:

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0a0809+0,0a0e0a+67,6e7774+95,aebcbf+100 */
background: rgb(10,8,9); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(10,8,9,1) 0%, rgba(10,14,10,1) 67%, rgba(110,119,116,1) 95%, rgba(174,188,191,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(10,8,9,1) 0%,rgba(10,14,10,1) 67%,rgba(110,119,116,1) 95%,rgba(174,188,191,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(10,8,9,1) 0%,rgba(10,14,10,1) 67%,rgba(110,119,116,1) 95%,rgba(174,188,191,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a0809', endColorstr='#aebcbf',GradientType=0 ); /* IE6-9 */
}

body {background-color: #050609;}

#logo {
  left: 4px;
  position: absolute;
  top: 5px;
}

#textbar {
  position: absolute;
  text-align: center;
  top: 5px;
  font-family: "Arial Rounded MT Bold", Georgia, Serif;
  color: #9e9eea;
}

#rundowntxt {
  position: absolute;
  text-align: center;
  margin-top: 6px;
  left: 540px;
  font-family: "Arial", Georgia, Serif;
  color: white;
}

#rundowntxt2 {
  position: absolute;
  text-align: center;
  margin-top: 6px;
  left: 451px;
  font-family: "Arial", Georgia, Serif;
  color: white;
}

#klokken {
position: absolute;
margin-top: 8px;
left: 600px;
height: 50px;
width: 230px;
background-color: #141821;
}

#countdown {
position: absolute;
margin-top: 8px;
left: 900px;
height: 50px;
width: 250px;
background-color: #141821;
}

#tijd {
color: white;
font-family: "Arial Rounded MT Bold", Georgia, Serif;
font-size: 45px;
margin-top: -8px;
}

#tijd2 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: -1px;
margin-left: 7px;
position: absolute;
}

#tijd3 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: -1px;
margin-left: 7px;
position: absolute;
}

#tijd4 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: -1px;
margin-left: 7px;
position: absolute;
}

#tijd5 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: -1px;
margin-left: 7px;
position: absolute;
}

#tijd6 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: -1px;
margin-left: 7px;
position: absolute;
}

#tijd7 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: -1px;
margin-left: 7px;
position: absolute;
}
#tijd8 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: 0px;
margin-left: 7px;
position: absolute;
}
#tijd9 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: 0px;
margin-left: 7px;
position: absolute;
}
#tijd10 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: 0px;
margin-left: 7px;
position: absolute;
}
#tijd11 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: 0px;
margin-left: 7px;
position: absolute;
}
#tijd12 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: 0px;
margin-left: 7px;
position: absolute;
}
#tijd13 {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: 0px;
margin-left: 7px;
position: absolute;
}

#tijd2off {
color: white;
font-family: "Arial", Georgia, Serif;
font-size: 22px;
margin-top: 5px;
margin-left: 7px;
position: absolute;
}

#timer {
color: white;
font-family: "Arial Rounded MT Bold", Georgia, Serif;
font-size: 45px;
margin-top: -12px;
}

#rundownlijn {
height: 1400px;
width: 30px;
margin-left: 1230px;
background-color: #212737
}

#blok1 {
position: relative;
margin-top: 0px;
margin-left: 1280px;
}


#blok2 {
  position: relative;
  margin-top: 0px;
  margin-left: 1280px;

  }

  #blok3 {
    margin-top: 0px;
    margin-left: 1280px;
}

#blok4 {
margin-top: 10px;
margin-left: 1280px;
}

#players {
position: absolute;
margin-top: 10px;
margin-left: 8px;

}

#durationtxt {
  position: absolute;
  font-size: 18px;
  font-family: Arial;
  color: #bfbfbf;
  top: 83px;
  left: 137px;

}


#tijdblok {
position: absolute;
margin-top: -27px;
left: 128px;
height: 30px;
width: 98px;
background-color: #141821;
}

#tijdblokon {
position: absolute;
margin-top: -85px;
left: 126px;
height: 30px;
width: 98px;
background-color: #141821;
}

#tijdbloktimer {
position: absolute;
margin-top: -32px;
left: 126px;
height: 27px;
width: 98px;
background-color: #141821;
}


.total-time {
  visibility: hidden !important;
  position: absolute !important;
  font-size: 20px !important;
  left: -110px !important;
  color: white !important;
  top: 48px !important;
  background: none !important;

}

.the-thumb {
position: relative !important;
left: -15px !important;
height: 112px !important;
width: 100px !important;
top: -26px !important;
border-radius: 0px !important;

}

.playbtn {
display: none !important;
}

.the-icon-bg{
display: none !important;
}
.con-playpause {
  position: absolute !important;
  margin-left: -228px !important;
  margin-top: -100px;
  height: 100px !important;
  width: 100px !important;
  top: 40px !important

}

.the-artist {
position: relative !important;
overflow: visible !important;
left: 230px !important;
top: 45px !important;
height: 10px !important;
font-size: 28px !important;
font-family: Arial !important;
color: white !important;

}

.the-artiston {
position: relative !important;
overflow: visible !important;
left: 230px !important;
top: -15px !important;
height: 10px !important;
font-size: 30px !important;
font-family: Arial !important;
color: white !important;

}

.the-name {
  position: relative !important;
  overflow: visible !important;
  left: 40px !important;
  top: 10px !important;
  height: 10px !important;
  font-size: 30px !important;
  font-family: Arial !important;
  color: white !important;
}

.the-nameon {
  position: relative !important;
  overflow: visible !important;
  left: 27px !important;
  top: -50px !important;
  height: 10px !important;
  font-size: 30px !important;
  font-family: Arial !important;
  color: white !important;
}

.scrub-prog-img {
position: absolute !important;
height: 35% !important;
top: 14px !important;

}

.scrub-bg-img {
  position: absolute !important;
height: 35% !important;
top: 14px !important;

}

.scrub-prog {
    position: absolute !important;



}


.oscrub-prog{
  position: absolute !important;
max-width: 88% !important;

}


#morebtn {
position: absolute;
left: 1050px;
top: 10px;

}

#pflbtn {
position: absolute;
left: 1050px;
top: 70px;

}

#imgplayoff {
position: absolute;
width: 115px;
height: 111px;
top: 4px;
left: -2px;
}

#imgplaygreen {
position: absolute;
width: 116px;
height: 113px;
top: 0px;
left: 0px;
}

#imgplayred {
position: absolute;
width: 114px;
height: 113px;
top: 0px;
left: -3px;
}

#imgplayon {
position: absolute;
width: 120px;
height: 121px;
top: 0px;
left: -2px;
}

#playbarwidth {
width: 70%;
margin-left: 212px;
}


.curr-time {
font-size: 18px !important;
position: absolute;
left: -126px !important;
top: 50px !important;
background-color: #141821 !important;
}

#welkomtxt {
color: white;
font-family: "Arial", Georgia, Serif;

}