.arthref {
    position : fixed;
    top      : 0;
    left     : 0;
    z-index  : 9999
}

.arthref .overlay {
    z-index            : 100;
    position           : fixed;
    width              : 100%;
    height             : 100%;
    opacity            : 0;
    background         : rgba(0, 0, 0, 0.8);
    pointer-events     : none;
    display            : none;
    -webkit-transition : all 200ms ease-in-out;
    -moz-transition    : all 200ms ease-in-out;
    -o-transition      : all 200ms ease-in-out;
    -ms-transition     : all 200ms ease-in-out;
    transition         : all 200ms ease-in-out
}

.arthref .opaque {
    background : rgba(0, 0, 0, 0.2) !important
}

.arthref .overlay.active {
    opacity        : 1;
    pointer-events : all
}

.arthref .icon-container {
    z-index    : 101;
    position   : absolute;
    top        : 0;
    left       : 0;
    bottom     : 0;
    right      : 0;
    text-align : center
}

.arthref .icon-container:before {
    content        : '';
    height         : 100%;
    display        : inline-block;
    vertical-align : middle
}

.arthref .icon-container .centered {
    display        : inline-block;
    padding        : 1em;
    vertical-align : middle;
    text-align     : left;
    width          : 80%;
    max-width      : 725px
}

.arthref .icon-container ul {
    margin             : 0;
    padding            : 0;
    list-style-type    : none;
    text-align         : center;
    opacity            : 0;
    -webkit-transition : all 200ms ease-in-out;
    -moz-transition    : all 200ms ease-in-out;
    -o-transition      : all 200ms ease-in-out;
    -ms-transition     : all 200ms ease-in-out;
    transition         : all 200ms ease-in-out;
    pointer-events     : none
}

.arthref .icon-container ul.active {
    opacity        : 1;
    pointer-events : auto
}

.arthref .icon-container ul li {
    display : inline-block;
    width   : 80px;
    height  : 110px;
    margin  : 10px
}

.arthref .icon-container ul li a {
    background-color : #617385;
    border-radius    : 10px;
    display          : block;
    width            : 80px;
    height           : 80px;
    margin           : 0 0 10px 0
}

.arthref .icon-container ul li span {
    text-align  : center;
    font-family : Arial;
    font-size   : 12px;
    font-weight : bold;
    text-shadow : 0 2px 3px rgba(0, 0, 0, .9);
    color       : #e5e5e5;
    font-style  : normal !important
}

.arthref .icon-container ul li a.aApple span {
    background-position : 0 0
}

.arthref .icon-container ul li a.aMySpace span {
    background-position : -80px 0
}

.arthref .icon-container ul li a.aBlackBerry span {
    background-position : -160px 0
}

.arthref .icon-container ul li a.aWikipedia span {
    background-position : -240px 0
}

.arthref .icon-container ul li a.aEMail span {
    background-position : -320px 0
}

.arthref .icon-container ul li a.aWordpress span {
    background-position : -400px 0
}

.arthref .icon-container ul li a.aDeviantart span {
    background-position : -480px 0
}

.arthref .icon-container ul li a.aForrst span {
    background-position : 0 -80px
}

.arthref .icon-container ul li a.aTechnorati span {
    background-position : -80px -80px
}

.arthref .icon-container ul li a.aXBox span {
    background-position : -160px -80px
}

.arthref .icon-container ul li a.aAndroid span {
    background-position : -240px -80px
}

.arthref .icon-container ul li a.aEvernote span {
    background-position : -320px -80px
}

.arthref .icon-container ul li a.aZerply span {
    background-position : -400px -80px
}

.arthref .icon-container ul li a.aXing span {
    background-position : -480px -80px
}

.arthref .icon-container ul li a.aVimeo span {
    background-position : 0 -160px
}

.arthref .icon-container ul li a.aTumblr span {
    background-position : -80px -160px
}

.arthref .icon-container ul li a.aFacebook span {
    background-position : -160px -160px
}

.arthref .icon-container ul li a.aDigg span {
    background-position : -240px -160px
}

