@charset "utf-8";#currentSong,#icoradio,#navnomradio,#playstop,#pub,li.social{vertical-align: middle}
#currentSong,#icoradio{display: inline-block; padding-left: 15px}
#logo,#volume,.jp-audio ul li>a,h2{text-align: center}
#coversong,#lastplay,#mosaicradio{position: absolute}
.jp-volume-bar-knob{position: absolute; right: 0; margin-top: -6px; z-index: 50}
.ui-slider-horizontal{height: 0; border: transparent; width: 100%}
h2{font-size: 20px; text-transform: uppercase; Line-Height: 10px}
#center,#logo,#nav{display: block}
#playstop,#pub{display: inline-block; width: 370px; margin-left: 20px}
#center,#pub{height: 275px}
#divpub,#playerall{background-position: center}
#centerplaystop,#divpub,#logoradio,#playerall,#playstop{margin-left: auto; margin-right: auto}
#nav,#player{width: 770px; background-color: #FFF}
#center,#social{border-top: 1px solid #efefef}
body{font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; background-image: url(../img/bg.png); background-repeat: repeat; padding: 0; margin: 0}
#playerall{width: 770px; height: 485px; background-image: url(../img/backplay.png)}
#playercontent{position: relative; top: 0; right: 0; bottom: 0; left: 0; width: 770px; height: 480px}
#nav{height: 50px; text-align: left}
#currentSong{top: 100px; left: 52px; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 70%;}
#coversong{background-image: url(../img/nocover.png); background-position: center center; width: 105px; height: 105px; right: 25px; top: 10px; border-color: #FFF; border-style: solid}
#wrt_covers img{max-width: 100%; max-height: 100%}
#logo{width: 770px; height: 80px; background-image: url(../img/header.png)}
#center{width: 770px; background-image: url(../img/back.png)}
#playstop{height: 225px}
#centerplaystop{width: 300px; height: 250px}
#logoradio{width: 320px; height: 222px; margin-top: 7%}
#divpub{background-image: url(../img/antiab.png); width: 270px; height: 250px; margin-top: 3%}
#player,.jp-audio ul>li.volume{height: 50px; display: block}
.jp-audio ul{padding: 0; margin: 0; width: 560px; list-style: none}
.jp-audio ul>li{float: left; margin: 0 5px 0 0}
.jp-audio ul li>a{display: block}
#centervolume,.jp-volume-bar{display: inline-block}
.jp-audio ul li:last-child>a{border-right: none}
.jp-audio ul li a>img{opacity: .8}
.jp-audio ul li a>img:hover,button:hover{opacity: 1}
.jp-volume-bar{margin: 19px 5px 0; border-radius: 2px; padding: 2px; overflow: hidden; background: #e7e7e7; width: 300px; height: 8px; cursor: pointer}
li.social,ul.social{padding-right: 0}
.jp-volume-bar-value{width: 0; height: 8px}
button{border: none; outline: 0; background: 0 0; cursor: pointer; opacity: .8}
button img{height: 46px; width: auto}
#volume{margin-left: auto; margin-right: auto; width: 770px; float: left}
#social{display: block; width: 770px; height: auto; background-color: #CCC; text-align: right}
.lpallelem,li.social{display: inline-block}
ul.social{list-style-type: none; margin: 5px 0 0}
li.social img{height: 30px; width: auto}
li.social a>img{opacity: .7}
#mosaicradio li img:hover,li.social a>img:hover{opacity: 1}
#mobilemenu{visibility: hidden; height: 0}
#lastplay{z-index: 100; top: 130px; height: 277px; background-color: rgba(239, 239, 239, .7); max-height: 0; overflow-y: hidden; -webkit-transition: max-height .5s ease-in-out; -moz-transition: max-height .5s ease-in-out; -o-transition: max-height .5s ease-in-out; transition: max-height .5s ease-in-out}
#lastplay.closed,#mosaicradio{-webkit-transition: max-height .5s ease-in-out; -moz-transition: max-height .5s ease-in-out; -o-transition: max-height .5s ease-in-out; overflow-y: hidden}
#lastplay.closed{max-height: 750px; transition: max-height .5s ease-in-out}
.alignlastplay{width: 750px; margin-left: auto; margin-right: auto; padding: 10px}
.lpallelem{width: 124px; height: 235px; vertical-align: top; background-color: rgba(255, 255, 255, .99); padding: 10px; text-align: center; margin: 3px}
#mosaicradio,#mosaicradio.mosaicclosed,.alignmosaicradio{margin-left: auto; margin-right: auto}
.lpallelem img{max-width: 100%; max-height: 100%}
.lptitle{font-size: 12px}
.currentSong{font-weight: 700}
#mosaicradio{z-index: 200; top: 0; height: 496px; background-color: rgba(239, 239, 239, .85); max-height: 0; transition: max-height .5s ease-in-out}
#mosaicradio.mosaicclosed{max-height: 100%; overflow-y: hidden; -webkit-transition: max-height .5s ease-in-out; -moz-transition: max-height .5s ease-in-out; -o-transition: max-height .5s ease-in-out; transition: max-height .5s ease-in-out; cursor: grab; cursor: -o-grab; cursor: -moz-grab; cursor: -webkit-grab}
#mosaicradio ul{list-style-type: none; padding-left: 0}
#mosaicradio li{display: inline; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -khtml-border-radius: 50%; border: 5px solid #fff}
#mosaicradio li img{-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -khtml-border-radius: 50%; height: 150px; opacity: .8}
.alignmosaicradio{width: 750px; padding: 10px; text-align: center; Line-Height: 10px}
.alignmosaicradio button{padding: 20px}



@media only screen and (min-device-width: 320px) and (max-device-width: 480px),
screen and (max-device-width: 700px),
screen and (min-device-width: 768px) and (max-device-width: 1024px),
screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2),
screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2),
screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2),
screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2),
screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2),
screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3),
screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3),
screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3),
screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3),
screen and (max-device-width: 1136px) and (min-device-width: 960px) and (max-device-height: 640px) and (min-device-height: 560px),
screen and (max-device-height: 1136px) and (min-device-height: 960px) and (max-device-width: 640px) and (min-device-width: 560px)
{
	#center, #logo, #nav, #player, #pub, #social{position: absolute}
	#icoradio, #navnomradio{display: none}
	#center, #logo, #playerall{background-position: center}
	#centerplaystop, #playstop{margin-left: auto; margin-right: auto}
	#logo, #nav, #pub{width: 100%; text-align: center}
	#nav, #player{background-color: #FFF}
	body{font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; background-color: #323232; padding: 0; margin: 0}
	#playerall{width: 100%; height: 100%; background-image: url(../img/backplay.png)}
	#playercontent{position: relative; width: 100%; top: 0; right: 0; bottom: 0; left: 0}
	#nav{top: 0; display: block; height: 50px; overflow: hidden}
	#icoradio{vertical-align: middle; padding-left: 0}
	#playstop, li.social{display: inline-block; vertical-align: middle}
	#currentSong{margin-top: 12px; text-overflow: ellipsis; width: 97%}
	
	#coversong{display: none}
	
	#logo{top: 45px; height: 80px; background-image: url(../img/headermobile.png)}
	#center{top: 125px; width: 100%; background-image: url(../img/backmobile.png)}
	#playstop{width: 100%; height: 225px; z-index: 100}
	#centerplaystop{width: 360px; height: 222px; margin-top: 25px}
	#logoradio{margin-top: 30px; width: 320px; height: 222px}
	#pub{display: none}
	#divpub{display: none}
	#player{top: 400px; width: 100%; height: 50px; display: none}
	.jp-audio ul{padding: 0; margin: 0 0 0 15px; width: 100%; list-style: none}
	.jp-volume-bar{margin: 13px 10px 0; width: 200px; height: 20px; cursor: pointer}
	#volume, ul.social{margin-left: auto; margin-right: auto}
	.jp-volume-bar-value{height: 20px}
	#volume{width: 360px; height: 50px}
	#social{top: 345px; width: 100%; height: auto; background-color: #CCC; text-align: center}
	ul.social{list-style-type: none; text-align: center; padding: 0}
	li.social{padding-right: 20px}
	li.social img{height: 40px; width: auto}
	#lastplay, #mobilemenu{width: 100%; position: absolute}
	li.social a>img{opacity: 1}
	#mobilemenu{visibility: visible; top: 275px; background-color: #FFF; text-align: center; height: 71px}
	#mobilemenu img{height: 70px; width: auto}
	#lastplay{z-index: 100; top: 0; height: 277px; background-color: rgba(239, 239, 239, .7); max-height: 0; overflow-y: hidden; -webkit-transition: max-height .5s ease-in-out; -moz-transition: max-height .5s ease-in-out; -o-transition: max-height .5s ease-in-out; transition: max-height .5s ease-in-out}
	#lastplay.closed, #mosaicradio{overflow-y: hidden; -webkit-transition: max-height .5s ease-in-out; -moz-transition: max-height .5s ease-in-out; -o-transition: max-height .5s ease-in-out}
	#lastplay.closed{max-height: 755px; transition: max-height .5s ease-in-out}
	.alignlastplay{width: 755px}
	#mosaicradio{z-index: 200; position: absolute; top: 0; width: 100%; height: 100%; background-color: rgba(239, 239, 239, .85); transition: max-height .5s ease-in-out}
	#mosaicradio.mosaicclosed{width: 100%; height: 100%; overflow-y: scroll; -webkit-transition: max-height .5s ease-in-out; -moz-transition: max-height .5s ease-in-out; -o-transition: max-height .5s ease-in-out; transition: max-height .5s ease-in-out}
	.alignmosaicradio{width: auto; height: auto}
	}
	.animated{-webkit-animation-duration: 3s; -webkit-animation-delay: 1s; animation-duration: 3s; -webkit-animation-fill-mode: both; animation-fill-mode: both}
	.animated.infinite{-webkit-animation-iteration-count: infinite; animation-iteration-count: infinite}
	.animated.hinge{-webkit-animation-duration: 3s; animation-duration: 3s}
	.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration: .75s; animation-duration: .75s}
	
	
	
@-webkit-keyframes tada{0%, to
{-webkit-transform: scaleX(1); transform: scaleX(1)}
10%, 20%{-webkit-transform: scale3d(.9, .9, .9) rotate(-3deg); transform: scale3d(.9, .9, .9) rotate(-3deg)}
30%, 50%, 70%, 90%{-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)}
40%, 60%, 80%{-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)}}


@keyframes tada{0%, to{-webkit-transform: scaleX(1); transform: scaleX(1)}
10%, 20%{-webkit-transform: scale3d(.9, .9, .9) rotate(-3deg); transform: scale3d(.9, .9, .9) rotate(-3deg)}
30%, 50%, 70%, 90%{-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)}
40%, 60%, 80%{-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)}
}
.tada{-webkit-animation-name: tada; animation-name: tada}