Андрей

Ваш шрифт называется Operator Mono. Вы поставили три варианта для соответствующих начертаний.

Независимо от количества установленных вариаций шрифта, в программах будет отображаться один шрифт. Сами программы будут выбирать файл шрифта в зависимости от своих настроек. Если указанного файла шрифта нет то программы по своим алгоритмам сэмулировали бы италик из ближайшего подходящего файла шрифта. Поэтому вам нужно искать галочку Italic, или типа того

Попробуйте так (код скорее всего не рабочий, но принцип должен быть понятен)

<div class="col-lg-6"></div>
<div class="col-lg-6">
    <div class="col-lg-6"></div>
    <div class="col-lg-6"></div>
    <div class="col-lg-6"></div>
    <div class="col-lg-6"></div>
</div>

Единственное что может помочь реанимировать - замена платы.
Так что нужно поискать плату с таких же дисков. На алиэкспрессе продают платы для дисков, можно посмотреть там.
Если замена платы не поможет - то максимум что можно сделать - восстановить данные в спец.местах, но занятие это не дешевое.

Попробуйте посмотреть в логах - в любой папке на "Компьютер" правой кнопкой мыши, "Управление", слева "Просмотр событий" -> "Журналы Windows", и там смотрите что происходит в момент отключения связи. Возможно что-то из планировщика срабатывает.

Второй вариант - переустановить драйвера на сетевую карту. Возможно тогда все настройки локальной сети сбросятся и проблема исчезнет.

По большому счёту особого смысла сильно оптимизировать картинку нет. Они просто должны быть разумного разрешения и размера.
Но если очень хочется, то посмотрите какие разрешения выбирают различные библиотеки вроде бутстрапа и других.
По моему опыту, могу сказать что оптимальнее всего для критичных (крупных, наполненных деталями итд) картинок лучше всего делать три размера - для самых маленьких экранов (для мобильных, с размером viewport до 600 включительно), для средних экранов (с размерами до 1920 включительно) и для крупных. И, соответственно делаете картинки нужного размера, ориентируясь на каждый из размеров экрана.
Для некритичных - заниматься смысла нет, много не выйграете. Но если у вас само пережимается под нужные размеры, можете и их пережимать по тем же правилась.

Да, еще для оптимизации - используйте ленивую загрузку картинок (загрузка при прокрутке). Заглушки для картинок (чтобы контент не прыгал пока картинки нет) можно делать с помощью генерируемого svg нужного размера, такая картинка будет весить около 500 байт. Например, по адресу site.ru/svg?x=826&y=800 возвращать svg указанного размера.

Далее, чтобы загружать картинки не по мере прокручивания, а сразу после того как загрузилась вся страница, можно использовать link rel="prefetch". Тогда вся страница загрузится разу, а "ленивые" картинки загрузятся после и положатся в кеш. И пока человек будет крутить, загружаться они будут уже из кеша а не по сети.

На js - сначала получаем координаты относительно окна браузера, затем прибавляем к ним скролл окна.

var rect = el.getBoundingClientRect();
var top = rect.top + document.body.scrollTop;
var left = rect.left + document.body.scrollLeft;

На jquery
$(el).offset();

Лучше решить вопрос шума другим путём - убрать лишние вентиляторы, там где нельзя - заменить вентиляторы на тихие, поставить СВО

Сначала в переменные засовываются селекторы.

В setDetails по селектору DETAIL_IMAGE_SELECTOR находятся элементы (вероятно, изображения), и им устанавливается параметр src. По селектору DETAIL_TITLE_SELECTOR устанавливается текст внутри элементов.

В imageFromThumb параметром должен передаваться dom-элемент, и она возвращает значение атрибута data-image-url.

titleFromThumb аналогично второй, только атрибут data-image-title.

setDetailsFromThumb получает через параметр dom-элемент, через вторую и третью функции получает значения атрибутов и заполняет нужные значения элементы через первую функцию.

addThumbClickHandler навешививает на dom-элемент событие клика, по которому выполняет четвёртую функцию передавая в неё dom-элемент на который навешана пятая функция.

getThumbnailsArray получает список всех элементов по селектору THUMBNAIL_LINK_SELECTOR затем, преобразовывает этот список в массив и возвращает его.

initializeEvents получает список объектов через getThumbnailsArray и для каждого элемента вызывает addThumbClickHandler.

А если кратко - это выглядит как галерея картинок, когда есть маленькие превью, или текстовый список, при нажатии на каждый элемент из которого в целевом объекте отображается нужное изображение с заголовком.

Не понятно к чему первый кусок кода. В нём вы подключаете скрипт.
Стиль прямо на странице нужно писать так, как в вашем последнем примере.
Делать это нужно после того, как вы указали ссылку на стиль, например так:

<html>
<head></head>
<body>
// Тут какой то html
// Потом файл стилей
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic&amp;subset=latin,cyrillic">
// Потом ваш переопределённый стиль
<style>.searchFormContainer{padding:0!important; background:transparent!important; border-radius:none!important;}</style>
<body>
<html>

Canvas должен быть внутри angular-контроллера. На квадраты повесить событие ng-click. На появляющиеся поля повесить соответствующие ng-model. При ng-click менять видимость и обновлять модель полей.

Если задача узкая задача, под которую ищется компьютер - это собрать хромиум, то можно попробовать арендовать vps с почасовой оплатой. У digital ocean можно за ~1 доллар в час взять машинку с 20 ядрами и 64 гб озу. Уверен, если копнуть глубже и поискать (на амазоне, в ажуре, у гугла, у менее известных провайдеров), можно найти больше ядер за такую цену.