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

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto
}

.d-none {
  display: none !important
}

@media(min-width: 576px) {
  .container {
      max-width:540px
  }
}

@media(min-width: 768px) {
  .container {
      max-width:720px
  }

  .d-md-block {
      display: block !important
  }

  .d-md-flex {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important
  }

  .d-md-none {
      display: none !important
  }
}

@media(min-width: 992px) {
  .container {
      max-width:960px
  }

  .d-lg-block {
      display: block !important
  }
}

@media(min-width: 1200px) {
  .container {
      max-width:1140px
  }
}

.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

.img-fluid {
  max-width: 100%
}

* {
  margin: 0;
  padding: 0
}

body {
  font-family: "Roboto",sans-serif;
  font-size: 16px;
  background-color: #f6f7f9
}

.background-top-box {
  position: relative
}

.background-top {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 342px;
  background: linear-gradient(to bottom, #FC9200, #EF5713);
  z-index: -1
}

.white-background {
  background-color: #fff;
  padding: 20px 15px
}

.main-title {
  font-size: 30px;
  color: #fff;
  line-height: 44px;
  margin-bottom: 40px
}

.article-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px
}

.small-title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 20px
}

p,.article-title {
  line-height: 27px
}

.photo-box {
  text-align: center;
  margin: 0 auto 40px;
  display: flex;
  flex-direction: column;
  max-width: 75%;
  position: relative
}

.photo-box img {
  max-width: 100%
}

.photo-box img.space {
  margin-bottom: 10px
}

.photo-box .photo-desc {
  font-weight: 700;
  max-width: 100%;
  color: #fff;
  background-color: #3378bb;
  padding: 8px 10px;
  margin-top: -5px
}

.photo-box-100 {
  max-width: 100%
}

.top-badges {
  margin-top: 35px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 40px
}

.top-badges .news {
  text-transform: uppercase;
  font-weight: 500;
  color: #fff;
  padding: 8px 20px;
  background-color: #bb6426;
  border-radius: 20px
}

.top-badges .top-social-icons img {
  margin-left: 17px
}

.main {
  max-width: 69%
}

.aside {
  max-width: 30%
}

.top-image {
  margin-bottom: -5px
}

.normal-text {
  margin-bottom: 20px
}

.before-photo {
  margin-bottom: 40px
}

.expert-box {
  display: flex;
  margin-bottom: 30px
}

.expert-box .expert-image {
  width: 38%
}

.expert-box .expert-image img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.expert-box .expert-opinion {
  width: 62%;
  padding: 10px;
  background-color: #f4f4f4;
  color: #263238;
  font-size: 15px;
  display: flex;
  align-items: center
}

.before-last-photo {
  margin-bottom: 80px
}

.last-photos {
  display: flex;
  position: relative;
  margin-bottom: 40px
}

.last-photos .last-photo-box {
  width: 100%
}

.last-photos .last-photo-box img {
  max-width: 100%
}

.cta-bottom {
  text-align: center;
  font-size: 28px;
  font-weight: 900;
  color: #001aee;
  display: block;
  margin-bottom: 20px
}

.alert-offer {
  margin-bottom: 40px;
  text-align: center;
  color: red
}

.thank-you {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.7);
  left: 0;
  top: 0;
  justify-content: center;
  align-items: center;
  display: none;
  z-index: 9
}

.thank-you img {
  position: absolute;
  top: 5%;
  right: 5%;
  cursor: pointer
}

.thank-you .thank-you-box {
  background-color: #fff;
  max-width: 500px;
  width: 500px;
  text-align: center;
  padding: 45px 15px
}

.five-steps {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 50px;
  margin-bottom: 25px
}

.five-steps .desc-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 30px
}

.five-steps .desc-wrapper .number {
  background: linear-gradient(to bottom, #FC9200, #EF5713);
  padding: 3px 10px 3px 10px;
  border-radius: 5px;
  font-weight: bold;
  font-size: 20px;
  color: #fff;
  margin-right: 20px
}

.five-steps .desc-wrapper .desc-title {
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 10px
}

.accept-collapse {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: 350px;
  margin-bottom: 10px;
  overflow: hidden;
  border-radius: 0 0 20px 20px;
  cursor: pointer;
  transition: .3s ease
}

.accept-collapse img {
  width: 100%;
  max-width: 100%;
  height: auto
}

.accept-collapse span {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  padding: 20px;
  background-color: #434343;
  font-size: 16px;
  line-height: 20px;
  font-weight: bold;
  color: #fff
}

.accept-collapse.clicked {
  cursor: default
}

.accept-collapse.clicked span {
  display: none
}

@media(min-width: 767px) {
  .five-steps {
      flex-direction:row;
      justify-content: space-around
  }

  .five-steps .desc-wrapper {
      max-width: 60%
  }
}

.nav {
  background-color: #fff
}

.nav .nav-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 25px 0
}

