ul#navMain
{
    float: left;
    list-style: none;
    width: 100%;
    padding: 0px 0 0 0;
    margin: 0px 0px 0px 0px;
    width: 142px;

}
ul#navMain li
{
    margin: 0px 0 0 0;
    width: 142px;
}
ul#navMain li a
{
  text-align: left;
    font-weight: bold;
    background: url(/UserFiles/Image/navigation/side-nav-off.jpg);
    background-repeat: no-repeat;
    background-color: #fff;
    float: right;
    margin: 0px 0px 5px 0px;
    padding: 2px 0px 2px 10px;
    width: 132px;
    
}
ul#navMain li a:hover
{
    text-align: left;
    font-weight: bold;
    background: url(/UserFiles/Image/navigation/side-nav-hover.jpg);
    background-repeat: no-repeat;
    color: #000;
    float: right;
    margin: 0px 0px 5px 0px;
    padding: 2px 0px 2px 10px;
    width: 132px;
    
}
ul#navMain li.active
{
    text-align: left;
    font-weight: bold;
    background: url(/UserFiles/Image/navigation/side-nav-hover.jpg);
    background-repeat: no-repeat;
    background-color: #000;
    float: right;
    margin: 0px 0px 5px 0px;
    padding: 2px 0px 2px 10px;
    width: 132px;
}
ul#navMain li.active a
{
    padding: 0px 0px 0px 0px;
}

/* ---- Footer Navigation -------*/


/* ---- Home Btn -------*/

#HomeBtn
{
    width: 39px;
    height: 34px;
    margin: 30px 0px 0px 10px;
    padding: 0px 0px 0px 0px;
    display: block;
    float: left;
    position: relative;

}
.HomeBtn-off a
{
    width: 39px;
    height: 34px;
    display: block;
    background: url(/UserFiles/Image/navigation/home.gif) 0 0px;
}
.HomeBtn-off a:hover
{
    background-position: 0 -34px;
    width: 39px;
    height: 56px;
    position: absolute;
    top:-22px;
    left: 0px;
    
}
.HomeBtn-on a
{
   width: 39px;
    height: 56px;
    display: block;
    background: url(/UserFiles/Image/navigation/home.gif) 0 -34px;
}

#HomeBtn a, #LessonBtn a, #QuizBtn a, #DiscussBtn a, #BlogsBtn a
{
    text-indent: -999em;

}
/* ---- Lesson plan Btn -------*/

#LessonBtn
{
    width: 73px;
    height: 34px;
    margin: 30px 0px 0px -10px;
    padding: 0px 0px 0px 0px;
    display: block;
    float: left;
    position: relative;

}
.LessonBtn-off a
{
   width: 73px;
    height: 34px;
    display: block;
    background: url(/UserFiles/Image/navigation/lesson-plans.gif) 0 0px;
}
.LessonBtn-off a:hover
{
    background-position: 0 -34px;
    width: 73px;
    height: 56px;
    position: absolute;
    top:-22px;
    left: 0px;
    
}
.LessonBtn-on a
{
   width: 39px;
    height: 56px;
    display: block;
    background: url(/UserFiles/Image/navigation/lesson-plans.gif) 0 -34px;
}

/* ---- Quiz polls Btn -------*/

#QuizBtn
{
    width: 60px;
    height: 34px;
    margin: 30px 0px 0px -25px;
    padding: 0px 0px 0px 0px;
    display: block;
    float: left;
    position: relative;

}
.QuizBtn-off a
{
   width: 60px;
    height: 34px;
    display: block;
    background: url(/UserFiles/Image/navigation/quiz-poll.gif) 0 0px;
}
.QuizBtn-off a:hover
{
    background-position: 0 -34px;
    width: 60px;
    height: 56px;
    position: absolute;
    top:-22px;
    left: 0px;
    
}
.QuizBtn-on a
{
   width: 39px;
    height: 56px;
    display: block;
    background: url(/UserFiles/Image/navigation/quiz-poll.gif) 0 -34px;
}

/* ---- Discuss Btn -------*/

#DiscussBtn
{
    width: 64px;
    height: 34px;
    margin: 30px 0px 0px -21px;
    padding: 0px 0px 0px 0px;
    display: block;
    float: left;
    position: relative;

}
.DiscussBtn-off a
{
   width: 64px;
    height: 34px;
    display: block;
    background: url(/UserFiles/Image/navigation/discuss.gif) 0 0px;
}
.DiscussBtn-off a:hover
{
    background-position: 0 -34px;
    width: 64px;
    height: 56px;
    position: absolute;
    top:-22px;
    left: 0px;
    
}
.DiscussBtn-on a
{
   width: 39px;
    height: 56px;
    display: block;
    background: url(/UserFiles/Image/navigation/discuss.gif) 0 -34px;
}
/* ---- Blogs Btn -------*/

#BlogsBtn
{
    width: 42px;
    height: 34px;
    margin: 30px 0px 0px -13px;
    padding: 0px 0px 0px 0px;
    display: block;
    float: left;
    position: relative;

}
.BlogsBtn-off a
{
   width: 42px;
    height: 34px;
    display: block;
    background: url(/UserFiles/Image/navigation/blogs.gif) 0 0px;
}
.BlogsBtn-off a:hover
{
    background-position: 0 -34px;
    width: 42px;
    height: 56px;
    position: absolute;
    top:-22px;
    left: 0px;
    
}
.BlogsBtn-on a
{
   width: 39px;
    height: 56px;
    display: block;
    background: url(/UserFiles/Image/navigation/blogs.gif) 0 -34px;
}