fsfe-website/look/generic.css

1707 lines
25 KiB
CSS

/*
New design for fsfe.org.
Colours to use:
TODO
Editing rules:
- Colours should be given in RGB.
- Properties should be split with a colon and a space.
- Selectors should be on separate lines, where the last item will
carry the block opener.
- Indentation should be two spaces, and no tabs should be used.
- Any images or other resources' URLs must be given in absolute
paths.
- Font sizes (apart from the first font size definition in body) and
line heights must be set in percent.
- Generally strive not to repeat yourself (DRY).
*/
@import url("grid.css");
@import url("input.css");
/* Custom fonts */
/*
This is apparently a malformed font, according to certain web browsers.
@font-face {
font-family: Lucida Sans;
src: url("/fonts/LSANS.TTF");
}
*/
@font-face {
font-family: Nimbus Sans L;
src: url("/fonts/NimbusSanL-Regu");
}
* {
margin: 0;
padding: 0;
}
body {
font-family: "Arial", sans-serif;
font-size: 12px;
line-height: 180%;
color: rgb(50,50,50);
background-color: rgb(240,240,240);
background-image: url("/graphics/ribbon-gray.png");
background-repeat: no-repeat;
background-position: 19px 70px;
}
.text,
p,
li {
font-size :110%;
}
a:link,
a:visited {
text-decoration: none;
}
a:link {
color: rgb(51,148,206);
}
a:hover {
text-decoration: underline;
}
a:visited {
color: rgb(153,186,206);
}
a img {
border: 0;
}
h1,
h2,
h3,
h4,
h5,
h6,
#content p#category {
font-family: "Helvetica", "Arial", sans-serif;
}
h1,
h2,
h3 {
font-weight: normal;
line-height: normal;
}
h2 {
color: #202D79;
font-size: 200%;
letter-spacing: -.5px;
line-height: 120%;
margin: .4em -.3em .5em;
padding: 0 .3em .2em;
}
h3 {
color: rgb(32,45,121);
line-height: 110%;
margin: 1.5em 0 .8em 0;
font-size: 190%;
}
p {
margin: .8em 0;
}
pre {
font-family: monospace;
font-size: 90%;
line-height: 140%;
background-color: rgb(240,240,240);
border-top: 1px dotted rgb(210,210,210);
border-bottom: 1px dotted rgb(210,210,210);
padding: 1.2em 0 1.2em 187px;
max-height: 14em;
overflow: auto;
margin: 1em 0;
box-shadow: 10px 0 0 rgb(240,240,240);
}
ul,
ol {
padding-left: 1.5em;
}
ul {
list-style: circle;
}
/* generic classes */
.clear {
clear: both!important;
}
.center {
text-align: center;
float: none!important;
}
.left {
float: left;
margin-left: 0;
}
.right {
float: right;
margin-right: 0;
}
p.left {
padding: 0 2% 0 0;
}
.right {
float: right;
}
.grid-40 {
width: 38%;
}
.grid-40.left {
padding-right:1%
}
.grid-50 {
width: 48%;
}
.grid-40.left {
padding-right:1%
}
.grid-60 {
width: 56%;
}
.grid-60.right {
padding-left:1%
border-left:1px solid #CCC;
}
.even {
background-color: #DEEEFF;
}
.compare .clear .left:first-child {
padding-left: 0;
}
.compare .clear .left {
padding-left: 1em;
}
.compare hr {
clear: both;
margin: 0 0 2.5em;
}
.even {
background-color: #DEEEFF;
}
#wrapper {
margin:0 5% 0 1%;
padding-bottom: 0;
max-width: 980px;
min-width: 500px;
border-left: 1px solid rgb(240,240,240);
}
#wrapper-inner {
float: left;
background-color: white;
padding-bottom: 3em;
-moz-border-radius-bottomright: 25px;
-moz-border-radius-bottomleft: 3px;
border-bottom-right-radius: 25px;
border-bottom-left-radius: 3px;
box-shadow: 3px 3px 4px rgba(0,0,0,.1);
-webkit-box-shadow: 3px 3px 4px rgba(0,0,0,.1);
-moz-box-shadow: 3px 3px 4px rgba(0,0,0,.1);
overflow: hidden;
width: 100%;
}
.n {
display: none;
}
.read_more {
text-align: right;
}
.break {
clear: both;
}
/* header */
#header {
background: url("/graphics/ribbon.png") no-repeat scroll left bottom transparent;
min-height: 220px;
margin: 0;
width: 100%
}
#logo {
float: left;
margin: 1em 0 0 1%;
max-width: 29%;
width: 200px;
}
#logo a img {
max-width: 100%;
}
#statement {
color: rgb(140,140,140);
float: left;
font-size: 120%;
margin: 3em 2% 0 8%;
width: 60%;
}
/* sidebar */
#menu,
#search,
#translations {
margin-bottom: 1em;
clear: left;
float: left;
max-width: 100%;
}
#search,
#translations {
padding-left: .8em;
}
#search input[type="image"] {
background-color: transparent;
border: 0;
margin-top: 10px;
vertical-align: middle;
}
#search input[type="text"] {
/*padding-left: 30px;
width: 150px;*/
width: 80%;
padding: 5px 8px 5px 30px;
}
#search p {
margin: 0;
}
#translations ul {
font-size: 90%;
padding-left: 0;
}
#translations ul li {
list-style: none;
line-height: 120%;
}
/* fundraising box */
#fundraising {
min-height: 75px;
margin: 0 0 2em;
padding: 0 0 0 1em;
font-family: Nimbus Sans L, Helvetica, Verdana, sans-serif;
background: url('/graphics/xmas-fr-bg.png') no-repeat top right;
border: 1px solid #800000;
padding: 0.6em 1em 0.6em 1em;
overflow: hidden;
}
#fundraising h2 {
color: #9d0000;
font-weight: bold;
margin: 0.3em 1em 0.3em 0;
float:left;
}
#fundraising .button {
float: left;
margin: 0.5em 0.5em 0 0;
}
#fundraising .button a {
padding: 0.2em 0.4em;
font-size: 1.5em;
color: white;
font-weight:bold;
float:left;
display:block;
background: url('/graphics/xmas-fr-button-bg.png') repeat-x bottom left;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: none;
}
#fundraising .button a:hover {
box-shadow: 0 0 15px #00222B inset;
-moz-box-shadow: 0 0 15px #00222B inset;
-webkit-box-shadow: 0 0 15px #00222B inset;
}
#fundraising img {
margin: 0;
}
#fundraising p {
clear: left;
float: left;
font-size: 1.6em;
margin: 0 0 0.3em 0;
}
#fundraising div.percentbox {
margin: 1em 0 .5em 0;
border: 1px solid #202d79;
background-color: #4ad2f0;
}
#fundraising div.percentbar {
height: 1em;
background-color: #3394ce;
}
#fundraising p.current {
float: left;
margin: 0;
text-align: left;
}
#fundraising p.target {
margin: 0;
text-align: right;
}
/* ------------------------------------------------------------------------- */
/* Content */
/* ------------------------------------------------------------------------- */
/* content specific */
#content {
clear: right;
float: left;
min-height: 400px;
width: 78%;
font-size: 100%;
}
#content.frontpage {
font-size: 100%;
}
#content p#category {
font-size: 170%;
font-weight: bold;
line-height: 120%;
margin: 0 0 0.3em;
}
h1,
h2,
h3 {
color: #202D79;
line-height: normal;
}
h1 {
border-bottom: 1px solid #D2D2D2;
font-size: 250%;
margin: 0;
padding: 0 0 0.5em;
}
h2 {
margin-top: 1.5em;
}
h3 {
font-size: 140%;
margin: 1.5em 0 .2em 0;
}
.image {
background-color: #FDFDFD;
float: left;
}
.image.right {
float: right;
padding: 0 0 2em 2em;
}
.image p {
border-bottom: 1px solid rgb(210,210,210);
border-left: 1px solid rgb(210,210,210);
border-right: 1px solid rgb(210,210,210);
font-size: 90%;
margin-top: 0;
padding: .5em;
}
.image .photographer {
font-size: 90%;
font-style: italic;
}
.imgright { /* compatibility */
float: right;
margin: 0 0 1em 1em;
}
.captioned {
padding: 0.5em;
border: 1px solid #D2D2D2;
margin: 1em;
text-align: center;
}
.captioned img {
}
.captioned p {
padding: 0.5em 0.5em 0 0.5em;
margin: 0;
border-top: 1px solid #dcdcdc;
}
.postit { /* compatibility */
float: left;
margin: 0 1em 1em 0;
border: 1px #000 solid;
padding: 0.3em;
width: 14em;
background: #FFECBF;
text-align: center;
}
.fineprint { /* compatibility */
color: rgb(120,120,120);
font-size: 90%;
border-top: 1px solid rgb(220,220,220);
padding: 1em .5em;
margin: 3em -.5em 1em;
}
.toolbox { /* compatibility */
background-color: rgb(244,248,250);
float: right;
font-size: 85%;
margin: .5em 0 0 1em;
padding: 1em;
width: 12em;
}
p.terminal,
pre.terminal,
p.file,
pre.file {
font-family: monospace;
padding: .5em 1em;
}
p.terminal,
pre.terminal {
background-color: rgb(50,50,50);
border-left: 10px solid rgb(97,97,97);
color: white;
}
p.file,
pre.file {
background-color: rgb(244,248,250);
border-left: 10px solid rgb(141,172,190);
color: rgb(50,50,50);
}
#introduction {
border-bottom: 1px solid rgb(210,210,210);
float: left;
font-size: 125%;
margin: 0 -.5em 2em -.5em;
min-height: 60px;
padding: 1em .5em;
width: 100%;
}
#introduction img {
margin: 0;
padding: 0 1em 0 0;
}
#introduction p,
p#introduction {
line-height: 190%;
font-size: 110%;
}
#introduction + * {
clear: left;
}
/*
* This expands #introduction until all content has been printed, so it
* doesn't flow outside of the element.
*/
#introduction p::after {
content: "";
clear: both;
height: 1px;
overflow: hidden;
}
#introduction .image {
margin: .5em;
padding-bottom: 0;
}
#introduction .read_more {
margin: 0 -1em;
padding: 0 1em 1em 0;
text-align: right;
}
/* ------------------------------------------------------------------------- */
/* Subpages menu */
/* ------------------------------------------------------------------------- */
h2#subpages,
h3#subpages,
h4#subpages {
display: none;
}
h2#subpages.show-heading,
h3#subpages.show-heading,
h4#subpages.show-heading {
display: block;
}
ul#subpages,
h2#subpages + ul,
h3#subpages + ul,
h4#subpages + ul {
margin: 2em 0 2em 0;
list-style-type: none;
padding: 0 1em;
}
ul#subpages li,
h2#subpages + ul li,
h3#subpages + ul li,
h4#subpages + ul li {
float: left;
margin-bottom: .1em;
min-width: 8em;
padding-right: 3%;
width: 47%;
}
ul#subpages li:nth-child(odd),
h2#subpages + ul li:nth-child(odd),
h3#subpages + ul li:nth-child(odd),
h4#subpages + ul li:nth-child(odd) {
clear: left;
}
/* navigation sidebar */
#navigation {
background-color: rgb(74,210,240);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
height: 28px;
font-size: 105%;
font-weight: bold;
}
#navigation,
#navigation a,
#navigation #search {
color: rgb(244,254,255);
text-decoration: none;
}
#navigation ul#menu {
float: left;
list-style: none;
}
#navigation ul#menu li {
float: left;
}
#navigation ul#menu li a {
display: block;
padding: 5px 18px;
}
#navigation ul#languages {
background-color: rgb(74,210,240);
float: left;
width: 120px;
text-align: center;
padding: 5px 10px 3px 10px;
}
#navigation ul#languages li {
display: none;
}
#navigation ul#languages li a {
display: block;
border-bottom: 1px dotted white;
}
#navigation ul#languages li:first-child a,
#navigation ul#languages li:last-child a {
border-bottom: 1px solid transparent;
}
#navigation ul#languages:hover li:first-child {
border-bottom: 1px dotted white;
}
#navigation ul#languages:hover li:first-child a {
font-weight: bold;
}
#navigation ul#languages li a:hover {
color: white;
font-weight: normal !important;
}
#navigation ul#languages li.selected {
display: block;
}
#navigation ul#languages li.selected a {
font-weight: normal;
}
#navigation ul#languages:hover li {
display: block;
}
#navigation #search {
float: right;
margin: 4px 3px 0 0;
}
#navigation #search input {
font-size: 95%;
padding: 2px;
}
#navigation #search input:focus {
border-color: inherit;
}
#navigation #search input[type=submit] {
margin-left: -20px;
position: absolute;
border: 0;
padding: 0;
border-left: 1px dotted rgb(130,130,130);
width: 20px;
height: 20px;
}
/* sidebar */
#sidebar {
clear: left;
float: left;
line-height: 100%;
width: 19%;
min-width: 125px;
word-wrap: break-word;
padding: 0 1em 0 0;
}
/* menu */
#menu a {
color: rgb(110,110,110);
text-decoration: none;
display: block;
padding: 0.8em 0 0.8em 0.8em;
line-height: 120%;
font-size: 15.5px;
}
#menu ul {
list-style: none;
margin: 0 0 0 0;
padding: 0;
}
#menu ul + ul {
border: 0;
}
#menu ul li a {
font-weight: bold;
}
#menu ul li ul li a {
font-weight: normal;
padding: 0.3em 0 0.4em 1.6em;
}
#menu ul li.fsfe ul li a,
#menu ul li.fellowship ul li a,
#menu ul li.planet ul li a,
#menu ul li.wiki ul li a {
font-weight: normal;
}
#menu ul li.fsfe ul li a:hover,
#menu ul li.fellowship ul li a:hover,
#menu ul li.planet ul li a:hover,
#menu ul li.wiki ul li a:hover {
background-color: white;
}
#menu ul li ul { /* “submenu */
border-left: none;
font-size: 120%;
}
#menu ul li.fsfe a {
border-left: 15px solid #4ad2f0;
}
#menu ul li.fsfe a:hover {
border-left: 15px solid #4ad2f0;
background-color: #B2F1FF;
}
#menu ul li.fsfe ul li a {
border-left: 15px solid #DCDCDC;
}
#menu ul li.fsfe ul li a:hover {
border-left: 15px solid #B2F1FF;
}
#menu ul li.planet a {
border-left: 15px solid #4aa0f0;
}
#menu ul li.planet a:hover {
background-color: #92CAFF;
}
#menu ul li.planet ul {
display: none;
}
#menu ul li.planet ul li a {
border-left: 15px solid #DCDCDC;
}
#menu ul li.planet ul li a:hover {
border-left: 15px solid #4aa0f0;
}
#menu ul li.wiki a {
border-left: 15px solid #adff54;
}
#menu ul li.fellowship a {
border-left: 15px solid #6BC800;
}
#menu ul li.fellowship a:hover {
background-color: #CDFF93;
}
#menu ul li.fellowship ul li a {
border-left:15px solid #DCDCDC;
}
#menu ul li.fellowship ul {
display: none;
}
#menu ul li.fellowship ul li a:hover {
border-left: 15px solid #ABFF4A;
}
#menu ul li ul li #selected,
#menu ul li ul li #selected:hover {
border-left: 15px solid #C1C1C1;
color: #333333;
display: block;
font-size: 15.5px;
font-weight: normal;
line-height: 50%;
padding: 0.6em 0 0.8em 1.6em
}
.section {
width: 47.9%;
float: left;
padding: 0 .8%;
}
.section .entry h3 {
margin: 1.5em 0 .2em;
}
.section .entry p.date {
margin: 0;
padding: 0;
font-size: 100%;
font-weight: bold;
color: #6e6e6e;
}
.section h2 {
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
border: 0 none;
color: black;
float: right;
font-size: 130%;
font-weight: bold;
letter-spacing: normal;
line-height: normal;
margin: 1.5em -1.7% 1em;
min-height: 1.6em;
text-align: right;
width: 100%;
color: white;
}
.section h2 a, .section h2 span {
color: white;
float: right;
padding: 0.2em 0.6em 0.2em 0;
}
.section .entry form {
float: left;
}
.section.grid-100 {
width: 100%;
}
#news.section,
#identica.section {
margin-right: .5em;
}
#news.section h2,
#donate-once.section h2 {
background-color: #4ad2f0;
}
#newsletter.section h2,
#donate-regular.section h2 {
background-color: #7fdf55;
}
.section ul {
clear: left;
}
#newsletter.section ul li {
font-size: 1.2em;
}
#events.section h2 {
background-color: #4AA0F0;
}
#team.section h2, #identica.section h2 {
background-color: #7fdf55;
}
#contact.section h2 {
background-color: #BDE455;
}
#identica.section .entry div {
float: left;
}
#identica.section h3, #identica.section h4 {
display: none;
}
#newsletter #language {
min-width: 7em;
width: 30%;
margin: 0 2% 0 0;
}
#newsletter #email {
width: 38%;
margin: 0 2% 0 0;
}
#newsletter #submit {
min-width: 6em;
width: 23%;
}
.section a.rss-feed,
.section a.ical {
display: block;
float: left;
height: 20px;
margin: .4em 0 0 .2em;
padding: 0;
width: 20px;
}
/* footer */
#footer {
font-size: 90%;
line-height: 140%;
padding: 1em 0;
clear: both;
margin: 0 4em 2em 15px;
max-width: 980px;
min-width: 500px;
min-height: 8em;
color: rgb(140,140,140);
}
#footer a {
color: rgb(100,100,100);
}
#footer #notice {
float: left;
margin-right: 10%;
width: 50%;
}
#footer #notice > p {
margin-top: 0;
}
#footer #notice ul {
list-style: none;
padding: 0;
}
#footer #notice ul li {
display: inline;
margin-right: .8em;
}
#footer #sister_organizations {
float: right;
width: 40%;
}
#footer #sister_organizations h2 {
font-size: 100%;
margin-top: 0;
color: rgb(120,120,120);
border: 0;
padding: 0;
}
#footer #sister_organizations ul {
list-style: circle;
}
/* news and events */
#events .date .day {
font-size: 220%;
display: block;
padding-bottom: .3em;
}
#events .date.multiple p {
margin: 0;
color: rgb(190,190,190);
}
#events .date.multiple .day {
font-size: 150%;
}
#events .date.multiple .month {
font-size: 90%;
}
#events .date .month {
font-size: 140%;
}
#events .details {
}
#events .details > p {
margin-top: 0;
}
#frontpage .entry {
margin-bottom: 3em;
}
/* announcement */
#announcement {
min-height: 8em;
text-align: center;
margin-bottom: 2em;
}
#announcement img {
float: none;
margin: 0;
}
/* advocacy pages */
.copyable-code {
clear: both;
margin: 1.5em 0;
}
/* item-grid (used for shop/orders) */
.item-grid h2 {
border-bottom: 1px solid #CCCCCC;
margin-bottom: 0;
}
#content .item-grid .image {
padding: 2em;
}
/* Footnotes */
h2#fn {
display: none;
}
h2#fn + ol {
border-top: 1px solid #ccc;
font-size: 90%;
margin-top: 3em;
padding-top: .5em;
width: 30%;
}
h2#fn + ol li {
width: 300%;
}
a.fn {
bottom: .5em;
font-size: 70%;
position: relative;
}
/* Front page */
#campaigns-boxes {
overflow: hidden;
}
#campaign-box-1 {
width: 65.5%;
height: 200px;
float: left;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
background: url("/graphics/pdf-banner.png") no-repeat top right;
overflow: hidden;
}
#campaign-box-1 a h3 {
display: block;
font-family: "Lucida Sans", sans-serif;
font-size: 1.8em;
margin: .5em;
width: 40%;
margin-top: 70px;
}
#campaign-box-1 a h3,
#campaign-box-1 a:hover {
text-decoration:none;
color: rgb(54,137,10);
}
#campaign-box-2 {
width: 32%;
float: right;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
#campaign-box-2 p {
margin: 0;
padding: 1.7em 0 0 0;
font-weight: bold;
}
#campaign-box-3 {
-moz-border-radius: 7px 7px 7px 7px;
background-color: silver;
float: left;
min-height: 45px;
margin: 1.5em 0 0 0;
width: 100%;
display:none;
}
a.donate-box, a.fellowship-box {
display: block;
font-family: "Lucida Sans", sans-serif;
height: 94px;
border-radius: 7px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
text-align: center;
font-size: 1.8em;
font-weight: bold;
}
#campaign-box-2 a.donate-box {
color:#3394ce;
-moz-box-shadow:inset 0 0 6px #00222b;
-webkit-box-shadow:inset 0 0 6px #00222b;
box-shadow:inset 0 0 6px #00222b;
margin: 0 0 12px;
background:url("/graphics/donate-button-bg.png") no-repeat top left;
}
#campaign-box-2 a.donate-box:hover,
#campaign-box-2 a.fellowship-box:hover {
text-decoration: none;
}
#campaign-box-2 a.donate-box:hover {
color: #2A7BAD;
-moz-box-shadow: inset 0 0 20px #00222b;
-webkit-box-shadow: inset 0 0 20px #00222b;
box-shadow: inset 0 0 20px #00222b;
}
#campaign-box-2 a.fellowship-box {
color: #70d055;
-moz-box-shadow: inset 0 0 6px #17280b;
-webkit-box-shadow: inset 0 0 6px #17280b;
box-shadow: inset 0 0 6px #17280b;
background: url("/graphics/join-button-bg.png") no-repeat top left;
}
#campaign-box-2 a.fellowship-box:hover {
color: #5DAC46;
-moz-box-shadow: inset 0 0 20px #17280b;
-webkit-box-shadow: inset 0 0 20px #17280b;
box-shadow: inset 0 0 20px #17280b;
}
/* Overview pages */
ul.overview {
list-style-type: none;
margin: 0;
margin-bottom: 1em;
padding: 0;
padding-right: 1.5%;
float: left;
width: 45%;
}
/* Article pages */
#article-metadata {
margin: 0.5em 0 1.5em;
}
#article-metadata p {
margin: 0;
}
#article-metadata a {
color: #323232;
}
#article-metadata span.label {
color: #202D79;
padding-left: 1em;
}
#article-metadata span.label:first-child {
padding-left: 0;
}
/* identica feed */
#identica-feed {
float: right;
width: 29%;
font-size: 90%;
line-height: 110%;
overflow: auto;
height: 150px;
}
#identica-feed .name,
#identica-feed .date {
display: block;
}
#identica-feed .name {
float: left;
font-weight: bold;
}
#identica-feed .date {
text-align: right;
}
#identica-feed p {
clear: left;
}
#identica-feed img {
height: 16px;
width: 16px;
vertical-align: middle;
}
#identica-feed li {
list-style: none;
margin-bottom: .5em;
border-bottom: 1px solid rgb(210,210,210);
padding-bottom: .5em;
}
/* tables */
table {
border-collapse: collapse;
margin-bottom: 1em;
max-width: 100%;
font-size: 100%;
}
table th,
table td {
padding: .2em .5em;
}
table th + th,
table td + td {
border-left: 1px solid #ccc;
}
table th {
border-bottom: 1px solid #202d79;
border-top: 1px solid #202d79;
color: #202d79;
background-color: #f4f8fa;
}
table td {
border-bottom: 1px solid #ccc;
}
table.restricted-width {
max-width: 200px; /* to fix pdfreaders buglist page problems */
}
table td.positive {
background-color: #d0ffd0;
}
table td.negative {
background-color: #ffd0d0;
}
table.noborders td,
table.noborders th {
border: 0;
}
tr.highlighted {
background-color :#D0F400;
}
/* notices */
#outdated-notice {
border: 1px solid red;
padding: 0.5em;
margin: 0 0 1.5em 0;
}
/* service notice */
#service-notice {
position: fixed;
background-color: rgb(51,148,206);
border-bottom: 1px solid rgb(41,138,196);
font-size: 90%;
color: white;
line-height: 120%;
opacity: .8;
width: 100%;
}
#service-notice h1 {
font-size: 130%;
margin: 0 0 .5em 0;
font-weight: bold;
}
#service-notice p {
margin: .4em 0;
}
#service-notice a:link,
#service-notice a:visited {
color: rgb(214,234,245);
}
#service-notice .text {
padding: .6em 2em;
}
#service-notice .close {
margin: 1em 2em 0 0;
float: right;
}
#service-notice .close a {
background-color: rgb(137,226,245);
border: 2px solid rgb(51,148,206);
padding: .2em .4em;
font-size: 180%;
font-weight: normal;
cursor: pointer;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
}
#service-notice .close a:link,
#service-notice .close a:visited {
color: rgb(51,148,206);
}
#service-notice .close a:hover,
#service-notice .clsoe a:active {
color: rgb(32,45,121);
}
/* People pages */
.people img {
float:left;
margin-right:10px;
width:48px;
height:48px;
border:1px solid #000;
}
ul.people {
list-style-type:none;
}
ul.people li {
display:block;
float:left;
width:48%;
min-width:20em;
padding-right:0.5em;
}
ul.people li:nth-child(odd) {
clear: left;
}
ul.people li:last-child {
margin-bottom:1.5em;
}
.people .name, .people .email {
display:block;
}
.people .name {
font-weight: bold;
}
.people .email {
font-style: italic;
}
/* Testimonials divs */
.testimonial {
overflow: auto;
clear: both;
}
.testimonial img {
float: left;
margin-right: 10px;
}
/* address div */
address {
margin: .8em 0; /* should be the same as for <p> */
}
/* fieldsets - remove that ugly border */
fieldset {
border: medium none;
}
/* AskYourCandidates - parties colors for their answers */
.question {
margin-bottom: 15px;
margin-top: 60px;
}
.answer,
.question2,
.answer2 {
padding: 0.5em 1em;
text-align: justify;
}
.question2 {
margin-left: 1em;
}
.answer2 {
margin-left: 2em;
}
.colorless {
background-color: #EEEEEE;
border-left: 10px solid #AAAAAA;
}
/* Germany */
.diegrüne {
background-color: #C8FFC8;
border-left: 10px solid #008B00;
}
.cdu {
background-color: #B4E6FF;
border-left: 10px solid #004F7A;
}
.spd {
background-color: #FFC8C8;
border-left: 10px solid #FF0000;
}
.dielinke {
background-color: #FFC6FF;
border-left: 10px solid #8B1C62;
}
.piraten {
background-color: #FFE992;
border-left: 10px solid #F37D20;
}
.fdp {
background-color: #FFFFC8;
border-left: 10px solid #FFFF00;
}
.oedp {
background-color: #FFE9BB;
border-left: 10px solid #F2862B;
}
/* France */
.partisocialiste {
background-color: #FFDCDC;
border-left: 10px solid #FF8080;
}
.ump {
background-color: #A0C8FF;
border-left: 10px solid #0066CC;
}
.pcf {
background-color: #FFC8C8;
border-left: 10px solid #DD0000;
}
.prg, .mrc {
background-color: #FFF0FA;
border-left: 10px solid #FFD1DC;
}
.eelv {
background-color: #C8FFC8;
border-left: 10px solid #00FF00;
}
.nouveaucentre {
background-color: #DCFFFF;
border-left: 10px solid #80FFFF;
}
.modem {
background-color: #FFE696;
border-left: 10px solid #FF9900;
}
.alliancecentriste {
background-color: #FFEBC8;
border-left: 10px solid #F5DEB3;
}
/* -------------------------------------------------------------------- */
/* Tags lists */
/* -------------------------------------------------------------------- */
ul.taglist {
text-align: center;
}
ul.taglist li {
display: inline;
margin: 5px;
white-space: nowrap;
}
.tag16 {
font-size: 16;
}
.tag17 {
font-size: 17;
}
.tag18 {
font-size: 18;
}
.tag19 {
font-size: 19;
}
.tag20 {
font-size: 20;
}
.tag21 {
font-size: 21;
}
.tag22 {
font-size: 22;
}
.tag23 {
font-size: 23;
}
.tag24 {
font-size: 24;
}
.tag25 {
font-size: 25;
}
.tag26 {
font-size: 26;
}
.tag27 {
font-size: 27;
}
.tag28 {
font-size: 28;
}
.tag29 {
font-size: 29;
}
.tag30 {
font-size: 30;
}
.tag31 {
font-size: 31;
}
.tag32 {
font-size: 32;
}
.tag33 {
font-size: 33;
}
.tag34 {
font-size: 34;
}
.tag35 {
font-size: 35;
}
.tag36 {
font-size: 36;
}
.tag37 {
font-size: 37;
}
.tag38 {
font-size: 38;
}
.tag39 {
font-size: 39;
}
.tag40 {
font-size: 40;
}