body{
    /*background:#16151a url('../images/ui/site-bg-pattern-2x.png') repeat;*/
    /*background:#16151a url('../images/ui/tiled-bg-animate3.gif') repeat, url('../images/ui/logo-bg-blur.png') no-repeat;
    background-attachment: fixed;*/
    
    background-image: url('./../images/ui/logo-bg-blur.png'), url('./../images/ui/tiled-bg-animate3.gif');
    background-position: -65px top, left top;
    background-repeat: no-repeat, repeat;
    background-attachment: scroll, fixed;
    background-color:#141318;
    
    color:#fff;
    font-family: 'Albert Sans', sans-serif;
    font-size:18px;
    line-height:24px;
    display: flex;
    justify-content: center;

    overflow-x: hidden;
}

@media screen and (min-width: 1086px){
    body{
        background-position: calc(50vw - 610px) top, left top;
    }
}
body div.main{
    /*padding:0;*/
    max-width:1008px;
    margin-left:30px;
    margin-right:30px;
    margin-bottom:52px;
}

/*#background-video {
height: 516px;
width: 516px;
object-fit: cover;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: -1;
}*/
.site-logo-block{
    border-bottom:2px #0097e5 solid;
}
.site-logo a{
    padding-left:30px;
    box-spacing:border-box;
    margin-top:30px;
    margin-bottom:7px;
}
.site-logo img{
    /*width:auto;
    height:92px;*/
    width:auto;
    height:45px;
    
    transition: all 0.3s cubic-bezier(0.16, 0.56, 0.56, 0.95);
    border-radius:0;
}

@media screen and (min-width: 48em){
    .site-logo-block{
        border-bottom:none;
    }
    .site-logo img{
        width:95px;
        height:auto;
    }
    .site-logo a{
        margin-bottom:30px;
    }
}

.pure-g, .pure-g [class*=pure-u]{
    font-family: 'Albert Sans', sans-serif;
}

.main-section{
    /*float:left;*/
    margin-bottom:20px;
    /*width:100%;*/
}
/*.custom-wrapper{
    margin-bottom:0;
}*/
.main-section.work-with-us{
    margin-bottom:0;
}
.main-section.work-with-us .caps-block{
    margin-top:-5px;
}

.caps-block{
    float:left;
}

.news-tile .left{
    border-radius: 14px 0 0 14px;
}
.news-tile .right{
    min-height:117px;
    padding:17px 27px;
    box-sizing:border-box;
    background-size: cover;
    background-repeat:no-repeat;
    background-position:center;
}
.news-tile .right{
    border-radius: 0 14px 14px 0;
}

@media screen and (max-width: 48em){
    .news-tile .right{
        min-height: 0px;
    }
}

.all-caps{
    font-family: 'Barlow Semi Condensed', sans-serif;
    text-transform: uppercase;
    font-size:56px;
    line-height:52px;
    margin-bottom:28px;
    float:left;
    width:100%;
    box-sizing:border-box;
    word-wrap: break-word;
}

#menu .pure-menu{
    padding-top:0;
    text-align:left;
}
.pure-menu-list{
    width:100%;
    padding:10px 0 0 0;
}
.pure-menu-list li.pure-menu-item{
    display:block;
    float:left;
    width:100%;
    text-align:left;
}

@media screen and (min-width: 48em){
    #menu .pure-menu{
        padding-top:42px;
        text-align:left;
    }
    .pure-menu-list{
        width:auto;
        padding:0;
    }
    .pure-menu-list li.pure-menu-item{
        display:inline-block;
        float:left;
        width:auto;
        background:url('./../images/ui/nav-link-separator.png') right 7px no-repeat;
        padding-left:16px;
        padding-right:17px;
    }
    ul.pure-menu-list li.pure-menu-item:last-of-type{
        background:transparent;
    }
    .all-caps{
        font-size:77px;
        line-height:70px;
    }
}
.description-text{
    padding-right:0px;
    float:left;
    width:100%;
    box-sizing:border-box;
}
.description-text p{
    margin-top:0;
}

#menu{
    transition: all 0.3s cubic-bezier(0.16, 0.56, 0.56, 0.95);
    background:url('./../images/ui/nav-bg-mobile.png');
    background-size:100% 72px;
    background-repeat: no-repeat;
    background-color:#000;
    margin: 0 -24px 30px -30px;
    padding:0 24px 30px 30px;
    height:71px;
    width:100%;
    position:fixed;
    box-sizing:border-box;
    
    box-shadow: 0 12px 21px 1px rgb(0 0 0 / 70%);

    z-index: 84;
}
#menu.open{
    height:225px;
    margin-bottom:30px;
}



