/
codepen.css
128 lines (122 loc) · 2.05 KB
/
codepen.css
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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
@import url(//fonts.googleapis.com/css?family=Lato:100,900,300);
* {
font-family: 'Lato', Arial, Helvetica, sans-serif !important;
color:#2E313F;
}
html {
overflow:none;
}
body {
background-color:#d89454;
overflow:none;
}
p#status-wrapper {
background-color:#756563;
width:100%;
padding:1em;
font-weight:900;
font-size:1.125em;
position:absolute;
top:-18px;
left:0;
color:#fffffa;
}
p#pgn-wrapper {
font-weight:900;
font-size:1.25em;
max-width:600px;
margin:0 auto;
}
span#pgn{
font-size:0.85em;
font-weight:300;
color:#FFF;
}
p#fen-wrapper {
font-weight:900;
font-size:1.25em;
max-width:600px;
margin:0 auto;
}
span#fen{
font-size:0.85em;
font-weight:300;
color:#FFF;
}
p#kastle-wrapper {
font-weight:900;
font-size:1.25em;
max-width:600px;
margin:0 auto;
}
span#kastle{
font-size:0.85em;
font-weight:300;
color:#FFF;
}
p#pgn-wrap {
font-weight:900;
font-size:1.25em;
max-width:600px;
margin:0 auto;
}
form{
font-weight:900;
font-size:1.00em;
max-width:450px;
margin:0 auto;
}
p#FEN-wrap {
font-weight:900;
font-size:1.25em;
max-width:600px;
margin:0 auto;
}
span#outFEN{
font-size:0.85em;
font-weight:300;
color:#FFF;
}
.btn-wrapper {
width:100%;
max-width:600px;
min-width:320px;
margin:0 auto;
}
#startBtn, #clearBtn, #colorBtn {
text-align:center;
position:relative;
font-size:1.78em;
background:#756563;
color:#fffffa;
font-weight:900;
padding:0em;
width:197px;
max-width:197px;
}
#board {
border
width:100%;
max-width:600px;
min-width:320px;
margin:3.75em auto 1.25em auto;
}
.board-b72b1 {
border: 15px outset #756563;
}
/* white square */
.white-1e1d7 {
background-color: #F2F4F1;
color: #5a3336;
}
/* black square */
.black-3c85d {
background-color: #5A3336;
color: #f2f4f1;
}
/* highlighted square */
.highlight1-32417, .highlight2-9c5d2 {
-webkit-box-shadow: inset 0 0 3px 3px rgba(209, 75, 45, 0.15);
-moz-box-shadow: inset 0 0 3px 3px rgba(209, 75, 45, 0.15);
box-shadow: inset 0 0 3px 3px rgba(209, 75, 45, 0.15);
}