/*
	 Organic Tabs
	 by Chris Coyier
	 http://css-tricks.com
*/

* { margin: 0; padding: 0; }
body { font: 12px Georgia, serif; }
html { overflow-y: scroll; }
a { text-decoration: none; }
a:focus { outline: 0; }
p { font-size: 15px; margin: 0 0 20px 0; }

#page-wrap {
    width: 100%;
    float:left;
    padding: 0 4em;
    }
    
h1 { font: bold 40px Sans-Serif; margin: 0 0 20px 0; }

/* Generic Utility */
.hide { position: absolute; top: -9999px; left: -9999px; }


/* Specific to example one */

#example-one { background: #eaeaea; padding: 10px; margin: 0 0 20px 0; -moz-box-shadow: 0 0 5px #666; -webkit-box-shadow: 0 0 5px #666; width: 100%; float:left;}

#example-one .nav { overflow: hidden; margin: 0 0 10px 0; }
#example-one .nav li { max-width: 214px; float: left; margin: 0 10px 0 0; }
#example-one .nav li.last { margin-right: 0; }
#example-one .nav li a { display: block; padding: 10px 25px; background: #959290; color: white; font-size: 14px; font-family: 'Barlow'; text-align: center; border: 0; }
#example-one .nav li a:hover { background-color: #111; }

#example-one ul { list-style: none; }
#example-one ul li{display:inline-block;}
#example-one ul li a { display: block; padding: 4px; color: #133488; }
/*#example-one ul li a:hover {color: white; }*/
#example-one ul li:last-child a { border: none; }

#example-one ul li.nav-one a.current, #example-one ul#undergraduate li a:hover { background-color: #fff; border: 1px solid #d0ae5e;}
#example-one ul li.nav-two a.current, #example-one ul#graduate li a:hover { background-color: #fff; border: 1px solid #d0ae5e; }
#example-one ul li.nav-three a.current, #example-one ul#postgraduate li a:hover { background-color: #fff; border: 1px solid #d0ae5e; }
#example-one ul li.nav-four a.current, #example-one ul#diploma li a:hover { background-color: #fff; border: 1px solid #d0ae5e; }
#example-one ul li.nav-five a.current, #example-one ul#professional li a:hover { background-color: #fff;border: 1px solid #d0ae5e; }

.list-wrap{
    width:100%;
    float:left;
    padding: 30px 0 0;
}
.list-wrap ul{
    width:100%;
    float:left;
}
.list-wrap ul li{
    width:49%;
    display:inline-block;
}
.course-title a:hover{
    background: none!important;
    border:none!important;
    color: #fff;
}
#undergraduate h3{
        font-size: 20px;
    color: #133488;
    /*padding: 0 0 20px;*/
}
#graduate h3{
        font-size: 20px;
    color: #133488;
    /*padding: 0 0 20px;*/
}
#postgraduate h3{
        font-size: 20px;
    color: #133488;
    /*padding: 0 0 20px;*/
}
#diploma h3{
        font-size: 20px;
    color: #133488;
    /*padding: 0 0 20px;*/
}
#professional h3{
        font-size: 20px;
    color: #133488;
    /*padding: 0 0 20px;*/
}
/* Specific to example two */

#example-two .list-wrap { background: #eee; padding: 10px; margin: 0 0 15px 0; }

#example-two ul { list-style: none; }
#example-two ul li a { display: block; border-bottom: 1px solid #666; padding: 4px; color: #666; }
#example-two ul li a:hover { background: #333; color: white; }
#example-two ul li:last-child a { border: none; }

#example-two .nav { overflow: hidden; }
#example-two .nav li { width: 97px; float: left; margin: 0 10px 0 0; }
#example-two .nav li.last { margin-right: 0; }
#example-two .nav li a { display: block; padding: 5px; background: #666; color: white; font-size: 10px; text-align: center; border: 0; }

#example-two li a.current,#example-two li a.current:hover { background-color: #eee !important; color: black; }
#example-two .nav li a:hover, #example-two .nav li a:focus { background: #999;}