body
{
    position:absolute;
    font-family: 'sanfranbold', Arial, sans-serif;
    line-height:1.1;
    font-size:1.75em;
    background: rgba(255,255,255,0);
    margin: 0px;
    overflow: hidden;
    left:0%;
    width:100%;
    height:100%;
    position: fixed;
}

.webLink
{
    position:relative;
    height:auto;
    display:block;
    overflow:auto;
    width:80%;
    margin-left:6%;
    padding:20px;
    background:#e86aa5;
    border-radius:10px;
    color:white;
    text-align:center;
    top:40px;
    margin-bottom:50px;
}

.datesPanels
{
    position:relative;
    height:100%;
    display:block;
    overflow:auto;
}

.datesPanelHolder
{
    position:relative;
    width:94%;
    margin-left:3%;
    height:auto;
    padding-bottom:20px;
    display:block;
    overflow:auto;
}

.datesPanelCol1
{
    position:relative;
    color:#e86aa5;
    width:20%;
    height:auto;
    float:left;
    display:block;
    overflow:none;
    text-align:right;
}

.datesPanelCol2
{
    position:relative;
    color:#4688fb;
    width:78%;
    margin-left:2%;
    height:auto;
    float:left;
    display:block;
    overflow:none;
}

.hashTag
{
    position:relative;
    color:black;
    font-size:80%;
    width:80%;
    margin-left:10%;
    height:auto;
    float:left;
    display:block;
    overflow:none;
    text-align:center;
    margin-top:20px;
}

a
{
    color:#4688fb;
    underline:none;
    text-decoration: none;
}

.dateDetails
{
    font-family: 'sanfranregular', Arial, sans-serif;
    color:rgba(20,20,20,1);
    overflow:none;
}

#immiIMGContainer
{
    position:absolute;
    width:800px
    left:50%;
    top:-100px;
    display:block;
    overflow:auto;
}

#stageContainer
{
    position:absolute;
    width:100%;
    height:100%;
    overflow: none;
}

#datesContainer
{
    position:absolute;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 1%, rgba(255,255,255,0.2) 10%, rgba(255,255,255,1) 47%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 1%,rgba(255,255,255,0.2) 10%,rgba(255,255,255,1) 47%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 1%,rgba(255,255,255,0.2) 10%,rgba(255,255,255,1) 47%,rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
    width:100%;
    height:70%;
    right:0px;
    top:30%;
    z-index:10;
    overflow: scroll;
}

#immiPanel
{
    position:absolute;
    background:rgba(255,255,255,0);
    width:100%;
    height:100%;
    left:0px;
    top:0px;
    z-index:1;
    overflow:hidden;
}

