    /*custom font for text*/

    @import url(http://fonts.googleapis.com/css?family=Nunito);

    /*CSS file for fontawesome - an iconfont we will be using. This CSS file imported contains the font-face declaration. More info: http://fortawesome.github.io/Font-Awesome/ */

    @import url(http://thecodeplayer.com/uploads/fonts/fontawesome/css/font-awesome.min.css);



    /*Basic reset*/



    #accordian {

        width: 200px;

        color: black;

    }

    /*heading styles*/

    #accordian h3 {

        font-size: 13px;

        min-height: 20px;

        padding-left: 5px;

        padding-top: 4px;

        margin-top: 10px;

        margin-bottom: 0;

        font-weight: 400;

        cursor: pointer;

    }



    /*heading hover effect*/

    #accordian h3:hover {

        text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);

    }

    

    /*list items*/

    #accordian li {

        list-style-type: none;

    }

    /*links*/

    #accordian ul ul li a {

        color: black;

        text-decoration: none;

        font-size: 11px;

        line-height: 27px;

        display: block;

        /*transition for smooth hover animation*/

        transition: all 0.15s;

    }



    /*Lets hide the non active LIs by default*/

    #accordian ul ul {

        display: none;

    }

    #accordian li.active ul {

        display: block;

    }



    #accordian ul .checkbox {

        position: relative;

        display: block;

        margin-top: 0;

        margin-bottom: 0;

    }