/* <![CDATA[ */
.has-svg-icon:before {
    background-size: 100%;
    content: "";
    display: inline-block;
    vertical-align: middle
}

.reset-icon:before {
    width: 24px;
    height: 24px
}

body[data-theme="light"] .reset-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 0 24 24' width='24'%3E%3Cpath fill='%23707070' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z'%3E%3C/path%3E%3C/svg%3E")
}

.copy-icon:before,
.facbook-icon:before,
.twitter-icon:before,
.pinterest-icon:before {
    width: 28px;
    height: 28px
}

.linkedin-icon:before,
.email-icon:before {
    width: 26px;
    height: 26px
}

.mr-25:before {
    margin-right: 25px
}

.copy-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px'%3E%3Cpath fill= 'hsl(0,0%25,53.3%25)' d='M3.9,12C3.9,10.29 5.29,8.9 7,8.9H11V7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12M8,13H16V11H8V13M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.71 18.71,15.1 17,15.1H13V17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7Z'%3E%3C/path%3E%3C/svg%3E")
}

.facbook-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px'%3E%3Cpath fill='%233b5998' d='M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M18,5H15.5A3.5,3.5 0 0,0 12,8.5V11H10V14H12V21H15V14H18V11H15V9A1,1 0 0,1 16,8H18V5Z'%3E%3C/path%3E%3C/svg%3E")
}

.twitter-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px'%3E%3Cpath fill='%231da1f2' d='M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M17.71,9.33C18.19,8.93 18.75,8.45 19,7.92C18.59,8.13 18.1,8.26 17.56,8.33C18.06,7.97 18.47,7.5 18.68,6.86C18.16,7.14 17.63,7.38 16.97,7.5C15.42,5.63 11.71,7.15 12.37,9.95C9.76,9.79 8.17,8.61 6.85,7.16C6.1,8.38 6.75,10.23 7.64,10.74C7.18,10.71 6.83,10.57 6.5,10.41C6.54,11.95 7.39,12.69 8.58,13.09C8.22,13.16 7.82,13.18 7.44,13.12C7.81,14.19 8.58,14.86 9.9,15C9,15.76 7.34,16.29 6,16.08C7.15,16.81 8.46,17.39 10.28,17.31C14.69,17.11 17.64,13.95 17.71,9.33Z'%3E%3C/path%3E%3C/svg%3E")
}

.pinterest-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px'%3E%3Cpath fill='%23e60023' d='M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H9.29C9.69,20.33 10.19,19.38 10.39,18.64L11.05,16.34C11.36,16.95 12.28,17.45 13.22,17.45C16.17,17.45 18.22,14.78 18.22,11.45C18.22,8.28 15.64,5.89 12.3,5.89C8.14,5.89 5.97,8.67 5.97,11.72C5.97,13.14 6.69,14.89 7.91,15.45C8.08,15.56 8.19,15.5 8.19,15.34L8.47,14.28C8.5,14.14 8.5,14.06 8.41,14C7.97,13.45 7.69,12.61 7.69,11.78C7.69,9.64 9.3,7.61 12.03,7.61C14.42,7.61 16.08,9.19 16.08,11.5C16.08,14.11 14.75,15.95 13.03,15.95C12.05,15.95 11.39,15.11 11.55,14.17C11.83,13.03 12.39,11.83 12.39,11C12.39,10.22 12,9.61 11.16,9.61C10.22,9.61 9.39,10.61 9.39,11.95C9.39,12.83 9.66,13.39 9.66,13.39L8.55,18.17C8.39,19 8.47,20.25 8.55,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3Z'%3E%3C/path%3E%3C/svg%3E")
}

.linkedin-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg height='28px' viewBox='0 0 24 24' width='28px' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%230077B5' d='M 20 2 L 4 2 C 2.898438 2 2 2.898438 2 4 L 2 20 C 2 21.101563 2.898438 22 4 22 L 20 22 C 21.101563 22 22 21.101563 22 20 L 22 4 C 22 2.898438 21.101563 2 20 2 Z M 8.101563 18 L 5 18 L 5 9.398438 L 8.101563 9.398438 Z M 6.5 8.398438 C 5.601563 8.398438 5 7.800781 5 7 C 5 6.199219 5.601563 5.601563 6.601563 5.601563 C 7.5 5.601563 8.101563 6.199219 8.101563 7 C 8.101563 7.800781 7.5 8.398438 6.5 8.398438 Z M 19 18 L 15.898438 18 L 15.898438 13.300781 C 15.898438 12 15.101563 11.699219 14.800781 11.699219 C 14.5 11.699219 13.5 11.898438 13.5 13.300781 C 13.5 13.5 13.5 18 13.5 18 L 10.398438 18 L 10.398438 9.398438 L 13.5 9.398438 L 13.5 10.601563 C 13.898438 9.898438 14.699219 9.398438 16.199219 9.398438 C 17.699219 9.398438 18.898438 10.601563 18.898438 13.300781 L 18.898438 18 Z '%3E%3C/path%3E%3C/svg%3E")
}

.email-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px'%3E%3Cpath fill='%23fb8f3d' d='M22 6C22 4.9 21.1 4 20 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6M20 6L12 11L4 6H20M20 18H4V8L12 13L20 8V18Z'%3E%3C/path%3E%3C/svg%3E")
}

.comment-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23707070' viewBox='0 0 24 24'%3E%3Cpath d='M20 2H4C2.9 2 2 2.9 2 4V22L6 18H20C21.11 18 22 17.11 22 16V4C22 2.9 21.11 2 20 2M20 16H6L4 18V4H20M17 11H15V9H17M13 11H11V9H13M9 11H7V9H9'/%3E%3C/svg%3E")
}

body[data-theme="light"] .share-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23707070' viewBox='0 0 24 24'%3E%3Cpath d='M18,16.08C17.24,16.08 16.56,16.38 16.04,16.85L8.91,12.7C8.96,12.47 9,12.24 9,12C9,11.76 8.96,11.53 8.91,11.3L15.96,7.19C16.5,7.69 17.21,8 18,8A3,3 0 0,0 21,5A3,3 0 0,0 18,2A3,3 0 0,0 15,5C15,5.24 15.04,5.47 15.09,5.7L8.04,9.81C7.5,9.31 6.79,9 6,9A3,3 0 0,0 3,12A3,3 0 0,0 6,15C6.79,15 7.5,14.69 8.04,14.19L15.16,18.34C15.11,18.55 15.08,18.77 15.08,19C15.08,20.61 16.39,21.91 18,21.91C19.61,21.91 20.92,20.61 20.92,19A2.92,2.92 0 0,0 18,16.08Z'/%3E%3C/svg%3E")
}

.blog-search .search-icon:before {
    width: 18px;
    height: 18px
}

.search-button[aria-pressed="false"] .search-icon:before,
.web-search .search-icon:before {
    width: 21px;
    height: 21px
}

body[data-theme="light"] .header:not(.primary-background-color) .header-search-icon .search-button[aria-pressed="false"] .search-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 483.083 483.083'%3E%3Cg%3E%3Cpath fill='%23444' d='M332.74,315.35c30.883-33.433,50.15-78.2,50.15-127.5C382.89,84.433,298.74,0,195.04,0S7.19,84.433,7.19,187.85 S91.34,375.7,195.04,375.7c42.217,0,81.033-13.883,112.483-37.4l139.683,139.683c3.4,3.4,7.65,5.1,11.9,5.1s8.783-1.7,11.9-5.1 c6.517-6.517,6.517-17.283,0-24.083L332.74,315.35z M41.19,187.85C41.19,103.133,110.04,34,195.04,34 c84.717,0,153.85,68.85,153.85,153.85S280.04,341.7,195.04,341.7S41.19,272.567,41.19,187.85z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E")
}

.header.primary-background-color .header-search-icon .search-button[aria-pressed="false"] .search-icon:before,
.blog-search .search-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 483.083 483.083'%3E%3Cg%3E%3Cpath fill='%23fff' d='M332.74,315.35c30.883-33.433,50.15-78.2,50.15-127.5C382.89,84.433,298.74,0,195.04,0S7.19,84.433,7.19,187.85 S91.34,375.7,195.04,375.7c42.217,0,81.033-13.883,112.483-37.4l139.683,139.683c3.4,3.4,7.65,5.1,11.9,5.1s8.783-1.7,11.9-5.1 c6.517-6.517,6.517-17.283,0-24.083L332.74,315.35z M41.19,187.85C41.19,103.133,110.04,34,195.04,34 c84.717,0,153.85,68.85,153.85,153.85S280.04,341.7,195.04,341.7S41.19,272.567,41.19,187.85z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E")
}

.web-search .search-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 483.083 483.083'%3E%3Cg%3E%3Cpath fill='%23444' d='M332.74,315.35c30.883-33.433,50.15-78.2,50.15-127.5C382.89,84.433,298.74,0,195.04,0S7.19,84.433,7.19,187.85 S91.34,375.7,195.04,375.7c42.217,0,81.033-13.883,112.483-37.4l139.683,139.683c3.4,3.4,7.65,5.1,11.9,5.1s8.783-1.7,11.9-5.1 c6.517-6.517,6.517-17.283,0-24.083L332.74,315.35z M41.19,187.85C41.19,103.133,110.04,34,195.04,34 c84.717,0,153.85,68.85,153.85,153.85S280.04,341.7,195.04,341.7S41.19,272.567,41.19,187.85z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E")
}

.search-button[aria-pressed="true"] .search-icon:before {
    width: 28px;
    height: 28px
}

body[data-theme="light"] .header:not(.primary-background-color) .search-button[aria-pressed="true"] .search-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28' viewBox='0 0 24 24' width='28'%3E%3Cpath fill='%23707070' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z'%3E%3C/path%3E%3C/svg%3E")
}

.header.primary-background-color .search-button[aria-pressed="true"] .search-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28' viewBox='0 0 24 24' width='28'%3E%3Cpath fill='%23fff' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z'%3E%3C/path%3E%3C/svg%3E")
}

.header .page-icon:before {
    width: 24px;
    height: 24px
}

.header-navigation-bar .page-icon:before {
    width: 20px;
    height: 20px
}

body[data-theme="light"] .header:not(.primary-background-color) .page-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' width='24' height='24'%3E%3Cpath fill='%23707070' d='M8 16h8V8H8v8zm12 24h8v-8h-8v8zM8 40h8v-8H8v8zm0-12h8v-8H8v8zm12 0h8v-8h-8v8zM32 8v8h8V8h-8zm-12 8h8V8h-8v8zm12 12h8v-8h-8v8zm0 12h8v-8h-8v8z'%3E%3C/path%3E%3C/svg%3E")
}

.header.primary-background-color .page-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' width='24' height='24'%3E%3Cpath fill='%23fff' d='M8 16h8V8H8v8zm12 24h8v-8h-8v8zM8 40h8v-8H8v8zm0-12h8v-8H8v8zm12 0h8v-8h-8v8zM32 8v8h8V8h-8zm-12 8h8V8h-8v8zm12 12h8v-8h-8v8zm0 12h8v-8h-8v8z'%3E%3C/path%3E%3C/svg%3E")
}

body[data-theme="light"] .header-navigation-bar .page-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' viewBox='0 0 24 24' width='20'%3E%3Cpath fill='%23707070' d='M12 9c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3M3 9c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm18 0c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3z'%3E%3C/path%3E%3C/svg%3E")
}

.left-icon:before,
.angle-left-icon:before,
.angle-right-icon:before,
.zalo-icon:before {
    width: 16px;
    height: 16px
}

.mr-8:before {
    margin-right: 8px
}

.angle-left-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16px' viewBox='0 0 608 1280' width='16px'%3E%3Cpath fill='%23212529' d='M595 288q0 13-10 23L192 704l393 393q10 10 10 23t-10 23l-50 50q-10 10-23 10t-23-10L23 727q-10-10-10-23t10-23l466-466q10-10 23-10t23 10l50 50q10 10 10 23z'%3E%3C/path%3E%3C/svg%3E%0A");
    margin-top: -3px
}

.angle-right-icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16px' viewBox='0 0 608 1280' width='16px'%3E%3Cg transform='translate(608 0) scale(-1 1)'%3E%3Cpath fill='%23212529' d='M595 288q0 13-10 23L192 704l393 393q10 10 10 23t-10 23l-50 50q-10 10-23 10t-23-10L23 727q-10-10-10-23t10-23l466-466q10-10 23-10t23 10l50 50q10 10 10 23z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E")
}

body[data-theme="light"] .left-icon.black:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='transform:rotate(180deg)' width='16' height='16' viewBox='0 0 32 32'%3E%3Cpath fill='%23777' d='M18.6 2.6l-2.8 2.8 8.6 8.6h-24.4v4h24.4l-8.6 8.6 2.8 2.8 13.4-13.4-13.4-13.4z'%3E%3C/path%3E%3C/svg%3E")
}

.left-icon.white:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='transform:rotate(180deg)' width='16' height='16' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M18.6 2.6l-2.8 2.8 8.6 8.6h-24.4v4h24.4l-8.6 8.6 2.8 2.8 13.4-13.4-13.4-13.4z'%3E%3C/path%3E%3C/svg%3E")
}

.scroll--top:before {
    width: 17px;
    height: 17px
}

body[data-theme="light"] .scroll--top:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 32 32'%3E%3Cpath fill='%23231F20' d='M2.6 13.4l2.8 2.8 8.6-8.6v24.4h4v-24.4l8.6 8.6 2.8-2.8-13.4-13.4-13.4 13.4z'%3E%3C/path%3E%3C/svg%3E")
}

.zalo-icon:before {
    background: url("https://cdn.jsdelivr.net/gh/vietblogdao/images/icon-zalo.svg") no-repeat center;
    background-size: 100%;
    content: ""
}

