.picture1 {
    display: flex;
    justify-content: center;
    align-items: center;
}
.picture2 {
    display: flex;
    justify-content: center;
    align-items: center;
}
.room, .bathroom{
    margin-top: 100px;
}
.room img ,.bathroom img {
    position: relative;
    height: 500px;
    width: 800px;
}
.bed{
    margin-top: 340px;
    position: absolute;
    z-index: 1;
}
.bed img {
    height: 230px;
    width: auto;
}
.nightstand1,.nightstand2{
    margin-top: 350px;
    position: absolute;
}
.nightstand1 img,.nightstand2 img{
    height: 110px;
    width: auto;
}
.nightstand1{
    margin-right: 230px;
}
.nightstand2{
    margin-left:230px;
}
.lamp1,.lamp2{
    margin-top: 230px;
    position: absolute;
}
.lamp1 img,.lamp2 img{
    height: 60px;
    width: auto;
}
.lamp1{
    margin-right: 230px;
}
.lamp2{
    margin-left:230px;
}
.wardrobe{
    margin-top: 230px;
    position: absolute;
}
.wardrobe img{
    height: 250px;
    width: auto;
}
.wardrobe{
    margin-left:450px;
}

.bed:hover {
    transform: scale(1.05); 
}

.wardrobe{
    margin-top: 230px;
    position: absolute;
}
.wardrobe img{
    height: 250px;
    width: auto;
}
.wardrobe{
    margin-left:450px;
}
.wardrobe:hover {
    transform: scale(1.05); 
}

.nightstand1:hover, .nightstand2:hover {
    transform: scale(1.05); 
}
.lamp1:hover, .lamp2:hover {
    transform: scale(1.05); 
}
.item {
    position: relative; 
}

.item-name {
    display: none; 
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid #000; 
    padding: 5px;
    border-radius: 5px;
    font-size: 14px;
    color: #000; 
    z-index: 10; 
}

.mirror{
    margin-top: 380px;
    position: absolute;
}
.mirror img{
    height: 150px;
    width: auto;
}
.mirror{
    margin-left:670px;
}
.mirror:hover {
    transform: scale(1.05); 
}

.TV{
    margin-top: 60px;
    position: absolute;
}
.TV img{
    height: 100px;
    width: auto;
}
.TV{
    margin-left:680px;
}
.TV:hover {
    transform: scale(1.05); 
}

.fridge{
    margin-top: 330px;
    position: absolute;
}
.fridge img{
    height: 100px;
    width: auto;
}
.fridge{
    margin-right:400px;
}
.fridge:hover {
    transform: scale(1.05); 
}

.table{
    margin-top: 450px;
    position: absolute;
}
.table img{
    height: 130px;
    width: auto;
}
.table{
    margin-right:500px;
}
.table:hover {
    transform: scale(1.05); 
}

.chair1,.chair2{
    margin-top: 430px;
    position: absolute;
}
.chair1 img,.chair2 img{
    height: 150px;
    width: auto;
}
.chair1{
    margin-right: 680px;
}
.chair2{
    margin-right: 330px;
}
.chair1:hover, .chair2:hover {
    transform: scale(1.05); 
}

.notebook{
    margin-top: 350px;
    position: absolute;
}
.notebook img{
    height: 50px;
    width: auto;
}
.notebook{
    margin-right:460px;
}
.notebook:hover {
    transform: scale(1.05); 
}

.pen{
    margin-top: 330px;
    position: absolute;
}
.pen img{
    height: 50px;
    width: auto;
}
.pen{
    margin-right:560px;
}
.pen:hover {
    transform: scale(1.05); 
}

.window{
    margin-top: 20px;
    position: absolute;
}
.window img{
    height: 370px;
    width: 140px;
}
.window{
    margin-right:660px;
}
.window:hover {
    transform: scale(1.05); 
}

.buttons {
    position: absolute;
    top: 90px; 
    left: 50%;
    transform: translateX(-50%); 
    display: flex;
}

.room-button, .bathroom-button {
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid #000;
    padding: 10px 0; 
    border-radius: 5px;
    font-size: 22px;
    cursor: pointer;
    margin: 0 20px; 
    text-align: center; 
    min-width: 350px;
    transition: background-color 0.3s, transform 0.3s; 
}

.room-button:hover, .bathroom-button:hover {
    background-color: rgba(200, 200, 200, 0.8); /* Замените цвет на желаемый */
    transform: scale(1.05); /* Увеличение размера при наведении */
}
.bath,.sink,.toilet,.towel,.bathrobe{
    position: absolute;
}
.bath{
    margin-top: 300px;
}
.bath img{
    height: 160px;
    width: auto;
}
.bath{
    margin-left:480px;
}
.bath:hover {
    transform: scale(1.05); 
}

