MediaWiki:Common.css
De WikiMemoria
Nota: tras guardar, quizás necesites actualizar la caché de tu navegador para ver los cambios.
- Firefox/Safari: Mantén presionada la tecla Mayús mientras pulsas el botón Actualizar, o presiona Ctrl+F5 o Ctrl+R (⌘+R en Mac)
- Google Chrome: presiona Ctrl+Shift+R (⌘+Mayús+R en Mac)
- Internet Explorer: mantén presionada Ctrl mientras pulsas Actualizar, o presiona Ctrl+F5
- Opera: dirígete a Menú → Configuración (Opera → Preferencias en Mac) y luego a Privacidad y seguridad → Borrar datos de navegación → Imágenes y archivos en caché.
/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */
body.page-Página_principal h1.firstHeading, body.page-Página_principal #catlinks { display:none; }
body.page-Página_principal div#p-search { display:none; }
body.page-Página_principal div#right-navigation { margin-right: 100px; }
/* Arregla problemas interlineado para <sup> y <sub> */
sup, sub {
line-height: 1em;
}
/* Arreglando tamaño de fuente en etiquetas <syntaxhighlight> (<source>) y páginas .css y .js.
[[Bugzilla:26204]] */
div.mw-geshi div,
div.mw-geshi div pre,
span.mw-geshi,
pre.source-css,
pre.source-javascript {
font-family: monospace, Courier !important;
}
/* Tamaño fuente de referencias */
ol.references,
div.listaref,
div.refcomienza {
font-size: 90%; /* Default font-size */
margin-bottom: 0.5em;
}
div.listaref ol.references {
font-size: 100%; /* Reset font-size when nested in div.listaref */
list-style-type: inherit; /* Enable custom list style types */
}
/* Colorea de azul al clickear referencias */
ol.references > li:target,
sup.reference:target,
span.citation:target, cite:target {
background-color: #DEF;
}
/* Las referencias ahora no pueden ser texto en negrita o italico */
sup.reference {
font-weight: normal;
font-style: normal;
}
/* Estilo para citacion */
.citation {
word-wrap: break-word;
}
/* For linked citation numbers and document IDs, where
the number need not be shown on a screen or a handheld,
but should be included in the printed version */
@media screen, handheld {
.citation *.printonly {
display: none;
}
}
/* Llamadas al pie: Quitar corchetes */
.corchete-llamada {display: none}
/* Category tree styling. Works in conjuction with [[MediaWiki:Categorytree-expand-bullet]],
[[MediaWiki:Categorytree-collapse-bullet]] and [[MediaWiki:Categorytree-empty-bullet]]. */
#mw-subcategories ul {
list-style: none none;
margin-left: 0.25em;
}
.CategoryTreeChildren {
margin-left: 1.25em;
}
/* CSS para infoboxes */
.infobox {
border: 1px solid #aaa;
background-color: #f9f9f9;
color: #000;
margin-bottom: 0.5em;
margin-left: 1em;
padding: 0.2em;
float: right;
clear: right;
}
.infobox td, .infobox th,
.infobox_v2 td, .infobox_v2 th {
vertical-align: top;
}
.infobox caption {
font-size: larger;
margin-left: inherit;
}
/* ===== infoboxes V2 ("nuevas") ==== */
.infobox_v2 {
border: 1px solid #B4BBC8;
background-color: #f9f9f9;
color: #000;
margin: .5em 0 .5em 1em;
padding: .4em;
clear: right;
float: right;
font-size: 90%;
line-height: 1.5em;
width: 22.5em
}
.infobox_v2 .cabecera {
font-size: 140%;
font-weight: bolder;
height: 45px;
line-height: 1.2em;
text-align: center;
vertical-align: middle
}
.infobox_v2 .media {
font-weight: bolder;
height: 35px;
text-align: center;
vertical-align: middle
}
/* Códigos para tipos especificos de infoboxes */
.infobox.bordered {
border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
border: 1px solid #B4BBC8;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
border: 0;
}
.infobox.sisterproject {
width: 20em;
font-size: 90%;
}
.infobox.geography,
.infobox_v2.geography {
text-align: left;
border-collapse: collapse;
line-height: 1.2em;
font-size: 90%;
border: solid 1px #B4BBC8;
}
.infobox.geography td,
.infobox.geography th,
.infobox_v2.geography td,
.infobox_v2.geography th {
border-top: solid 1px #B4BBC8;
padding: .4em .6em;
}
.infobox.geography .mergedtoprow td,
.infobox.geography .mergedtoprow th,
.infobox_v2.geography .mergedtoprow td,
.infobox_v2.geography .mergedtoprow th {
border-top: solid 1px #B4BBC8;
padding: .4em .6em .2em .6em;
}
.infobox.geography .mergedrow td,
.infobox.geography .mergedrow th,
.infobox_v2.geography .mergedrow td,
.infobox_v2.geography .mergedrow td {
border: 0;
padding: 0 .6em .2em .6em;
}
.infobox.geography .mergedbottomrow td,
.infobox.geography .mergedbottomrow th,
.infobox_v2.geography .mergedbottomrow td,
.infobox_v2.geography .mergedbottomrow th {
border-top: 0;
border-bottom: solid 1px #B4BBC8;
padding: 0 .6em .4em .6em;
}
.infobox.geography .maptable td,
.infobox.geography .maptable th,
.infobox_v2.geography .maptable td,
.infobox_v2.geography .maptable th {
border: 0;
padding: 0;
}
/* Gráficos transparentes de cabecera */
.cabecera.default {}
/* Style for horizontal lists (separator following item) */
.skin-monobook .hlist dl,
.skin-modern .hlist dl,
.skin-vector .hlist dl {
line-height: 1.5em;
}
.hlist dl,
.hlist ol,
.hlist ul {
margin: 0;
}
.hlist dd,
.hlist dt,
.hlist li {
display: inline;
margin: 0;
}
/* Display nested lists inline */
.hlist dl dl,
.hlist ol ol,
.hlist ul ul {
display: inline;
}
/* Generate interpuncts */
.hlist dt:after {
content: ":";
}
.hlist dd:after,
.hlist li:after {
content: " ·";
font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
content: none;
}
/* for IE 8 */
.hlist dd.hlist-last-child:after,
.hlist dt.hlist-last-child:after,
.hlist li.hlist-last-child:after {
content: none;
}
/* Add parens around nested lists */
.hlist dl dl dd:first-child:before,
.hlist ol ol li:first-child:before,
.hlist ul ul li:first-child:before {
content: "(";
}
.hlist dl dl dd:last-child:after,
.hlist ol ol li:last-child:after,
.hlist ul ul li:last-child:after {
content: ")";
font-weight: normal;
}
/* For IE8 */
.hlist dl dl dd.hlist-last-child:after,
.hlist ol ol li.hlist-last-child:after,
.hlist ul ul li.hlist-last-child:after {
content: ")";
font-weight: normal;
}
/* Put numbers in ordered lists */
.hlist.hnum ol li {
counter-increment: level1;
}
.hlist.hnum ol li:before {
content: counter(level1) " ";
}
.hlist.hnum ol ol li {
counter-increment: level2;
}
.hlist.hnum ol ol li:first-child:before {
content: "(" counter(level2) " ";
}
.hlist.hnum ol ol li:before {
content: counter(level2) " ";
}
/* Unbulleted lists */
.plainlist ul {
line-height: inherit;
list-style: none none;
margin: 0;
}
.plainlist ul li {
margin-bottom: 0;
}
/* Default style for navigation boxes */
table.navbox { /* Navbox container style */
border: 1px solid #aaa;
width: 100%;
margin: auto;
clear: both;
font-size: 88%;
text-align: center;
padding: 1px;
}
table.navbox + table.navbox { /* Single pixel border between adjacent navboxes */
margin-top: -1px; /* (doesn't work for IE6, but that's okay) */
}
.navbox th,
.navbox-title,
.navbox-abovebelow {
text-align: center; /* Title and above/below styles */
padding-left: 1em;
padding-right: 1em;
}
th.navbox-group { /* Group style */
white-space: nowrap;
/* @noflip */
text-align: right;
}
.navbox,
.navbox-subgroup {
background: #fdfdfd; /* Background color */
}
.navbox-list {
border-color: #fdfdfd; /* Must match background color */
}
.navbox th,
.navbox-title {
background: #ccccff; /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
background: #ddddff; /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
background: #e6e6ff; /* Level 3 color */
}
.navbox-even {
background: #f7f7f7; /* Even row striping */
}
.navbox-odd {
background: transparent; /* Odd row striping */
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
padding: 0.125em 0; /* Adjust hlist padding in navboxes */
}
.navbox .hlist dd,
.navbox .hlist dt,
.navbox .hlist li {
white-space: nowrap; /* Nowrap list items in navboxes */
white-space: normal !ie; /* IE < 8 no-wraps entire list, so disable it */
}
.navbox .hlist dd dl,
.navbox .hlist dt dl,
.navbox .hlist li ol,
.navbox .hlist li ul {
white-space: normal; /* But allow parent list items to be wrapped */
}
ol + table.navbox,
ul + table.navbox {
margin-top: 0.5em; /* Prevent lists from clinging to navboxes */
}/* Default styling for Navbar template */
.navbar {
display: inline;
font-size: 88%;
font-weight: normal;
}
.navbar ul {
display: inline;
white-space: nowrap;
}
.navbar li {
word-spacing: -0.125em;
}
/* Navbar styling when nested in navbox */
.navbox .navbar {
display: block;
font-size: 100%;
}
.navbox-title .navbar {
/* @noflip */
float: left;
/* @noflip */
text-align: left;
/* @noflip */
margin-right: 0.5em;
width: 6em;
}
/* 'show'/'hide' buttons created dynamically by the CollapsibleTables javascript
in [[MediaWiki:Common.js]] are styled here so they can be customised. */
.collapseButton {
/* @noflip */
float: right;
font-weight: normal;
/* @noflip */
margin-left: 0.5em;
/* @noflip */
text-align: right;
width: auto;
}
/* In navboxes, the show/hide button balances the v·d·e links
from [[Template:Navbar]], so they need to be the same width. */
.navbox .collapseButton {
width: 6em;
}
/* =========================================
===== PLEGABLES (mediawiki 1.18+ ) ========
==========================================
Mediawiki 1.18 introdujo un nuevo sistema nativo de plegables.
Este es el CSS para personalizarlo y eventualmente reemplazar
al laberinto NavHead, NavFrame, NavToggle, NavContent, etc. */
/* Styling for JQuery makeCollapsible, matching that of collapseButton */
.mw-collapsible-toggle {
font-weight: normal;
/* @noflip */
text-align: right;
font-size: 90%;
}
.navbox .mw-collapsible-toggle {
width: 6em;
}
/* Change the external link icon to an Adobe icon for all PDF files
in browsers that support these CSS selectors, like Mozilla and Opera */
div#content a[href$=".pdf"].external,
div#content a[href*=".pdf?"].external,
div#content a[href*=".pdf#"].external,
div#content a[href$=".PDF"].external,
div#content a[href*=".PDF?"].external,
div#content a[href*=".PDF#"].external,
div#mw_content a[href$=".pdf"].external,
div#mw_content a[href*=".pdf?"].external,
div#mw_content a[href*=".pdf#"].external,
div#mw_content a[href$=".PDF"].external,
div#mw_content a[href*=".PDF?"].external,
div#mw_content a[href*=".PDF#"].external {
/* @embed */
background: url("//upload.wikimedia.org/wikipedia/commons/2/23/Icons-mini-file_acrobat.gif") no-repeat right;
/* @noflip */
padding-right: 18px;
}
/* CSS relacionado con el uso de coordenadas
To display coordinates using the notation in the source code, write this in your User:Username/monobook.css:
.geo-default {display: inline} .geo-nondefault {display: none}
.geo-dec {display: inline} .geo-dms {display: inline}
To display coordinates using decimal notation, write this in your User:Username/monobook.css:
.geo-default {display: inline} .geo-nondefault {display: inline}
.geo-dec {display: inline} .geo-dms {display: none}
To display coordinates using DMS notation, write this in your User:Username/monobook.css:
.geo-default {display: inline} .geo-nondefault {display: inline}
.geo-dec {display: none} .geo-dms {display: inline}
To display coordinates in both decimal and DMS notation, write this in your User:Username/monobook.css:
.geo-default {display: inline} .geo-nondefault {display: inline}
.geo-dec {display: inline} .geo-dms {display: inline}
.geo-multi-punct {display: inline}
See [[Plantilla:Coor link]] for how these are used.
Note that the classes "geo", "longitude", and "latitude" are not just styles but also used by the [[Geo microformat]], so the names should not be changed.
*/
/* CSS predeterminado, puede modificarse usando las reglas de arriba */
.geo-default, .geo-dms, .geo-dec { display: inline; }
.geo-nondefault, .geo-multi-punct { display: none; }
.longitude, .latitude { white-space: nowrap; }
/* This is used for the Geo microformat, but no style is needed for now other than .geo-dec. */
.geo {}
/* Plantilla de cita */
.citado {
font-size: 90%;
background-color: #F9F9F9;
padding: 5px 10px;
}
/* Estilos para sitenotice y similares */
.notice {
text-align: justify;
margin: 1em;
padding: 0.2em;
}
/* Ocultar texto para los no bibliotecarios */
.para_biblios {display: none}
/* Prevent floating boxes from overlapping any category listings,
file histories, edit previews, and edit [Show changes] views */
#mw-subcategories, #mw-pages, #mw-category-media,
#filehistory, #wikiPreview, #wikiDiff {
clear: both;
}
/*InterProject */
.interProject {
display:none;
clear: both;
border-top: 2px dotted #aaa;
margin-top: 2em;
}
/* CSS para plegables, documentación en [[:en:Wikipedia:NavFrame]] */
div.NavFrame {
margin: 0;
padding: 4px;
border: 1px solid #aaa;
text-align: center;
border-collapse: collapse;
font-size: 95%;
}
div.NavFrame + div.NavFrame {
border-top-style: none;
border-top-style: hidden;
}
div.NavPic {
background-color: #fff;
margin: 0;
padding: 2px;
float: left;
}
div.NavFrame div.NavHead {
height: 1.6em;
font-weight: bold;
background-color: #ccf;
position: relative;
}
div.NavFrame p,
div.NavFrame div.NavContent,
div.NavFrame div.NavContent p {
font-size: 100%;
}
div.NavEnd {
margin: 0;
padding: 0;
line-height: 1px;
clear: both;
}
a.NavToggle {
position: absolute;
top: 0;
right: 3px;
font-weight: normal;
font-size: 90%;
}
/* Hatnotes and disambiguation notices */
.rellink,
.dablink {
font-style: italic;
/* @noflip */
padding-left: 1.6em;
margin-bottom: 0.5em;
}
.rellink i,
.dablink i {
font-style: normal;
}
/* Para taxobox, quitar texto en versatilas para referencias */
table.biota i {
font-variant:normal;
}
/* TABLAS */
/* Normal font styling for table row headers with scope="row" tag */
.wikitable.plainrowheaders th[scope=row] {
font-weight: normal;
/* @noflip */
text-align: left;
}
/* lists in data cells are always left-aligned */
.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
/* @noflip */
text-align: left;
}
/* Aunque no deberían usarse alineadas a la derecha es
una practica muy extendida usar las wikitables así */
.wikitable.right,
.toccolours.right {
margin: 1em 0 1em 1em;
float: right;
clear: right;
}
/** Cajas de aviso son blancas y con
* una cinta de color en la parte superior */
table.ambox {
margin: 0 10%;
border-collapse: collapse;
background-color: #fbfbfb;
border-bottom: 1px solid #aaa;
border-left: 1px solid #CCC;
border-right: 1px solid #CCC;
font-size: 95%;
}
table.ambox th.ambox-text, table.ambox td.ambox-text {
padding: 0.25em 0.5em; /* 0.5em left/right */
width: 100%; /* Make all templates the same width regardless of text size */
}
table.ambox td.ambox-image {
padding: 2px 0 2px 0.5em; /* 0.5em left, 0px right */
text-align: center;
}
table.ambox td.ambox-imageright {
padding: 2px 0.5em 2px 0; /* 0px left, 0.5em right */
text-align: center;
}
table.ambox-notice {border-top: 5px solid #608EC2} /* Azul */
table.ambox-protection {border-top: 5px solid #bba} /* Gris */
table.ambox-delete,
table.ambox-serious {border-top: 5px solid #b22222} /* Rojo */
table.ambox-content {border-top: 5px solid #f28500} /* Naranja */
table.ambox-style {border-top: 5px solid #f4c430} /* Amarillo */
table.ambox-merge {border-top: 5px solid #8c08a4} /* Purpura */
table.ambox-growth {border-top: 5px solid #47a30d} /* Verde */
table.ambox.ambox-mini { /* Versión pequeña flotante */
float: right;
clear: right;
margin: 0 0 0 1em;
width: 25%;
}
/* Ciertas cajas para discusión que NO son ambox (no tienen cinta de color)
por ejemplo, la caja grande de artículo destacado */
.messagebox {
border: 1px solid #aaa;
background-color: #f9f9f9;
width: 80%;
margin: 0 auto 1em auto;
padding: .2em;
}
.messagebox.merge {
border: 1px solid #c0b8cc;
background-color: #f0e5ff;
text-align: center;
}
.messagebox.cleanup {
border: 1px solid #9f9fff;
background-color: #efefff;
text-align: center;
}
.messagebox.standard-talk {
border: 1px solid #c0c090;
background-color: #f8eaba;
margin: 4px auto;
}
/** Estilos para tablas.
la idea es, si se quiere que la primera columna de la tabla esté alineada
a la derecha, la segunda centrada y la tercera a la izquierda, usar
{| class="col1der col2cen col3izq"
en vez de repetir "style='text-align:right'", etc, en '''cada''' celda
Esto sólo se usa en Medallero. Debería divulgarse para aprovecharlo en más lugares
**/
table.col1der TD:first-child {text-align:right}
table.col1izq TD:first-child {text-align:left}
table.col1cen TD:first-child {text-align:center}
table.col2der TD:first-child + TD {text-align:right}
table.col2izq TD:first-child + TD {text-align:left}
table.col2cen TD:first-child + TD {text-align:center}
table.col3der TD:first-child + TD + TD {text-align:right}
table.col3izq TD:first-child + TD + TD {text-align:left}
table.col3cen TD:first-child + TD + TD {text-align:center}
table.col4der TD:first-child + TD + TD + TD {text-align:right}
table.col4izq TD:first-child + TD + TD + TD {text-align:left}
table.col4cen TD:first-child + TD + TD + TD {text-align:center}
table.col5der TD:first-child + TD + TD + TD + TD {text-align:right}
table.col5izq TD:first-child + TD + TD + TD + TD {text-align:left}
table.col5cen TD:first-child + TD + TD + TD + TD {text-align:center}
table.col6der TD:first-child + TD + TD + TD + TD + TD {text-align:right}
table.col6izq TD:first-child + TD + TD + TD + TD + TD {text-align:left}
table.col6cen TD:first-child + TD + TD + TD + TD + TD {text-align:center}
/* The backgrounds for galleries. */
div#content .gallerybox div.thumb {
background-color: #F9F9F9; /* Light gray padding */
}
/* Put a chequered background behind images, only visible if they have transparency */
.gallerybox .thumb img {
/* @embed */
background: white url("//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png") repeat;
}
/* But not on articles, user pages, portals or with opt-out. */
.ns-0 .gallerybox .thumb img,
.ns-2 .gallerybox .thumb img,
.ns-100 .gallerybox .thumb img,
.nochecker .gallerybox .thumb img {
background: white;
}
.abbr {/* al estilo de la etiquieta <abbr> */
cursor: help;
border-bottom: 1px dotted #000;
}
/* Aviso en espacios de trabajo de usuarios */
body.ns-2 div#contentSub > span.subpages:before,
body.ns-3 div#contentSub > span.subpages:before {
content: " ¡Atención! Este no es un artículo enciclopédico sino un espacio de trabajo personal. ";
background: #fe9;
border: 2px solid #f0c91f;
display: block;
text-align: center;
color: maroon;
margin-bottom: 2mm;
line-height: 120%;
}
/* Estilo para las etiquetas del filtro de edición */
.mw-tag-marker {
font-family:sans-serif;
font-style:italic;
font-size:90%;
background-color:#FFE599;
}
/* El vandalismo debe ser particularmente distinguible */
.mw-tag-marker-posible_vandalismo, .mw-tag-marker-botspam {
background-color:#FEC29C;
}
/* Allow limiting of which header levels are shown in a TOC;
<div class="toclimit-3">, for instance, will limit to
showing ==headings== and ===headings=== but no further
(as long as there are no =headings= on the page, which
there shouldn't be according to the MoS).
*/
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
display: none;
}
/* Prevent line breaks in silly places:
1) Where desired
2) Links when we don't want them to
3) Bold "links" to the page itself
4) HTML formulae
5) Ref tags with group names <ref group="Note"> --> "[Note 1]"
*/
.nowrap,
.nowraplinks a,
.nowraplinks .selflink,
span.texhtml,
sup.reference a {
white-space: nowrap;
}
/* Media queries */
@media screen and (max-width: 767px) {
/* Versión móvil */
#mem-banner-image {
display: none;
}
#mem-banner-text {
width: 100%;
}
}
.mf-mobile-only {
display: none;
}
.banner-image {
position: relative;
overflow: hidden;
max-width: 1125px;
height: auto;
margin-bottom: .6em;
}
.banner-image img {
max-width: 100%;
height: auto;
width: auto\9;
}
.banner-box {
position: absolute;
z-index: 2;
margin-top: 1.5em;
color: white;
width: 50%;
min-width: 20em;
text-shadow: black 0.3em 0.3em 1em, black -0.1em -0.1em 1em;
}
.banner-box-wide {
width: 80%
}
.banner-box-left {
left: 5%;
text-align: left;
}
.banner-box-right {
right: 5%;
text-align: right;
}
.banner-box-welcome {
left: 1em;
text-align: center;
width: 40%;
white-space: nowrap;
}
.banner-box a {
color: white !important;
font-weight: bold;
}
.banner-box .name {
font-size: 2.2em;
white-space: nowrap;
line-height: 2.0em;
}
.banner-box .type {
font-size: 2em;
line-height: 1.2em;
}
.banner-box .stats {
font-size: 1em;
margin-top: 1.7em;
}
.banner-box .quote {
font-size: 1em;
line-height: 1.2em;
}
.banner-box .welcome a {
font-size: 1.5em;
}
.banner-box .welcome {
font-size: 2.1em;
}
.banner-box .nav-tip {
font-size: 1.5em;
margin-top: 1.5em;
margin-bottom: 1.5em;
}
.banner-box .welcome-map-nav {
font-size: 1.25em;
}
.banner-box ul {
font-size: 1.25em;
}
.banner-box ul li {
display: inline;
}
.banner-box ul li:before {
content: " • ";
}
.banner-box ul li:nth-of-type(1):before {
content: " ";
}
/*Carousel*/
.carousel{
overflow:hidden;
width:100%;
padding:0
}
.panes{
list-style:none;
position:relative;
padding: 0;
margin-left: 0;
width:300%; /* Number of panes * 100% */
overflow:hidden; /* This is used solely to clear floats, it does not add functionality. */
}
.carousel .floatright {
position: absolute;
z-index: 1000;
right: 0px;
top: 50%
}
.carousel .floatleft {
position: absolute;
z-index: 1000;
top: 50%;
margin-left: 20px;
}
.panes > li{
position:relative;
float:left;
padding: 0;
margin-left: 0;
width:33.333333333333333333333333333333333%; /* 100 / number of panes */
}
.carousel img{
display:block;
width:100%;
max-width:100%;
}
.carousel h2{
font-size:1em;
padding: 8px 7px;
position:absolute;
border:0px;
top:5em;
text-align:left;
max-width: 300px;
color:#fff;
background-color:rgba(0,0,0,0.5);
}
@keyframes carousel{
0% { left:-1.7%; }
12.5% { left:-1.7%; }
25% { left:-101.7%; }
37.5% { left:-101.7%; }
50% { left:-201.7%; }
62.5% { left:-201.7%; }
75% { left:-101.7%; }
87.5% { left:-101.7%; }
100% { left:-1.7%; }
}
/* Safari and Chrome */
@-webkit-keyframes carousel{
0% { left:-1.7%; }
12.5% { left:-1.7%; }
25% { left:-101.7%; }
37.5% { left:-101.7%; }
50% { left:-201.7%; }
62.5% { left:-201.7%; }
75% { left:-101.7%; }
87.5% { left:-101.7%; }
100% { left:-1.7%; }
}
/* Fade in arrows */
.greydout {
-webkit-opacity: 0.5;
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
filter: alpha(opacity=50);
opacity: 0.5;
-webkit-transition: all 0.25s ease;
-moz-transition: all 0.25s ease;
-ms-transition: all 0.25s ease;
-o-transition: all 0.25s ease;
transition: all 0.25s ease;
}
.greydout:hover {
-webkit-opacity: 1;
-moz-opacity: 1;
-khtml-opacity: 1;
filter: alpha(opacity=50);
opacity: 1;
}
/* END User:Nicholasjf21/MainPage2 test code */
/* BEGIN Main Page carousel code */
.jcarousel {
position: relative;
overflow: hidden;
}
.jcarousel-wrapper {
max-width: 1125px;
margin: 0;
position: relative;
}
.jcarousel .jcarousel-list {
width: 20000em;
position: relative;
margin: 0;
padding: 0;
}
.jcarousel .jcarousel-item {
float: left;
}
.jcarousel-item img {
display: block;
max-width: 100%;
height: auto !important;
}
.jcarousel-control-prev,
.jcarousel-control-next {
position: absolute;
top: 45%;
width: 30px;
height: 30px;
text-align: center;
background: #fff;
color: #fff;
text-decoration: none;
text-shadow: 0 0 1px #000;
font: 24px/27px Arial, sans-serif;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
-webkit-box-shadow: 0 0 2px #999;
-moz-box-shadow: 0 0 2px #999;
box-shadow: 0 0 2px #999;
}
.jcarousel-control-prev {
left: -15px;
}
.jcarousel-control-next {
right: -15px;
}
.jcarousel-control-prev:hover span,
.jcarousel-control-next:hover span {
display: block;
}
.jcarousel-control-prev.inactive,
.jcarousel-control-next.inactive {
opacity: .5;
cursor: default;
}
.jcarousel-pagination {
position: absolute;
bottom: 10px;
left: 15px;
}
.jcarousel-pagination a {
text-decoration: none;
display: inline-block;
font-size: 11px;
line-height: 14px;
min-width: 14px;
background: #fff;
color: #4E443C;
border-radius: 14px;
padding: 3px;
text-align: center;
margin-right: 2px;
opacity: .75;
}
.jcarousel-pagination a.active {
background: #4E443C;
color: #fff;
opacity: 1;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75);
}
/* END Main Page carousel code */