Difference between revisions of "MediaWiki:Common.css"

Revision as of 16:27, 25 January 2017

/** CSS die hier wordt geplaatst heeft invloed op alle skins */
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
@import url(https://fonts.googleapis.com/css?family=Lato:400,900,700italic,700);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css);


.wsbreadcrumb {
margin-bottom: 0em;
list-style: none;
}

/* Font famly  */

/* Tussenkop - dit wordt h1, h2, h3, etc. */ 
.tussenkop  {
   font-weight: 500;
   text-transform: uppercase;
}
.pageTitle  {
   font-weight: 900;
   text-transform: uppercase;
}
.quote {
   font-weight: 500;
   font-style: italic;
}
.textarea {
   font-family: 'Lato';
   font-weight: 700;
}
.banner-background {
   background-image: url("images/1/1d/Visual_header_Wikibase.jpg");
   background-repeat:no-repeat;
    background-size:cover;
    background-position: center;
}
#mw-navigation.navbar {
   margin-bottom: 0px;
/min-height:50px;
}


/* NavMenu class for navigation menu */
.navmenu {
   text-transform:uppercase;
   font-family:Lato;
   font-weight:900;
   color:white;
   background-color:#365e89;
   margin-bottom: 0px;
}
.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background-color: #557ebe;
}
.navbar-navmenu > li > a, .navbar-navmenu > li >  a:link, .navbar-navmenu > li > a:visited {
   color:white;
}
.navbar-navmenu > li > a:hover, .navbar-navmenu > li > a:active {
   color:white;
}

.header-image {
position:relative;
} 

.header-text {
position:absolute;
top: 30%;
right: 50%;
}

.header-arrow{
position:absolute;
bottom: -30px;
left: 50%;
transform: translate(-50%, 0);
}

.row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.panel-info-normal, .panel-info-normal a, .info-normal a:hover, .info-normal a:visited {
  color: #FFFFFF;
}
.panel-info-main, .panel-info-main a {
  background-color:#a3a42b;
  text-align:left;
  color: #ddde3a;
  font-size:2em;
}
img {
display: -webkit-inline-flex;
}

/** Footer */

.WikibaseFooter {
width: 100%;
background-color: #707070;
margin-right: 0px;
margin-left: 0px;
padding-top: 10px;
padding-bottom: 10px; 
padding-left: 5px;
padding-right: 5px;
height: 40px;
color: white;
}

.WikibaseFooter a {
color: #FFFFFF; 
}

/** Contactpage */
#ca-nstab-special {
display: none;
}

#mw-content-text > form > fieldset > table > tbody > tr.mw-htmlform-field-HTMLInfoField {
display:none;
}

fieldset {
border: 0px;
margin: 0px;
padding: 0px;
}

legend {
display: none;
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
border-top: 0px;
}

