#top-container, footer, #body-container {
    /*opacity: 0.5;*/ /*DEBUG*/
}

#menu, .div-with-fade-border {
    display: none;
}

#body-container {
    height: 68.7vw;
    background-color: #20905a;
}

    #body-container > div {
        font-size: 0;
        box-sizing: border-box;
        padding-top: 2.8vw;
        padding-right: 3.7vw;
        height: 65.2vw;
        width: 94.5vw;
    }

        #body-container > div > div {
            display: inline-block;
            vertical-align: top;
        }

.desktop #body-container > div > div {
    height: 100%;
    border-top-right-radius: 3vw;
    border-bottom-right-radius: 3vw;
}

#contact-info-container {
    background-color: #282828;
    width: 51.3vw;
    color: white;
}

#form-title {
    box-sizing: border-box;
    padding-top: 2.1vw;
    height: 6vw;
    padding-right: 3vw;
    /* position: relative; */
    /* left: -81px; */
}

    #form-title > div {
        position: relative;
        font-size: 1.6vw;
        font-weight: 400;
        box-sizing: border-box;
        padding-right: 1.4vw;
    }

        #form-title > div::before {
            content: "";
            position: absolute;
            top: 0.5vw;
            right: 0;
            height: 1.7vw;
            width: 0.5vw;
            background-color: #00b262;
            border-radius: 1vw;
        }

#support {
    /* background-color: yellow; */
    height: 7vw;
    background-image: url(../../images/boxmaker/desktop/contact-us/headphone.png);
    background-repeat: no-repeat;
    background-position: right 2.3vw top 2.8vw;
    background-size: 2vw;
    color: white;
    box-sizing: border-box;
    padding-right: 5.9vw;
    padding-top: 1.1vw;
}

    #support > div:nth-child(1) {
        font-size: 1.35vw;
    }

    #support > div:nth-child(2) {
        font-size: 1vw;
        box-sizing: border-box;
        padding-top: 0.5vw;
        font-weight: 800;
    }

#working-hours {
    /* background-color: yellow; */
    height: 7vw;
    background-image: url(../../images/boxmaker/desktop/contact-us/clock.png);
    background-repeat: no-repeat;
    background-position: right 2.5vw top 3vw;
    background-size: 1.9vw;
    color: white;
    box-sizing: border-box;
    padding-right: 5.9vw;
    padding-top: 1.4vw;
}

    #working-hours > div:nth-child(1) {
        font-size: 1.35vw;
    }

    #working-hours > div:nth-child(2) {
        font-size: 1.35vw;
        box-sizing: border-box;
        padding-top: 0.5vw;
        font-weight: 500;
    }

#postal-address {
    /* background-color: yellow; */
    height: 9vw;
    background-image: url(../../images/boxmaker/desktop/contact-us/location.png);
    background-repeat: no-repeat;
    background-position: right 2.7vw top 3.1vw;
    background-size: 1.4vw;
    color: white;
    box-sizing: border-box;
    padding-right: 5.9vw;
    padding-top: 1.8vw;
}

    #postal-address > div:nth-child(1) {
        font-size: 1.35vw;
    }

    #postal-address > div:nth-child(2) {
        font-size: 1.35vw;
        box-sizing: border-box;
        padding-top: 1vw;
        font-weight: 500;
    }

#contact-form-container {
    /*background-color: yellow;*/
    height: 31vw;
    box-sizing: border-box;
    padding-right: 2.5vw;
    padding-top: 0.7vw;
}

#contact-form-title {
    height: 3vw;
}

    #contact-form-title > div {
        font-size: 1.6vw;
        padding-right: 2vw;
        position: relative;
        box-sizing: border-box;
    }

        #contact-form-title > div::before {
            content: "";
            position: absolute;
            top: 0.2vw;
            right: 0.6vw;
            height: 1.65vw;
            width: 0.5vw;
            background-color: #00b262;
            border-radius: 1vw;
        }

#contact-form {
}

#contact-form-first-row {
    height: 9vw;
    box-sizing: border-box;
    padding-top: 1.5vw;
    font-size: 0;
}

    #contact-form-first-row > div {
        display: inline-block;
        vertical-align: top;
        font-size: 1.37vw;
        font-weight: 400;
    }

    #contact-form-first-row input {
        width: 20.5vw;
        border-radius: 2vw;
        height: 3.8vw;
        padding-right: 1vw;
        padding-left: 1vw;
        box-sizing: border-box;
    }

#sender-name-container {
    width: 22vw;
}

    #sender-name-container > div:nth-child(1) {
        box-sizing: border-box;
        padding-right: 0.5vw;
    }

    #sender-name-container > div:nth-child(2) {
        /* height: 5vw; */
        /* background-color: yellow; */
        padding-top: 0.7vw;
    }

#sender-name {
    width: 19.8vw;
    border-radius: 2vw;
    height: 3vw;
}

#subject-container {
}

    #subject-container > div:nth-child(1) {
        box-sizing: border-box;
        padding-right: 1.7vw;
    }

    #subject-container > div:nth-child(2) {
        /* height: 5vw; */
        /* background-color: yellow; */
        padding-top: 0.7vw;
        padding-right: 1.2vw;
    }

#subject {
    width: 19.6vw;
    border-radius: 2vw;
    height: 3vw;
}

#desc-container {
    height: 13vw;
}

    #desc-container > div:nth-child(1) {
        font-size: 1.4vw;
        height: 3vw;
        /* background-color: yellow; */
        padding-top: 0.4vw;
        /* position: relative; */
        /* top: 10px; */
        font-weight: 500;
    }


#desc {
    width: 43.5vw;
    height: 8vw;
    border-radius: 2vw;
    resize: none;
    padding-right: 1vw;
    padding-left: 1vw;
    box-sizing: border-box;
}

#send-btn-container {
    padding-right: 23.5vw;
    height: 5vw;
    box-sizing: border-box;
    padding-top: 0.9vw;
}

#send {
    background-color: #00b262;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 1.56vw;
    width: 20vw;
    height: 3.2vw;
    border-radius: 2vw;
}

    #send.disabled {
        background-color: #a8a8a8;
        pointer-events: none;
    }

#main-img-container {
    width: 39.5vw;
}

    #main-img-container img {
        width: 100%;
        height: 100%;
    }

.null-value {
    border: 0.3vw solid red;
}

.star {
    color: red;
}