press-kit: add press contacts and info

_i18n/en.yml

@@ -256,8 +256,8 @@ downloads:
   sourcearchive: Source Code (archive)
 
 press-kit:
-  intro1: Here you'll find the Monero symbol and logo below. You can choose any size that you want, or download the .ai file to mess with the logo yourself.
-  intro2: Note that the white background options have a white background under the Monero symbol ONLY, not as a background to the whole image.
+  intro: On this page you'll find press contacts, symbols and logos.
+  intro2: Note that the white background options have a white background under the Monero symbol only, not as a background to the whole image.
   intro3: Lastly, you can download everything on this page in one zip file by clicking
   intro4: here.
   noback: No background
@@ -282,6 +282,18 @@ press-kit:
   promographicsp: Various graphics and Badges created by TheMonera, for both merchants and simple enthusiasts.
   othersymbols: Other symbols and logos
   mrllogo_para: The logo of the Monero Research Lab in SVG format.
+  contacts: Contacts
+  contactsp: There are multiple ways to contact the community. Depending by what information you are looking for, you might want to contact a workgroup, single members of the community, or the Core Team.
+  contactgen: "For press inquiries:"
+  contactwg: "To contact a specific Monero workgroup:"
+  contactcomm: "To contact the many subcommunities:"
+  whymonero: Why Monero?
+  whycommunity: Monero has one of the largest communities of any open-source project. Monero researches, audits, and implements critical security and privacy technologies, which are user by millions worldwide.
+  whycommunity1: Monero is trusted for more private transactions than all other cryptocurrencies combined.
+  whyconf: The Monero community has substantial involvement at Defcon, Grayhat and the CCC (Chaos Computer Club). The Monero Konferenco, an academic conference, is hosted annually.
+  whyconf1: We encourage everyone to include community members from the largest privacy project in related news articles and events.
+  altpk-1: Picture of a woman standing in front of a 'Monero Talk' banner
+  altpk-2: Picture of fluffypony making a presentation in front of a crowd at DEFCON
   
 accepting:
   title_gui: Instructions for the GUI

css/custom.css

@@ -4378,6 +4378,61 @@ p.hangouts-social {
     margin-top: 1.5rem;
 }
 
+.second-row {
+  padding-top: 2rem;
+}
+
+.box-text-left p {
+  padding-right: 2rem;
+}
+
+.box-text-right {
+  padding-left: 2rem;
+}
+
+.no-p {
+  padding-bottom: 2rem;
+}
+
+@media only screen and (max-width: 75rem) {
+
+  .box-text-left p {
+    padding-right: 0;
+  }
+  
+  .box-text-right {
+    padding-left: 0;
+  }
+
+  .order-2-mob {
+    order: 2;
+  }
+
+  .order-1-mob {
+    order: 1;
+  }
+  
+}
+  
+@media only screen and (max-width: 62rem) {
+
+  .box-text-left p {
+    padding-right: 0;
+  }
+  
+  .box-text-right {
+    padding-left: 0;
+  }
+
+  .order-2-mob {
+    order: 2;
+  }
+
+  .order-1-mob {
+    order: 1;
+  }
+  
+}
 
 /**************************WHAT IS MONERO*************************/
 

press-kit/index.md

@@ -5,8 +5,43 @@ permalink: /press-kit/index.html
 ---
 
 <div class="text-center container description">
-    <p>{% t press-kit.intro1 %} <strong>{% t press-kit.intro2 %}</strong> {% t press-kit.intro3 %} <a href="/press-kit/monero-press-kit.zip">{% t press-kit.intro4 %}</a></p>
+    <p>{% t press-kit.intro %} {% t press-kit.intro2 %} {% t press-kit.intro3 %} <a href="/press-kit/monero-press-kit.zip">{% t press-kit.intro4 %}</a></p>
 </div>
+<section class="container full col-xs-12">
+    <div class="info-block">
+        <div class="row center-xs">
+            <h2>{% t press-kit.contacts %}</h2>
+        </div>
+        <p>{% t press-kit.contactsp %}</p>
+        <p>{% t press-kit.contactgen %} press[at]getmonero[dot]org</p>
+        <p>{% t press-kit.contactwg %} <a href="{{ site.baseurl }}/community/workgroups/">{% t titles.workgroups %}</a></p>
+        <p>{% t press-kit.contactcomm %} <a href="{{ site.baseurl }}/community/hangouts/">{% t titles.hangouts %}</a></p>
+    </div>
+    <div class="info-block">
+        <div class="row center-xs no-p">
+            <h2>{% t press-kit.whymonero %}</h2>
+        </div>
+        <div class="row middle-xs">
+            <div class="col-lg-6 col-md-6 col-xs-12">
+                <img src="/img/press-kit/pk-1.jpg" alt="{% t press-kit.altpk-1 %}" loading="lazy">
+            </div>
+            <div class="col-lg-6 col-md-6 col-xs-12 box-text-right">
+                <p>{% t press-kit.whycommunity %}</p>
+                <p><b>{% t press-kit.whycommunity1 %}</b></p>
+            </div>
+        </div>
+        <div class="row middle-xs second-row">
+            <div class="col-lg-6 col-md-6 col-xs-12 box-text-left order-2-mob">
+                <p>{% t press-kit.whyconf %}</p>
+                <p><b>{% t press-kit.whyconf1 %}</b></p>
+            </div>
+            <div class="col-lg-6 col-md-6 col-xs-12 order-1-mob">
+                <img src="/img/press-kit/pk-2.jpg" alt="{% t press-kit.altpk-2 %}" loading="lazy">
+            </div>
+        </div>
+    </div>
+</section>
+
 <section class="container">
     <div class="row">
         <div class="left half no-pad-sm col-lg-6 col-md-6 col-sm-12 col-xs-12">