* {
    margin: 0;
    padding: 0;
    outline: 0;
    border: 0;
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}
body {padding: 50px;}
img {max-width: 100%; height: auto;}
.brand {width: 270px; display: flex; position: absolute; left: 0; top: 0;}
.main-wrape {width: 100%; height: calc(100vh - 100px); position: relative;}
.diya {width: 380px;}
h1 {color: rgb(230, 231, 232); font-size: clamp(11vw, 231px, 2vh); text-transform: uppercase; letter-spacing: 9px; text-align: center; line-height: 1;}
.container {margin: 0 auto;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap; height: 100%;}
    @media (max-width: 1100px) {
        .brand {width: 150px;}
        .diya {width: 250px;}
        h1 {font-size: clamp(18vw, 231px, 2vh);}
    }
    @media (max-width: 767px) {
        body {padding: 25px 25px 25px 25px;}
        .main-wrape {height: calc(100vh - 75px); position: relative; padding-top: 100px;}
        .diya {width: 200px; margin: 30px 0; }
        .brand {width: 150px;
            left: 50%;
            margin-left: -75px;
            top: 0;}
    }