Как сделать блок неподвижным при прокрутке страницы?

  .ody { 
      font-family: "Times New Roman", sans-serif; 
      margin: 0; 
      background-color: #ffffff; 
    } 
 
    .wrapper { 
      display: flex; 
      width: 1200px; 
      margin: 0 auto; 
    } 
 
    .sidebar { 
      position: relative; 
      width: 60px; 
    } 
 
    .sidebar__list { 
      margin: 0; 
      margin-left: 20px; 
      padding: 0; 
 
      list-style: none; 
    } 
 
    .sidebar__item { 
      margin-bottom: 30px; 
    } 
 
    .sidebar__square { 
      width: 40px; 
      height: 40px; 
 
      margin-left: 10px; 
      margin-bottom: 300px; 
 
      border-radius: 5px; 
      background-color: #44519e; 
    } 
 
    .sidebar__number { 
      font-size: 15px; 
      font-weight: bold; 
      color: #ffffff; 
 
      margin: 0; 
      margin-top: 10px; 
      padding: 0; 
      padding-top: 10px; 
 
      text-align: center; 
    } 
 
    .sidebar__icon path { 
      stroke: #adb5ca; 
    } 
 
    .sidebar__icon--active path { 
      stroke: #54c5eb; 
    } 
 
    .sidebar__photo { 
      position: absolute; 
      bottom: 0; 
      z-index: -1; 
 
      width: 60px; 
      height: 65px; 
      padding-left: 55px; 
 
      background: url(img/avatar.jpg) no-repeat center; 
    } 
 
    .portfolios { 
      width: 220px; 
      margin-right: 35px; 
 
      background-color: #f1f1f9; 
    } 
 
    .portfolios__title { 
      font-size: 20px; 
      color: #191f5d; 
 
      margin: 0; 
      margin-top: 40px; 
      margin-bottom: 80px; 
      padding: 0; 
 
      text-align: center; 
    } 
 
    .portfolios__list { 
      margin: 0; 
      padding: 0; 
 
      list-style: none; 
    } 
 
    .portfolios__item { 
      position: relative; 
 
      min-height: 85px; 
 
      text-align: center; 
    } 
 
    .portfolios__item::before { 
      content: ""; 
 
      position: absolute; 
      top: 30px; 
      left: 30px; 
 
      width: 40px; 
      height: 40px; 
 
      background: url("img/file.svg") no-repeat; 
    } 
 
    .portfolios__item--active { 
      background-color: #ffffff; 
    } 
 
    .portfolios__link { 
      display: block; 
 
      font-size: 15px; 
      font-weight: bold; 
      color: #191f5d; 
 
      margin: 0; 
      margin-bottom: 10px; 
      padding: 0; 
      padding-top: 35px; 
 
      text-decoration: none; 
    } 
 
    .container { 
      display: flex; 
      flex-direction: column; 
    } 
 
    .page-header { 
      display: flex; 
    } 
 
    .page-header__list { 
      display: flex; 
      width: 300px; 
      height: 90px; 
 
      margin: 0; 
      padding: 0; 
      padding-left: 150px; 
 
      list-style: none; 
      background-color: #f7f7fa; 
    } 
 
    .page-header__item { 
      margin-top: 40px; 
      margin-right: 50px; 
    } 
 
    .page-header__link--hands { 
      position: relative; 
    } 
 
    .page-header__square { 
      display: block; 
      width: 42px; 
      height: 40px; 
 
      position: absolute; 
      top: -10px; 
 
      border-radius: 5px; 
      background-color: #dc045c; 
    } 
 
    .page-header__square::before { 
      content: ""; 
      display: block; 
      width: 20px; 
      height: 20px; 
 
      position: absolute; 
      top: 8px; 
      left: 8px; 
 
      background: url("img/clapping-hands.svg") no-repeat; 
    } 
 
    .page-header__title-container { 
      margin-right: 300px; 
    } 
 
    .page-header__subtitle { 
      margin: 0; 
      margin-top: 30px; 
      margin-bottom: 20px; 
      padding: 0; 
 
      font-size: 15px; 
      color: #a7b0c2; 
    } 
 
    .page-header__title { 
      margin: 0; 
      padding: 0; 
 
      font-size: 36px; 
      color: #191f5d; 
    } 
 
    .page-header__search path { 
      stroke: #223975; 
    } 
 
    .page-header__group path { 
      fill: #223975; 
    } 
 
    .page-header__hands path { 
      fill: #ffffff; 
    } 
 
    .graphs__list { 
      display: flex; 
      margin: 60px 70px 50px 0; 
      padding: 0; 
 
      list-style: none; 
    } 
 
    .graphs__item { 
      width: 200px; 
      min-height: 140px; 
      margin-right: 25px; 
 
      background-color: #ffffff; 
      box-shadow: 0 0 20px rgba(247, 247, 247, 1); 
    } 
 
    .graphs__title { 
      position: relative; 
 
      font-size: 15px; 
      font-weight: bold; 
      color: #262d73; 
 
      margin: 0; 
      margin-left: 70px; 
      margin-top: 20px; 
      padding: 0; 
    } 
 
    .graphs__title--left::before { 
      content: ""; 
      position: absolute; 
      top: -2px; 
      left: -50px; 
 
      display: block; 
      width: 40px; 
      height: 40px; 
 
      background: url("img/twitter.svg") no-repeat; 
    } 
 
    .graphs__item--right::before { 
      content: ""; 
      position: absolute; 
      top: -2px; 
      left: -50px; 
 
      display: block; 
      width: 40px; 
      height: 40px; 
 
      background: url("img/bookmark.svg") no-repeat; 
    } 
 
    .graphs__subtitle { 
      font-size: 12px; 
      color: #a7b0c2; 
      text-transform: uppercase; 
 
      margin: 0; 
      margin-left: 70px; 
      padding: 0; 
    } 
 
    .benchmark { 
      margin-bottom: 70px; 
    } 
 
    .benchmark__title { 
      font-size: 16px; 
      font-weight: bold; 
      color: #191f5d; 
 
      margin: 0; 
      margin-bottom: 40px; 
      padding: 0; 
    } 
 
    .benchmark__list { 
      display: flex; 
      margin: 0; 
      padding: 0; 
 
      list-style: none; 
    } 
 
    .benchmark__link { 
      font-size: 12px; 
      font-weight: bold; 
      color: #191f5d; 
      text-align: center; 
      text-transform: uppercase; 
      text-decoration: none; 
    } 
 
    .benchmark__item { 
      margin-right: 18px; 
    } 
 
    .benchmark__logo { 
      position: relative; 
 
      width: 37px; 
      height: 37px; 
      margin-bottom: 20px; 
 
      background-color: #ffffff; 
      box-shadow: 0 0 20px rgba(247, 247, 247, 1); 
    } 
 
    .benchmark__logo::before { 
      content: ""; 
 
      position: absolute; 
      top: 5px; 
      left: 5px; 
 
      width: 30px; 
      height: 30px; 
    } 
 
    .benchmark__logo--fb::before { 
      background: url("img/fb.svg") no-repeat; 
    } 
 
    .benchmark__logo--amzn::before { 
      background: url("img/amazon.svg") no-repeat; 
    } 
 
    .benchmark__logo--msft::before { 
      background: url("img/msft.svg") no-repeat; 
    } 
 
    .benchmark__logo--wmt::before { 
      background: url("img/plus.svg") no-repeat; 
    } 
 
    .benchmark__logo--pg::before { 
      background: url("img/document.svg") no-repeat; 
    } 
 
    .benchmark__logo--ibm::before { 
      background: url("img/ibm.svg") no-repeat; 
    } 
 
    .benchmark__logo--bac::before { 
      background: url("img/home.svg") no-repeat; 
    } 
 
    .benchmark__logo--mcd::before { 
      background: url("img/mcdonalds.svg") no-repeat; 
    } 
 
    .benchmark__icon { 
      margin-top: 3px; 
    } 
 
    .statistic { 
      display: flex; 
    } 
 
    .statistic__top, 
    .statistic__worst { 
      margin-right: 60px; 
    } 
 
    .statistic__list { 
      margin: 0; 
      padding: 0; 
 
      list-style: none; 
    } 
 
    .statistic__top, 
    .statistic__worst { 
      width: 250px; 
    } 
 
    .statistic__title { 
      font-size: 16px; 
      color: #191f5d; 
    } 
 
    .statistic__item { 
      display: flex; 
      margin-bottom: 30px; 
    } 
 
    .statistic__wrapper__text { 
      width: 110px; 
      margin-right: 40px; 
    } 
 
    .statistic__top-text { 
      font-size: 15px; 
      font-weight: bold; 
      color: #191f5d; 
 
      margin: 0; 
      padding: 0; 
 
      text-transform: uppercase; 
    } 
 
    .statistic__bottom-text, 
    .statistic__bottom-percent { 
      font-size: 12px; 
      font-weight: bold; 
      color: #a7b0c2; 
 
      margin: 0; 
      padding: 0; 
    } 
 
    .statistic__bottom-percent { 
      margin-top: 10px; 
    } 
 
    .statistic__logo { 
      position: relative; 
      display: block; 
      width: 30px; 
      height: 30px; 
      margin-left: 10px; 
      margin-right: 20px; 
    } 
 
    .statistic__logo::before { 
      content: ""; 
 
      position: absolute; 
 
      display: block; 
      width: 30px; 
      height: 30px; 
    } 
 
    .statistic__logo--apple::before { 
      background: url("img/apple-logo.svg") no-repeat; 
    } 
 
    .statistic__logo--issuu::before { 
      background: url("img/issuu.svg") no-repeat; 
    } 
 
    .statistic__logo--lg::before { 
      background: url("img/onedrive.svg") no-repeat; 
    } 
 
    .statistic__logo--intel::before { 
      background: url("img/intel.svg") no-repeat; 
    } 
 
    .statistic__logo--yahoo::before { 
      background: url("img/yahoo.svg") no-repeat; 
    } 
 
    .statistic__logo--google::before { 
      background: url("img/yahoo.svg") no-repeat; 
    } 
 
    .statistic__logo--google::before { 
      background: url("img/google.svg") no-repeat; 
    } 
 
    .statistic__details--list { 
      display: flex; 
      flex-direction: row; 
      flex-wrap: wrap; 
      width: 250px; 
    } 
 
    .statistic__details-item { 
      width: 67px; 
      margin-right: 21px; 
      margin-bottom: 30px; 
    } 
 
    .statistic__details-item--last { 
      margin-right: 0; 
    } 
 
    .statistic__details-text, 
    .statistic__details-figures { 
      margin: 0; 
      padding: 0; 
    } 
 
    .statistic__details-text { 
      font-size: 11px; 
      color: #a0a8be; 
      text-transform: uppercase; 
 
      margin-bottom: 15px; 
    } 
 
    .statistic__details-figures { 
      font-size: 13px; 
      font-weight: bold; 
      color: #212663; 
    } 
 
    .statistic__details--title { 
      position: relative; 
      margin-bottom: 50px; 
    } 
 
    .statistic__details--title::after { 
      content: ""; 
 
      position: absolute; 
      top: 40px; 
 
      display: block; 
      width: 25px; 
      height: 2px; 
 
      background-color: #d9e1f9; 
    } 
 
    .crisper { 
      display: flex; 
    } 
 
    .schedule__title { 
      font-size: 38px; 
      color: #191f5d; 
      text-transform: uppercase; 
    } 
 