.icon-play {
    background: url(https://cdn.jsdelivr.net/gh/vietblogdao/images/icon-player.svg) no-repeat center center !important;
    width: 64px;
    height: 64px;
    border: 2px solid #fff;
    border-radius: 50%;
    display: block;
    position: absolute;
    z-index: 99;
    opacity: 0.7;
    cursor: pointer;
    transition: all 0.2s 0.2s linear;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

/* ]]> */


/* <![CDATA[ */
:root {
    --primary-color: #006BA0;
    --primary-background-color: #006BA0
}

.widget:after {
    content: "";
    display: table;
    clear: both
}

* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    text-rendering: geometricPrecision
}

body,
input,
button,
textarea,
pre,
form {
    font-family: Roboto, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

body {
    min-height: 100vh;
    margin: 0;
    padding: 0;
    overflow: hidden
}

body:not(.overflow) {
    overflow-y: auto
}

svg {
    vertical-align: text-bottom;
    fill: hsl(0, 0%, 53.3%)
}

ol,
ul {
    margin: 0;
    padding: 0
}

.mb-15 {
    margin-bottom: 15px
}

.mb-20 {
    margin-bottom: 20px
}

.pt-20 {
    padding-top: 20px
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    cursor: default
}

h3.title {
    margin-bottom: 15px;
    font-size: 1.1rem;
    font-weight: normal
}

body[data-theme="light"] {
    background: #fff;
    color: #1c1e21
}

body[data-theme="light"] a {
    color: #1c1e21
}

a,
a:hover {
    text-decoration: none
}

iframe,
img {
    border: none
}

iframe {
    width: 100%
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle
}

iframe[frameborder="0"] {
    background-color: transparent !important
}

[data-view-type=mobile] a:hover {
    cursor: default;
    outline: none
}

[data-view-type=desktop] .has-hover:hover {
    cursor: pointer
}

body[data-theme="light"] img.logo_light {
    display: none
}

.video-container,
.tr-video {
    position: relative;
    padding-bottom: 56.25%
}

.video-container iframe,
.tr-video video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.tr-video video:focus {
    outline: none !important
}

.overlay {
    background: rgba(0, 0, 0, 0.502);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 20;
    transition: opacity .05s cubic-bezier(0.4, 0.0, 0.2, 1);
    opacity: 1
}

.scroll--top {
    position: fixed;
    bottom: 16px;
    right: 16px;
    width: 40px;
    height: 40px;
    z-index: 20;
    border-radius: 50%
}

.scroll--top.show {
    opacity: 1;
    visibility: visible;
    transition: opacity 1s cubic-bezier(0.4, 0.0, 0.2, 1)
}

.scroll--top.hide {
    opacity: 0;
    visibility: hidden;
    transition: visibility 0.3s linear, opacity 0.3s linear
}

body[data-theme="light"] .scroll--top {
    background: #fff;
    border: 1px solid #888
}

.scroll--top:focus {
    outline: none !important
}

[data-view-type="desktop"] .scroll--top:focus {
    background: rgba(245, 245, 245, 1)
}

.table {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    position: relative;
    border-collapse: collapse
}

.table td {
    padding: 5px
}

.table-overflow {
    overflow-x: auto
}

table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0
}

.flex {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex
}

.align-center {
    -webkit-align-items: center;
    align-items: center
}

.flex-align {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.flex-center {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center
}

.flex-row {
    -js-display: flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

.flex-grow {
    -ms-flex: 1;
    flex: 1;
    -ms-flex-negative: 1;
    -ms-flex-preferred-size: auto !important
}

.flex-flow {
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

.flex-left {
    margin-right: auto
}

.flex-right {
    margin-left: auto
}

.hidden,
span.blog-admin,
[data-allow-comments="false"] a.comment-reply,
.modal--target {
    display: none
}

.relative {
    position: relative
}

.absolute {
    position: absolute
}

.fixed {
    position: fixed
}

.left {
    left: 0
}

.right {
    right: 0
}

.float-left {
    float: left
}

.float-right {
    float: right
}

.w100 {
    width: 100%
}

main.main>.widget:not(.has-banner),
aside.sidebar>.widget:not(.has-banner) {
    float: left;
    width: 100%
}

aside.sidebar>.has-banner.desktop .banner-300 {
    height: 600px
}

.has-banner:not(.banner-post).qc-300 {
    margin-bottom: 15px
}

main.main>.has-banner {
    float: left;
    width: 100%
}

.has-banner.qc-300 .banner-300 {
    height: 200px
}

.banner-mobile {
    background: #f7f7f7;
    margin: 0 -15px 20px -15px;
    position: relative
}

.banner[data-size="300x250"] {
    width: 300px;
    height: 250px;
    margin: 20px 0;
    background: #f0f0f0
}

.overflow {
    overflow: hidden
}

.overflow-x {
    overflow-x: auto
}

.overflow-y {
    overflow-y: auto
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.text-center {
    text-align: center
}

.container {
    max-width: 1100px;
    margin: 0 auto
}

.primary-background-color {
    background: #0088cc;
    background: var(--primary-background-color)
}

.header {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 999
}

.header:not(.primary-background-color) {
    border-bottom: solid 1px
}

.header>div {
    min-height: 50px
}

body[data-theme="light"] .header:not(.primary-background-color) {
    background: #fff;
    border-bottom-color: #ddd
}

.header.primary-background-color {
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .1)
}

.header-widget h1,
.header-widget h2 {
    display: none !important
}

.header-widget .has-title {
    font-size: 1.4rem;
    font-weight: 500;
    color: #fff
}

.header-widget .has-title>span {
    font-weight: 600;
    font-size: 50%
}

.header-widget a:hover {
    text-decoration: none !important
}

[data-view-type=desktop] .header-widget a:focus {
    outline: none !important
}

.header-widget .has-img {
    border-radius: 50%;
    height: 40px;
    width: 40px
}

.header-widget .has-img>img {
    width: 28px;
    height: 28px;
    vertical-align: middle;
    border-radius: 50%
}

.header-widget .has-img:hover {
    background: rgba(60, 64, 67, 0.08)
}

.header-widget .has-img:focus,
.header-widget .has-img:active {
    background: rgba(95, 99, 104, 0.24)
}

.header-widget .has-img:focus {
    background: rgba(95, 99, 104, 0.24);
    outline: none
}

.category-menu>ul {
    float: left;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: visible
}

.category-menu>ul>li {
    display: block !important;
    margin-right: 0;
    margin-bottom: 20px;
    line-height: 26px;
    position: relative
}

@media(min-width:1024px) {
    .category-menu>ul>li {
        width: calc(100%/6)
    }
}

@media(max-width:1023px) and (min-width:861px) {
    .category-menu>ul>li {
        width: calc(100%/4)
    }
}

@media(max-width:860px) and (min-width:641px) {
    .category-menu>ul>li {
        width: calc(100%/3)
    }
}

@media(max-width:640px) {
    .category-menu>ul>li {
        width: calc(100%/2)
    }
}

.category-menu>ul>li .subcate,
.category-menu li.parent a {
    display: block
}

.footer-top .category-menu li.parent>a {
    font-size: 110%
}

.category-menu>ul>li>a {
    color: #ddd
}

.category-menu>ul>li .subcate a {
    font-size: 90%;
    font-weight: 400;
    line-height: 32px;
    color: #c7c7c7
}

.menu .category-menu>ul>li:after {
    content: '';
    position: absolute;
    width: 4px;
    height: 12px;
    left: 0;
    top: 7px;
    -webkit-transform: skew(-20deg);
    -khtml-transform: skew(-20deg);
    transform: skew(-20deg);
    background: #dd3333
}

.header+div {
    transition: padding-top .3s cubic-bezier(0.4, 0.0, 0.2, 1)
}

.header+div[expanded="true"] {
    padding-top: 50px
}

.header+div.refresh>* {
    opacity: 0;
    transition: opacity .3s ease-in-out
}

.section-top>div,
.section-bottom>div {
    float: left;
    width: 100%;
    position: relative
}

.section-top>.Label {
    white-space: nowrap
}

.section-top>div:not(#section-publish):not(.section-multimedia),
.section-bottom>div {
    overflow: hidden
}

.site-header {
    position: relative;
    z-index: 9
}

body[data-theme="light"] .site-header {
    background: #f7f7f7
}

.site-header>div {
    margin-top: auto;
    margin-bottom: auto
}

.web-search {
    transition: width .3s;
    overflow: hidden;
    position: absolute;
    right: 0;
    z-index: 20
}

[expanded="true"] .web-search {
    width: 320px
}

[expanded="false"] .web-search {
    width: 0
}

.web-search>div {
    line-height: 34px;
    position: relative;
    width: 100%
}

.web-search form {
    width: 100%;
    position: relative
}

.web-search input[type=search] {
    -webkit-appearance: none;
    line-height: 34px;
    font-size: 15px;
    padding: 0 0 0 45px;
    width: 100%;
    border: 1px solid;
    border-radius: 26px;
    outline: none
}

body[data-theme="light"] .web-search input[type=search] {
    background: #f5f8fa;
    border-color: #e6ecf0
}

.web-search input[type=search]::-webkit-search-cancel-button {
    display: none
}

.web-search button {
    width: 48px;
    height: 100%;
    border: 0;
    background: transparent;
    position: absolute;
    top: 0;
    padding: 0
}

.web-search button[type=submit] {
    left: 0
}

.web-search button[type=reset] {
    right: 0
}

.web-search button:focus,
.web-search input:focus {
    outline: none !important
}

.page-list ul {
    list-style: none
}

.header-icon {
    min-height: 50px
}

.header-icon>li {
    position: relative
}

.header-icon>li>a {
    font-weight: 500
}

.header.primary-background-color .header-icon>li>a {
    color: #fff
}

.header-icon>li.has-icon>a {
    justify-content: center;
    height: 40px;
    width: 40px;
    position: relative
}

.header-icon>li.has-icon>a:hover,
.header-icon>li.has-icon>a:focus,
.header-icon>li.has-icon>a:active {
    outline: none
}

.page-list .widget-content {
    min-width: 220px;
    position: absolute;
    z-index: 20;
    top: 50px;
    right: 0;
    border-radius: 3px;
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    transform: scale(0, 0);
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -ms-transition: all 0.25s;
    -o-transition: all 0.25s;
    transition: all 0.25s;
    transform-origin: center center;
    box-shadow: rgba(0, 0, 0, 0.3) 0 0 6px, rgba(0, 0, 0, 0.15) 0 1px 6px
}

body[data-theme="light"] .page-list .widget-content {
    background: #fff
}

.page-list .widget-content.opened {
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    transform: scale(1, 1)
}

.page-list .widget-content a {
    padding: 0 20px;
    line-height: 40px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.page-list .widget-content a:hover {
    text-decoration: none !important
}

[data-view-type=desktop] body[data-theme="light"] .page-list .widget-content a:hover {
    background: #fff9e7
}


.row {
    margin: 0 -10px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

.breadcrumbs {
    white-space: nowrap;
    overflow: hidden;
    overflow-x: auto
}

.breadcrumbs>ul {
    margin: 0 0 15px 0;
    list-style: none
}

.breadcrumbs>ul>li {
    position: relative;
    line-height: 32px;
    text-transform: uppercase
}

.breadcrumbs>ul>li+li {
    padding-left: 20px
}

.breadcrumbs>ul * {
    display: inline-block
}

.breadcrumbs h3,
.breadcrumbs h1 {
    font-size: 1rem;
    font-weight: 500
}

.breadcrumbs>ul>li+li:before {
    content: '';
    width: 7px;
    height: 7px;
    border: 1px solid;
    border-top-color: transparent;
    border-left-color: transparent;
    position: absolute;
    box-sizing: border-box;
    overflow: hidden;
    left: 4px;
    top: 13px;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transition: all .2s ease-out
}

[data-page-type="post"] .breadcrumbs>ul>li:first-child {
    display: none
}

[data-page-type="post"] .breadcrumbs>ul>li:nth-of-type(2):before {
    content: unset
}

[data-page-type="post"] .breadcrumbs>ul>li:nth-of-type(2) {
    padding-left: 0
}

body[data-theme="light"] .breadcrumbs>ul>li+li:before {
    border-right-color: #1c1e21;
    border-bottom-color: #1c1e21
}


.widget-title {
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid;
    line-height: normal
}

body[data-theme="light"] .widget-title {
    border-color: rgba(0, 0, 0, 0.12)
}

.widget-title>h3 {
    font-size: 1rem;
    font-weight: normal;
    display: inline;
    border-bottom: 2px solid;
    border-bottom-color: #0088cc;
    border-bottom-color: var(--primary-background-color);
    padding: 15px 0 10px 0
}

.widget-title>h3+a {
    float: right;
    position: relative;
    padding-right: 10px
}

.widget-title>h3+a:after {
    content: '';
    width: 9px;
    height: 9px;
    border: 1px solid;
    border-top-color: transparent;
    border-left-color: transparent;
    position: absolute;
    box-sizing: border-box;
    overflow: hidden;
    right: 0;
    top: 6px;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transition: all .2s ease-out
}

body[data-theme="light"] .widget-title>h3+a:after {
    border-right-color: #1c1e21;
    border-bottom-color: #1c1e21
}

.topic-content {
    overflow: hidden
}

.topic-title>h3 {
    display: inline-block;
    margin-right: 10px;
    font-size: 1rem;
    font-weight: normal;
    color: #757575
}

.topic-title:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 32 32'%3E%3Cpath fill='%23757575' d='M24 6v3.2h2.56l-8.96 8.96-6.4-6.4-11.2 11.2 2.24 2.24 8.96-8.96 6.4 6.4 11.2-11.2v2.56h3.2v-8h-8z'%3E%3C/path%3E%3C/svg%3E");
    background-size: 100%;
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    opacity: .7
}

.topic-content>span:not(:last-child) {
    margin-right: 10px
}

.topic-content a+span {
    font-size: 90%
}

.topic-content a+span:before {
    content: '('
}

.topic-content a+span:after {
    content: ')'
}

.post>div {
    position: relative
}

[data-layout="blog"],
[data-layout="list"],
.post>div {
    float: left;
    width: 100%
}

[data-layout="grid"] {
    margin: 0 -7.5px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

[data-layout="blog"] .post,
[data-layout="list"] .post,
[data-layout="blog"] .post_thumb,
[data-layout="grid"] .post_thumb,
[data-layout="blog"] .post_body,
[data-layout="grid"] .post_body {
    width: 100%
}

body[data-theme="light"] [data-box-shadow="false"][data-layout="list"] .post {
    border-bottom: 1px solid rgba(12, 28, 39, .15)
}

@media(min-width:481px) {
    [data-layout="list"] .post_thumb {
        width: 33%
    }

    [data-layout="list"] .post_body {
        width: 67%
    }

    [data-box-shadow="false"][data-layout="list"] .post_body {
        padding-left: 15px
    }

    [data-box-shadow="false"][data-layout="list"] .post {
        padding-bottom: 15px;
        margin-bottom: 15px
    }
}

@media(min-width:861px) {
    .sidebar [data-layout="list"] .post_thumb {
        width: 38%
    }

    .sidebar [data-layout="list"] .post_body {
        width: 62%
    }

    .sidebar [data-box-shadow="false"][data-layout="list"] .post_body {
        padding-left: 13px
    }
}

[data-box-shadow="true"][data-layout="blog"] .post,
[data-box-shadow="true"][data-layout="list"] .post {
    margin-bottom: 15px
}

.sidebar [data-box-shadow="false"][data-layout="list"] .post:last-child,
.RecentPosts [data-box-shadow="false"][data-layout="list"] .post:last-child {
    margin: 0;
    padding: 0;
    border: 0
}

[data-page-type="post"] .blog-pager {
    margin-top: 15px;
    padding-top: 15px
}

[data-page-type="post"] body[data-theme="light"] .blog-pager {
    border-top: 1px solid rgba(12, 28, 39, .15)
}

[data-layout="grid"] .post {
    padding: 0 7.5px 15px 7.5px
}

@media(min-width:961px) {
    [data-layout="grid"][data-column="4"] .post {
        width: 25%
    }

    [data-layout="grid"][data-column="5"] .post {
        width: 20%
    }
}

@media(max-width:960px) and (max-width:769px) {

    [data-layout="grid"][data-column="4"] .post,
    [data-layout="grid"][data-column="5"] .post {
        width: 33.333%
    }
}

@media(min-width:360px) {
    [data-layout="grid"][data-column="2"] .post {
        width: 50%
    }
}

@media(min-width:768px) {
    [data-layout="grid"][data-column="3"] .post {
        width: 33.33%
    }
}

@media(max-width:767px) and (min-width:360px) {

    [data-layout="grid"][data-column="3"] .post,
    [data-layout="grid"][data-column="4"] .post,
    [data-layout="grid"][data-column="5"].post {
        width: 50%
    }
}

@media(max-width:359px) {

    [data-layout="grid"][data-column="2"] .post,
    [data-layout="grid"][data-column="3"] .post,
    [data-layout="grid"][data-coumn="4"] .post,
    [data-layout="grid"][data-coumn="5"] .post {
        width: 100%
    }
}

[data-box-shadow="true"] .post>div {
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2)
}

[data-box-shadow="false"] .post_thumb {
    border-radius: 4px
}

[data-layout="grid"][data-box-shadow="false"] .post_thumb {
    margin-bottom: 15px
}

.post,
.post_thumb,
.post_body {
    float: left
}

.post_thumb {
    position: relative;
    overflow: hidden
}

a.img {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
    color: inherit
}

a.no--img {
    border: 1px solid #dee2e6
}

[data-layout="blog"] a.img,
[data-layout="grid"] a.img {
    padding-bottom: 56.25%
}

[data-layout="list"] a.img {
    padding-bottom: 66.67%
}

a.has--img>img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-animation: fadeInImages .3s ease;
    animation: fadeInImages .3s ease
}

a.img::after {
    background: #e9ecef;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

a.img:not(.no--img)::after {
    content: ''
}

a.no--img::after {
    content: 'Không có ảnh';
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    font-size: 11px;
    color: #212529
}

[data-view-type=desktop] [data-transform="true"] a.img {
    transition: transform .5s ease-out .1s
}

[data-view-type=desktop] [data-transform="true"] a.img:hover {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05)
}

[data-layout="grid"][data-box-shadow="true"] .post_body {
    padding: 15px
}

body[data-theme="light"] [data-layout="grid"][data-box-shadow="true"] .post_body {
    background: #fff
}

[data-box-shadow="true"][data-layout="blog"] .post_body,
[data-box-shadow="true"][data-layout="list"] .post_body {
    padding: 15px
}

[data-box-shadow="false"][data-layout="blog"] .post_body {
    padding: 15px 0
}

.post_title {
    font-weight: 500
}

[data-layout="blog"] .post_title>a {
    font-size: 160%
}

[data-layout="list"] .post_title>a,
[data-layout="grid"] .post_title>a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

[data-layout="grid"] .post_title>a {
    line-height: 1.4
}

[data-box-shadow="false"][data-layout="list"] .post_title>a,
[data-layout="grid"] .post_title>a {
    -webkit-line-clamp: 2
}

[data-box-shadow="true"][data-layout="list"] .post_title>a {
    -webkit-line-clamp: 3
}

[data-box-shadow="false"][data-layout="list"] .post_title>a {
    font-size: 140%
}

[data-box-shadow="true"][data-layout="list"] .post_title>a,
[data-layout="grid"][data-column="2"] .post_title>a {
    font-size: 130%
}

[data-layout="grid"][data-column="3"] .post_title>a {
    font-size: 120%
}

[data-view-type="desktop"] .post_title a:hover,
[data-view-type="desktop"] .data-item-title>a:hover,
[data-view-type="desktop"] .post_title a:focus,
[data-view-type="desktop"] .data-item-title>a:focus,
[data-view-type="desktop"] .post_title a:active,
[data-view-type="desktop"] .data-item-title>a:active {
    color: #08c;
    color: var(--primary-color);
    text-decoration: none !important
}

.post_meta {
    line-height: 34px;
    white-space: nowrap
}

.post_meta * {
    font-size: 85%;
    text-transform: uppercase
}

.post_meta>.post_label>*,
.post_meta>.post_date>* {
    display: inline-block
}

.post_meta>.post_label,
.post_meta>.post_date {
    margin-right: 8px
}

.comment-icon:before,
.share-icon:before {
    width: 14px;
    height: 14px
}

.comment-icon:after {
    font-size: 11px;
    content: attr(data-num-comments)
}

.comment-icon,
.share-icon {
    width: 30px;
    height: 30px;
    border-radius: 50%
}

.comment-icon:hover,
.share-icon:hover {
    background: rgba(60, 64, 67, 0.08)
}

.comment-icon[aria-pressed=true],
.comment-icon:focus,
.comment-icon:active,
.share-icon[aria-pressed=true],
.share-icon:focus,
.share-icon:active {
    box-shadow: #0088cc 0px 0px 0px 2px
}

.comment-icon:focus,
.share-icon:focus {
    outline: none !important
}

.post_snippet>* {
    display: inline;
    font-size: 85%;
    line-height: 1.5
}

body[data-theme="light"] .post_snippet>* {
    color: #777
}

[data-layout="list"] .post_snippet,
[data-layout="grid"] .post_snippet {
    max-height: 65px;
    overflow: hidden
}

[data-box-shadow="true"][data-layout="list"] .post_snippet {
    display: none
}

@-webkit-keyframes fadeInImages {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fadeInImages {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.blog-pager {
    line-height: 0
}

.blog-pager * {
    display: inline-block
}

.sidebar .Label li {
    list-style: none;
    line-height: 34px
}

.sidebar .Label li>* {
    display: inline-block
}

.sidebar .Label .cloud-label-widget-content {
    display: -webkit-box
}

.sidebar .Label .label-size {
    border: 1px solid #ddd;
    padding: 0 8px;
    margin: 0 5px 5px 0;
    border-radius: 3px;
    display: inline-block;
    line-height: 26px;
    font-size: 90%
}

.sidebar .Label .label-count {
    font-size: 80%;
    cursor: default
}

.sidebar .Label a {
    color: #1c1e21
}

.sidebar .Label .label-count:before {
    content: "("
}

.sidebar .Label .label-count:after {
    content: ")"
}

.footer {
    position: relative;
    font-size: 95%;
    line-height: 1.8
}

.footer {
    background: #141329;
    color: #ddd
}

.footer .widget {
    float: left
}

.footer ul {
    list-style: none
}

.footer-bar {
    background: #212833;
    color: #ddd
}

.blog-search>div {
    width: 100%
}

.blog-search form {
    position: relative;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.12);
    -webkit-border-radius: 21px;
    border-radius: 21px
}

.blog-search form {
    background: #18191a
}

.blog-search input {
    color: #ddd
}

.nav>li>a {
    display: inline-block;
    position: relative;
    font-weight: 600;
    text-transform: uppercase;
    color: #ddd
}

.nav>li:not(:first-child):not(:last-child)>a {
    padding: 0 12px
}

.nav>li:first-child>a {
    padding-right: 10px
}

.nav>li:last-child>a {
    padding-left: 10px
}

.top-nav .nav>li>a {
    line-height: 30px
}

.blog-search input[type=search] {
    background: transparent;
    width: 100%;
    line-height: 30px;
    font-weight: 500;
    padding-left: 40px;
    border: 0
}

.blog-search input[type=search]::-webkit-search-cancel-button {
    display: none
}

.blog-search button {
    width: 40px;
    height: 100%;
    border: 0;
    background: transparent;
    position: absolute;
    top: 0;
    padding: 0
}

.blog-search button:focus,
.blog-search input:focus {
    outline: none !important
}

.footer-bottom {
    padding: 15px 0;
    border-top: 1px solid #b0b3b8
}

.footer-bottom li {
    padding: 0 12px;
    display: inline-block;
    font-size: 85%;
    font-weight: 500
}

.footer-bottom li>a {
    color: #ddd
}

body[data-theme="light"] .has-banner {
    background: #fafafa
}

.banner-article {
    float: left;
    width: 100%;
    padding: 15px;
    margin: 20px 0
}

.banner-full-width {
    min-height: 200px
}

.box-shadow {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px;
    will-change: transform
}

.banner-300 {
    width: 300px;
    margin: 0 auto
}

.has-banner a,
.banner-post a {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    color: inherit
}

.has-banner img,
.banner-post img {
    width: 100%;
    height: auto
}

.banner-body {
    position: relative;
    top: 20px
}

.banner-body:after {
    content: "Kéo xuống để xem tiếp sau quảng cáo";
    font-size: 12px;
    color: #ccc;
    text-transform: uppercase;
    text-align: center;
    position: absolute;
    top: -35px;
    left: 0;
    right: 0
}

.banner-content {
    width: 100%;
    margin: 20px 0
}

.banner-position {
    position: absolute;
    width: 100%
}

.banner-display {
    display: inline-block;
    position: fixed;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0)
}

.banner-iframe {
    display: block;
    position: relative
}

.main-container,
.section-wrapper {
    max-width: 1920px;
    margin: 0 auto;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

.has-banner-widget>div {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 15px
}

.has-banner-widget>div>a {
    color: inherit
}

.has-banner-widget img {
    max-width: 100%;
    height: auto
}

.dd-menu {
    list-style: none
}

.dd-menu>li {
    line-height: 40px
}

.dd-menu a {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    color: #1c1e21 !important
}

.modals-dialog {
    box-shadow: 0 1px 3px 0 rgba(60, 64, 67, 0.302), 0 4px 8px 3px rgba(60, 64, 67, 0.149);
    -webkit-font-smoothing: antialiased;
    letter-spacing: .2px;
    -webkit-align-items: center;
    align-items: center;
    background-color: #202124;
    border: none;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    bottom: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    left: 0;
    margin: 20px;
    max-width: 640px;
    min-height: 50px;
    padding: 8px 15px;
    position: fixed;
    right: auto;
    text-align: left;
    top: auto;
    white-space: normal;
    z-index: 10000
}

.modals-dialog-content {
    font-size: 15px;
    font-weight: 400;
    color: #fff
}

.modals-dialog-buttons {
    vertical-align: middle;
    margin-left: 15px
}

[data-view-type=desktop] .modals-dialog-buttons {
    cursor: pointer
}

.theme-button {
    position: relative;
    overflow: hidden;
    color: #fff !important;
    -webkit-appearance: none;
    font-size: 14px;
    letter-spacing: .5px;
    font-weight: 400;
    border: 0;
    text-decoration: none;
    border-radius: 4px;
    transition: opacity .15s
}

.theme-button:not(.zalo):not(.back) {
    min-width: 80px;
    height: 34px;
    line-height: 34px
}

.theme-button:not(.hide):not(.zalo):not(.back) {
    display: inline-block
}

.theme-button.hide {
    display: none
}

.theme-button:not(.load-more):not(.zalo):not(.back) {
    padding: 0 10px;
    text-transform: uppercase
}

.theme-button.load-more {
    padding: 0 25px 0 10px
}

.theme-button.blue:not(:focus):not(:active) {
    background-color: #0088cc
}

.theme-button.green {
    background-color: #008000
}

.theme-button.purple {
    background-color: #855085
}

.theme-button.orange {
    background-color: #ff7518
}

.theme-button.red {
    background-color: #d61f11
}

.theme-button.back,
.theme-button.zalo {
    padding: 0 10px;
    height: 28px;
    line-height: 28px;
    vertical-align: bottom
}

.theme-button.back {
    min-width: 80px;
    background: #0088cc;
    border-color: #0088cc
}

.theme-button.zalo {
    min-width: 60px;
    background: #03a5fa;
    border-color: #00aeef
}

.theme-button.zalo:before {
    margin-right: 4px
}

[data-view-type="desktop"] .theme-button:hover {
    cursor: pointer
}

.theme-button:hover {
    text-decoration: none !important
}

.theme-button.disabled {
    pointer-events: none;
    opacity: .7
}

.theme-button.blue:active,
.theme-button.blue:focus {
    background-color: #577fbc
}

.load-more:after {
    position: absolute;
    top: 11px;
    right: 10px;
    content: "";
    width: 8px;
    height: 8px;
    overflow: hidden;
    border: 1px solid #fff;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    box-sizing: border-box;
    transition: all .2s ease-out;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.ellipsis {
    position: relative;
    width: 64px;
    height: 20px
}

.ellipsis div {
    position: absolute;
    top: 5px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #0088cc;
    background: var(--primary-background-color);
    -webkit-animation-timing-function: cubic-bezier(0, 1, 1, 0);
    animation-timing-function: cubic-bezier(0, 1, 1, 0)
}

.ellipsis div:nth-child(1) {
    left: 6px;
    -webkit-animation: lds-ellipsis1 0.6s infinite;
    animation: lds-ellipsis1 0.6s infinite
}

.ellipsis div:nth-child(2) {
    left: 6px;
    -webkit-animation: lds-ellipsis2 0.6s infinite;
    animation: lds-ellipsis2 0.6s infinite
}

.ellipsis div:nth-child(3) {
    left: 26px;
    -webkit-animation: lds-ellipsis2 0.6s infinite;
    animation: lds-ellipsis2 0.6s infinite
}

.ellipsis div:nth-child(4) {
    left: 45px;
    -webkit-animation: lds-ellipsis3 0.6s infinite;
    animation: lds-ellipsis3 0.6s infinite
}

.loading-wrapper {
    float: left;
    width: 100%;
    position: relative;
    overflow: hidden
}

@media(min-width:769px) {
    .form-group.half {
        width: 50%
    }
}

.processing,
.success {
    position: relative
}

.processing:before,
.processing:after,
.success:before,
.success:after {
    position: absolute;
    z-index: 99;
    pointer-events: none
}

.processing:before {
    top: calc(50% - 15px);
    left: calc(50% - 15px);
    content: "";
    border: 2px solid transparent;
    border-left: 2px solid #fff;
    border-top: 3px solid #03a9f4;
    border-right: 3px solid #03a9f4;
    border-bottom: 3px solid #03a9f4;
    animation: spin .6s infinite linear;
    border-radius: 50%;
    width: 30px;
    height: 30px
}

.success:before {
    content: url(//cdn.jsdelivr.net/gh/vietblogdao/images/icon-check.png)
}

.processing:after,
.success:after {
    margin-top: 35px;
    color: #fff
}

.processing:after,
.success:before,
.success:after {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.processing:after {
    content: "Đang gửi..."
}

.success:after {
    content: "Đã gửi thành công!"
}

.background-overlay {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 8;
    overflow: hidden;
    position: absolute;
    background: #0b0b0b;
    opacity: .6;
    transition: opacity .25s
}

.modal--confirm {
    background-color: rgba(0, 0, 0, .75);
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 5000;
    opacity: 0;
    transition: opacity .15s cubic-bezier(0.4, 0.0, 0.2, 1) .15s
}

.modal--confirm.show {
    transition: opacity .05s cubic-bezier(0.4, 0.0, 0.2, 1);
    opacity: 1
}

.modal--dialog {
    -webkit-box-align: center;
    box-align: center;
    align-items: center;
    display: flex;
    -webkit-box-orient: vertical;
    box-orient: vertical;
    flex-direction: column;
    bottom: 0;
    left: 0;
    padding: 0 5%;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    transform: scale(0, 0);
    transform-origin: center center;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s
}

.modal--confirm.show .modal--dialog {
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    transform: scale(1, 1)
}

.modal--confirm form {
    margin: 0
}

.modal--content {
    background: #fff;
    -webkit-box-align: stretch;
    align-items: stretch;
    display: flex;
    -webkit-box-orient: vertical;
    flex-direction: column;
    transition: transform .225s cubic-bezier(0.0, 0.0, 0.2, 1);
    position: relative;
    border-radius: 3px;
    box-shadow: 0 2px 26px rgba(0, 0, 0, .3), 0 0 0 1px rgba(0, 0, 0, .1);
    overflow: hidden;
    flex-shrink: 1;
    font-size: inherit;
    color: currentColor
}

body:not(.overflow) .modal--content {
    max-width: 600px;
    max-height: 100%
}

body.overflow .modal--icon {
    width: 48px;
    height: 48px
}

@media(min-width:551px) {
    body:not(.overflow) .modal--content {
        min-width: 510px
    }
}

@media(min-width:861px) {
    body.overflow .modal--content {
        min-width: 840px;
        max-width: 700px
    }
}

@media(max-width:860px) {
    body.overflow .modal--content {
        min-width: calc(100% - 20px)
    }
}

@media(max-width:550px) {
    body:not(.overflow) .modal--content {
        width: 100%
    }
}

._2em {
    display: block;
    height: 2em;
    flex-grow: 1
}

._3em {
    display: block;
    height: 3em;
    flex-grow: 1
}

._cs {
    padding: 10px 0 0 22px
}

.modal--header {
    background: #f5f6f7;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
    padding: 10px 12px;
    border-bottom: 1px solid #e5e5e5;
    border-radius: 3px 3px 0 0;
    color: currentColor;
    font-weight: bolder;
    line-height: normal
}

.modal--header ._mht {
    margin-right: auto;
    color: #1c1e21 !important
}

.modal--header ._mhc {
    margin-left: auto
}

.modal--icon {
    display: flex;
    align-items: center;
    justify-content: center
}

body:not(.overflow) .modal--icon {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    border: 1px solid;
    border-color: transparent
}

body:not(.overflow) .modal--icon:hover,
body:not(.overflow) .modal--icon:focus {
    border-color: #1c1e21
}

body:not(.overflow) .modal--icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' tabindex='0' viewBox='0 0 24 24' width='24px'%3E%3Cpath fill='%23707070' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z'%3E%3C/path%3E%3C/svg%3E");
    width: 24px;
    height: 24px
}

body.overflow .modal--icon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' height='24' viewBox='0 0 48 48' width='24'%3E%3Cpath clip-rule='evenodd' d='M41.8 9.8L27.5 24l14.2 14.2c.6.6.6 1.5 0 2.1l-1.4 1.4c-.6.6-1.5.6-2.1 0L24 27.5 9.8 41.8c-.6.6-1.5.6-2.1 0l-1.4-1.4c-.6-.6-.6-1.5 0-2.1L20.5 24 6.2 9.8c-.6-.6-.6-1.5 0-2.1l1.4-1.4c.6-.6 1.5-.6 2.1 0L24 20.5 38.3 6.2c.6-.6 1.5-.6 2.1 0l1.4 1.4c.6.6.6 1.6 0 2.2z' fill-rule='evenodd'%3E%3C/path%3E%3C/svg%3E");
    width: 24px;
    height: 24px
}

.modal--icon.absolute {
    position: absolute;
    right: 0;
    z-index: 10
}

.modal--icon.has-border {
    border-radius: 4px;
    border: 1px solid;
    border-color: transparent
}

.modal--icon.has-border:hover,
.modal--icon.has-border:focus {
    border-color: #1c1e21
}

.modal--icon:focus {
    outline: none !important
}

.modal--body {
    background: #fff;
    overflow: hidden;
    overflow-y: auto
}

.modal--body:not(.has-product) {
    padding: 12px
}

.modal--body>div {
    line-height: 1.6rem
}

.modal--body>div:not(:last-child)>p {
    margin-bottom: 1rem
}

.modal--body input[type="radio"] {
    margin: 0 5px 0 0
}

.modal--footer {
    background: #fff;
    margin: 0 12px;
    padding: 12px 0;
    border-top: 1px solid #dddfe2;
    text-align: right
}

.modal--footer button {
    position: relative;
    display: inline-block;
    min-width: 50px;
    padding: 0 8px;
    border: 1px solid;
    white-space: nowrap;
    height: 26px;
    line-height: 26px;
    border-radius: 2px;
    -webkit-font-smoothing: antialiased;
    font: 600 14px Roboto, Arial, sans-serif;
    justify-content: center;
    text-align: center;
    text-shadow: none;
    vertical-align: middle;
    transition: 200ms cubic-bezier(.08, .52, .52, 1) background-color, 200ms cubic-bezier(.08, .52, .52, 1) box-shadow, 200ms cubic-bezier(.08, .52, .52, 1) transform
}

.modal--footer button:not(.primary) {
    background-color: #f5f6f7;
    border-color: #ccd0d5;
    color: currentColor
}

.modal--footer button[type="submit"],
.modal--footer button.primary {
    background-color: #4267b2;
    border-color: #4267b2;
    color: #fff
}

.modal--footer button+button {
    margin-left: 5px
}

.modal--footer button:hover,
.modal--footer button:focus {
    outline: none
}

.spinner,
.loading {
    position: relative
}

.loading {
    min-height: 400px
}

.spinner:before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    top: calc(50% - 15px);
    left: calc(50% - 15px);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 2px solid #999;
    border-right-color: transparent;
    animation: spinner .9s linear infinite;
    -webkit-animation: spinner .9s ease-in-out infinite
}

.loading:before {
    position: absolute;
    z-index: 99;
    pointer-events: none;
    top: calc(50% - 15px);
    left: calc(50% - 15px);
    content: '';
    border-top: 2px solid rgba(0, 0, 0, 0.1) !important;
    border-right: 2px solid rgba(0, 0, 0, 0.1) !important;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1) !important;
    opacity: .8;
    border-left: 2px solid #fff;
    animation: spin .6s infinite linear;
    border-radius: 50%;
    width: 30px;
    height: 30px
}

@keyframes spinner {
    to {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes spinner {
    to {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes lds-ellipsis1 {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes lds-ellipsis1 {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-key lds-ellipsis2 {
    100% {
        -webkit-transform: translate(19px, 0);
        transform: translate(19px, 0)
    }
}

@keyframes lds-ellipsis2 {
    100% {
        -webkit-transform: translate(19px, 0);
        transform: translate(19px, 0)
    }
}

@-webkit-keyframes lds-ellipsis3 {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    100% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
}

@keyframes lds-ellipsis3 {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    100% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
}

/* ]]> */


/* <![CDATA[ */
.widget-ticker {
    margin: 10px 0;
    font-size: 90%;
    position: relative
}

.widget-ticker:before {
    content: '';
    background: url(//cdn.jsdelivr.net/gh/vietblogdao/images/stat.svg) no-repeat;
    background-size: contain;
    width: 24px;
    height: 24px;
    position: absolute
}

.widget-ticker ul {
    margin-left: 41px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -ms-overflow-style: none;
    scrollbar-width: none
}

body[data-theme="light"] .widget-ticker li {
    background: #f0f0f0
}

body[data-theme="light"] .widget-ticker li:hover {
    background: -webkit-linear-gradient(135deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    -webkit-animation: bggradient 15s ease infinite;
    animation: bggradient 15s ease infinite
}

body[data-theme="light"] .widget-ticker li:hover::before,
body[data-theme="light"] .widget-ticker li>a:hover {
    color: #fff;
}

@-webkit-keyframes bggradient {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

@keyframes bggradient {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

.widget-ticker li {
    float: left;
    font-size: 90%;
    border-radius: 100px;
    padding: 0 8px 0 12px;
    height: 24px;
    line-height: 24px;
    list-style: none
}

.widget-ticker li:not(:first-child) {
    margin-left: 20px
}

body[data-theme="light"] .widget-ticker li::before {
    color: rgba(106, 106, 106, 0.51)
}

.widget-ticker li::before {
    content: '#';
    display: inline-block;
    font-size: 15px;
    margin-right: 4px
}

.widget-ticker li a {
    position: relative;
    left: -4px
}

.section-content {
    float: left;
    width: 100%;
    position: relative
}

.section-title {
    display: block;
    margin-bottom: 20px
}

.section-title h3,
.section-title h2 {
    font-size: 1.2em;
    font-weight: 600;
    display: inline-block;
    position: relative;
    text-transform: uppercase;
    padding: 0 15px 0 20px;
    margin: 6px 0 4px 0
}

.section-title h3:before,
.section-title h2:before {
    content: '';
    position: absolute;
    width: 5px;
    left: 5px;
    top: 3px;
    bottom: 4px;
    -webkit-transform: skew(-20deg);
    -khtml-transform: skew(-20deg);
    transform: skew(-20deg);
    background-color: #dd3333
}

.section-title ul {
    display: inline-block;
    margin-left: 30px;
    position: relative;
    top: -4px
}

.section-title li {
    display: inline-block
}

.section-title li:not(:last-child) {
    margin-right: 30px
}

.section-title li a {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase
}

.section-multimedia {
    margin-top: 30px
}

.section-multimedia:before {
    content: "";
    display: block;
    position: absolute;
    background: #ffde76
}

@media(min-width:1101px) {
    .section-multimedia:before {
        top: -30px;
        left: -30px;
        right: -30px;
        bottom: -30px
    }
}

@media(max-width:1100px) {
    .section-multimedia:before {
        top: -15px;
        left: -15px;
        right: -15px;
        bottom: -15px
    }
}

[data-content="newsfeatured"] .post,
[data-content="newstrending"] .post:last-child {
    padding-bottom: 0 !important;
    border-bottom: 0 !important
}

[data-content="newsfeatured"] .post_thumb {
    width: 100% !important
}

[data-content="newsfeatured"] .post_body {
    width: 100% !important;
    padding-left: 0 !important;
    padding-top: 15px
}

[data-content="newsfeatured"] .post_title a,
[data-content="popularposts"] .post_title a {
    display: block !important
}

[data-content="newsfeatured"] .post:nth-child(1) .post_title a {
    font-size: 140% !important
}

[data-content="newsfeatured"] .post:nth-child(n+2) .post_meta,
[data-content="newsfeatured"] .post:nth-child(n+2) .post_snippet,
[data-content="popularposts"] .post_meta,
[data-content="popularposts"] .post_snippet {
    display: none !important
}

[data-content="popularposts"] {
    margin: 0 !important
}

body[data-theme="light"] [data-content="popularposts"] .post {
    background: #f7f7f7
}

[data-content="popularposts"] .post {
    width: 100% !important;
    padding: 0 !important
}

[data-content="popularposts"] .post_body {
    padding: 0 10px 8px 10px
}

[data-content="multimedia"] .post_title a {
    display: block
}

[data-content="multimedia"] .post:first-child .post_thumb {
    margin-bottom: 0
}

[data-content="multimedia"] .post:first-child .post_title {
    position: absolute;
    bottom: 0;
    z-index: 2;
    padding: 20px 15% 24px 20px;
    width: 100%
}

[data-content="multimedia"] .post:first-child .post_title a {
    color: #fff;
    font-size: 160% !important;
    font-weight: 600;
    text-shadow: 0 1px 5px #000
}

.news-coverage {
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(12, 28, 39, .15)
}

.news-coverage .section-thumbnail,
.news-coverage .section-title,
.news-coverage .section-content {
    float: left
}

.news-coverage .section-thumbnail a {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: block
}

.news-coverage .section-title,
.news-coverage .section-content {
    padding-right: 0
}

.news-coverage .section-title {
    margin-bottom: 0
}

.news-coverage .section-title h3 {
    color: #006BA0;
    padding-left: 20px;
    font-size: 90%;
    margin-bottom: 8px
}

.news-coverage .section-title h3 a {
    color: inherit;
    margin-left: 0;
    line-height: 1.3
}

.news-coverage .article-item {
    float: left;
    position: relative;
    width: 100%;
    line-height: 1.4;
    font-size: 1.2rem
}

.news-coverage .article-item:first-child {
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: dashed 1px #ccc
}

.news-coverage .article-item:not(:first-child) {
    font-size: .9rem
}

.news-coverage .article-title {
    font-weight: bold;
    text-align: left
}

.news-coverage .article-title {
    font-size: 1em
}

.news-coverage .article-item:not(:first-child) .article-title {
    font-weight: normal
}

.news-coverage .article-title a:hover {
    color: #006BA0;
    color: var(--primary-color)
}

.news-coverage .article-item:first-child .article-title {
    line-height: 1.3
}

.news-coverage .article-item:not(:first-child) .article-title a {
    position: relative;
    display: block;
    padding-left: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.news-coverage .article-item:not(:first-child) .article-title a::before {
    content: '•';
    display: inline-block;
    position: absolute;
    left: 0
}

.news-coverage .article-meta {
    margin: 5px 0;
    font-size: 11px;
    line-height: 16px;
    text-transform: uppercase;
    color: #666;
    display: none
}

.news-coverage .article-item:first-child .article-meta {
    display: block
}

.news-coverage .article-meta>* {
    display: inline-block
}

.news-coverage .article-meta>.article-publish {
    margin-right: 5px
}

.news-coverage .article-publish {
    color: #aaa
}

.news-coverage .category-parent {
    display: inline-block
}

.news-coverage .article-item:first-child .article-summary {
    display: block;
    font-size: 80%;
    font-weight: normal;
    line-height: 1.46;
    color: #888;
    margin-top: 8px
}

.news-coverage .article-item:not(:first-child) .article-summary,
.news-coverage .article-item:first-child .article-summary>a {
    display: none
}

.box-category .data-item:first-of-type .data-item-thumb,
.box-category .data-item:first-of-type .data-item-body {
    width: 100% !important
}

.box-category .data-item:first-of-type .data-item-body {
    padding-left: 0 !important;
    padding-top: 15px
}

@media(max-width:860px) and (min-width:551px) {
    .layout-grid-4>.box-category {
        width: 50%;
        margin-top: 20px
    }
}

@media(max-width:860px) and (min-width:641px) {

    .layout-grid-4>.box-category:nth-child(1),
    .layout-grid-4>.box-category:nth-child(3),
    .layout-grid-4>.box-category:nth-child(5),
    .layout-grid-4>.box-category:nth-child(7) {
        padding-right: 15px
    }

    .layout-grid-4>.box-category:nth-child(2n) {
        padding-left: 15px
    }
}

[data-content="multimedia"] .post_meta,
[data-content="multimedia"] .post_snippet {
    display: none
}

.video-list {
    padding: 10px !important
}

body[data-theme="light"] .video-list {
    background: #f7f7f7
}

[data-view-type="desktop"] .video-list::-webkit-scrollbar {
    width: 4px
}

[data-view-type="desktop"] .video-list::-webkit-scrollbar-track {
    background: #f1f1f1
}

[data-view-type="desktop"] .video-list::-webkit-scrollbar-thumb {
    background: #888
}

[data-view-type="desktop"] .video-list::-webkit-scrollbar-thumb:hover {
    background: #555
}

[data-view-type="desktop"] .video-list .icon-play {
    display: none
}

[data-page-type="post"] main.main .PopularPosts .post:last-child {
    padding: 0;
    margin: 0;
    border: 0
}

.data-title {
    margin-bottom: 15px;
    line-height: normal
}

.data-title:not(.text-center) {
    padding-bottom: 10px;
    border-bottom: 2px solid
}

body[data-theme="light"] .data-title:not(.text-center) {
    border-color: rgba(0, 0, 0, 0.12)
}

.data-title.text-center>h3 {
    font-weight: 600;
    font-size: 145%;
    color: #00669c;
    letter-spacing: .25rem
}

.data-title>h3 {
    display: inline
}

.data-title.text-center>p {
    font-size: 95%
}

.data-title:not(.text-center)>h3 {
    border-bottom: 2px solid;
    border-bottom-color: #0088cc;
    border-bottom-color: var(--primary-background-color);
    padding: 15px 0 10px 0;
    font-weight: normal;
    font-size: 1rem
}

.data-title>h3+a {
    float: right;
    position: relative;
    padding-right: 10px
}

.data-title>h3+a:after {
    content: '';
    width: 9px;
    height: 9px;
    border: 1px solid;
    border-top-color: transparent;
    border-left-color: transparent;
    position: absolute;
    box-sizing: border-box;
    overflow: hidden;
    right: 0;
    top: 6px;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transition: all .2s ease-out
}

.mb-15 {
    margin-bottom: 15px
}

body[data-theme="light"] .data-title>h3+a:after {
    border-right-color: #1c1e21;
    border-bottom-color: #1c1e21
}

.data-show-more {
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid #ddd
}

.data-show-more>a {
    font-weight: 500;
    font-size: 95%;
    text-transform: uppercase
}

.has-background {
    padding: 15px
}

body[data-theme="light"] .has-background {
    background: #f7f7f7 !important
}

.data-item>div {
    position: relative
}

.data-item-thumb {
    position: relative;
    overflow: hidden;
    border-radius: 4px
}

[data-box-layout="blog"],
[data-box-layout="list"],
.data-item>div {
    float: left;
    width: 100%
}

[data-box-layout="grid"] {
    margin: 0 -7.5px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

[data-box-layout="blog"] .data-item,
[data-box-layout="list"] .data-item,
[data-box-layout="blog"] .data-item-thumb,
[data-box-layout="grid"] .data-item-thumb,
[data-box-layout="blog"] .data-item-body,
[data-box-layout="grid"] .data-item-body {
    width: 100%
}

[data-page-type="post"] .box-video {
    padding-bottom: 0 !important
}

.box-video [data-box-layout="grid"] .data-item:nth-of-type(1) {
    width: 100%
}

.box-video [data-box-layout="grid"] .data-item:nth-of-type(1) .data-item-title {
    font-size: 130%
}

body[data-theme="light"] [data-box-layout="list"] .data-item:not(:last-child) {
    border-bottom: 1px solid rgba(12, 28, 39, .15)
}

[data-box-layout="list"] .data-item:not(:last-child) {
    border-bottom: 1px solid #b0b3b8
}

.box-video [data-box-layout="grid"] .data-item:not(:first-child) .icon-play {
    width: 32px;
    height: 32px
}

.data-trending {
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px
}

body[data-theme="light"] .data-trending {
    background: rgba(245, 245, 245, 1)
}

[data-view-type="desktop"] .data-trending {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px
}

@media(min-width:481px) {
    .has-padding {
        padding: 15px 15px 15px 0
    }

    [data-content="newsfeatured"] .post:nth-child(n+2) .post_title a {
        font-size: 110% !important
    }

    [data-box-layout="list"] .data-item-thumb {
        width: 33%
    }

    [data-box-layout="list"] .data-item-body {
        width: 67%
    }

    [data-box-layout="list"] .data-item:not(:last-child) {
        padding-bottom: 15px;
        margin-bottom: 15px
    }

    [data-box-layout="list"] .data-item-body {
        padding-left: 13px
    }
}

@media(min-width:861px) {
    .layout-grid-4>.box-category {
        width: 23.5% !important;
        margin-right: 2%
    }

    .layout-grid-4>.box-category:nth-child(4n) {
        margin-right: 0
    }

    .box-category .data-item:first-of-type {
        height: 270px;
        overflow: hidden
    }

    .box-category .data-item:not(:first-of-type) {
        height: 90px;
        overflow: hidden;
    }

    .box-category .data-item:not(:first-of-type) .data-item-thumb {
        width: 40%
    }

    .box-category .data-item:not(:first-of-type) .data-item-body {
        width: 60%
    }

    .box-category .data-item-title {
        max-height: 70px;
        overflow: hidden
    }

    .box-category .data-item:not(:first-of-type) .data-item-title {
        font-size: 90%;
        line-height: 1.3
    }

    .sidebar [data-box-layout="list"] .data-item-summary,
    .sidebar [data-box-layout="list"] .data-item-summary+a {
        display: none
    }

    [data-content="newsfeatured"],
    .col-8 {
        width: 70%
    }

    [data-content="newstrending"],
    .col-4 {
        width: 30%;
        padding-left: 20px
    }

    [data-content="newstrending"] .post_title a {
        display: block !important;
        font-size: 100% !important
    }

    [data-content="newstrending"] .post_meta,
    [data-content="newstrending"] .post_snippet {
        display: none !important
    }

    .sidebar [data-box-layout="list"] .data-item-thumb {
        width: 38%
    }

    .sidebar [data-box-layout="list"] .data-item-body {
        width: 62%
    }

    .sidebar [data-box-layout="list"] .data-item-title>a {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis
    }
}

[data-box-layout="blog"] .data-item:not(:last-child),
[data-box-layout="blog"] .data-item-thumb {
    margin-bottom: 15px
}

[data-box-layout="grid"] .data-item {
    padding: 0 7.5px 15px 7.5px
}

@media(min-width:768px) {
    [data-content="popularposts"] .post_title a {
        font-size: 95%
    }

    .news-coverage .section-thumbnail {
        width: 33%;
        margin-right: 15px
    }

    .news-coverage .section-title,
    .news-coverage .section-content {
        width: calc(67% - 15px)
    }

    .news-coverage .section-thumbnail a {
        padding-bottom: 133%
    }

    [data-box-layout="grid"] .data-item {
        width: 33.33%
    }
}

@media(max-width:767px) and (min-width:312px) {
    [data-box-layout="grid"] .data-item {
        width: 50%
    }
}

@media(max-width:320px) {
    [data-box-layout="grid"] .data-item {
        width: 100%
    }
}

[data-box-layout="grid"] .data-item-thumb {
    margin-bottom: 15px
}

.data-item,
.data-item-thumb,
.data-item-body {
    float: left
}

.data-item-thumb {
    position: relative;
    overflow: hidden
}

[data-box-layout="blog"] a.img,
[data-box-layout="grid"] a.img {
    padding-bottom: 56.25%
}

[data-box-layout="list"] a.img {
    padding-bottom: 66.67%
}

.data-item-title {
    font-weight: 500;
    line-height: 1.4
}

.data-item-title>a {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex
}

@media(min-width:641px) {
    .section-multimedia {
        margin-bottom: 50px
    }

    [data-content="multimedia"] {
        margin: 0;
        float: left;
        width: 100%;
        display: block
    }

    [data-content="newsfeatured"] .post:nth-of-type(1) {
        width: 65%;
        padding-right: 20px
    }

    [data-content="newsfeatured"] .post:nth-of-type(2),
    [data-content="newsfeatured"] .post:nth-of-type(3) {
        width: 35%
    }

    .w30 {
        width: 30%
    }

    .w40 {
        width: 40%
    }

    .w50,
    .data-trending .data-item {
        width: 50%
    }

    .w60 {
        width: 60%
    }

    .w70 {
        width: 70%
    }

    .data-trending {
        padding: 15px 15px 0 15px
    }

    .data-trending .data-item-title>a {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 3
    }

    .data-trending [data-box-layout="list"] .data-item:not(:last-child) {
        border-bottom: 0 !important;
        padding-bottom: 0
    }
}

@media(max-width:860px) and (min-width:481px) {
    .sidebar .data-item-title {
        line-height: normal
    }

    .sidebar .data-item-title>a {
        font-size: 140%
    }

    .sidebar [data-box-layout="list"] .data-item-body {
        padding-left: 15px
    }

    .sidebar [data-box-layout="list"] .data-item-summary {
        max-height: 65px;
        overflow: hidden;
        margin-top: 10px
    }

    .sidebar [data-box-layout="list"] .data-item-summary>* {
        display: inline;
        font-size: 95%;
        line-height: 1.5
    }

    body[data-theme="light"] .sidebar [data-box-layout="list"] .data-item-summary>* {
        color: #777
    }
}

@media(min-width:641px) and (max-width:1023px) {
    [data-content="multimedia"] .post {
        height: auto !important
    }

    [data-content="multimedia"] .post:nth-of-type(n+2) {
        margin-bottom: 0
    }

    [data-content="multimedia"] .post:nth-of-type(n+2) {
        width: 49%;
        margin-right: 2%;
        float: left
    }

    [data-content="multimedia"] .post:nth-of-type(2n+1) {
        margin-right: 0
    }

    [data-content="multimedia"] .post_thumb {
        overflow: hidden;
        margin-bottom: 8px;
        position: relative
    }

    [data-content="multimedia"] .post:nth-of-type(n+2) .post_thumb {
        width: 120px;
        float: left;
        margin-right: 10px
    }

    [data-content="multimedia"] .post:nth-of-type(n+2) .post_thumb a.img {
        padding-bottom: 66.67%
    }

    [data-content="multimedia"] .post:nth-of-type(n+2) .post_body {
        width: calc(100% - 130px)
    }

    [data-content="multimedia"] .post:nth-of-type(n+2) .post_title a {
        font-size: 100%
    }
}

@media(min-width:1024px) {
    [data-content="multimedia"] .post {
        margin-bottom: 20px;
        margin-right: 2%;
        padding: 0;
        position: relative
    }

    [data-content="multimedia"] .post:not(:first-child) {
        width: 23.5%
    }

    [data-content="multimedia"] .post:first-child {
        width: 49%
    }

    [data-content="multimedia"] .post:nth-child(4n+3) {
        margin-right: 0
    }

    [data-content="multimedia"] .post:nth-child(n+4) {
        margin-bottom: 0
    }

    [data-content="multimedia"] .post:nth-child(4) {
        clear: left
    }

    [data-content="multimedia"] .post_title a {
        font-size: 110%
    }
}

@media(max-width:1023px) {
    [data-content="multimedia"] .post:first-child {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
        height: auto
    }
}

@media(max-width:860px) {
    .section-top>.Blog {
        padding: 0 15px
    }

    .sidebar>.has-background {
        background: #fff !important
    }

    .col-8 {
        margin-bottom: 20px
    }

    .widget.video {
        margin-top: 20px
    }
}

@media(max-width:767px) {
    .news-coverage .section-thumbnail {
        margin-bottom: 20px
    }

    .news-coverage .section-thumbnail,
    .news-coverage .section-title,
    .news-coverage .section-content {
        width: 100%
    }

    .news-coverage .section-thumbnail a {
        padding-bottom: 66.67%
    }
}

@media(max-width:640px) {

    [data-content="newsfeatured"] .post:nth-of-type(2),
    [data-content="newsfeatured"] .post:nth-of-type(3) {
        width: 50%
    }

    [data-content="newsfeatured"] .post:nth-of-type(2) {
        padding-right: 7.5px
    }

    [data-content="newsfeatured"] .post:nth-of-type(3) {
        padding-left: 7.5px
    }

    .section-multimedia .section-title ul {
        display: none
    }

    .section-multimedia {
        margin-bottom: 40px
    }

    .layout-grid-4>.box-category:nth-child(1),
    .layout-grid-4>.box-category:nth-child(3),
    .layout-grid-4>.box-category:nth-child(5),
    .layout-grid-4>.box-category:nth-child(7) {
        padding-right: 7.5px
    }

    .w30,
    .w40,
    .w50,
    .w60,
    .w70 {
        width: 100%
    }

    .data-trending {
        padding: 15px
    }

    .w60.has-padding,
    .w40.has-background {
        margin-bottom: 15px
    }
}

@media(max-width:550px) {
    .layout-grid-4>.box-category {
        width: 100%;
        margin-top: 15px
    }

    .box-category .data-item:first-child .data-item-title>a {
        font-size: 120%
    }
}

@media(max-width:480px) {

    .section-title h3,
    .section-title h3 a,
    .section-title h2,
    .section-title h2 a {
        color: #006BA0;
        color: var(--primary-color)
    }

    .section-title h3,
    .section-title h2,
    .news-coverage .section-title h3 {
        padding: 0
    }

    .section-title h3:before,
    .section-title h2:before {
        content: unset
    }

    [data-content="newsfeatured"] .post:nth-child(n+2) {
        margin-bottom: 20px !important
    }

    .section-title {
        margin-bottom: 15px
    }

    [data-content="multimedia"] .post:first-child .post_title {
        padding: 15px 15% 15px 15px
    }

    [data-content="multimedia"] .post:first-child .post_title a {
        font-size: 1.3rem !important
    }

    .sidebar [data-box-layout="list"] .data-item-summary,
    .sidebar [data-box-layout="list"] .data-item-summary+a {
        display: none
    }

    [data-box-layout="list"] .data-item:not(:last-child) {
        margin-bottom: 13px;
        padding-bottom: 13px
    }

    [data-box-layout="list"] .data-item-thumb {
        width: 40%
    }

    [data-box-layout="list"] .data-item-body {
        width: 60%;
        padding-left: 13px
    }

    .news-coverage {
        margin-bottom: 13px;
        padding-bottom: 13px
    }

    .data-item-title>a {
        line-height: 1.4
    }
}

/* ]]> */
/* <![CDATA[ */

  
  [data-icon-label] {
    position: relative;
    display: inline-block
  }
  
  [data-icon-label]:after {
    content: attr(data-icon-label);
    position: absolute;
    font-style: normal;
    font-family: Arial, Sans-serif !important;
    top: -8px;
    right: -8px;
    font-weight: bolder;
    background-color: rgb(255, 0, 0);
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.3);
    font-size: 11px;
    padding: 2px;
    opacity: .9;
    line-height: 13px;
    height: 13px;
    width: 13px;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    z-index: 1;
    transition: transform .2s
  }
  
  [data-icon-label="0"]:after {
    display: none
  }
  
  /* ]]> */

/* <![CDATA[ */
[data-page-type="post"] .Blog {
    padding-bottom: 0 !important
}

.fancybox-caption__body {
    max-width: 660px;
    margin: 0 auto;
    font-size: 1rem
}

.article-header .article-meta {
    margin: 10px 0 8px 0;
    line-height: 40px
}

.article-author,
.label-text {
    cursor: default
}

.article-author {
    font-weight: 500
}

[data-view-type="mobile"] .article-author {
    font-size: 92%;
    text-transform: uppercase
}

.article-header .article-meta span:not(.article-comment):not(.share-icon):not(.font-size) {
    display: inline-block;
    padding-right: 8px
}

.article-published,
.article-header .comment-icon {
    font-size: 90%
}

.article-published {
    cursor: default
}

.font-size-increase {
    margin-left: auto
}

.font-size-increase>.font-size {
    display: inline-block;
    width: 30px;
    font-weight: 600;
    ;
    text-align: center
}

.font-size-increase>.font-size.active {
    opacity: 1
}

.font-size-increase>.font-size:not(.active) {
    opacity: .5
}

.font-size-increase>.font-size.default {
    font-size: 110%
}

.font-size-increase>.font-size.large {
    font-size: 160%;
    padding: 0
}

.article-header .article-title {
    font-weight: 600;
    line-height: normal;
    font-size: 2.3em
}

.article-summary {
    margin-bottom: 1.3rem
}

.article-summary p {
    line-height: 1.6;
    font-weight: 600
}

.article-body {
    float: left;
    width: 100%;
    position: relative;
    word-break: break-word;
    line-height: 1.6em
}

.article-summary>p.font-increase,
.article-body.font-increase {
    font-size: 120%
}

@media(min-width:660px) {
    .article-body table[align="left"] {
        width: 50%;
        margin-right: 20px
    }

    .article-body table[align="right"] {
        width: 50%;
        margin-left: 20px
    }
}

@media(min-width:769px) {

    .article-summary>p,
    .article-body {
        font-size: 110%
    }
}

@media(max-width:768px) and (min-width:551px) {

    .article-summary>p,
    .article-body {
        font-size: 120%
    }
}

@media(max-width:550px) {

    .article-summary>p,
    .article-body {
        font-size: 110%
    }
}

.article-body p {
    margin-bottom: 1.3rem
}

.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5,
.article-body h6 {
    font-size: 1.2em;
    font-weight: 600;
    cursor: default
}

.article-body a {
    color: #03a9f4
}

[data-view-type=desktop] .article-body a:hover,
[data-view-type=desktop] .article-body a:focus,
[data-view-type=desktop] .article-body a:active {
    color: #006BA0;
    color: var(--primary-color);
    outline: none !important
}

.article-body ol,
.article-body ul:not(.chapter) {
    margin-left: 35px
}

.article-body ul:not(.chapter)>ul {
    margin: 15px 0 15px 20px
}

.article-body ul:not(.chapter)>li {
    list-style-type: disc
}

.article-body ul:not(.chapter)>ul>li {
    list-style-type: circle
}

.article-body ol li {
    list-style-type: decimal
}

.article-body>div .code {
    background: #fafafa;
    display: block;
    position: relative;
    overflow: auto;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    padding: 15px;
    line-height: 1.6em;
    font-size: inherit;
    white-space: nowrap
}

.tr-caption-container,
.separator {
    position: relative;
    clear: both !important;
    text-align: center !important;
}

.tr-caption-container tr:first-child,
.separator {
    line-height: 0
}

.tr-caption-container tr:first-child a,
.separator a {
    position: relative;
    display: block;
    color: inherit
}

.tr-caption-container tr:first-child img,
.separator img {
    background: #e9ecef;
    width: 100%;
    filter: blur(3px)
}

.article-body .tr-caption-container>a,
.separator>a {
    color: inherit
}

.tr-caption-container>a:focus,
.separator>a:focus {
    outline: none
}

[data-view-type="desktop"] .tr-caption-container a:hover,
[data-view-type="desktop"] .separator>a:hover {
    cursor: zoom-in
}

.tr-caption-container.has-child a {
    float: left
}

.tr-caption-container.has-child.two a {
    width: 50%
}

.tr-caption-container.has-child.tree a {
    width: 33.333%
}

.tr-caption-container.has-child a:first-child {
    padding-right: 1px
}

.tr-caption-container.has-child a:last-child {
    padding-left: 1px
}

.tr-caption-container.has-child.tree a:nth-of-type(2) {
    padding-left: 1px;
    padding-right: 1px
}

.tr-caption {
    max-width: 720px;
    width: 100%;
    margin: 0 auto;
    padding-top: 10px;
    display: block;
    font-family: sans-serif;
    font-size: 90%;
    color: #777;
    line-height: 1.4;
    text-align: left !important
}

.type-picture .tr-caption {
    font-size: 95%;
    color: #1c1e21
}

blockquote {
    margin: 0;
    padding-left: 15px;
    border-left: 2px solid #03a9f4;
    font-family: Roboto, sans-serif;
    font-size: 1rem;
    font-style: italic
}

blockquote:before,
blockquote:after {
    font-size: 140%;
    vertical-align: sub
}

blockquote:before {
    content: '“'
}

blockquote:after {
    content: '”'
}

.box_tin {
    background: rgba(245, 245, 245, 1);
    position: relative;
    padding: 20px;
    border-radius: 4px;
    font-size: 95%
}

.box_tin::after {
    content: '';
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 30px 0 0;
    border-top-left-radius: 5px;
    border-color: #d8d8d8 #fff transparent transparent
}

.box_tin li {
    list-style-type: none
}

.box_tin li>a {
    display: block;
    line-height: 1.6em;
    color: #2d2d2d
}

.box_tin li>a:focus {
    outline: none !important
}

.box_tin li>a:hover,
.box_tin li>a:focus,
.box_tin li>a:active {
    color: #007bc7
}

.box_tin.category {
    margin: 1.3rem 0
}

.box_tin.category ul {
    margin-top: 10px
}

.box_tin.category p {
    font-size: 1.3em
}

.box_tin.category p>label {
    font-size: 14px;
    color: #2b6dad;
    vertical-align: middle
}

.box_tin.category p>label:after {
    content: '[Ẩn]'
}

.box_tin.category p>label.show:after {
    content: '[Hiện]'
}

.social-sharing-widgets {
    margin: 20px 0 25px 0;
    position: relative
}

.social-sharing-widgets .theme-button.back {
    margin-right: 3px
}

.dd {
    display: inline-block;
    position: relative
}

.dd>.drops {
    display: inline-block;
    padding: 0 10px;
    background: #1877f2;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    border-radius: 3px;
    height: 28px;
    line-height: 28px;
    vertical-align: bottom;
    text-align: center
}

.dd>.drops:hover,
.dd>.drops:focus,
.dd>.drops:active {
    outline: none !important;
    background: #4267b2
}

.hide\:screen {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important
}

.fb_iframe_widget_fluid_desktop iframe[style] {
    width: 100% !important
}

#comments {
    position: relative
}

#comments[data-allow-comments="true"] {
    background: #f7f7f7;
    min-height: 192px;
    margin: 0 auto;
    padding: 5px 10px
}

.commentForm {
    background: #fafafa;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 3px;
    padding: 0 12px
}

#comments.threaded .commentForm {
    margin-bottom: 20px
}

#comment-editor,
.commentForm.loading {
    min-height: 89.5px
}

.thread-locked-alert {
    background: #f2f6fb;
    padding: 15px;
    position: relative;
    border: 1px solid #dadce0;
    border-radius: 3px;
    overflow-x: hidden
}

.comment {
    list-style-type: none;
    position: relative
}

.comment-replybox-single>.commentForm,
.comment:not(:last-child),
#comments .loadmore,
#comments .showless,
.calcel-reply {
    margin-bottom: 15px
}

.comment>.avatar-image-container {
    position: absolute;
    height: 35px;
    width: 35px
}

.comment-replies .avatar-image-container {
    height: 30px;
    width: 30px
}

.comment .avatar-image-container img {
    border-radius: 50%;
    height: 100%;
    width: 100%
}

.avatar-image-container img {
    background: url(//4.bp.blogspot.com/-9TaHwQSt4ps/WfdMSWzDpAI/AAAAAAAAQgE/lwRBOH-oCWQVR-UDuoXZGFHUc4A1B99cQCLcBGAs/s1600/no-image.png) no-repeat center
}

.avatar-image-container span {
    bottom: 15px;
    position: absolute;
    right: -6px;
    display: inline-block;
    height: 15px;
    width: 15px
}

.avatar-image-container svg {
    height: 15px;
    width: 15px
}

.comment-replies .avatar-image-container span {
    bottom: 13px
}

.comment-replies .avatar-image-container svg {
    width: 13px;
    height: 13px
}

.comment .comment-block {
    margin: 0 0 0 45px
}

.comment-replies .comment-block {
    margin: 0 0 0 40px
}

.comment .comment-replies {
    margin: 15px 0 0 40px
}

.comment .view-replies {
    margin: 10px 0 0 45px
}

.comment .view-replies>span {
    font-size: 15px;
    font-weight: bolder;
    color: #1a73e8
}

.comment .comment-replybox-single {
    margin: 15px 0 0 45px
}

.comment .comment-header>.user {
    font-style: normal;
    font-weight: normal
}

.comment .comment-header>.user,
.comment .comment-header>span a {
    color: #1a73e8
}

.comment .comment-header>span {
    line-height: 1.4
}

.comment .comment-actions {
    display: flex;
    align-items: center;
    font-size: 12px;
    font-weight: normal;
    text-transform: uppercase;
    position: relative;
    padding-top: 5px
}

.comment .comment-actions a {
    opacity: .8
}

.comment .continue {
    display: none
}

.comment .continue a.comment-reply {
    font-size: 13px;
    text-transform: uppercase
}

.comment .comment-actions a.comment-reply,
.comment .comment-actions span.blog-admin {
    padding-right: 10px
}

.postAComment {
    margin-bottom: 20px;
    font-weight: 500
}

.comment-form.spinner {
    height: 93px
}

.comments .comments-content .loadmore.loaded {
    max-height: 0;
    opacity: 0;
    overflow: hidden
}

.comment-thread.inline-thread.hidden {
    display: block
}

.related-posts {
    padding-top: 20px
}

[data-view-type="desktop"] .related-posts.flex-flow a.img {
    padding-bottom: 66.67% !important
}

.related-posts.flex-flow .post_snippet {
    display: none !important
}

.related-posts [data-layout="list"] .post:last-child {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: none !important;
}

@media(max-width:860px) and (min-width:641px) {

    .breadcrumbs,
    .blog-posts {
        max-width: 610px;
        margin: 0 auto
    }
}

.bottom-info {
    display: block;
    text-align: right
}

.clearfix {
    zoom: 1
}

.clearfix:before,
.clearfix:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden
}

.link-source-wrapper {
    width: auto;
    display: block;
    position: relative;
    float: right;
    padding-top: 25px;
    line-height: normal
}

body[data-theme="light"] .link-source-name {
    background: #F2F2F2
}

.link-source-name {
    border-radius: 100px;
    padding: 9px 11px;
    display: inline-block;
    font-weight: 400;
    font-size: 95%
}

[data-view-type="desktop"] .link-source-name:hover {
    cursor: pointer
}

.link-source-name span {
    font-size: 90%;
    font-weight: bold
}

body[data-theme="light"] .link-source-name::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' width='12' height='12' viewBox='0 0 48 48'%3E%3Cpath d='M38 38H10V10h14V6H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4V24h-4v14zM28 6v4h7.17L15.51 29.66l2.83 2.83L38 12.83V20h4V6H28z'/%3E%3C/svg%3E");
}

.link-source-name::after {
    content: "";
    display: inline-block;
    height: 12px;
    margin-left: 3px;
    position: relative;
    width: 12px
}

.link-source-detail {
    background: rgba(0, 0, 0, 0.9);
    opacity: 0;
    visibility: hidden;
    border-radius: 6px;
    width: 300px;
    max-width: 300px;
    position: absolute;
    right: 0;
    bottom: 45px;
    padding: 10px 12px;
    z-index: 9999;
    font-size: 80%;
    cursor: default;
    text-align: left
}

.link-source-full {
    color: #fff
}

.link-source-wrapper:hover .link-source-detail {
    opacity: 1;
    visibility: visible;
    transition: opacity 1s cubic-bezier(0.4, 0.0, 0.2, 1)
}

.link-source-detail .arrow-down {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid rgba(0, 0, 0, 0.9);
    position: absolute;
    bottom: -10px;
    right: 16px
}

/* ]]> */


/* <![CDATA[ */
.header-navigation-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0, 0, 0.2, 1)
}

body[data-theme="light"] .header-navigation-bar {
    background: #fff
}

.header-navigation-bar.visible {
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%)
}

.header-navigation-bar.visible {
    overflow: hidden
}

.header-navigation-bar>div {
    min-height: 50px
}

.page-name {
    max-width: 80%;
    padding: 0 15px
}

.category-name>a,
.page-name>a {
    font-weight: 600
}

.page-name>time>label {
    width: 100%;
    display: block;
    text-align: center
}

.page-name>time {
    width: 84px;
    margin-right: 13px;
    border-right: 1px solid #707070;
    font-weight: 500
}

.page-name>time>label:last-child {
    font-size: 80%
}

@media(max-width:1100px) {
    .header-navigation-bar>div {
        padding: 0 10px 0 15px
    }
}

@media(max-width:767px) {

    .header-navigation-bar {
        display: none
    }
}

/* ]]> */


/* <![CDATA[ */
#error-report {
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 4px;
    background-color: #000;
    z-index: 998
}

#error-report::after {
    content: '';
    display: inline-block;
    position: absolute;
    width: 10px;
    height: 10px;
    left: 65px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    bottom: -5px;
    background-color: #000
}

#error-report button {
    display: inline-block;
    padding: 10px 14px;
    text-align: center;
    background-color: transparent;
    border: 0;
    outline: none;
    font-size: 14px;
    font-weight: normal;
    line-height: normal;
    color: #fff;
    position: relative
}

[data-view-type="desktop"] #error-report button:hover {
    cursor: pointer
}

#error-report button:first-child::after {
    content: '';
    position: absolute;
    bottom: 10px;
    top: 10px;
    right: 0;
    display: block;
    border-right: 1px solid #7a7a7a
}

.article-header .article-thumbnail {
    margin: 0 -15px;
    background: #f7f7f7;
    position: relative;
    overflow: hidden;
    padding-bottom: 56.25%
}

.article-header .article-thumbnail>div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block
}

.article-header .article-thumbnail figure {
    display: block;
    width: 100%;
    float: left;
    height: 100%;
    position: relative;
    z-index: 9;
    margin: 0
}

.article-header .article-thumbnail img {
    display: block;
    width: 100% !important;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;
    z-index: 9;
    position: relative
}

.article-header .article-breadcrumb {
    line-height: 45px;
    background: #fff;
    position: relative;
    margin: 0 -15px;
    margin-bottom: 25px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    z-index: 9;
    padding: 5px 15px
}

.article-header .article-breadcrumb a {
    position: relative;
    white-space: nowrap
}

.article-header .article-breadcrumb a.flex-left {
    color: #0085b5;
    text-transform: uppercase;
    font-weight: 600
}

.article-header .article-breadcrumb a[class*="btn"] {
    width: 35px;
    height: 35px;
    display: block;
    border-radius: 100%;
    margin-left: 5px;
    text-align: center;
    overflow: hidden;
    color: #fff
}

.article-header .article-breadcrumb a.btnFacebook {
    background: #306199;
    line-height: 34px
}

.article-header .article-breadcrumb a.btnZalo {
    background: #018fe5;
    line-height: 38px
}

.article-header .ti-facebook:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M22.912 10.485l-0.582 5.515h-4.409v16h-6.622v-16h-3.3v-5.515h3.3v-3.32c0-4.486 1.865-7.164 7.168-7.164h4.407v5.515h-2.758c-2.058 0-2.195 0.777-2.195 2.214v2.756h4.99z'%3E%3C/path%3E%3C/svg%3E");
    background-size: 100%;
    width: 18px;
    height: 18px;
    display: inline-block;
    vertical-align: text-bottom;
    content: ""
}

.article-header .icon-zalosend {
    width: 20px;
    height: 20px;
    display: inline-block;
    position: relative
}

.article-header .icon-zalosend {
    background: url(//cdn.jsdelivr.net/gh/vietblogdao/images/icon_zalo.png) no-repeat 50% 50%;
    background-size: contain
}

.article-header .article-breadcrumb a.btnZalo span {
    top: 3px
}

.related-article {
    padding: 20px 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
    float: left;
    width: 100%;
    position: relative
}

.related-article+section {
    margin-top: 0 !important
}

.related-article::before {
    content: '';
    display: block;
    height: 45px;
    border-top: 1px solid #eee
}

.related-article::after {
    content: 'Bài liên quan';
    font-weight: bold;
    position: absolute;
    top: 30px;
    left: 0;
    font-size: 16px
}

.related-article .article-item {
    height: 140px;
    padding: 0 0 15px 36%;
    margin: 0
}

.related-article .article-item:nth-of-type(2) {
    margin-top: 20px
}

.related-article .article-thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 33%;
    margin-bottom: 0;
    overflow: hidden
}

.related-article .article-thumbnail a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    padding-bottom: 66.67%
}

.related-article .article-thumbnail img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    float: left;
    -webkit-animation: fadeInImages .3s ease;
    animation: fadeInImages .3s ease
}