a.pure-menu-link{
    font-family: 'Albert Sans', sans-serif; 
    color:#fff;
    border-bottom:2px #00000020 solid;
    font-size:16px;
    background:transparent;
    padding: 0.5em 1em 0.5em 0;
    transition: all 0.3s cubic-bezier(0.16, 0.56, 0.56, 0.95);
}
a.pure-menu-link:hover{
    /*border-bottom:2px #00ccffff solid;*/
    border-bottom:2px #00000020 solid;
    /*background:url('../images/ui/nav-link-separator.png') right no-repeat;*/
    background:transparent;
}
a.pure-menu-link:active{
    border-bottom:2px #00ccffff solid;
    background:transparent;
}
a.pure-menu-link:focus, a.pure-menu-link:visited{
    border-bottom:2px #00000020 solid;
    background:transparent;
}


@media screen and (min-width: 48em){
    #menu{
        background:none;
        margin:0;
        padding:0;
        height:auto;
        box-shadow: none;
        position:relative;
    }
    #menu .pure-menu{
        padding-top:42px;
        text-align:center;
    }
    a.pure-menu-link{
        font-family: 'Albert Sans', sans-serif; 
        color:#fff;
        padding:8px 5px 0 5px;
        margin-bottom:8px;
        border-bottom:2px #00000020 solid;
        font-size:16px;
    }
    a.pure-menu-link:hover, a.pure-menu-link.current{
        border-bottom:2px #00ccff solid;
    }
    a.pure-menu-link:active{
        
    }
}



.blue-text{
    color:#00a8ff;
}

/* Fixes telephone number in footer appearing as a default blue underlined link */
.blue-text a:any-link{
    color:#00a8ff;
    text-decoration: none;
}

.pure-menu-heading.custom-brand{
    padding-top:0;
}

.homepage-tile{
    float:left;
    /*width:1008px;*/
    width:100%;
    /*height:340px;*/
    height: calc(80vw);
    border-radius: 14px;
    box-shadow: 0 12px 21px 1px rgb(0 0 0 / 70%);
    box-sizing:border-box;
    padding:0;
    background-color:#302b2f;
    margin-top:120px;
}

.homepage-tile.banner{
    background-image:url('./../images/games/play-cats-flip-header.jpg');
    background-size:cover;
    margin-bottom:32px;
    margin-top:120px;
}
a.homepage-tile.banner{
    text-decoration:none;
    color:#fff;
}
a.homepage-tile.banner:hover, a.homepage-tile.banner:visited, a.homepage-tile.banner:active{
    text-decoration:none;
    color:#fff;
}
@media screen and (min-width: 35.5em){
    .homepage-tile.banner{
        background-image:url('./../images/games/play-cats-flip-header.jpg');
        height:437px;
    }
}
@media screen and (min-width: 48em){
    .homepage-tile.banner{
        margin-top:0;
    }
    .static-home-header{
        padding-top: 0 !important;
    }
}

.game-header img{
    max-width:100%;
    border-radius: 14px;
    box-shadow: 0 12px 21px 1px rgb(0 0 0 / 70%);
}
.homepage-tile .text{
    /*margin:140px 0 0 22px;*/
    margin:calc(30vw) 0 0 calc(5vw);
    width: calc(40vw - 30px);
    /*width: 160px;*/
    height: 120px;
    font-size: calc(2.3vw + 3px);
    /*font-size: 14px;*/
    line-height:calc(2.3vw + 5px);
    /*line-height:16px;*/
}
.homepage-tile h2{
    font-size:calc(3.3vw + 2px);
    /*font-size:18px;*/
    font-weight:900;
    margin:0 0 8px 0;
}
@media screen and (min-width: 35em){
    .homepage-tile .text{
        margin:198px 0 0 62px;
        width: 230px;
        font-size: 16px;
        line-height:19px;
    }
    .homepage-tile h2{
        font-size:20px;
        margin:0 0 2px 0;
    }
}


.app-icons{
    position:absolute;
    /*margin-top:360px;*/
    margin-top:min(calc(72vw - 10px), 380px);
    /*margin-left:calc(50vw + 20px);*/
    margin-left:-80px;
    transform: scale(.75);
    width:min(calc(100vw + 98px), 617px);
    text-align:center;
}
.app-icons a{
    margin:8px;
}
.app-icons a img{
    border-radius: 3px;
    box-shadow:none;
}
@media screen and (min-width: 48em){
    .app-icons{
        margin-top:min(calc(34vw - 20px), 360px);
        margin-left:0;
        transform: scale(1);
        /*width:auto;*/
        width:min(calc(100vw - 80px), 1008px);
    }
    .app-icons.baja-big-air{
        margin-top:min(calc(34vw - 20px), 360px);
        margin-left:min(calc(1vw + 140px), 160px);
    }
    .app-icons a{
        margin:8px;
    }
}


