Список классов при наведении курсора на другой идентификатор элемента

Я пытаюсь сделать, и элемент с id = "header_nav" изменяет его высоту, когда вы наводите курсор на элемент класса "header_nav" li

Код HTML:

<div class="header_nav" id="header_nav">
        <ul id="header_nav_mainmenu">
            <li><a href="index.php">Home</a></li>
            <li><a href="portfolio.php">Portfolio</a>
                <ul id="header_nav_submenu">
                    <li><a href="subpages\python.php">Python</a></li>
                    <li><a href="subpages\web_design.php">Web Design</a></li>
                    <li><a href="subpages\arma.php">ArmA Series</a></li>
                </ul>
            </li>
            <li><a href="forums\forums_home.php">Forums</a></li>
            <li><a href="support.php">Support</a>
                <ul>
                    <li><a href="subpages\contact_us.php">Contact Us</a></li>
                    <li><a href="subpages\faq.php">F.A.Q.</a></li>
                </ul>
            </li>
        </ul>
    </div>

Код CSS:

.header_nav
{
    width: 80%; 
    background-color: #1F1F1F;
    float:left;
    left:1px;
    top:100px;
    border-radius: 6px;
    width:15%;
    height:135px;
    text-align: left;
    position: fixed;
    border:1px solid white;

}

.header_nav li
{
    list-style: none;
    display: block;
    position: relative;
    text-align: left;
    background-color: #1F1F1F;
    /*transition*/
    transition: background-color 1s;
    -webkit-transition:background-color 1s;
}

.header_nav li a
{
    text-decoration: none;
    color:white;
    font-size: 22px;
}

.header_nav li ul
{
    display: none;
    position: absolute;
}

.header_nav li:hover ul
{
    display: block;
    position: relative;
    left:0px;
}

.header_nav li:hover a
{
    background-color: #454545;
    font-weight: bold;
    color: #FFAE00;
}

.header_nav li:hover ul a
{
    margin-top:2px;
    color:white;
    background-color: transparent;
    font-weight: normal;
    /*transition*/
    transition: background-color 0.5s;
    -webkit-transition: background-color 0.5s;
}
.header_nav li:hover ul li
{
    width:155px;
}

.header_nav li:hover #header_nav
{
    height:200px;
}

Любая помощь приветствуется, просто не может показаться, что я ошибаюсь.