.related-article .article-title {
    margin: 0;
    font-weight: bold;
    font-size: 1.1em;
    text-align: left
}

.related-article .article-summary {
    display: block;
    margin-top: 5px;
    margin-bottom: 0;
    font-size: 0.75em;
    color: #666
}

.related-article .article-summary a {
    display: none
}

body[data-theme="light"] .article-timeline,
body[data-theme="light"] .article-coverage {
    background: #f7f7f7
}

.article-timeline,
.article-coverage {
    float: left;
    width: 100%;
    position: relative;
    padding: 15px 20px;
    margin-top: 25px
}

.article-timeline {
    border-radius: 4px
}

.article-coverage .section-title {
    margin-bottom: 0
}

.article-timeline .section-title h3,
.article-coverage .section-title h3 {
    margin: 0;
    padding: 0 15px 0 0;
    font-size: 18px
}

.article-timeline .section-title a,
.article-coverage .section-title a {
    color: #006BA0;
    color: var(--primary-color)
}

.article-timeline .section-title h3:before,
.article-coverage h3:before {
    content: unset
}

.article-item {
    float: left;
    width: 100%;
    position: relative;
    height: initial;
    line-height: 1.4
}

.article-coverage .article-item {
    margin-top: 8px
}

.article-timeline .article-item:not(:last-child) {
    padding: 0 41% 20px 0
}

