.shadow-demo {
    width: 100px;
    height: 100px;
    background-color: #fff;
  }

  .shadow-demo-1 {
    width: 100px;
    height: 100px;
    background-color: #ccc;
  }

  .shadow-demo-2 {
    width: 100px;
    height: 100px;
    background-color: #000;
  }

  .mask-custom {
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 0;
    border: 0;
    background-clip: padding-box;
    box-shadow: 10px 10px 10px rgba(46, 54, 68, 0.03);
  }

  .custom-1 {
    backdrop-filter: blur(30px);
  }

  .custom-2 {
    backdrop-filter: blur(60px);
  }

  .custom-3 {
    backdrop-filter: blur(40px);
  }

  .custom-4 {
    backdrop-filter: blur(15px);
  }

  .custom-5 {
    backdrop-filter: blur(5px);
  }

  .mask-custom-1 {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 0;
    border: 0;
    background-clip: padding-box;
    box-shadow: 10px 10px 10px rgba(46, 54, 68, 0.03);
  }

  .custom-6 {
    backdrop-filter: blur(30px);
  }

  .custom-7 {
    backdrop-filter: blur(60px);
  }

  .custom-8 {
    backdrop-filter: blur(40px);
  }

  .custom-9 {
    backdrop-filter: blur(15px);
  }

  .custom-10 {
    backdrop-filter: blur(5px);
  }
  .square {
    height: 100px;
    width: 100px;
  }

  img.fit {
    object-fit: contain;
    max-width: 100%;
    max-height: 100%;
  }
  .shadow-demo {
    width: 100px;
    height: 100px;
    background-color: #fff;
  }

  .shadow-demo-1 {
    width: 100px;
    height: 100px;
    background-color: #ccc;
  }

  .shadow-demo-2 {
    width: 100px;
    height: 100px;
    background-color: #000;
  }

  .mask-custom {
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 0;
    border: 0;
    background-clip: padding-box;
    box-shadow: 10px 10px 10px rgba(46, 54, 68, 0.03);
  }

  .custom-1 {
    backdrop-filter: blur(30px);
  }

  .custom-2 {
    backdrop-filter: blur(60px);
  }

  .custom-3 {
    backdrop-filter: blur(40px);
  }

  .custom-4 {
    backdrop-filter: blur(15px);
  }

  .custom-5 {
    backdrop-filter: blur(5px);
  }

  .mask-custom-1 {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 0;
    border: 0;
    background-clip: padding-box;
    box-shadow: 10px 10px 10px rgba(46, 54, 68, 0.03);
  }

  .custom-6 {
    backdrop-filter: blur(30px);
  }

  .custom-7 {
    backdrop-filter: blur(60px);
  }

  .custom-8 {
    backdrop-filter: blur(40px);
  }

  .custom-9 {
    backdrop-filter: blur(15px);
  }

  .custom-10 {
    backdrop-filter: blur(5px);
  }

  /* ============ desktop view ============ */
  @media all and (min-width: 992px) {
    .dropdown-menu li{ position: relative; 	}
    .nav-item .submenu{ 
        display: none;
        position: absolute;
        left:100%; top:-7px;
    }
    .nav-item .submenu-left{ 
        right:100%; left:auto;
    }
    .dropdown-menu > li:hover { background-color: #f1f1f1 }
    .dropdown-menu > li:hover > .submenu{ display: block; }
  }
  /* ============ desktop view .end// ============ */
    
  /* ============ small devices ============ */
    @media (max-width: 991px) {
        .dropdown-menu .dropdown-menu{
            margin-left:0.7rem; margin-right:0.7rem; margin-bottom: .5rem;
        }
    }	
  /* ============ small devices .end// ============ */