body {
  --dot-bg: var(--light);
  --dot-color: #f5f5f5;
  --dot-size: 4px;
  --dot-space: 22px;
	background:
		linear-gradient(90deg, var(--dot-bg) calc(var(--dot-space) - var(--dot-size)), transparent 1%) center / var(--dot-space) var(--dot-space),
		linear-gradient(var(--dot-bg) calc(var(--dot-space) - var(--dot-size)), transparent 1%) center / var(--dot-space) var(--dot-space),
		var(--dot-color);
}

#above-the-fold {
    margin-top: 150px;
    margin-bottom: 100px;
}

@media (min-width: 1100px) {
    .childrens {
        padding-left: 50px;
        border-left: 1px solid rgba(58, 109, 140, 0.3);
    }
}

#branch img {
    width: 100%;
    margin-bottom: 20px;
}

#branch .txt-block-left {
    width: 100%;
    max-width: 600px;
}

#branch img {
    height: 300px;
    object-fit: cover;
    border-radius: 10px;
}

.childrens img {
    object-position: center 10%;
}

textarea {
    margin-bottom: 30px;
}

#booking {
    padding-bottom: 200px;
}

/* main .vertical-to-column {
    width: 100%;
    padding: 10px;
    margin-top: 80px;
    gap: 20px;
}
.ladies,
.childrens {
    width: 100%;
    flex: auto;
    height: 35vh;
    padding: 0 5% 5% 5%;
    display: flex;
    align-items: flex-end;
    border-radius: 10px;
}

.ladies {
    background-color: blueviolet;
    background-image: url(../assets/ladies-bg.webp);
    background-position: 60% center;
    background-repeat: no-repeat;
    background-size: cover; 
}

.childrens {
    background-color: yellow;
    background-image: url(../assets/childrens-bg.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; 
}

.ladies .txt-block-left,
.childrens .txt-block-left {
    width: 100%;
    padding: 30px 40px;
    border-radius: 10px;
    box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.1);
    background-color: rgba(255,255,255,0.8);
}

@media (min-width: 1100px) {
    .ladies,
    .childrens {
        width: auto;
        height: calc(80vh - 90px);
    }
} */