.nav .nav-wrapper .logo {
  display: flex;
  align-items: center
}

.nav .nav-wrapper .logo span {
  font-family: "Roboto",sans-serif;
  font-size: 30px;
  font-style: normal;
  line-height: 38px;
  color: #f36c0c;
  margin-left: 10px;
  font-weight: 700
}

.nav .nav-wrapper .nav-list {
  display: flex;
  list-style: none
}

.nav .nav-wrapper .nav-list li {
  margin-left: 40px;
  font-size: 15px;
  text-align: center;
}

.nav .nav-wrapper .nav-list li a {
  text-decoration: none;
  color: #000;
  text-transform: uppercase;
  text-align: center;
}

.nav .nav-wrapper .nav-list li:nth-child(1) {
  margin-left: 0
}

.aside {
  padding-left: 20px;
  margin-top: 172px
}

.aside .author-box {
  align-items: center;
  background-color: #fff;
  padding: 20px;
  margin-bottom: 30px
}

.aside .author-box .author {
  display: flex;
  align-items: center;
  margin-bottom: 20px
}

.aside .author-box .author .author-photo {
  margin-right: 20px
}

.aside .author-box .author .author-name {
  display: flex;
  flex-direction: column
}

.aside .author-box .author .author-name span {
  display: block
}

.aside .author-box .author .author-name span:nth-child(1) {
  font-size: 13px;
  margin-bottom: 5px
}

.aside .author-box .author .author-name span:nth-child(2) {
  font-size: 17px;
  font-weight: 700
}

.aside .author-box .author-desc .author-text {
  line-height: 24px;
  margin-bottom: 10px
}

.aside .author-box .author-desc img {
  max-width: 100%
}

.aside .popular {
  background-color: #fff;
  padding: 20px;
  margin-bottom: 30px
}

.aside .popular .popular-title {
  font-size: 18px;
  font-weight: 700;
  padding-bottom: 10px;
  border-bottom: 1px solid #ececec;
  margin-bottom: 10px
}

.aside .popular .news a {
  display: flex;
  margin-bottom: 25px;
  text-decoration: none;
  color: #000
}

.aside .popular .news a .news-photo {
  margin-right: 10px
}

.aside .popular .news a .news-desc {
  display: flex;
  justify-content: space-between;
  flex-direction: column
}

.aside .popular .news a .news-desc .news-text {
  line-height: 20px
}

