body {
  font-family: "Lucida Grande","bitstream vera sans","trebuchet ms",verdana,arial;
  text-align: center;
  background-image: url(images/background.png);
  background-repeat: repeat;
  margin: 0;
}

/*#header,
#video-container-outer,
#video-overlay,
#player,
#controls,
#logos,
#footer {
    max-width: 95%;
}*/

h1 {
  letter-spacing: -1px;
  color: #000000;
  font-weight: bold;
  font-size: 1.7em;
}

h2 {
  letter-spacing: -1px;
  font-weight: bold;
  font-size: 1.2em;
  text-align: left;
}

a {
  color: #000000;
  text-decoration: none;
}

a:active {
  color: #333333;
  text-decoration: underline;
}

a:hover {
  text-decoration: underline;
}

/*.center {
  overflow: hidden;
  max-width: 100%;
  position: relative;
}*/

.center > * {
    margin: 0 auto;
}

table#header {
  background-color: #333333;
}

td {
  padding: 0.5em 0.7em;
}

td span {
  color: #FFFFFF;
}

td span a {
  color: #AAAAAA;
  font-size: 0.8em;
  text-decoration: none;
  padding: 0 0.2em;
  white-space: nowrap;
}

td span a:hover {
  text-decoration: underline;
}

td span.selected {
  font-weight: bold;
}

video, .turm {
  background-color: #FFE924;
  background-image: url('images/elevate-turm.png');
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}

div#controls {
  background-color: #333333;
}

div#controls table {
  margin: 0;
  padding: 0;
  border: 0;
}

div#controls td {
  margin: 0;
  padding: 0.3em 0.5em 0.15em 0.5em;
  border: 0;
}

/*
table#footer {
  background-color: rgba(51,51,51,0.4);
}


table#footer td {
  padding: 0.3em 0.5em;
}

table#logos {
  padding: 0.3em 2em;
  background-color: rgba(51,51,51,0.4);
}
*/






/*
helsinki player styles
*/
#player-box {
    margin-bottom: 1.3em;
}

#player {
    margin-bottom: 1em;
}

#player a {
    color: black;
}

#player-playstop {
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    width: 176px;
    height: 176px;
}

#player-playstop-overlay {
    width: 176px;
    height: 176px;
    background-color: rgba(255,255,255,0.5);
    position: absolute;
    display: block;
}

#video-overlay {
    z-index: 10;
}

#video-overlay-inner {
    width: 125px;
    height: 125px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    background-image: url('images/controls.png');
    background-repeat: no-repeat;
    background-position: 0 0; /* play button big */
}

#player-ctrl {
    margin-top: 0.3em;
    width: 260px;
    height: 32px;
    margin-left: auto;
    margin-right: auto;
    background-color: #434343;
    padding: 10px;
}

#player-state {
    position: relative;
    float: left;
    width: 25px;
    height: 25px;
    background-image: url('images/controls.png');
    background-repeat: no-repeat;
    background-position: 0px -125px; /* play button */
}

#player-volume {
    position: relative;
    right: 10px;
    width: 150px;
    background: transparent;
    /*fix for FF unable to apply focus style bug */
    /*    border: 1px solid #434343; */
    border: none;
    -webkit-appearance: none;
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
}
#player-volume:focus {
    outline: none;
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
}
/* webkit based browser */
#player-volume::-webkit-slider-runnable-track {
    width: 150px;
    height: 5px;
    background: #888;
    border: 0;
    border-radius: 3px;
}
#player-volume:disabled::-webkit-slider-runnable-track {
    background: #545454;
}
#player-volume::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: white;
    margin-top: -5px;
}
#player-volume:disabled::-webkit-slider-thumb {
    background: #656565;
}
/* mozilla firefox */
#player-volume::-moz-range-track {
    width: 150px;
    height: 5px;
    background: #888;
    border: 0;
    border-radius: 3px;
}
#player-volume:disabled::-moz-range-track {
    background: #545454;
}
#player-volume::-moz-range-thumb {
    border: 0;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: white;
}
#player-volume:disabled::-moz-range-thumb {
    background: #656565;
}
#player-volume::-moz-focus-outer {
    border: 0;
}
/* microsoft browser */
#player-volume::-ms-track {
    width: 150px;
    height: 5px;
    background: transparent;
    border-color: transparent;
    border-width: 6px 0;
    color: transparent;
}
#player-volume::-ms-fill-lower {
    background: #888;
    border-radius: 10px;
}
#player-volume:disabled::-ms-fill-lower {
    background: #545454;
}
#player-volume::-ms-fill-upper {
    background: #888;
    border-radius: 10px;
}
#player-volume:disabled::-ms-fill-upper {
    background: #545454;
}
#player-volume::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: white;
}
#player-volume:disabled::-ms-thumb {
    background: #656565;
}
#player-volume::-ms-tooltip {
    display: none;
}

#player-mute {
    position: relative;
    float: right;
    width: 25px;
    height: 25px;
    background-image: url('images/controls.png');
    background-repeat: no-repeat;
    background-position: -75px -150px; /* volume high */
}