.playbtn {
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    margin:-25px;
    border:8px solid #fff;
    width:45px;
    height:45px;
    border-radius:50%;
    background:#457edb;
    -webkit-box-shadow:0 -1px 0 2px #3e6dbb inset, 0 4px 26px rgba(0, 0, 0, 0.6), 0 3px rgba(255, 255, 255, 0.38) inset;
    -moz-box-shadow:0 -1px 0 2px #3e6dbb inset, 0 4px 26px rgba(0, 0, 0, 0.6), 0 3px rgba(255, 255, 255, 0.38) inset;
    box-shadow:0 -1px 0 2px #3e6dbb inset, 0 4px 26px rgba(0, 0, 0, 0.6), 0 3px rgba(255, 255, 255, 0.38) inset;
    z-index:2;
}

.playbtn:before {
    display:block;
    position:absolute;
    content:"";
    bottom:50%;
    left:50%;
    border:1px solid transparent;
    border-left-color:#fff;
    border-width:13px 0 13px 18px;
    transform:translate(-6px, 50%);
}

.browsertxt {
    position:absolute;
    display:inline-block;
    padding:10px;
    border-radius:5px;
    background:#fff;
    margin-top:-5px;
    max-width:280px;    
    border:1px solid #a9a9a9;
    -webkit-box-shadow:0 0 4px 0 #adadad;
    -moz-box-shadow:0 0 4px 0 #adadad;
    box-shadow:0 0 4px 0 #adadad;
    pointer-events:none;
    font-weight:500;
    font-size:1.3em;
    line-height:30px;
    color:#f16e61;
}

.fadeIn {
    animation-duration:.3s;
    animation-name:fadeInTxt;
    animation-timing-function:cubic-bezier(.71, .55, .62, 1.57);
}

.fadeOut {
    animation-duration:.2s;
    animation-name:fadeOutTxt;
    animation-timing-function:cubic-bezier(.71, .55, .62, 1.57);
}

@keyframes fadeInTxt {
	from {
		opacity:0;
		transform:scale(.9, .9);
	}
	to {
		opacity:1;
		transform:scale(1, 1);
	}
}

@keyframes fadeOutTxt {
	from {
		opacity:1;
		transform:scale(1, 1);
	}
	to {
		opacity:0;
		transform:scale(.9, .9);
	}
}

.mpointer {
  position:absolute;
  width:40px;
  height:40px;
  border-radius:50%;
  background-position:center;
  background:#ffffff00 radial-gradient(circle, transparent 1%, #ffffff90 1%) center/15000%;
  background:rgba(255, 255, 255, 0) radial-gradient(circle, transparent 1%, rgba(255, 255, 255, 0.56) 1%) center/15000%;
  -webkit-transition:background 0.8s;
  -moz-transition:background 0.8s;
  -o-transition:background 0.8s;
  transition:background 0.8s;
}

.click {
  background-color:#f16e61;
  background-size:100%;
  -webkit-transition:background 0.01s;
  -moz-transition:background 0.01s;
  -o-transition:background 0.01s;
  transition:background 0.01s;
}

.nogray svg {
    display:none;
}

.bg {
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background-repeat:no-repeat;
    background-size:auto;    
    -webkit-transition:opacity 1.5s;
    -ms-transition:opacity 1.5s;
    -moz-transition:opacity 1.5s;
    -o-transition:opacity 1.5s;
    transition:opacity 1.5s;
    opacity:1;
    transform-origin: 0 0;
}

.notrans {
    -webkit-transition:none;
    -ms-transition:none;
    -moz-transition:none;
    -o-transition:none;
    transition:none;
}

.gray svg {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'saturate\' values=\'0.5\'/></filter></svg>#grayscale");
    filter: gray alpha(opacity=50);
    -webkit-filter: grayscale(50%);
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
    -webkit-backface-visibility: hidden;
    display:block;
}

.shake {
  animation: shaker 0.6s;
  animation-iteration-count: infinite;
}