* {
    padding:0;
    margin:0
}
body {
    font:400 15px Segoe UI Light, Segoe UI, Calibri Light, Calibri, Arial, Verdana, sans-serif;
    margin-top: 70px;
    background-color: #e3f7ff;
}
.divContainer a {
    float:right;
    text-decoration:none;
    color:#00A9EC;
    border-radius:3px;
    border:solid 2px rgba(0, 0, 0, 0);
    background:rgba(0, 0, 0, 0)
}
.divContainer a:hover {
    background:#00A9EC;
    color:#fff;
    border:solid 2px #00A9EC
}
input[type=button] {
    width:64px;
    height:64px;
    margin:2px;
    border:solid 1px #cecece;
    background:#fff;
    border-radius:3px;
    cursor:pointer
}
input[type=button]:hover {
    border-color:#989898
}
input[type=button].clsSelected {
    border-color:#00A9EC
}
#divContainer {
    margin:auto;
    min-width:700px;
}
#valoration {
    display: none;
    text-transform: uppercase;
    line-height: 1.5em;
    margin-bottom: 0;
}
#divPlayer {
    border:solid 2px #ccc;
    border-radius:5px;
    background:#fff;
    margin:inherit
}
#divInfo {
    height:125px;
    margin:10px;
    border:solid 1px #ccc;
    border-radius:3px;
    padding:0;
    padding-top:5px
}
#divLogo {
    height: 112px;
    width: 112px;
    display:inline-block;
    margin: 0 5px;
}
#divLogo > .innerLogo{
    display: table-cell;
    vertical-align: middle;
    height: 112px;
    width: 112px;
    text-align: center;
}
#divLogo > .innerLogo > img{
    max-height: 112px;
    max-width: 112px;
}
#divInfoItem {
    text-align:left;
    display:inline-block;
    vertical-align:top;
    padding:0;
    margin-left:auto;
    margin-top:5px;
    color:#000
}
#divInfoItem label {
    display:block;
    font:400 15px Segoe UI Light, Segoe UI, Arial;
    margin-bottom:1px;
}
#divInfoItem label strong {
    width:105px;
    margin-top:5px;
    margin-left:1px;
    margin-right:1px;
    display:inline-block;
    font:400 15px Segoe UI Light, Segoe UI, Arial;
}
#divInfoItem label span {
    max-width: 430px;
    display: inline-block;
    vertical-align: text-top;
    max-height: 2.25em;
    overflow-y: hidden;
    font:400 15px Segoe UI Light, Segoe UI, Arial;
}
#divControls {
    text-align:center
}
#btnPlay {
    background:url(../images/play.png) center no-repeat
}
#btnPause {
    background:url(../images/pause.png) center no-repeat
}
#btnStop {
    background:url(../images/stop.png) center no-repeat
}
#btnForward {
    background:url(../images/forward.png) center no-repeat
}
#btnRewind {
    background:url(../images/rewind.png) center no-repeat
}
#btnVolumeUp {
    background:url(../images/volumeup.png) center no-repeat
}
#btnVolumeDown {
    background:url(../images/volumedown.png) center no-repeat
}
#btnSpam {
    background:url(../images/spam.png) center no-repeat
}
#btnSpamOk {
    background:url(../images/spamOk.png) center no-repeat
}
#divProgress {
    height:15px;
    margin:10px;
    margin-left:10px;
    margin-right:10px;
    border:solid 1px #ccc;
    border-radius:3px;
    overflow:hidden
}
#divBar {
    width:0;
    height:100%;
    background:#ccc;
    border-right:solid 1px #00A9EC
}
#divBarHint {
    display: none;
    width:0;
    height:100%;
    background:#F4EB25;
    border-right:solid 1px #00A9EC
}
#divBarHintPosition {
    display: none;
    position: absolute;
    margin-top: -23px;
    margin-left: 0;
    width:60px;
    height:22px;
    background:#fff;
    border:solid 1px #00A9EC;
    font-size: 14px;
    text-align: center;
}

#divProgress:hover {
    cursor: pointer;
}

#divList {
    padding:5px;
    overflow-x:auto;
    height:200px;
    color:#000;
    font-size:12px
}
#divList ol {
    list-style-type:none;
    padding-left:5px;
    padding-right:5px
}
#divList ol li {
    padding:5px;
    cursor:pointer;
    border:solid 1px rgba(0, 0, 0, 0);
    border-radius:3px
}
#divList ol li:hover {
    background:#fff;
    color:#767676;
    border:solid 1px #ccc;
    border-radius:3px
}
#divList ol li.clsSelected {
    background:#fff;
    color:#767676;
    border:solid 1px #00A9EC;
    border-radius:3px
}
#divList ol li:last-child {
    border-bottom:auto
}
#divList ol li strong {
    display:block;
    font:400 15px Segoe UI Light, Segoe UI, Calibri, Arial
}
#divList ol li em {
    display:block;
    font:400 12px Segoe UI Light, Segoe UI, Calibri, Arial;
    background:rgba(240, 240, 240, .54);
    border:solid 2px rgba(240, 240, 240, .54);
    border-radius:3px
}
#divCredits {
    padding:8px;
    text-align:center;
    font-size:12px;
    color:#767676
}
::-webkit-scrollbar {
    width:10px;
    border-radius:3px
}
::-webkit-scrollbar-track {
    background-color:rgba(0, 0, 0, 0)
}
::-webkit-scrollbar-track-piece {
    background-color:rgba(0, 0, 0, 0)
}
::-webkit-scrollbar-thumb {
    background:#ccc;
    height:50px;
    border-radius:3px
}
::-webkit-scrollbar-thumb:hover {
    background:#bebebe;
    border-radius:3px
}
.bubble {
    margin-top: 5px;
    position: relative;
    min-width: 700px;
    height: auto;
    padding: 5px;
    background: #F9FE9E;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    border: #323335 solid 2px;
    text-align: center;
    color: #37383A;
}
.bubble:after {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 0 15px 15px;
    border-color: #F9FE9E transparent;
    display: block;
    width: 0;
    z-index: 1;
    top: -15px;
    left: 48%;
}
.bubble:before {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 0 16px 16px;
    border-color: #323335 transparent;
    display: block;
    width: 0;
    z-index: 0;
    top: -18px;
    left: 48%;
}
#strokeHints strong {
    display: inline-block;
    width: 100px;
}
.youtube-well {
    min-height: 10px;
    max-height: 100px;
    padding: 5px;
    margin-bottom: 5px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
}
.youtube-well a:hover {
    text-decoration: none;
}
.youtube-well a:hover img {
    opacity: 0.8;
}
.youtube-well .video-thumb {
    float: left;
    margin-right: 8px;
}
.youtube-well .video-duration {
    background-color: #000;
    display: inline-block;
    position: absolute;
    color:#fff;
    top: 70px;
    margin-left: 5px;
    padding: 2px;
    border: 1px solid rgba(255,255,255,0.2);
    font-size: 0.75em;
}
.youtube-well a:hover .video-duration {
    display: none;
}
.youtube-well .video-title,
.youtube-well .video-attribution,
.youtube-well .video-views {
    vertical-align: text-top;
    font:400 12px Segoe UI Light, Segoe UI, Calibri, Arial;
    color: #333333;
}
.youtube-well .video-title {
    font-weight: bold;
    display: block;
    max-height: 3.7em;
    overflow-y: hidden;
}
