@font-face {
    font-family: Raleway;
    src: url(../fonts/Raleway-Regular.ttf) format("opentype");
    font-weight: 400;
    font-style: normal
}

body {
    position: relative;
    height: 1024px;

    background: #FFFFFF;
}

.diamonds {
    position: absolute;
    width: 100%;
    height: 378px;
    left: 0px;
    top: 646px;

    background: url("../images/diamonds.png") no-repeat;
    background-size: cover;
}

.info {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 56px;

    position: absolute;
    width: 1440px;
    height: 566px;
    left: calc(50% - 1440px/2);
    top: 40px;
}

.logo {
    height: 378px;
    width: 941.25px;
    /* Inside auto layout */

    flex: none;
    order: 0;
    flex-grow: 0;
    background: url("../images/logo.png");
    background-size: cover;
}

.rectangle {
    width: 100%;
    height: 1px;

    background: #1B2030;
    opacity: 0.3;
    flex: none;
    order: 1;
    flex-grow: 0;
}

.address {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    gap: 30px;

    width: 1110px;
    min-height: 75px;

    flex: none;
    order: 2;
    flex-grow: 0;
}

.firm {
    width: 350px;
    min-height: 25px;

    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 140%;
    /* or 25px */
    color: #1B2030;
    /* Inside auto layout */

    flex: none;
    order: 0;
    flex-grow: 0;
}

.email {
    width: 350px;
    min-height: 25px;

    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 140%;
    /* or 25px */
    color: #1B2030;
    /* Inside auto layout */

    flex: none;
    order: 1;
    flex-grow: 0;
}

.office {
    width: 350px;
    min-height: 25px;

    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 140%;
    /* or 25px */
    color: #1B2030;
    /* Inside auto layout */

    flex: none;
    order: 2;
    flex-grow: 0;
}

@media only screen and (max-width : 834px) {
    body {
        position: relative;
        width: 834px;
        height: 1194px;
    }

    .diamonds {
        position: absolute;
        height: 620px;
        left: 0px;
        top: 574px;
        background-size: contain;
    }

    .info {
        display: block;
        position: absolute;
        width: 722px;
        height: 91px;
        left: 0;
        top: 40px;
    }

    .logo {
        position: absolute;
        width: 100%;
        height: 290px;
        left: 56px;
        top: 0;
        background-size: contain;
    }

    .rectangle {
        position: absolute;
        width: 834px;
        height: 1px;
        left: 0px;
        top: 386px;
    }

    .address {
        display: block;
        position: absolute;
        width: 722px;
        height: 91px;
        left: 56px;
        top: 423px;
    }

    .firm {
        position: absolute;
        width: 320px;
    }

    .email {
        position: absolute;
        width: 320px;
        top:30px
    }

    .office {
        position: absolute;
        width: 320px;
        right: 0;
    }
}

@media only screen and (max-width : 375px) {
    body {
        position: relative;
        width: 375px;
        height: 667px;
    }

    .diamonds {
        position: absolute;
        width: 375px;
        height: 181px;
        left: 0px;
        top: 486px;
    }

    .rectangle {
        position: absolute;
        width: 375px;
        height: 1px;
        left: 0px;
        top: 215px;
    }

    .logo {
        position: absolute;
        width: 335px;
        height: 135px;
        left: 20px;
        top: 40px;
    }

    .address {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 0px;
        gap: 20px;

        position: absolute;
        width: 320px;
        height: 190px;
        left: 20px;
        top: 256px;
    }

    .firm {
        position: relative;
        top: 0
    }

    .email {
        top: 40px
    }

    .office {
        position: relative;
        top: 60px;
    }
}