Bir alanı mobilde gözükmemesini sağlama

Aşağıdaki kodun mobilde gözükmemesini sadece pc'de gözükmesini istiyorum. Ancak ne yaptıysam beceremedim. Yarıdmcı olabilecek var mı acaba?

<section id="slider">

  <div class="container-fluid">

    <div class="row">

      <div class="mainSlider owl-carousel owl-theme">

        <?php foreach ($slidersor as $key): ?>

          <div class="item">

            <img class="sliderduzen " src="<?=$key['slider_resim']?>">

              <div class="title"><h1><?=$key['slider_baslik']?></h1></div>

              <div class="text"><p><?=$key['slider_aciklama']?></p>

              </div>              

            </div>

          </div>

        <?php endforeach ?>

      </div>

    </div>

  </div>

</section>

Yardımcı olayım uzak bağlantı programı ile

css den
.grorunmesini_isteginDiv {display:none}
@media (max-width:768px)
{
.grorunmesini_isteginDiv {display:block}
}

@media screen and (max-width: 600px) {
  #slider{
    visibility: hidden;
    clear: both;
    display: none;
  }
}

Bootstrap kullanıyosun. Class'la halledersin.

d-lg-block d-md-none eklemen yeter

https://getbootstrap.com/docs/4.0/utilities/display/