/**
 * custom
 * place custom style in this file
 * add !important to the end if no effect
 * e.g. color: #fff !important;
 * --------------------------------------------------
 *
 */
.content-top{
	font-size: 15PX;
    font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif;
}
/*.view-header {
	top:5%;
	left: 65%;
}
.label {
	color: #232323;
	font-size: 0.8em;
	font-style: normal;
}*/
.label {
    color: #CFA256;
}
nav.main {
    position: absolute;
    width: 420px;
    max-width: 420px;
    top: 28px;
    right: 150px;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(calc(-50% + 377px)) translateZ(0) scale(.75);
    transform: translateX(calc(-50% + 377px)) translateZ(0) scale(.75);
    backface-visibility: hidden;
		z-index: 20;
}

.mobile.in-game nav.main {
    top: 30px;
    right: -50px
}

nav.main ul {
    line-height: 0;
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: rotateX(-45deg) rotateY(0) rotateZ(-45deg);
    transform: rotateX(-45deg) rotateY(0) rotateZ(-45deg);
    -webkit-transform-style: flat;
    transform-style: flat
}

nav.main ul>li {
    background: linear-gradient(222deg, rgba(207, 194, 184, 1) 80%, rgba(207, 194, 184, .79) 90%, rgba(255, 255, 255, .79) 100%);
    
    margin: 0 6px 6px 0;
    padding: 0;
    display: inline-block;
    position: relative;
    z-index: 1;
    pointer-events: auto;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

nav.main ul>li h3 {
    font-family: Quantico,sans-serif;
    text-transform: uppercase;
}

nav.main ul>li.no-state.open {
    background: linear-gradient(222deg, rgba(0, 0, 0, .62) 0, rgba(0, 0, 0, .72) 61%, rgba(0, 0, 0, .79) 100%)
}

nav.main ul>li.no-state.open a {
    background: linear-gradient(222deg, rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, .2) 61%, rgba(0, 0, 0, .2) 100%);
    color: #fff;
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

nav.main ul>li.no-state.open a h3 {
    text-shadow: 0 0 0 rgba(0, 0, 0, .2);
    display: none
}

nav.main ul>li.no-state.open a .inner::before {
    background-image: none;
    opacity: .16;
    transition: all 0s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li.no-state.open a .inner::after {
    background-image: none;
    opacity: 0;
    transition: all 0s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li.active,
nav.main ul>li.no-state.open a.active {
    background: linear-gradient(222deg, rgba(0, 0, 0, .62) 0, rgba(0, 0, 0, .72) 61%, rgba(0, 0, 0, .79) 100%)
}

nav.main ul>li.no-state.open a.active {
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li.no-state.open a.active h3 {
    color: #fff;
    text-shadow: 0 0 0 rgba(0, 0, 0, .2);
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li.no-state.open a.active .inner::after,
nav.main ul>li.no-state.open a.active .inner::before {
    transition: all 0s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li.no-state.open a.active .inner::before {
    opacity: .16;
    -webkit-transform: translateX(-50%) translateY(-15px) translateZ(0);
    transform: translateX(-50%) translateY(-15px) translateZ(0)
}

nav.main ul>li.no-state.open a.active .inner::after {
    opacity: 0;
    -webkit-transform: translateX(-50%) translateY(15px) translateZ(0);
    transform: translateX(-50%) translateY(15px) translateZ(0)
}

@media (hover:hover) {
    nav.main ul>li.no-state.open a.active:hover,
    nav.main ul>li.no-state.open a:hover {
        background: linear-gradient(222deg, rgba(0, 0, 0, .62) 0, rgba(0, 0, 0, .72) 61%, rgba(0, 0, 0, .79) 100%);
        transition: all .3s cubic-bezier(.455, .03, .515, .955)
    }

    nav.main ul>li.no-state.open a.active:hover h3,
    nav.main ul>li.no-state.open a:hover h3 {
        color: #fff;
        text-shadow: 0 0 0 rgba(0, 0, 0, .2);
        transition: all .3s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li.no-state.open a.active:hover .inner::after,
    nav.main ul>li.no-state.open a.active:hover .inner::before,
    nav.main ul>li.no-state.open a:hover .inner::after,
    nav.main ul>li.no-state.open a:hover .inner::before {
        transition: all 0s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li.no-state.open a.active:hover .inner::before,
    nav.main ul>li.no-state.open a:hover .inner::before {
        opacity: .16;
        -webkit-transform: translateX(-50%) translateY(-15px) translateZ(0);
        transform: translateX(-50%) translateY(-15px) translateZ(0)
    }
    nav.main ul>li.no-state.open a.active:hover .inner::after,
    nav.main ul>li.no-state.open a:hover .inner::after {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(15px) translateZ(0);
        transform: translateX(-50%) translateY(15px) translateZ(0)
    }
}

nav.main ul>li.active,
nav.main ul>li.active a,
nav.main ul>li.active a .inner::after,
nav.main ul>li.active a .inner::before,
nav.main ul>li.active a h3,
nav.main ul>li.active a.active,
nav.main ul>li.active a.active .inner::after,
nav.main ul>li.active a.active .inner::before,
nav.main ul>li.active a.active h3 {
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li.no-state.open .chevron,
nav.main ul>li::before {
    position: absolute;
    left: 50%;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%
}

nav.main ul>li.no-state.open .chevron {
    top: 0;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(10px) translateZ(0) rotateY(45deg) rotateX(-180deg);
    transform: translateX(-50%) translateY(10px) translateZ(0) rotateY(45deg) rotateX(-180deg)
}






nav.main ul>li.small,
nav.main ul>li.small .inner {
    width: 76px;
    height: 76px
}

nav.main ul>li.small a {
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

nav.main ul>li.small a::before {
    width: 68px;
    height: 68px
}

nav.main ul>li.medium,
nav.main ul>li.medium .inner {
    width: 98px;
    height: 98px
}

nav.main ul>li.medium a {
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

nav.main ul>li.medium a::before {
    width: 90px;
    height: 90px
}

nav.main ul>li.large,
nav.main ul>li.large .inner {
    width: 116px;
    height: 116px
}

nav.main ul>li.large a {
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

nav.main ul>li.large a::before {
    width: 108px;
    height: 108px
}

nav.main ul>li.active a {
    background: linear-gradient(222deg, rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, .2) 61%, rgba(0, 0, 0, .2) 100%);
    color: #fff;
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

nav.main ul>li.active a h3 {
    text-shadow: 0 0 0 rgba(0, 0, 0, .2)
}

nav.main ul>li.active a .inner::before {
    opacity: .16
}

nav.main ul>li.active a .inner::after {
    background-image: none;
    opacity: .3
}

nav.main ul>li.active a.active {
    background: linear-gradient(222deg, rgba(0, 0, 0, .62) 0, rgba(0, 0, 0, .72) 61%, rgba(0, 0, 0, .79) 100%)
}

nav.main ul>li.active a.active h3 {
    color: #fff;
    text-shadow: 0 0 0 rgba(0, 0, 0, .2)
}

nav.main ul>li.active a.active .inner::before {
    opacity: .16;
    -webkit-transform: translateX(-50%) translateY(-15px) translateZ(0);
    transform: translateX(-50%) translateY(-15px) translateZ(0)
}

nav.main ul>li.active a.active .inner::after {
    opacity: .34;
    -webkit-transform: translateX(-50%) translateY(15px) translateZ(0);
    transform: translateX(-50%) translateY(15px) translateZ(0)
}

@media (hover:hover) {
    nav.main ul>li.active a.active:hover,
    nav.main ul>li.active a:hover {
        background: linear-gradient(222deg, rgba(0, 0, 0, .62) 0, rgba(0, 0, 0, .72) 61%, rgba(0, 0, 0, .79) 100%);
        transition: all .3s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li.active a.active:hover h3,
    nav.main ul>li.active a:hover h3 {
        color: #fff;
        text-shadow: 0 0 0 rgba(0, 0, 0, .2);
        transition: all .3s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li.active a.active:hover .inner::after,
    nav.main ul>li.active a.active:hover .inner::before,
    nav.main ul>li.active a:hover .inner::after,
    nav.main ul>li.active a:hover .inner::before {
        transition: all .3s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li.active a.active:hover .inner::before,
    nav.main ul>li.active a:hover .inner::before {
        opacity: .16;
        -webkit-transform: translateX(-50%) translateY(-15px) translateZ(0);
        transform: translateX(-50%) translateY(-15px) translateZ(0)
    }
    nav.main ul>li.active a.active:hover .inner::after,
    nav.main ul>li.active a:hover .inner::after {
        opacity: .34;
        -webkit-transform: translateX(-50%) translateY(15px) translateZ(0);
        transform: translateX(-50%) translateY(15px) translateZ(0)
    }
}

nav.main ul>li::before {
    content: '';
    width: 100%;
    height: 100%;
    border: 0 solid rgba(115, 115, 115, .25);
    top: 50%;
    opacity: 0;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0);
    transform: translateX(-50%) translateY(-50%) translateZ(0);
    transition: all .4s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li a,
nav.main ul>li a.active {
    transition: all .3s cubic-bezier(.455, .03, .515, .955), color .1s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li.clicked::before {
    -webkit-animation: material .8s cubic-bezier(.455, .03, .515, .955);
    animation: material .8s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li a {
    background: linear-gradient(222deg, rgba(207, 194, 184, .22) 0, rgba(207, 194, 184, .22) 61%, rgba(255, 255, 255, .22) 100%);
    color: #4c3f48;
    display: block;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 6px transparent;
    position: relative;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    pointer-events: all;
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

nav.main ul>li a.active {
    background: linear-gradient(222deg, rgba(207, 194, 184, .79) 0, rgba(207, 194, 184, .79) 61%, rgba(255, 255, 255, .79) 100%);
    color: #7c4d47;
    box-shadow: -10px 10px 0 rgba(0, 0, 0, .22);
    -webkit-transform: translate(20px, -20px) translateZ(0);
    transform: translate(20px, -20px) translateZ(0);
    cursor: pointer
}

nav.main ul>li a.active h3 {
    text-shadow: 0 0 0 rgba(238, 234, 231, 0);
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li a.active::before {
    border: 1px solid rgba(204, 121, 47, .92);
    box-shadow: -2px 0 0 rgba(108, 63, 79, .2), 0 2px 0 rgba(108, 63, 79, .2), inset -1px 1px 2px rgba(108, 63, 79, .5);
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li a.active .inner::after,
nav.main ul>li a.active .inner::before {
    opacity: 1;
    transition: all .3s cubic-bezier(.455, .03, .515, .955);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

nav.main ul>li a.active .inner::before {
    -webkit-transform: translateX(-50%) translateY(-15px) translateZ(0);
    transform: translateX(-50%) translateY(-15px) translateZ(0)
}

nav.main ul>li a.active .inner::after {
    -webkit-transform: translateX(-50%) translateY(15px) translateZ(0);
    transform: translateX(-50%) translateY(15px) translateZ(0)
}

@media (hover:hover) {
    nav.main ul>li a.active:hover {
        background: linear-gradient(222deg, rgba(207, 194, 184, .79) 0, rgba(207, 194, 184, .79) 61%, rgba(255, 255, 255, .79) 100%);
        color: #7c4d47;
        box-shadow: -10px 10px 0 rgba(0, 0, 0, .22);
        -webkit-transform: translate(20px, -20px) translateZ(0);
        transform: translate(20px, -20px) translateZ(0);
        cursor: pointer;
        transition: all .3s cubic-bezier(.455, .03, .515, .955), color .1s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li a.active:hover h3 {
        text-shadow: 0 0 0 rgba(238, 234, 231, 0);
        transition: all .3s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li a.active:hover::before {
        border: 1px solid rgba(204, 121, 47, .92);
        box-shadow: -2px 0 0 rgba(108, 63, 79, .2), 0 2px 0 rgba(108, 63, 79, .2), inset -1px 1px 2px rgba(108, 63, 79, .5);
        transition: all .3s cubic-bezier(.455, .03, .515, .955)
    }
    nav.main ul>li a.active:hover .inner::after,
    nav.main ul>li a.active:hover .inner::before {
        opacity: 1;
        transition: all .3s cubic-bezier(.455, .03, .515, .955);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }
    nav.main ul>li a.active:hover .inner::before {
        -webkit-transform: translateX(-50%) translateY(-15px) translateZ(0);
        transform: translateX(-50%) translateY(-15px) translateZ(0)
    }
    nav.main ul>li a.active:hover .inner::after {
        -webkit-transform: translateX(-50%) translateY(15px) translateZ(0);
        transform: translateX(-50%) translateY(15px) translateZ(0)
    }
}

nav.main ul>li .inner::after,
nav.main ul>li .inner::before {
    opacity: .9;
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}
.btn-subscribe {
    background: linear-gradient(222deg, rgba(207, 194, 184, .22) 0, rgba(207, 194, 184, .22) 61%, rgba(255, 255, 255, .22) 100%);
    color: #4c3f48;
    display: inline-block;
    width: 100px;
    height: 100px;
    box-shadow: 0 0 6px transparent;
    position: relative;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    pointer-events: all;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    border: none;
       
    background: linear-gradient(222deg, rgba(207, 194, 184, .79) 0, rgba(207, 194, 184, .79) 61%, rgba(255, 255, 255, .79) 100%);
}

.btn-subscribe::before{
    content: '';
    position: absolute;
    display: block;
    width: 92px;
    height: 92px;
    border: 1px solid #eeeae7;
    box-shadow: -2px 0 0 rgba(108, 63, 79, .2), 0 2px 0 rgba(108, 63, 79, .2), inset -1px 1px 2px rgba(108, 63, 79, .5);
    top: 4px;
    left: 4px;
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}
.btn-subscribe .wrapper {
    height: 100px;
}
.btn-subscribe .wrapper .inner {
    text-align: center;
    width: 100px;
    height: 100px;
    position: relative;
    -webkit-transform: rotateX(0) rotateY(0) rotateZ(45deg);
    transform: rotateX(0) rotateY(0) rotateZ(45deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    pointer-events: none;
}

.btn-subscribe .wrapper .inner::before{
    background-image: url(../img/upper.png);
    top: 0;
    -webkit-transform: translateX(-50%) translateY(-25px) translateZ(0);
    transform: translateX(-50%) translateY(-25px) translateZ(0);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    content: '';
    width: 122px;
    height: 75px;
    z-index: -1;
    pointer-events: none;
    transform-origin: 50% 50%;
    position: absolute;
    left: 50%;
}
.btn-subscribe .wrapper .inner:after {
    background-image: url(../img/lower.png);
    bottom: -50px;
    -webkit-transform: translateX(-50%) translateY(-25px) translateZ(0);
    transform: translateX(-50%) translateY(-25px) translateZ(0);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    content: '';
    width: 122px;
    height: 75px;
    z-index: -1;
    pointer-events: none;
    transform-origin: 50% 50%;
    position: absolute;
    left: 50%;
}

.btn-subscribe .wrapper .inner img{ 
    position: absolute;
    left: 50%;
    bottom: 0;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(10px) translateZ(0) rotateY(45deg);
    transform: translateX(-50%) translateY(10px) translateZ(0) rotateY(45deg);
}
.btn-subscribe .small-img.boing {

    -webkit-animation: bippity-boppity-boo .8s cubic-bezier(.455, .03, .515, .955);
    animation: bippity-boppity-boo .8s cubic-bezier(.455, .03, .515, .955)

}
.controls .inner img {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(6px) translateZ(0) rotateY(45deg);
    transform: translateX(-50%) translateY(6px) translateZ(0) rotateY(45deg);
}
.controls .small_img.boing{
     -webkit-animation: bippity-boppity-boo-sec .8s cubic-bezier(.455, .03, .515, .955);
    animation: bippity-boppity-boo-sec .8s cubic-bezier(.455, .03, .515, .955)
}
.btn-subscribe .wrapper .inner h3{
    color: #4c3f48;
    font-size: 1.5em;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .2px;
    text-shadow: 0 2px 0 rgba(238, 234, 231, .43);
    margin: 0;
    padding: 0;
    display: block;
    top: 50%;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) rotateY(45deg);
    transform: translateX(-50%) translateY(-50%) translateZ(0) rotateY(45deg);
    position: absolute;
    left: 50%;
    font-family: Quantico,sans-serif;
    text-transform: uppercase;
}
div.btn-wrap a.active {
    background: linear-gradient(222deg, rgba(207, 194, 184, .79) 0, rgba(207, 194, 184, .79) 61%, rgba(255, 255, 255, .79) 100%);
    color: #7c4d47;
    box-shadow: -10px 10px 0 rgba(0, 0, 0, .22);
    -webkit-transform: translate(20px, -20px) translateZ(0);
    transform: translate(20px, -20px) translateZ(0);
    cursor: pointer;
    transition: all .3s cubic-bezier(.455, .03, .515, .955), color .1s cubic-bezier(.455, .03, .515, .955);
}
div.btn-wrap a.active::before {
    border: 1px solid rgba(204, 121, 47, .92);
    box-shadow: -2px 0 0 rgba(108, 63, 79, .2), 0 2px 0 rgba(108, 63, 79, .2), inset -1px 1px 2px rgba(108, 63, 79, .5);
    transition: all .3s cubic-bezier(.455, .03, .515, .955);
}
div.btn-wrap a.active .inner::after, div.btn-wrap a.active .inner::before {
    opacity: 1;
    transition: all .3s cubic-bezier(.455, .03, .515, .955);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.phase {
    background: linear-gradient(222deg, rgba(207, 194, 184, .79) 0, rgba(207, 194, 184, .79) 61%, rgba(255, 255, 255, .79) 100%);
    margin: 0 6px 6px 0;
    padding: 0;
    display: inline-block;
    position: relative;
    z-index: 1;
    pointer-events: auto;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: rotateX(-45deg) rotateY(0) rotateZ(-45deg);
    transform: rotateX(-45deg) rotateY(0) rotateZ(-45deg);
    width: 100px;
    height: 100px;
}
nav.main ul>li a::before {
    content: '';
    position: absolute;
    display: block;
    width: 132px;
    height: 132px;
    border: 1px solid #eeeae7;
    box-shadow: -2px 0 0 rgba(108, 63, 79, .2), 0 2px 0 rgba(108, 63, 79, .2), inset -1px 1px 2px rgba(108, 63, 79, .5);
    top: 4px;
    left: 4px;
    transition: all .3s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul>li .inner {
    text-align: center;
    width: 140px;
    height: 140px;
    position: relative;
    -webkit-transform: rotateX(0) rotateY(0) rotateZ(45deg);
    transform: rotateX(0) rotateY(0) rotateZ(45deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    pointer-events: none
}

nav.main ul>li .inner::after,
nav.main ul>li .inner::before,
nav.main ul>li h3 {
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    position: absolute;
    left: 50%
}

nav.main ul>li .inner::after,
nav.main ul>li .inner::before {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    content: '';
    width: 122px;
    height: 75px;
    z-index: -1;
    pointer-events: none;
    transform-origin: 50% 50%
}

nav.main ul>li .inner::before {
    background-image: url(../img/upper.png);
    top: 0;
    -webkit-transform: translateX(-50%) translateY(-25px) translateZ(0);
    transform: translateX(-50%) translateY(-25px) translateZ(0)
}

nav.main ul>li .inner::after {
    background-image: url(../img/lower.png);
    bottom: 0;
    -webkit-transform: translateX(-50%) translateY(25px) translateZ(0);
    transform: translateX(-50%) translateY(25px) translateZ(0)
}

nav.main ul>li h3 {
		color: #4c3f48;
    font-size: 1.5em;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .2px;
    text-shadow: 0 2px 0 rgba(238, 234, 231, .43);
    margin: 0;
    padding: 0;
    display: block;
    top: 50%;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) rotateY(45deg);
    transform: translateX(-50%) translateY(-50%) translateZ(0) rotateY(45deg)
}

.modal>.inner>.modal-content .modal-body h1,
.modal>.inner>.modal-content .modal-body h2 {
    letter-spacing: 1px;
    font-family: "Titillium Web", sans-serif;
    font-weight: 700;
    line-height: 1.125;
    transition: all .4s cubic-bezier(.455, .03, .515, .955)
}

.modal>.inner,
nav.main ul>li .chevron {
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%
}

nav.main ul>li .chevron {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(10px) translateZ(0) rotateY(45deg);
    transform: translateX(-50%) translateY(10px) translateZ(0) rotateY(45deg)
}

nav.main ul>li .chevron.boing {
    -webkit-animation: bippity-boppity-boo .8s cubic-bezier(.455, .03, .515, .955);
    animation: bippity-boppity-boo .8s cubic-bezier(.455, .03, .515, .955)
}

nav.main ul.mobile>li a.active {
    box-shadow: 0 0 6px transparent;
    -webkit-transform: translate(0, 0) translateZ(0);
    transform: translate(0, 0) translateZ(0)
}
.shares.global .controls > li a.active {
    background: linear-gradient(222deg, rgba(207, 194, 184, .79) 0, rgba(207, 194, 184, .79) 61%, rgba(255, 255, 255, .79) 100%);
    color: rgb(124, 77, 71);
    box-shadow: rgba(0, 0, 0, 0.109804) -8px 8px 0px;
    transform: translate(15px, -15px);
    backface-visibility: hidden;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.1s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.shares.global .controls > li a.active::before {
    box-shadow: rgba(108, 63, 79, 0.2) -2px 0px 0px, rgba(108, 63, 79, 0.2) 0px 2px 0px, rgba(108, 63, 79, 0.498039) -1px 1px 2px inset;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(238, 234, 231, 0.419608);
    border-image: initial;
    transition: all 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.mobile div.shares {
    top: -60px;
   
    z-index: 99;
    display: block;
}
.google-btn {
    top: -53px;
    left: 40px;
}
.twitter-btn {
    top: -1px;
    right: 8px;
}
.facebook-btn {
    top: 2px;
    right: 8px;
}
.footer-google {
    left: 120%;
    top: -53px;
}
.footer-twitter {
    top: -4px; 
    left: 2px;
}
@media (hover:hover) {
    nav.main ul.mobile>li a.active:hover {
        box-shadow: 0 0 6px transparent;
        -webkit-transform: translate(0, 0) translateZ(0);
        transform: translate(0, 0) translateZ(0)
    }
}

nav.main ul.mobile>li.phase-2:nth-of-type(1),
nav.main ul.mobile>li.phase-2:nth-of-type(3) {
    margin-left: 140px
}
nav.main ul.mobile>li.phase-2:nth-of-type(4){
    margin-left: -74px;
  
    margin-bottom: 25px;
    left: -20px;
}
nav.main ul.mobile>li.phase-2:nth-of-type(5) {
   
    margin-left: 38px;
    
}

nav.main ul.mobile>li.phase-2:nth-of-type(6) {
    margin-left: -5px;
}
nav.main ul.mobile>li.phase-2:nth-of-type(9) {
    margin-right: -10px;
    margin-left: 32px;
}
nav.main ul.mobile>li.phase-2:nth-of-type(7){
    margin-left: -3px;
}
nav.main ul.mobile>li.phase-2:nth-of-type(11){
    margin-left: 30px;
}

nav.main ul.mobile>li.phase-2:nth-of-type(10) {
    margin-right: 150px;
    margin-left: 13px;
}

.in-game nav.main ul.mobile>li {
    display: none;
}

.in-game nav.main ul.mobile>li:nth-of-type(1) {
    display: block;
    visibility: visible!important;
    opacity: 1!important;
}
.shares.global{
    position: relative;
    z-index: 99;

}
.mobile-social-btn {
    display: none;
}
.shares.global .controls {
    width: 100%;
    max-width: 40px;
    -webkit-transform: rotateX(-45deg) rotateY(0) rotateZ(-45deg);
    transform: rotateX(-45deg) rotateY(0) rotateZ(-45deg);
    -webkit-transform-style: flat;
    transform-style: flat;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    right: 35px;
    top: -15px;
}
.controls {
    right: 10%;
}
.shares .controls {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.shares.global .controls>li {
    background: linear-gradient(135deg,rgba(255,255,255,.76) 0,rgba(194,194,194,.76) 100%);
    width: 40px;
    height: 40px;
}
.shares .controls>li {
    margin: 0;
    padding: 0;
    display: inline-block;
    position: relative;
}
.shares.global .controls>li a {
    color: #958f8d;
    display: block;
    position: relative;
    pointer-events: auto;
}
.shares.global .controls>li a, .shares.global .controls>li a::before {
    width: 100%;
    background: linear-gradient(222deg, rgba(207, 194, 184, .79) 0, rgba(207, 194, 184, .79) 61%, rgba(255, 255, 255, .79) 100%);
    height: 100%;
    transition: all .3s cubic-bezier(.455,.03,.515,.955);
}
.shares.global .controls>li a::before {
    content: '';
    border: 2px solid rgba(238,234,231,.56);
    box-shadow: -2px 0 0 rgba(108,63,79,.2), 0 2px 0 rgba(108,63,79,.2), inset -1px 1px 2px rgba(108,63,79,.5);
    position: absolute;
}
.shares.global .controls>li a>.inner {
    text-align: center;
    width: 40px;
    height: 40px;
    position: relative;
    -webkit-transform: rotateX(0) rotateY(0) rotateZ(45deg);
    transform: rotateX(0) rotateY(0) rotateZ(45deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.shares.global .controls>li a>.inner>i {
    position: absolute;
    top: 50%;
    transform-origin: 50% 50%;
    transform: translateX(-50%) translateY(-50%);
}
.shares.global .controls>li a>.inner>i{
    left: 50%;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    color: #CFA256;
}

.small_img {
    width: 20px;
}
.fa-lg {
    font-size: 1.3333333333em;
    line-height: .75em;
    vertical-align: -15%;
}
.fa {
    font: normal normal normal 14px/1 FontAwesome;

    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
}
.fa, .fa-stack {
    display: inline-block;
}
.fa-twitter::before {
    content: "?";
}
.modal,
.overlay {
    visibility: hidden
}

.mobile nav.main {
    top: 63px;
    right: 41px;
    left: auto;
}

.left-content{text-align:left}
.popup-overlay{margin-top:50px;margin-bottom:5px;}
.ahidden{opacity:0;visibility:hidden;display:none }
.ahidden.active{opacity:1;visibility:visible;display:block;}
.popup-overlay a{border:1px solid #fff;border-radius:3px;display:inline-block}
.app-icon ul{padding-left:0}
.second-link{padding-left:180px}
.third-link{padding-left:330px}

.app-icon ul li{position:relative;cursor:pointer;margin-right:12px;display:inline-block}
.app-icon ul li .overlay-effect{ position:absolute;left:0;right:0;height:100%;background-color: rgba(42, 43, 47, 0.8);top:0;text-align:center;        opacity: 0;border-radius:5px;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;}
	
	.app-icon ul li:hover .overlay-effect:before, .app-icon ul li:hover  .overlay-effect:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
	
	
	

.app-icon ul li .overlay-effect:before, .app-icon ul li.active .overlay-effect:before, .app-icon ul li .overlay-effect:after, .app-icon ul li.active  .overlay-effect:after {
    position: absolute;
    top: 15px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.6s;
}

.app-icon ul li .overlay-effect:before,  .app-icon ul li.active .overlay-effect:before {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: scale(0,1);
    transform: scale(0,1);opacity:1;
	
	
}
.app-icon ul li .overlay-effect:after, .app-icon ul li.active .overlay-effect:after {
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
    -webkit-transform: scale(1,0);
    transform: scale(1,0);
	opacity:1;
}
	.app-icon ul li:hover .overlay-effect, .app-icon ul li.active .overlay-effect{ 
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;}

	
.normal-width{max-width:500px;font-size:25px;line-height:30px;padding-top:30px;}
.get-notified.overflow-hidden {
	  top: -110px;
	  position: relative;
    overflow: hidden;
}.coutdown.overflow-hidden {
    float: left;
    left: 0;
    overflow: hidden;
    position: relative;
    top: 0 !important;
    width: 50%; margin-top: 22px;
}.site-nav__cell, .section__cell{     display: table-cell;}
.site-header__logo{width:190px;}
#about .section__heading.row .col-xs-12{margin-top:0 !important}
.termspage a{text-decoration:underline;color:#000}
.termspage a:hover{color:#CFA256}
 .masonryItemDesc{ -webkit-transform: translate(-50%, 50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
   -webkit-transform: translate(-50%, -50%);	
   color: rgba(255, 255, 255, 0.9);
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 999;
    margin-right: -50%;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;}
	
   .overlay-effect p {
    color: #CFA256;
    display: block;
    height: 10%;
    height: calc(100% / 3);
	    font-size: 1.125rem;
    text-transform: initial;
    margin-bottom: 6px
    min-height: 10px;
}
   
   
@media (min-width:19em) {
   /* nav.main { */
        /* max-width: 440px; */
        /* top: 0; */
        /* left: 0; */
        /* -webkit-transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.66); */
        /* transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.66) */
    /* } */
    nav.main ul {
        top: -360px
    }
    nav.main ul>li.phase-2:nth-of-type(1) {
        margin-left: 17px
    }
    nav.main ul>li.phase-2:nth-of-type(2) {
        margin-right: 117px
    }
    nav.main ul>li.phase-2:nth-of-type(3) {
        margin-left: 104px
    }
    nav.main ul>li.phase-2:nth-of-type(4) {
        margin-right: 80px;
        margin-left: 38px;
        margin-bottom: 44px
    }
    nav.main ul>li.phase-2:nth-of-type(6) {
        margin-right: 0;
        margin-left: 0
    }
    nav.main ul>li.phase-2:nth-of-type(7),
    nav.main ul>li.phase-2:nth-of-type(8) {
        margin-right: 0;
        margin-left: 6px
    }
    nav.main ul>li.phase-2:nth-of-type(10) {
        margin-right: 80px
    }
    nav.main ul>li.phase-2:nth-of-type(11) {
        margin-left: 104px
    }
	.app-icon ul li {
     
    margin-bottom: 10px;
    
}
.normal-width {
    max-width: 500px;
    font-size: 16px;
    line-height: 25px;
    padding-top: 30px;
}.get-notified.overflow-hidden {
    top: 30px;
    position: relative;
    overflow: hidden;
}
.digit {
    font-size: 16px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
}.coutdown.overflow-hidden {
    float: left;
    left: 0;
    overflow: hidden;
    position: relative;
    top: 0;
    width: 50%;
}.site-header__logo {
    float: left;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    width: 120px;
}.site-header__logo img {
    display: block;
    height: auto;
}#countdown_dashboard {
    margin: 0px 0 0;
}.coutdown.overflow-hidden {
     margin-top: 0px;
}
.site-footer .shares.global{display:none}
.site-footer {
    position: relative;
    display: block;
    top: 240px;
    padding-top: 0px;
}.second-link{padding-left:100px}
.third-link{padding-left:250px}


}

@media (min-width:34.375em) {
    /* nav.main { */
        /* max-width: 440px; */
        /* top: 0; */
        /* left: 0; */
        /* -webkit-transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.66); */
        /* transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.66) */
    /* } */
    nav.main ul {
        top: -360px
    }
    nav.main ul>li.phase-2:nth-of-type(1) {
        margin-left: 17px
    }
    nav.main ul>li.phase-2:nth-of-type(2) {
        margin-right: 117px
    }
    nav.main ul>li.phase-2:nth-of-type(3) {
        margin-left: 104px
    }
    nav.main ul>li.phase-2:nth-of-type(4) {
        margin-right: 80px;
        margin-left: 38px;
        margin-bottom: 44px
    }
    nav.main ul>li.phase-2:nth-of-type(6) {
        margin-right: 0;
        margin-left: 0
    }
    nav.main ul>li.phase-2:nth-of-type(7),
    nav.main ul>li.phase-2:nth-of-type(8) {
        margin-right: 0;
        margin-left: 6px
    }
    nav.main ul>li.phase-2:nth-of-type(10) {
        margin-right: 80px
    }
    nav.main ul>li.phase-2:nth-of-type(11) {
        margin-left: 104px
    }
	.get-notified.overflow-hidden {
    top: 30px;
    position: relative;
    overflow: hidden;
}

	}

@media (min-width:46.875em) {
	.site-header__logo {
    float: left;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    width: 190px;
}
 
    /* nav.main { */
        /* max-width: 440px; */
        /* top: 0; */
        /* left: 0; */
        /* -webkit-transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.66); */
        /* transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.66) */
    /* } */
    nav.main ul {
        top: -330px
    }
    nav.main ul>li.phase-2:nth-of-type(1) {
        margin-left: 17px
    }
    nav.main ul>li.phase-2:nth-of-type(2) {
        margin-right: 117px
    }
    nav.main ul>li.phase-2:nth-of-type(3) {
        margin-left: 104px
    }
    nav.main ul>li.phase-2:nth-of-type(4) {
        margin-right: 80px;
        margin-left: 38px;
        margin-bottom: 44px
    }
    nav.main ul>li.phase-2:nth-of-type(6) {
        margin-right: 0;
        margin-left: 0
    }
    nav.main ul>li.phase-2:nth-of-type(7),
    nav.main ul>li.phase-2:nth-of-type(8) {
        margin-right: 0;
        margin-left: 6px
    }
    nav.main ul>li.phase-2:nth-of-type(10) {
        margin-right: 80px
    }
    nav.main ul>li.phase-2:nth-of-type(11) {
        margin-left: 104px
    }.get-notified.overflow-hidden {
    top: -61px;
    position: relative;
    overflow: hidden;
    left: 50px;
}.popup-overlay {
    margin-top: 35px;
    margin-bottom: 5px;
}
.coutdown.overflow-hidden {
     margin-top: 8px;
}.site-footer {
    position: fixed;
    display: block;
    top: auto;
    padding-top: 0;
}
}

@media (min-width:62.5em) {
    nav.main {
        width: 100%;
        max-width: 428px;
        top: -80px;
        left: auto;
		right:20px;
        -webkit-transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.7);
        transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.7);
    }
    nav.main ul {
        top: 30px
    }
}

@media (min-width:75em) {
    nav.main {
        width: 100%;
        max-width: 428px;
        top: -80px;
        left: -20px;
        -webkit-transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.8);
        transform: translateX(calc(-50% + 160px)) translateZ(0) scale(.8);
				margin-left: calc(100% - 600px);
    }
    nav.main ul {
        top: 30px
    }
	.coutdown.overflow-hidden {
     margin-top: 22px;
}.get-notified.overflow-hidden {
	   top: 0 !important;
    position: relative;
    overflow: hidden;
    margin-top: -120px;
}
.coutdown.overflow-hidden {
   
    left: 25%;
    
    width: 480px;
     
}
 .get-notified.overflow-hidden {
     
    left: 0px;
}

}



@-webkit-keyframes bippity-boppity-boo {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translateX(-50%) translateY(10px) rotateY(45deg);
        transform: translateX(-50%) translateY(10px) rotateY(45deg)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(25px) rotateY(45deg);
        transform: translateX(-50%) translateY(25px) rotateY(45deg)
    }
    75% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(-10px) rotateY(45deg);
        transform: translateX(-50%) translateY(-10px) rotateY(45deg)
    }
}

@keyframes bippity-boppity-boo {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translateX(-50%) translateY(10px) rotateY(45deg);
        transform: translateX(-50%) translateY(10px) rotateY(45deg)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(25px) rotateY(45deg);
        transform: translateX(-50%) translateY(25px) rotateY(45deg)
    }
    75% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(-10px) rotateY(45deg);
        transform: translateX(-50%) translateY(-10px) rotateY(45deg)
    }
}

@-webkit-keyframes bippity-boppity-boo-sec {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translateX(-50%) translateY(6px) rotateY(45deg);
        transform: translateX(-50%) translateY(6px) rotateY(45deg)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(25px) rotateY(45deg);
        transform: translateX(-50%) translateY(25px) rotateY(45deg)
    }
    75% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(-6px) rotateY(45deg);
        transform: translateX(-50%) translateY(-6px) rotateY(45deg)
    }
}

@keyframes bippity-boppity-boo-sec {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translateX(-50%) translateY(6px) rotateY(45deg);
        transform: translateX(-50%) translateY(6px) rotateY(45deg)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(25px) rotateY(45deg);
        transform: translateX(-50%) translateY(25px) rotateY(45deg)
    }
    75% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(-6px) rotateY(45deg);
        transform: translateX(-50%) translateY(-6px) rotateY(45deg)
    }
}

@-webkit-keyframes bippity-boppity-boohoo {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg);
        transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(-25px) rotateY(45deg) rotateX(-180deg);
        transform: translateX(-50%) translateY(-25px) rotateY(45deg) rotateX(-180deg)
    }
    75% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg);
        transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg)
    }
}

@keyframes bippity-boppity-boohoo {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg);
        transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(-25px) rotateY(45deg) rotateX(-180deg);
        transform: translateX(-50%) translateY(-25px) rotateY(45deg) rotateX(-180deg)
    }
    75% {
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg);
        transform: translateX(-50%) translateY(10px) rotateY(45deg) rotateX(-180deg)
    }
}
#privacy-page .section__table,     #terms .section__table{background:#fff}

#privacy-page  .section__table p, #privacy-page   .section__table h3, #privacy-page  .section__table h4, #privacy-page    .section__table li{color:#000}
 #terms .section__table p,  #terms   .section__table h3,  #terms  .section__table h4, #terms    .section__table li{color:#000}

.section__heading .col-xs-12.col-sm-5{margin-top:0 !important}
.second-link{padding-left:168px}
.third-link{padding-left:337px}
.couter-clock{margin-top: -35px;}
.first-link:hover .app-icon ul li:first-child .overlay-effect{opacity:1} 
.popup-overlay{margin-top:0}
.itunes-google{height:76px;}
@media (max-width: 767px) {

.couter-clock iframe  {transform:scale(0.8);-webkit-transform:scale(0.8);margin-left:-15px}
.app-icon ul li {
    
    margin-right: 2%;
    width: 30%;
     
}
.popup-overlay {
    margin-top: 60px;
   
}

.privacy-page  .site-main #home .section__cell {
     padding: 0 20px 0 10px;  
}

.privacy-page  .site-main #home  .container {
    width: 600px;
}.second-link{padding-left:100px}
.third-link{padding-left:260px}
}
@media (max-width: 620px) {
.privacy-page  .site-main #home  .container {
    width: 400px;
}
#countdown_dashboard .dash_title{font-size:11px}
}

@media (max-width: 400px) {
.privacy-page  .site-main #home  .container {
    width: 320px;
}
}#countdown_dashboard{display:block !important}
#countdown_dashboard .dash_title{letter-spacing: 2px;}