html {
    background-color: #e2e2e2;
    margin: 0;
    padding: 0;
}

body {
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none !important;
    cursor:pointer;
}

header, footer, hgroup,
nav, section {
    display: block;
}

mark {
    background-color: #a6dbed;
    padding-left: 5px;
    padding-right: 5px;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.clear-fix:after {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

h1, h2, h3,
h4, h5, h6 {
    color: #000;
    margin-bottom: 0;
    padding-bottom: 0;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.75em;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

    h5 a:link, h5 a:visited, h5 a:active {
        padding: 0;
        text-decoration: none;
    }


/* main layout
----------------------------------------------------------*/
#page_container {
    margin-top: 40px;
}

.topbar {
    height: 40px;
    background-color: #013263;
    color: #eef1f5;
    font-size: 11px;
    font-weight: bold;
    line-height: 40px;
    font-family: 'Segoe UI';
    padding-left:20px;
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.topbar .search{
}
.topbar .search img{
    vertical-align: top;
}

    .topbar .search-input {
        height: 30px;
        padding-left: 10px;
        color: #013263;
        border: 0;
    }

.flex-ctn{
    display:flex;
    justify-content: space-between;
}
.cat-flex-ctn {
    display: flex;
    justify-content: flex-start;
}
.cat-header-flex-ctn{
    display: flex;
    justify-content: center;
}
.cat-header-flex-item {    
    overflow:hidden;
    margin-right: 20px;
}
    .cat-header-flex-item img {
        max-width: 250px;
        max-height: 250px;
        border-radius: 150px;
        border: 15px solid #004183;
    }
.cat-header-flex-title {
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    margin-top: 30px;
}
#body {
    background-color: #fff;
}
.home-ctn {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 950px;
    background-color: #fff;
    margin: 67px auto;
}
#header {
    height: 79px;
    background-color: #fff;
}

#header .logo{
    margin-left:20px;
}

    #header .menu {
        flex: 1;
        display: flex;
        justify-content: flex-end;
        margin-top: 25px;
    }

.center-img img{
    width:100%;
}
.home-title {
    margin-top: 20px;
    text-align: center;
    font-weight: bold;
}
.home-intro-overlay {
    height: 100%;
    width: 100%;
    background-color: #000;
    opacity: 0.8;
    text-align: center;
    padding: 30px 200px;
    z-index:100;
    color: #fff;
    text-align:justify;
}

.home-intro {
    position:relative;
    width:100%;
    background-size: 100% 100%;
    background-repeat:no-repeat;
}
.divider{
    height:8px;
    background-image:url("../Images/divider.gif");
    background-repeat:repeat-x;
}

#nav .content-wrapper {
    background: #e7e7e7;
    color: #5b5b5b;
    font-weight: bold;
}

    #nav .content-wrapper table td {
        text-align: center;
        vertical-align: middle;
        height: 35px;
    }

#footer{
    border-top: 1px solid #ccc;
    margin-top:60px;
}

.content-ctn{
    width: 80vw;
    margin: 20px auto;
}



.category-content-ctn{
    display: flex;
}
.left-side{
    width:250px;
}

.article-top-item {
    width: calc(100%/2 - 10px);
    margin-right: 20px;
    border: 1px solid rgba(204, 204, 204, 0.26);
    position: relative;
}
.article-top-item:last-child{
    margin-right: 0;
}

    .article-top-item img{
        width: 100%;
    }
.article-top-item-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #000;
    opacity: 0.5;
    height: calc(100%/5*2);
}

.article-top-item-content {
    position: absolute;
    bottom: 0;
    left: 0;
    height: calc(100%/5*2);
    opacity: 1;
    padding: 5px;
    color: #fff;
    font-size:12px;
}
    .article-top-item-content a, .article-top-item-content a:hover{
        color: #fff;
        font-size: 13px;
        font-weight: bold;
    }
