body
{
    background-color: #F2F2F2;
}


/************** Layout Zone ***********/
.zone
{
    padding: 0px;
}

.zone-header
{
    padding-top: 13px;
}

.main-container
{
    margin: 0 auto;
}
/********* User Login ************/
.user-menu
{
    margin: 0 0 0 20px;
    padding-top: 4px;
    color: #FFFFFF;
}

    .user-menu .dropdown-menu
    {
        /*top: 29px;*/ /*[dung] this line make user dropdown is unreachable because there is a space between <li>username</li> and <ul>user menu</ul>*/
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }    

    .user-menu li
    {
        padding:0px;
        text-align: right;
        background: #333333;
        border: 1px solid #555555;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        margin-bottom: 1px;
        margin-top: 2px;
    }

        .user-menu li:hover, .user-menu li:hover
        {
        background: #577EBF;
    }

        .nav.pull-right li a
        {
            padding: 8px;
            color: #ffffff;
        }

            .nav.pull-right li a:hover
            {
                background: #577EBF;
            }

.nav .caret,
.nav a:hover .caret
{
    border-top-color: #ffffff;
    border-bottom-color: #ffffff;
}

.dropdown-menu:not(.datepicker)
{
    right: 0;
    left: inherit;
    background: #333333;
    border: none;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
}

li:hover ul.dropdown-menu
{
    display: block;
}

/********* Search box *********/
input.search-query
{
    padding-left: 13px;
    color: #ffffff;
}

.search.pull-right
{
    padding-top: 7px;
    float: right;
}

    .search.pull-right input
    {
        height: 27px;
        width: 150px;
        background: #555555;
        border: none;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        background-image: url("../Content/Images/search_icon.png");
        background-position: right center;
        background-repeat: no-repeat;  
        padding-right: 35px;  
    }

        .search.pull-right input:focus
        {
            background: #577ebf;   
            background-image: url("../Content/Images/search_icon.png");
            background-position: right center;
            background-repeat: no-repeat;       
        }

/************ Place holder color ************/
::-webkit-input-placeholder
{ /* WebKit browsers */
    color: #FFFFFF;
}

:-moz-placeholder
{ /* Mozilla Firefox 4 to 18 */
    color: #FFFFFF;
}

::-moz-placeholder
{ /* Mozilla Firefox 19+ */
    color: #FFFFFF;
}

:-ms-input-placeholder
{ /* Internet Explorer 10+ */
    color: #FFFFFF;
}

#layout-wrapper {
    margin: 0 auto; 
}

#header-zone
{
    background: #333333;
    height: 68px;
}

.main-content-block
{
    margin: 0 auto;
    min-width: 700px;
    max-width: 1700px;
    padding-left: 40px;
    padding-right: 40px;
}

#navigation-zone
{
    background: #222222;
    z-index: 10000;
    width: 100%;
    top:0;
}

#content-zone {
    width: 80%;
}

#navigation-block
{
    padding-top: 7px;
}

#main-content-block
{
    background: white;
    padding-top: 1px;
    padding-bottom: 40px;
}

#content-block-aside
{
    width: 64%;
    float: left;
}

#banner-block-aside
{
    width: 64%;
    float: left;
}

#content-block-full
{
    width: 100%;
    margin-top: 25px;
}

#banner-block-full {
    width: 100%;
    margin-top: 25px;
}

#widget-block
{
    width: 34%;
    margin-left: 66%;
}

#footer-zone
{
    background: #333333;
    height: 74px;
    overflow: hidden;
    position: relative;
    width: 100%;
    color: white;
}

    #footer-zone a
    {
        color: white;
        text-decoration: none;
    }

        #footer-zone a:hover
        {
            color: #55B0E5;
            text-decoration: none;
        }

#footer-credits
{
    background: #577EBF;
    height: 262px;
    width: 40%;
    margin-left: 64%;
}

#footer-container {
    /*padding-left: 0px;
    padding-right: 0px;*/
    max-width:2000px;
}

.zone-footer table td
{
    font-size: 14px;
}

#before-content-block
{
    background: #ffffff;
}

/****************** Navigation Bar *******************/
#sub-navigation-zone
{
    background: #577EBF;
    height: 44px;
    width:100%;
    z-index:9;
}

.sub-menu {
    overflow: hidden;
}

.nav.menu
{
    margin-bottom: 0px;
}

nav ul
{
    padding: 0px;
    margin: 0px;
}

    nav ul li
    {
        border: 1px solid #dbdbdb;
        background: #f6f6f6;
        display: inline;
        margin: 0 0px 0px 0;
        padding: 0;
    }

        nav ul li a
        {
            padding: 0px !important;
        }

nav > ul li.current
{
    border-bottom: 1px solid #fff;
    background: #fff;
}

nav ul li a
{
    padding: 0;
    display: block;
    color: #333;
    font-size: 1.077em;
    text-decoration: none;
    line-height: 24px;
}


/* first level */
nav > ul > li
{
    padding-top: 7px;
    height: 47px;
    display: inline !important;
    height: auto;
    width: auto;
    position: inherit !important;
    margin: 0;
    border: none;
}

nav > ul > li > a
{
    float: left;
    line-height: auto;
    text-decoration: none;
    margin: 0;
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
    color: #ffffff;
    padding: 7px 8px 8px 8px !important;
    margin-right: 18px;
}

nav > ul > li.active > a
{
    background-color: #577EBF;
}

nav > ul > li > a:hover
{
    background-color: #577EBF !important;
    color: #ffffff;
}

nav > ul > li:hover > ul
{   
    z-index: 10;
}

/* second level */
nav > ul > li > ul
{
    margin: 39px 0px 0px 0px;
    padding: 0px;
    position: absolute;
    min-width: 1000px;
    max-width: 1700px;
    height: 40px;
    background: #577EBF;
    display:none;
}

nav > ul > li.active > ul
{
    margin: 39px 0px 0px 0px;
    padding: 0px;
    display: block;
    position: absolute;
    min-width: 1000px;
    max-width: 1700px;
    height: 40px;
    background: #577EBF;
    overflow: hidden;
}

nav > ul > li > ul > li
{
    list-style-type: none;
    margin: 0px;
    border: none;
    display: inline;
}

nav > ul > li > ul > li > a
{
    display: inline;
    float: left;
    text-decoration: none;
    line-height: 30px;
    margin: 7px 18px 0px 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    height: 30px;
    color: #ffffff;
    padding: 0px 21px 0px 21px !important;
}

        nav > ul > li > ul > li:hover > a,
        nav > ul > li > ul > li.active > a
{
    background-color: #49588C !important;
    color: #ffffff;
    text-decoration: none;
}

nav > ul > li > ul > li:hover > ul
{
    /*display: inline;*/
}

/* third level */
nav > ul > li > ul > li > ul
{
    margin: -20px -1px 0px 90%;
    padding: 0px;
    display: none;
    position: absolute;
    border: 1px solid #dbdbdb;
}

nav > ul > li > ul > li > ul > li
{
    list-style-type: none;
    margin: 0px;
    border: none;
}

nav > ul > li > ul > li > ul > li > a
{
    display: block;
    text-decoration: none;
}

nav > ul > li > ul > li > ul > li:hover > a
{
}

/* deeper levels */
nav > ul > li > ul > li > ul ul
{
    display: none;
}

/***** Css for Icons Are downloaded *****/

.wrapper-file {
    display: table;
    width: 100%;
}

.wrapper-li {
    margin-left: 10px;
}

.filetype-icon {
    display: table-cell;
    width: 26px;
    height: 26px;
    background-size: 100%;
    padding-top: 3px;
    padding-bottom: 3px;
}

.file-url {
    display: table-cell;
    vertical-align: middle;
}

.filetype-icon.img {
    background-image: url("../Content/Images/filetype-icon-img.png");
    background-repeat: no-repeat;
}

.filetype-icon.compressed {
    background-image: url("../Content/Images/filetype-icon-compressed.png");
    background-repeat: no-repeat;
}

.filetype-icon.pdf {
    background-image: url("../Content/Images/filetype-icon-pdf.png");
    background-repeat: no-repeat;
}

.filetype-icon.word {
    background-image: url("../Content/Images/filetype-icon-word.png");
    background-repeat: no-repeat;
}

.filetype-icon.excel {
    background-image: url("../Content/Images/filetype-icon-excel.png");
    background-repeat: no-repeat;
}

.filetype-icon.file {
    background-image: url("../Content/Images/filetype-icon-file.png");
    background-repeat: no-repeat;
}

/*********** Blog **************/
.blog-posts li
{
    list-style: none;
}

.blog-posts
{
    margin-left: 0px;
}