:root{
--primary-text-color: #757575;
--title-text-color: #212121;
--accent-text-color:#2196F3;
--white-text-color:#FFFFFF;
--black-text-color: #000000;
--background-part:#2F303A;
--address: rgba(255, 255, 255, 0.6);
--background-button:#F5F4FA;
}
body{
  background-color: var(--white-text-color);
  color: var(--primary-text-color);
  font-family: Roboto, sans-serif;
  font-size: 14px;
  letter-spacing: 0.03em;
}
ul {
  list-style: none;
}

.line {
  text-decoration: none;
}
.logo{
  font-family: Raleway, sans-serif;
  color: var(--black-text-color);
  font-weight: 700;
  font-size: 26px;
  line-height: 1;
  text-decoration: none;
}
.logo-part{
  color: var(--accent-text-color);
}

.nav-link{
  color:var(--title-text-color);
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0.02em;
}

.contacts-link{
  color: var(--primary-text-color);
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0.02em;
}

.contacts-link:hover, .contacts-link:focus,
.nav-link:hover, .nav-link:focus{
  color: var(--accent-text-color);
}

.hero{
  background-color: var(--background-part);
}

.hero-title{
  color: var(--white-text-color);
  font-weight: 900;
  font-size: 44px;
  line-height: 1.36;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.hero-button {
  color: var(--white-text-color);
  background-color: var(--accent-text-color);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.88;
  letter-spacing: 0.06em;
  cursor: pointer;
}

.section-title{
  color: var(--title-text-color);
  font-size: 36px;
  line-height: 1;
  text-align: center;
}

.features-title{
  color: var(--title-text-color);
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  font-size: inherit;
}
.features-text{
  line-height: 1.71;
}

.team-title{
  color: var(--title-text-color);
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  text-align: center;
}
.team-text{
  font-size: 16px;
  line-height: 1;
  text-align: center;
}

footer{
  background-color: var(--background-part);
}
.footer .logo {
  color: var(--white-text-color);
}

.address-point, .address-link{
  font-size: 14px;
  line-height: 1.71;
  font-style: normal;
}
.address-point{
  color: var(--white-text-color);
}
.address-link{
  color: var(--address);
}
.address-point:hover, .address-point:focus,
.address-link:hover, .address-link:focus{
  color: var(--accent-text-color);
}

/* Portfolio */
.filter-button{
  color: var(--title-text-color);
  background-color: var(--background-button);
  cursor: pointer;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.63;
}
.filter-button:hover, .filter-button:focus{
  background-color: var(--accent-text-color);
  color: var(--white-text-color);
}

.filter-title{
color: var(--title-text-color);
font-size: 18px;
line-height: 2;
letter-spacing: 0.06em;
}
.filter-text{
  color: var(--primary-text-color);
  font-size: 16px;
  line-height: 1.88;
}
