1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
.draw-outline {
    box-shadow:inset 0 0 0 2px #000;
    color:#000;
    -webkit-transition:color 0.25s 0.125s;
    transition:color 0.25s 0.125s;
    position:relative;
}
.draw-outline::before,.draw-outline::after {
    border:0 solid transparent;
    box-sizing:border-box;
    content:'';
    pointer-events:none;
    position:absolute;
    width:0;
    height:0;
}
.draw-outline::before {
    top:0;
    right:0;
}
.draw-outline::after {
    left:0;
    bottom:0;
}
.draw-outline::after {
    border-top-width:2px;
    border-left-width:2px;
}
.draw-outline::before {
    border-bottom-width:2px;
    border-right-width:2px;
}
.draw-outline:hover {
    color:#00a0e9;
}
.draw-outline:hover::before,.draw-outline:hover::after {
    border-color:#00a0e9;
    -webkit-transition:border-color 0s,height 0.25s,width 0.25s;
    transition:border-color 0s,height 0.25s,width 0.25s;
    width:100%;
    height:100%;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX