html{
    height: 100%;
    width: 100%;
    }
body {
    /*IMMAGINE DI SFONDO RIPETUTA*/
    background: url('../../../grafica/home/v4/pattern.png') repeat;
    height: 100%;
    width: 100%;
}

@media only screen and (max-width: 600px) {
  html {
    height: 1080px;
    width: 1920px;
  }
}

.middle {
    background: url('../../../grafica/home/v4/rufy.svg') no-repeat, url('../../../grafica/home/v4/bonnie.svg') no-repeat, url('../../../grafica/home/v4/logonewworld.png') no-repeat;
    background-position: left, right, center;
    background-size: auto 100%, auto 100%, auto 100%;
    height: 90%;
    width: 100%;
    position: relative;
}

#footer {
    background: url('../../../grafica/home/v4/footer.png') repeat-x;
    background-size: auto 100%;
    height: 5%;
}

#header {
    background: url('../../../grafica/home/v4/header.png') repeat-x;
    background-size: auto 100%;
    height: 5%;
    top: 0;
}

/* Iscrizione */
#iscriviti {
    position: absolute;
    background: url('../../../grafica/home/v4/bottoneiscriviti.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 25%;
    width: 10%;
    left: 45%;
}

#iscrivitiimg {
    position: absolute;
    bottom: 11%;
    height: auto;
    width: 45%;
    left: 28%;
}

/* Login */
#loginhome {
    position: absolute;
    background: url('../../../grafica/home/v4/bottoneentra.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 15%;
    width: 10%;
    left: 45%;
}

#loginhomeimg {
    position: absolute;
    bottom: 15%;
    height: auto;
    width: 40%;
    left: 30%;
}

/* Ambientazione anche detto Storia */
#ambientazionehome {
    position: absolute;
    background: url('../../../grafica/home/v4/bottonebase.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 18%;
    width: 12%;
    left: 57%;
}

#ambientazionehomeimg {
    position: absolute;
    bottom: 14%;
    height: auto;
    width: 33%;
    left: 33%;
}

/* Premi */
#premihome {
    position: absolute;
    background: url('../../../grafica/home/v4/bottonebase.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 18%;
    width: 12%;
    left: 71%;
}

#premihomeimg {
    position: absolute;
    bottom: 15%;
    height: auto;
    width: 31%;
    left: 35%;
}

/* Trofei */
#trofeihome {
    position: absolute;
    background: url('../../../grafica/home/v4/bottonebase.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 18%;
    width: 12%;
    left: 85%;
}

#trofeihomeimg {
    position: absolute;
    bottom: 14%;
    height: auto;
    width: 31%;
    left: 35%;
}

/* Guida */
#guidahome {
    position: absolute;
    background: url('../../../grafica/home/v4/bottonebase.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 18%;
    width: 12%;
    left: 31%; /* Somma tra left e width deve essere 43% */
}

#guidahomeimg {
    position: absolute;
    bottom: 13%;
    height: auto;
    width: 31%;
    left: 35%;
}

/* Media e Social */
#mediasocialhome {
    position: absolute;
    background: url('../../../grafica/home/v4/bottonebase.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 18%;
    width: 12%;
    left: 17%; /* Somma tra left e width deve essere 29% */
}

#mediasocialhomeimg {
    position: absolute;
    bottom: 10%;
    height: auto;
    width: 29%;
    left: 35%;
}

/* Patch */
#patchhome {
    position: absolute;
    background: url('../../../grafica/home/v4/bottonebase.png') no-repeat;
    background-size: 100% 100%;
    top: 0;
    height: 18%;
    width: 12%;
    left: 3%; /* Somma tra left e width deve essere 15% */
}

#patchhomeimg {
    position: absolute;
    bottom: 15%;
    height: auto;
    width: 31%;
    left: 35%;
}


div[class*="bccon"] {
    position: absolute;
    height: 70%;
    width: 60%;
    left: 30%;
    display: none;
}