/*.unity-mobile #unity-canvas {
    width: 100%;
    height: 100%
}*/

h1,
h2,
h3 {
    font-family: "Luckiest Guy", Arial, Helvetica, sans-serif;
}

a {
    color: #fff;
}

a:hover {
    color: #ccc;
}

body {
    background: rgb(71, 236, 252);
    background: linear-gradient(0deg, rgba(71, 236, 252, 1) 0%, rgba(71, 236, 252, 1) 10%, rgba(122, 226, 255, 1) 10%, rgba(44, 146, 253, 1) 100%);
    /*background-image: url("img/welcome.png");*/
    background-size: contain;
    background-position: center;
    height: 100%;
    background-repeat: no-repeat;
}

body.mobile {
    background: rgb(71, 236, 252);
    background: linear-gradient(0deg,rgba(122, 226, 255, 1) 0%, rgba(44, 146, 253, 1) 100%);
}

.clouds {
    overflow: hidden;

}

.cloud {
    opacity: 0;
    background-image: url("img/cloud1.png");
    position: absolute;
    display: block;
    left: 30%;
    top: 30%;
    width: 633px;
    height: 500px;
    background-size: contain;
    background-repeat: no-repeat;
    transform: scale(0.5);
    transform-origin: 0 0;
}

.cloud1 {
    left: 20%;
    top: 40%;
}

.cloud2 {
    left: 63%;
    top: 60%;
    background-image: url("img/cloud2.png");
}

.cloud3 {
    left: -9%;
    top: 70%;
    background-image: url("img/cloud3.png");
}

.cloud4 {
    left: 87%;
    top: -10%;
    background-image: url("img/cloud4.png");
}

#WEB3_CONNECT_MODAL_ID {
    text-shadow: none;
}

.pt-logo {
    max-height: 64px;
}

.pt-infocards .card {
    border: 0;
    background-size: cover;
    background-position: center;
}

.pt-infocards .card a {
    backdrop-filter: blur(0px);
    height: 100%;
    text-decoration: none;
    transition: 0.1s;
    background-color: rgba(51, 51, 51, 0.606);
}

.pt-infocards .card a:hover {
    backdrop-filter: blur(5px);
}

.pt-infocards .card h2 {
    font-weight: 100 !important;
}

#unity-container {
    height: 100vh;
    width: 100%;
    overflow: hidden;
}

#unity-canvas {
    display: block;
}

.maintenance-mode-container {
    text-align: center;
    display:none;
}

.pt-mobile {
    width: 100%;
    max-width: 500px;
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%);
    display:none;
}

.pt-mobile .pt-mobile-container-android {
    display: none;
}

.pt-mobile .pt-mobile-container-apple {
    display: none;
}


#unity-loading-bar {
    overflow: hidden;
    display: none;
    margin: 0 auto;
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    height: 100%;
}
.loading-spinner {
    position: absolute;
    top: 60%;
    left: 50%;
    margin-left: -64px;
}

.pt-play-button {
    width: 200px;
    box-shadow: 1px 1px 3px #0003;
}

#unity-logo {
    max-width: 500px;
    height: 400px;
    width: 100%;
    background: url('img/logo.png') no-repeat center;
    background-size: contain;
    margin: 10px auto;
}


.pt-progress-bg {
    width: 300px;
    height: 200px;
    opacity: 0.1;
    position: absolute;
    background-image: url('img/ptlogo.png');
    background-size: contain;
    background-repeat: no-repeat;
}

#unity-progress-bar-full {

    width: 0%;
    height: 88px;
    border-radius: 5px;
}

.pt-progress-indicator {
    margin: 100px auto;
    opacity: 0;
    /*color: #0768CD;*/
    color: #fff;
}

.pt-progress-bar {
    left: 50%;
    opacity: 0;
    top: 40%;
    position: absolute;
    width: 300px;
    height: 200px;
    border-radius: 5px;
    margin: 10px auto;
    margin-left: -150px;
    /*border: 1px solid #eee;*/
}

.pt-progress-front {
    background-image: url('img/ptlogo.png');
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 168px;

}

#unity-webgl-logo {
    float: left;
    width: 204px;
    height: 38px;
    background: url('webgl-logo.png') no-repeat center
}

#unity-build-title {
    /*float: right;
    margin-right: 10px;*/
    line-height: 38px;
    font-family: arial;
    font-size: 18px
}

#unity-warning {
    position: absolute;
    left: 50%;
    top: 5%;
    transform: translate(-50%);
    background: white;
    padding: 10px;
    display: none
}

.web3modal-modal-card {
    font-family: sans-serif
}

#unity-fullscreen-button {
    display: none;
}


/*
 * Globals
 */


/* Custom default button */

.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
    color: #333;
    text-shadow: none;
    /* Prevent inheritance from `body` */
}


/*
 * Base structure
 */

body {}

.cover-container {
    max-width: 42em;
}


/*
 * Header
 */

.main-link a {
    text-decoration: none;
}

.nav-masthead {
    padding: 16px 0px;
}

.nav-masthead .nav-link {
    padding: .25rem 0;
    font-weight: 700;
    color: rgba(255, 255, 255, .8);
    background-color: transparent;
    border-bottom: .25rem solid transparent;
}

.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus {
    border-bottom-color: rgba(255, 255, 255, .25);
    color: #fff;
}

.nav-masthead .nav-link+.nav-link {
    margin-left: 1rem;
}

.nav-masthead .active {
    color: #fff;
    border-bottom-color: #fff;
}