:root{
--header-color:#2196F3;
--mainul-color:#212121;
--mainulfon-color:#F5F4FA;
--mainli-color:#757575;
--footer-color:#FFFFFF;
--logo-color:#000;
}

body{
    font-family: "Roboto", sans-serif;
}

.header-logo{
color: #000;
font-family: Raleway;
font-size: 26px;
font-style: normal;
font-weight: 700;
line-height: 1.19;
letter-spacing: 0.78px;

}

.header-item:hover{
    color: #212121;
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 1.14;
letter-spacing: 0.28px;
text-decoration: none;
}

.hero-title{
    lex-shrink: 0;

text-align: center;
font-family: Roboto;
font-size: 44px;
font-style: normal;
font-weight: 900;
line-height: 1.36;
letter-spacing: 2.64px;
text-transform: uppercase;
}

.hero-text{
    color: #757575;
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 1.71;
letter-spacing: 0.42px;
}

.hero-zag:hover{
    color: #212121;
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 1.71;
letter-spacing: 0.42px;
text-transform: uppercase;
}

.footer-items:hover{
    color: #FFF;
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 1.71;
letter-spacing: 0.42px;

}
.header-items:hover{
color: #212121;
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 1.14;
letter-spacing: 0.28px;
}

.main-item:hover{
    color: #212121;

font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 1.62;
letter-spacing: 0.48px;
}