Как придать другой цвет выбранному элементу списка с помощью CSS?

Я знаю, что этот вопрос задавался много раз раньше. Но я просто могунайти правильный трюк для моего кода. Я хочу другой цвет для моего активного элемента списка на панели навигации. Очевидно. Глупая мелочь. Я знаю. Но, пожалуйста, постарайтесь помочь.

Вот'мойHTML код:

  
      
        <a href="am_home.html">Home</a>  
        <a href="am_teachingassistants.php">Teaching Assistants</a>  
        <a href="am_courseinfo.php">Course Info</a>  
        <a href="am_timetable.php">Time Table</a>  
      
  

и здесь'сCSS файл:

#container {
    position: relative;
    top: -2em;
    z-index: 2;
    width: 1200px;
    margin: auto auto;
}

#nav {
   position: relative;
   float: left;
   margin-left: 400px;
}

#nav li {
    list-style: none;
    float: left;
    border-right: 1px solid #afc4cc;
}

#nav li a {
   position: relative;
   z-index: 2;
   float: left;
   padding: 5px 45px;
   font-size: 15px;
   font-weight: bold;
   font-family: helvetica, arial, sans-serif;
   text-decoration: none;
   color: #39aea8;
}

ul, li {
    margin: 0;
    padding: 0;
}

ul#nav li a:link,ul#nav li a:visited {
    color: #39aea8;
    text-decoration: none;
}

ul#nav li a:hover,ul#nav li a:active {
    color: #f4ba51;
    text-decoration: none;
}

Ответы на вопрос(2)

Ваш ответ на вопрос