@charset 'utf-8';

#service-container{
  margin-bottom: 10px;
}

#service-container .graph {
  position: relative;
  width: 400px;
  height: 200px;
  margin: 0 auto;
}
@media screen and (max-width: 480px) {
  #service-container .graph {
    width: 80vw;
    height: 40vw;
  }
}
#service-container .graph .label {
  position: absolute;
  bottom: 0;
  width: 53.5%;
  left: 23.25%;
  margin: 0 auto;
}
#service-container .graph a.button {
  position: absolute;
}
#service-container .graph a.button:hover {
  opacity: 0.8;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  filter: alpha(opacity=80);
}
#service-container .graph a.button:nth-child(1) {
  width: 29%;
  bottom: 0;
}
#service-container .graph a.button:nth-child(5) {
  width: 28.25%;
  bottom: 0;
}
#service-container .graph a.button:nth-child(2),
#service-container .graph a.button:nth-child(4) {
  width: 32.25%;
  top: 4.5%;
}
#service-container .graph a.button:nth-child(3) {
  width: 30.75%;
  top: 0;
  left: 34.625%;
}
@media screen and (max-width: 767px) {
  #service-container .graph a.button:nth-child(3) {
    top: -0.5%;
    width: 31.25%;
  }
}
#service-container .graph a.button:nth-child(1) {
  left: 0;
}
#service-container .graph a.button:nth-child(2) {
  left: 9.75%;
}
#service-container .graph a.button:nth-child(4) {
  right: 9.75%;
}
#service-container .graph a.button:nth-child(5) {
  right: 0.75%;
}


.sty-btn-base--icon {
  position: relative;
  padding-right: 30px;
  padding-left: 30px;
}
.sty-btn-base--icon::after {
content: none;
}
.sty-btn-base--icon span {
position: relative;
display: inline-block;
}
.sty-btn-base--icon span::before {
  content: "";
  position: absolute;
  mask: url(/assets/img/icon__login.svg) no-repeat center center/contain;
  -webkit-mask: url(/assets/img/icon__login.svg) no-repeat center center/contain;
  background-color: #fff;
  background-size: auto 25px;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  left: -30px;
  margin: auto;
}
.sty-btn-base--icon-ac span::before {
  mask: url(/assets/img/icon__account.svg) no-repeat center center/contain;
  -webkit-mask: url(/assets/img/icon__account.svg) no-repeat center center/contain;
  height: 30px;
  width: 30px;
  left: -33px;
}
.sty-btn-base--icon.btn-bg_yellow:hover span::before {
  background-color: #f08300;
}
.sty-btn-base--icon.btn-bg_gray:hover span::before {
  background-color: #313342;
}

@media screen and (max-width: 767px) {
  .sty-btn-base--login::after {
    content: "";
    position: absolute;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    mask: url(/assets/img/icon__modaal.svg) no-repeat center center/contain;
    -webkit-mask: url(/assets/img/icon__modaal.svg) no-repeat center center/contain;
    background-color: #fff;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
    top: 0;
    bottom: 0;
    right: 15px;
    margin: auto;
  }
}
.sty-label--set {
  display: inline-block;
}
.sty-label--set:before {
  top: 0;
  bottom: 0;
  margin: auto;
  left: -40px;
}

.sty-cv--block{
  height: 90px;
}

.sty-cv--block a{
  height: 100%;
}

.sty-cv--block .btn-base{
  display: flex;
  align-items: center;
  justify-content: center;
}