.arthref .icon-container ul li a.aDelicious span {
    background-position : -320px -160px
}

.arthref .icon-container ul li a.aFriendFeed span {
    background-position : -400px -160px
}

.arthref .icon-container ul li a.aLinkedIn span {
    background-position : -480px -160px
}

.arthref .icon-container ul li a.aPaypal span {
    background-position : 0 -240px
}

.arthref .icon-container ul li a.aBehance span {
    background-position : -80px -240px
}

.arthref .icon-container ul li a.aFoursquare span {
    background-position : -160px -240px
}

.arthref .icon-container ul li a.aWindows span {
    background-position : -240px -240px
}

.arthref .icon-container ul li a.aSkype span {
    background-position : -320px -240px
}

.arthref .icon-container ul li a.aTwitter span {
    background-position : -400px -240px
}

.arthref .icon-container ul li a.aPosterous span {
    background-position : -480px -240px
}

.arthref .icon-container ul li a.aLastFm span {
    background-position : 0 -320px
}

.arthref .icon-container ul li a.aQuora span {
    background-position : -80px -320px
}

.arthref .icon-container ul li a.aYouTube span {
    background-position : -160px -320px
}

.arthref .icon-container ul li a.aPinterest span {
    background-position : -240px -320px
}

.arthref .icon-container ul li a.aPath span {
    background-position : -320px -320px
}

.arthref .icon-container ul li a.aGooglePlus span {
    background-position : -400px -320px
}

.arthref .icon-container ul li a.aFlud span {
    background-position : -480px -320px
}

.arthref .icon-container ul li a.aStumbleUpon span {
    background-position : 0 -400px
}

.arthref .icon-container ul li a.aReddit span {
    background-position : -80px -400px
}

.arthref .icon-container ul li a.aRSS span {
    background-position : -160px -400px
}

.arthref .icon-container ul li a.aScoutzie span {
    background-position : -240px -400px
}

.arthref .icon-container ul li a.aBlogger span {
    background-position : -320px -400px
}

.arthref .icon-container ul li a.aGrovershark span {
    background-position : -400px -400px
}

.arthref .icon-container ul li a.aAIM span {
    background-position : -480px -400px
}

.arthref .icon-container ul li a.aYahoo span {
    background-position : 0 -480px
}

.arthref .icon-container ul li a.aFlickr span {
    background-position : -80px -480px
}

.arthref .icon-container ul li a.aDribbble span, .arthref .icon-container ul li a.aDribble span {
    background-position : -160px -480px
}

.arthref .icon-container ul li a.aInstagram span {
    background-position : -240px -480px
}

.arthref .icon-container ul li a.aApple {
    background-color : #272727
}

.arthref .icon-container ul li a.aMySpace {
    background-color : #272727
}

.arthref .icon-container ul li a.aBlackBerry {
    background-color : #2c2c2c
}

.arthref .icon-container ul li a.aWikipedia {
    background-color : #303030
}

.arthref .icon-container ul li a.aEMail {
    background-color : #434343
}

.arthref .icon-container ul li a.aWordpress {
    background-color : #444
}

.arthref .icon-container ul li a.aDeviantArt {
    background-color : #40504c
}

.arthref .icon-container ul li a.aForrst {
    background-color : #254619
}

.arthref .icon-container ul li a.aTechnorati {
    background-color : #48aa26
}

.arthref .icon-container ul li a.aXBox {
    background-color : #61a500
}

.arthref .icon-container ul li a.aAndroid {
    background-color : #8acd16
}

.arthref .icon-container ul li a.aEvernote {
    background-color : #78ba4e
}

.arthref .icon-container ul li a.aZerply {
    background-color : #99bd67
}

.arthref .icon-container ul li a.aXing {
    background-color : #036567
}

.arthref .icon-container ul li a.aVimeo {
    background-color : #627486
}

.arthref .icon-container ul li a.aTumblr {
    background-color : #365471
}

.arthref .icon-container ul li a.aFacebook {
    background-color : #3b5998
}

.arthref .icon-container ul li a.aDigg {
    background-color : #1b5891
}

