Gebruiker:IdP/kladblok24

Archief Ritsko van Vliet - header

{{#css:
.img-portrait img {width:50%;}
img {border-radius: 0.25rem; width:100%;}

.titelLink {
background-color: rgba(100,100,100,0.2); 
text-align: center; 
line-height: 30px;
height: 30px;
font-size: 1.2rem;
}

a {
color: black;
}

#showcase-header img {border-radius: 0.25rem; object-fit: cover; width: 100%;}

#overlay-header {
background: rgba(204,204,204,0.6);
left: 0;
width: 100%;
height: 25%;
z-index: 2;
}

.titel-header {
color: white;
letter-spacing: .1rem;
line-height: 0.5;
font-size: 1rem;
z-index: 3;
}

.titel-header-achtergronden {
letter-spacing: .4rem;
line-height: 0.5;
font-size: 1.2rem;
}

h5 a {
color: #231F20;
}

h5 a:hover {
text-shadow: 0.03em 0.03em 0.02em #777;
text-decoration: none;
color: #231F20;
}

@media (min-width: 576px) { 
.titel-header {
letter-spacing: 0.2rem;
line-height: .6;
font-size: 1.6rem;
}

.titel-header-achtergronden {
letter-spacing: 0.6em;
}
}

@media (min-width: 992px) { 
.titel-header {
letter-spacing: 0.3rem;
line-height: .6;
font-size: 2rem;
}

.titel-header-achtergronden {
letter-spacing: 0.6em;
}
}

@media (min-width: 1200px) { 
.titel-header {
letter-spacing: 0.4rem;
line-height: 1.4;
font-size: 2.2rem;
}
.titel-header-achtergronden {
letter-spacing: 0.6em;
}
}

@media (min-widht: 1400px) {
.titel-header {
letter-spacing: 0.5rem;
line-height: 1.8;
font-size: 4rem;
}
.titel-header-achtergronden {
letter-spacing: 0.8em;
}
}
}}

{{#tweekihide:firstHeading|sidebar-right}}<div id="showcase-header" class="card border-0 text-white m-auto pb-4">[[Bestand: Header-achtergronden-verhalen-Archief-Ritsko-1400x400.png|class=img-responsive]]
<div id="overlay-header" class="card-img-overlay"><h2 class="card-title titel-header titel-header-achtergronden text-uppercase text-center px-4">{{PAGENAME}}</h2>
</div><!-- eof card-img-overlay -->
</div><!-- eof card -->