/* | |
##### | |
# Licensed to the Apache Software Foundation (ASF) under one or more | |
# contributor license agreements. See the NOTICE file distributed with | |
# this work for additional information regarding copyright ownership. | |
# The ASF licenses this file to You under the Apache License, Version 2.0 | |
# (the "License"); you may not use this file except in compliance with | |
# the License. You may obtain a copy of the License at | |
# | |
# http://www.apache.org/licenses/LICENSE-2.0 | |
# | |
# Unless required by applicable law or agreed to in writing, software | |
# distributed under the License is distributed on an "AS IS" BASIS, | |
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | |
# See the License for the specific language governing permissions and | |
# limitations under the License. | |
##### | |
*/ | |
body { | |
/*color: #333333;*/ | |
font-family: 'Helvetica', arial; | |
} | |
.wrap { | |
padding: 40px; | |
text-align: center; | |
} | |
hr { | |
clear: both; | |
margin-top: 40px; | |
margin-bottom: 40px; | |
border: 0; | |
border-top: 1px solid #aaaaaa; | |
} | |
h1 { | |
font-size: 24px; | |
margin-bottom: 40px; | |
} | |
p { | |
margin-bottom: 20px; | |
} | |
.btn { | |
background: #428bca; | |
border: #357ebd solid 1px; | |
border-radius: 3px; | |
color: #fff; | |
display: inline-block; | |
font-size: 14px; | |
padding: 8px 15px; | |
text-decoration: none; | |
text-align: center; | |
min-width: 60px; | |
position: relative; | |
transition: color .1s ease; | |
cursor: pointer; | |
} | |
.btn-red { | |
background: #c5321b; | |
border: #bd351e solid 1px; | |
border-radius: 3px; | |
color: #fff; | |
display: inline-block; | |
font-size: 14px; | |
padding: 4px 8px; | |
text-decoration: none; | |
text-align: center; | |
min-width: 50px; | |
position: relative; | |
transition: color .1s ease; | |
cursor: pointer; | |
} | |
.btn-red:hover { | |
background: #d5421b; | |
transition: 0.3s ease; | |
} | |
.btn-green { | |
background: #328a2b; | |
border: #328a2b solid 1px; | |
border-radius: 3px; | |
color: #fff; | |
display: inline-block; | |
font-size: 14px; | |
padding: 4px 8px; | |
text-decoration: none; | |
text-align: center; | |
min-width: 50px; | |
position: relative; | |
transition: color .2s ease; | |
cursor: pointer; | |
} | |
.btn-green:hover { | |
background: #52Aa2b; | |
transition: 0.3s ease; | |
} | |
.btn:hover { | |
background: #357ebd; | |
} | |
.btn.btn-big { | |
font-size: 18px; | |
padding: 15px 20px; | |
min-width: 100px; | |
} | |
.btn-close { | |
color: #aaaaaa; | |
font-size: 30px; | |
text-decoration: none; | |
position: absolute; | |
right: 5px; | |
top: 0; | |
} | |
.btn-close:hover { | |
color: #919191; | |
} | |
.modal:before { | |
content: ""; | |
display: none; | |
background: rgba(0, 0, 0, 0.6); | |
position: fixed; | |
top: 0; | |
left: 0; | |
right: 0; | |
bottom: 0; | |
z-index: 10; | |
} | |
.modal:target:before { | |
display: block; | |
} | |
.modal:target .modal-dialog { | |
-webkit-transform: translate(0, 0); | |
-ms-transform: translate(0, 0); | |
transform: translate(0, 0); | |
top: 20%; | |
} | |
.modal-dialog { | |
background: #fefefe; | |
border: #333333 solid 1px; | |
border-radius: 5px; | |
margin-left: -200px; | |
position: fixed; | |
left: 50%; | |
top: -100%; | |
z-index: 11; | |
width: 640px; | |
word-wrap: break-word; | |
-webkit-transform: translate(0, -500%); | |
-ms-transform: translate(0, -500%); | |
transform: translate(0, -500%); | |
-webkit-transition: -webkit-transform 0.3s ease-out; | |
-moz-transition: -moz-transform 0.3s ease-out; | |
-o-transition: -o-transform 0.3s ease-out; | |
transition: transform 0.3s ease-out; | |
} | |
.modal-body { | |
padding: 20px; | |
word-wrap: break-word; | |
max-height: 450px; | |
overflow: auto; | |
} | |
pre { | |
word-wrap: break-word; | |
white-space: pre-wrap; | |
} | |
.modal-header, | |
.modal-footer { | |
padding: 10px 20px; | |
} | |
.modal-header { | |
border-bottom: #eeeeee solid 1px; | |
} | |
.modal-header h2 { | |
font-size: 20px; | |
} | |
.modal-footer { | |
border-top: #eeeeee solid 1px; | |
text-align: right; | |
} | |
/*ADDED TO STOP SCROLLING TO TOP*/ | |
#close { | |
display: none; | |
} | |
.cls { | |
width: 100%; | |
height: 2px; | |
float: left; | |
} | |
#stv { | |
width: 100%; | |
margin-top: 60px; | |
float: left; | |
} | |
#ballotbox { | |
width: 480px; | |
min-height: 100px; | |
padding-top: 30px; | |
padding-bottom: 10px; | |
background-image: url(/images/ballot_bg.png), linear-gradient(to bottom, #cedce7 0%,#596a72 100%); | |
background-repeat: repeat; | |
border: 4px groove #333; | |
float: left; | |
} | |
#candidates { | |
width: 580px; | |
float: left; | |
min-height: 400px; | |
background-repeat: no-repeat; | |
} | |
#ballot { | |
margin: 0 0 0 0; | |
} | |
.ballotbox { | |
border: 1px dotted #666; | |
padding: 4px; | |
max-width: 340px; | |
min-height: 25px; | |
cursor: move; | |
cursor: grab; | |
font-family: monospace; | |
font-size: 16px; | |
background: linear-gradient(to bottom, #f8f8f8 0%,#dddddd 100%); | |
-khtml-user-drag: element; | |
} | |
.fillerbox { | |
padding: 4px; | |
max-width: 300px; | |
min-height: 26px; | |
font-family: monospace; | |
font-size: 16px; | |
margin: 0 0 0 0; | |
-khtml-user-drag: element; | |
margin-left: 40px; | |
} | |
.ballotbox_clist { | |
border: 1px dotted #666; | |
padding: 4px; | |
max-width: 330px; | |
min-height: 25px; | |
cursor: move; | |
cursor: grab; | |
font-family: monospace; | |
font-size: 16px; | |
background: linear-gradient(to bottom, #f8f8f8 0%,#dddddd 100%); | |
-khtml-user-drag: element; | |
} | |
.statement_marker { | |
border: 1px dotted #666; | |
padding: 4px; | |
max-width: 100px; | |
min-height: 12px; | |
font-family: monospace; | |
font-size: 12px; | |
color: #FFF; | |
background: linear-gradient(to bottom, #3b679e 0%,#2b88d9 50%,#207cca 51%,#7db9e8 100%); | |
-khtml-user-drag: element; | |
float: right; | |
right: 0px; | |
top: 0px; | |
position: static; | |
} | |
.statement_marker a { | |
color: #fff; | |
} | |
.ballotSelected { | |
border: 1px dotted #666; | |
padding: 4px; | |
max-width: 340px; | |
min-height: 25px; | |
cursor: move; | |
cursor: grab; | |
font-family: monospace; | |
font-size: 16px; | |
background: linear-gradient(to bottom, #f4f0ad 0%,#eae477 100%); | |
} | |
.ballotbox:hover { | |
background: linear-gradient(to bottom, #b0d4e3 0%,#88bacf 100%); | |
} | |
p { | |
max-width: 1100px; | |
} | |
body, html { | |
width: 1200px; | |
margin: 0 auto; | |
} | |
* { | |
-webkit-user-select: none; | |
} | |
#ballot { | |
list-style: none; | |
text-align: left; | |
} | |
#ballot .ballotNumber { | |
/*background: linear-gradient(to bottom, #fccd41 0%,#cea202 100%);*/ | |
background: linear-gradient(to bottom, #4f7bff 0%,#1444bc 100%); | |
border-radius: 12px; | |
border: 3px solid #FFF; | |
color: #FFF; | |
box-shadow: 0px 2px 2px 0px rgba(153,153,153,1); | |
width: 20px; | |
float: left; | |
text-align: center; | |
font-family: sans-serif; | |
margin-right: 8px; | |
height: 16px; | |
font-size: 12px; | |
margin-bottom: 4px; | |
padding-top: 3px; | |
position: relative; | |
top: 0px; | |
left: 0px; | |
} |