.section-title{
    float:left;
    width:100%;
    border-bottom: 2px #00a8ff solid;
    margin-bottom:14px;
    padding-top:15px;
    padding-left:37px;
    box-sizing:border-box;
    background-size: auto 44px;
    background-repeat:no-repeat;
    background-position:bottom left;
}
.section-title.no-icon{
    padding-left:0;
}
.section-title h2{
    font-size: 26.5px;
    font-weight:300;
    margin-top:0;
    margin-bottom:0;
    padding-bottom:10px;
    line-height: 32px;
}

.section-title h2 b{
    font-weight:700;
}
.section-title.megaphone{
    background-image:url('./../images/icons/icon-megaphone.png');
}
.section-title.platforms{
    background-image:url('./../images/icons/icon-platform.png');
}
.section-title.games{
    background-image:url('./../images/icons/icon-games.png');
}
.section-title.work{
    background-image:url('./../images/icons/icon-puzzle.png');
}

a.view-all-news{
    display:none;
    float:right;
    font-size:16px;
    color:#fff;
    font-weight:300;
    text-decoration:none;
    border-bottom: 2px #00a8ff solid;
    margin-top:25px;
    margin-bottom:26px;
    padding-bottom:0;
}
a.view-all-news:hover{
    text-decoration:none;
}
a.view-all-news:visited, a.view-all-news:active{
    text-decoration:none;
}

.news-tiles{
    float:left;
    width:100%;
    margin-top:-9px;
}
.page-header{
    margin-top:70px;
}

@media screen and (min-width: 48em){
    .page-header{
        margin-top:0;
    }
}

.news-tiles .news-tile{
    color:#000;
    border-radius: 14px;
    box-shadow: 0 10px 21px 1px rgb(0 0 0 / 0.7);
    text-decoration:none;
    font-weight:400;
    line-height:17px;
    font-size:13px;
    padding:0;
    margin-bottom:15px;
    
    transition: all 0.3s cubic-bezier(0.34, 0.91, 0.81, 1.3);
}

.news-tiles a.news-tile:hover{
    padding:0 0 0 6px;
    margin-right:-6px;
    box-shadow: 0 10px 21px 1px rgb(0 0 0 / 1);
}

.news-tiles .news-tile .left{
    background:#fff;
    padding:11px 36px 17px 36px;
    box-sizing:border-box;
}

.news-tiles .news-tile .title{
    color:#00a8ff;
    font-weight:800;
    font-size:21.5px;
    line-height:29px;
    text-decoration:none;
    border-bottom:0;
    width:100%;
    font-family: 'Albert Sans', sans-serif;
    margin-bottom:7px;
    margin-top:calc(2.8vw + 6px);
}
.news-tiles  .news-tile .description{
    /*display:none;*/
    font-size:13px;
}

.news-tiles .news-tile-right{
    float:left;
    width:100%;
}
.news-tiles .news-tile-left{
    float:left;
    width:100%;
}

@media screen and (min-width: 48em){
    .news-tiles  .news-tile .title{
        margin-top:0;
        border-bottom:1px #00a8ff solid;
    }
    .news-tiles  .news-tile .description{
        display:block;
        font-size:13px;
    }
    a.view-all-news{
        display:block;
    }
}
@media screen and (max-width: 48em){
    .news-tiles  a.news-tile .description{
        display:none;
    }
}

.two-column{
    margin-left:-10px;
    margin-right:-10px;
    padding-left:0px;
    padding-right:0px;
}
@media screen and (min-width: 35.5em){
    .two-column{
        margin-left:-10px;
        margin-right:-10px;
        padding-left:0;
        padding-right:0;
    }
    .description-text {
        padding-right: 50px;
    }
}

.left-column{
    padding:10px;
    box-sizing: border-box;
}

.right-column{
    padding:10px;
    box-sizing: border-box;
}
.right-column.higher{
    margin-top:-36px;
}
@media screen and (min-width: 48em){
    .lower{
        margin-top:48px;
    }
}
.game-thumbs{
    width:calc(100% + 4px);
}
.game-thumbs>div{
    margin:0 -2px;
    padding:0 2px;
    box-sizing:border-box;
}
.game-thumbs img{
    border-radius:0;
}

img{
    border-radius: 14px;
    max-width:100%;
}

#menu .custom-brand{
    /*height:132px;*/
    overflow:hidden;
}
@media screen and (min-width: 35.5em){
    #menu .custom-brand{
        width:auto;
    }
}

