#box{position:relative;height:14em;width:25em;margin:15px;background-color:#4d7198;}#box::after,#box::before{content:'';position:absolute;left:23em;top:14em;height:0;width:0;border-top:1em solid #4d7198;border-right:1em solid #4d7198;border-left:1em solid transparent;border-bottom:1em solid transparent}#box::before{left:0;border-right-color:transparent;border-left-color:#4d7198}#box:hover #canvas{-webkit-animation-play-state:running !important;animation-play-state:running !important}#box #load{position:absolute;top:5em;left:7.3em;height:3em;width:11em;overflow:hidden;background-color:#688bb0;border-radius:5px;box-shadow:inset 0 0 5px 2px #4d7198;}#box #load #canvas{position:relative;width:17em;height:100%;left:-3em;-webkit-animation-name:loadAnimation;animation-name:loadAnimation;-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-play-state:paused;animation-play-state:paused;}#box #load #canvas .line{float:left;height:5em;width:1em;margin-left:1em;margin-top:-1em;background-color:#4d7198;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}@-webkit-keyframes loadAnimation{0%{margin-left:-1em}100%{margin-left:1em}}@keyframes loadAnimation{0%{margin-left:-1em}100%{margin-left:1em}}