/* Phần css reset */
@font-face {
  font-family: 'NoticiaText-Regular';
  src: url(../font/NoticiaText-Regular.ttf);
}
@font-face {
  font-family: 'NoticiaText-Italic';
  src: url(../font/NoticiaText-Italic.ttf);
}
@font-face {
  font-family: 'NoticiaText-Bold';
  src: url(../font/NoticiaText-Bold.ttf);
}
@font-face {
  font-family: 'NoticiaText-BoldItalic';
  src: url(../font/NoticiaText-BoldItalic.ttf);
}


* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

*:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

html, body {margin: 0; padding: 0; font-family: 'NoticiaText-Regular', sans-serif; font-size: 18px; color: #000; line-height: 1.6}
header, section, footer, aside, nav, main, article, figure, figcaption, mark, summary, time, details {display: block; margin: 0}
button, input, textarea {font-family: 'NoticiaText-Regular', sans-serif; font-size: 18px}
h1, h2, h3, h4, h5, h6, b, strong {font-family: 'NoticiaText-Bold', sans-serif; font-size: inherit; line-height: 1.4}
blockquote {font-family: 'NoticiaText-BoldItalic', sans-serif;}
.uk-container {max-width: 1180px; padding: 0 20px}
.uk-grid {margin-left: -20px}
.uk-grid>* {padding-left: 20px}
*+.uk-grid-margin, .uk-grid+.uk-grid, .uk-grid>.uk-grid-margin {margin-top: 20px}
.uk-radio {height: 12px; width: 12px; margin-right: 2px; position: relative; top: 1px}
.uk-radio:checked {background-color: #0066b3}
.uk-box-shadow-small {box-shadow: 0 1px 3px rgba(0,0,0,.1)}



/* Transition */
{
-webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

/* Bắt đầu trang long reads */
#header-longreads {float: left; width: 100%; background: #555; padding: 8px 20px 5px}
#header-longreads a:hover {color: #fff}
.tt-longreads {text-align: center; color: #fff}
.home-longreads {float: left; color: #fff; font-family: 'Arial', sans-serif; font-size: 16px; position: relative; top: 3px} 
.home-longreads .icon-home {margin-right: 5px; position: relative; top: -2px}
.share-longreads {text-align: right}
.share-longreads ul {margin: 0; padding: 0}
.share-longreads ul li {display: inline-block; margin-right: 3px}
.share-longreads ul li:last-child {margin-right: 0}
.icon {display: inline-flex; width: 25px; height: 25px; align-items: center; justify-content: center; position: relative}
.icon-tw {top: 1px}
.icon-mail {top: 3px}
.main-longreads h1 img {width: 100%}
.main-longreads h2 {font-size: 20px}
.main-longreads h2, .main-longreads .article-content-main {max-width: 680px; margin: 20px auto}
.main-longreads .article-content-main {font-family: 'NoticiaText-Regular', sans-serif !important;}
.main-longreads h2:after {content: ""; width: 200px; height: 1px; background-color: #d0d0d0; margin: 50px auto; display: block}
.main-longreads figure[style*="inline-block"] {width: 980px; margin: 20px -50%; text-align: center}
.main-longreads figure[style*="left"] { margin: 0 20px 10px -50%}
.main-longreads figure[style*="right"] { margin: 0 -50% 10px 20px; text-align: right}
.main-longreads figure img {width: 100%!important;}
.main-longreads blockquote {max-width: 500px; margin: 0 auto 10px; font-family: 'NoticiaText-Bold', sans-serif; font-size: 1.25rem; line-height: 130%; font-style: italic; border-left: solid 5px #36b380; padding-left: 20px;}
.main-longreads .simplebox {background: #fff0ce; padding: 20px; margin-bottom: 10px; border: solid 1px #e6d6b0; font-family: 'NoticiaText-Bold', sans-serif; line-height: 130%;}
figure.image figcaption {color: #000000; margin-top: 10px; margin-bottom: 10px; font-style: italic; font-size: 0.85rem; line-height: 130%;}
.credit-longreads {position: relative; padding-top: 20px; max-width: 680px; margin: 50px auto; text-align: center}
.credit-longreads:before {content: ""; position: absolute; top: 0; left: 50%; right: 50%; width: 50px; height: 1px; background: #ccc; margin-left: -25px}
.credit-longreads p {margin: 0 0 2px}
.credit-longreads p.author-longreads {font-family: 'NoticiaText-Bold', sans-serif;}
.credit-longreads p.support-longreads {color: #999; font-size: 16px}
.related-longreads {margin-bottom: 30px}
.related-tt-longreads {text-align: center; font-size: 32px; color: #36b380}
.related-tt-longreads span:before, .related-tt-longreads span:after {content: ""; display: inline-block; width: 20px; height: 2px; background: #36b380; margin: 0 15px}
.item-longreads {display: block; color: #000}
.item-longreads:hover {color: #000}
.thumb-longreads {display: block; height: 250px; overflow: hidden}
.thumb-longreads img {min-height: 100%}
.tt-item-longreads {margin: 10px 0 0; font-size: 18px}
.first-letter:first-letter {font-size: 4em; float: left; margin-right: 15px; line-height: 0.8em}

/* update 25/09/2020 */
.article-content-main em {color: #000}
.main-longreads h1:nth-child(2) {margin-top: 0}
@media only screen and (max-width: 980px) 
{
    .main-longreads figure[style*="inline-block"] {width: 100%}
    }