/***
====================================================================
Fonts
====================================================================

***/
@import url("fonts_v2.css");
@import url("chosen.css");

:root {
  --main-bg-border-color: #042392;
  --main-text-color: white;
}
/* COMMON STYLES */
.main-page-wrapper {
  /*max-width: 1536px;*/
  /*padding: 0px 6%;*/
  /*margin: 0 auto;*/
  /*width: 100%;*/
}

.main-page-wrapper > div {
  width: 100%;
}

.center_container {
    margin: 0 auto;
    position: relative;
    display: flex;
    justify-content: space-between;
}

.center_container div:nth-last-child(2) {
  margin-right: 10px;
}

.center_container div:last-child {
  margin-left: 0;
}


.mtl-6084 {
  margin-top: 60px;
  margin-left: 84px;
}

.mxy-60-84 {
  margin: 60px 84px;
}

.desc {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 26px;
  color:#202020;
}

a {
  color: #202020;
  text-decoration: none;

  &:hover {
    color: inherit;
  }
}

/* COMMON STYLES END */


/* Second block */


.success-that-multiply .header {
  color: #FF7300;
  font-family: "Play-Bold", sans-serif;
  font-weight: 700;
  font-size: 2rem

  line-height: 38px;
  text-transform: uppercase;
}

.success-that-multiply .header span {
  overflow-wrap: break-word;
}

.success-that-multiply .sub-header span {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  line-height: 26px;
  font-size: 1.125rem;
  color:#202020;
}

.auto-container {
  position: static;
  max-width: 1240px;
  /* padding: 0px 6%; */
  margin: 0 auto;
  width: 100%;
}

.success-that-multiply .third-sub-header {
  padding: 10px 15px;
  border-radius: 30px;
  background-color: #FFF7F0;

  align-items: center;
  display: grid;
  grid-auto-flow: column;
  justify-content: center;
}

.success-that-multiply .third-sub-header span {
  font-family: "Inter";
  font-weight: 500;
  font-size: 16px;
  line-height: 28px;
  color: #FF7300;
  text-transform: lowercase;
}

.success-that-multiply .third-sub-header {
  display: inline-flex;
}

.success-that-multiply .third-sub-header::before {
  content: ''; /* Necessary for pseudo-elements */
  display: inline-block;
  width: 12px; /* Width of the SVG icon */
  height: 7px; /* Height of the SVG icon */

  /* SVG icon as a background image */
  background-image: url(../images/recomended-best/approve_sign.svg);
  background-size: contain; /* Ensures the SVG icon scales correctly */
  background-repeat: no-repeat; /* Prevents repeating of the SVG icon */
  margin-right: 10px; /* Space between the icon and the text */
}



.demonstrate-sustainable-development .title {
  color: #FF7300;
  font-family: "Play-Bold", sans-serif;
  font-weight: 700;
  font-size: 2rem;
  line-height: 38px;
}

.demonstrate-sustainable-development .sub-header {
  width: 100%;
  height: max-content;

  &:last-child {
    span {
      margin-bottom: 0;
    }
  }
}

.demonstrate-sustainable-development .sub-header span {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  line-height: 26px;
  font-size: 18px;
  color:#202020;
  display: inline-block;
  margin-top: 4px;
  margin-bottom: 33px;

  > strong {
    font-family: "Inter-Bold";
  }
}

.row .head {
  font-family: "Inter-Bold", sans-serif;
  line-height: 38px;
  font-size: 18px;
  color: #FF7300;
}

span.for-ellipse {
  display: inline-flex;
  position: relative;
}

span.for-ellipse::before {
  content: ''; /* Necessary for pseudo-elements */
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%); /* Centers the ellipse vertically */
  display: inline-block;

  /* Ellipse styling */
  width: 54px; /* Width of the ellipse */
  height: 54px; /* Height of the ellipse */
  background-color: #FF7300; /* Color of the ellipse */
  border-radius: 50%; /* Makes it an ellipse */

  /* SVG inside the ellipse */
  background-image: url(../images/recomended-best/insurance_icon.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 27px 29px; /* Adjust the size of the SVG inside the ellipse */
}



.circle-box {
  width: 54px;
  height: 54px;
  background-color: #FF7300;
  background-size: 18px 20px;

  &.search {
    background-size: 40px 40px;
  }

  &.bag {
    background-size: 40px 40px;
  }

  &.heart {
    background-size: 22px 18px;
  }
}

