a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline
}

html {
    line-height: 1
}

ol,
ul {
    list-style: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

caption,
td,
th {
    text-align: left;
    font-weight: 400;
    vertical-align: middle
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: "";
    content: none
}

a img {
    border: none
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}

body {
    background: #000;
    font-family: arial;
}

.section {
    background: url(../images/tran.gif) center center no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

#audio {
    position: fixed;
    top: 170px;
    right: 20px;
    padding: 15px;
    z-index: 99999;
    text-align: center
}

#audio .ui-slider {
    background: red
}

#audio .ui-slider .ui-slider-handle {
    background: #000
}

#audio .ui-slider .ui-slider-range {
    background: #FFF
}

#shareWrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
    color: #FFF;
    text-align: center;
    overflow: hidden
}

#share {
    background: rgba(0, 0, 0, .4);
    -webkit-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42);
    -moz-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42);
    box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42)
}

#share li {
    display: inline-block;
    margin: 0
}

#share li i {
    cursor: pointer;
    margin: 0;
    padding: 0
}

.gradientTran {
    background: -moz-linear-gradient(top, transparent 0, rgba(0, 0, 0, .34) 42%, rgba(0, 0, 0, .44) 51%, rgba(0, 0, 0, .32) 61%, transparent 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(42%, rgba(0, 0, 0, .34)), color-stop(51%, rgba(0, 0, 0, .44)), color-stop(61%, rgba(0, 0, 0, .32)), color-stop(100%, transparent));
    background: -webkit-linear-gradient(top, transparent 0, rgba(0, 0, 0, .34) 42%, rgba(0, 0, 0, .44) 51%, rgba(0, 0, 0, .32) 61%, transparent 100%);
    background: -o-linear-gradient(top, transparent 0, rgba(0, 0, 0, .34) 42%, rgba(0, 0, 0, .44) 51%, rgba(0, 0, 0, .32) 61%, transparent 100%);
    background: -ms-linear-gradient(top, transparent 0, rgba(0, 0, 0, .34) 42%, rgba(0, 0, 0, .44) 51%, rgba(0, 0, 0, .32) 61%, transparent 100%);
    background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, .34) 42%, rgba(0, 0, 0, .44) 51%, rgba(0, 0, 0, .32) 61%, transparent 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#00000000', GradientType=0)
}

#shareWrap.parked #share {
    font-size: 45px;
    line-height: 45px;
    -webkit-border-top-right-radius: 15px;
    -webkit-border-bottom-right-radius: 15px;
    -moz-border-radius-topright: 15px;
    -moz-border-radius-bottomright: 15px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    padding-top: 10px;
    padding-bottom: 10px
}

#shareWrap.parked {
    width: 69px;
    display: default;
    padding-top: 20px;
    padding-bottom: 20px
}

.hide {
    display: none
}

#playerWrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

#playerWrap #player {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 200px
}

.mobile #player.hide,
.mobile #playerWrap.hide {
    display: block
}

.mobile #play {
    pointer-events: none
}

#navWrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background: 0 0;
    z-index: 10;
    display: nonex;
    -webkit-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42);
    -moz-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42);
    box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42)
}

#navWrap #nav {
    position: relative;
    top: 0;
    left: 0;
    height: 118px;
    background: 0 0;
    width: 100%
}

#navWrap #nav .unit {
    height: 118px;
    width: 210px;
    float: left;
    cursor: pointer;
    background: #000;
    overflow: hidden;
    border-bottom: 2px #CCC solid
}

#navWrap #nav .unit.active {
    height: 116px;
    border-bottom: 2px #8AB3CC solid
}

#navWrap #nav .unit.active img {
    opacity: 1
}

#navWrap #nav .unit:hover {
    height: 116px
}

#navWrap #nav img {
    height: 118px;
    width: 210px;
    opacity: .86
}

#navWrap #nav img:hover {
    opacity: 1
}

