<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Video Việt Báo 24h</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- SCROLL -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.min.js"></script>
<!-- JQUERY COOKIE -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="./">
<img class="img-logo" src="data:image/png;base64,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">
</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li id="open-sidebar" style="">
<a id="dbClick" onclick="controlSiderBar()"><i class="changer fa fa-bars"></i></a>
</li>
</ul>
<form class="navbar-form navbar-left form-search hidden-xs" role="search" method="get" action="">
<div class="input-group">
<input type="text" class="form-control form-search search-ip" placeholder="Tìm kiếm" name="" />
<div class="input-group-btn">
<button class="btn btn-default btn-search" type="submit"><i class="fa fa-search"></i></button>
</div>
</div>
</form>
</div>
</div>
</nav>
<div class="mn-top">
<p class="hidden-xs">
<a class="active-mn-top" href="./">Trang chủ</a>
<a href="#">Mới nhất 24h</a>
<a href="#">Mới nhất tuần</a>
</p>
</div>
<div class="content">
<div class="sidebar left ">
<div class="my-sideber">
<div>
<div class="m-t-60"></div>
<div class="p-10">
<a href="./">
<div class="id-ctgr actv-side">
<i class="fa fa-home"></i>
Trang chủ
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-home"></i>
Thời sự
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-fire"></i>
Thịnh hành nhất tuần
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-fire"></i>
Thịnh hành nhất tháng
</div>
</a>
<h5><i class="fa fa-folder-open"></i> Danh mục</h5>
<hr class="style10">
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Ôtô & Xe
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Thế giới
</div>
</a>
<a href="#">
<div class="id-ctgr item-sub">
<i class="fa fa-play"></i>
Footer
</div>
</a>
</div>
</div>
</div>
</div>
<div class="content hssa m-left">
<div class="container">
<div class="row">
<div class="col-md-10">
<div class="ads-bg-top">
<a target="_blank" href="#">
<img class="img-responsive" width="970" height="250" src="http://placehold.it/970x250">
</a>
</div>
<div class="title-topic">
<span>tin tức mới nhất</span>
</div>
<ul class="list-unstyled video-list-thumbs row">
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
<li class="col-lg-3 col-sm-4 col-xs-6">
<a href="#" title="Claudio Bravo, antes su debut con el Barça en la Liga">
<img src="http://i.ytimg.com/vi/g9Q8yg2owxw/mqdefault.jpg" alt="Barca" class="img-responsive" height="130px" />
<h2>Phím tắt BlackBerry trên KeyOne: truyền thống tuyệt ...</h2>
<i class="fa fa-play-circle-o"></i>
<span class="duration">03:15</span>
<span class="time">1 phút trước</span>
</a>
</li>
</ul>
</div>
</div>
<div class="tool-ft hidden-lg">
<button id="dbClickft" onclick="controlSiderBar()" type="button" class="btn btn-primary btn-circle btn-lg"><i class="fa fa-bars"></i></button>
</div>
</div>
</div>
</div>
<script>
(function($){
$(window).on("load",function(){
$(".my-sideber").mCustomScrollbar({theme:"dark-3"});
});
})(jQuery);
</script>
</body>
</html>
body{
}
a, a:link, a:hover{
text-decoration: none;
}
.search-ip{
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.form-search {
border-radius: 0;
max-width: 600px;
min-width: 450px;
}
.btn-search{
border-radius: 0;
padding-right: 40px;
padding-left: 40px;
}
.img-logo {
height: 50px;
margin-top: -16px;
}
.mn-top{
background-color: #fff;
padding-top: 63px;
padding-bottom: 3px;
text-align: center;
font-size: 1.1em;
}
.mn-top a{
color: #666;
margin-left: 10px;
padding-bottom: 13px;
}
.mn-top a:hover{
border-bottom: 3px solid #cc181e;
}
.sidebar.left {
position: fixed;
top: 0;
left: 0;
z-index: 1;
bottom: 0;
width: 220px;
background: #ffffff;
-webkit-box-shadow: 1px 0px 11px 0px rgba(50, 50, 50, 0.2);
-moz-box-shadow: 1px 0px 11px 0px rgba(50, 50, 50, 0.2);
box-shadow: 1px 0px 11px 0px rgba(50, 50, 50, 0.2);
}
.m-t-60 {
margin-top: 63px;
}
.p-10 {
padding: 10px;
}
.actv-side {
background-color: #cc181e;
color: #fff;
}
.id-ctgr {
padding: 7px 5px;
margin-bottom: 3px;
}
.id-ctgr:hover {
background-color: #222;
}
.id-ctgr:hover i{
margin-right: 8px;
}
.item-sub{
background-color: #fff;
color: #000;
}
.item-sub:hover{
color: #fff;
}
.style10 {
padding: 0px 0;
}
.my-sideber{
height: 890px;
overflow-y: auto;
}
@media (min-width: 1200px){
.m-left {
margin-left: 232px;
}
}
.content {
margin-top: 15px;
}
.tool-ft{
cursor: pointer;
position: fixed;
bottom: 20px;
right: 20px;
display:block;
}
.btn-circle {
width: 30px;
height: 30px;
text-align: center;
padding: 6px 0;
font-size: 12px;
line-height: 1.428571429;
border-radius: 15px;
}
.btn-circle.btn-lg {
width: 50px;
height: 50px;
padding: 10px 16px;
font-size: 18px;
line-height: 1.33;
border-radius: 25px;
}
.btn-circle.btn-xl {
width: 70px;
height: 70px;
padding: 10px 16px;
font-size: 24px;
line-height: 1.33;
border-radius: 35px;
}
/* VIDEO API CSS */
.video-list-thumbs{}
.video-list-thumbs > li{
margin-bottom:12px
}
.video-list-thumbs > li:last-child{}
.video-list-thumbs > li > a{
display:block;
position:relative;
background-color: #212121;
color: #fff;
padding: 0px;
}
.video-list-thumbs > li > a:hover{
background-color:#000;
transition:all 500ms ease;
box-shadow:0 2px 4px rgba(0,0,0,.3);
text-decoration:none
}
.video-list-thumbs li h2{
font-size: 13px;
padding-bottom: 4px !important;
text-align: center;
margin: 5px 2px 3px 0;
line-height:18px;
overflow:hidden;
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-flex:1;
-webkit-box-orient:vertical
}
.video-list-thumbs .fa-play-circle-o{
font-size: 60px;
opacity: 0.2;
position: absolute;
right: 39%;
top: 31%;
text-shadow: 0 1px 3px rgba(0,0,0,.5);
}
.video-list-thumbs > li > a:hover .fa-play-circle-o{
color:#fff;
opacity:1;
text-shadow:0 1px 3px rgba(0,0,0,.8);
transition:all 500ms ease;
}
.video-list-thumbs .time{
background-color: rgba(0, 200, 240, 0.8);
color: #fff;
font-size: 11px;
font-weight: bold;
right: 0;
line-height: 13px;
padding: 4px;
position: absolute;
bottom: 44px;
}
.video-list-thumbs .duration{
background-color: rgba(0, 0, 0, 0.6);
border-radius: 2px;
color: #fff;
font-size: 11px;
font-weight: bold;
left: 8px;
line-height: 13px;
padding: 4px;
position: absolute;
top: 8px;
}
.video-list-thumbs > li > a:hover .duration{
background: rgba(184, 44, 44, 0.9);
transition:all 500ms ease;
}
@media (min-width:320px) and (max-width: 480px) {
.video-list-thumbs .fa-play-circle-o{
font-size: 35px;
right: 36%;
top: 27%;
}
.video-list-thumbs h2{
bottom: 0;
padding: 3px;
font-size: 12px;
height: 22px;
margin: 8px 0 0;
}
}
/* END */
@media (max-width: 1200px){
.sidebar{
display: none;
}
}
.active-mn-top{
border-bottom: 3px solid #cc181e;
color: #333 !important;
font-weight: 600;
}
.ads-bg-top{
margin-bottom: 28px;
}
.title-topic span{
font-size: 18px;
-moz-text-transform: uppercase;
-webkit-text-transform: uppercase;
text-transform: uppercase;
color: #333;
}
.title-topic{
margin-bottom: 7px;
}
.pace {
-webkit-pointer-events: none;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none
}
.pace-inactive {
display: none
}
.pace .pace-progress {
background: #cc181e;
position: fixed;
z-index: 100000;
top: 0;
right: 100%;
width: 100%;
height: 2px
}
function controlSiderBar() {
$(".sidebar.left").css({"display": "none"});
$(".hssa").removeClass( "m-left" );
$(".changer").removeClass( "fa-times" ).addClass("fa-bars");
//Star
//$(".col-md-10").removeClass( "col-md-10" ).addClass("col-md-12");
//End
$('#dbClick').dblclick(function () {
$(".sidebar.left").css({"display": "block"});
$(".hssa").addClass( "m-left" );
$(".changer").removeClass( "fa-bars" ).addClass("fa-times");
//Star
//$(".col-md-12").removeClass( "col-md-10" ).addClass("col-md-10");
//End
});
$('#dbClickft').dblclick(function () {
$(".sidebar.left").css({"display": "block"});
$(".hssa").addClass( "m-left" );
});
}
(function(){var t,e,n,r,s,o,i,a,u,c,l,p,h,f,d,g,m,y,v,w,b,k,S,q,L,x,T,R,P,E,M,j,A,N,O,_,F,C,U,W,X,D,H,I,z,G,B,J,K,Q=[].slice,V={}.hasOwnProperty,Y=function(t,e){function n(){this.constructor=t}for(var r in e)V.call(e,r)&&(t[r]=e[r]);return n.prototype=e.prototype,t.prototype=new n,t.__super__=e.prototype,t},Z=[].indexOf||function(t){for(var e=0,n=this.length;n>e;e++)if(e in this&&this[e]===t)return e;return-1};for(b={catchupTime:100,initialRate:.03,minTime:250,ghostTime:100,maxProgressPerFrame:20,easeFactor:1.25,startOnPageLoad:!0,restartOnPushState:!0,restartOnRequestAfter:500,target:"body",elements:{checkInterval:100,selectors:["body"]},eventLag:{minSamples:10,sampleCount:3,lagThreshold:3},ajax:{trackMethods:["GET"],trackWebSockets:!0,ignoreURLs:[]}},P=function(){var t;return null!=(t="undefined"!=typeof performance&&null!==performance&&"function"==typeof performance.now?performance.now():void 0)?t:+new Date},M=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame,w=window.cancelAnimationFrame||window.mozCancelAnimationFrame,null==M&&(M=function(t){return setTimeout(t,50)},w=function(t){return clearTimeout(t)}),A=function(t){var e,n;return e=P(),(n=function(){var r;return r=P()-e,r>=33?(e=P(),t(r,function(){return M(n)})):setTimeout(n,33-r)})()},j=function(){var t,e,n;return n=arguments[0],e=arguments[1],t=3<=arguments.length?Q.call(arguments,2):[],"function"==typeof n[e]?n[e].apply(n,t):n[e]},k=function(){var t,e,n,r,s,o,i;for(e=arguments[0],r=2<=arguments.length?Q.call(arguments,1):[],o=0,i=r.length;i>o;o++)if(n=r[o])for(t in n)V.call(n,t)&&(s=n[t],null!=e[t]&&"object"==typeof e[t]&&null!=s&&"object"==typeof s?k(e[t],s):e[t]=s);return e},m=function(t){var e,n,r,s,o;for(n=e=0,s=0,o=t.length;o>s;s++)r=t[s],n+=Math.abs(r),e++;return n/e},q=function(t,e){var n,r,s;if(null==t&&(t="options"),null==e&&(e=!0),s=document.querySelector("[data-pace-"+t+"]")){if(n=s.getAttribute("data-pace-"+t),!e)return n;try{return JSON.parse(n)}catch(o){return r=o,"undefined"!=typeof console&&null!==console?console.error("Error parsing inline pace options",r):void 0}}},i=function(){function t(){}return t.prototype.on=function(t,e,n,r){var s;return null==r&&(r=!1),null==this.bindings&&(this.bindings={}),null==(s=this.bindings)[t]&&(s[t]=[]),this.bindings[t].push({handler:e,ctx:n,once:r})},t.prototype.once=function(t,e,n){return this.on(t,e,n,!0)},t.prototype.off=function(t,e){var n,r,s;if(null!=(null!=(r=this.bindings)?r[t]:void 0)){if(null==e)return delete this.bindings[t];for(n=0,s=[];n<this.bindings[t].length;)s.push(this.bindings[t][n].handler===e?this.bindings[t].splice(n,1):n++);return s}},t.prototype.trigger=function(){var t,e,n,r,s,o,i,a,u;if(n=arguments[0],t=2<=arguments.length?Q.call(arguments,1):[],null!=(i=this.bindings)?i[n]:void 0){for(s=0,u=[];s<this.bindings[n].length;)a=this.bindings[n][s],r=a.handler,e=a.ctx,o=a.once,r.apply(null!=e?e:this,t),u.push(o?this.bindings[n].splice(s,1):s++);return u}},t}(),c=window.Pace||{},window.Pace=c,k(c,i.prototype),E=c.options=k({},b,window.paceOptions,q()),B=["ajax","document","eventLag","elements"],H=0,z=B.length;z>H;H++)F=B[H],E[F]===!0&&(E[F]=b[F]);u=function(t){function e(){return J=e.__super__.constructor.apply(this,arguments)}return Y(e,t),e}(Error),e=function(){function t(){this.progress=0}return t.prototype.getElement=function(){var t;if(null==this.el){if(t=document.querySelector(E.target),!t)throw new u;this.el=document.createElement("div"),this.el.className="pace pace-active",document.body.className=document.body.className.replace(/pace-done/g,""),document.body.className+=" pace-running",this.el.innerHTML='<div class="pace-progress">\n <div class="pace-progress-inner"></div>\n</div>\n<div class="pace-activity"></div>',null!=t.firstChild?t.insertBefore(this.el,t.firstChild):t.appendChild(this.el)}return this.el},t.prototype.finish=function(){var t;return t=this.getElement(),t.className=t.className.replace("pace-active",""),t.className+=" pace-inactive",document.body.className=document.body.className.replace("pace-running",""),document.body.className+=" pace-done"},t.prototype.update=function(t){return this.progress=t,this.render()},t.prototype.destroy=function(){try{this.getElement().parentNode.removeChild(this.getElement())}catch(t){u=t}return this.el=void 0},t.prototype.render=function(){var t,e,n,r,s,o,i;if(null==document.querySelector(E.target))return!1;for(t=this.getElement(),r="translate3d("+this.progress+"%, 0, 0)",i=["webkitTransform","msTransform","transform"],s=0,o=i.length;o>s;s++)e=i[s],t.children[0].style[e]=r;return(!this.lastRenderedProgress||this.lastRenderedProgress|0!==this.progress|0)&&(t.children[0].setAttribute("data-progress-text",""+(0|this.progress)+"%"),this.progress>=100?n="99":(n=this.progress<10?"0":"",n+=0|this.progress),t.children[0].setAttribute("data-progress",""+n)),this.lastRenderedProgress=this.progress},t.prototype.done=function(){return this.progress>=100},t}(),a=function(){function t(){this.bindings={}}return t.prototype.trigger=function(t,e){var n,r,s,o,i;if(null!=this.bindings[t]){for(o=this.bindings[t],i=[],r=0,s=o.length;s>r;r++)n=o[r],i.push(n.call(this,e));return i}},t.prototype.on=function(t,e){var n;return null==(n=this.bindings)[t]&&(n[t]=[]),this.bindings[t].push(e)},t}(),D=window.XMLHttpRequest,X=window.XDomainRequest,W=window.WebSocket,S=function(t,e){var n,r,s,o;o=[];for(r in e.prototype)try{s=e.prototype[r],o.push(null==t[r]&&"function"!=typeof s?t[r]=s:void 0)}catch(i){n=i}return o},T=[],c.ignore=function(){var t,e,n;return e=arguments[0],t=2<=arguments.length?Q.call(arguments,1):[],T.unshift("ignore"),n=e.apply(null,t),T.shift(),n},c.track=function(){var t,e,n;return e=arguments[0],t=2<=arguments.length?Q.call(arguments,1):[],T.unshift("track"),n=e.apply(null,t),T.shift(),n},_=function(t){var e;if(null==t&&(t="GET"),"track"===T[0])return"force";if(!T.length&&E.ajax){if("socket"===t&&E.ajax.trackWebSockets)return!0;if(e=t.toUpperCase(),Z.call(E.ajax.trackMethods,e)>=0)return!0}return!1},l=function(t){function e(){var t,n=this;e.__super__.constructor.apply(this,arguments),t=function(t){var e;return e=t.open,t.open=function(r,s){return _(r)&&n.trigger("request",{type:r,url:s,request:t}),e.apply(t,arguments)}},window.XMLHttpRequest=function(e){var n;return n=new D(e),t(n),n};try{S(window.XMLHttpRequest,D)}catch(r){}if(null!=X){window.XDomainRequest=function(){var e;return e=new X,t(e),e};try{S(window.XDomainRequest,X)}catch(r){}}if(null!=W&&E.ajax.trackWebSockets){window.WebSocket=function(t,e){var r;return r=null!=e?new W(t,e):new W(t),_("socket")&&n.trigger("request",{type:"socket",url:t,protocols:e,request:r}),r};try{S(window.WebSocket,W)}catch(r){}}}return Y(e,t),e}(a),I=null,L=function(){return null==I&&(I=new l),I},O=function(t){var e,n,r,s;for(s=E.ajax.ignoreURLs,n=0,r=s.length;r>n;n++)if(e=s[n],"string"==typeof e){if(-1!==t.indexOf(e))return!0}else if(e.test(t))return!0;return!1},L().on("request",function(e){var n,r,s,o,i;return o=e.type,s=e.request,i=e.url,O(i)?void 0:c.running||E.restartOnRequestAfter===!1&&"force"!==_(o)?void 0:(r=arguments,n=E.restartOnRequestAfter||0,"boolean"==typeof n&&(n=0),setTimeout(function(){var e,n,i,a,u,l;if(e="socket"===o?s.readyState<2:0<(a=s.readyState)&&4>a){for(c.restart(),u=c.sources,l=[],n=0,i=u.length;i>n;n++){if(F=u[n],F instanceof t){F.watch.apply(F,r);break}l.push(void 0)}return l}},n))}),t=function(){function t(){var t=this;this.elements=[],L().on("request",function(){return t.watch.apply(t,arguments)})}return t.prototype.watch=function(t){var e,n,r,s;return r=t.type,e=t.request,s=t.url,O(s)?void 0:(n="socket"===r?new f(e):new d(e),this.elements.push(n))},t}(),d=function(){function t(t){var e,n,r,s,o,i,a=this;if(this.progress=0,null!=window.ProgressEvent)for(n=null,t.addEventListener("progress",function(t){return a.progress=t.lengthComputable?100*t.loaded/t.total:a.progress+(100-a.progress)/2},!1),i=["load","abort","timeout","error"],r=0,s=i.length;s>r;r++)e=i[r],t.addEventListener(e,function(){return a.progress=100},!1);else o=t.onreadystatechange,t.onreadystatechange=function(){var e;return 0===(e=t.readyState)||4===e?a.progress=100:3===t.readyState&&(a.progress=50),"function"==typeof o?o.apply(null,arguments):void 0}}return t}(),f=function(){function t(t){var e,n,r,s,o=this;for(this.progress=0,s=["error","open"],n=0,r=s.length;r>n;n++)e=s[n],t.addEventListener(e,function(){return o.progress=100},!1)}return t}(),r=function(){function t(t){var e,n,r,o;for(null==t&&(t={}),this.elements=[],null==t.selectors&&(t.selectors=[]),o=t.selectors,n=0,r=o.length;r>n;n++)e=o[n],this.elements.push(new s(e))}return t}(),s=function(){function t(t){this.selector=t,this.progress=0,this.check()}return t.prototype.check=function(){var t=this;return document.querySelector(this.selector)?this.done():setTimeout(function(){return t.check()},E.elements.checkInterval)},t.prototype.done=function(){return this.progress=100},t}(),n=function(){function t(){var t,e,n=this;this.progress=null!=(e=this.states[document.readyState])?e:100,t=document.onreadystatechange,document.onreadystatechange=function(){return null!=n.states[document.readyState]&&(n.progress=n.states[document.readyState]),"function"==typeof t?t.apply(null,arguments):void 0}}return t.prototype.states={loading:0,interactive:50,complete:100},t}(),o=function(){function t(){var t,e,n,r,s,o=this;this.progress=0,t=0,s=[],r=0,n=P(),e=setInterval(function(){var i;return i=P()-n-50,n=P(),s.push(i),s.length>E.eventLag.sampleCount&&s.shift(),t=m(s),++r>=E.eventLag.minSamples&&t<E.eventLag.lagThreshold?(o.progress=100,clearInterval(e)):o.progress=100*(3/(t+3))},50)}return t}(),h=function(){function t(t){this.source=t,this.last=this.sinceLastUpdate=0,this.rate=E.initialRate,this.catchup=0,this.progress=this.lastProgress=0,null!=this.source&&(this.progress=j(this.source,"progress"))}return t.prototype.tick=function(t,e){var n;return null==e&&(e=j(this.source,"progress")),e>=100&&(this.done=!0),e===this.last?this.sinceLastUpdate+=t:(this.sinceLastUpdate&&(this.rate=(e-this.last)/this.sinceLastUpdate),this.catchup=(e-this.progress)/E.catchupTime,this.sinceLastUpdate=0,this.last=e),e>this.progress&&(this.progress+=this.catchup*t),n=1-Math.pow(this.progress/100,E.easeFactor),this.progress+=n*this.rate*t,this.progress=Math.min(this.lastProgress+E.maxProgressPerFrame,this.progress),this.progress=Math.max(0,this.progress),this.progress=Math.min(100,this.progress),this.lastProgress=this.progress,this.progress},t}(),C=null,N=null,y=null,U=null,g=null,v=null,c.running=!1,x=function(){return E.restartOnPushState?c.restart():void 0},null!=window.history.pushState&&(G=window.history.pushState,window.history.pushState=function(){return x(),G.apply(window.history,arguments)}),null!=window.history.replaceState&&(K=window.history.replaceState,window.history.replaceState=function(){return x(),K.apply(window.history,arguments)}),p={ajax:t,elements:r,document:n,eventLag:o},(R=function(){var t,n,r,s,o,i,a,u;for(c.sources=C=[],i=["ajax","elements","document","eventLag"],n=0,s=i.length;s>n;n++)t=i[n],E[t]!==!1&&C.push(new p[t](E[t]));for(u=null!=(a=E.extraSources)?a:[],r=0,o=u.length;o>r;r++)F=u[r],C.push(new F(E));return c.bar=y=new e,N=[],U=new h})(),c.stop=function(){return c.trigger("stop"),c.running=!1,y.destroy(),v=!0,null!=g&&("function"==typeof w&&w(g),g=null),R()},c.restart=function(){return c.trigger("restart"),c.stop(),c.start()},c.go=function(){var t;return c.running=!0,y.render(),t=P(),v=!1,g=A(function(e,n){var r,s,o,i,a,u,l,p,f,d,g,m,w,b,k,S;for(p=100-y.progress,s=g=0,o=!0,u=m=0,b=C.length;b>m;u=++m)for(F=C[u],d=null!=N[u]?N[u]:N[u]=[],a=null!=(S=F.elements)?S:[F],l=w=0,k=a.length;k>w;l=++w)i=a[l],f=null!=d[l]?d[l]:d[l]=new h(i),o&=f.done,f.done||(s++,g+=f.tick(e));return r=g/s,y.update(U.tick(e,r)),y.done()||o||v?(y.update(100),c.trigger("done"),setTimeout(function(){return y.finish(),c.running=!1,c.trigger("hide")},Math.max(E.ghostTime,Math.max(E.minTime-(P()-t),0)))):n()})},c.start=function(t){k(E,t),c.running=!0;try{y.render()}catch(e){u=e}return document.querySelector(".pace")?(c.trigger("start"),c.go()):setTimeout(c.start,50)},"function"==typeof define&&define.amd?define(function(){return c}):"object"==typeof exports?module.exports=c:E.startOnPageLoad&&c.start()}).call(this);
