body{
    background-color: #f3f3f3;
}

.tinted{
    color: #31A9D0;
}

/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    .header {
        background-image: url(img/Header_767.svg) !important;
    }
 }

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) { 
    .header {
        background-image: url(img/Header_991.svg) !important;
        height: calc(0.45 * 100vw) !important;
    }
 }

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) { 
    .header {
        background-image: url(img/Header_1201.svg) !important;
        height: calc(0.35 * 100vw) !important;
    }
 }

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { 
    .header {
        background-image: url(img/Header_3840.svg) !important;
        height: calc(0.35 * 100vw) !important;
        background-size: 100% calc(0.4 * 100vh) !important;
    }
 }

 @media (min-width: 1270px) { 
    .header {
        background-image: url(img/Header_3840.svg) !important;
        height: calc(0.35 * 100vw) !important;
        background-size: 100% calc(0.4 * 100vh) !important;
    }
 }
 @media (min-width: 1470px) { 
    .header {
        background-image: url(img/Header_3840.svg) !important;
        height: calc(0.4 * 100vw) !important;
        background-size: 100% calc(0.35 * 100vh) !important;
    }
 }
 @media (min-width: 1670px) { 
    .header {
        background-image: url(img/Header_3840.svg) !important;
        height: calc(0.3 * 100vw) !important;
        background-size: 100% calc(0.3 * 100vh) !important;
    }
 }
 @media (min-width: 1920px) { 
    .header {
        background-image: url(img/Header_3840.svg) !important;
        height: calc(0.2 * 100vw) !important;
        background-size: 100% calc(0.25 * 100vh) !important;
    }
 }

.header{
    width: 100%;
    background: #f3f3f3;
    background-image: url(img/Header_575.svg);
    background-repeat: no-repeat;
    height: calc(0.55 * 100vw);
    background-size: 100% calc(0.3 * 100vh);
}

/* .margin-top{
    margin-top: 605px;
} */

#people-talk{
    position: absolute;
    left: 5%;
    top: 10%;
    font-family: Roboto;
    font-style: normal;
    font-weight: 500;
    font-size: 4rem;
    line-height: 70px;
}

#design-text {
    position: absolute;
    height: 50%;
    right: 1.5%;
    z-index: 9999;
    color: #4E4C4D;
    font-size: 4rem;
    transform: rotate(-90deg);
}
#logo{
    position: absolute;
    right: 0;
    top: 2%;
    z-index: -99999;
}

.footer-paragraph{
    font-size: 2rem!important;
}

.footer{
    background: url(img/Vector_Design.png) no-repeat;
    height: 380px;
}

.position-bottom{
    position: relative;
    top: 30%;
}