@media (max-width: 575px) {
  .txt18 {
    font-size: 15px;
    line-height: 1.2em;
  }
}

@media (min-width: 576px) {
  .txt18 {
    font-size: 18px;
    line-height: 1.2em;
  }
}

.semibold {
  font-family: 'Gilroy-Semibold';
}

.dark {
  color: #1e1e25;
}

.txt12 {
  font-size: 12px;
  line-height: 1.2em;
}

.light {
  font-family: 'Gilroy-Light';
}

.grey {
  color: #766f63;
}

#header {
  background: #f9f9fb;
  position: relative;
  min-height: 800px;
}

@media (min-width: 992px) {
  .top-woman {
    position: absolute;
    left: 53%;
    bottom: 0;
    z-index: 0;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .top-title {
    max-width: 510px;
    margin-top: 100px;
  }
}

@media (min-width: 1200px) {
  .top-title {
    max-width: 670px;
    margin-top: 100px;
  }
}

@media (max-width: 575px) {
  .txt30 {
    font-size: 22px;
    line-height: 1.2em;
  }
}

@media (min-width: 576px) {
  .txt30 {
    font-size: 30px;
    line-height: 1.2em;
  }
}

.regular {
  font-family: 'Gilroy-Regular';
}

.red-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #e82a2a;
  animation: blink 1s infinite;
}

@keyframes blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

@media (max-width: 575px) {
  .txt36 {
    font-size: 27px;
    line-height: 1.2em;
  }
}

@media (min-width: 576px) {
  .txt36 {
    font-size: 36px;
    line-height: 1.2em;
  }
}

.bold {
  font-family: 'Gilroy-Bold';
}

@media (max-width: 575px) {
  .txt26 {
    font-size: 20px;
    line-height: 1.2em;
  }
}

@media (min-width: 576px) {
  .txt26 {
    font-size: 26px;
    line-height: 1.2em;
  }
}

@media (max-width: 575px) {
  .txt24 {
    font-size: 18px;
    line-height: 1.2em;
  }
}

@media (min-width: 576px) {
  .txt24 {
    font-size: 24px;
    line-height: 1.2em;
  }
}

.blue-btn {
  background: linear-gradient(to bottom, #599fff, #4a7ce7);
  border: none;
  padding: 30px 70px;
  border-radius: 15px;
  text-transform: uppercase;
  position: relative;
  overflow: hidden;
}

.blue-btn:hover {
  background: linear-gradient(to bottom, #4a7ce7, #599fff);
}

.blue-btn .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 120px;
  transform: skewX(-45deg);
  animation: flareAnimation;
  left: -150%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.7));
  animation: flareAnimation 3s infinite linear;
}

@keyframes flareAnimation {
  0% {
    left: -250%;
  }
  100% {
    left: 250%;
  }
}

.bolditalic {
  font-family: 'Gilroy-BoldItalic';
}

.dialog {
  background: #fff;
  max-width: 300px;
  border-radius: 15px;
  padding: 20px;
  box-shadow: 0 0 40px rgba(0,0,0,0.1);
  position: absolute;
  z-index: 1;
  right: 0;
  top: 320px;
}

@media (min-width: 576px) and (max-width: 1199px) {
  .dialog {
    left: 50px;
  }
}

.top-title {
  position: relative;
  z-index: 1;
}

@media (min-width: 576px) and (max-width: 991px) {
  .top-title {
    margin-top: 60px;
  }
}

@media (max-width: 991px) {
  .top-woman {
    position: relative;
    text-align: center;
  }
}

@media (max-width: 575px) {
  .top-title {
    margin-top: 30px;
  }
}

@media (min-width: 576px) {
  .logo {
    max-width: 120px;
    max-height: 80px;
  }
}

@media (max-width: 575px) {
  .logo {
    max-width: 90px;
    max-height: 60px;
  }
}

@media (max-width: 575px) {
  .blue-btn {
    padding: 30px;
    width: 100%;
  }
}

@media (max-width: 575px) {
  .top-woman img {
    width: 100%;
  }
}

.txt16 {
  font-size: 16px;
  line-height: 1.2em;
}

@media (max-width: 575px) {
  .dialog {
    bottom: 50px;
    top: inherit;
    max-width: 250px;
  }
}

@media (max-width: 575px) {
  .txt40 {
    font-size: 28px;
    line-height: 1.2em;
  }
}