.article-timeline .article-item:last-child {
    padding-right: 41%
}

.article-timeline .article-item::before,
.article-timeline .article-item::after {
    content: '';
    display: inline-block;
    position: absolute
}

.article-timeline .article-item::before {
    width: 10px;
    height: 10px;
    top: 5px;
    left: -30px;
    background-color: #006ba0;
    border-radius: 50%
}

.article-timeline .article-item::after {
    width: 1px;
    top: 15px;
    left: -26px;
    height: 100%;
    border-left: 1px #d9d9d9 dashed
}

.article-timeline .article-item:last-child::after {
    content: unset
}

.article-timeline .article-thumbnail {
    position: absolute;
    width: 38%;
    height: 85%;
    right: 0;
    top: 50%;
    bottom: 0;
    margin-left: 3%;
    overflow: hidden;
    border-radius: 3px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.article-timeline .article-thumbnail a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative
}

.article-timeline .article-thumbnail img {
    position: absolute;
    top: 0;
    left: 0;
    float: left;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-animation: fadeInImages .3s ease;
    animation: fadeInImages .3s ease
}

.article-timeline header {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column
}

.article-coverage .article-title {
    margin: 0;
    padding-left: 15px;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.33
}

.article-coverage .article-title a::before {
    content: '•';
    display: inline-block;
    position: absolute;
    left: 0;
    top: 5px
}