#navWrap #navEdge {
    position: relative;
    top: 0;
    left: 0;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 16px;
    font-weight: 300;
    color: #f9f9f9;
    display: block;
    overflow: hidden;
    cursor: pointer;
    background: #45484d;


    background: -moz-linear-gradient(top, #45484d 0, #000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #45484d), color-stop(100%, #000));
    background: -webkit-linear-gradient(top, #45484d 0, #000 100%);
    background: -o-linear-gradient(top, #45484d 0, #000 100%);
    background: -ms-linear-gradient(top, #45484d 0, #000 100%);
    background: linear-gradient(to bottom, #45484d 0, #000 100%);


    background: rgb(0,0,0); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(0,0,0,1) 0%, rgba(69,72,77,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,1)), color-stop(100%,rgba(69,72,77,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(69,72,77,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(69,72,77,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(69,72,77,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(69,72,77,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#45484d',GradientType=0 ); /* IE6-9 */

}

#navWrap #navEdge .fa {
    font-size: 15px;
    line-height: 30px
}

#navWrap #navEdge .right {
    position: absolute;
    right: 20px
}

#navWrap #navEdge .left {
    position: absolute;
    left: 20px
}

.mobi #navWrap #navEdge {
    height: 35px;
    font-size: 20px;
    line-height: 35px
}

.mobi #navWrap .fa {
    color: #CCC;
    font-size: 15px;
    line-height: 30px
}

.mobi #navWrap .right {
    position: absolute;
    right: 10px
}

.mobi #navWrap .left {
    position: absolute;
    left: 10px
}

#play,
.loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    color: #ccc;
    color: rgba(255, 255, 255, .9)
}

#play .fa-circle {
    color: #000;
    color: rgba(0, 0, 0, .5)
}

.loading {
    background: #333;
    background: rgba(0, 0, 0, .5)
}

#pageLoading {
    z-index: 1000;
    pointer-events: none
}

#play,
#playerLoading {
    z-index: 4;
    width: 100%;
    text-align: center
}

#play .fa,
#playerLoading .fa {
    cursor: pointer
}

#controlsWrap {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 90px;
    background: #000;
    font-size: 80px;
    color: #FFF
}

#controlsWrap i {
    padding: 5px;
    margin-left: 5px;
    margin-right: 5px
}

.right {
    float: right
}

.left {
    float: left
}