@media screen and (min-width: 600px)
{
    .datesPanelHolder
    {
        position:relative;
        top:20px;
        width:90%;
        margin-left:5%;
        height:auto;
        display:block;
        overflow:auto;
    }
    
    #stageContainer
    {
        position:absolute;
        width:100%;
        height:100%;
        overflow: none;
    }
    
    #datesContainer
    {
        position:absolute;
        background: -moz-linear-gradient(top, rgba(255,255,255,0) 1%, rgba(255,255,255,0.2) 10%, rgba(255,255,255,1) 47%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(top, rgba(255,255,255,0) 1%,rgba(255,255,255,0.2) 10%,rgba(255,255,255,1) 47%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to bottom, rgba(255,255,255,0) 1%,rgba(255,255,255,0.2) 10%,rgba(255,255,255,1) 47%,rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
        width:100%;
        height:55%;
        right:0px;
        top:45%;
        z-index:10;
        overflow: scroll;
    }

    #immiPanel
    {
        position:absolute;
        background:red;
        width:100%;
        height:100%;
        left:0px;
        top:0px;
        z-index:1;
    }
}

@media only screen and (min-width: 900px) and (orientation : landscape)
{
    .datesPanelHolder
    {
        position:relative;
        top:20px;
        width:80%;
        margin-left:10%;
        height:auto;
        display:block;
        overflow:auto;
    }
    
    #datesContainer
    {
        position:absolute;
        background:rgba(255,255,255,0.6);
        min-width: 380px;
        width:40%;
        height:100%;
        right:0px;
        top:0px;
        z-index:10;
        overflow:scroll;
    }
    
    #stageContainer
    {
        position:absolute;
        width:100%;
        height:100%;
        overflow: none;
    }

    #immiPanel
    {
        position:absolute;
        background:red;
        min-width: 300px;
        width:60%;
        height:100%;
        left:0px;
        top:0px;
        z-index:1;
    }
}


.greyscale
{
    -webkit-filter: grayscale(100%);
}

#scratch
{
    width:0%;
    height:0%;
    visibility:hidden;
}

#threeContainer
{
    position:absolute;
    left:0%;
    top:0%;
    background-color: rgba(0,0,0,0);
    overflow:hidden;
}

#modal
{
    width:100%;
    height:100%;
    position:absolute;
    left:0%;
    top:0%;
    background-color: rgba(40,40,40,1);
    visibility:hidden;
    z-index:20;
}

#loadingPackageModal
{
    position:absolute;
    width:100%;
    height:100%;
    left:0%;
    top:0%;
    background-color: rgba(40,40,40,0.5);
    z-index:20;
}

#appControls
{
    position:absolute;
    left:0%;
    top:0%;
    width:100%;
    height:100%;
    background-color: rgba(255,0,0,0);
    z-index:12;
    pointer-events: none;
    overflow: hidden;

}

#overlayContainer
{
    position:absolute;
    left:0%;
    top:0%;
    width:100%;
    height:100%;
    background-color: rgba(255,0,0,0);
    z-index:10;
    pointer-events: none;
    overflow: hidden;
}

.noclick
{
    pointer-events: none;
}

.noselect
{
    -webkit-user-select: none;
    -khtml-user-select: none;
}

.blur20
{
    -webkit-filter: blur(20px);
    -Moz-filter: blur(20px);
    -o-filter: blur(20px);
    -ms-filter: blur(20px);
    filter: blur(20px);
}


.vignette
{
    background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.01) 1%, rgba(0,0,0,0.1) 51%, rgba(0,0,0,0.75) 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.01) 1%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.75) 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, rgba(0,0,0,0.01) 1%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.75) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.vignetteDark
{
    background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.01) 1%, rgba(0,0,0,0.2) 51%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.01) 1%,rgba(0,0,0,0.2) 51%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, rgba(0,0,0,0.01) 1%,rgba(0,0,0,0.2) 51%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.whiteGradRight
{
    background: -moz-linear-gradient(left, rgba(255,255,255,0.01) 0%, rgba(255,255,255,1) 98%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 98%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 98%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#03ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
}

.alphaPadding
{
    padding-top: 2px;
    padding-left: 2px;
}

.padding2
{
    padding: 2px;
}

.alphanumerics
{
    float:left;
    text-align:center;
    width:24px;
    height:23px;
    margin-left:1px;
    margin-right:1px;
    padding-top:1px;
    background:rgba(0,0,0,0.0);
}

textarea:focus, searchInput:focus
{
    outline: none;
}

*:focus
{
    outline: none;
}

::-webkit-input-placeholder
{
    color: rgba(240,240,240,0.1);
    font-family: 'sanfranregular', Arial, sans-serif;
}

.border-none
{
    border-style:none;
}

.circlebox
{
    border-radius:50%;
}


.dataView
{
    position:absolute;
    z-index:10;
    pointer-events: none;
    font-size:9px;
    color:white;
    padding:5px;
}

.textWhite
{
    color:rgba(240,240,240,1);
}

.sanfran-ultralight
{
    font-family: 'sanfrandisplay-ultralight', Arial, sans-serif;
}

.sanfran-regular
{
    font-family: 'sanfranregular', Arial, sans-serif;
}

.sanfran-bold
{
    font-family: 'sanfranbold', Arial, sans-serif;
}

.sanfran-black
{
    font-family: 'sanfrandisplay-black', Arial, sans-serif;
}

.font8
{
    font-size:8px;
}

.font12
{
    font-size:12px;
}

.font14
{
    font-size:14px;
}

.font16
{
    font-size:16px;
}

.font18
{
    font-size:18px;
}

.font24
{
    font-size:24px;
}

.font36
{
    font-size:36px;
}

.font48
{
    font-size:48px;
}

.font56
{
    font-size:56px;
}

.align-center
{
    text-align:center;
}

.align-left
{
    text-align:left;
}

.align-right
{
    text-align:right;
}

.align-vertical-center
{
    vertical-align: middle;
}

.kern-200
{
    letter-spacing : 7px;
}

.kern-100
{
    letter-spacing : 3.5px;
}

.kern-20
{
    letter-spacing : 1.5px;
}

.kern-10
{
    letter-spacing : 1.25px;
}

.kern-5
{
    letter-spacing : 1.1px;
}

.text-light
{
    color:rgba(240,240,240,1);
}

.text-medium
{
    color:rgba(140,140,140,1);
}

.text-dark
{
    color:rgba(40,40,40,1);
}

.text-grey
{
    color:rgba(98,98,98,1);
}

.text-nowrap
{
    white-space:nowrap;
}

.textEllipsis
{
    text-overflow: ellipsis;
}

.titleColor
{
    color: rgba(240,240,240,0.75);
}

.lineHeight35
{
    line-height : 135%;
}

.lineHeight0
{
    line-height : 90%;
}

.panelGradGrey
{
    background: -moz-linear-gradient(-45deg, rgba(20,20,20,0) 0%, rgba(20,20,20,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(20,20,20,0) 0%,rgba(20,20,20,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(20,20,20,0) 0%,rgba(20,20,20,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00141414', endColorstr='#a6141414',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.gradUpGrey
{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#141414+0,141414+100&0+0,1+100 */
    background: -moz-linear-gradient(top, rgba(20,20,20,0) 0%, rgba(20,20,20,0.5) 40%, rgba(20,20,20,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(20,20,20,0) 0%, rgba(20,20,20,0.5) 40%,rgba(20,20,20,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(20,20,20,0) 0%, rgba(20,20,20,0.5) 40%,rgba(20,20,20,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00141414', endColorstr='#141414',GradientType=0 ); /* IE6-9 */
}


.logoPulseA
{
    animation-duration: 1s;
    animation-name: goLogoPulse;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.logoPulseB
{
    animation-duration: 1.4s;
    animation-name: goLogoPulse;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.logoPulseC
{
    animation-duration: 1.8s;
    animation-name: goLogoPulse;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

@keyframes goLogoPulse
{
    0%{opacity:0.1;}
    50%{opacity:0.75;}
    100%{opacity:0.1;}
}

.eternalSpin
{
    animation-duration: 2s;
    animation-name: goEternalSpin;
    animation-iteration-count: infinite;
}

@keyframes goEternalSpin
{
    from
    {
        transform: rotate(0deg);
    }
    
    to
    {
        transform: rotate(360deg);
    }
}

.eternalPulse
{
    animation-duration: 1.4s;
    animation-name: goEternalPulse;
    animation-iteration-count: infinite;
}

@keyframes goEternalPulse
{
    0% {-webkit-transform: scale(1, 1); opacity: 0.1;}
    50% {-webkit-transform: scale(1.2, 1.2); opacity: 0.3;}
    100% {-webkit-transform: scale(1, 1); opacity: 0.1;}
}

.introPulse
{
    animation-duration: 1.4s;
    animation-name: goIntroPulse;
    animation-iteration-count: 4;
}

@keyframes goIntroPulse
{
    0% {-webkit-transform: scale(1, 1); opacity: 0.5;}
    50% {-webkit-transform: scale(1.2, 1.2); opacity: 0.75;}
    100% {-webkit-transform: scale(1, 1); opacity: 0.5;}
}


.dropThisIn
{
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: dropThis;
    -webkit-animation-timing-function:ease-out;
    /*    -webkit-animation-direction: alternate;*/
    /*    -webkit-animation-iteration-count: 0;*/
}

@keyframes dropThis
{
    from
    {
        opacity:0;
        -webkit-transform:translateY(-10%);
    }
    
    to
    {
        opacity:1;
        -webkit-transform:translateY(0%);
    }
}

/*------------------------*/

.loaderBox
{
    animation-duration: 1s;
    animation-name: rotateNow;
    animation-iteration-count: infinite;
    /*    animation-direction: alternate;*/
    animation-timing-function: linear;
}

@keyframes rotateNow
{
    from
    {
        transform: rotate(0deg);
    }
    to
    {
        transform: rotate(360deg);
    }
}

.loaderBar
{
    animation-duration: 10s;
    animation-name: growNow;
    /*    animation-iteration-count: 0;*/
    animation-direction: alternate;
    animation-timing-function: linear;
}

@keyframes growNow
{
    from
    {
        width: 0%;
    }
    to
    {
        width: 100%;
    }
}