.page-header{ 
  position: fixed; 
  background-color: red; 
} 
 
body{ 
  height: 1500px; 
}

<div class="wrapper"> 
    <section class="sidebar"> 
      <div class="sidebar__square"> 
        <p class="sidebar__number">2</p> 
      </div> 
      <ul class="sidebar__list"> 
        <li class="sidebar__item"> 
          <a class="sidebar__link" href="#"> 
            <svg class="sidebar__icon" xmlns="http://www.w3.org/2000/svg" height="25" width="25" viewBox="0 0 41 41"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M0 31h31V0H0z"/></clipPath></defs><g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 41.333)"><path d="M15.5 29.5v-14h14M15.5 15.5L5.184 5.921" fill="none" stroke="#111" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10"/><path d="M15.5 29.5c7.732 0 14-6.268 14-14s-6.268-14-14-14-14 6.268-14 14 6.268 14 14 14z" fill="none" stroke="#111" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10"/></g></svg> 
          </a> 
        </li> 
        <li class="sidebar__item"> 
          <a class="sidebar__link" href="#"> 
            <svg class="sidebar__icon sidebar__icon--active" xmlns="http://www.w3.org/2000/svg" height="25" width="27" viewBox="0 0 40 42.667"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M0 30h32V0H0z"/></clipPath></defs><g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 40)"><path d="M24.5 22.5v3h-12l-3 3h-8v-27h23l6 18h-23l-6-18" fill="none" stroke="#111" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10"/></g></svg> 
          </a> 
        </li> 
        <li class="sidebar__item"> 
          <a class="sidebar__link" href="#"> 
            <svg class="sidebar__icon" xmlns="http://www.w3.org/2000/svg" height="24" width="26" viewBox="0 0 39.507 41.333"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M0 29.63h31V0H0z"/></clipPath></defs><g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 39.507)"><path d="M15.5 28.13l4.326-8.766 9.674-1.406-7-6.823L24.152 1.5 15.5 6.049l-8.652-4.55L8.5 11.136l-7 6.823 9.674 1.406z" fill="none" stroke="#111" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10"/></g></svg> 
          </a> 
        </li> 
      </ul> 
      <div class="sidebar__photo"></div> 
    </section> 
    <section class="portfolios"> 
      <h2 class="portfolios__title">Your portfolios</h2> 
      <ul class="portfolios__list"> 
        <li class="portfolios__item"> 
          <a class="portfolios__link" href="#">Finance inst.</a> 
        </li> 
        <li class="portfolios__item portfolios__item--active"> 
          <a class="portfolios__link" href="#">Strong</a> 
        </li> 
        <li class="portfolios__item"> 
          <a class="portfolios__link" href="#">Rising stars</a> 
        </li> 
        <li class="portfolios__item"> 
          <a class="portfolios__link" href="#">High risks</a> 
        </li> 
        <li class="portfolios__item"> 
          <a class="portfolios__link" href="#">Tech stars</a> 
        </li> 
        <li class="portfolios__item"> 
          <a class="portfolios__link" href="#">MISC</a> 
        </li> 
      </ul> 
    </section> 
    <div class="container"> 
      <header class="page-header"> 
        <div class="page-header__title-container"> 
          <h3 class="page-header__subtitle">Strong</h3> 
          <h1 class="page-header__title">Overview</h1> 
        </div> 
        <ul class="page-header__list"> 
          <li class="page-header__item"> 
            <a class="page-header__link" href="#"> 
              <svg class="page-header__search" xmlns="http://www.w3.org/2000/svg" height="21.333" width="21.333"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M0 16h16V0H0z"/></clipPath></defs><g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 21.333)"><path d="M7 15A6 6 0 007 3a6 6 0 000 12zM15 1l-3.758 3.758" fill="none" stroke="#111" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10"/></g></svg> 
            </a> 
          </li> 
          <li class="page-header__item"> 
            <a class="page-header__link" href="#"> 
              <svg class="page-header__group" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="28" height="28" viewBox="0 0 48 48"> 
                  <g class="nc-icon-wrapper" fill="#111111"> 
                      <path d="M32 22c3.31 0 5.98-2.69 5.98-6s-2.67-6-5.98-6c-3.31 0-6 2.69-6 6s2.69 6 6 6zm-16 0c3.31 0 5.98-2.69 5.98-6s-2.67-6-5.98-6c-3.31 0-6 2.69-6 6s2.69 6 6 6zm0 4c-4.67 0-14 2.34-14 7v5h28v-5c0-4.66-9.33-7-14-7zm16 0c-.58 0-1.23.04-1.93.11C32.39 27.78 34 30.03 34 33v5h12v-5c0-4.66-9.33-7-14-7z"></path> 
                  </g> 
              </svg> 
            </a> 
          </li> 
          <li class="page-header__item"> 
            <a class="page-header__link page-header__link--hands" href="#"> 
              <div class="page-header__square"></div> 
            </a> 
          </li> 
        </ul> 
      </header> 
      <main class="page-main"> 
        <div class="crisper"> 
          <div class="page-main__crisper"> 
            <section class="graphs"> 
              <ul class="graphs__list"> 
                <li class="graphs__item"> 
                  <p class="graphs__title graphs__title--left">Twitter Inc</p> 
                  <p class="graphs__subtitle">NASDAQ</p> 
                </li> 
                <li class="graphs__item"> 
                  <p class="graphs__title graphs__item--right">LG Inc</p> 
                  <p class="graphs__subtitle">KRX</p> 
                </li> 
              </ul> 
            </section> 
            <section class="benchmark"> 
              <p class="benchmark__title">Benchmark</p> 
              <ul class="benchmark__list"> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--fb"></div> 
                    <div>fb</div> 
                  </a> 
                </li> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--amzn"></div> 
                    <div>amzn</div> 
                  </a> 
                </li> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--msft"></div> 
                    <div>msft</div> 
                  </a> 
                </li> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--wmt"></div> 
                    <div>wmt</div> 
                  </a> 
                </li> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--pg"></div> 
                    <div>pg</div> 
                  </a> 
                </li> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--ibm"></div> 
                    <div>ibm</div> 
                  </a> 
                </li> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--bac"></div> 
                    <div>bac</div> 
                  </a> 
                </li> 
                <li class="benchmark__item"> 
                  <a class="benchmark__link" href="#"> 
                    <div class="benchmark__logo benchmark__logo--mcd"></div> 
                    <div>mcd</div> 
                  </a> 
                </li> 
              </ul> 
            </section> 
          </div> 
          <section class="schedule"> 
            <p class="schedule__title">yhoo</p> 
            <div class="schedule__diagram"></div> 
          </section> 
        </div> 
        <section class="statistic"> 
          <div class="statistic__top"> 
            <h4 class="statistic__title">Top 3 stocks</h4> 
            <ul class="statistic__list"> 
              <li class="statistic__item"> 
                <div class="statistic__logo statistic__logo--apple"></div> 
                  <div class="statistic__wrapper__text"> 
                    <p class="statistic__top-text">appl</p> 
                    <p class="statistic__bottom-text">Apple - NASDAQ</p> 
                  </div> 
                <p class="statistic__bottom-percent">+12.5%</p> 
              </li> 
              <li class="statistic__item"> 
                <div class="statistic__logo statistic__logo--issuu"></div> 
                <div class="statistic__wrapper__text"> 
                  <p class="statistic__top-text">mat</p> 
                  <p class="statistic__bottom-text">Mattle - NASDAQ</p> 
                </div> 
                <p class="statistic__bottom-percent">+10.8%</p> 
              </li> 
              <li class="statistic__item"> 
                <div class="statistic__logo statistic__logo--lg"></div> 
                <div class="statistic__wrapper__text"> 
                  <p class="statistic__top-text">lgcif</p> 
                  <p class="statistic__bottom-text">LG Corporation</p> 
                </div> 
                <p class="statistic__bottom-percent">+10.0%</p> 
              </li> 
            </ul> 
          </div> 
          <div class="statistic__worst"> 
            <h4 class="statistic__title">Worst 3 stocks</h4> 
            <ul class="statistic__list"> 
              <li class="statistic__item"> 
                <div class="statistic__logo statistic__logo--intel"></div> 
                <div class="statistic__wrapper__text"> 
                  <p class="statistic__top-text">intc</p> 
                  <p class="statistic__bottom-text">Intel - NASDAQ</p> 
                </div> 
                <p class="statistic__bottom-percent">-9.5%</p> 
              </li> 
              <li class="statistic__item"> 
                <div class="statistic__logo statistic__logo--yahoo"></div> 
                <div class="statistic__wrapper__text"> 
                  <p class="statistic__top-text">yhoo</p> 
                  <p class="statistic__bottom-text">Yahoo - NASDAQ</p> 
                </div> 
                <p class="statistic__bottom-percent">-2.9%</p> 
              </li> 
              <li class="statistic__item"> 
                <div class="statistic__logo statistic__logo--google"></div> 
                <div class="statistic__wrapper__text"> 
                  <p class="statistic__top-text">googl</p> 
                  <p class="statistic__bottom-text">Alphabet - NASDAQ</p> 
                </div> 
                <p class="statistic__bottom-percent">-0.2%</p> 
              </li> 
            </ul> 
          </div> 
          <div class="statistic__details"> 
            <h4 class="statistic__details--title statistic__title">Stock details</h4> 
            <ul class="statistic__details--list statistic__list"> 
              <li class="statistic__details-item"> 
                <p class="statistic__details-text">open</p> 
                <p class="statistic__details-figures">7,200</p> 
              </li> 
              <li class="statistic__details-item"> 
                <p class="statistic__details-text">high</p> 
                <p class="statistic__details-figures">9,500</p> 
              </li> 
              <li class="statistic__details-item statistic__details-item--last"> 
                <p class="statistic__details-text">52wk high</p> 
                <p class="statistic__details-figures">1,9007</p> 
              </li> 
              <li class="statistic__details-item"> 
                <p class="statistic__details-text">prev close</p> 
                <p class="statistic__details-figures">7,120</p> 
              </li> 
              <li class="statistic__details-item"> 
                <p class="statistic__details-text">low</p> 
                <p class="statistic__details-figures">1,200</p> 
              </li> 
              <li class="statistic__details-item statistic__details-item--last"> 
                <p class="statistic__details-text">52wk low</p> 
                <p class="statistic__details-figures">2,009</p> 
              </li> 
            </ul> 
          </div> 
        </section> 
      </main> 
    </div> 
  </div>