-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathvoteEasy.css
More file actions
107 lines (95 loc) · 6.55 KB
/
voteEasy.css
File metadata and controls
107 lines (95 loc) · 6.55 KB
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
body { margin:0px; padding:0px; }
a , a:visited { color:blue; text-decoration:none; }
a:hover , a:active { color:blue; text-decoration:underline; }
#voteEasy {
position:relative; background-color:rgb(150,190,215); padding:1px;
font-family:sans-serif; font-size:10pt;
overflow:hidden;
}
#menuButton { display:inline-block; float:left; height:25px; margin:5px; padding:15px 5px 10px 5px; background:white; opacity:0.50; font-size:150%; font-weight:bold; text-transform:uppercase; border-radius:5px; cursor:pointer; }
#leftMenu { display:none; z-index:100; height:100%; background-color:#cccccc; position:fixed; top:0px; left:0px; box-shadow:0px 0px 10px black; }
#voteEasy.show-menu #leftMenu { display:block; }
#title , .election { border-radius:5px; background-color:rgb(240,240,240); width:120px; margin:10px; padding:10px; text-align:center; }
#title { text-transform:uppercase; }
.firstLetter { font-size:140%; }
.trademark { vertical-align:super; font-size:50%; }
.election { text-transform:uppercase; }
#contentCover { display:none; z-index:99; position:fixed; top:0px; left:0px; width:100%; height:100%; opacity:0.50; background-color:black; cursor:pointer; }
#voteEasy.show-menu #contentCover { display:block; }
#topicButtons { display:none; float:left; font-size:70%; font-weight:bold; }
.topicButtonCell { width:50px; float:left; padding:0px; margin:0px; }
.topicButton {
width:200px; margin-left:-10px;
transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg);
text-transform:uppercase; background-color:white; border-radius:5px; padding:7px; box-shadow: 2px 2px 5px grey; cursor:pointer;
}
#topicSelectorDiv { text-align:center; padding:10px; margin:-5px 0px 0px 0px; }
#topicSelector { padding:10px; font-size:200%; text-transform:capitalize; }
.topicOption { text-transform:capitalize; }
.topicOptionPlaceholder { text-transform:uppercase; color:grey; }
#welcomeMessage { display:block; text-align:center; margin:10px; color:rgba(0,0,0,0.5); font-size:200%; text-shadow:0px 0px 5px white; }
#voteEasy.show-question #welcomeMessage { display:none; }
#question {
position:relative; margin:10px auto 10px auto; width:calc(100% - 10px); max-width:600px; background-color:white;
display:none; border-radius:5px; box-shadow:2px 5px 5px grey;
}
#voteEasy.show-question #question { display:table; }
#prevQuestion { display:table-cell; padding-right:5px; }
.arrow {
margin:40px 0px 20px -5px; height:0px; width:0px;
border-style:solid; border-width:20px 10px 20px 10px; border-color:transparent #cccccc transparent transparent;
cursor:pointer;
}
#questionContent { display:table-cell; vertical-align:top; }
#questionTopic { float:left; margin:10px 10px 0px 10px; text-transform:uppercase; font-weight:bold; }
#topicQuestionCount { color:#888888; text-transform:none; font-weight:normal; margin-left:10px; }
#questionDetails { float:right; margin:15px 10px 0px 0px; color:#4444aa; }
#questionDetails:hover { color:blue; text-decoration:underline; }
.clear { clear:both; }
#questionText { margin:10px; font-size:110%; line-height:150%; }
#answer { display:table-cell; width:100px; border-left:solid 1px #dddddd; vertical-align:top; text-align:center; }
#answerScale { display:inline-block; padding:10px; margin-right:15px; }
#answerTrue { display:inline-block; cursor:pointer; }
.scaleBox { height:10px; width:20px; margin:4px auto 4px auto; border-radius:5px; background-color:#aaaaaa; cursor:pointer; }
.scaleBox.selected { background-color:#00aa00; }
#answerFalse { display:inline-block; cursor:pointer; }
#closeQuestion { position:absolute; top:0px; right:0px; padding:5px; font-size:80%; cursor:pointer; color:grey; }
#nextQuestion { display:table-cell; }
#nextQuestion .arrow {
margin-right:-5px;
transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -webkit-transform:rotate(180deg);
}
#signs { position:relative; margin:30px 0px 0px 0px; height:300px; }
.signCell { display:block; position:absolute; padding:0px; margin:2px; }
.sign {
position:relative; background-color:white; display:inline-block; border-radius:5px; border:solid 1px #cccccc;
padding:10px; text-align:center; text-decoration:none;
}
.candidateName { color:black; }
.sign:hover .candidateName { color:blue; text-decoration:underline; }
.candidateScore { color:#888888; }
.candidateImage { }
.candidateParty { color:#aaaaaa; }
.signPost { margin:0px auto; width:10px; height:40px; background-color:#B5795A; box-shadow:-1px 3px 2px #444444 inset; }
#signs.initial {
margin-top:50px; width:150%; height:auto; text-align:center;
transform:scale(0.66) translate(-25%,-25%); -moz-transform:scale(0.66) translate(-25%,-25%); -ms-transform:scale(0.66) translate(-25%,-25%); -webkit-transform:scale(0.66) translate(-25%,-25%);
}
#signs.initial .signCell { display:inline-block; position:relative; }
#signs.initial .sign { }
#signs.initial .signPost { display:none; }
@media (min-width:825px) {
#menuButton { display:none; }
#leftMenu { display:block; position:relative; float:left; height:auto; background-color:transparent; box-shadow:none; }
#topicButtons { display:block; }
#topicSelector { display:none; }
#welcomeMessage { float:left; margin:100px 0px 100px 150px; }
#question { margin:150px 10px 10px 200px; }
#signs.initial {
margin-top:30px; width:100%; height:300px;
transform:none; -moz-transform:none; -ms-transform:none; -webkit-transform:none;
}
#signs.initial .signCell { display:block; position:absolute; }
#signs.initial .sign { }
#signs.initial .signPost { display:block; }
}