.circle-box {

  background-image: url(../images/recomended-best/insurance_icon.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 27px 29px;
  border-radius: 50%;
}

.circle-box.mental-helth {
  background-image: url(../images/recomended-best/mental-health.svg);
}

.circle-box.volunteer {
  background-image: url(../images/recomended-best/hand.svg);
  background-size: 26px 30px;
}

.circle-box.bonuses {
  background-image: url(../images/recomended-best/gift.svg);
  background-size: 27px 27px;
}

.demonstrate-sustainable-development {
  height: max-content;
}



.demonstrate-sustainable-development .row .desc {
  /*width: 280px;*/
  height: max-content;
  display: inline-block;
  /* font-family: "Inter", sans-serif;
  font-weight: 400;
  line-height: 26px;
  font-size: 18px;
  color:#202020; */
  margin-top: 10px;
  overflow-wrap: break-word;
}

.always-searching-professionals {
  margin-top: 50px;
  padding: 70px 0;
  background-color: #F2F5F7;
  border-radius: 40px;
}

.always-searching-professionals .header {
  font-family: "Play-Bold", sans-serif;
  font-weight: 700;
  font-size: 2rem;
  line-height: 38px;
  text-transform: uppercase;
  /* Only this changed on this block, TODO move common to separate class */
  color: #202020;
}

.always-searching-professionals .sub-header {

}

.always-searching-professionals .sub-header span {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 26px;
  color:#202020;
}

.steps-box {
  gap: 2.875rem;
  margin-top: 20px !important;
  padding-bottom: 20px;
}

.step {
  border-radius: 30px;
  background-color: #FFFFFF;
  /*width: 314px;*/
  /*height: 186px;*/
}

.step-rectangle-box {
  border-radius: 30px;
  background-color: #FF7300;
  width: 94px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}

span.step-rectangle {
  display: inline-block;
  text-align: center;
  font-family: "Inter-Bold", sans-serif;
  font-size: 21px;
  line-height: 27.3px;
  color: #FFFFFF;
}

.always-searching-professionals .row .desc {

  font-family: "Inter", sans-serif;
  font-weight: 400;
  line-height: 26px;
  font-size: 18px;
  color:#202020;
  margin-top: 12px;
  overflow-wrap: break-word;
}

.invite-to-team {
  margin-top: 50px;
  padding: 70px 0;
  margin-bottom: 50px;
  /*background-image: url(../images/recomended-best/bottom-block-background.png);*/
  /*background-size: cover;*/
  /*background-repeat: no-repeat;*/
  background: hsla(225, 96%, 31%, 1);
  background: linear-gradient(-85deg, hsla(225, 96%, 31%, 1) 0%, hsla(226, 97%, 30%, 1) 11%, hsla(227, 97%, 28%, 1) 21%, hsla(230, 98%, 25%, 1) 30%, hsla(237, 100%, 19%, 1) 39%, hsla(240, 100%, 18%, 1) 42%, hsla(240, 100%, 18%, 1) 100%);
  background: -moz-linear-gradient(-85deg, hsla(225, 96%, 31%, 1) 0%, hsla(226, 97%, 30%, 1) 11%, hsla(227, 97%, 28%, 1) 21%, hsla(230, 98%, 25%, 1) 30%, hsla(237, 100%, 19%, 1) 39%, hsla(240, 100%, 18%, 1) 42%, hsla(240, 100%, 18%, 1) 100%);
  background: -webkit-linear-gradient(-85deg, hsla(225, 96%, 31%, 1) 0%, hsla(226, 97%, 30%, 1) 11%, hsla(227, 97%, 28%, 1) 21%, hsla(230, 98%, 25%, 1) 30%, hsla(237, 100%, 19%, 1) 39%, hsla(240, 100%, 18%, 1) 42%, hsla(240, 100%, 18%, 1) 100%);
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr="#03299D", endColorstr="#022699", GradientType=1 );
  border-radius: 40px;
}

.invite-to-team .header {
  color: #FF7300;
  font-family: "Play", sans-serif;
  font-weight: 400;
  font-size: 32px;
  line-height: 38px;
}

.white-text {
  color: #FFFFFF;
}

.donat-box {
  /*width: 370px;*/
  position: relative;
  display: inline-block; /* Make sure the container fits around the image */
}