.arthref .icon-container ul li a.aDelicious {
    background-color : #3274d1
}

.arthref .icon-container ul li a.aFriendFeed {
    background-color : #5e94d6
}

.arthref .icon-container ul li a.aLinkedIn {
    background-color : #2086bc
}

.arthref .icon-container ul li a.aPaypal {
    background-color : #478fda
}

.arthref .icon-container ul li a.aBehance {
    background-color : #0d8af8
}

.arthref .icon-container ul li a.aFoursquare {
    background-color : #17a4d7
}

.arthref .icon-container ul li a.aWindows {
    background-color : #22aee7
}

.arthref .icon-container ul li a.aSkype {
    background-color : #00aff0
}

.arthref .icon-container ul li a.aTwitter {
    background-color : #00b6f3
}

.arthref .icon-container ul li a.aPosterous {
    background-color : #8ab4cd
}

.arthref .icon-container ul li a.aLastFm {
    background-color : #b70300
}

.arthref .icon-container ul li a.aQuora {
    background-color : #c21d11
}

.arthref .icon-container ul li a.aYouTube {
    background-color : #c8312b
}

.arthref .icon-container ul li a.aPinterest {
    background-color : #cb2027
}

.arthref .icon-container ul li a.aPath {
    background-color : #bf3119
}

.arthref .icon-container ul li a.aGooglePlus {
    background-color : #cf4231
}

.arthref .icon-container ul li a.aFlud {
    background-color : #ff503e
}

.arthref .icon-container ul li a.aStumbleUpon {
    background-color : #eb4924
}

.arthref .icon-container ul li a.aReddit {
    background-color : #ff500f
}

.arthref .icon-container ul li a.aRSS {
    background-color : #f72
}

.arthref .icon-container ul li a.aScoutzie {
    background-color : #f87242
}

.arthref .icon-container ul li a.aBlogger {
    background-color : #fc9c4a
}

.arthref .icon-container ul li a.aGrovershark {
    background-color : #fca204
}

.arthref .icon-container ul li a.aAIM {
    background-color : #ffba00
}

.arthref .icon-container ul li a.aYahoo {
    background-color : #640e6b
}

.arthref .icon-container ul li a.aFlickr {
    background-color : #ff0084
}

.arthref .icon-container ul li a.aDribbble, .arthref .icon-container ul li a.aDribble {
    background-color : #ff0084
}

.arthref .icon-container ul li a.aInstagram {
    background-color : #723f2d
}

.arthref .icon-container ul li a span {
    display    : block;
    width      : 80px;
    height     : 80px;
    background : url('../images/social-sprite.png') no-repeat
}

.arthref .icon-container ul li a {
    background-image : -webkit-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .15) 0, rgba(0, 0, 0, .15) 100%);
    background-image : -moz-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .15) 0, rgba(0, 0, 0, .15) 100%);
    background-image : -o-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .15) 0, rgba(0, 0, 0, .15) 100%);
    background-image : -ms-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .15) 0, rgba(0, 0, 0, .15) 100%);
    background-image : radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .15) 0, rgba(0, 0, 0, .15) 100%)
}

.arthref .icon-container ul li:hover a {
    background-image : -webkit-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .3) 0, rgba(0, 0, 0, .3) 100%);
    background-image : -moz-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .3) 0, rgba(0, 0, 0, .3) 100%);
    background-image : -o-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .3) 0, rgba(0, 0, 0, .3) 100%);
    background-image : -ms-radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .3) 0, rgba(0, 0, 0, .3) 100%);
    background-image : radial-gradient(center center, 80px 80px, rgba(255, 255, 255, .3) 0, rgba(0, 0, 0, .3) 100%)
}

.arthref .launchpad .icon-container ul {
    -webkit-transform-origin : center 20%;
    -webkit-transform        : scale(0.8);
    -moz-transform-origin    : center 20%;
    -moz-transform           : scale(0.8);
    -o-transform-origin      : center 20%;
    -o-transform             : scale(0.8);
    -ms-transform-origin     : center 20%;
    -ms-transform            : scale(0.8);
    transform-origin         : center 20%;
    transform                : scale(0.8)
}