.games-tiles{
    /*margin-top:14px;*/
    margin-left:-5px;
    margin-right:-5px;
}
.games-tiles .tall-tile{
    box-sizing: border-box;
    /*padding-bottom:31px;*/
    padding:15px;
    display:none;
}
.games-tiles .tall-tile a{
    background-size: auto 100%;
    overflow:hidden;
}
.games-tiles .tall-tile a:hover{
    background-size: auto 106%;
}
.games-tiles .tall-tile a video{
    opacity: 0;
    transition: all 0.3s linear;
    animation:opacity 1s ease-in-out 1 forwards;
    width:auto;
    height:442px;
    box-sizing:border-box;
}
.games-tiles .tall-tile a:hover video{
    opacity: 1;
}

.games-tiles a video{
    filter: brightness(70%);
}

body.touch-device .games-tiles a video,
body.touch-device .games-tiles a .title-container {
    visibility: hidden;
}

.games-tiles a .title-container{
    float:left;
    /*margin:0 0 0 0;*/
    /*margin:-33% 0 0 0;*/
    margin:calc(-1 * 26vw - 10px) 0 0 0;
    
    padding:0 20px;
    box-sizing:border-box;
    width:100%;
    display:flex;
    /*height:206px;*/
    z-index:3;
    position:relative;

    align-items: center;
    justify-content: center;
    transition:all 0.3s cubic-bezier(0, 0, 0.2, 1);
    opacity:0;
}
.games-tiles a:hover .title-container{
    /*margin:-20px 0 0 0;*/
    /*margin:-40% 0 0 0;*/
    margin:calc(-1 * 31vw - 10px) 0 0 0;
    opacity:1;
}
@media screen and (min-width: 48em){
    .games-tiles a .title-container{
        /*margin:calc(70vw - 60px) 0 0 0;*/
        margin:calc(-1 * 13vw - 10px) 0 0 0;
        /*height:206px;*/
    }
    .games-tiles a:hover .title-container{
        margin:calc(-1 * 16vw - 10px) 0 0 0;
    }
}
.games-tiles .tall-tile a .title-container{
    margin:-422px 0 0 0;
    height:442px;
}
.games-tiles .tall-tile a:hover .title-container{
    margin:-442px 0 0 0;
}
.games-tiles .regular-tile a h2, .games-tiles .tall-tile a h2{
    text-shadow: 0px 0px 10px rgb(0 0 0 / 55%), 0px 0px 5px rgb(0 0 0 / 55%);
    font-family: 'Albert Sans', sans-serif;
    font-weight:900;
    text-transform: uppercase;
    font-size:23px;
    line-height:22px;
    transition:all 0.3s cubic-bezier(0, 0, 0.2, 1);
    webkit-transition:all 0.3s;
    color:#fff;
    
    text-align:center;
    
    text-decoration:none;
    /*background:#0000003c;*/
    box-sizing:border-box;
}
.games-tiles .regular-tile a:hover h2{
    /*opacity:1;*/
    /*background:#0000004a;*/
    /*top:-30px;*/
    /*margin:-31% 0 0 0;*/
}


.games-tiles .regular-tile{
    box-sizing: border-box;
    padding:15px;
    margin: auto;
}
.games-tiles .regular-tile a{
    background-size: 100% auto;
    overflow:hidden;
    /*height:auto;*/
    
    transition: all 0.3s cubic-bezier(0.34, 0.91, 0.81, 1.3);
}
.games-tiles .regular-tile a:hover{
    background-size: 106% auto;
}
.games-tiles .regular-tile a video{
    float:left;
    display:block;
    opacity: 0;
    transition: all 0.3s linear;
    animation:opacity 1s ease-in-out 1 forwards;
    width:100%;
    height:auto;
    box-sizing:border-box;
}


.games-tiles .regular-tile a:hover video{
    /*display:block;*/
    opacity: 1;
}


.games-tiles a{
    float:left;
    width:100%;
    height:100%;
    /*min-height:230px;*/
    text-decoration:none;
    box-shadow: 0 10px 21px 1px rgb(0 0 0 / 0.7);
    border-radius: 14px;
    background-position:center;
    background-size: 100% auto;
    transition: all 0.3s cubic-bezier(0.34, 0.91, 0.81, 1.3);
    margin:0;
}
/*.games-tiles a:hover{
    background-size: 102% auto;
}*/

.games-tiles .regular-tile.small-screens-only{
    display: block;
}

@media screen and (min-width: 64em){
    .games-tiles .tall-tile{
        display:block;
        box-sizing:border-box;
        height:472px;
    }
    .games-tiles .regular-tile.small-screens-only{
        display: none;
    }
    .games-tiles .regular-tile a{
        background-size: auto 100%;
        height:206px;
    }
    .games-tiles .regular-tile a:hover{
        background-size: auto 106%;
    }
    .games-tiles .regular-tile a video{
        width:auto;
        height:206px;
        float:none;
    }
    .games-tiles .regular-tile a .title-container{
        height:206px;
        margin:-186px 0 0 0;
    }
    .games-tiles .regular-tile a:hover .title-container{
        margin:-206px 0 0 0;
    }
    .games-tiles .regular-tile a h2, .games-tiles .tall-tile a h2{
        /*position:relative;
        padding:140px 20px;
        margin:0;
        top:-68px;*/
    }
    .games-tiles .regular-tile a:hover h2, .games-tiles .tall-tile a:hover h2{
        /*opacity:1;
        top:-48px;*/
    }
}

a.pure-menu-heading{
    padding:0;
}



footer{
    margin-top:105px;
    font-size:13px;
    line-height:15px;
}
@media screen and (max-width: 48em) {
    .mobile-device footer {
        margin-top: 25px
    }
}

footer h2{
    font-size:22px;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight:300;
    text-transform: uppercase;
    width:100%;
    border-bottom: 1px #fff dotted;
    margin-bottom:7px;
    line-height:32px;
}
footer h2 b{
    font-weight:700;
    text-transform: uppercase;
}

footer .quarter{
    padding:10px 58px 10px 10px;
    box-sizing: border-box;
}

footer h2{
    margin-top:0;
}
footer ul{
    list-style-type: none;
    padding-inline-start:0;
    margin-top:0;
}
footer li a{
    font-size:13px;
    color:#fff;
    text-decoration:none;
}
footer li a:visited{
    color:#fff;
}
footer li a:hover, footer li a:active{
    color:#00a8ff;
}

.social-links{
    list-style-type: none;
    padding-inline-start:0;
    
}
#menu .social-links{
    text-align:right;
    margin-top:16px;
}
.social-links a{
    width:22px;
    height:22px;
    display:block;
    background-image: url('./../images/icons/social-icons.png');
    background-position:0px 0px;
}
.social-links li{
    margin-left:0;
    margin-right:8px;
    display:inline-block;
}
.social-links li:last-of-type{
    margin-right:0;
}
.social-links a.social-linkedin{
    
}

.social-links a.social-linkedin{
    background-position:0px 0px;
}
.social-links a.social-youtube{
    background-position:-35px 0px;
}
.social-links a.social-instagram{
    background-position:-69px 0px;
}

footer .map{
    display:inline-block;
}
footer .map img{
    border-radius:0;
    border:3px #0cdbe8 solid;
    margin-top:7px;
}


@media screen and (min-width: 48em){
    #menu .social-links{
        text-align:right;
        margin-top:50px;
    }
}

button{
    font-weight:700;
    font-size:16px;
    color:#fff;
    font-family: "Barlow", open sans, sans-serif;
    border:0;
    border-radius:9px;
    padding:11px 45px;
    background: #00a8ff;
}
button:hover{
    background:#0075b2;
    cursor:pointer;
}

.fun-and-games{
    margin-top:7px;
}

/*-------------------------------------------------------------------------------------*/
.page-home #spine-player-container{
    width: 1008px;
    height: 437px;
    display: block;
}

@media (max-width: 1056px){
    .page-home #spine-player-container
    {
        display: none;	
    }
}

/*-------------------------------------------------------------------------------------*/
.mobile-no{
    display:none;
}

@media screen and (min-width: 48em){
    .mobile-yes{
        display:none;
    }
    .mobile-no{
        display:inline-block;
    }
}
/*-------------------------------------------------------------------------------------*/
/* These leverage a body class set via Javascript rather than detecting screen sizing */
.mobile-only {
    display: none;
}

.destktop-only {
    display: block;
}

body.mobile-device .mobile-only {
    display: block;
}

body.mobile-device .desktop-only {
    display: none;
}
/*-------------------------------------------------------------------------------------*/
.float-left{
    float:left;
}
.margin-top-11{
    margin-top:11px !important;
}
.margin-bottom-0{
    margin-bottom:0 !important;
}
/*-------------------------------------------------------------------------------------*/
.game-frame-container {
    display: flex;
}

.portrait-game-frame {
    border: none;
    min-height: 512px;
    height: 100%;
    margin: auto;
}

.landscape-game-frame {
    border: none;
    min-height: 512px;
    width: 100%;
    margin: auto;
}