.artice_item-ctn {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}
.artice_item:last-child {
    margin-right: 0;
}
.artice_item {
    width: calc(100%/4 - 16px);
    margin-right: 21px;
}
.artice_item:last-child{
    margin-right: 0;
}

    .artice_item img {
        width: 100%;
        height: 125px;
    }

    .artice_item_link a {
        color: #1f62b0;
        font-weight: bold;
        font-size: 13px;
        text-decoration: none;
    }

/* site title
----------------------------------------------------------*/
.site-title {
    color: #c8c8c8;
    font-family: Rockwell, Consolas, "Courier New", Courier, monospace;
    font-size: 2.3em;
    margin: 0;
}

    .site-title a, .site-title a:hover, .site-title a:active {
        background: none;
        color: #c8c8c8;
        outline: none;
        text-decoration: none;
    }


/* login
----------------------------------------------------------*/
#login {
    display: block;
    font-size: .85em;
    margin: 0 0 10px;
    text-align: right;
}

    #login a {
        background-color: #d3dce0;
        margin-left: 10px;
        margin-right: 3px;
        padding: 2px 3px;
        text-decoration: none;
    }

        #login a.username {
            background: none;
            margin: 0;
            padding: 0;
            text-decoration: underline;
        }

    #login ul {
        margin: 0;
    }

    #login li {
        display: inline;
        list-style: none;
    }



/* page elements
----------------------------------------------------------*/
.vsep {
    width: 5px;
}

.content {
    margin-top:10px;
}
.service-content{
    padding: 10px 0 10px 0;
}
.service-ctn {
    background-color: #f4f4f4;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.service-item{
    margin: 5px;
}
    .service-item img {
        padding: 5px;
        width: calc(100vw/7);
    }
    .service-item-hide{
        display:none;
    }
.service-header {
    text-transform: uppercase;
    border-bottom: 5px solid #0077c0;
    color: #0077c0;
    font-weight: bold;

}
.breadcum {
    margin-top: 20px;
    color: #aeafaf;
}
.breadcum-bottom {
    margin-top: 20px;
    height: 3px;
    background-color: #00457c;
}
.breadcum-item, .breadcum-item a {
    text-transform: uppercase;
    color: #aeafaf;
}
.cat-title {
    color: #0177c1;
}
.gt-container{

}
.gt-item {
    padding: 5px 0;
}
.gt-container .active {
    background-color: #ccc
}
    .gt-container .active a {
        color: #0177c1;
    }
    .gt-item a {
        color: #838285;
    }
/* TAI KHOAN KHACH HANG*/
.tk {
    background-color: #5E9DD5;
    text-align: center;
    padding: 10px;
}

.tk_title {
    padding: 5px;
    font-weight: bold;
    color: #fff;
}

.tk_link {
    border: 1px solid #A1EDFB;
    background-color: #A1EDFB;
}

/*--TRA CUU HOA DON--*/
.se {
    margin-top: 8px;
    background-color: #fcb62d;
    text-align: center;
    border: 3px;
    border-radius: 5px;
}

.se_title {
    padding: 5px;
    font-weight: bold;
}

.se_makh input {
    width: 90%;
    padding: 5px;
    border: 0;
    border-radius: 5px;
    text-align: center;
}

.se_submit {
    padding: 10px;
}

    .se_submit input {
        border: 1px solid #0a3b69;
        border-radius: 5px;
        background-color: #0a3b69;
        color: #fff;
        padding: 5px 10px 5px 10px;
    }

.menu-ctn {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.submenu {
    width: 230px;
    position: absolute;
    display: none;
    background-color: #fff;
    padding: 10px;
    z-index: 1000;
    text-align: left;
    box-shadow: 1px 10px 5px 2px;
}

.menulink {
    position: relative;
    margin: 0 25px;
}

.menulink .submenu{
    position: absolute;
}
.menu-arrow{
    cursor:pointer;
}
.submenuitem {
    height: 30px;
    line-height: 30px;
}
.menu .active {
    border-bottom: 2px solid #013263;
}

.noidung {
    margin-top: 20px;
    border-bottom: 1px solid #ccc;
}

/* THONG BAO*/
.tb {
    background-image: url('../images/tbh.gif');
    background-repeat: no-repeat;
    background-position: top left;
    margin-top: 30px;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.tb_ctn {
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    margin-left: 5px;
    margin-top: 27px;
    padding-top: 15px;
    padding-left: 10px;
}

.oms_link {
    width: 90%;
    text-align: center;
    margin: 10px auto;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px;
}

.ct_email_link {
    text-align: center;
    margin: 10px auto;
    padding: 10px;
}

    .oms_link img, .ct_email_link img {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

/* VIDEO */

.left_vid_arrow {
    float: left;
}

.right_vid_arrow {
    float: right;
}

.vid_title {
    padding: 5px;
    text-align: center;
    color: #0058d0;
}
/* LIEN KET WEBSITE */
.wslink {
    margin-top: 30px;
    background-image: url('../images/ws_link.gif');
    background-repeat: no-repeat;
    background-position: 0 3px;
    padding-bottom: 30px;
    border-bottom: 1px solid #ccc;
}

.wslink_header {
    font-weight: bold;
    padding-left: 10px;
}

.ws_link_ctn {
    margin-top: 10px;
}

    .ws_link_ctn select {
        height: 28px;
        background-color: #e6e6e6;
        margin: 0;
        padding: 0;
        width: 80%;
        -webkit-appearance: none;
        -moz-appearance: none;
        text-indent: 1px;
    }

    .ws_link_ctn input {
        height: 28px;
        width: 29px;
        padding: 0;
        margin: 0;
        border: 0;
        background-image: url('../images/link_go.gif');
        background-position: top left;
        background-repeat: no-repeat;
    }

/* THỐNG KÊ */
.thongke {
    margin-top: 30px;
    background-image: url('../images/thongke.gif');
    background-position: top left;
    background-repeat: no-repeat;
}

.thongke_ctn {
    margin-top: 40px;
}

/* HINH ANH */
.fimage {
    margin-top: 30px;
}

/* HOME FEATURES*/
.home_feature_container {
    max-height: 330px;
    overflow: hidden;
    padding-right: 15px;
}

.home_feature {
    position: relative;
}

.feature_content {
    height: 330px;
}

    .feature_content img {
        max-height: 330px !important;
    }

.feature_description {
    position: absolute;
    bottom: 0;
    background-color: #000;
    opacity: 0.4;
}

.feature_description_content {
    color: #fff;
    padding: 5px;
    font-size: 12px;
}

.feature_description_content_title a {
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    font-size: 15px;
}

.home_feature_item {
    margin-bottom: 10px;
}

.home_feature_item_title {
    font-weight: bold;
    padding: 0;
}

    .home_feature_item_title a {
        text-decoration: none;
        font-size: 13px;
        color: #1f62b0;
    }
/* --- FEATURED CAT --- */
.feature_category_ctn {
    margin-top: 60px;
}

.feature_category_header_line {
    height: 3px;
    border-bottom: 1px solid #ccc;
    background-image: url('../images/header_line.gif');
    background-repeat: no-repeat;
    margin-right: 15px;
}

.feature_category_item {
    margin-top: 15px;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.feature_category_item_ctn {
    border: 1px solid #ccc;
    height: 300px;
    margin-right: 15px;
}

    .feature_category_item_ctn p {
        margin: 0 !important;
        font-size: 13px;
    }

.feature_category_item_img {
    height: 130px;
    width: 100%;
}

.feature_category_item_content {
    margin-left: 7px;
    margin-right: 3px;
    margin-bottom: 10px;
    max-height: 130px;
    overflow: scroll;
    text-align: justify;
}

.feature_category_item_title {
    text-align: center;
    margin-top: 7px;
}

    .feature_category_item_title a, .feature_category_item_title a:hover {
        color: #0a5ca7;
        text-decoration: none;
        font-weight: bold;
    }

.feature_category_item_articles {
}

    .feature_category_item_articles ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .feature_category_item_articles li {
        padding-left: 0;
        background-image: url('../images/square.gif');
        background-repeat: no-repeat;
        background-position: left center;
    }

        .feature_category_item_articles li a {
            color: #4b87be;
            margin-left: 10px;
            font-size: 13px;
        }
/* ---PHOTO ARTICLE--*/
.photo_article_ctn {
    margin-top: 15px;
    margin-right: 0px !important;
}

.photo_article_header {
    padding: 8px 38px;
    background-image: url('../images/bul.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-color: #033775;
    color: #fff;
    font-weight: bold;
}

.photo_article_item {
    margin-top: 10px;
}

    .photo_article_item img {
        width: 173px;
        height: 128px;
    }

.photo_article_link a {
    font-weight: bold;
    text-decoration: none;
    color: #0a5ca7;
    font-size: 13px;
}

/* --- HOME CATEGORY ---*/
.home_category_ctn {
    margin-top: 15px;
    padding-right: 15px !important;
}

.h_c_header {
    padding: 8px 38px;
    background-image: url('../images/bul.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-color: #033775;
    color: #fff;
    font-weight: bold;
}

    .h_c_header a {
        text-decoration: none;
        font-weight: bold;
        color: #fff;
    }

        .h_c_header a:hover {
            text-decoration: none;
        }

.h_c_item {
    margin-top: 10px;
    padding: 0 !important;
}

.h_c_f_img {
    width: 175px;
    height: 120px;
    float: left;
    padding-right: 10px;
}

.h_c_item_title a {
    color: #1f62b0;
    text-decoration: none;
    font-weight: bold;
}

.a_i a {
    font-size: 13px;
    text-decoration: none;
    color: #1f62b0;
}

/* --- CAT DETAILS ---*/
.category_ctn {
    padding-right: 15px !important;
}

    .category_ctn .header {
        padding: 5px 15px;
        color: #aeafaf;
        font-size: 10px;
        text-transform:uppercase;
    }
    .category-img img{
        width: 100%;
    }

.a_title {
    margin: 0;
    color: #00457c;
    padding-bottom: 10px;
}
.a_title_bot_border {
    height: 3px;
    background-color: #ffbf00;
}
.a_title_bot_border_right {
    height: 3px;
    margin-left: 200px;
    background-color: #00457c;
}

    .a_title a {
        font-weight: bold;
        text-decoration: none;
    }
.a_img{
    margin-top: 30px;
}
.a_desc {
    margin: 10px;
}
.articles {
    margin-top: 20px;
    border-top: 2px solid #ccc;
}

/* --- ARTICLE --- */
.article_ctn {
    margin: 15px;
}
    .article_ctn .header {
        padding: 5px 15px 5px 0;
        color: #033775;
        font-weight: bold;
        font-size: 15px;
    }
    .time {
        color: #999;
    }
.older_articles {
    border-bottom: 1px solid #ccc;
    color: #31708F;
}
.artice_item_link{
    margin-top:10px;
}
.artice-item-ul, .article-item-li {
    padding: 0;
    margin: 0;
}
/* --- PHOTO ---*/
.pa_item {
    margin: 15px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
}
.pa_title {
    color: #033775;
    font-weight: bold;
}
.photo_details {
    margin-top: 10px;
    padding-right: 15px !important;
}
    .photo_details .header {
        padding: 5px 15px 5px 0;
        color: #033775;
        font-weight: bold;
        font-size: 15px;
    }
    .photo_details img {
        max-width: 810px;
    }
.pa_img img {
    max-height: 100px;
}
/*---TB--*/
.tb_item_ctn {
    max-height: 220px;
}
.tb_item {
    margin-bottom: 5px;
    padding-left: 10px;
    background-image: url('../images/red_bul.gif');
    background-position-x: 0;
    background-position-y: 8px;
    background-repeat: no-repeat;
    font-size: 13px;
}

/*----VIDEO---*/
.video_title {
    font-size:13px;
    font-weight: bold;
    color: #08497e;
    text-align: center;
}
/* login page */
#loginForm {
    border-right: solid 2px #c8c8c8;
    float: left;
    width: 55%;
}

    #loginForm .validation-error {
        display: block;
        margin-left: 15px;
    }

    #loginForm .validation-summary-errors ul {
        margin: 0;
        padding: 0;
    }

    #loginForm .validation-summary-errors li {
        display: inline;
        list-style: none;
        margin: 0;
    }

    #loginForm input {
        width: 250px;
    }

        #loginForm input[type="checkbox"],
        #loginForm input[type="submit"],
        #loginForm input[type="button"],
        #loginForm button {
            width: auto;
        }

#socialLoginForm {
    margin-left: 40px;
    float: left;
    width: 40%;
}

    #socialLoginForm h2 {
        margin-bottom: 5px;
    }

#socialLoginList button {
    margin-bottom: 12px;
}

#logoutForm {
    display: inline;
}

/* contact */
.contact h3 {
    font-size: 1.2em;
}

.contact p {
    margin: 5px 0 0 10px;
}

.contact iframe {
    border: 1px solid #333;
    margin: 5px 0 0 10px;
}

/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.message-success {
    color: #7ac0da;
    font-size: 1.3em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.error {
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}

/********************
*   Mobile Styles   *
********************/
@media only screen and (max-width: 850px) {
  
    /* login */
    #login {
        font-size: .85em;
        margin: 0 0 12px;
        text-align: center;
    }

        #login ul {
            margin: 5px 0;
            padding: 0;
        }

        #login li {
            display: inline;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        #login a {
            background: none;
            color: #999;
            font-weight: 600;
            margin: 2px;
            padding: 0;
        }

            #login a:hover {
                color: #333;
            }

    /* menu */
    nav {
        margin-bottom: 5px;
    }

    ul#menu {
        margin: 0;
        padding: 0;
        text-align: center;
    }

        ul#menu li {
            margin: 0;
            padding: 0;
        }

    
    /* main layout
    ----------------------------------------------------------*/
    .main-content,
    .featured + .main-content {
        background-position: 10px 0;
    }
    
    .featured .content-wrapper {
        padding: 10px;
    }

    /* page content */
    article, aside {
        float: none;
        width: 100%;
    }

    /* ordered list */
    ol.round {
        list-style-type: none;
        padding-left: 0;
    }

        ol.round li {
            padding-left: 10px;
            margin: 25px 0;
        }

            ol.round li.zero,
            ol.round li.one,
            ol.round li.two,
            ol.round li.three,
            ol.round li.four,
            ol.round li.five,
            ol.round li.six,
            ol.round li.seven,
            ol.round li.eight,
            ol.round li.nine {
                background: none;
            }

    /* features */
    section.feature {
        float: none;
        padding: 10px;
        width: auto;
    }

        section.feature img {
            color: #999;
            content: attr(alt);
            font-size: 1.5em;
            font-weight: 600;
        }

    /* forms */
    input {
        width: 90%;
    }

    /* login page */
    #loginForm {
        border-right: none;
        float: none;
        width: auto;
    }

        #loginForm .validation-error {
            display: block;
            margin-left: 15px;
        }

    #socialLoginForm {
        margin-left: 0;
        float: none;
        width: auto;
    }

    .cat-header-flex-item {
        text-align: center !important;
    }

    .cat-header-flex-title {
        width: calc(100vw/6) !important;
    }

    .artice_item {
        text-align: center !important;
    }

    /* footer
    ----------------------------------------------------------*/
    

}