html {
    background-color: gray;
}

body {
    padding: 10px;
    max-width: 1000px;
    background-color: white;
    /* auto margin to center align the body */
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    border-radius: 5px;

    -moz-box-shadow: 0 0 30px 5px #3C3C3C;
    -webkit-box-shadow: 0 0 30px 5px #3C3C3C;
}
    body section h2{
        margin-bottom: 20px;
        letter-spacing: -2px;
    }

    body section p{
        text-align: justify;
    }

/*============================ style for header ============================*/
header nav img, header nav i {
    height: 22px;
    margin-right: 0px;
    margin-top: -4px;
    vertical-align: central;
    text-align: center;
}

header .navbar-brand {
    font-size: 40px;
    letter-spacing: -4px;
    height: 50px;
}

@media (max-width : 335px){
    header .navbar-brand {
        font-size: 40px;
        font-size: 10vw;
        letter-spacing: -2.5px;
    }
}

/*============================ style for footer ============================*/
footer {
    background-color: silver;
    padding: 10px;
    margin-top: 10px;
    font-size: 11.66px;
    text-align: center;
    border-radius: 5px;
}

.footer-nav{
    display: inline-block;
}


/*============================ common styles ============================*/
#top-link-block.affix-top {
    position: absolute; /* allows it to "slide" up into view */
    bottom: -90px; /* negative of the offset - height of link element */
    right: 10px; /* padding from the left side of the window */
}
#top-link-block.affix {
    position: fixed; /* keeps it on the bottom once in view */
    bottom: 4px; /* height of link element */
    right: 10px; /* padding from the left side of the window */
}

.list-style-generic {
    margin: 15px 0 15px 0; /*bottom-left-top-right*/
}

    .list-style-generic li {
        margin: 7px 0 0 0; /*bottom-left-top-right*/
    }