/* Transitions */
i { z-index:auto;}
table.top { margin-top:5px;} /* hangmoive,xuathangmoi */
table.top .header { height:35px; text-align:center; font-size:16px;}
table.thongkehang {  background-color: White; border:1px solid #bbbbbb;}
table.thongkehang th,table.thongkehang td  { padding: 2px; padding-left:6px; border:1px solid #eeeeee;}
table.thongkehang th { text-align:center; width:100px;}
table.thongkehang td {width:45px;}
div.thongkehang 

.align-center { text-align:center;}
.animated.s02 { -webkit-animation-duration: 0.2s !important;  animation-duration: 0.2s !important;}
.animated.s04 { -webkit-animation-duration: 0.4s !important;  animation-duration: 0.4s !important;}
.animated.s06 { -webkit-animation-duration: 0.6s !important;  animation-duration: 0.6s !important;}
.animated.s08 { -webkit-animation-duration: 0.8s !important;  animation-duration: 0.8s !important;}
.animated.s10 { -webkit-animation-duration: 1s !important;  animation-duration: 1s !important;}
.animated.s12 { -webkit-animation-duration: 1.2s !important;  animation-duration: 1.2s !important;}
.animated.s14 { -webkit-animation-duration: 1.4s !important;  animation-duration: 1.4s !important;}
.animated.s16 { -webkit-animation-duration: 1.6s !important;  animation-duration: 1.6s !important;}
.animated.s99 { -webkit-animation-duration: 9s !important;  animation-duration: 9s !important;}
.animated.blurout {-webkit-animation-duration: 3s !important;  animation-duration: 3s !important; animation-name: blurout;}
.addbox, .clientinfobox {position: fixed;left: 0; right:0; top: 160px;max-width: 340px;margin:auto; z-index:51;}  
.clientinfobox { width:auto; max-width:450px;  display:none;}

.addbox textarea { margin-bottom:10px; height:100px;}
.bigtag { display: inline-block; width:200px; vertical-align: middle ; border: 1px solid #666; margin:0px; position: relative;}

.btkholeft, .btkhoright {width:16px;cursor:pointer; display:inline-block; position:relative; background-size:16px 17px; height:17px;background-repeat:no-repeat;}
.btkholeft {background-image:url(/images/iconleftdark.png);}
.btkhoright {background-image:url(/images/iconrightdark.png);}
.btkholeft:hover {background-image:url(/images/iconleft.png);}
.btkhoright:hover {background-image:url(/images/iconright.png);}



.barcode39 > span:first-child {font-family:WebCode39;}
.barcode39 > span { display: block;}
.barcode128 { }
.barcode128 > span { display:block; border:0px solid #000;}
.barcode128 > span.barcode {font-weight: normal;font-style: normal;line-height: normal;font-family: 'WebCode128', sans-serif; display:block;}
.barcode128 > span.bookname {font-size: 12px;font-weight: bold;font-family: Arial;margin-bottom: 2px;}
.barcode128 > span.sizesl {font-family: Arial;font-size: 12px; display:inline-block; width:50px;font-weight: bold;}
.barcode128 > span.number {font-family: Arial;font-size: 12px;display:inline-block;width:90px; text-align:right;font-weight: bold;}
.barcode128 > span.hdmh {font-family: Arial;font-size: 14px;display:block;text-align:center; font-weight:bold;}
.barcode128x > span {font-weight: normal;font-style: normal;line-height: normal;font-family: 'code128';}

.barcodetag {width:150px;display: block; padding:15px 0px 0px 20px;}

.bold { font-weight:bold;}
.carousel-caption {padding-bottom: 10px;}
.carousel-indicators { bottom:0px;  margin-bottom: 5px;}
.carousel-indicators .active { background-color:Aqua;}
.carousel-indicators li { border-color: #333;}
.centered {  margin: auto;  right: 0;  left: 0;}
.color-red { color:#f00 !important;}
.color-blue { color:#00f !important;}
.color-orage {color:#f39c12 !important; }
.color-primary {color:#367fa9 !important; }
.color-gray { color:Gray;}

.chart-table { width:100%; max-width:600px; font-size:12px;}
.chart-table > .header { padding: 5px 10px;    font-size: 15px;    font-weight: bold;}
.chart-table > table { margin-bottom:0px;}
.chart-table > table > thead > tr > th { padding: 5px 10px; text-align:center;}

.edithangmoisize > div { vertical-align:top;}

.mychart { width:100%; font-size:12px; font-weight:normal;}
.mychart td { text-align:left; padding:2px 0px;} 
.mychart td:first-child { width:130px;}
.mychart div.charbarparent { width:100%;} 
.mychart div.charbar { height:100%; display:inline-block; color:#fff; margin:0px;}

.flat {border-radius:0px;}
.cot-2 { display:inline-block !important;  width:49.5%;}

.inline-box { display: inline-block ! important;}
.item-hinh-shopcart { width:48px; text-align:center ;}
.item-hinh-shopcart img { width:40px; border:0px; }
.input.update-icon > i { color: #ee0000;vertical-align: sub; opacity:0;    position: relative;    left: -25px; top:0.5px; width:0PX;}
.lbl1 { font-size: small;}
.lbl2 { font-size: medium; height: 28px; vertical-align: vertical-align: middle;}
.lbl3 { font-size: large;}
.lblline { display:block;}
.lblucase { text-transform: uppercase ;}
.lbllink {   cursor:pointer; color:#3685F4;}
.lbllink:hover { color:#F46936;}
.liner { height:5px;}

.listhang .ngay { width:100px; text-align:center;}
.listhang .chinhanh { width:30px; text-align:center;}
.listhang .trangthai { text-align:center; width:210px;}
.listhang .loailayhang { vertical-align:middle; text-align:center; width:30px;}
.listhang .loailayhang img { height:20px;}
.listhang .mahang {font-weight:bold;/* padding-right:10px; */vertical-align:middle;} /* khong duoc de padding right anh huong so luong ben nhat ky san pham */
.listhang .mahang .insidestock { font-weight:normal;}
.listhang .action { vertical-align:middle; text-align:center; width:50px;}

.login-dropdown-menu {border: 0px solid #ddd; border-radius: 0px; width:160px; left:-80px; top:35px; padding:0px;box-shadow: 0 0 8px rgba(0, 0, 0, .5);}
.login-dropdown-menu .menu-item {display: block;color: #999;padding: 4px 8px; cursor:pointer;}
.login-dropdown-menu .menu-item:hover { background-color:#4D90FE; color:#fff;}
.menu {border:0px solid #000; padding:0px; margin-top:0px; position:absolute; } 
.menu .title {margin: 0;	font-weight: 300;	background: #0d77b6; display:block;}
.menu .menu-header { display: none;}
.menu .menu-footer { display: none;}
.menulink  { color:#fff; text-decoration: none; cursor:pointer; padding:5px 5px; width:85px;}
.my-login-box {position: fixed;left: 0; right:0; top: 160px;width: 340px;margin:auto; z-index:51;}
.my-login-box-body { padding:15px;}
.my-login-box-body div {}
.my-login-box-body div:last-child {}
.my-register-box { position:absolute; left: 0; right:0; top: 160px;width: 450px;margin:auto; z-index:52; border-top-color:#4D90FE;}
.my-register-box p { display:block ; margin:auto; text-align:center ; padding: 10px; }
.my-register-box p:first-child {padding-top: 0px;font-size: 18px;font-family: 'Source Sans Pro',sans-serif;}
.my-register-box .box-tool {TOP: 10px;  position: absolute;  left: 408px;}
.my-register-box-body { padding:15px;}
.my-register-box-body .form-control, .my-login-box .form-control {height:34px;}
.my-register-box-body .form-control-feedback, .my-login-box .form-control-feedback { top:8px;}
.my-register-box-body div:last-child { margin:0px;}
.my-register-box-body .form-group label {padding: 5px 0px;}
.my-register-box-body .form-group {margin-bottom: 10px;}

.mycheckbox { line-height:18px; }
.mycheckbox input[type=checkbox] { display:none; }
.mycheckbox input[type=checkbox] + label {text-indent:0px;margin: 3px;cursor: pointer;font-size:13px; font-weight:normal; color:#000; /*vertical-align:top;*/ border:0px solid #00f;}
.mycheckbox input[type=checkbox]:checked + label {text-indent:0px;margin: 3px;cursor: pointer;font-size:13px; font-weight:normal; color:#000; /*vertical-align:top;*/}
.mycheckbox input[type=checkbox] + label:before {content:"";display: inline-block;width: 16px;height: 16px;margin-right: 3px;border:2px solid #ccc;float: left;text-align: center;}
.mycheckbox input[type=checkbox]:checked + label:before {content: "\f00c";color: #f00;display: inline-block;top: 0;bottom: 0;left: 0px;font: normal normal normal 12px/1 FontAwesome;}

.mycheckbox2 { }
.mycheckbox2 input[type=checkbox] { display:none; }
.mycheckbox2 input[type=checkbox] + label {text-indent:0px;margin: 3px;cursor: pointer;font-size:13px; font-weight:normal; color:#888; vertical-align:top; border:0px solid #00f;}
.mycheckbox2 input[type=checkbox]:checked + label {text-indent:0px;margin: 3px;cursor: pointer;font-size:13px; font-weight:normal; color:#888; vertical-align:top;}
.mycheckbox2 input[type=checkbox] + label:before {content: "\f155"; display: inline-block; width: 25px; height: 25px; margin-right: 0px; text-align: center;background-color: #ccc;color: #fff; font: normal normal normal 12px/1 FontAwesome; line-height: 25px;}
.mycheckbox2 input[type=checkbox]:checked + label:before {content: "\f155"; display: inline-block;bottom: 0;left: 0px;font: normal normal normal 12px/1 FontAwesome;line-height: 25px; background-color: #ff9c00;}

.mycheckbox3 { line-height:18px; }
.mycheckbox3 input[type=checkbox] { display:none; }
.mycheckbox3 input[type=checkbox] + label {text-indent:0px;margin: 3px;cursor: pointer;font-size:13px; font-weight:normal; color:#000; /*vertical-align:top;*/ border:0px solid #00f;}
.mycheckbox3 input[type=checkbox]:checked + label {text-indent:0px;margin: 3px;cursor: pointer;font-size:13px; font-weight:normal; color:#000; /*vertical-align:top;*/}
.mycheckbox3 input[type=checkbox] + label:before {content:"";display: inline-block;width: 16px;height: 16px;margin-right: 3px;border:2px solid #ccc;float: left;text-align: center;}
.mycheckbox3 input[type=checkbox]:checked + label:before {content: "\f00c";color: #f00;display: inline-block;top: 0;bottom: 0;left: 0px;font: normal normal normal 12px/1 FontAwesome;}

.myradiopayment {width:auto;margin: 0px 10px 0px 5px;}
.myradiopayment input[type=radio] {display:none;}
.myradiopayment input[type=radio] + .lbl {border: 1px solid #D1D3D4; text-align:center; height:70px; width:110px;margin: 3px;cursor: pointer; display:inline-block;  vertical-align: middle;position: relative;}
.myradiopayment input[type=radio] + .lbl img { width:100%; margin:auto; position: absolute; top: 50%;left: 50%;margin-right: -50%;transform: translate(-50%, -50%);-webkit-transform: translate(-50%,-50%);}
.myradiopayment input[type=radio] + .lbl:hover {-webkit-box-shadow: 0px 0px 3px rgba(0, 144, 255, 1);    -moz-box-shadow: 0px 0px 3px rgba(0, 144, 255, 1);    box-shadow: 0px 0px 3px rgba(0, 144, 255, 0.7); border:2px solid #f00;}
.myradiopayment input[type=radio]:checked + .lbl {border:2px solid #ff0000; }

.myselect {  height: 28px;  border: 1px solid #ccc;  font-weight: bold;  padding-left: 3px;  padding-right: 5px;}
.myselect option {}

.myblocker {background: rgba( 0, 0, 0, 0.7 );	display: none;	width: 100%;	height: 100%;	position: fixed;	top: 0;	z-index: 50; left:0px;}
.myblocker.toolblocker { background-color:transparent;} /* chua dung den */
.myblocker-show {display: block;}
.mybody {}

.mybox-title-tag {border-color: #eff2f7;font-size: 14px;padding: 6px 13px;border-radius: 0px;display: block;    text-align: left;    margin-bottom:5px;}
.mybox-title-2 {font-size: 14px;padding:0px ;border-radius: 0px;display: block;    text-align: left; margin-bottom:5px; border:0px; border-bottom:1px dashed #666;}
.middle {    margin:auto;    top:0;    bottom:0;}
.msg-alert { font-size:13px; color:#F02450; border: 1px dotted #F02450; padding:4px 5px; margin: 0;font-style: italic; display:none;}

.nhanhangmoi .hinhnhan { width:200px;}
.nhanhangmoi div { display:inline-block; vertical-align:top;}
.nhanhangmoi div > span { display:block; text-align:left; margin-left:5px; }
.nhanhangmoi .mysize { display:inline-block; border:2px solid #f00; padding:1px 8px; font-weight:bold;}
.nhanhangmoi div.hangmoibox { padding:5px; background-color:White;} 

.tablelog { max-width:600px; background-color:White;}
.tablelog.logsanpham { max-width:800px;}
.tablelog .mahang { font-weight:bold;}
.tablelog .number { text-align:right;}
.tablelog .center { text-align:center;}
.tablehangkiem {border-top-color: #00a65a;background-color: #FAFAFA; text-align:center;}
.tablehangkiem  .hangcankiem { display:inline-block; background-color:White;  margin:4px; text-align:left; font-weight:normal; padding:3px; font-weight:bold;}
.tablehangkiem  .hangcankiem > span { vertical-align:middle; font-size:12px; display:inline-block;width:20px;}
.tablehangkiem  .hangcankiem > span:first-child { padding-left:3px; width:135px; }
.tablehangkiem  .hangcankiem > span:last-child { font-weight:bold;}
.tablehangkiem  .hangcankiem > button { font-weight:bold; }

.table > tbody > tr > th,.table > tbody > tr > td { padding:4px; font-size:12px;}
.timsptitle { margin-bottom:10px;}
.timsptitle input { width:135px; margin-right:3px;}
.timsptitle select {margin-right:3px;}

.no-lrpadding { padding-left:0px !important; padding-right:0px !important;}
.no-bold { font-weight: normal !important;}

.usercontrol { 	position:absolute;	z-index:10;	float:right;  color:#FFF;  right:0px;  top:0px;  border:0px solid #333;}
.usercontrol td { text-decoration: none;font-family:Tahoma, Geneva, sans-serif;font-size: 14px;}
.usercontrol table {  height:30px;}
.upfile { margin-top:0px;}

.sanpham 
{
background-color: #FFF;
width: 188px;
display: inline-block;
margin: 3px;
background-repeat: no-repeat;
display: inline-block;
margin-bottom:8px;
background-size: 100%;
border:4px solid #fff;
cursor:pointer;
}
.sanpham .img {width: 100%;height: 200px;}
.sanpham .itemname {background: #fff;background: #fff;font-family: Arial, Helvetica, sans-serif;font-size: 13px;color: #2B2B2B;font-weight: bold;padding: 2px 0px 0px 0px; display:block;}
.sanpham .myprice {
font-family: Verdana, Geneva, sans-serif;
font-size: 14px;
text-align:right;
padding:2px;
color: #FF4D4D;
font-weight: bold;
background-color: #FFF;
}
.sanpham .myprice .safe 
{
    float: left; 
    font-size: smaller;
    color:Silver;
    font-weight: normal;
      text-decoration: line-through;
}
.sanpham .hethang { color: Gray;}
.sanpham .longname
{
font-family: Arial, Helvetica, sans-serif;
background-color: #FFF;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding:0px 0px;
height:14px;
color:Black;
}

.sanpham-tb {width:100%;}
.sanpham-tb td { vertical-align:top; padding:2px; border:0px solid #000; line-height: 26px;}
.sanpham-tb .sanpham-info {}
.sanpham-tb .sanpham-info .sp-imggroup { width:300px; display:inline-block;}
.sanpham-tb .sanpham-info .sp-imggroup .sp-pic-whow {width:100%;}
.sanpham-tb .sanpham-info .sp-pic-all { width:auto; display:block; text-align:center;}
.sanpham-tb .sanpham-info .sp-pic-all img { width:auto;margin-bottom:5px; max-width:870px;}
.sanpham-tb .sanpham-info .sp-infogroup { width:auto; display:inline-block;vertical-align: top; padding-left:10px;}
.sanpham-tb .sanpham-info .sp-infogroup table { min-width:280px; }

.sanpham-tb .sanpham-info .sp-infogroup .sp-longname{ font-weight: bold;}
.sanpham-tb .sanpham-info .sp-infogroup .mahang{ font-family:Arial; font-weight: bold; color: #0066ff;}
.sanpham-tb .sanpham-info .sp-infogroup .giaban{ font-family:Arial; font-weight: bold; color: red;}
.sanpham-tb .sanpham-info .sp-infogroup .colname { width:150px;} 
.sanpham-tb .sanpham-info .sp-infogroup .address { padding-left: 10px; font-family:Arial;} 
.sanpham-tb .sanpham-info .sp-infogroup .sale {color: Silver;font-weight: normal;text-decoration: line-through;}
.select {height:26px;}

.shopcart-dropdown-menu {    padding:0px;border-radius: 0px; top:35px;left:-40px; width:200px; border: 1px solid #aaa;-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .5); box-shadow: 0 0 8px rgba(0, 0, 0, .5);}
.shopcart-dropdown-menu:before, .shopcart-dropdown-menu:after {    content: "";    position: absolute;    left:97px;    border-style: solid;    border-width: 0 15px 15px;    border-color: #FFFFFF transparent;    display: block;    width: 0;    z-index: 1;}
.shopcart-dropdown-menu:before {top :-15px;border-color: #aaa transparent;}
.shopcart-dropdown-menu:after {top:-14px;border-color: #FFFFFF transparent;}
.shopcart-dropdown-menu table {width:100%;}
.shopcart-dropdown-menu table tr.listitem { border-bottom:1px dotted #ccc;}
.shopcart-dropdown-menu table tr:hover { background-color:#eee; cursor:pointer;}
.shopcart-dropdown-menu table tr td {padding: 5px 0px;}
.shopcart-dropdown-menu table tr td.btmenu { text-align:center;  color: #363636; font-size:13px; }
.shopcart-dropdown-menu .bookinfo { color:#777; font-size:12px;}
.shopcart-dropdown-menu .bookinfo span { display: block;}
.shopcart-dropdown-menu .bookname {}

.userinfo.table {}
.userinfo td { font-size:14px;}
.userinfo select {display:inline-block; width:30%}
.userinfo td:first-child { text-align: right; width:33.33%;}

.input-group-addon {border-right: 0px;}
.icon-head { margin-right: 6px;}

.tagsale { position: absolute;  display: inline-block;  margin-left: 10px;  color: #fff;  background-color: #F95050;  padding: 1px 5px;  font-size: 9px;    }
.tag , .bttag, .bttag01
{
    display: inline-block;
    padding: 3px 6px;
    margin-bottom: 0;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    /*background-color: #001F3F;*/
}

.tableforcontrol { width:600px;}
.tag-group {padding:5px;}
.bttag,.bttag01 { cursor:pointer;}
.bttag01 {border-radius: 0px; border:2px solid #337ab7; padding:0px 6px; margin:0px; }

.tag.border 
{
    border: 1px solid #ddd;
}




#addbox { display:none;}
#btcloseregister {}
#searchbox {
	background: #FFF url(/images/search-small-icon.png) no-repeat 4px 4px; 
    border: 0px; 
    outline:none; 
    height:24px;
	width: 80px;
	border-radius:0px;
	font-size:15px;
	padding:2px 2px 2px 25px;
	color:#111;
}

#showcase .paging { text-align:center;}

#changepassbox,#editbox,#toolbox { display:none;}
#content { width:100%; padding:0px 0px;}

#homebanner { background-color:White;}

#tongtientrano {  display: block;margin: auto;right: 0;left: 0;top: 37px;position: fixed;width: 130px;background-color: white;color: red;text-align: right;padding: 0px 3px;box-shadow: 0px 0px 2px #777;font-size: 18px;}
#navigatemenu {position: fixed; box-shadow:0px 1px 1px #4D545F;
   		background-color: #4D90FE;
		background-image: -webkit-linear-gradient(top,#4D90FE,#4787ED);
		background-image: -moz-linear-gradient(top,#4D90FE,#4787ED);
		background-image: -ms-linear-gradient(top,#4D90FE,#4787ED);
		background-image: -o-linear-gradient(top,#4D90FE,#4787ED);
		background-image: linear-gradient(top,#4D90FE,#4787ED);
		border: 1px solid #3079ED;
		z-index:1000;
}

#filter { width:98%}
#filter table { background-color:#f00;}
#filter-table .filter-name { padding:3px 0px 3px 6px; text-align: left; width:100px; font-size: 14px; font-weight:none;}
#filter-table .filter-attr { padding:3px 0px 3px 6px;}

#guestinfo {display:none;}
#guestpayment {display:none;}

#lblusername { font-weight:bold; width:100px; text-align: right;}

#mainfrm { padding-top:30px;}
#myloginbox {-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);}
/* Up chua sua */
BODY {left: 0;	height: 100%;	width: 100%; margin:0px; background-color:#E4E4E4; }

a:hover { text-decoration: none;}

#hoadonlist { background-color:#fafafa;}
#hoadonlist .button {}
#hoadonlist .clockship { width:60px; padding:3px;}
#hoadonlist .clockship span.timetag {width: 50px; text-align: center; color: #FFF; background-color:#FF8000; padding:1px; width:55px; display:block; font-weight:bold; font-size:13px; }
#hoadonlist .checknhantien { padding:0px; text-align:center; width:30px;}
#hoadonlist .dathanhtoan { width:50px; }
#hoadonlist .logoshop {width:70px;}
#hoadonlist .hdid { width: 60px;}
#hoadonlist .hdid { cursor:pointer;}
#hoadonlist .hdid:hover { color:Blue; font-weight:bold;}
#hoadonlist .iconone {padding:6px 0px;}
#hoadonlist .iconone span i:before { }
#hoadonlist .iconmore {padding:6px 0px; width:90px; text-align:left;}
#hoadonlist .ngaygiogiao { width:80px;}
#hoadonlist .ngaytaofirst { width:70px;}
#hoadonlist .account { text-align:left; width:80px;}
#hoadonlist .itemlist {padding:0px; width:180px; text-align:left;}
#hoadonlist .itemlist > span {padding:2px; display:block; cursor: pointer; font-weight:bold ;}
#hoadonlist .itemlist > span:hover { color:Orange;}
#hoadonlist .itemlist > span > span {padding:2px 2px 2px 4px; display: inline-block; font-weight:normal;}
#hoadonlist .tnn { text-align:left; font-weight:bold;}
#hoadonlist .tnn span { display:block; color:#04669B;}
#hoadonlist .phone {}
#hoadonlist .btn { font-weight:bold ;}
#hoadonlist .billmoney { text-align:right; width:80px; font-weight:bold;}
#hoadonlist .shipmoney { width:70px;}
#hoadonlist .money { text-align:right; font-weight:bold;}
#hoadonlist .sumtotal { color:Blue;}
#hoadonlist td input:focus { border:1px solid #666; font-weight:normal;}
#hoadonlist .mavandon { width: 160px;text-align: left;}
#hoadonlist .mavandon input { border:1px solid transparent; background-color:transparent; margin:0px; width:120px; font-weight:bold;}
#hoadonlist .mavandon i { color:Green;margin-left: 4px;}
#hoadonlist .mavandonview { width: 100px;text-align: left; font-weight:bold ; color:Red;}
#hoadonlist .guihanginput { width: 90px;text-align: left;}
#hoadonlist .guihanginput input { border:1px solid transparent; background-color:transparent; margin:0px; width:60px; font-weight:bold; text-align:right;}
#hoadonlist .guihanginput.tennguoigiao input {color:darkmagenta;}
#hoadonlist .guihanginput i { color:Green;margin-left: 4px;}
#hoadonlist .theodoihanhtrinh { width: 160px;text-align: center; padding:5px 0px;}
#hoadonlist .state { text-align:center; width:150px;padding:4px 4px;}
#hoadonlist td,#hoadonlist th { padding:6px 5px; text-align:center;}
#hoadonlist tr:hover { background-color:#eee;}
#hoadonlist .newbill .tnn { color:#e54c16;}
#hoadonlist .newbill .billmoney { color:#e54c16;}
#hoadonlist .newbill .billdate { color:#e54c16;}
#hoadonlist .newbill .btn-default { color:#e54c16;}
#hoadonlist .comfirm .tnn { color:#888;}
#hoadonlist .comfirm .billmoney { color:#888;}
#hoadonlist .comfirm .billdate { color:#888;}
#hoadonlist .comfirm .btn-default { color:#888;}
#hoadonlist .boxing .tnn { color:#068403;}
#hoadonlist .boxing .billmoney { color:#068403;}
#hoadonlist .boxing .billdate { color:#068403;}
#hoadonlist .boxing .btn-default { color:#068403;}
#hoadonlist .deliver .tnn { color:#f00;}
#hoadonlist .deliver .billmoney { color:#f00;}
#hoadonlist .deliver .billdate { color:#f00;}
#hoadonlist .deliver .btn-default { color:#f00;}
#hoadonlist .done .tnn { color:#249ef3;}
#hoadonlist .done .billmoney { color:#249ef3;}
#hoadonlist .done .billdate { color:#249ef3;}
#hoadonlist .done .btn-default { color:#249ef3;}
#hoadonlist .soanhang .tnn { color:#000099;}
#hoadonlist .soanhang .billmoney { color:#000099;}
#hoadonlist .soanhang .billdate { color:#000099;}
#hoadonlist .soanhang .btn-default { color:#000099;}
#hoadonlist .binhthuong .tnn { color:#999;}
#hoadonlist .binhthuong .billmoney { color:#999;}
#hoadonlist .binhthuong .billdate { color:#999;}
#hoadonlist .binhthuong .btn-default { color:#999;}

#hoadonlist a { color:Black; text-decoration:none;}
#hoadonlist a:hover { color: Blue;}
#hoadonlist .bid { width:60px;}
#hoadonlist .tsp { font-weight:bold; text-align:left;}
#hoadonlist .stk { font-weight:bold; padding:6px 0px; width:30px;}
#hoadonlist .stku { font-weight:bold; padding:6px 0px; width:60px;}
#hoadonlist .crtl {width: 33px;  padding-right: 0px;  padding-left: 0px;}
#hoadonlist .crtl span.spbtn {  width: 16px; cursor: pointer;  display: inline-block;  position: relative; top:2px; color:#7F7F7F;}
#hoadonlist .crtl span.spbtn:hover { color:#006FE2;}
#hoadonlist .codh, #hoadonlist .codhu { font-weight:bold; color:Blue;}
#hoadonlist .codhu {}
#hoadonlist .sold {width:50px; text-align:right;}
#hoadonlist .cannang, #hoadonlist .cannangu {width:60px; text-align:right;}
#hoadonlist .cannangu { width:80px;}
#hoadonlist .xem, #hoadonlist .xemu {width:50px; text-align:right;}
#hoadonlist .xemu {width:90px;}
#hoadonlist .hdv, #hoadonlist .hdvu { width: 40px;  padding: 4px 0px 0px 8px}
#hoadonlist .hdvu { width:80px;}
#hoadonlist .giasp {width:50px; text-align:right; font-weight:bold;}
#hoadonlist .giasp.sale {color:#FF00E1;} 
#hoadonlist .tdh { padding:4px;}
#hoadonlist .tdh a {text-decoration: none;  padding: 2px 5px;  display: block;font-weight: bold;color: gray;}
#hoadonlist .tdh a:hover {color:#006FE2;}
#hoadonlist .hethang .tsp {color:#999;}
#hoadonlist .hethang .stk,#hoadonlist .hethang .stku  {color:#999;}
#hoadonlist .conhang .tsp {color:#000;}
#hoadonlist .conhang .stk, #hoadonlist .conhang .stku  {color:#000;}

#showcase .page_content  {text-align: center; margin: 0; border: 0px solid #d8d8d8; border-width: 0 0px 0px 0px;    -webkit-border-radius: 0 0 5px 5px;    border-radius: 0 0 5px 5px;background:transparent;}
#showcase .page_heading {    margin: 0;    padding: 10px 18px 0px 10px;    font: bold 14px/1em sans-serif;    color: #fff;}
#tab-sanpham { text-align:center;}
#tab-sanpham > .inputwithicon { margin:10px;}
#tab-sanpham > #danhsachsanpham { padding:5px;}
#tab-sanpham > #danhsachsanpham > .sanpham { width:31.5%; margin:2px; text-align:left;}
#tab-sanpham > #danhsachsanpham > .sanpham > img { width:100%;}
#tab-sanpham > #danhsachsanpham > .sanpham > .itemname { font-size:smaller; line-height:normal; padding:3px 0px;}
#tab-sanpham > #danhsachsanpham > .sanpham > .inside {text-align: left;    background: #fff; display:inline-block;line-height: normal;font-size:smaller; color:Gray; font-weight:bold;}
#tab-sanpham > #danhsachsanpham > .sanpham > .inside > span { margin-left:4px;}
#tab-sanpham > #danhsachsanpham > .sanpham > .inside > span:first-child {margin-left:0px;}
#tab-sanpham > #danhsachsanpham > .sanpham > .myprice { font-size:smaller; float:right; line-height: normal ; padding:0px;}


#payoption { display:none;}
.datetimepicker { display:inline-block; margin-bottom:0px;}
.datetimepicker input { width: 110px; display: inline-block; background-color:#09F; color:#fff; font-weight:bold;border: 0px;height:26px;line-height: 25px;text-align: center;border: 0px;font-size: 14px;border-radius: 0px;}
.datetimepicker .form-control-feedback { line-height:26px;padding-top: 1px;  color: #fff;  font-weight: normal;}
.datetimepicker .form-control { padding-right:0px;}
.datetimepicker .form-control[readonly] { cursor:pointer;}

.box { border-radius:0px;}
.hdinfo { min-width:600px; margin:auto;  margin-bottom:15px; width:100%; left:auto ; right:auto; font-size:13px;}
.hdinfo .hdid { font-weight:bold; width:60px;}
.hdinfo .logo { position:relative;top:4px;}
.hdinfo .username { float:right; font-weight:bold; font-size:12px; font-style:italic; color: DarkOrchid;}
.hdinfo td { vertical-align:middle;}
.hdinfo td.cont.smallcol { max-width:200px;}
.hdinfo td span { padding-left:5px;display: inline-block;}
.hdinfo td.icon { text-align:center; width:30px;}

.hdinfo i { font-size:15px;}
.hdinfo .title { width:150px; color:#333; text-align:right; padding-right:10px;}
.hdinfo .button { height: 27px;    padding: 4px 5px;} 
.hdinfo .bttag.oldbill { font-weight:bold; width:70px;}
.hdinfo #btupdatestate {font-weight:bold;width:120px;}
.hdinfo #tnn  {max-width:350px;}
.hdinfo input.smalltext {max-width:120px; display:inline-block;}
.hdinfo input.smtxt {max-width:200px; display:inline-block;}
.hdinfo input.longtext {display:inline-block;}
.hdinfo input.fulltext {max-width:98%; display:inline-block;}
.hdinfo .input { vertical-align: top;}
.hdinfo .input i { margin-top:0px; font-size:20px;} 
.hdinfo .input div { margin-top:-2px; display:inline-block;} 
.hdinfo .input input { padding:3px 6px; /* margin:auto; muc ten nguoi nhan bi loi trong hoadon info */} 
.hdinfo .input select {width: 210px;display: inline-block;height: 26px;}
.hdinfo .input button { margin-top:-3px; font-size:14px;} 
.hdinfo .hinhsanpham img { width:100px; height:100px;}
.hdinfo .hinhsanpham video { width:130px; height:100px;}
.hdinfo span.giaban {  font-weight:bold; color:Blue;}
.hdinfo span.ngaytao {font-weight:bold; width:210px; vertical-align:top;}

.hdtaobillinfo { width:100%; margin:auto;  margin-bottom:15px; width:100%; left:auto ; right:auto; font-size:13px;}
.hdtaobillinfo .hdid { width:60px;}
.hdtaobillinfo .title2 { width:100px; color:#333; text-align:left; padding-left:5px;}
.hdtaobillinfo .logo { position:relative;top:5px;}
.hdtaobillinfo .input div { margin-top:-2px; display:inline-block;}
.hdtaobillinfo td span { padding-left:5px;display: inline-block;}
.hdtaobillinfo input.smtxt {max-width:120px; display:inline-block;}
.hdtaobillinfo #guihangid {width:200px;}

.itemreturn-box { width:100%;}
.itemreturn-box tr:first-child { height:35px;}
.itemreturn-box .table tr:hover { cursor: pointer;}
.itemreturn-box .table tr td:first-child { display:none}
.itemreturn-box .table { width:100%; border:1px; border:1px solid #ddd; margin-bottom:0px;}
.itemreturn-box .table td { padding:5px;}
.itemreturn-box .table td:last-child {width: 60px; text-align: right;}

.logot {background: url(/images/LogoTTXT.png) no-repeat 0px 0px;}
.logow {background: url(/images/LogoWAN.png) no-repeat 0px 0px;}
.logot, .logow {display: block;border: 0px solid #333;height: 16px; width:56px;}

.mybox {border-color: #eff2f7;font-size: 12px;padding: 10px;display: block;text-align: left; margin-bottom:5px;}
.mybox .box-body { padding:0px;}
.mybox .box-header { padding:5px 5px; text-align:left; }

.mysmallbox { margin-bottom:10px;}
.mysmallbox td { font-size:14px;}
.mysmallbox .box-body { padding:5px;}

.myspace { width:5px;  display:table-cell; }
.myradio { width:auto;}
.myradio input[type=radio] {display:none;}
.myradio input[type=radio] + .lab {text-indent:0px;margin: 0px 0px;cursor: pointer; font-size:14px; font-weight:normal; color:#888;min-width:120px; border: 1px solid #D1D3D4;}
.myradio input[type=radio] + .lab span { padding-left:5px; color:inherit;}
.myradio input[type=radio] + .lab:before {content: "";position: relative;display: block; padding-top: 8px; width: 28px; height: 26px; vertical-align:middle; background-color: #aaa; top: 0;bottom: 0;	left: -1px; background: #D1D3D4;float:left;}

.myradio input[type=radio] + .lab:hover {-webkit-box-shadow: 0px 0px 3px rgba(0, 144, 255, 1);    -moz-box-shadow: 0px 0px 3px rgba(0, 144, 255, 1);    box-shadow: 0px 0px 3px rgba(0, 144, 255, 0.7); border-color:#0090ff; color:#000;}
.myradio input[type=radio] + .lab:hover:before {content: "\f00c"; /* Bullet */  color: #0090ff;top: 0;	bottom: 0;	left: 0px; display: inline-block;font: normal normal normal 18px/1 FontAwesome;text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale; text-align:center; line-height:10px; text-shadow:0px 0px 3px #eee; position: relative; display: block; float:left ;text-indent:0px; border:0px}
.myradio input[type=radio]:checked + .lab {border-color: #337ab7; color:#000;  color:#337ab7; background-color:#fff;}
.myradio input[type=radio]:checked + .lab:before {content: "\f00c"; /* Bullet */  color: #fff;	background-color: #337ab7 ;top: 0;	bottom: 0;	left: -1px; display: inline-block; font: normal normal normal 18px/1 FontAwesome; text-rendering: auto;    -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;    text-align:center;line-height:10px; text-shadow:0px 0px 3px #eee;position: relative; display: block;float:left ;text-indent:0px;}

.myradio2 { width:auto;}
.myradio2 input[type=radio] {display:none;}
.myradio2 input[type=radio] + .lab {text-indent:0px;margin: 0px 0px; cursor: pointer; font-size:12px; font-weight:normal; color:#888; border: 1px solid #D1D3D4;  display:inline-block; padding:0px 2px; margin:0px 2px;}
.myradio2 input[type=radio] + .lab:hover {-webkit-box-shadow: 0px 0px 3px rgba(0, 144, 255, 1);    -moz-box-shadow: 0px 0px 3px rgba(0, 144, 255, 1);    box-shadow: 0px 0px 3px rgba(0, 144, 255, 0.7); border-color:#0090ff; background-color:#0090ff; color:#fff;}
.myradio2 input[type=radio]:checked + .lab {border-color: #0090ff; color:#fff;background-color:#0090ff; font-weight:bold;}

.mysizeradio { width:auto;margin: 0px;}
.mysizeradio input[type=radio] {display:none;}
.mysizeradio input[type=radio] + label, .mysizetag {width: auto;  min-width:20px; border: 2px solid #D1D3D4; padding:0px 5px; cursor: pointer;-webkit-user-select: none;-moz-user-select: none;	-ms-user-select: none;	user-select: none;font-size:12px; font-weight:normal; color:#888;-webkit-transition: all 0.5s; transition: all 0.5s; }
.mysizeradio input[type=radio] + label:hover {color:#000;border-color:#F00;}
.mysizeradio input[type=radio]:checked + label {color:#000; border-color:#F00;}
.mysizeradio select {width: auto;  min-width:20px; border: 2px solid #D1D3D4; padding:0px 5px; cursor: pointer; font-size:12px;color:#000; border-color:#F00; }

.mytimepicker { display:inline-block;}
.mytimepicker .dropdown-menu { min-width:120px;}
.mytimepicker > input {  background-color: #09F;line-height: 25px;text-align: center;width: 80px;font-weight: bold;color: #fff;border: 0px; font-size:14px; height:26px;border-radius:0px; }
.mytimepicker > input[readonly] { cursor:pointer;}
.mytimepicker td span { padding:0px; font-weight:bold;}
.mytimepicker .bootstrap-timepicker-widget table td a { padding:0px}

.mytimeline { font-size:12px;}
.mytimeline:before {left:10px}
.mytimeline.hdlogheader { margin-bottom:0px;}
.mytimeline  li.time-label > span {display: inline-block; padding: 4px 10px;  line-height: normal;  border-radius: 20px; color: gray;}
.mytimeline  li.time-label > span.btshowall {display: inline-block; line-height: normal; background-color:transparent; float:right; padding:0px;}
.mytimeline  li { margin-right:0px; margin-bottom:10px;}
.mytimeline  li > .fa { left:0px; top:0px; width:25px; height:25px; line-height:25px;}
.mytimeline  li > .timeline-item { margin-left:32px; margin-right:0px; border-radius:0px;}
.mytimeline  li > .timeline-item > .timeline-header { font-size:14px; padding:5px; display:block; border-color:#eee;}
.mytimeline  li > .timeline-item > .time {float: left ; padding: 0px;  font-size: 12px; margin-left:10px; margin-right:5px; font-weight: bold;}
.mytimeline  li > .timeline-item > .timeline-body, .timeline > li > .timeline-item > .timeline-footer { padding:3px 10px; font-size:14px; line-height:20px; color:#666; max-width:264px;word-wrap: break-word;}



.awecheckbox { width:auto; display:inline-block; margin-left:1px; line-height:26px;}
.awecheckbox input[type=checkbox] {display:none;}
.awecheckbox input[type=checkbox] + .lab {text-indent:0px;margin: 0px 0px;cursor: pointer; font-weight:normal; color:#888; min-width:210px; border: 0px solid #D1D3D4;}
.awecheckbox input[type=checkbox] + .lab span { padding-left:5px;}
.awecheckbox input[type=checkbox] + .lab:before {content: "";position: relative; display:block;  font: normal normal normal 14px/1 FontAwesome; width: 28px; height: 26px; vertical-align:middle; background-color: #aaa;top: 0;bottom: 0; left: -1px; background: #D1D3D4;float:left; line-height: inherit; text-align:center; color:#fff; border:0px solid #D1D3D4; }

.awecheckbox input[type=checkbox] + .lab.money:before{content:"\f155"}
.awecheckbox input[type=checkbox]:checked + .lab.money:before{ background-color:#ff9c00;border-color:#ff9c00;}
.awecheckbox input[type=checkbox]:checked + .lab.money {color:#333; font-weight:bold;}

.awecheckbox input[type=checkbox] + .lab.ktship:before{content:"\f0d1"}
.awecheckbox input[type=checkbox]:checked + .lab.ktship:before{ background-color:#00e000;border-color:#00e000;}
.awecheckbox input[type=checkbox]:checked + .lab.ktship {color:#333; font-weight:bold;}

.awecheckbox input[type=checkbox] + .lab.checkbox:before{content:"\f00c"}
.awecheckbox input[type=checkbox]:checked + .lab.checkbox:before{ background-color:#00e000;border-color:#00e000;}
.awecheckbox input[type=checkbox]:checked + .lab.checkbox {color:#333;font-weight:bold;}

.awecheckbox input[type=checkbox] + .lab.banned:before{content:"\f056"}
.awecheckbox input[type=checkbox]:checked + .lab.banned:before{ background-color:#f00;border-color:#f00;}
.awecheckbox input[type=checkbox]:checked + .lab.banned {color:#333;font-weight:bold;}

.shopcart-list { padding:5px; border:0px solid #999;}
.shopcart-list .hangmoiadd { width:1000px; margin-bottom:5px;}
.shopcart-list .bookcount { background-color:#fff;    text-align: center;    display: block;}
.shopcart-list .booksize span {}
.shopcart-list .thanhtoan-button { margin-top:10px;}
.shopcart-list .table {border: 1px solid #ddd;}
.shopcart-list .table th { padding:5px;}
.shopcart-list .table td { padding:5px; vertical-align:middle;}
.shopcart-list .hinh img { width:45px;}
.shopcart-list .col-bt { width:30px;}
.shopcart-list .thanhtoan-button { text-align:right; display: block;}
.shopcart-list .cannang { text-align:right;}
.shopcart-list .info { text-align:right;}
.shopcart-list .macode { font-size:13px; font-weight:bold; cursor:pointer;}
.shopcart-list .macode.hangsaihinh { color:Red; text-decoration:line-through;} 
.shopcart-list .sobao { font-size:24px; text-align:center; color:Blue;font-family: fantasy;}
.shopcart-list .gia input { width:70px;}
.shopcart-list .hdmh { width:100px;}
.shopcart-list .hdmh input { width:50px;}
.shopcart-list button { margin-top:0px;display:none;margin-top:-4px;}
.shopcart-list button.noup {margin-top:0px;}
.shopcart-list .itemrow input {font-weight:bold;background-color: transparent;border: 1px solid transparent; }
.shopcart-list .colbtn { width:50px;}
.shopcart-list .ghichu,.shopcart-list .ghichuactive { font-size:22px; color:#eeeeee; cursor:pointer;}
.shopcart-list .ghichu:hover,.shopcart-list .ghichuactive:hover {color:#3B96F7;}
.shopcart-list .ghichuactive {color:#E30028;}
.shopcart-list .longname { cursor:pointer; font-weight:bold; color:GrayText;    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; height:18px;}
.shopcart-list .longname:hover { color:Blue;}

.searandadditem { margin-bottom:0px; display:inline-block; font-size:13PX;}
.searandadditem .fa {line-height: 30px;color: darkcyan;}
.searandadditem .fa.fa-search {line-height: 27px;}
.searandadditem input {color: darkcyan;}

.summarytitle {}
.summarytitle:hover { cursor:pointer; color:Orange;}

.form-group.inputwithicon { margin-bottom:0px; display:inline-block; font-size:13PX;}
.form-group.inputwithicon .fa {line-height: 27px;color: darkcyan;}
.form-group.inputwithicon .fa.fa-barcode {line-height: 30px;}
.form-group.inputwithicon input {color: darkcyan;}

.fileinput-button {  position: relative;  overflow: hidden;  display: inline-block;}
.fileinput-button input {  position: absolute;  top: 0;  right: 0;  margin: 0;  opacity: 0;  -ms-filter: 'alpha(opacity=0)';  font-size: 200px !important;  direction: ltr;  cursor: pointer;}

.switchshop th { padding: 0px 2px;}

.panel { display:none;}
.panel .title { padding-bottom: 4px;    font-weight: bold;    color: blue;}

.toolbox { margin-top:10px; display: inline-block; width:auto;}
.toolboxtb th { text-align:center; font-size:16px; padding-bottom:8px;}
.toolboxtb td:first-child {  width:140px;}
.toolboxtb td { padding:3px 3px;}
.toolboxtb td span { display:block; margin: 4px 0px; }
.toolboxtb td span > span { float: right;}
.toolboxtb #distlistresult { width:500px;}
.toolboxtb #distlistresult td:last-child {}
.toolboxtb #distlistresult select {margin-top: 2px;}
.toolboxtb #distlistresult select:disabled { color:#AAA; border-color:#AAA;}
.toolboxtb div > span { display:inline-block; margin:2px; width:60px; text-align:right; }
.toolboxtb div > div  { display:inline-block; }

.whiteboard { display:block; border:1px solid #ccc; background-color:White;padding-top: 5px; margin-bottom:5PX; }
.whiteboard > span {font-size: 12px; font-weight:bold;}
.whiteboard > .label { display:block; color:Black; text-align:left; width:100%;margin: 5px 0px;}
.whiteboard > .label:hover { color:Red;}
.whiteboard > .label > .so { float:right;}
.whiteboard > .title { text-align:center; color:Blue; display:block;}

.xuathangmoi { max-width:1200px; text-align:center;}
.xuathangmoi .itemtag { display:inline-block; border: 0px solid #999; margin:5px; margin-bottom: 10px; background-color:White;}
.xuathangmoi .bookname {font-size: 11px; font-weight: bold;padding: 3px;}
.xuathangmoi .bookpic img { width:140px;}
.xuathangmoi .stock { padding-top:2px; padding-bottom:2px; color:Gray;} 
.xuathangmoi .stock button:first-child { margin-right:5px;} 
.xuathangmoi .stock button:last-child { margin-left:5px;} 

#minitable input { width:80px;line-height: normal; height: 26px;  text-align: right; padding:0px;  padding-right: 5px; border-radius:0px;  background-color: #fff;background-image: none;  border: 1px solid #ccc; }
#minitable th { line-height:20px; text-align: center;font-weight:normal;}
#thongbao{ font-size:13px; color:#F00; font-weight:bold; font-style:italic ;} 
#listdonhangcandoi { display:none;}

#danhsachtienship td { width:25%; display:inline-block; text-align:right; padding:2px 0px;}
#danhsachtienship td:first-child { text-align:left;} 
#danhsachtienship td.tongcong { width:75%; text-align:right;}

#dulieucuakhach div { border-width:1px; border-style:dashed; margin-bottom:8px; padding:5px; cursor:pointer;}
#dulieucuakhach div:last-child { margin-bottom:0px;}
#dulieucuakhach div:hover { background-color: Highlight;}
#dulieucuakhach div > table > tbody > tr > td > span {margin-right:10px; }
#dulieucuakhach div > table > tbody > tr > td > span:first-child { font-weight:bold;}
#dulieucuakhach div > table > tbody > tr > td > span:last-child { margin-right:0px;}

#infobox { margin:10px; background-color:#E4E4E4;}
#infobox #contentcell { overflow:auto; max-width:400px;max-height:300px;}
#txtEditor { max-width:1000px; width:100%; margin-bottom:8px;}
#resultview { height: 230px; overflow-y: auto;} /* hangmoive bo vao bao  */
#splist,#splistx { position:absolute;background-color: #fff;margin-top: 3px;-webkit-box-shadow: 0px 0px 3px 0px rgba(50, 50, 50, 0.75);-moz-box-shadow:0px 0px 3px 0px rgba(50, 50, 50, 0.75);box-shadow:0px 0px 3px 0px rgba(50, 50, 50, 0.75); z-index:1000;}
#splist span ,#splistx span {display:block;padding: 4px 5px;line-height: normal; background-color: #fff; width: 180px; font-weight:bold; text-align:left;}
#splist span:hover, #splistx span:hover { background-color:Fuchsia;cursor:pointer; color:#fff; background-color:#999;}
#viewside {text-align: center; padding: 5px 0px;}

#resultview::-webkit-scrollbar {  width: 3px;  height: 2px;}
#resultview::-webkit-scrollbar-thumb:active {  background: #587bf6;}
#resultview::-webkit-scrollbar-thumb:hover {  background: #587bf6;}
#resultview::-webkit-scrollbar-track {  background: #ffffff;  border: 0px none #ffffff;  border-radius: 50px;}

/*
::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}
::-webkit-scrollbar-thumb {
  background: #e1e1e1;
  border: 0px none #ffffff;
  border-radius: 50px;
}


::-webkit-scrollbar-track {
  background: #666666;
  border: 0px none #ffffff;
  border-radius: 50px;
}
::-webkit-scrollbar-track:hover {
  background: #666666;
}
::-webkit-scrollbar-track:active {
  background: #333333;
}
::-webkit-scrollbar-corner {
  background: transparent;
}



.spinner {  margin: 100px auto;  width: 50px;  height: 30px;  text-align: center;  font-size: 10px;}
.spinner > div {  background-color: #333;  height: 100%;  width: 6px;  display: inline-block;    -webkit-animation: stretchdelay 1.2s infinite ease-in-out;  animation: stretchdelay 1.2s infinite ease-in-out;}
.spinner .rect2 {  -webkit-animation-delay: -1.1s;  animation-delay: -1.1s;}
.spinner .rect3 {  -webkit-animation-delay: -1.0s;  animation-delay: -1.0s;}
.spinner .rect4 {  -webkit-animation-delay: -0.9s;  animation-delay: -0.9s;}
.spinner .rect5 {  -webkit-animation-delay: -0.8s;  animation-delay: -0.8s;}
@-webkit-keyframes stretchdelay { 0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  20% { -webkit-transform: scaleY(1.0) }}
@keyframes stretchdelay {0%, 40%, 100% {transform: scaleY(0.4);-webkit-transform: scaleY(0.4);}  20% {transform: scaleY(1.0); -webkit-transform: scaleY(1.0);}}
*/

@keyframes blurout  {
    from {opacity:1.0;}
    to {opacity:0.0;}
}