.article-timeline .article-title {
    display: block;
    margin: 0;
    font-size: 18px;
    text-align: left;
    font-weight: bold;
    line-height: 1.44;
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    order: 2
}

.article-timeline .article-meta,
.article-coverage .article-meta {
    margin: 0;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    order: 1;
    font-size: 80%;
    line-height: 16px;
    font-style: italic
}

.article-coverage .article-meta {
    display: inline-block;
    margin-left: 5px
}

.article-timeline .article-meta {
    display: block
}

.article-coverage .article-publish,
.article-timeline .article-publish {
    padding: 0 !important;
    font-size: 85%;
    color: #aaa
}

.article-timeline .article-summary {
    display: block;
    margin: 5px 0 0;
    font-size: 15px;
    color: #666;
    line-height: 1.6;
    height: 72px;
    overflow: hidden;
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    order: 3
}

.article-timeline .article-summary a {
    display: none
}

.layout-special #main-container {
    max-width: unset
}

.layout-special #main-container,
.layout-special main.main {
    width: 100% !important;
    padding: 0 !important
}

.layout-special .header+div .widget:not(.Blog),
.layout-special .breadcrumbs,
.layout-special:not(.layout-cover) .article-header,
.layout-special:not(.layout-cover) .article-summary,
.layout-special .article-social-pin,
.layout-special #section-banner,
.layout-special #section-bottom,
.layout-special .banner-widget,
.layout-special .banner-mobile,
.layout-special .post_snippet,
.layout-special .article-body .related-article,
.layout-special .site-header {
    display: none !important
}

.layout-special .breadcrumbs,
.layout-special .blog-posts {
    max-width: unset !important
}

.layout-special .header+div>div:nth-of-type(2) {
    padding-top: 0
}

.layout-special .widget.Blog .header-navigation-bar .widget {
    display: block !important
}

body[data-theme="light"].layout-special .type-voices .article-body,
body[data-theme="light"].layout-special .type-voices .article-footer {
    background: #f2f6f8 !important
}

.layout-special .article-body>div>h2,
.layout-special .article-body>div>h3,
.layout-special .article-body>div>p,
.layout-special .article-body .wiki-author,
.layout-special:not(.layout-cover) .article-body table[align="center"],
.layout-special .article-body .box_tin,
.layout-special .article-body .related-article,
.layout-special .bottom-info,
.layout-special .social-sharing-widgets,
.layout-special #comments {
    max-width: 660px !important;
    margin: 18px auto !important;
    float: none !important
}

.layout-special .article-body .box_tin>h3 {
    margin-bottom: 1.3rem
}

.layout-special .article-body table.picture {
    background: #FFF !important;
    max-width: 1000px !important;
    float: none !important
}

.layout-special .article-body h2>strong {
    font-size: 1.2rem !important;
    max-width: 660px;
    margin: 18px auto !important;
    display: block;
    line-height: 1.5;
    text-align: center
}

.layout-special .article-body h2>strong::after {
    content: "" !important;
    width: 200px;
    height: 1px;
    display: block;
    background: #000;
    margin: 50px auto
}

.layout-special .article-body p.question {
    font-style: italic;
    margin-top: 25px;
    color: #444;
    font-weight: bold
}

.layout-special .article-body>div>h3+p {
    margin-top: 80px !important
}

.layout-special .article-body .h1 {
    margin: 0 0 20px !important;
    text-align: center;
    font-size: 20px;
    line-height: 36px;
    text-transform: uppercase
}

.layout-special .article-body .h1>strong {
    max-width: 900px;
    margin: 18px auto !important;
    display: block;
    font-size: 3.8rem !important;
    line-height: 1.1;
    padding: 0 5% !important
}

.layout-special .article-body h2+.h1 {
    margin-top: 30px !important;
    margin-bottom: 50px !important
}

.layout-special .article-body p+h2,
.layout-special .article-body p+h3 {
    margin-top: 50px !important
}

.layout-special .article-body .wiki-author {
    margin-bottom: 30px !important;
    background: none !important;
    padding: 15px 0;
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa
}

.layout-special .article-body .wiki-author p {
    font-size: 14px;
    line-height: 1.6;
    margin: 0 !important
}

.layout-special .article-body .wiki-author p+h3 {
    font-size: 2rem !important;
    color: #0578a5;
    float: none !important;
    margin-top: 0 !important;
    margin-bottom: 10px;
    text-align: left !important
}

.layout-special .article-body .wiki-author h3+p {
    margin-top: 10px !important;
    margin-bottom: 5px !important;
    clear: none !important
}

.layout-special .article-body .wiki-author img {
    float: right !important;
    width: 100px !important;
    height: 100px !important;
    border-radius: 5px
}

.layout-special .article-body .wiki-author ul {
    margin: 0 !important
}

.layout-special .article-body .wiki-author ul li {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    margin-right: 5px
}

.layout-special .article-body .wiki-author ul li a {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background: #306199 !important;
    color: #FFF !important;
    position: relative
}

.layout-special .article-body .wiki-author ul li a:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M22.912 10.485l-0.582 5.515h-4.409v16h-6.622v-16h-3.3v-5.515h3.3v-3.32c0-4.486 1.865-7.164 7.168-7.164h4.407v5.515h-2.758c-2.058 0-2.195 0.777-2.195 2.214v2.756h4.99z'%3E%3C/path%3E%3C/svg%3E");
    background-size: 100%;
    width: 18px;
    height: 18px;
    display: inline-block;
    vertical-align: text-bottom;
    content: ""
}

