@font-face {
    font-family: 'Montserrat-Regular';
    src: url('Montserrat-Regular.otf')/*tpa=http://locphat.odanang.com/wp-content/themes/HB20160930/fonts/Montserrat-Regular.otf*/;
    src: url('Montserrat-Regular.ttf')/*tpa=http://locphat.odanang.com/wp-content/themes/HB20160930/fonts/Montserrat-Regular.ttf*/ format('truetype');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Montserrat-SemiBold';
    src: url('Montserrat-SemiBold.otf')/*tpa=http://locphat.odanang.com/wp-content/themes/HB20160930/fonts/Montserrat-SemiBold.otf*/;
    src: url('Montserrat-SemiBold.ttf')/*tpa=http://locphat.odanang.com/wp-content/themes/HB20160930/fonts/Montserrat-SemiBold.ttf*/ format('truetype');
    font-weight: normal;
    font-style: normal;
}


.tm-danh-muc{border: 1px solid #e1eaee; margin-bottom: 40px;}
.tm-danh-muc h3{font: 400 14px/24px 'Montserrat-SemiBold', sans-serif; color: #fff; text-transform: uppercase; padding: 12px 20px 10px; background: #3c7d9d; margin: -1px;}
.tm-danh-muc h3 i{background: url(sprite-10.png)/*tpa=http://locphat.odanang.com/wp-content/themes/HB20160930/images/front/sprite-10.png*/ no-repeat;width: 9px; height: 12px; display: inline-block; background-position: -163px -140px; vertical-align: middle; margin-right: 8px;}
.tm-danh-muc ul li a{border-top: 1px solid #e1eaee; font: 400 14px/20px 'Roboto', sans-serif; color: #444; padding: 14px 20px 12px 30px; display: block;position: relative; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease}
.tm-danh-muc ul li a:hover{color: #ff0000;}
.tm-danh-muc ul li a:before {content: ''; display: inline-block; width: 6px; height: 6px; background: #3c7d9d; transform: rotate(45deg); position: absolute; top: 20px; left: 15px; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease}
.tm-danh-muc ul li a:hover:before {background: #ff0000;-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);border-radius: 50%;}
.sidebar ul.list-pro{margin: 0 -15px;}
.sidebar ul.list-pro li{padding: 0 15px; float: left; width: 100%; margin-bottom: 25px;}
.sidebar ul.list-pro li a.img{display: block; overflow: hidden; height: 200px; background: #008cdc;}
.sidebar ul.list-pro li a.img img{width: 100%; height: 100%;}
.sidebar ul.list-pro li h3{overflow: hidden; margin: 10px 0 5px;}
.sidebar ul.list-pro li h3 a{font: 500 15px/20px 'Roboto', sans-serif; color: #333;}
.sidebar ul.list-pro li p{font: 400 13px/20px 'Roboto', sans-serif; color: #555; margin-bottom: 5px;}
.sidebar ul.list-pro li span{font: 400 13px/20px 'Roboto', sans-serif; color: #9c9c9c; display: block;}
.sidebar ul.list-pro li h3 a:hover {color: #ff0000}

.news-related{}
.news-related ul.list-news li{width: 100%;}
.detail-news{margin-bottom: 30px}
.detail-news h3{font: 400 18px/24px 'Montserrat-SemiBold', sans-serif; color: #ff0000; text-transform: uppercase; margin-bottom: 10px;}
.detail-news div.text-center{margin: 25px 0;}
.detail-news p{font: 400 13px/20px 'Roboto', sans-serif; color: #555; margin-bottom: 15px;}
.detail-news span{font: 400 13px/20px 'Roboto', sans-serif; color: #9c9c9c;}
.detail-news ul.tm-social{margin: 20px 0 30px;}

/*EFFECT*/
.sidebar ul.list-pro li a.img {display: block;position: relative;overflow: hidden;}
.sidebar ul.list-pro li a.img::before {position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); }
.sidebar ul.list-pro li a.img:hover::before {-webkit-animation: shine 2s; animation: shine 2s; }
@-webkit-keyframes shine {100% {left: 125%; } }
@keyframes shine {100% {left: 125%; } }