.donat-box::before {
  content: ''; /* Initial content */
  display: block; /* Ensures the content renders properly */
  position: absolute;
  top: 0;
  width: 100%; /* Set your desired width */
  height: 100%; /* Set your desired height */
  background-image: url(../images/recomended-best/bottom-left.svg),
                    url(../images/recomended-best/right-bottom.svg),
                    url(../images/recomended-best/top-left-star.svg),
                    url(../images/recomended-best/top-right-star.svg),
                    url(../images/recomended-best/white-right-bottom-star.svg);
  background-position:
    left bottom,
    right bottom,
    left top,
    right top,
    calc(100% - 20px) calc(100% - 20px);
  background-repeat: no-repeat;
  background-size:
    27px 27px, /* Size for top-left SVG */
    27px 27px, /* Size for top-right SVG */
    27px 27px, /* Size for bottom-left SVG */
    27px 27px, /* Size for bottom-right SVG */
    27px 27px; /* Size for the right bottom SVG with margin */
}

@media screen and (max-width: 767px) {
  .donat-box::before {
    width: 75%;
    height: 0%;
    padding-top: 65%;
  }
}

.invite-to-team .show-all-button {
  max-width: 328px;
  width: 100%;
  padding: 0 20px;
  height: 60px;
  display: inline-flex; /* Aligns content horizontally and centers vertically */
  font-family: 'Inter';
  font-weight: 400;
  font-size: 22px;
  line-height: 28px;
  border: none;
  border-radius: 30px;
  margin-top: 30px;
  align-items: center; /* Centers the SVG and text vertically */
  background-color: #FF7300; /* Background color for the button */
  cursor: pointer; /* Changes cursor to pointer on hover */
  color: white; /* Text color */
  justify-content: center;
  text-decoration: none;
}

/* Main block settings */

.rules {
  background-color: #FFF7F0;
  overflow: hidden;
}

.candidate-must-be-warned {
  background-color: #F2F5F7;
  overflow: hidden;
}

.already-worked {
  border: 2px solid #FF7300;
  border-radius: 40px;
}

.common-conditions {
  background-color: #FFF7F0;
  overflow: hidden;
}

.footer-block {
  background-image: url(../images/how-to/bottom-block-background.png);
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 35px;
  overflow: hidden;
}
/* Main block settings end */

.rules .header {
  color: #FF7300;
}

.rules .header span {
  position: relative;
  display: inline-block;
  width: 100%;
}

.rules .header span:before {
  content: ''; /* Initial content */
  display: block; /* Ensures the content renders properly */
  position: absolute;
  top: 0;
  width: 100%;
  height: 76px;
  background-image: url(../images/recomended-best/bottom-left.svg),
                    url(../images/recomended-best/right-bottom.svg);
  background-position:
    calc(100% - 115px) center,
    right center;
  background-repeat: no-repeat;
  background-size:
    25px 25px, /* Size for top-left SVG */
    25px 25px, /* Size for top-right SVG */
}

.steps-wrapper {
  padding-top: 18px;
}

/* .faq-item {} */


.block-tooltip {
  color: #909DA2;
  font-family: "Inter";
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  padding-top: 21px;
}


.common-conditions .header {
  color: #FF7300;
  line-height: 38px;
}

.footer-block .header {
  color: #FFFFFF;
}
.footer-block .show-all-button {
  width: 328px;
  height: 60px;
  display: inline-flex;
  font-family: 'Inter';
  font-weight: 400;
  font-size: 22px;
  line-height: 28px;
  border: none;
  border-radius: 30px;
  margin-top: 30px;
  align-items: center;
  background-color: #FF7300;
  cursor: pointer;
  color: white;
  justify-content: center;
  text-decoration: none;
}

.rcmnd-btn {
  border-radius: 30px;
  align-items: center;
  /* background-color: #FF7300; */
  background-color: var(--main-bg-border-color);
  cursor: pointer;
  color: white;
  justify-content: center;
  text-decoration: none;
  padding: 2%;
  text-transform: lowercase;
}

.rcmnd-btn:hover {
  color: white;
}

.rcmnd-btn img {
width: 16px;
height: 16px;
margin-left: 8px;
}

/* ---------------------- CV Upload ---------------------------- */
.cvuploading-outer {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 30px;
}

.cvuploading-outer .cvuploadButton {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.cvuploading-outer .form-group.cvuploadButton {
  margin-bottom: 0;
}

.cvuploadButton .cvuploadButton-input {
  opacity: 0;
  position: absolute;
  overflow: hidden;
  z-index: -1;
  pointer-events: none;
  height: 0;
  width: 0;
  display: none;
}

#cv_link {
  background-color: #FFF7F0;

}

