<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Generator" content="Microsoft Word 15 (filtered medium)">
<!--[if !mso]><style>v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style><![endif]--><style><!--
/* Font Definitions */
@font-face
{font-family:"Cambria Math";
panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
{font-family:Consolas;
panose-1:2 11 6 9 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0cm;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:#0563C1;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{mso-style-priority:99;
color:#954F72;
text-decoration:underline;}
p.msonormal0, li.msonormal0, div.msonormal0
{mso-style-name:msonormal;
margin:0cm;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
p.xmsonormal, li.xmsonormal, div.xmsonormal
{mso-style-name:x_msonormal;
margin:0cm;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
p.xmsonormal0, li.xmsonormal0, div.xmsonormal0
{mso-style-name:x_msonormal0;
mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
p.xmsochpdefault, li.xmsochpdefault, div.xmsochpdefault
{mso-style-name:x_msochpdefault;
mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
font-size:10.0pt;
font-family:"Calibri",sans-serif;}
span.xmsohyperlink
{mso-style-name:x_msohyperlink;
color:#0563C1;
text-decoration:underline;}
span.xmsohyperlinkfollowed
{mso-style-name:x_msohyperlinkfollowed;
color:#954F72;
text-decoration:underline;}
span.xe-mailformatvorlage18
{mso-style-name:x_e-mailformatvorlage18;
font-family:"Calibri",sans-serif;
color:windowtext;}
span.xe-mailformatvorlage20
{mso-style-name:x_e-mailformatvorlage20;
font-family:"Calibri",sans-serif;
color:windowtext;}
span.E-MailFormatvorlage27
{mso-style-type:personal-reply;
font-family:"Calibri",sans-serif;
color:windowtext;}
.MsoChpDefault
{mso-style-type:export-only;
font-size:10.0pt;}
@page WordSection1
{size:612.0pt 792.0pt;
margin:70.85pt 70.85pt 2.0cm 70.85pt;}
div.WordSection1
{page:WordSection1;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body lang="DE" link="#0563C1" vlink="#954F72">
<div class="WordSection1">
<p class="MsoNormal"><span style="mso-fareast-language:EN-US">Dear Morten,<o:p></o:p></span></p>
<p class="MsoNormal"><span style="mso-fareast-language:EN-US"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="mso-fareast-language:EN-US">yes – that’s what I was looking for!<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="mso-fareast-language:EN-US"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="mso-fareast-language:EN-US">Thanks and Cheers,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="mso-fareast-language:EN-US">Jörg<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="mso-fareast-language:EN-US"><o:p> </o:p></span></p>
<div>
<div style="border:none;border-top:solid #E1E1E1 1.0pt;padding:3.0pt 0cm 0cm 0cm">
<p class="MsoNormal"><b>Von:</b> Hosted-Portals <hosted-portals-bounces@lists.gbif.org>
<b>Im Auftrag von </b>Morten Høfft<br>
<b>Gesendet:</b> Samstag, 10. April 2021 07:36<br>
<b>An:</b> Helpdesk, discussion and announcements for the GBIF hosted portals <hosted-portals@lists.gbif.org><br>
<b>Betreff:</b> Re: [Hosted-Portals] Semi-transparent text block in page layout?<o:p></o:p></p>
</div>
</div>
<p class="MsoNormal"><o:p> </o:p></p>
<div>
<p class="MsoNormal"><span style="font-size:12.0pt;color:black;background:white">Hi Jörg</span><span style="font-size:12.0pt;color:black">
<o:p></o:p></span></p>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black">It isn't no, but you can always write your own css to do so. <o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><a href="https://hp-theme.gbif-staging.org/styling#add-custom-css" target="_blank">https://hp-theme.gbif-staging.org/styling#add-custom-css</a><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black">Something along adding below to </span><span style="font-size:10.5pt;font-family:"Courier New";color:#F14668;background:whitesmoke">_sass/_main.scss</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black">.boxHero .feature-content {</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black"> opacity: 0.9;</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black">}</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black">I just tried it, in my opinion it looks a bit odd, but perhaps there is a variation that works better.<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black">Visually I find it annoying because it touches the bottom. If you added bottom margin as well, then it would seem more like a floating transparent block. Just making the
whole thing transparent looks like a mistake. And then I would opt for only making the paper transparent, not the text.<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black">so instead something along<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black">.boxHero .feature-content {</span><span style="font-size:12.0pt;color:black">
<o:p></o:p></span></p>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black"> background: #ffffffee;</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black"> border: 1px solid #88888822;</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black"> margin-bottom: 2rem;</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<p class="MsoNormal" style="background:white"><span style="font-size:10.0pt;font-family:Consolas;color:white;background:black">}</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black">Hope that helps<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal" style="background:white"><span style="font-size:12.0pt;color:black">Best<o:p></o:p></span></p>
</div>
<p class="MsoNormal"><span style="font-size:12.0pt;color:black;background:white">Morten</span><span style="font-size:12.0pt;color:black"><o:p></o:p></span></p>
</div>
<div class="MsoNormal" align="center" style="text-align:center">
<hr size="2" width="98%" align="center">
</div>
<div id="divRplyFwdMsg">
<p class="MsoNormal"><b><span style="color:black">From:</span></b><span style="color:black"> Hosted-Portals <<a href="mailto:hosted-portals-bounces@lists.gbif.org">hosted-portals-bounces@lists.gbif.org</a>> on behalf of Holetschek, Jörg <<a href="mailto:J.Holetschek@bgbm.org">J.Holetschek@bgbm.org</a>><br>
<b>Sent:</b> Friday, April 9, 2021 12:21 PM<br>
<b>To:</b> Helpdesk, discussion and announcements for the GBIF hosted portals <<a href="mailto:hosted-portals@lists.gbif.org">hosted-portals@lists.gbif.org</a>><br>
<b>Subject:</b> [Hosted-Portals] Semi-transparent text block in page layout?</span>
<o:p></o:p></p>
<div>
<p class="MsoNormal"> <o:p></o:p></p>
</div>
</div>
<div>
<div>
<p class="xmsonormal"><span style="color:black">Dear Morten,</span><o:p></o:p></p>
<p class="xmsonormal"><span lang="EN-ZA"> </span><o:p></o:p></p>
<p class="xmsonormal"><span lang="EN-ZA">We use the Page layout for our portals. Is it possible to set transparency for the part of the text that overlaps the image, usually the title and subtitle?</span><o:p></o:p></p>
<p class="xmsonormal"><span lang="EN-ZA"><a href="https://hp-theme.gbif-staging.org/layout/page">https://hp-theme.gbif-staging.org/layout/page</a></span><o:p></o:p></p>
<p class="xmsonormal"><span lang="EN-ZA"> </span><o:p></o:p></p>
<p class="xmsonormal"><span lang="EN-ZA">Thanks and cheers,</span><o:p></o:p></p>
<p class="xmsonormal"><span lang="EN-ZA">Jörg</span><o:p></o:p></p>
<p class="xmsonormal"><span lang="EN-ZA"> </span><o:p></o:p></p>
</div>
</div>
</div>
</body>
</html>