@charset "utf-8";


button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font: inherit;
  color: inherit;
  height: 35px;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}

#stop {
    background-color: #28A745;
    border: 1px solid #2ECD52;
    color: #FFFFFF;
    width: 120px;
    border-radius: 7px;
	font-size: 14px;
    font-weight: bold;	
}
#play {
    background-color: #e77070;
    border: 1px solid #d24a4a;
    color: #FFFFFF;
    width: 120px;
    border-radius: 7px;
	font-size: 14px;
    font-weight: bold;
}


button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
input {
  line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"] {
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
  -webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  padding: .35em .625em .75em;
  margin: 0 2px;
  border: 1px solid #c0c0c0;
}
legend {
  padding: 0;
  border: 0;
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
/* CSS Document */




.container {
  position: relative;
  display: block;
  margin: 0 10px;
  max-width: 36rem;
}

.gold-text {
  font-family: "Alegreya", serif;
  font-style: italic;
  font-size: 4rem;
  word-spacing: 0.2em;
  display: inline-block;
  padding: 0;
  line-height: 1;
  white-space: nowrap;
  color: transparent;
  background-color: #E8A95B;
  background-image: radial-gradient(ellipse farthest-corner at right bottom, white 0%, #F0BB7A 20%, #E8A95B 60%, transparent 80%), radial-gradient(ellipse farthest-corner at left top, white 0%, #F0BB7A 50%, #DE9945 75%, #E8A95B 100%);
  background-size: 100% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  margin: 0 0 0.5rem 0;
}
.gold-text:before {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  color: #E8A95B;
  z-index: -1;
  text-shadow: 0 -1px 0 #f4cc9b, 0 1px 0 #a77334, 0 2px 0 #9b6b30, 0 3px 0 #90632d, 0 4px 0 #7a5426, 0 4px 2px #7a5426, 0 0.075em 0.1em rgba(26, 35, 39, 0.3), 0 0.15em 0.3em rgba(222, 153, 69, 0.2);
}
.gold-text__highlight {
  display: inline-block;
  position: relative;
  z-index: 1;
}
.gold-text__highlight:after {
  content: attr(data-text);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  background-image: linear-gradient(100deg, transparent 0%, transparent 6rem, white 11rem, transparent 11.15rem, transparent 15rem, rgba(255, 255, 255, 0.3) 20rem, transparent 25rem, transparent 27rem, rgba(255, 255, 255, 0.6) 32rem, white 33rem, rgba(255, 255, 255, 0.3) 33.15rem, transparent 38rem, transparent 40rem, rgba(255, 255, 255, 0.3) 45rem, transparent 50rem, transparent 100%);
  background-clip: text;
  background-size: 60rem 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  -webkit-animation-name: shine;
          animation-name: shine;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-duration: 4s;
          animation-duration: 4s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.gold-text__highlight:before {
  content: attr(data-text);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  color: transparent;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, transparent 35%, transparent 75%, #DE9945 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-animation-name: flash;
          animation-name: flash;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-duration: 4s;
          animation-duration: 4s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}

.decoration-text {
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 300;
  font-size: 0.9rem;
  line-height: 1.5;
  color: transparent;
  background-image: radial-gradient(ellipse at top left, #CFD8DC 0%, rgba(69, 90, 100, 0.75) 75%, transparent 100%);
  background-clip: text;
  -webkit-background-clip: text;
}
#knp2 {
width: 130px;background-color: 
#4BADEE;color: 
#FFFFFF;text-decoration: 
none;padding: 5px 8px;
border-radius: 4px;
border: 1px solid #E7D2B5;
cursor: pointer;
}

#menu{ width:100%; display:flex}
#menu div{color:#fff;  width:100%; height:37px; line-height:37px; text-align:center; text-transform:uppercase; background-color:#D1D1D1; margin-left:1px; margin-right:1px; 
background: -webkit-gradient(linear, left top, left bottom, from(#437e9b), to(#437e9b));}
#menu a{ text-decoration:none; display:block; color: #fff; text-shadow: 0px 0px 1px #585858;}
#menu a:hover{color:#000000}

.css_box {
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.63);
	background-color: #d5e4c3;
	border: 1px solid #C1DECA;
	border-radius: 3px;
    color: #2C343C;
    width: 100%;
	margin:10px 0;
    text-align: left;
    text-shadow: 1px 0px 0px #8E8E8E;
    height: 50px;
    line-height: 10px;
	font-size:16px
}
.css_box img{ margin-right:5px; margin-left:10px}
.css_box div{ float:right; text-align:center;}

.css_box:hover{background-color: #D7ECFF;}

#ostatok{  width:80px; background-color:#FFFFFF; color:#2C343C; font-weight:bold; font-size:24px; border-left:5px solid #28a745}

#price{ width:180px;  color:#2C343C; font-size:24px; background-color:#FFFFFF; border-radius:0 20px 20px 0;}
#time{ width:80px;  color:#2C343C; font-size:18px;}
#ser i{ font-size:22px; margin-right:10px}