.aside .popular .news a .news-desc .news-category {
  font-size: 12px;
  padding: 3px 6px;
  background: linear-gradient(to bottom, #FC9200, #EF5713);
  width: fit-content;
  border-radius: 8px;
  color: #fff;
  margin-top: -3px
}

.aside .popular .news:last-child {
  margin-bottom: 0
}

.aside .cta-aside {
  display: block;
  text-align: center
}

.aside .cta-aside img {
  max-width: 102%
}

.cta-aside {
  display: block;
  text-align: center;
  width: 100%;
  height: auto;
  box-shadow: 0 3px 6px rgba(0,0,0,.16);
  border-radius: 5px;
  background: url(../img/cta-aside-bgae835c311b471715ff0213d619410359.webp);
  background-repeat: no-repeat;
  background-size: cover;
  text-decoration: none;
  color: #fff;
  overflow: hidden
}

.cta-aside-text {
  width: calc(100% + 20px);
  height: auto;
  background: linear-gradient(179deg, #FC9200, #EF5713);
  text-transform: uppercase;
  font-family: "Poppins",sans-serif;
  font-weight: bold;
  padding: 8px 0;
  margin-left: -10px;
  transform: rotate(-8deg)
}

.cta-aside-text:first-of-type {
  margin-top: 40px;
  padding: 21px 0
}

.cta-aside-text:last-of-type {
  margin-bottom: 40px
}

.cta-aside-text h5 {
  font-size: 26px;
  line-height: 1.1
}

.cta-aside-text p {
  font-size: 18px;
  line-height: 26px
}

.cta-aside img {
  max-width: 100%;
  margin: 0px 0 -35px
}

.grey-comments-title {
  background-color: #ebebeb;
  padding: 8px 15px;
  margin-top: 30px;
  font-size: 20px;
  font-weight: 700
}

.comments {
  padding: 30px 15px;
  background-color: #fff
}

.comments .comment {
  display: flex;
  margin-bottom: 20px
}

.comments .comment .comment-photo {
  margin-right: 10px
}

.comments .comment .comment-desc {
  margin-top: 3px
}

.comments .comment .comment-desc .comment-author {
  font-size: 13px;
  display: flex;
  align-items: center;
  margin-bottom: 5px
}

.comments .comment .comment-desc .comment-author .author {
  color: #229cff;
  margin-right: 5px;
  font-weight: 700
}

.comments .comment .comment-desc .comment-author .dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #c2c6cd;
  margin-right: 5px
}

.comments .comment .comment-desc .comment-author .time {
  color: #656c79
}

.comments .add-comment-box {
  margin-top: 10px;
  margin-bottom: 30px
}

.comments .add-comment-box .add-comment-title {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 10px
}

.comments .add-comment-box .add-comment-line {
  position: relative;
  margin-bottom: 20px
}

.comments .add-comment-box .add-comment-line .long-line {
  display: block;
  width: 100%;
  height: 2px;
  background-color: #e7e9ef
}

.comments .add-comment-box .add-comment-line .short-line {
  position: absolute;
  left: 0;
  top: 0;
  width: 110px;
  height: 2px;
  z-index: 1;
  background-color: #229cff
}

.comments .add-comment-box .add-comment-form {
  display: flex
}

.comments .add-comment-box .add-comment-form .add-comment-form-avatar {
  margin-right: 10px
}

.comments .add-comment-box .add-comment-form .add-comment-form-content {
  display: flex;
  flex-direction: column;
  width: 100%
}

.comments .add-comment-box .add-comment-form .add-comment-form-content .name-input,.comments .add-comment-box .add-comment-form .add-comment-form-content .name-textarea {
  border-radius: 4px;
  margin-bottom: 10px;
  width: 100%;
  display: block;
  outline: none;
  border: 2px solid #e7e9ef
}

.comments .add-comment-box .add-comment-form .add-comment-form-content .name-input {
  padding: 12px;
  font-family: "Roboto",sans-serif;
  font-size: 16px
}

.comments .add-comment-box .add-comment-form .add-comment-form-content .name-textarea {
  padding: 15px;
  min-height: 200px;
  resize: vertical;
  font-family: "Roboto",sans-serif;
  font-size: 16px
}

.comments .add-comment-box .add-comment-form .add-comment-form-content .send {
  display: flex;
  justify-content: flex-end;
  align-items: center
}

.comments .add-comment-box .add-comment-form .add-comment-form-content .send .attachment,.comments .add-comment-box .add-comment-form .add-comment-form-content .send .send-comment {
  display: block
}

.comments .add-comment-box .add-comment-form .add-comment-form-content .send .send-comment {
  margin-left: 10px;
  padding: 8px 30px;
  background-color: #229cff;
  border-radius: 4px;
  font-size: 16px;
  color: #fff;
  cursor: pointer
}

.comments .add-comment-box .add-comment-form .add-comment-form-content .send .attachment {
  font-size: 13px;
  text-decoration: underline;
  color: #656c79
}

.coupon {
  display: flex;
  align-items: center;
  background-color: #f0fbd7;
  border: 3px dashed #7b9545;
  padding: 25px
}

.coupon .product {
  max-width: 380px;
}

.product img {
  max-width: 100%;
}

.coupon .coupon-desc .coupon-title {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 20px
}

.coupon .coupon-desc .coupon-text {
  font-size: 15px;
  margin-bottom: 20px
}

.coupon .coupon-desc .coupon-cta {
  font-size: 20px;
  font-weight: bold;
  color: #001aee;
  margin-bottom: 10px
}

.coupon .coupon-desc .coupon-red-alert {
  font-size: 14px;
  color: red
}

.zoom-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  cursor: pointer;
  transform: translate(-50%, -50%)
}

.zoom-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0,0,0,.7);
  padding: 5px
}

.zoom.active {
  max-width: 100%;
  height: auto;
  max-height: 100%
}

.zoom.active:hover {
  cursor: zoom-out
}

.footer {
  margin-top: 30px;
  background-color: #373737;
  padding: 20px
}

.footer .footer-wrapper {
  display: flex;
  align-items: center
}

.footer .footer-wrapper .footer-desc {
  margin-right: 40px;
  color: #fff
}

.footer .footer-wrapper .footer-desc .footer-nav {
  display: flex;
  align-items: center;
  margin-bottom: 15px
}

.footer .footer-wrapper .footer-desc .footer-nav .footer-nav-item {
  margin-right: 40px
}

.footer .footer-wrapper .footer-desc .footer-nav .footer-nav-item a {
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  font-family: "Roboto",sans-serif
}

.footer .footer-wrapper .footer-desc .footer-nav .footer-nav-item:nth-child(1) {
  margin-right: 10px
}

.footer .footer-wrapper .footer-desc .footer-text {
  font-size: 14px;
  line-height: 19px
}

.footer .footer-wrapper .footer-desc .footer_legal {
  margin-top: 15px
}

.footer .footer-wrapper .footer-desc .footer_legal .footer_legal_txt {
  font-size: 14px;
  line-height: 19px;
  color: #fff;
  text-align: center;
}

.footer .footer-wrapper .footer-logo .footer-logo-photo {
  display: flex;
  align-items: center;
  margin-bottom: 20px
}

