*, *::after, *::before {
  box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
}

p {
  margin: 0 0 10px;
}

body {
  background-color: #fff;
  color: #000000;
  margin: 0;
  font-size: 14px;
  font-family: 'Raleway', sans-serif;
}

a {
  display: inline-block;
}

ul, li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.container {
  max-width: 1170px;
  width: 100%;
  margin: 0 auto;
  padding: 0 15px;
}

.menu.open-sidebar {
  left: 0;
}
/* Menu */

.main-menu__btn {
  position: absolute;
  width: 20px;
  height: 310px;
  top: 15px;
  left: 15px;
  display: none;
  z-index: 6;
}
.main-menu__btn div{
  height: 2px;
  background-color: #000;
  margin-bottom: 5px;
}

.main {
  background-color: #F5F5F5;
  padding: 50px 0;
  position: relative;
}

.menu {
  max-width: 310px;
  width: 100%;
  border-right: 1px solid #000;
}

.main-menu__item {
  color: #212020;
  font-size: 15px;
  line-height: 20px;
  padding-left: 20px;
  margin-bottom: 20px;
  position: relative;
}

.main-menu__item a {
  text-decoration: none;
  color: #000;
}

.main-page a::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../img/menu/home-icon.png);
}

.view-order a::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../img/menu/view-icon.png);
}

.search-order a::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../img/menu/search-icon.png);
}

.sorting-order a::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../img/menu/sort-icon.png);
}

.create-order a::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../img/menu/create-order-icon.png);
}

.help a::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../img/menu/help-icon.png);
}

.quit a::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../img/menu/exit-icon.png);
}

.main__inner {
  display: flex;
}

.info {
  width: 100%;
  padding-left: 20px;
}

.info__title {
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #212020;
}

.info__about {
  max-width: 300px;
  width: 100%;
  padding: 25px 15px;
  display: flex;
  flex-direction: column;
  color: #000;
  background-color: #fff;
  box-shadow: 0px 7px 24.3px 2.7px rgba(91, 89, 89, 0.14);
}

.info__about-login, .info__about-fio, .info__about-email {
  position: relative;
  max-width: 300px;
  width: 100%;
  font-size: 18px;
  line-height: 24px;
  border-bottom: 1px solid #4d667f;
  margin-bottom: 15px;
}

.info__about-email {
  margin-bottom: 0;
}

.info__about-login span, .info__about-fio span, .info__about-email span {
  position: absolute;
  right: 0;
  font-size: 16px;
}

.info__title-about {
  font-family: 'Roboto', sans-serif;
  font-size: 22px;
  line-height: 26px;
  font-weight: 500;
  margin-bottom: 20px;
  color: #0b2d50;
}
