Подпишитесь на нас в Instagram: https://www.instagram.com/webstreet_code/

    
    

    *{
        маржа: 0;
        заполнение: 0;
        размер коробки: граница-коробка;
        семейство шрифтов: «Poppins», без засечек;
    }

    тело {
            цвет фона: #141625;
            дисплей: гибкий;
            выровнять-элементы: по центру;
            оправдание-содержание: гибкий старт;
            высота: 100вх;
            переполнение: скрыто;
        }
        .гамбургер{
            позиция: абсолютная;
            верх: 20 пикселей;
            слева: 18 пикселей;
            курсор: указатель;
            z-индекс: 10;
        }

        .гамбургер .line{
            ширина: 35 пикселей;
            высота: 4 пикселя;
            цвет фона: #f0a500;
            поле: 6 пикселей 0;
            радиус границы: 2 пикселя;
            переход: все 0,4 секунды легкости;
        }

        .меню-бар {
            положение: фиксированное;
            верх: 0;
            слева: 0;
            ширина: 80 пикселей;
            высота: 100%;
            цвет фона: #1f2235;
            box-shadow: 2px 0 15px rgba(0, 0, 0, 0,6);
            переполнение: скрыто;
            переход: ширина 0,4 с, легкость;

        }

        .menu-bar.open {
            ширина: 220 пикселей;
        }

        .меню-бар ул {
            стиль списка: нет;
            отступы: 80 пикселей 10 пикселей;
        }
        .menu-bar уль ли {
            дисплей: гибкий;
            выровнять-элементы: по центру;
            отступ: 15 пикселей;
            цвет: #b2becd;
            курсор: указатель;
            переход: фоновый цвет — легкость 0,3 с;
            левая граница: 4 пикселя, сплошная прозрачная;
        }

        .menu-bar уль ли я {
            размер шрифта: 24 пикселей;
            поле справа: 20 пикселей;
            переход: легкость преобразования 0,3 секунды;
        }
        .menu-bar уль ли пролет {
            непрозрачность: 0;
            размер шрифта: 16 пикселей;
            переход: непрозрачность 0,4 с, легкость;
            пробел: nowrap;
        }

        .menu-bar.open ul li span {
            непрозрачность: 1;
        }

        .menu-bar ul li:hover {
            цвет фона: #282a40;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
        }

        .menu-bar ul li:hover i {
            преобразование: масштаб (1.2);
        }

        .menu-bar ul li.active {
            цвет фона: #f0a500;
            радиус границы: 20 пикселей;
            цвет: #1f2235;
            левая граница: 4 пикселя сплошная #f0a500;
        }

        .menu-bar ul li.active я {
            цвет: #1f2235;
        }

        .menu-bar ul li.active span {
            цвет: #1f2235;
        }

















   стиль>
голова>