.footer .footer-wrapper .footer-logo .footer-logo-photo img {
  margin-right: 10px
}

.footer .footer-wrapper .footer-logo .footer-logo-photo span.logo-text {
  font-family: "Roboto",sans-serif;
  color: #fff;
  font-size: 30px;
  line-height: 38px;
  font-weight: 700
}

.footer .footer-wrapper .footer-logo .footer-socials a {
  margin-right: 15px;
  text-decoration: none
}

@media(max-width: 1199.98px) {
  .nav .nav-wrapper .nav-list li a {
      font-size:15px
  }

  .footer .footer-wrapper .footer-desc {
      margin-right: 10px
  }

  .footer .footer-wrapper .footer-logo .footer-logo-photo span.logo-text {
      font-size: 30px
  }

  .aside {
      margin-top: 172px
  }

  .aside .cta-aside-text {
      padding: 8px 0
  }

  .aside .cta-aside-text:first-of-type {
      margin-top: 30px;
      padding: 19px 0
  }

  .aside .cta-aside-text:last-of-type {
      margin-bottom: 30px
  }

  .aside .cta-aside-text h5 {
      font-size: 22px
  }

  .aside .cta-aside-text p {
      font-size: 16px;
      line-height: 22px
  }
}

@media(max-width: 991.98px) {
  .nav .nav-wrapper {
      flex-direction:column
  }

  .nav .nav-wrapper .logo {
      margin-bottom: 15px
  }

  .main {
      max-width: 100%
  }

  .expert-box {
      overflow: hidden
  }

  .footer .footer-wrapper {
      flex-direction: column-reverse
  }

  .footer .footer-wrapper .footer-desc {
      width: 100%
  }

  .footer .footer-wrapper .footer-desc .footer-nav .footer-nav-item a {
      font-size: 14px
  }

  .footer .footer-wrapper .footer-desc .footer-nav .footer-nav-item:last-child {
      margin-right: 0
  }

  .footer .footer-wrapper .footer-logo {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%
  }
}

@media(max-width: 767.98px) {
  body {
      background-color:#fff
  }

  .nav .nav-wrapper {
      flex-direction: row;
      padding: 10px 15px
  }

  .nav .nav-wrapper .logo {
      margin-bottom: 0
  }

  .nav .nav-wrapper .logo img {
      width: 25%
  }

  .nav .nav-wrapper .logo span {
      font-size: 21px;
      line-height: 21px
  }

  .white-background {
      padding: 20px 0
  }

  .before-photo {
      margin-bottom: 30px
  }

  .photo-box {
      margin: 0 auto 30px
  }

  .top-badges {
      margin-top: 25px;
      margin-bottom: 20px
  }

  .main-title {
      font-size: 25px;
      line-height: 30px;
      margin-bottom: 20px
  }

  .photo-box {
      max-width: 100%
  }

  .expert-box {
      flex-direction: column
  }

  .expert-box .expert-opinion {
      width: 100%;
      margin-top: -5px
  }

  .expert-box .expert-image {
      width: 100%
  }

  .expert-box .expert-image img {
      width: 100%;
      height: auto
  }

  .alert-offer {
      margin-bottom: 15px
  }

  .grey-comments-title {
      margin-top: 0
  }

  .comments {
      padding: 15px 0 0
  }

  .coupon {
      margin-top: 25px;
      flex-direction: column
  }

  .coupon .coupon-title {
      font-size: 25px;
      font-weight: 700;
      margin-bottom: 20px;
      text-align: center
  }

  .coupon .product {
      margin-right: 0;
      margin-bottom: 15px
  }

  .comments .last-comment {
      margin-bottom: 0
  }

  .footer {
      padding: 20px 0
  }

  .footer .footer-wrapper .footer-desc .footer-nav {
      flex-direction: column
  }

  .footer .footer-wrapper .footer-desc .footer-nav .footer-nav-item {
      margin-right: 0;
      margin-bottom: 10px
  }

  .footer .footer-wrapper .footer-desc .footer-text {
      text-align: center
  }

  .footer .footer-wrapper .footer-desc .footer_legal .footer_legal_txt {
      text-align: center
  }

  .footer .footer-wrapper .footer-logo {
      flex-direction: column;
      margin-bottom: 15px
  }
}

@media(max-width: 362px) {
  .background-top {
      height:380px
  }

  .top-badges {
      flex-wrap: wrap;
      gap: 6px;
      flex-direction: column-reverse
  }

  .top-badges .news {
      margin-right: auto
  }

  .top-badges .top-social-icons {
      width: 100%
  }

  .top-badges .top-social-icons a img {
      width: 30px;
      height: auto;
      margin-left: 10px
  }

  .top-badges .top-social-icons a:first-child img {
      margin-left: 0
  }
}