.layout-special .type-voices .article-body h2>strong::after {
    content: unset !important
}

.layout-special .article-body h2,
.layout-special .article-body h3,
.layout-special .article-body h4 {
    font-size: 2.4rem !important;
    text-align: center;
    line-height: 1.2;
    letter-spacing: 0 !important
}

.layout-special .article-body p+h2,
.layout-special .article-body p+h3,
.layout-special .article-body p+h4 {
    text-transform: uppercase
}

.layout-special .type-voices .article-body h3:first-child {
    margin-top: 80px !important
}

.layout-special h2 img,
.layout-special .article-body h3 img {
    display: inline-block;
    width: auto
}

.layout-special .article-body blockquote {
    float: left !important;
    background: #fff !important;
    width: 360px !important;
    padding: 38px 20px 20px;
    position: relative;
    border-left: none !important;
    margin-bottom: 50px !important;
    -webkit-box-shadow: 5px 5px 0 -2px #CCC;
    box-shadow: 5px 5px 0 -2px #CCC;
    text-align: left;
    font-weight: bold;
    color: #000 !important;
    font-size: 1.3rem !important;
    letter-spacing: 0 !important;
    font-style: normal !important;
    line-height: 1.4 !important
}

.layout-special .article-body blockquote {
    margin-left: 10% !important;
    margin-right: 50px !important
}

.layout-special .article-body blockquote:nth-of-type(odd) {
    float: right !important;
    margin-left: 50px !important;
    margin-right: 10% !important
}

@media (min-width:1360px) {
    .layout-special .article-body blockquote:nth-of-type(odd) {
        margin-right: 20% !important;
        margin-left: 50px !important
    }

    .layout-special .article-body blockquote {
        margin-left: 20% !important;
        margin-right: 50px !important
    }
}

.layout-special .article-body blockquote:before {
    content: "";
    font-size: 30px;
    position: absolute;
    font-family: 'znews-icon';
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: inline-block;
    top: 41px;
    left: 20px;
    color: #d5d5d5
}

.layout-special .article-body blockquote:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #fff;
    position: absolute;
    bottom: -20px
}

.layout-special .article-body blockquote p {
    margin: 0 0 18px;
    padding-left: 50px
}

.layout-special .article-body p img[style*="right"],
.layout-special .article-body p img[align="right"] {
    float: right
}

.layout-special .article-body p img[style*="left"],
.layout-special .article-body p img[align="left"] {
    float: left
}

.layout-special .related-posts {
    max-width: 960px;
    margin: 0 auto;
    float: none
}

.layout-special .section-title {
    text-align: center
}

.type-quizz .article-title:before {
    content: "#QUIZZ" !important;
    font-weight: 300;
    display: block !important;
    padding: 0 !important;
    color: #decd00 !important;
    margin-bottom: 10px
}

.article-cover {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 0 !important
}

.article-cover .article-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex !important;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
    padding-top: 0 !important;
    float: none !important
}

.article-cover .header-bg {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}

.article-cover .header-overlay {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    margin: 0 auto
}

.article-cover .article-category {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1em;
    font-weight: 300
}

.article-cover .article-category a {
    color: #888
}

.article-cover .article-header .article-title {
    margin-top: 10px;
    text-transform: uppercase
}

.article-cover .article-body {
    max-width: 660px;
    margin: 0 auto
}

.article-cover .article-header .article-meta>div {
    justify-content: center
}

.article-cover .article-header .article-meta .flex-right {
    margin-left: 0
}

.article-cover .article-header .article-thumbnail,
.article-cover .article-header>.article-breadcrumb,
.article-cover .article-body img.bg {
    display: none
}

@media(min-width:1349px) {

    .layout-special .article-cover .tr-caption-container,
    .layout-special .article-cover .separator {
        width: unset;
        margin-left: -10rem;
        margin-right: -10rem
    }

    .layout-special .article-cover .tr-caption {
        font-size: 100%;
        color: inherit;
        line-height: 1.5
    }
}

@media(min-width:993px) {
    .article-cover .header-bg {
        height: calc(100vh - 50px);
        min-height: 100%;
        width: 50%
    }

    .article-cover .header-overlay {
        width: 45%;
        max-width: 660px
    }

    .article-cover .article-header {
        border-bottom: solid 1px rgba(0, 0, 0, 0.1)
    }

    .article-cover .header-overlay,
    .article-cover .article-summary {
        text-align: center
    }

    .article-cover .article-header .article-title {
        font-size: 3rem
    }
}

@media(max-width:992px) {
    .article-cover .article-header {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        flex-direction: column
    }

    .article-cover .header-bg {
        width: 100%;
        height: auto
    }

    .article-cover .header-overlay {
        width: 100%;
        margin-top: 20px;
        padding: 0 5%;
        max-width: 100%
    }

    .article-cover .article-body {
        padding: 0 15px
    }

    .layout-special.layout-cover .article-summary>p {
        margin: 0 !important
    }
}

@media(max-width:992px) and (min-width:481px) {
    .article-cover .header-bg {
        min-height: 550px
    }
}

@media(max-width:480px) {
    .article-cover .header-bg {
        min-height: 350px
    }
}

.type-quizz .breadcrumbs,
.type-quizz .article-summary {
    display: none !important
}

.box-question {
    float: left;
    width: 100%;
    font-size: 1rem;
    color: #333
}

.box-question h2,
.box-question h3 {
    margin-bottom: 20px !important;
    cursor: default
}

.box-question h2 {
    font-size: 1.3rem !important
}

.box-question h3 {
    font-size: 1.2rem !important;
    font-weight: normal !important
}

.box-question table.picture {
    margin: 18px 0;
    border-radius: 5px;
    background: #FFEB00;
    overflow: hidden;
    line-height: 1.5
}

.box-question table.picture+.picture {
    margin-top: 22px
}

.box-question table.picture td {
    position: relative;
    cursor: default
}

table.picture img {
    max-width: 100%;
    width: 100%;
    height: auto;
    display: block
}

.box-question table.picture td.caption {
    padding: 20px 20px 0 20px !important;
    color: #000
}

.box-question .question ul {
    margin: 10px 0 20px !important;
    list-style: none;
    padding: 0 !important
}

.box-question .question ul>li {
    float: left;
    width: 100%;
    background: rgba(0, 0, 0, 0.05);
    padding: 15px 10px 15px 50px;
    margin-bottom: 5px;
    position: relative;
    font-weight: bold !important;
    border-radius: 30px;
    list-style-type: none !important;
    line-height: 1.6
}

.box-question .question ul>li:before {
    display: block;
    position: absolute;
    top: 13px;
    left: 10px;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background: rgba(0, 0, 0, 0.1);
    text-align: center;
    line-height: 30px
}

.box-question .question ul>li:first-child:before {
    content: "A"
}

.box-question .question ul>li:nth-child(2):before {
    content: "B"
}

.question ul>li:nth-child(3):before {
    content: "C"
}

.question ul>li:nth-child(4):before {
    content: "D"
}

.box-question .question ul>li:nth-child(5):before {
    content: "E"
}

.box-question .question ul>li:nth-child(6):before {
    content: "F"
}

.box-question .question ul>li:nth-child(7):before {
    content: "G"
}

.box-question .question ul>li:nth-child(8):before {
    content: "H"
}

.box-question .question ul>li>span,
.box-question .question ul>li>strong {
    color: #000 !important;
    font-weight: bold !important
}

.box-question .question ul:not(.answered) li:hover {
    background: rgba(255, 255, 255, 0.6)
}

.box-question .question ul.answered>li:not(.selected):not(.correct) {
    opacity: 0.4
}

.box-question .question ul.answered>li.selected {
    opacity: 1;
    border-radius: 5px
}

.box-question .question ul.answered>li.selected:not(.correct) {
    background: #f16464
}

.box-question .question ul.answered>li.correct {
    background: #55d000
}

.box-question .question ul+p:not(.explaination) {
    display: none;
    margin: 15px 0
}

.box-question .question ul>li>p.explaination {
    margin: 0;
    color: #fff;
    font-weight: normal
}

.box-question .question+.result {
    float: left;
    width: 100%;
    margin: 20px 0;
    position: relative;
    background: #f3f3f3;
    font-weight: 300;
    text-align: center;
    font-size: 1.8rem;
    padding: 20px 10px 25px;
    line-height: 1.1
}

.box-question .question+.result:before {
    content: "Kết quả";
    color: #888;
    text-align: center;
    margin-right: 10px;
    display: block;
    font-size: 0.8em;
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
    margin-bottom: 30px
}

.box-question .question+.result>.message {
    display: block;
    margin: 15px 0
}

.box-question .question+.result>.correct {
    color: #55d000;
    font-weight: bold;
    font-size: 2em
}

.box-question .question+.result>.total {
    font-size: 2em;
    color: #f16464
}

.box-question .question+.result>.total:before {
    content: "/"
}

@media(min-width:1025px) {
    .box-question .question ul:not(.answered)>li {
        cursor: pointer
    }

    .box-question .question ul.answered>li {
        cursor: default;
        pointer-events: none
    }
}

@media(min-width:769px) {
    .layout-special .article-body table.picture {
        margin: 50px auto !important
    }

    .layout-special .article-body p img[style*="right"],
    .layout-special .article-body p img[align="right"] {
        width: auto !important;
        max-width: 480px !important;
        margin-top: 8px;
        margin-left: 30px !important;
        margin-bottom: 16px !important
    }

    .layout-special .article-body p img[style*="left"],
    .layout-special .article-body p img[align="left"] {
        width: auto !important;
        max-width: 480px !important;
        margin-top: 8px;
        margin-right: 30px !important;
        margin-bottom: 16px !important
    }
}

@media(min-width:1349px) {

    .layout-special .article-body p img[style*="right"],
    .layout-special .article-body p img[align="right"] {
        margin-right: calc(100% - 870px)
    }

    .layout-special .article-body p img[style*="left"],
    .layout-special .article-body p img[align="left"] {
        margin-left: calc(100% - 870px)
    }
}

@media(min-width:1024px) and (max-width:1348px) {

    .layout-special .article-body p img[style*="right"],
    .layout-special .article-body p img[align="right"] {
        margin-right: -23%
    }

    .layout-special .article-body p img[style*="left"],
    .layout-special .article-body p img[align="left"] {
        margin-left: -23%
    }
}

@media(max-width:960px) {
    .layout-special .related-posts {
        padding-left: 15px;
        padding-right: 15px
    }
}

@media(max-width:660px) {
    .layout-special .type-voices .article-body h3:first-child {
        margin-top: 30px !important
    }

    .layout-special .article-body .h1>strong {
        font-size: 3rem !important
    }

    .layout-special .article-body>div>h2,
    .layout-special .article-body>div>h3,
    .layout-special .article-body>div>p,
    .layout-special .article-body .wiki-author,
    .layout-special .article-body .box_tin,
    .layout-special .article-body .related-article,
    .layout-special .bottom-info,
    .layout-special .social-sharing-widgets,
    .layout-special #comments {
        margin: 18px 15px !important;
        width: unset !important
    }

    .layout-special .article-body p img[style*="right"],
    .layout-special .article-body p img[align="right"],
    .layout-special .article-body p img[style*="left"],
    .layout-special .article-body p img[align="left"] {
        float: none !important
    }

    .layout-special .article-body h2,
    .layout-special .article-body h3,
    .layout-special .article-body h4 {
        font-size: 2rem !important
    }

    .layout-special .article-body>div>h3+p {
        margin-top: 30px !important
    }

    .layout-special .article-body blockquote {
        padding: 20px 20px 20px;
        margin-bottom: 30px !important
    }

    .layout-special .article-body blockquote {
        margin-left: 15px !important;
        margin-right: 20px !important
    }

    .layout-special .article-body blockquote:nth-of-type(odd) {
        float: right !important;
        margin-left: 20px !important;
        margin-right: 15px !important
    }

    .layout-special .article-body blockquote p {
        margin: 0;
        padding-left: 0
    }
}

@media(max-width:550px) {

    .layout-special .article-body blockquote,
    .layout-special .article-body blockquote:nth-of-type(odd) {
        float: left !important;
        width: unset !important;
        margin-left: 15px !important;
        margin-right: 15px !important;
        font-size: 1.2rem !important
    }
}

@media(min-width:1349px) {
    .layout-no-sidebar main.main {
        width: 100% !important;
        padding-left: 50px !important;
        padding-right: 50px !important
    }

    .layout-no-sidebar .breadcrumbs,
    .layout-no-sidebar .blog-posts {
        float: none;
        margin: 0 auto;
        max-width: 660px
    }

    .layout-no-sidebar .related-posts {
        max-width: 960px;
        margin: 0 auto;
        float: none;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex
    }

    .layout-no-sidebar .related-posts [data-layout="grid"],
    .layout-special .related-posts [data-layout="grid"] {
        margin: 0 -10px
    }

    .layout-no-sidebar .related-posts [data-layout="grid"][data-column="3"] .post,
    .layout-special .related-posts [data-layout="grid"][data-column="3"] .post {
        padding: 0 10px 15px 10px
    }

    .layout-no-sidebar .PopularPosts,
    .layout-no-sidebar .RecentPosts {
        max-width: 768px;
        margin: 0 auto;
        float: none !important
    }

    .layout-no-sidebar aside.sidebar {
        display: none
    }

    .layout-no-sidebar .breadcrumbs>ul,
    .layout-no-sidebar .article-meta {
        justify-content: center
    }

    .layout-no-sidebar .article-header {
        text-align: center
    }

    .layout-no-sidebar .article-meta>div {
        width: unset
    }

    .layout-no-sidebar .article-social-pin {
        margin-left: -190px !important
    }

    .layout-no-sidebar .tr-caption-container,
    .layout-no-sidebar .separator {
        width: unset;
        margin-left: -8rem;
        margin-right: -8rem
    }

    .layout-no-sidebar .tr-caption {
        font-size: 100%;
        color: inherit;
        line-height: 1.5
    }
}

@media(max-width:480px) {
    .layout-special .header+div {
        padding-top: 0 !important
    }

    .layout-special .article-body .h1>strong {
        font-size: 2rem !important
    }

    .layout-special .article-body .wiki-author p+h3 {
        font-size: 1.2rem !important
    }

    .layout-special .article-body h2>strong::after {
        margin: 20px auto
    }

    .related-article .article-item {
        height: 90px;
        padding: 0 0 15px 44%
    }

    .related-article .article-item:nth-of-type(2) {
        margin-top: 15px
    }

    .related-article .article-thumbnail {
        width: 40%
    }

    .related-article .article-summary {
        display: none
    }

    .related-article .article-title {
        font-size: 1rem !important;
        line-height: 1.4
    }

    .tr-caption-container,
    .separator {
        width: unset;
        margin-left: -15px;
        margin-right: -15px
    }

    .tr-caption {
        position: relative;
        padding: 10px 15px 0 30px
    }

    .tr-caption:before {
        content: "";
        display: block;
        width: 1px;
        position: absolute;
        top: 10px;
        left: 15px;
        bottom: 0;
        background: #aaa
    }
}

/* ]]> */


/* <![CDATA[ */
@media(max-width:860px) and (min-width:481px) {
    .nav-icon {
        margin-right: 10px
    }
}

@media(min-width:481px) {
    .header+div {
        padding-top: 50px
    }

    .banner-body,
    .banner-post,
    .has-banner.mobile {
        display: none
    }

    .site-header {
        height: 280px;
        padding: 15px 0
    }

    .header+div>div:nth-of-type(2) {
        padding-top: 20px
    }
}

@media(min-width:551px) {
    .header-icon>li.has-icon {
        padding-left: 8px
    }

    .header-icon>li:not(.has-icon)+li:not(.has-icon) {
        padding-left: 25px
    }

    .header-icon>li:nth-of-type(2) {
        padding-right: 8px
    }

    .show-for-small {
        display: none
    }
}