#timeline {
    position: fixed;
    bottom: -20px;
    width: 100%;
    height: 30px;
    font-size: 80px;
    color: #FFF;
    overflow: hidden;
    cursor: pointer;
    z-index: 10;
    background: #202123;
    background: -moz-linear-gradient(top, #202123 0, #000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #202123), color-stop(100%, #000));
    background: -webkit-linear-gradient(top, #202123 0, #000 100%);
    background: -o-linear-gradient(top, #202123 0, #000 100%);
    background: -ms-linear-gradient(top, #202123 0, #000 100%);
    background: linear-gradient(to bottom, #202123 0, #000 100%)
}

#playhead {
    position: absolute;
    top: 0;
    left: 0;
    height: 30px;
    width: 0;
    display: block;
    pointer-events: none;
    background: #a7cfdf;
    background: -moz-linear-gradient(top, #a7cfdf 0, #23538a 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #a7cfdf), color-stop(100%, #23538a));
    background: -webkit-linear-gradient(top, #a7cfdf 0, #23538a 100%);
    background: -o-linear-gradient(top, #a7cfdf 0, #23538a 100%);
    background: -ms-linear-gradient(top, #a7cfdf 0, #23538a 100%);
    background: linear-gradient(to bottom, #a7cfdf 0, #23538a 100%)
}

#buffered {
    position: absolute;
    top: 0;
    left: 0;
    height: 30px;
    width: 0;
    display: block;
    pointer-events: none;
    background: #D5D5D5
}

.fa-counter-spin {
    -webkit-animation: spin-counter 1s infinite linear;
    -moz-animation: spin-counter 1s infinite linear;
    -o-animation: spin-counter 1s infinite linear;
    animation: spin-counter 1s infinite linear
}

@-moz-keyframes spin-counter {
    0% {
        -moz-transform: rotate(359deg)
    }
    100% {
        -moz-transform: rotate(0deg)
    }
}

@-webkit-keyframes spin-counter {
    0% {
        -webkit-transform: rotate(359deg)
    }
    100% {
        -webkit-transform: rotate(0deg)
    }
}

@-o-keyframes spin-counter {
    0% {
        -o-transform: rotate(359deg)
    }
    100% {
        -o-transform: rotate(0deg)
    }
}

@-ms-keyframes spin-counter {
    0% {
        -ms-transform: rotate(359deg)
    }
    100% {
        -ms-transform: rotate(0deg)
    }
}

@keyframes spin-counter {
    0% {
        transform: rotate(359deg)
    }
    100% {
        transform: rotate(0deg)
    }
}

.yellow #share,
.yellow .fa-play,
.yellow .loading {
    color: #f1eb4e
}

.yellow #share {
    border-top: 2px solid #f1eb4e;
    border-bottom: 2px solid #f1eb4e
}

.yellow #navWrap #nav .unit {
    border-bottom: 2px #CCC solid
}

.yellow #navWrap #nav .unit.active {
    border-bottom: 2px #F1EB4E solid
}

.yellow #navWrap #navEdge {
    color: #F1EB4E
}

.yellow #playhead {
    background: #F1EB4E;
    background: -moz-linear-gradient(top, #f7f2cf 0, #efd426 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f7f2cf), color-stop(100%, #efd426));
    background: -webkit-linear-gradient(top, #f7f2cf 0, #efd426 100%);
    background: -o-linear-gradient(top, #f7f2cf 0, #efd426 100%);
    background: -ms-linear-gradient(top, #f7f2cf 0, #efd426 100%);
    background: linear-gradient(to bottom, #f7f2cf 0, #efd426 100%)
}

.pink #share,
.pink .fa-play,
.pink .loading {
    color: #fe41a2
}

.pink #share {
    border-top: 2px solid #fe41a2;
    border-bottom: 2px solid #fe41a2
}

.pink #navWrap #nav .unit.active {
    border-bottom: 2px #FE41A2 solid
}

.pink #navWrap #navEdge {
    color: #FE41A2
}

.pink #playhead {
    background: #ff5db1;
    background: -moz-linear-gradient(top, #ff5db1 0, #ef017c 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff5db1), color-stop(100%, #ef017c));
    background: -webkit-linear-gradient(top, #ff5db1 0, #ef017c 100%);
    background: -o-linear-gradient(top, #ff5db1 0, #ef017c 100%);
    background: -ms-linear-gradient(top, #ff5db1 0, #ef017c 100%);
    background: linear-gradient(to bottom, #ff5db1 0, #ef017c 100%)
}

.purple .loading {
    color: #9650D3
}

.purple #navWrap #nav .unit.active {
    border-bottom: 2px #9650D3 solid
}

.purple #navWrap #navEdge {
    color: #d4a3ff
}

.purple #navWrap #navEdge .fa {
    color: #9650D3
}

.purple #playhead {
    background: #a182d6;
    background: -moz-linear-gradient(top, #a182d6 0, #7f56b5 47%, #663696 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #a182d6), color-stop(47%, #7f56b5), color-stop(100%, #663696));
    background: -webkit-linear-gradient(top, #a182d6 0, #7f56b5 47%, #663696 100%);
    background: -o-linear-gradient(top, #a182d6 0, #7f56b5 47%, #663696 100%);
    background: -ms-linear-gradient(top, #a182d6 0, #7f56b5 47%, #663696 100%);
    background: linear-gradient(to bottom, #a182d6 0, #7f56b5 47%, #663696 100%)
}

.red #share,
.red .fa-play,
.red .loading {
    color: #FF2A2A
}

.red #share {
    border-top: 2px solid #FF2A2A;
    border-bottom: 2px solid #FF2A2A
}

.red #navWrap #nav .unit.active {
    border-bottom: 2px #FF2A2A solid
}

.red #navWrap #navEdge,
.red #navWrap #navEdge .fa {
    color: #FF2A2A
}

.red #playhead {
    background: #FF2A2A;
    background: -moz-linear-gradient(top, #ff3019 0, #cf0404 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff3019), color-stop(100%, #cf0404));
    background: -webkit-linear-gradient(top, #ff3019 0, #cf0404 100%);
    background: -o-linear-gradient(top, #ff3019 0, #cf0404 100%);
    background: -ms-linear-gradient(top, #ff3019 0, #cf0404 100%);
    background: linear-gradient(to bottom, #ff3019 0, #cf0404 100%)
}

.green #share,
.green .fa-play,
.green .loading {
    color: #CEFF45
}

.green #share {
    color: #CEFF45;
    border-top: 2px solid #CEFF45;
    border-bottom: 2px solid #CEFF45
}

.green #navWrap #nav .unit.active {
    border-bottom: 2px #CEFF45 solid
}

.green #navWrap #navEdge {
    color: #CEFF45;
    font-family: 'Kaushan Script', cursive, arial;
}

.green #navWrap #navEdge .fa {
    color: #CEFF45
}

.green #playhead {
    background: #a0e000;
    background: -moz-linear-gradient(top, #a0e000 0, #71a500 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #a0e000), color-stop(100%, #71a500));
    background: -webkit-linear-gradient(top, #a0e000 0, #71a500 100%);
    background: -o-linear-gradient(top, #a0e000 0, #71a500 100%);
    background: -ms-linear-gradient(top, #a0e000 0, #71a500 100%);
    background: linear-gradient(to bottom, #a0e000 0, #71a500 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#a0e000', endColorstr='#71a500', GradientType=0)
}

.orange #share,
.orange .fa-play,
.orange .loading {
    color: #FF6A1D
}

.orange #share {
    border-top: 2px solid #FF6A1D;
    border-bottom: 2px solid #FF6A1D
}

.orange #navWrap #nav .unit.active {
    border-bottom: 2px #FF6A1D solid
}

.orange #navWrap #navEdge,
.orange #navWrap #navEdge .fa {
    color: #FF6A1D
}

.orange #playhead {
    background: #FF6A1D;
    background: -moz-linear-gradient(top, #fca562 0, #f44900 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fca562), color-stop(100%, #f44900));
    background: -webkit-linear-gradient(top, #fca562 0, #f44900 100%);
    background: -o-linear-gradient(top, #fca562 0, #f44900 100%);
    background: -ms-linear-gradient(top, #fca562 0, #f44900 100%);
    background: linear-gradient(to bottom, #fca562 0, #f44900 100%)
}

.white body {
    background: #FFF
}

.white #share {
    text-align: center
}

.white #navWrap {
    -webkit-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42);
    -moz-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42);
    box-shadow: 0 3px 5px -2px rgba(0, 0, 0, .42)
}

.white #navWrap #nav .unit {
    background: #fff;
    border-bottom: 2px #333 solid
}

.white #navWrap #nav .unit.active {
    border-bottom: 2px #fcfcfc solid
}

.white #navWrap #navEdge {
    color: #0a0a0a;
    background: #fcfcfc;
    background: -moz-linear-gradient(top, #fcfcfc 0, #ededed 63%, #cecece 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fcfcfc), color-stop(63%, #ededed), color-stop(100%, #cecece));
    background: -webkit-linear-gradient(top, #fcfcfc 0, #ededed 63%, #cecece 100%);
    background: -o-linear-gradient(top, #fcfcfc 0, #ededed 63%, #cecece 100%);
    background: -ms-linear-gradient(top, #fcfcfc 0, #ededed 63%, #cecece 100%);
    background: linear-gradient(to bottom, #fcfcfc 0, #ededed 63%, #cecece 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#cecece', GradientType=0)
}

.white .mobi #navWrap .fa {
    color: #333
}

.white .loading {
    color: #d6f9ff;
    background: #fff;
    pointer-events: none
}

.white #controlsWrap {
    background: #FFF;
    color: #000
}

.white #timeline {
    color: #FFF;
    background: rgba(255, 255, 255, .8)
}

.white #playhead {
    background: #f0f9ff;
    background: -moz-linear-gradient(top, #f0f9ff 0, #cbebff 47%, #a1dbff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0f9ff), color-stop(47%, #cbebff), color-stop(100%, #a1dbff));
    background: -webkit-linear-gradient(top, #f0f9ff 0, #cbebff 47%, #a1dbff 100%);
    background: -o-linear-gradient(top, #f0f9ff 0, #cbebff 47%, #a1dbff 100%);
    background: -ms-linear-gradient(top, #f0f9ff 0, #cbebff 47%, #a1dbff 100%);
    background: linear-gradient(to bottom, #f0f9ff 0, #cbebff 47%, #a1dbff 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f0f9ff', endColorstr='#a1dbff', GradientType=0)
}

.white #buffered {
    background: #3d3d3d
}