/* цвет основного текста #212121*/
/* цвет дополнительного текста #757575*/
/* цвет текста шапки и футера #FFFFFF;*/
/* цвет текста лого и выделения #2196F3 #000000*/
/*background main: #F5F5F5;
/*background: #F5F4FA;*/
/*background footer: #2F303A;*/
:root {
    --primary-text-color: #757575;
    --banner-text-color: #FFFFFF;
    --title-text-color: #212121;
    --accent-color: #2196F3;
    --main-background-color: #F5F5F5;
    --header-background-color: #FFFFFF;
    --footer-background-color: #2F303A;

}
body {
    font-family: Roboto, sans-serif;
    color: var(--title-text-color);
}
.header {
    font-size: 14px;
    line-height: 1.14;
    font-weight: 500;
    background-color: var(--header-background-color);
}
.logo {
    font-family: Raleway, sans-serif;
    font-size: 26px;
    line-height: 1.19;
    text-decoration: none;
    letter-spacing: 0.03em;
    color: #000000;
}
.logo-span {
    color: #2196F3;
}
.list {
    list-style: none;
}
.link-nav {
    text-decoration: none;
    letter-spacing: 0.02em;
    color: var(--title-text-color);
}
.link-current {
    text-decoration: none;
    letter-spacing: 0.02em;
    color: var(--accent-color);
}
.link-nav:hover,
.link-nav:focus {
    color: var(--accent-color);
}
.address-head {
    text-decoration: none;
    letter-spacing: 0.02em;
    color: var(--primary-text-color);
}
.address-head:hover,
.address-head:focus {
    color: var(--accent-color);
}

.banner {
    color: var(--banner-text-color);
    background-color: var(--footer-background-color);
}
.banner-title {
    font-size: 44px;
    line-height: 1.36;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.button {
    font-family: inherit;
    font-size: 16px;
    line-height: 1.88;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0.06em;
    color: #FFFFFF;
    background-color: #2196F3;
    cursor: pointer; 
}
.features-title{
    font-size: 14px;
    line-height: 1.14;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.features-text {
    font-size: 14px;
    line-height: 1.71;
    letter-spacing: 0.03em;
    color: var(--primary-text-color);
}
.section-title {
    font-size: 36px;
    line-height: 1.17;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0.03em;
}
.team-title {
    font-size: 16px;
    line-height: 1.19;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0.03em;
}
.section-team {
    background-color: #F5F4FA;
}
.team-role {
    font-size: 16px;
    line-height: 1.19;
    text-align: center;
    letter-spacing: 0.03em;
    color: var(--primary-text-color);
}

.link {
    text-decoration: none;
}
.footer {
    background-color: var(--footer-background-color);
}
.address {
    font-style: normal;
}
.logo-footer {
    font-family: Raleway, sans-serif;
    font-size: 26px;
    line-height: 1.19;
    text-decoration: none;
    letter-spacing: 0.03em;
    color: #FFFFFF;
}
.link-map {
    font-size: 14px;
    line-height: 1.71;
    text-decoration: none;
    letter-spacing: 0.03em;
    color: var(--banner-text-color);
}
.link-map:hover,
.link-map:focus,
.address-footer:hover,
.address-footer:focus {
    color: var(--accent-color);
}
.address-footer {
    font-size: 14px;
    line-height: 1.71;
    text-decoration: none;
    letter-spacing: 0.03em;
    color: rgba(255, 255, 255, 0.6);
}
.button-portfolio {
    font-family: inherit;
    font-size: 16px;
    line-height: 1.62;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0.03em;
    background-color: #F5F4FA;
    color: inherit;
}
.button-portfolio:hover,
.button-portfolio:focus {
    background-color: var(--accent-color);
    color: #FFFFFF;
    cursor: pointer;
}
.pic-title {
    font-size: 18px;
    line-height: 2;
    letter-spacing: 0.06em;
}
.pic-text {
    font-size: 16px;
    line-height: 1.88;
    letter-spacing: 0.03em;
    color: var(--primary-text-color);
}