@media(min-width:861px) {
    main.main {
        width: calc(100% - 301px);
        padding-right: 30px
    }

    aside.sidebar {
        width: 301px
    }

    main.main>.widget,
    aside.sidebar>.widget,
    [expanded="true"] .web-search {}

    .section-top>.has-banner,
    .section-top>.Label,
    main.main>.widget,
    aside.sidebar>.widget,
    .banner-widget {
        margin-bottom: 20px
    }

    .sidebar [data-layout="list"] .post_title>a,
    .sidebar [data-layout="grid"] .post_title>a {
        font-size: 100%
    }

    .sidebar .post_label,
    .sidebar .post_snippet,
    .show-for-medium {
        display: none
    }

    .menu {
        max-height: 50px;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        height: 100%;
        padding: 0 20px;
        position: relative
    }

    .menu>div {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        height: 50px
    }

    .menu .widget {
        position: relative
    }

    .menu .title {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 0 8px;
        position: relative;
        line-height: 26px;
        font-size: 15px;
        font-weight: 500
    }

    .menu .title.more {
        width: 34px;
        height: 50px
    }

    .menu .home>button {
        display: none
    }

    .menu .title.current a {
        color: #0088cc;
        color: var(--primary-color)
    }

    .menu .title.has-widget-content:after {
        content: '';
        width: 8px;
        height: 8px;
        overflow: hidden;
        border: 1px solid;
        border-top-color: transparent;
        border-left-color: transparent;
        position: absolute;
        box-sizing: border-box;
        right: 0;
        transition: all .2s ease-out
    }

    body[data-theme="light"] .header:not(.primary-background-color) .menu .title.has-widget-content:after {
        border-right-color: #1c1e21;
        border-bottom-color: #1c1e21
    }

    body[data-theme="light"] .primary-background-color .menu .title.has-widget-content:after {
        border-right-color: #fff;
        border-bottom-color: #fff
    }

    .menu .title.has-widget-content:not(:hover):after {
        margin-top: -3px;
        -ms-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .menu .title.has-widget-content:hover:after {
        margin-top: 3px;
        -ms-transform: rotate(-135deg);
        transform: rotate(-135deg)
    }

    .menu .title>a {
        font-weight: 600
    }

    [data-view-type="desktop"] .menu .title>a {
        opacity: 1;
        transition: opacity .3s linear
    }

    [data-view-type="desktop"] .menu .title>a:hover {
        opacity: .7;
        text-decoration: none !important
    }

    .primary-background-color .menu .title>a {
        color: #fff
    }

    .menu .more .dot {
        width: 4px;
        height: 4px;
        border-radius: 50%;
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -2px
    }

    .menu .more.active .dot {
        background: transparent
    }

    .menu .more .dot:before,
    .menu .more .dot:after {
        content: "";
        width: 4px;
        height: 4px;
        background: #fff;
        border-radius: 50%;
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        position: absolute;
        top: 50%;
        margin-top: -2px
    }

    .header:not(.primary-background-color) .menu .more:not(.active) .dot,
    .header:not(.primary-background-color) .menu .more .dot:before,
    .header:not(.primary-background-color) .menu .more .dot:after {
        background: #444
    }

    .header.primary-background-color .menu .more:not(.active) .dot,
    .header.primary-background-color .menu .more .dot:before,
    .header.primary-background-color .menu .more .dot:after {
        background: #fff
    }

    .menu .more .dot:before {
        left: -8px
    }

    .menu .more .dot:after {
        left: 8px
    }

    .menu .more.active .dot:before {
        width: 25px;
        height: 2px;
        border-radius: 0;
        -webkit-transition-delay: 0.2s;
        transition-delay: 0.2s;
        -webkit-transform: translate(-15%, 25%) rotate(135deg);
        transform: translate(-15%, 25%) rotate(135deg)
    }

    .menu .more.active .dot:after {
        height: 25px;
        width: 2px;
        border-radius: 0;
        -webkit-transition-delay: 0.2s;
        transition-delay: 0.2s;
        -webkit-transform: translate(-390%, -44%) rotate(135deg);
        transform: translate(-390%, -44%) rotate(135deg)
    }

    .menu .more .dot:nth-child(n+2) {
        display: none
    }

    .menu .widget:not(.has-more-full) .widget-content {
        visibility: hidden;
        position: absolute;
        z-index: 20;
        top: 35px;
        left: 50%;
        border-radius: 4px;
        box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.3);
        -ms-transform: translate(-50%, 0);
        transform: translate(-50%, 0)
    }

    body[data-theme="light"] .menu .widget:not(.has-more-full) .widget-content {
        background: #fff
    }

    .menu .widget:not(.has-more-full) .widget-content:not(.width-more) {
        width: 220px
    }

    .menu .width-more {
        width: 510px
    }

    .menu .widget:not(.has-more-full) .widget-content .dropdown {
        overflow: hidden;
        position: absolute;
        display: block;
        width: 28px;
        height: 14px;
        top: -14px;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .menu .widget:not(.has-more-full) .widget-content .dropdown::after {
        position: absolute;
        display: block;
        width: 14px;
        height: 14px;
        bottom: -7px;
        left: 7px;
        border-radius: 3px 0 0 0;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        content: ""
    }

    .menu .widget:not(.has-more-full):last-child .widget-content {
        left: unset;
        right: 0;
        -ms-transform: unset;
        transform: unset
    }

    body[data-theme="light"] .menu .widget:not(.has-more-full) .widget-content .dropdown::after {
        background: #fff
    }

    .menu .widget:last-child .widget-content .dropdown {
        left: unset;
        right: 5%
    }

    .menu ul {
        list-style-type: none;
        padding: 8px 0;
        margin: 0
    }

    .menu li.item-first-child>label,
    .menu li a {
        display: block;
        padding: 0 20px;
        position: relative;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: 500
    }

    .menu .widget:not(.has-more-full) .widget-content:not(.width-more) li.item-first-child>label,
    .menu .widget:not(.has-more-full) .widget-content:not(.width-more) li>a {
        line-height: 36px
    }

    .menu .width-more li>a {
        line-height: 32px
    }

    .menu .has-more-full .widget-content {
        background: #141329;
        position: fixed;
        left: 0;
        right: 0;
        top: 50px;
        z-index: 15;
        visibility: hidden;
        opacity: 0;
        padding: 20px 50px;
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        max-height: calc(100vh - 50px);
        height: 100%;
        overflow-x: hidden;
        overflow-y: auto
    }

    .menu .has-more-full.active .widget-content {
        visibility: visible;
        opacity: 1
    }

    .menu li.item-first-child>label:after {
        content: '';
        position: absolute;
        left: 20px;
        right: 20px;
        bottom: 0px;
        border-bottom: 1px solid #dfe3e8
    }

    .menu .width-more>ul {
        float: left
    }

    .menu .width-more li {
        float: left;
        width: 33.33%
    }

    .menu .widget:not(.has-more-full):hover .widget-content {
        visibility: visible;
        animation: dropdown-show .3s ease forwards
    }

    .menu .widget:not(.has-more-full):last-child:hover .widget-content {
        animation: dropdown-last-show .3s ease forwards
    }

    @keyframes dropdown-show {
        from {
            opacity: 0;
            transform: translate(-50%, 15px)
        }

        to {
            opacity: 1;
            transform: translate(-50%, 0)
        }
    }

    @keyframes dropdown-last-show {
        from {
            opacity: 0;
            transform: translate(0%, 15px)
        }

        to {
            opacity: 1;
            transform: translate(0%, 0)
        }
    }
}

@media(min-width:960px) {
    .footer-bar {
        height: 44px
    }

    .footer-bar-left,
    .footer-bar-right {
        line-height: 34px
    }

    .footer-bar-left {
        width: 65%
    }

    .footer-bar-right {
        width: 35%
    }
}

@media(min-width:1349px) {
    .banner-col {
        position: fixed;
        top: 50px;
        width: 124.5px;
        height: 550px;
        z-index: 0
    }

    .banner-col-left {
        left: 0
    }

    .banner-col-right {
        right: 0
    }

    .banner-full-height {
        width: 100%;
        height: 100%
    }

    .banner-full-height>div {
        white-space: nowrap;
        letter-spacing: 3px
    }

    .banner-col-left>.banner-full-height>div {
        transform: rotate(-90deg)
    }

    .banner-col-right>.banner-full-height>div {
        transform: rotate(90deg)
    }

    .banner-col.show {
        opacity: 1;
        visibility: visible;
        transition: opacity 1s cubic-bezier(0.4, 0.0, 0.2, 1)
    }

    .banner-col.hide {
        opacity: 0;
        visibility: hidden;
        transition: visibility 0.3s linear, opacity 0.3s linear
    }
}

@media(max-width:1348px) {

    .fullBg,
    .fullBg>div {
        display: none !important
    }
}

@media(min-width:1101px) {
    [data-page-type="post"] main.main {
        width: calc(100% - 350px);
        padding-left: 50px;
        padding-right: 40px
    }

    [data-page-type="post"] aside.sidebar {
        width: 350px;
        padding-right: 50px
    }

    .article-social-pin {
        padding-top: 70px;
        margin-left: -47px
    }
}

@media(max-width:959px) and (min-width:641px) {
    .footer-bar-left>ul {
        justify-content: center
    }
}

@media(max-width:1100px) {
    .container {
        padding-left: 15px;
        padding-right: 15px
    }

    .header>div {
        padding: 0 10px
    }

    [data-page-type="post"][data-view-type="mobile"] .section-bottom {
        background: #f7f7f7
    }

    .footer>div:nth-of-type(2),
    .footer-bar>div {
        padding: 0 15px
    }
}

@media(max-width:959px) {
    .footer-bar {
        padding-bottom: 15px
    }

    .footer-bar>div {
        justify-content: center;
        flex-flow: column
    }

    .footer-bar-left,
    .footer-bar-right {
        width: 100%
    }

    .blog-search form {
        max-width: 414px;
        margin: 0 auto
    }

    .footer-bar-left>ul {
        white-space: nowrap;
        overflow: auto;
        text-align: center;
        line-height: 1.6;
        padding: 10px 0
    }
}

@media(max-width:860px) {
    .hide-for-menium {
        display: none
    }

    .header-middle {
        min-height: 50px
    }

    .header .searchresults-wrapper {
        max-height: calc(100% - 56px)
    }

    .header-widget a.has-img {
        margin-left: 10px
    }

    .header-icon .widget-content>div+div {
        max-height: calc(100vh - 60px)
    }

    .nav-icon button {
        background: transparent;
        padding: 0;
        border: none;
        border-radius: 50%;
        height: 40px;
        width: 40px
    }

    [data-view-type="desktop"] body[data-theme="light"] .nav-icon button:hover,
    [data-view-type="desktop"] body[data-theme="light"] .nav-icon button:focus,
    [data-view-type="desktop"] body[data-theme="light"] .nav-icon button:active {
        background: rgba(60, 64, 67, 0.08)
    }

    .nav-icon button:focus {
        outline: none
    }

    .nav-icon button:before {
        width: 24px;
        height: 24px
    }

    body[data-theme="light"] .header:not(.primary-background-color) .nav-icon button:before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 0 24 24' width='24'%3E%3Cpath fill='%23707070' d='M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z'%3E%3C/path%3E%3C/svg%3E")
    }

    .header.primary-background-color .nav-icon button:before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 0 24 24' width='24'%3E%3Cpath fill='%23fff' d='M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z'%3E%3C/path%3E%3C/svg%3E")
    }

    .menu {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: auto;
        z-index: 30;
        line-height: 20px;
        padding: 0;
        width: 280px;
        min-height: 100%;
        overflow-y: auto;
        border-right: 1px solid rgba(0, 0, 0, 0.12);
        -webkit-transition-property: -webkit-transform;
        transition-property: -webkit-transform;
        transition-property: transform;
        transition-property: transform, -webkit-transform;
        -webkit-transition-duration: .3s;
        transition-duration: .3s;
        -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
        transition-timing-function: cubic-bezier(0, 0, 0.2, 1)
    }

    body[data-theme="light"] .menu {
        background: #fff
    }

    .menu.flex {
        display: block
    }

    .menu.section {
        -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
        transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    .menu>div {
        padding: 0;
        margin: 0;
        display: inherit;
        max-width: unset;
        width: 100%
    }

    body[data-theme="light"] .menu>div>.widget {
        border-bottom: 1px solid rgba(0, 0, 0, 0.12)
    }

    .menu .home>a:nth-of-type(1),
    .menu li>a {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .menu .title:not(.home),
    .menu li>a,
    .menu li>label {
        line-height: 40px
    }

    .menu .title:not(.home) {
        position: relative;
        padding: 0 15px;
        font-size: 95%;
        font-weight: 400
    }

    body[data-theme="light"] .menu .title:not(.home) {
        color: rgba(0, 0, 0, 0.54)
    }

    .menu li>a,
    .menu li>label {
        padding: 0 15px 0 25px;
        font-weight: 500
    }

    .menu .home {
        display: flex;
        align-items: center;
        height: 50px;
        position: relative
    }

    .menu .home>a:nth-of-type(2)>img {
        max-width: 100%;
        height: auto
    }

    .menu .home>button {
        background: transparent;
        margin-left: auto;
        width: 40px;
        height: 40px;
        padding: 0;
        border-radius: 100%;
        border: none;
        outline: none
    }

    .menu .home>button:before {
        width: 21px;
        height: 21px
    }

    body[data-theme="light"] .menu .home>button:before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='21' viewBox='0 0 24 24' width='21'%3E%3Cpath fill='%23444' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z'%3E%3C/path%3E%3C/svg%3E")
    }

    [data-view-type=desktop] .menu .home>button:hover,
    [data-view-type=desktop] .menu .home>button:focus {
        background: rgba(60, 64, 67, 0.08);
        cursor: pointer
    }

    .menu .home>a {
        width: calc(100% - 40px);
        padding-left: 15px;
        line-height: 50px
    }

    .menu .title:not(.home):after {
        content: '';
        width: 8px;
        height: 8px;
        overflow: hidden;
        border: 1px solid;
        border-top-color: transparent;
        border-left-color: transparent;
        position: absolute;
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        box-sizing: border-box;
        top: 17px;
        right: 17px;
        -ms-transform: rotate(-135deg);
        transform: rotate(-135deg);
        transition: all .2s ease-out
    }

    body[data-theme="light"] .menu .title:not(.home):after {
        border-right-color: rgba(0, 0, 0, 0.38);
        border-bottom-color: rgba(0, 0, 0, 0.38)
    }

    .menu .title.has-toggle:after {
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 14px
    }

    [data-view-type=desktop] .menu a:hover {
        text-decoration: none
    }

    [data-view-type=desktop] .menu .title:not(.home):hover {
        cursor: pointer
    }

    [data-view-type=desktop] body[data-theme="light"] .menu li>a:hover {
        background: #E4F0F6
    }

    .menu .title:not(.home)+div {
        transition: max-height .2s cubic-bezier(0.4, 0.0, 0.2, 1);
        overflow: hidden;
        overflow-y: scroll
    }

    [data-view-type=desktop] .menu .title:not(.home)+div::-webkit-scrollbar {
        display: none
    }

    .menu .title:not(.home):not(.has-toggle)+div {
        max-height: 280px
    }

    .menu .title.has-toggle+div {
        max-height: 0px
    }

    .hide-for-medium {
        display: none !important
    }

    .section-top>.Label {
        padding: 0 15px
    }

    .section-top>.has-banner,
    .section-top>.Label,
    main.main>.widget,
    aside.sidebar>.widget,
    .banner-widget {
        margin-bottom: 15px
    }
}

@media(max-width:550px) {
    .article-header .article-title {
        font-size: 1.5em
    }

    .footer .widget:nth-of-type(3)>.widget-content {
        text-align: center
    }

    .hide-for-small {
        display: none !important
    }
}

@media(max-width:480px) {
    header.header {
        position: relative
    }

    .header-widget a {
        padding-left: 10px
    }

    .footer .header-widget a {
        padding-left: 0
    }

    .site-header {
        height: 200px
    }

    .header+div>div:nth-of-type(2) {
        padding-top: 15px
    }

    .header-icon>li+li {
        padding-left: 5px
    }

    .post_snippet {
        display: none
    }

    [data-box-shadow="false"][data-layout="list"] .post {
        margin-bottom: 13px;
        padding-bottom: 13px
    }

    [data-layout="list"] .post_thumb {
        width: 40%
    }

    [data-layout="list"] .post_body {
        width: 60%
    }

    [data-box-shadow="false"][data-layout="list"] .post_body {
        padding-left: 13px
    }

    .post_title>a {
        font-size: 100% !important
    }

    [data-box-shadow="false"][data-layout="list"] .post_title>a,
    [data-layout="grid"] .post_title>a {
        line-height: 1.4
    }
}

@media(max-width:414px) {
    [data-box-shadow="false"][data-layout="list"] .post_title>a {
        -webkit-line-clamp: 3;
        line-height: 1.3
    }

    [data-box-shadow="false"][data-layout="list"] .post_meta {
        line-height: 26px
    }

    .blog-posts .comment-icon,
    .sidebar .comment-icon,
    .RecentPosts .comment-icon,
    .blog-posts .share-icon,
    .sidebar .share-icon,
    .RecentPosts .share-icon {
        display: none
    }

    .footer-bar-right {
        margin-left: 0;
        width: 100%
    }

    .social-sharing-widgets .theme-button.back {
        display: none
    }
}

/* ]]> */