.homepage-background { 
    background: url(https://viktor.wikibase.nl/images/b/b8/Ganzen_in_mooie_lucht.jpg) no-repeat; 
}

.panel-default > .panel-heading-rk {
     text-align: center;
}

.panel-title {
     padding-top: 3px;
}

.panel-footer-rk {
     text-align: center;
}

.img-middle {
     vertical-align: middle;
}

.hr {
     width: 100%; 
     border-bottom: 1px solid #dadada;
     padding-bottom: 1em;
}

.border-bottom {
     width: 100%; 
     border-bottom: 1px solid #dadada;
     padding-bottom: 1em;
}


.location-in-sidebar {
padding-top: 0.5em;
padding-bottom: 1em;
}

.template-table-header {
	background-color: #dadada;
        margin-top: 0px;
        height: 35px; 
        width: 200px
        font-size:14px;
        font-weight: 500;
        color: #000000;
        border-collapse: collapse;
	text-align: center;
	padding-top: 0.6em;
        padding-bottom: 2em;
}

.template-table-style {
	color: black; 
	padding: 0.5em 1em 1em 1em;
}

.template-table-style2 {
        border-collapse: collapse;
}

.interview-kop {
        font-size:15px;
        font-weight: 500;
        color: #707070;
}

.interview-by {
    font-size:11px;
    color:#A9A9A9;
}

formtable {
    margin-bottom: 2px;
}

table a:not {
    color: #707070;
}

/* unvisited link */
a:link {
    color: #707070;
}

/* visited link */
a:visited {
    color: #707070;
}

/* mouse over link */
a:hover {
    color: #707070;
}

/* selected link */
a:active {
    color: #707070;
}

.link {
    color:#707070;
    text-decoration: none;
}

.hp-kop {
    font-size:18px;
    font-weight: 500;
    color:#005F90;
    line-height: 250%;
    padding-top:25px;
    margin-top:25px;
}
.hp-top-kop {
    font-size:32px;
    color:#FFFFFF;
}
.hp-news-kop {
    font-size:14px;
}
.hp-news-date {
    font-size:10px;
    color:#A9A9A9;
}
.meer-link-interview {
    text-decoration: none;
    font-size:13px;
    border-top: 1px solid #dadada;
    padding: 0em 0.5em 0em 2.1em;
    color:#A9A9A9;
}

.meer-link {
    text-decoration: none;
    font-size:13px;
    padding: 0em 0.5em 0em 2.1em;
    color:#A9A9A9;
}

.lees-verder {
	background-color: #dadada;
        margin-top: 0px;
        height: 16px; 
        font-size:12px;
        color: #000000;
	text-align: left;
	padding-top: 0.6em;
	padding-left: 0.6em;
	padding-right: 0.6em;
        padding-bottom: 0.8em;
}

.hp-top-body {
    font-size:16px;
    font-weight:300;
    line-height:160%;
    color:#FFFFFF;
}

.hp-top-body-wrapper {
height:70px;
}

.hp-top-link a {
    padding:10px;
    border:1px solid;
    border-color:#FFFFFF;
    border-radius:7px;
    font-size:16px;
    color:#FFFFFF;    
}
.hp-top-link-pijl-wit a {
    background: no-repeat right 10px center url('https://www.viktor.wikibase.nl/images/Pijl_wit.png');
}

.hp-top-link a:hover {
    background-color:#FFFFFF;
    color:rgb(2, 148, 211);
    text-decoration:none !important;
}

.hp-top-link-pijl-wit a:hover {
    background: #FFFFFF no-repeat right 10px center url('https://www.shopping2020.nl/images/4/4c/Pijl_blauw.png');
}

.rh-kop {
    font-size:14px;
    font-weight: 500;
    color: #000000;
}
.rh-user-kop {
    font-size:12px;
    font-weight:500;
}
.rh-user-body {
    font-size:12px;
    line-height: 140%;
}
.hp-ag-mo {
    font-size:32px;
    color:#FFFFFF;
}
h2.ow-hoofdstuk-kop {
    font-size:16px;
    font-weight: bold;
}

table {
    border-spacing: 0px;
}
a, a:visited, div#mw-panel div.portal div.body ul li a, div#mw-panel div.portal div.body ul li a:visited, #mw-panel.collapsible-nav .portal.collapsed h3 a, div.vectorTabs li a {
    color: #707070;
}

/* Wikitable (Prettytable) class for skinning normal tables */
table.wikitable,
table.prettytable {
  margin: 1em 1em 1em 0;
  background: #f9f9f9;
  border: 1px #aaaaaa solid;
  border-collapse: collapse;
  empty-cells: show;
}
table.wikitable th, table.wikitable td,
table.prettytable th, table.prettytable td {
  border: 1px #aaaaaa solid;
  padding: 0.2em 0.4em;
}
table.wikitable th, table.wikitable td.hl3, table.wikitable th.hl3,
table.prettytable th, table.prettytable td.hl3, table.wikitable th.hl3 {
  background: #8da7d6;
  text-align: center;
}
table.wikitable td.hl1, table.wikitable th.hl1,
table.prettytable td.hl1, table.wikitable th.hl1 {
  background: #c5d8fc;
  text-align: center;
}
table.wikitable td.hl2, table.wikitable th.hl2,
table.prettytable td.hl2, table.wikitable th.hl2 {
  background: #a7c1f2;
  text-align: center;
}
table.wikitable caption,
table.prettytable caption {
  margin-left: inherit;
  margin-right: inherit;
  font-weight: bold;
}

