@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700');

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{
	margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
table td {vertical-align: top;}
body {font: 11px Tahoma, Arial;}
html, body {width: 100%;height: 100%;}
a {text-decoration: underline; }
a:hover {text-decoration: none;}

/* готовые классы для верстки */
.clearfix { zoom: 1 }
.clearfix:after {content: ' ';clear:both;display: block;width: 0; height: 0;overflow: hidden;font-size: 0;}

input:focus::-webkit-input-placeholder {color: transparent;}
input:focus::-moz-placeholder          {color: transparent}
input:focus:-moz-placeholder           {color: transparent}
input:focus:-ms-input-placeholder      {color: transparent}
textarea:focus::-webkit-input-placeholder {color: transparent;}
textarea:focus::-moz-placeholder          {color: transparent}
textarea:focus:-moz-placeholder           {color: transparent}
textarea:focus:-ms-input-placeholder      {color: transparent}
::-webkit-input-placeholder {line-height: normal;color: #9a9a9a;}
::-moz-placeholder          {line-height: normal;color: #9a9a9a;}
:-moz-placeholder           {line-height: normal;color: #9a9a9a;}
:-ms-input-placeholder      {line-height: normal;color: #9a9a9a;}

.meter { 
	height: 7px;  /* Can be anything */
	position: relative;
	margin: 5px 0 0 0; /* Just for demo spacing */
	background: #ebebeb;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	padding: 0;
	border-top: 1px solid #8b8b8b;
	border-bottom: 1px solid #fff;
	-webkit-box-shadow: inset 0 1px 5px rgba(0,0,0,0.3);
	-moz-box-shadow   : inset 0 1px 5px rgba(0,0,0,0.3);
	box-shadow        : inset 0 1px 5px rgba(0,0,0,0.3);
}
.meter > span {
	display: block;
	height: 100%;
	border-radius: 0px;
	background: #349615;
	background: -moz-linear-gradient(top,  #349615 0%, #49c223 63%, #72ef4a 100%);
	background: -webkit-linear-gradient(top,  #349615 0%,#49c223 63%,#72ef4a 100%);
	background: linear-gradient(to bottom,  #349615 0%,#49c223 63%,#72ef4a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#349615', endColorstr='#72ef4a',GradientType=0 );
	-webkit-box-shadow: 
	  inset 0 2px 9px  rgba(255,255,255,0.3),
	  inset 0 -2px 6px rgba(0,0,0,0.4);
	-moz-box-shadow: 
	  inset 0 2px 9px  rgba(255,255,255,0.3),
	  inset 0 -2px 6px rgba(0,0,0,0.4);
	box-shadow: 
	  inset 0 2px 9px  rgba(255,255,255,0.3),
	  inset 0 -2px 6px rgba(0,0,0,0.4);
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid #206b08;
	top: -1px;
	-moz-box-shadow:     0px 2px 7px 0 #70ca53;
	-webkit-box-shadow:  0px 2px 7px 0 #70ca53;
	box-shadow:          0px 2px 7px 0 #70ca53;
}
.meter > span:after, .animate > span > span {
	content: "";
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	background-image: 
	   -webkit-gradient(linear, 0 0, 100% 100%, 
	      color-stop(.25, rgba(255, 255, 255, .2)), 
	      color-stop(.25, transparent), color-stop(.5, transparent), 
	      color-stop(.5, rgba(255, 255, 255, .2)), 
	      color-stop(.75, rgba(255, 255, 255, .2)), 
	      color-stop(.75, transparent), to(transparent)
	   );
	background-image: 
-moz-linear-gradient(
  -45deg, 
	      rgba(255, 255, 255, .2) 25%, 
	      transparent 25%, 
	      transparent 50%, 
	      rgba(255, 255, 255, .2) 50%, 
	      rgba(255, 255, 255, .2) 75%, 
	      transparent 75%, 
	      transparent
	   );
	z-index: 1;
	-webkit-background-size: 50px 50px;
	-moz-background-size: 50px 50px;
	-webkit-animation: move 2s linear infinite;
	   -webkit-border-top-right-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	       -moz-border-radius-topright: 0;
	    -moz-border-radius-bottomright: 0;
	           border-top-right-radius: 0;
	        border-bottom-right-radius: 0;
	    -webkit-border-top-left-radius: 3px;
	 -webkit-border-bottom-left-radius: 3px;
	        -moz-border-radius-topleft: 3px;
	     -moz-border-radius-bottomleft: 3px;
	            border-top-left-radius: 3px;
	         border-bottom-left-radius: 3px;
	overflow: hidden;
}

.animate > span:after {
	display: none;
}
@-webkit-keyframes move {
    0% {
       background-position: 0 0;
    }
    100% {
       background-position: 50px 50px;
    }
}