.sink{
    margin-top: 280px;
}
.sink img{
    height: 200px;
    width: auto;
}
.sink{
    margin-left:0;
}
.sink:hover {
    transform: scale(1.05); 
}

.toilet{
    margin-top: 300px;
}
.toilet img{
    height: 160px;
    width: auto;
}
.toilet{
    margin-right:480px;
}
.toilet:hover {
    transform: scale(1.05); 
}

.bathrobe{
    margin-top: 100px;
}
.bathrobe img{
    height: 160px;
    width: auto;
}
.bathrobe{
    margin-right:280px;
}
.bathrobe:hover {
    transform: scale(1.05); 
}

.towel{
    margin-top: 180px;
}
.towel img{
    height: 80px;
    width: auto;
}
.towel{
    margin-left:230px;
}
.towel:hover {
    transform: scale(1.05); 
}

@media (max-width: 768px) {
    .room img ,.bathroom img {
        position: relative;
        margin-top: 50px;
        height: 300px;
        width: 380px;
    }
    .sink{
    margin-top: 250px;
    }
    .sink img{
        height: 100px;
        width: auto;
    }
    .sink{
        margin-left:0;
    }
    .towel{
    margin-top: 210px;
    }
    .towel img{
        height: 40px;
        width: auto;
    }
    .towel{
        margin-left:130px;
    }
    .bath{
    margin-top: 270px;
    }
    .bath img{
        height: 80px;
        width: auto;
    }
    .bath{
        margin-left:250px;
    }
    .toilet{
    margin-top: 280px;
    }
    .toilet img{
        height: 80px;
        width: auto;
    }
    .toilet{
        margin-right:240px;
    }
    .bathrobe{
        margin-top: 150px;
    }
    .bathrobe img{
        height: 80px;
        width: auto;
    }
    .bathrobe{
        margin-right:120px;
    }



    .bed{
    margin-top: 320px;
    position: absolute;
    z-index: 1;
    }
    .bed img {
        height: 120px;
        width: auto;
    }
    .nightstand1,.nightstand2{
        margin-top: 320px;
        position: absolute;
    }
    .nightstand1 img,.nightstand2 img{
        height: 50px;
        width: auto;
    }
    .nightstand1{
        margin-right: 110px;
    }
    .nightstand2{
        margin-left:110px;
    }
    .lamp1,.lamp2{
        margin-top: 260px;
        position: absolute;
    }
    .lamp1 img,.lamp2 img{
        height: 30px;
        width: auto;
    }
    .lamp1{
        margin-right: 110px;
    }
    .lamp2{
        margin-left:110px;
    }
    .wardrobe{
        margin-top: 260px;
        position: absolute;
    }
    .wardrobe img{
        height: 130px;
        width: auto;
    }
    .wardrobe{
        margin-left:220px;
    }

    .mirror{
        margin-top: 320px;
        position: absolute;
    }
    .mirror img{
        height: 100px;
        width: auto;
    }
    .mirror{
        margin-left:320px;
    }
    .TV{
        margin-top: 150px;
        position: absolute;
    }
    .TV img{
        height: 50px;
        width: auto;
    }
    .TV{
        margin-left:320px;
    }
    .fridge{
        margin-top: 300px;
        position: absolute;
    }
    .fridge img{
        height: 60px;
        width: auto;
    }
    .fridge{
        margin-right:180px;
    }
    .table{
        margin-top: 370px;
        position: absolute;
    }
    .table img{
        height: 80px;
        width: auto;
    }
    .table{
        margin-right:270px;
    }
    .chair1,.chair2{
        margin-top: 360px;
        position: absolute;
    }
    .chair1 img,.chair2 img{
        height: 80px;
        width: auto;
    }
    .chair1{
        margin-right: 330px;
    }
    .chair2{
        margin-right: 180px;
    }
    .notebook{
        margin-top: 300px;
        position: absolute;
    }
    .notebook img{
        height: 25px;
        width: auto;
    }
    .notebook{
        margin-right:220px;
    }
    .pen{
        margin-top: 300px;
        position: absolute;
    }
    .pen img{
        height: 30px;
        width: auto;
    }
    .pen{
        margin-right:300px;
    }
    .window{
        margin-top: 110px;
        position: absolute;
    }
    .window img{
        height: 230px;
        width: 65px;
    }
    .window{
        margin-right:310px;
    }
}