div#wrapper {
	display: block;
	margin: auto;
	width: 1200px;
	position: relative;
        padding-bottom:1em;
}

.PoweredByWikibase {
	position: relative;
	right: 24px;
	top: 4px;
	float:right;
}

div#footer {
	margin-left: 11em;
	margin-top: 0;
	direction: ltr;
	background: none;
	background-repeat: repeat;
	border: 1px solid #a7d7f9;
	border-top: 0;
	padding: 1.5em;
}
div#footer ul {
	list-style-type: none;
	list-style-image: none;
	margin: 0;
	color: #333333;
}
div#footer div>ul {
	font-size: 0.75em;
}
div#footer ul li {
	display: inline-block;
	width: 192px;
	margin: 0;
	padding: 0;
	vertical-align: top;
	font-weight: bold;
}

div#footer ul li ul {
	margin-top: 8px;
}

div#footer ul li ul li{
	display: block;
	width: 100%;
	padding: 1px 0;
	margin: 0;
	font-weight: normal;
}

div#footer ul li img {
        margin-right: 4px;
}

div#toes {
	position: relative;
	margin-left: 11em;
	margin-top: 0;
	color: #fff;
	padding: 0;
	background: #bbcd36;
}

div#toes span {
	font-size: 0.75em;
	line-height: 3.2em;
	margin-left: 2em;
}

div#toes a {
        color: #FFFFFF;
}

div#toes a:visited {
        color: #FFFFFF;
}

div#carousel-caption {
        padding-bottom: 10em;
}

.quote {
    font-style: italic;
    color: #707070;
}

.cite {
    color: #0000000;
    font-style: normal;
}

.blockquote {
        background-color: #f0eff1;
	border: 1px solid #707070;
        border-collapse: collapse;
        border-radius: 10px;
        overflow:hidden;
        postition:relative;
}

.infobox {
   float:right;
}

.tbl-container {
    overflow:hidden;
    postition:relative;
}

.tbl-container > table {
    width:100%;
}

/* New WS colour classes */

.ws-panel-transparant {
   background-image: url("https://www.wikibase.nl/images/thumb/7/70/Transparant.jpg/270px-Transparant.jpg");   border:0;
   background-size: 270px 270px;
   background-repeat: no-repeat;
   height:270px;
   color:#fff;
}
.ws-darkbrown {
   background-color: #80614b;
   border:0;
   color:#FFF;
}
.ws-darkbrown a:link, .ws-darkbrown a:visited {
   color:#FFF;
}
.ws-darkbrown a:active, .ws-darkbrown a:hover  {
   color:#f1f1f3;
}

/* darkblue */
.ws-darkblue {
   background-color:#557ebe;
   border:0;
   color:#f1f1f3;
}
.ws-darkblue a:link, .ws-darkblue a:active, .ws-darkblue a:visited, .ws-darkblue a:hover  {
   color: white;
}

.ws-btn-darkblue {
   background-color:#557ebe;
   border:0;
   color:#f1f1f3;
}
.ws-btn-darkblue:hover {
   background-color:#365e89;
   color:white;
}

/* darkerblue */

.ws-darkerblue, .ws-darkerblue a, .ws-darkerblue  > li > a:hover, .ws-darkerblue > li > a:focus {
   background-color: #365e89;
   color:#FFF;
}
.ws-darkerblue a:link,  .ws-darkerblue a:visited  {
   color:#FFF;
}
.ws-darkerblue a.new:link {
   color:#FFF;
}
.ws-darkerblue a:active, .ws-darkerblue a:hover, .ws-darkerblue a.new:active, .ws-darkerblue a.new:hover  {
   color:#f1f1f3;
}
.ws-darkerblue > a:link, .ws-darkerblue > a:visited, .ws-darkerblue > a.new:link {
   color:#FFF;
}
.ws-darkerblue > a:active, .ws-darkerblue > a:hover, .ws-darkerblue > a.new:active, .ws-darkerblue > a.new:hover  {
   color:#f1f1f3;
}

.ws-btn-darkerblue {
   background-color:#365e89;
   border:0;
   color:#f1f1f3;
}
.ws-btn-darkerblue:hover {
   background-color:#5184BA;
   color:white;
}

