.ex1.snake-border:after,.ex2.snake-border:before{content:none}@keyframes snake-border-head{90%{width:0;height:0;top:0;left:0}to{width:40%;height:0;top:0;left:0}0%{width:40%;height:0;top:0;left:0}15%{width:0;height:0;top:0;left:100%}25%{width:0;height:40%;top:0;left:100%}40%{width:0;height:0;top:100%;left:100%}50%{width:40%;height:0;top:100%;left:60%}65%{width:0;height:0;top:100%;left:0}75%{width:0;height:40%;top:60%;left:0}}@keyframes snake-border-tail{90%{height:40%;top:0%}to{width:0;height:0;top:0;left:0}0%{width:0;height:0;top:0;left:0}15%{width:40%}25%{width:0;height:0;top:0;left:100%}40%{height:40%}50%{width:0;height:0;top:100%;left:100%}65%{width:40%;left:0%}75%{width:0;height:0;top:100%;left:0}}.snake-border{position:relative;box-shadow:inset 0 0 0 1px #fff}.snake-border:before,.snake-border:after{content:"";outline:1px solid #fff;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;display:block;position:absolute}.snake-border:before{animation-name:snake-border-head}.snake-border:after{animation-name:snake-border-tail}