@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    --roboto: "Roboto", sans-serif;
    --lora: "Lora", serif;
    --primary-color: #e54a35;
    --second-color: #02085b;
}


.page-text-wrapper {
    width: calc(100% - 30vw);
}

#hero {
    background-image: url('../images/dots-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.page-title .title {
    color: var(--primary-color);
    text-transform: uppercase;
    font-family: var(--roboto);
    font-size: 14px;
}

.page-description {
    font-family: var(--lora);
    font-size: 4.625vw;
    color: var(--second-color);
    margin: 0;
    line-height: 1em;
}

.about-block h1,
.profile-details h1,
.sidebar h1,
.contact-us{
    font-family: var(--lora);
    font-size: 26px;
}



.contact-phone {
    text-decoration: none;
    font-weight: bold;
    color: var(--second-color);
}

.profile-details h2 {
    font-size: 28px;
    color: var(--second-color);
    font-family: var(--lora);
}








@media only screen and (max-width: 572px) {
    .page-text-wrapper {
        width: 100vw;
    }

    .page-description {
    font-size: 8.625vw;
}
}