#cv_link::placeholder {
  font-family: "Inter";
  font-weight: 500;
  font-size: 16px;
  line-height: 22.4px;
  color: #FF7300;
}


.cvuploadButton .cvuploadButton-button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  background-color: #FFF7F0;
  border-radius: 50%;

  background-image: url(../images/job/upload_icon_btn.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 25px 24px;
}

.cvuploadButton .cvuploadButton-button:hover {
  /* border-color: #021f4a; */
  border-radius: 15px;
  /* border: #F2F5F7; */
  cursor: pointer;
}

.cvuploadButton .cvuploadButton-button.dragging {
  border-color: #3473e0;
}

.cvuploadButton .cvuploadButton-file-name {
  align-items: center;
  padding: 0 10px;
  padding-left: 18px;
  min-height: 36px;
  top: 1px;
  position: relative;
  color: #1b2032;
  background-color: transparent;
  overflow: hidden;
  line-height: 22px;
}

.cvuploadButton .cvuploadButton-button:before {
  /* font-family: "Flaticon";
  content: "\f15c";
  color: #9fa9b8;
  font-size: 20px;
  transition: 0.3s; */
  content: ''; /* Necessary for pseudo-elements */
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%); /* Centers the ellipse vertically */
  display: inline-block;

  /* SVG inside the ellipse */
  background-image: url(../images/job/upload_icon_btn.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 25px 24px; /* Adjust the size of the SVG inside the ellipse */
}

.cvuploading-outer .message-box-form.error {
  margin: 0px;
}

.text-input {
  border-radius: 35px;
  background-color: #F2F5F7;
  border: none;
  padding-left: 25px;
  padding-top: 18px;
  padding-bottom: 18px;
  width: 100%;
}


.login-wrapper {
  /* position: relative; */
  border-radius: 40px;
  border: 2px solid #FF7300;
  /*min-width: 500px;*/
  align-items: flex-start;
  flex-wrap: nowrap;
}

.user-personal-info {
  border-right: 1px solid #e9e9e9;
  border-bottom: 1px solid #e9e9e9;
}

.my-orders {
  border-right: 1px solid #e9e9e9;
}

.profile-wrapper {
  margin-top: 5%;
}



/*NEW STYLES BEGIN*/

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

html {
  font-size: 16px;
}

body {
  font-size: 1.125rem;
  line-height: 1.625rem;
}

header {
  /*padding: 36px 0;*/

  a {
    font-size: 16px;
    padding: 7px 15px;
    border-radius: 20px;
    background-color: rgba(242,245,247, 0);
    transition: background-color 0.3s;

    &:hover {
      background-color: rgba(245,245,247, 1);
    }
  }

  .dropdown {
    .dropdown-menu {
      padding: 4px;
      min-width: initial;
      border-radius: 20px;

      a {
        margin-bottom: 4px;

        &:last-child {
          margin-bottom: 0;
        }
      }
    }
  }

  .navbar-toggler {
    border: none;

    &:focus {
      box-shadow: none;
    }
  }
}

.title {
  text-transform: uppercase;
  font-size: 32px;
  line-height: 38px;
  font-weight: 700;
  color: #FF7300;
}

.recommend-the-best {
  padding: 70px 0;
  background-image: url(../images/recomended-best/rb-min.png);
  background-size: cover;
  background-position: 0% center;
  background-repeat: no-repeat;
  border-radius: 40px;

  .job-search-form {

    .chosen-drop {
      border-radius: 20px;
    }

    .chosen-search-input {
      border-radius: 14px;
    }

    .search-button {
      position: absolute;
      top: 0;
      right: 0;
      padding: 0 35px 0 25px;
      height: 60px;
      border: none;
      border-radius: 30px;
      align-items: center;
      justify-content: center;
      background-color: #FF7300;
      cursor: pointer;
      color: white;
      gap: 5px;
    }

    .chosen-single {
      height: 60px;
      border-radius: 60px !important;
      padding: 0 225px 0 75px;

      span {
        font-size: 20px;
        color: #6F7691;
        opacity: 0.3;
        margin-right: 0;
        line-height: 60px;
        background: #fff;

        &:before {
          content: '';
          position: absolute;
          left: 6px;
          top: 50%;
          transform: translateY(-50%);

          /* Ellipse styling */
          width: 48px;
          height: 48px; /* Height of the ellipse */
          background-color: #6F7691;
          border-radius: 50%;
          background-image: url(../images/recomended-best/Vector_8.svg);
          background-repeat: no-repeat;
          background-position: center;
          background-size: 16px 7px;
        }
      }
    }
  }

  .subtitle {
    font-size: 22px;
    line-height: 48px;
  }
}

.success-that-multiply {
  margin-top: 50px;
  padding: 70px 0;
  background-color: #FFFFFF;
  border: 2px solid #FF7300;
  border-radius: 40px;
}

.demonstrate-sustainable-development {
  margin-top: 50px;
  padding: 70px 0;
  background-color: #FFF7F0;
  /* border: 2px solid #FF7300; */
  border-radius: 40px;
  overflow: hidden; /* Clip pseudo-elements to the block's border radius */
}

.content-block {
  padding: 70px 0;
  position: relative;
  border-radius: 40px;
  margin-bottom: 50px;

  .subTitle{
    font-family: "Play-Bold", sans-serif;
    font-weight: 700;
    font-size: 22px;
    /*line-height: 38px;*/
    text-transform: uppercase;
  }

  &.rules {
    .subTitle {
      color: #FF7300;
    }

    .rules-item-header-box {
      width: 28px;
      height: 28px;
      background-color: rgba(255, 115, 0, 0.2); /* #FF7300 with 20% opacity */
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .inner-circle {
      width: 12px;
      height: 12px;
      background-color: #FF7300;
      border-radius: 50%;
    }

    .dotted-line {
      border: none;
      border-top: 2px dotted #FF7300;
    }

    .title {
      display: flex;
      align-items: center;
      column-gap: 21px;
      padding-bottom: 5px;
    }

    .notice-box {
      border: 2px solid #FF7300;
      border-radius: 40px;
    }

    .rules-item .desc {
      font-family: "Inter", sans-serif;
      font-weight: 400;
      font-size: 18px;
      line-height: 26px;
      color: #202020;
    }

    .notice-box .desc {
      font-family: "Inter", sans-serif;
      font-weight: 400;
      font-size: 18px;
      line-height: 26px;
      color: #202020;
    }
  }

  &.how-to {
    background-color: #F2F5F7;
    overflow: hidden;

    .step-item {
      padding-bottom: 18px;
      padding-top: 18px;
    }

    .step-item-number {
      font-family: "Inter";
      font-weight: 400;
      font-size: 20px;
      line-height: 24px;
    }

    .rule-title {
      font-family: "Inter";
      font-weight: 600;
      font-size: 20px;
      line-height: 21px;
      color: #FF7300;
    }

    .rule-desc {
      font-family: "Inter";
      font-weight: 400;
      font-size: 16px;
      line-height: 22px;
    }

    .separator {
      border: 2px solid #FFFFFF;
    }
  }

  &.candidate-must-be-warned{

    .checklist-item {
      border-radius: 30px;
      background-color: #FFFFFF;
    }

    .circle-box {
      width: 54px;
      height: 54px;
      background-color: #FF7300;
      border-radius: 50%;
      background-image: url(../images/recomended-best/insurance_icon.svg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: 27px 29px;

      &.search {
        background-image: url(../images/how-to/search.svg);
        background-color: #FFFFFF;
        background-size: 54px 54px;
      }

      &.bag {
        background-image: url(../images/how-to/bag.svg);
        background-color: #FFFFFF;
        background-size: 54px 54px;
      }

      &.heart {
        background-image: url(../images/how-to/heart.png);
        background-size: 25px 21px;
      }
    }


    .title-orange {
      margin-top: 22px;
      color: #FF7300;
      font-family: "Inter";
      font-weight: 600;
      font-size: 24px;
      line-height: 32px;
    }
  }

  &.already-worked{
    .title {
      color: #FF7300;
    }
    .step-item .subTitle {
      text-transform: uppercase;
      width: 20%;
      color: #FF7300;
    }

    .step-item {
      height: max-content;
      align-items: baseline;
    }

    .step-item .statement {
      width: 30%;
    }

    .separator {
      border: 2px solid #F2F5F7;
    }

    .list-style-one {
      position: relative;
    }

    .list-style-one li {
      position: relative;
      padding-left: 30px;
      font-family: "Inter";
      font-weight: 400;
      font-size: 18px;
      line-height: 24px;
      color: #202124;
      cursor: default;
      margin-bottom: 20px;
    }

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

    .list-style-one li::before {
      position: absolute;
      left: 0;
      top: 5px;
      height: 13px;
      width: 18px;
      line-height: 24px;
      content: '';
      background-image: url(../images/how-to/check.svg);
      background-size: 18px 13px;
      background-position: center;
      background-repeat: no-repeat;
      overflow: hidden;
    }
  }

  &.common-conditions {

    .list-style-two {
      position: relative;
    }

    .list-style-two li {
      position: relative;
      padding-left: 42px;
      font-family: "Inter";
      font-weight: 400;
      font-size: 16px;
      line-height: 22px;
      color: #000000;
      cursor: default;
      margin-bottom: 25px;
      display: flex;
      align-items: center;
    }

    .list-style-two li::before {
      position: absolute;
      left: 0;
      top: 0;
      line-height: 22px;
      margin-bottom: 12px;
      width: 30px;
      height: 30px;
      content: '';
      background-color: #FF7300;
      border-radius: 50%;
      background-image: url(../images/how-to/check_white.svg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: 12px 10px;
    }

    .nickname-box {
      margin-top: 7px;
      background-color: #FFFFFF;
      border-radius: 9px;
      height: 36px;
      display: flex;
      align-items: center;
      width: max-content;
      padding: 0px 15px;
      justify-content: space-around;
    }

    li.with-nickname {
      column-gap: 40px;
    }
  }
}

@media (pointer:coarse) {
  .recommend-the-best {
    .job-search-form {
      .select-cover {
        background-color: #fff;
        border-radius: 30px;
        overflow: hidden;
        padding-right: 15px;
      }

      .chosen-select {
        width: 100%;
        background-color: transparent;
        padding: 18px;
        border: none;
        outline: none;

        option {
          padding: 0 30px;
        }
      }

      .chosen-drop {
        width: 100%;
        border-radius: 30px;
      }
    }
  }
}

@media screen and (max-width: 767px) {
  .title {
    font-size: 20px;
    line-height: 26px;
    padding: 0;
  }

  header {
    .navbar-toggler {
      padding: 0;
    }
    a {
      display: block;
      padding: 5px 0;
      font-size: 18px;
    }

    .navbar-collapse {
      padding: 0 5px;
    }
  }

  html {
    font-size: 16px;
  }
  .recommend-the-best {
    padding: 35px 0;

    .subtitle {
      font-size: 18px;
      line-height: 24px;
    }

    .job-search-form {
      .chosen-select {
        width: 100%;
        padding: 8px 12px;
        font-size: 18px;
        line-height: 24px;
      }

      .chosen-drop {
        width: 100%;
        border-radius: 30px;
      }

      .search-button {
        width: 100%;
        height: 40px;
        position: relative;
        margin-top: 10px;

        span {
          font-size: 18px !important;
        }
      }
    }
  }

  .success-that-multiply {
    padding: 35px 0;
    margin-top: 35px;

    .third-sub-header {
      &:before {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
      }

      span {
        line-height: normal;
      }
    }
  }

  .demonstrate-sustainable-development {
    padding: 35px 0;
    margin-top: 35px;

    .title {
      font-size: 20px;
      line-height: 26px;
      padding: 0;
    }
  }

  .always-searching-professionals {
    padding: 35px 0;
    margin-top: 35px;
  }

  .invite-to-team {
    padding: 35px 0;
    margin: 35px 0 25px;
  }

  .content-block {
    padding: 35px 0;
    margin-bottom: 35px;

    &.rules {
      .title {
        padding: 0;
      }

      .subTitle{
        font-size: 18px;
        line-height: 24px;
      }
    }

    &.candidate-must-be-warned {
      .subTitle{
        font-size: 18px;
        line-height: 24px;
      }
    }

    &.already-worked {
      .step-item {
        .subTitle {
          width: 100%;
        }

        .statement {
          width: 100%;
        }
      }
    }

    &.common-conditions {
      .nickname-box {
        margin-top: 7px;
        background-color: #FFFFFF;
        border-radius: 9px;
        height: 36px;
        display: flex;
        align-items: center;
        width: max-content;
        padding: 0px 15px;
        justify-content: space-around;
      }

      li.with-nickname {
        column-gap: 20px;
        flex-direction: column;
        align-items: flex-start;
      }
    }
  }

}


@media screen and (max-width: 991px) {
  .content-block {
    &.already-worked {
      .step-item {
        .statement {
          width: 100%;
        }
      }
    }
  }
}

/*NEW STYLES END*/