@media (min-width: 576px) {
  .txt40 {
    font-size: 40px;
    line-height: 1.2em;
  }
}

#pain {
  padding-top: 80px;
  padding-bottom: 80px;
}

.pain-item-2 {
  background: #e4e4ef;
  border-radius: 15px;
  height: 100%;
}

.pain-item-1 {
  background: #f4f4f7;
  border-radius: 15px;
  height: 100%;
}

@media (max-width: 575px) {
  .txt20 {
    font-size: 15px;
    line-height: 1.2em;
  }
}

@media (min-width: 576px) {
  .txt20 {
    font-size: 20px;
    line-height: 1.2em;
  }
}

.quotes-mini {
  background: url('../../assets/img/quotes.svg') -10px -10px no-repeat,#36a4ff;
  border-radius: 15px;
}

.quotes {
  background: url('../../assets/img/quotes.svg') -10px -10px no-repeat,#36a4ff;
  border-radius: 15px;
}

@media (min-width: 768px) {
  .quotes {
    padding: 40px 40px 40px 200px;
  }
}

@media (max-width: 767px) {
  .quotes {
    padding: 150px 40px 40px 40px;
  }
}

@media (max-width: 575px) {
  .pain-item-1, .pain-item-2 {
    padding: 20px;
  }
}

@media (min-width: 576px) {
  .pain-item-1, .pain-item-2 {
    padding: 40px;
  }
}

@media (max-width: 575px) {
  .sad {
    width: 40px;
  }
}

#director {
  background: url("../../assets/img/director-bg.jpg") top/cover no-repeat;
  padding-top: 80px;
  padding-bottom: 80px;
  position: relative;
}

@media (min-width: 768px) {
  .director-title {
    max-width: 50%;
  }
}

@media (min-width: 768px) {
  .director {
    position: absolute;
    bottom: 0;
    left: 50%;
  }
}

@media (max-width: 767px) {
  #director {
    padding-bottom: 0px;
  }
}

@media (max-width: 575px) {
  .director {
    width: 100%;
  }
}

#steps {
  padding-top: 80px;
  padding-bottom: 80px;
}
@media (max-width: 575px) {
  #steps {
  padding-bottom: 50px;
}
}

.step-item {
  border: 3px solid #36a4ff;
  border-radius: 15px;
  padding: 40px 20px 20px 20px;
  height: 90%;
}

.blue {
  color: #36a4ff;
}

.txt60 {
  font-size: 60px;
  line-height: 1.2em;
}

.step-number {
  background: #fff;
  padding: 0 15px;
  margin-top: -90px;
  margin-bottom: 10px;
}

.txt22 {
  font-size: 22px;
  line-height: 1.2em;
}

.quotes-mini {
  padding: 120px 30px 30px 30px;
  height: 90%;
}

.medium {
  font-family: 'Gilroy-Medium';
}

#preim {
  background: #e4f2fe;
  padding-top: 80px;
  padding-bottom: 80px;
}

@media (max-width: 575px) {
  #preim .row img {
    zoom: 0.7;
  }
}

@media (max-width: 575px) {
  .preim-img {
    min-width: 80px;
  }
}

@media (min-width: 576px) {
  .preim-img {
    min-width: 110px;
  }
}

#cases {
  padding-top: 80px;
  padding-bottom: 80px;
}

.case-item {
  height: 500px;
  border-radius: 15px;
  padding: 30px;
  position: relative;
  overflow: hidden;
}

.underline {
  text-decoration: underline;
}

.case-txt {
  position: relative;
  z-index: 9;
}

.case-grad {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(to bottom, rgba(54,164,255,0) 40%, rgba(54,164,255,1));
}

#cardSlider {
  --f-carousel-slide-width: 100%;
  --f-carousel-spacing: 0;
  --f-carousel-slide-padding: 0 1rem;
  --f-button-prev-pos: 2rem;
  --f-button-next-pos: 2rem;
  --f-button-bg: #fff;
  --f-button-color: #333;
  --f-button-width: 48px;
  --f-button-height: 48px;
  --f-button-border-radius: 50%;
  --f-button-svg-width: 27px;
  --f-button-svg-height: 27px;
  --f-button-svg-stroke-width: 1.5;
  --f-button-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

@media (min-width: 1200px) {
  #cardSlider {
    --f-carousel-slide-width: calc(100% / 3);
  }
}

