body {

    margin: 0;
    padding: 0;
    width: 1440px;

    background: url('../assets/home.png') center/cover, rgba(0, 0, 0, 0.5);
}

button {
    cursor: pointer;
    width: 256px;
    height: 32px;
}

.divAll {

    width: 1400px;
    margin: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.anciendt_conteiner {

    margin: auto;
    display: flex;
    justify-content: center;
    gap: 40px;
    width: 1400px;
    height: 400px;
}

.divAzathoth {
    width: 300px;

    background: url('../assets/Ancients/Azathoth.png') center/cover, rgba(0, 0, 0, 0.5);
}

.divCthulthu {
    width: 300px;

    background: url('../assets/Ancients/Cthulthu.png') center/cover, rgba(0, 0, 0, 0.5);
}

.divIogSothoth {
    border: 2px solid red;
    width: 300px;

    background: url('../assets/Ancients/IogSothoth.png') center/cover, rgba(0, 0, 0, 0.5);
}

.divShubNiggurath {
    width: 300px;

    background: url('../assets/Ancients/ShubNiggurath.png') center/cover, rgba(0, 0, 0, 0.5);
}

.tracker {
    display: none;
    width: 300px;
    background: rgba(0, 0, 0, 0.4);
}

._activeTracker {
    display: block;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.buttons_conteiner {
    position: relative;
    width: 1400px;
    padding-top: 20px;
    padding-bottom: 20px;
    margin: auto;
    display: flex;
    justify-content: center;
    gap: 40px;
}

.pack_conteiner {
    margin: auto;
    display: flex;
    justify-content: center;
    gap: 40px;
    width: 1400px;
    height: 400px;

}

.divCardTurnover {
    display: none;
    width: 300px;
    background: url('../assets/mythicCardBackground.png') center/cover, rgba(0, 0, 0, 0.5);
}

.divСurrentMap {
    width: 300px;

}

._activeTurnover {
    display: block;
    cursor: pointer;
}




.green{
    display: flex;
    justify-content: center;
    font-size: 50px;
    width: 64px;
    height: 64px;
    background: green;
    color: white;
}
.brown{
    display: flex;
    justify-content: center;
    font-size: 50px;
    width: 64px;
    height: 64px;
    background: brown;
    color: white;
}
.blue{
    display: flex;
    justify-content: center;
    font-size: 50px;
    width: 64px;
    height: 64px;
    background: blue;
    color: white;
}


.stage1conteiner{
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-around;
    height: 64px;
    width: 300px;
}
.stage2conteiner{
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-around;
    height: 64px;
    width: 300px;
}
.stage3conteiner{
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-around;
    height: 64px;
    width: 300px;
}