Максим

Потому что у вас тут точка лишняя

buttonSubcatalog.classList.remove('.button-subcatalog-closed');

и вот тут

buttonSubcatalog.classList.remove('.button-subcatalog-opened');

Должно быть:

buttonSubcatalog.classList.remove('button-subcatalog-closed');
buttonSubcatalog.classList.remove('button-subcatalog-opened');

color: transparent; /* Цвет текста */
-webkit-text-stroke: 2px #000; /* Толщина и цвет обводки */
text-stroke: 2px #000; /* Толщина и цвет обводки (стандартное свойство) */

<div class="col-lg-4 text-center">

У вас все подобные блоки выходят за ширину контейнера. Разберитесь с ними, и будет вам счастье

Если правильно вас понял, то вы хотите применять стили для всех, кроме последнего, т.к. после него уже нет таких же элементов, верно? Если да то вам поможет :last-of-type
Что-то такое

.menu__item:not(:last-of-type) {
    // ваши стили
}

Вот так вам нужно?
https://codepen.io/MCheryabushkin/pen/oNbKxaj?edit...

Такой механизм очень часто применяется для табов, поэтому вот это может быть вам поможет

Позиционирование забыли задать

var x = '<h1>Привет</h1>'
var x_object = $(x)
x_object.css({
  left:50,
  top:502,
	position: "relative"
})
$("body").append(x_object)

Попробуйте
background-size: contain;

А в чем проблема то?
Максимально все расписано, вроде бы, Вы даже ссылку на ответ на свой вопрос сами скинули)
https://imask.js.org/guide.html

Это сам fancybox задаёт эту рамку, вряд ли Вы её найдёте где-либо. Попробуйте через CSS задать этому элементу
border:none!important, либо через JS сделать то же самое

Добрый день!
Вот такой вариант подойдет?

Привет, Михаил!

Вот, посмотри, может быть такой вариант подойдет?
https://codepen.io/MCheryabushkin/pen/KKPYGPE?edit...