@media (min-width: 768px) and (max-width:1199px) {
  #cardSlider {
    --f-carousel-slide-width: calc(100% / 2);
  }
}

@media (max-width: 767px) {
  #cardSlider {
    --f-carousel-slide-width: 100%;
  }
}

@media (max-width: 991px) {
  #director {
    overflow: hidden;
  }
}

#quiz {
  background: #f4f4f7;
  padding-top: 80px;
  padding-bottom: 80px;
}

.quiz-body {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 0 50px rgba(0,0,0,0.1);
}

@media (min-width: 576px) {
  .quiz-body {
    padding: 20px;
  }
}

@media (mфч-width: 575px) {
  .quiz-body {
    padding: 50px;
  }
}

#pain-boost {
  padding-top: 80px;
  padding-bottom: 80px;
}

.pain-boost-item {
  background: #fcede8;
  border-radius: 15px;
  height: 100%;
}

@media (min-width: 576px) {
  .pain-boost-item {
    padding: 30px;
  }
}

@media (max-width: 575px) {
  .pain-boost-item {
    padding: 15px;
  }
}

@media (max-width: 575px) {
  .pain-boost-item img {
    zoom: 0.7;
  }
}

@media (max-width: 575px) {
  .pain-boost-item .txt22 {
    font-size: 16px;
  }
}

@media (max-width: 575px) {
  .pain-boost-item .txt18 {
    font-size: 13px;
  }
}

.white-btn {
  background: #fff;
  border-radius: 15px;
  padding: 30px;
  position: relative;
  overflow: hidden;
}

.quotes-btn {
  min-width: 40%;
}

.white-btn .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 145px;
  transform: skewX(-45deg);
  animation: flareAnimation;
  left: -150%;
  background: linear-gradient(90deg, rgba(54, 164, 255, 0.1), rgba(54, 164, 255, 0.7));
  animation: flareAnimation 3s infinite linear;
}

a:hover.no-line {
  text-decoration: none;
}

#footer .container {
  border-top: 1px solid #d4dcea;
}

.txt11 {
  font-size: 11px;
  line-height: 1.2em;
}

@media (max-width: 575px) {
  #success-title {
    background: #f4f4f7;
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

@media (min-width: 576px) {
  #success-title {
    background: #f4f4f7;
    padding-top: 80px;
    padding-bottom: 80px;
    position: relative;
    z-index: 0;
  }
}

.blue-select {
  background: #4e86ff;
  box-shadow: 10px 0 0 #4e86ff, -10px 0 #4e86ff;
}

@media (min-width: 576px) {
  .txt48 {
    font-size: 48px;
    line-height: 1.2em;
  }
}

@media (max-width: 575px) {
  .txt48 {
    font-size: 35px;
    line-height: 1.2em;
  }
}

#success-director {
  padding-top: 80px;
  padding-bottom: 80px;
  position: relative;
  z-index: 2;
  min-height: 600px;
}

@media (min-width: 768px) {
  .success-dir-text {
    max-width: 50%;
  }
}

.dir-tag {
  position: absolute;
  background: #4e86ff;
  padding: 20px;
  border-radius: 15px;
  max-width: 250px;
  top: 340px;
  left: 50px;
}

@media (max-width: 991px) {
  #success-director {
    overflow: hidden;
  }
}

@media (min-width: 768px) {
  .dir-box {
    position: absolute;
    bottom: 0;
    left: 50%;
  }
}

@media (max-width: 767px) {
  .dir-box {
    position: relative;
  }
}

@media (max-width: 767px) {
  #success-director {
    padding-bottom: 0px;
  }
}

@media (max-width: 575px) {
  .dir-box img {
    width: 100%;
  }
}

@media (max-width: 575px) {
  .dir-tag {
    top: inherit;
    bottom: 20px;
  }
}

#info {
  background: #e4f2fe;
  padding-top: 80px;
  padding-bottom: 80px;
}

@media (max-width: 575px) {
  #info div img {
    zoom: 0.7;
  }
}

#documents {
  padding-top: 80px;
  padding-bottom: 80px;
}

.doc-box {
  background: #f4f4f7;
  padding: 20px;
  border-radius: 15px;
  height: 100%;
}

.doc-box:hover {
  background: #e4f2fe;
}

@media (max-width: 575px) {
  .doc-box img {
    zoom: 0.7;
  }
}

@media (max-width: 575px) {
.quotes-mini .txt18 {
  font-size:20px;
}}