.arthref .launchpad.active .icon-container ul {
    -webkit-transform : scale(1);
    -moz-transform    : scale(1);
    -o-transform      : scale(1);
    -ms-transform     : scale(1);
    transform         : scale(1)
}

.arthref .launchpadReverse .icon-container ul {
    -webkit-transform-origin : center 20%;
    -webkit-transform        : scale(1.2);
    -moz-transform-origin    : center 20%;
    -moz-transform           : scale(1.2);
    -o-transform-origin      : center 20%;
    -o-transform             : scale(1.2);
    -ms-transform-origin     : center 20%;
    -ms-transform            : scale(1.2);
    transform-origin         : center 20%;
    transform                : scale(1.2)
}

.arthref .launchpadReverse.active .icon-container ul {
    -webkit-transform : scale(1);
    -moz-transform    : scale(1);
    -o-transform      : scale(1);
    -ms-transform     : scale(1);
    transform         : scale(1)
}

.arthref .slideTop {
    top : -100%
}

.arthref .slideTop.active {
    top : 0
}

.arthref .slideRight {
    left : 100%
}

.arthref .slideRight.active {
    left : 0
}

.arthref .slideBottom {
    top : 100%
}

.arthref .slideBottom.active {
    top : 0
}

.arthref .slideLeft {
    left : -100%
}

.arthref .slideLeft.active {
    left : 0
}

.arthref .chain .icon-container ul li {
    opacity : 0
}

.blurred {
    -webkit-transition : -webkit-filter 300ms ease-in-out;
    -moz-transition    : -moz-filter 300ms ease-in-out;
    -o-transition      : -o-filter 300ms ease-in-out;
    -ms-transition     : -ms-filter 300ms ease-in-out;
    transition         : filter 300ms ease-in-out;
    -webkit-filter     : blur(15px)
}

.jssorb03 {
    position : absolute;
}

.jssorb03 div, .jssorb03 div:hover, .jssorb03 .av {
    position    : absolute;
    /* size of bullet elment */
    width       : 21px;
    height      : 21px;
    text-align  : center;
    line-height : 21px;
    color       : white;
    font-size   : 12px;
    background  : url('img/b03.png') no-repeat;
    overflow    : hidden;
    cursor      : pointer;
}

.jssorb03 div {
    background-position : -5px -4px;
}

.jssorb03 div:hover, .jssorb03 .av:hover {
    background-position : -35px -4px;
}

.jssorb03 .av {
    background-position : -65px -4px;
}

.jssorb03 .dn, .jssorb03 .dn:hover {
    background-position : -95px -4px;
}

/* jssor slider arrow navigator skin 03 css */
/*
.jssora03l                  (normal)
.jssora03r                  (normal)
.jssora03l:hover            (normal mouseover)
.jssora03r:hover            (normal mouseover)
.jssora03l.jssora03ldn      (mousedown)
.jssora03r.jssora03rdn      (mousedown)
.jssora03l.jssora03ldn      (disabled)
.jssora03r.jssora03rdn      (disabled)
*/
.jssora03l, .jssora03r {
    display    : block;
    position   : absolute;
    /* size of arrow element */
    width      : 55px;
    height     : 55px;
    cursor     : pointer;
    background : url('img/a03.png') no-repeat;
    overflow   : hidden;
}

.jssora03l {
    background-position : -3px -33px;
}

.jssora03r {
    background-position : -63px -33px;
}

.jssora03l:hover {
    background-position : -123px -33px;
}

.jssora03r:hover {
    background-position : -183px -33px;
}

.jssora03l.jssora03ldn {
    background-position : -243px -33px;
}

.jssora03r.jssora03rdn {
    background-position : -303px -33px;
}

.jssora03l.jssora03lds {
    background-position : -3px -33px;
    opacity             : .3;
    pointer-events      : none;
}

.jssora03r.jssora03rds {
    background-position : -63px -33px;
    opacity             : .3;
    pointer-events      : none;
}