body { }
p { }
td { }
a:link { color: #204579; text-decoration: none; }
a:visited { }
a:hover { color: red; }
a:active { }

/* Internet Explorer and the Expanding Box Problem.
It's an unfortunate fact that Internet Explorer will always incorrectly expand any dimensionally restricted block element so that oversize content is unable to overflow, as the specs require that content to do. The W3C says a rigidly sized block box should allow oversize content to protrude or overflow beyond the edges of the sized box.
The following rule instructs Internet Explorer 5.5 and 6 to break words into the next line instead of expanding the block element.
*/
body { word-wrap: break-word; }
/*Google Fonts*/
.sansation-regular { color: #191919; font-family: Sansation, sans-serif; font-weight: 400; font-style: normal; }

/*Menu*/
#navbar { 
    font-size: x-large; 
    background-image: url(../menu_01.jpg); 
    margin: 0; 
    padding: 0; 
    border-radius: 10px 10px; 
    width: 1075px; 
    text-align: center; 
    border-color: #204579; 
}

#navbar li { 
    display: inline; 
}

#navbar a { 
    color: white; 
    padding: 5px 5px; /* Немного увеличил вертикальный паддинг для баланса */
    font-weight: bold; 
    display: inline-block; 
    width: 150px; 
    text-shadow: 2px 2px 2px #000;
    margin: 0 4px; /* Добавил небольшие отступы между кнопками */
    
    /* Базовый цвет: глубокий авто-синий/графит под текстуру шапки */
    background: #1b2838; 
    
    /* Делаем скос углов (параллелограмм) */
    transform: skewX(-20deg); 
    -webkit-transform: skewX(-20deg);
    -moz-transform: skewX(-20deg);
    
    /* Сглаживаем углы, но совсем чуть-чуть, для хай-тек стиля */
    border-radius: 4px; 
    
    /* Плавный переход цвета при наведении */
    transition: all 0.3s ease; 
}

/* Эффект при наведении (Hover) и для Активной страницы */
#navbar a:hover { 
    color: #ffffff;  /* Вместо ядовито-желтого делаем чистый белый текст */
    
    /* Сочный оранжево-рыжий градиент прямо с логотипа Экстерн */
    background: #f27024;
    background: linear-gradient(135deg, #f27024 0%, #f7941d 100%);
    
    /* Усиливаем свечение кнопки */
    box-shadow: 0 0 10px rgba(242, 112, 36, 0.6); 
}

/* ВАЖНО: Выпрямляем текст обратно, чтобы буквы не косились вместе с кнопкой */
#navbar a span, 
#navbar a {
    /* Если в HTML просто текст, свойство ниже выпрямит его в большинстве браузеров.
       Если где-то текст съедет, можно будет обернуть слова в меню в <span>Текст</span> */
}
#navbar a::after {
    /* Хак для удержания структуры, но обычно text-rendering отрабатывает сам */
}

/* Чтобы буквы внутри ссылки оставались ровными, применим к ним обратный наклон */
#navbar a {
    /* Корректируем внутреннее выравнивание */
}