/* darkgreen */
.ws-darkgreen {
   background-color: #a3a42b;
   border:0;
    color:#FFF;
}
.ws-darkgreen a:link, .ws-darkgreen a:visited {
   color:#FFF;
}
.ws-darkgreen a:active, .ws-darkgreen a:hover  {
   color:#f1f1f3;
}
.ws-btn-darkgreen {
   background-color:#a3a42b;
   border:0;
   color:#f1f1f3;
}
.ws-btn-darkgreen:hover {
   background-color:#BFBF44 ;
   color:white;
}

/* lightgreen */
.ws-lightgreen {
  background-color: #ddde3a;
   border:0;
  color:#FFF;
}
.ws-lightgreen a:link, .ws-lightgreen a:visited {
   color:#a3a42b;
}
.ws-lightgreen a:active, .ws-lightgreen a:hover  {
   color:#BFBF44;
}
.ws-btn-lightgreen {
   background-color:#ddde3a;
   border:0;
   color:#FFF;
}
.ws-btn-lightgreen:hover {
/   background-color:#BFBF44 ;
    background-color:#BFBF44;
   color:white;
}

/* ws-dark  */
.ws-dark {
  background-color: #4d4d4d;
   border:0;
  color:#FFF;
}
.ws-dark > li > a:hover, .ws-dark > li > a: focus {
  background-color: #4d4d4d;
  color:#FFF;
}
.ws-dark a:link, .ws-dark a:visited {
   color:#FFF;
}
.ws-dark a:active, .ws-dark a:hover  {
   color:#f1f1f3;
}

/* ws-light */
.ws-light  {
   background-color: #f1f1f3;
   border:0;
   color:#000;
}
.ws-light a:link, .ws-light a:visited {
   color:#365e89;
}
.ws-light a:active, .ws-light a:hover  {
   color:#a3a42b
}
.ws-btn-light  {
   background-color: #f1f1f3;
   border:0;
   color:#000;
}
.ws-btn-light:hover {
   background-color: #DDDDDD;
   color:#000;
}

/* cf .nav > li > a:hover, .nav > li > a:focus {
/    text-decoration: none;
/    background-color: #557ebe;
/} */

.panel {
   border-radius:8px;
   -moz-border-radius:8px;
}
.btn {
   padding-right:15px;
   padding-left:15px;
   border-radius:6px;
   -moz-border-radius:6px;
}

.highButton {
   height: 6.5em;
}

/* truncate text */
.tableEllipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}
.verticalEllipsisTwoLines {
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 2.9em;
}
.verticalEllipsisFiveLines {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    max-height: 7em;
}

/* ws-nav-darkerblue */
.ws-nav-darkerblue {
   background-color:#365e89;
   color:#f1f1f3;
}
.ws-nav-darkerblue:hover {
   background-color:#5184BA;
   color:white;
}
.ws-nav-darkerblue > a:link, .ws-nav-darkerblue > a:visited {
   color:white;
   text-decoration:none;
}
.ws-nav-darkerblue > a:hover, .ws-nav-darkerblue > a:active, .ws-nav-darkerblue > a:focus  {
   color:white;
   text-decoration:none;
}

.greyfilter  {
    -webkit-filter: grayscale(0%); /* Chrome, Safari, Opera */
    filter: grayscale(80%);
}
.greyfilter:hover {
    -webkit-filter: grayscale(90%); /* Chrome, Safari, Opera */
    filter: grayscale(0%);
}

.klantafbeelding {
margin-top: 1em;
margin-bottom: 1em;
}

/* Blogpost list items */
.thumbnail-image {
     width: 318px; 
     height: 212px; 
     padding-top: 0px; 
     margin-top: 0px; 
     position: relative;
}
.thumbnail-logo {
     position: absolute; 
     bottom: -0px; right: 10px; 
}
.thumbnail-logo-background {
    background:  #f1f1f3;
    padding: 6px 6px 6px 6px;
    border-radius: 6px;
}

.white-link > a.external,
.white-link > a.external:visited,
.white-link > a.external:hover,
.white-link > a.external:active {
color: white;
}