/**
 * The Main css file for teh website
 */

/**
 *  The General Layout Parts
 */

.container {
background-color: #f8f8f8;
margin-top: 1em;
border:1px solid #ccc;
}

#header {
    width:100%;
}

.nav {
    font-size: 1.2em;
}

.nav ul
    {
    margin:  0;
    width: 100%;
    }

.nav ul li
    {
    text-align: center;
    list-style: none;
    }

.nav ul li a {
        color: #848484;
        text-decoration: none;
        display: block;
        line-height: 2.5em;
    }
.navbar-default .navbar-nav>li>a.selected {
  color: #ffffff;
}
.navbar-default .navbar-nav>li>a.selected:hover {
    color: #ffffff;
}
.navbar>.container-fluid .selected {
    color: #ffffff;
}

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover
    {
    /*override bootsrtp back to same color */
    color: #848484;
    background-color:#3E3C3C;
}
.navbar-default .navbar-brand:hover {
    background-color:#3E3C3C;
}
.navbar-default .navbar-brand.selected:hover {
    background-color:#3E3C3C;
    color: #ffffff;
}


.navbar a:hover {
    
}
.navbar {
    position: relative;
    min-height: 50px;
    background: #000;
    margin-bottom: 0;
}
/*increase padding below heading */
.h1, .h2, .h3, h1, h2, h3 {
    margin-bottom: 20px;
}

.content {
    padding:10px;
    padding-top: 0;
}

/*Force the content to expand to accommodate the floating elements */
.content:after {
    content:"";
    display:table;
    clear:both;
}
#sidebar {
    padding-bottom: 1em;
}


#footer {
    clear:both;
    width:100%;
    height: 3em;
    border-top:1px solid #ccc;
}
 
#footer p {
    padding:10px;
}

/**
 * Miscellaneous Styles
 */

/* stop images expanding past their parent div */
img {
    max-width:100%;
    max-height:100%;
}

/* Overide Bootstrap and make link in panel large as the panel */

.panel-default>.panel-heading {
    padding: 0;
}

.panel-default>.panel-heading a {
    display: block;
    padding: 10px 15px;
}

@media only screen and (min-width: 768px) { /*desktop styles*/
    /* text bigger */
    p {
        font-size: 16px;
    }
    .navbar-collapse {
        padding: 0; /* on tablets, stop wrapping */
    }
    #sidebar {
        float: left;
    }
    .content {
        width: 80%;
        float: left;
    }
    .no-sidebar {
        width: 100%;
        float: none;
    }
}