body{
    --picture-arrow-right: url("../../../images/utils/arrow_right_white.svg");
    --picture-arrow-down: url("../../../images/utils/arrow_bottom_white.svg")
}

.contact{
    height: 850px;

    .contact-block{
        padding: 0 10vw;
        & .contact-block-body{
            background-color: var(--light-brick);
            border-radius: 30px;
        }
        & .text-block{
            padding: 8vh;

            color: var(--cream);
            & h4{
                margin-top:6vh;
                font-size: 1.3em;
                font-weight: 900;
                line-height: 115%;
            }
            & ul{
                margin-top: 20px;
                & li{
                    padding: 5px 0;
                }
            }
            & .arrow{
                position: absolute;
                background: var(--picture-arrow-right) ;
                width: 116px;
                height: 52px;
                transform: rotate(-15deg);
                left: 40vw;
            }
        }
    }
}

.form-contact-block{
    padding: 8vh;
    padding-left: 10px;
    color: var(--cream);
    & .form-item{
        height: 3em;
        margin: 10px 0;
        &.high{
            height: 16em;
        }
    }
    & a{
        text-decoration: none;
        font-weight: 900;
        color: var(--cream);
        &:hover{
            text-decoration: underline ;
        }
    }
    & .form-contact-submit{
        position: relative;
        top: 11vh;
    }

}

@media (max-width: 992px) {

    .contact {
        height: auto;
        & .contact-block {
            padding: 0 calc(var(--bs-gutter-x) * .5);

            & .contact-block-body{
                margin-bottom: 5vh;
            }


            & .text-block {
                padding:  5vh 5vw;
                & .arrow{
                    top: 3vh;
                    position: relative;
                    background: var(--picture-arrow-down) ;
                    width: 40px;
                    height: 120px;
                    transform: none;
                    left: 30vw;

                }
            }
        }
    }

    .form-contact-block{
        padding: 0;
        color: var(--cream);
        & .form-item{
            height: 3em;
            margin: 20px 0;
            &.high{
                height: 16em;
            }
        }
        & a{
            text-decoration: none;
            font-weight: 900;
            color: var(--cream);
            &:hover{
                text-decoration: underline ;
            }
        }
        & .form-contact-submit{
            position: relative;
            margin-top: 0;
            margin-bottom: 5vh;
            top: 8vh
        }

    }

}