body {
  background: #eeeeee9e !important;
  overflow-y: scroll;
}

div {
  position: relative;
}

header {
  height: 130px;
}

.main-wrapper {
  width: 1200px;
  margin: 0 auto;
  padding: 50px 15px;
  position: relative;
}

.head-logo {
  background: #00556d;
  padding: 5px 0 5px 40px;
  height: 119px;
  width: 350px;
}

.head-logo img {
  height: 115px;
}

.head-banner3 {
  width: 100%;
}

.head-banner3 ul {
  display: flex;
  justify-content: space-around;
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #3b8495;
  width: 100%;
}

.head-banner3 ul li {
  float: left;
  flex: 1;
}

.head-banner3 ul li a {
  display: block;
  color: white;
  text-align: center;
  padding: 24px 0;
  text-decoration: none;
}

.head-banner3 ul li a:hover:not(.selected) {
  background-color: #025570;
}

.head-banner3 ul li a:visited {
  color: white;
}

.head-banner3 ul .selected {
  background-color: #004961;
}

.head-banner3-shadow {
  position: absolute;
  transform: rotate(135deg);
  z-index: 1;
  bottom: -14px;
  left: -11px;
  width: 0;
  height: 0;
  border-left: 17px solid transparent;
  border-right: 17px solid transparent;

  border-top: 17px solid #001f2c;
}

.footer-box {
  margin-top: 40px;
}

.footerbox-user {
  background: #195a65;
  display: inline-block;
  width: 25%;
  position: relative;
  text-align: center;
}

.footerbox-user:before {
  content: "";
  display: block;
  padding-top: 100%;
}

.footerbox-user > a > div {
  position: absolute;
  top: 30%;
  left: 0;
  bottom: 0;
  right: 0;
}

.footerbox-user > a:hover > div p {
  color: #77abb2;
}

.footerbox-user:nth-child(odd) {
  background: #2c6772;
}

.footerbox-user img {
  height: 80px;
}

.footerbox-user p {
  color: #fff;
  font-size: 14px;
}

.footerbox-user button {
  margin-top: 40px;
  width: 30%;
  border: none;
  background: #fff;
  padding: 5px 10px;
}
.footerbox-user button:hover {
  background: #ccc;
  cursor: pointer;
}

.mainbox-content {
  overflow: hidden;
  /* overflow breaks sticky position */
}

@media screen and (max-width: 1250px) {
  .main-wrapper {
    width: 930px;
  }

  .head-banner3 ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
  }

  .head-banner3 ul li {
    line-height: 0px;
    width: 160px;
    flex: none;
  }

  /* О электронной подписи */
  .head-banner3 ul li.item295,
  .head-banner3 ul li.item302 {
    width: 210px;
  }

  .head-banner3 ul li a {
    padding: 22px;
    height: 1px;
  }

  .head-banner3-shadow {
    display: none;
  }

  .footerbox-user > div {
    top: 10%;
  }
}
