User:SCampos-WMF/CNB-Code-GE2025

Gender Equity 2025 - CNB Code

edit

English version

edit
<style>
#comms-kih-main-container {
  display: table;
  width: 100%;
  height: 80px;
  position: relative;
  overflow: hidden;
  background: #000000;
  border: 1px transparent;
  border-radius: 2px;
  margin-bottom: 1em;
  cursor: pointer;
  color: #000000;
}

#comms-kih-main-container a {
  display: table;
  vertical-align: middle;
  position: relative;
  height: 80px;
  width: 100%;
  vertical-align: middle;
  background: #000000;
  background-size: cover;
  background-position: center;
  color: #000000;
  cursor: pointer;
  text-decoration: none;
}

body.skin-minerva #comms-kih-main-container {
  height: 80px;
}

#comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 273px;
  padding-left: 20px;
  padding-right: 62px;
  padding-top: 0px;
}

#comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 24px;
  padding: 0px;
  margin: 0px;
  line-height: 1.2em;
  text-align: left;
}
#comms-kih-left-text-container span#human-t-c {
  color: #71D1B3;
}

#comms-kih-left-text-container span#her-t-l {
  font-weight: 300;
}

#comms-kih-main-text-container {
  display: table-cell;
  max-width: 260px;
  height: 100%;
  vertical-align: middle;
  text-align: center;
}

#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
  max-width: 260px;
}


#comms-kih-main-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 1.3em;
    padding: 0px;
  margin: 0px;
  text-align: left;
}

#comms-kih-main-text-container p span {
    font-weight: bold;
}

#comms-kih-right-image-container {
  display: table-cell;
  width: 400px;
  vertical-align: middle;
}

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
}

#comms-kih-main-text-container a{
  color: #FFFFFF;
  font-weight: bold;
  cursor: pointer;
  text-decoration: none;
}

#comms-kih-main-text-container a:hover {
  text-decoration: underline;
}

#comms-kih-toggle-box-options {
  display: table-cell;
  font-size: .8em;
  text-transform: uppercase;
  width: 38px;
  height: 38px;
  border-radius: 19px;
  vertical-align: middle;
}

#comms-kih-toggle-box {
  cursor: pointer;
  position: absolute;
  top: 2px;
  right: 3px;
  z-index: 1;
  opacity: .8;
}

body.rtl #comms-kih-toggle-box {
  left: 3px;
  right: unset;
}

#comms-kih-toggle-box:hover { 
  opacity: 1;
}

#comms-kih-toggle-icon{
  background: 
    linear-gradient(transparent,transparent),
    url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eclose%3C/title%3E%3Cpath d=%22M4.34 2.93l12.73 12.73-1.41 1.41L2.93 4.35z%22/%3E%3Cpath d=%22M17.07 4.34L4.34 17.07l-1.41-1.41L15.66 2.93z%22/%3E%3C/svg%3E");
  height: 100%;
  width: 17px;
  min-width: 17px;
  min-height: 17px;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  opacity: 0.8;
}

#comms-kih-toggle-icon:hover { 
  opacity: 1;
}

@media only screen and (max-width: 1042px) {
#comms-kih-main-text-container {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
text-align: center;
}

#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
}
  
 #comms-kih-main-text-container p {
   font-family: Arial, sans-serif;
   font-weight: regular;
   font-size: 12px;
   line-height: 1.2em;
   opacity: 1;
   text-align: left;
  }
#comms-kih-right-image-container {
  display: table-cell;
  vertical-align: middle;
  width: 175px;
  height: 100%;
  padding-right: 0px;
  }

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
  } 
}

@media only screen and (max-width: 851px) {
  #comms-kih-left-text-container {
    position: relative;
    width: 250px;
    height: 100%;
    padding-left: 5px;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 250px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 18px;
  line-height: 1.2em;
  text-align: left;
}
  
#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
  max-width: 220px;
}
  #comms-kih-main-text-container {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
  text-align: center;
}  
  
  #comms-kih-main-text-container p {
  font-family: Arial, sans-serif;
  font-weight: regular;
  font-size: 10px;
  line-height: 1.2em;
  opacity: 1;
  text-align: left;
  }
  
 #comms-kih-right-image-container  {
  display: table-cell;
  vertical-align: middle;
  height: 100%;
  width: 175px;
  padding-right: 0px;
  }

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
  } 
}

@media only screen and (max-width: 759px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
   #comms-kih-main-text-container p {
    font-size: 11px;
    line-height: 1.2em;
    padding-left: 30px;
    padding-right: 10px;
 }
}

@media only screen and (max-width: 600px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 100px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 1.2em;
  text-align: left;
}  
  
  #comms-kih-main-text-container p {
    font-size: 11px;
    line-height: 1.2em;
    padding-left: 30px;
    padding-right: 10px;
 }
}

@media only screen and (max-width: 390px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 70px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 11px;
  line-height: 1.2em;
  text-align: left;
}  
  
  #comms-kih-main-text-container p {
    font-size: 8px;
    line-height: 1.2em;
    padding-left: 30px;
    padding-right: 10px;
 }
}
</style>

<div dir="ltr" id="comms-kih-main-container">
   <a href="https://wikimediafoundation.org/knowledge-is-her?mtm_campaign=ge25&mtm_medium=cnb&mtm_content=en" target="_blank">
    <div id="comms-kih-left-text-container">
      <p><strong>Knowledge is <span id="human-t-c"> human.</span></strong> <br/><span id="her-t-l">  Knowledge is her.</span></p>
    </div>
    <div id="comms-kih-main-text-container">
      <div id="comms-kih-text-container">
     <p>They write. They add sources. They fact check. This International Women's Day, discover volunteers who are writing more women into the free encyclopedia. 
      <span> Get inspired. </span> </p> 
      </div>
    </div>
   <div id="comms-kih-right-image-container">
     <img src="//upload.wikimedia.org/wikipedia/commons/archive/b/b2/20250210204050%21CarolM_Collage_Knowledge_is_Her.png" alt="Knowledge is her collage">
    </div>
  <div id="comms-kih-toggle-box">
        <div id="comms-kih-toggle-icon" href="#" title="{{int:centralnotice-shared-hide}}" onclick="mw.centralNotice.hideBanner();return false;"></div>
  </div>
</a>
</div>

French version

edit
<style>
#comms-kih-main-container {
  display: table;
  width: 100%;
  height: 80px;
  position: relative;
  overflow: hidden;
  background: #000000;
  border: 1px transparent;
  border-radius: 2px;
  margin-bottom: 1em;
  cursor: pointer;
  color: #000000;
}

#comms-kih-main-container a {
  display: table;
  vertical-align: middle;
  position: relative;
  height: 80px;
  width: 100%;
  vertical-align: middle;
  background: #000000;
  background-size: cover;
  background-position: center;
  color: #000000;
  cursor: pointer;
  text-decoration: none;
}

body.skin-minerva #comms-kih-main-container {
  height: 80px;
}

body.skin-monobook #centralNotice, body.skin-timeless #centralNotice {
    display: none !important;
}

#comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 350px;
  padding-left: 20px;
  padding-right: 62px;
  padding-top: 0px;
}

#comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 24px;
  padding: 0px;
  margin: 0px;
  line-height: 1.2em;
  text-align: left;
}
#comms-kih-left-text-container span#human-t-c {
  color: #71D1B3;
}

#comms-kih-left-text-container span#her-t-l {
  font-weight: 300;
}

#comms-kih-main-text-container {
  display: table-cell;
  max-width: 365px;
  height: 100%;
  vertical-align: middle;
  text-align: center;
}

#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
  max-width: 365px;
}


#comms-kih-main-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 1.3em;
    padding: 0px;
  margin: 0px;
  text-align: left;
}

#comms-kih-main-text-container p span {
    font-weight: bold;
}

#comms-kih-right-image-container {
  display: table-cell;
  width: 400px;
  vertical-align: middle;
}

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
}

#comms-kih-main-text-container a{
  color: #FFFFFF;
  font-weight: bold;
  cursor: pointer;
  text-decoration: none;
}

#comms-kih-main-text-container a:hover {
  text-decoration: underline;
}

#comms-kih-toggle-box-options {
  display: table-cell;
  font-size: .8em;
  text-transform: uppercase;
  width: 38px;
  height: 38px;
  border-radius: 19px;
  vertical-align: middle;
}

#comms-kih-toggle-box {
  cursor: pointer;
  position: absolute;
  top: 2px;
  right: 3px;
  z-index: 1;
  opacity: .8;
}

body.rtl #comms-kih-toggle-box {
  left: 3px;
  right: unset;
}

#comms-kih-toggle-box:hover { 
  opacity: 1;
}

#comms-kih-toggle-icon{
  background: 
    linear-gradient(transparent,transparent),
    url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eclose%3C/title%3E%3Cpath d=%22M4.34 2.93l12.73 12.73-1.41 1.41L2.93 4.35z%22/%3E%3Cpath d=%22M17.07 4.34L4.34 17.07l-1.41-1.41L15.66 2.93z%22/%3E%3C/svg%3E");
  height: 100%;
  width: 17px;
  min-width: 17px;
  min-height: 17px;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  opacity: 0.8;
}

#comms-kih-toggle-icon:hover { 
  opacity: 1;
}

@media only screen and (max-width: 1144px) {
#comms-kih-main-text-container {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
text-align: center;
}

#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
}
  
 #comms-kih-main-text-container p {
   font-family: Arial, sans-serif;
   font-weight: regular;
   font-size: 12px;
   line-height: 1.2em;
   opacity: 1;
   text-align: left;
  }
#comms-kih-right-image-container {
  display: table-cell;
  vertical-align: middle;
  width: 175px;
  height: 100%;
  padding-right: 0px;
  }

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
  } 
}

@media only screen and (max-width: 918px) {
  #comms-kih-left-text-container {
    position: relative;
    width: 350px;
    height: 100%;
    padding-left: 5px;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 350px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 18px;
  line-height: 1.2em;
  text-align: left;
}
  
#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
  max-width: 250px;
}
  #comms-kih-main-text-container {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
  text-align: center;
}  
  
  #comms-kih-main-text-container p {
  font-family: Arial, sans-serif;
  font-weight: regular;
  font-size: 10px;
  line-height: 1.2em;
  opacity: 1;
  text-align: left;
  }
  
 #comms-kih-right-image-container  {
  display: table-cell;
  vertical-align: middle;
  height: 100%;
  width: 175px;
  padding-right: 0px;
  }

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
  } 
}

@media only screen and (max-width: 759px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
   #comms-kih-left-text-container {
    position: relative;
    width: 300px;
    height: 100%;
    padding-left: 5px;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 300px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2em;
  text-align: left;
}
  
#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
  max-width: 300px;
}
  #comms-kih-main-text-container {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
  text-align: center;
} 
  
   #comms-kih-main-text-container p {
    font-size: 11px;
    line-height: 1.2em;
    padding-left: 10px;
    padding-right: 10px;
 }
}

@media only screen and (max-width: 572px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 130px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 1.2em;
  text-align: left;
}  
  
  #comms-kih-main-text-container p {
    font-size: 11px;
    line-height: 1.2em;
    padding-left: 10px;
    padding-right: 10px;
 }
}

@media only screen and (max-width: 402px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 100px;
  padding-left: 10px;
  padding-right: 0px;
  padding-top: 0px;
}
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 11px;
  line-height: 1.2em;
  text-align: left;
}  
  
  #comms-kih-main-text-container p {
    font-size: 8px;
    line-height: 1.2em;
    padding-left: 10px;
    padding-right: 10px;
 }
}
</style>

<div dir="ltr" id="comms-kih-main-container">
   <a href="https://wikimediafoundation.org/fr/knowledge-is-her?mtm_campaign=ge25&mtm_medium=cnb&mtm_content=fr" target="_blank">
    <div id="comms-kih-left-text-container">
      <p><strong>La connaissance est <span id="human-t-c"> humaine.</span></strong> <br/><span id="her-t-l">  La connaissance, c'est Elle.</span></p>
    </div>
    <div id="comms-kih-main-text-container">
      <div id="comms-kih-text-container">
        <p>Elles écrivent. Elles ajoutent des sources. Elles vérifient les faits. En cette Journée internationale des femmes découvrez les bénévoles qui documentent plus de femmes dans l'encyclopédie libre. 
      <span> Inspirez-vous! </span> </p> 
      </div>
    </div>
   <div id="comms-kih-right-image-container">
     <img src="//upload.wikimedia.org/wikipedia/commons/archive/b/b2/20250210204050%21CarolM_Collage_Knowledge_is_Her.png" alt="Knowledge is her collage">
    </div>
  <div id="comms-kih-toggle-box">
        <div id="comms-kih-toggle-icon" href="#" title="{{int:centralnotice-shared-hide}}" onclick="mw.centralNotice.hideBanner();return false;"></div>
  </div>
</a>
</div>

English / Swahili version

edit
<style>
#comms-kih-main-container {
  display: table;
  width: 100%;
  height: 80px;
  position: relative;
  overflow: hidden;
  background: #000000;
  border: 1px transparent;
  border-radius: 2px;
  margin-bottom: 1em;
  cursor: pointer;
  color: #000000;
}

#comms-kih-main-container a {
  display: table;
  vertical-align: middle;
  position: relative;
  height: 80px;
  width: 100%;
  vertical-align: middle;
  background: #000000;
  background-size: cover;
  background-position: center;
  color: #000000;
  cursor: pointer;
  text-decoration: none;
}

body.skin-minerva #comms-kih-main-container {
  height: 80px;
}

body.skin-monobook #centralNotice, body.skin-timeless #centralNotice {
    display: none !important;
}

#comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 273px;
  padding-left: 20px;
  padding-right: 62px;
  padding-top: 0px;
}

#comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 24px;
  padding: 0px;
  margin: 0px;
  line-height: 1.2em;
  text-align: left;
}
#comms-kih-left-text-container span#human-t-c {
  color: #71D1B3;
}

#comms-kih-left-text-container span#her-t-l {
  font-weight: 300;
}

#comms-kih-main-text-container {
  display: table-cell;
  max-width: 260px;
  height: 100%;
  vertical-align: middle;
  text-align: center;
}

#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
  max-width: 260px;
}


#comms-kih-main-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 1.3em;
    padding: 0px;
  margin: 0px;
  text-align: left;
}

#comms-kih-main-text-container p span {
    font-weight: bold;
}

#comms-kih-right-image-container {
  display: table-cell;
  width: 400px;
  vertical-align: middle;
}

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
}

#comms-kih-main-text-container a{
  color: #FFFFFF;
  font-weight: bold;
  cursor: pointer;
  text-decoration: none;
}

#comms-kih-main-text-container a:hover {
  text-decoration: underline;
}

#comms-kih-toggle-box-options {
  display: table-cell;
  font-size: .8em;
  text-transform: uppercase;
  width: 38px;
  height: 38px;
  border-radius: 19px;
  vertical-align: middle;
}

#comms-kih-toggle-box {
  cursor: pointer;
  position: absolute;
  top: 2px;
  right: 3px;
  z-index: 1;
  opacity: .8;
}

body.rtl #comms-kih-toggle-box {
  left: 3px;
  right: unset;
}

#comms-kih-toggle-box:hover { 
  opacity: 1;
}

#comms-kih-toggle-icon{
  background: 
    linear-gradient(transparent,transparent),
    url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eclose%3C/title%3E%3Cpath d=%22M4.34 2.93l12.73 12.73-1.41 1.41L2.93 4.35z%22/%3E%3Cpath d=%22M17.07 4.34L4.34 17.07l-1.41-1.41L15.66 2.93z%22/%3E%3C/svg%3E");
  height: 100%;
  width: 17px;
  min-width: 17px;
  min-height: 17px;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  opacity: 0.8;
}

#comms-kih-toggle-icon:hover { 
  opacity: 1;
}

@media only screen and (max-width: 1042px) {
#comms-kih-main-text-container {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
text-align: center;
}

#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
}
  
 #comms-kih-main-text-container p {
   font-family: Arial, sans-serif;
   font-weight: regular;
   font-size: 12px;
   line-height: 1.2em;
   opacity: 1;
   text-align: left;
  }
#comms-kih-right-image-container {
  display: table-cell;
  vertical-align: middle;
  width: 175px;
  height: 100%;
  padding-right: 0px;
  }

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
  } 
}

@media only screen and (max-width: 851px) {
  #comms-kih-left-text-container {
    position: relative;
    width: 250px;
    height: 100%;
    padding-left: 5px;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 250px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 18px;
  line-height: 1.2em;
  text-align: left;
}
  
#comms-kih-main-text-container #comms-kih-text-container {
  display: inline-block;
  max-width: 220px;
}
  #comms-kih-main-text-container {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
  text-align: center;
}  
  
  #comms-kih-main-text-container p {
  font-family: Arial, sans-serif;
  font-weight: regular;
  font-size: 10px;
  line-height: 1.2em;
  opacity: 1;
  text-align: left;
  }
  
 #comms-kih-right-image-container  {
  display: table-cell;
  vertical-align: middle;
  height: 100%;
  width: 175px;
  padding-right: 0px;
  }

#comms-kih-right-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
  } 
}

@media only screen and (max-width: 759px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
   #comms-kih-main-text-container p {
    font-size: 11px;
    line-height: 1.2em;
    padding-left: 30px;
    padding-right: 10px;
 }
}

@media only screen and (max-width: 600px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 100px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 1.2em;
  text-align: left;
}  
  
  #comms-kih-main-text-container p {
    font-size: 11px;
    line-height: 1.2em;
    padding-left: 30px;
    padding-right: 10px;
 }
}

@media only screen and (max-width: 390px) {
    #comms-kih-left-image-container,
    #comms-kih-right-image-container {
    display: none;
 }
  #comms-kih-left-text-container {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  height: 100%;
  width: 70px;
  padding-left: 20px;
  padding-right: 0px;
  padding-top: 0px;
}
  #comms-kih-left-text-container p {
  color: #FFFFFF;
  font-family: Arial, sans-serif;
  font-size: 11px;
  line-height: 1.2em;
  text-align: left;
}  
  
  #comms-kih-main-text-container p {
    font-size: 8px;
    line-height: 1.2em;
    padding-left: 30px;
    padding-right: 10px;
 }
}
</style>

<div dir="ltr" id="comms-kih-main-container">
   <a href="https://wikimediafoundation.org/knowledge-is-her-25?mtm_campaign=ge25&mtm_medium=cnb&mtm_content=ke" target="_blank">
    <div id="comms-kih-left-text-container">
      <p><strong>Knowledge is <span id="human-t-c"> human.</span></strong> <br/><span id="her-t-l">  Knowledge ni sisi.</span></p>
    </div>
    <div id="comms-kih-main-text-container">
      <div id="comms-kih-text-container">
     <p>They write. They add sources. They fact check. This International Women's Day, discover volunteers who are writing more women into the free encyclopedia. 
      <span> Get inspired. </span> </p> 
      </div>
    </div>
   <div id="comms-kih-right-image-container">
     <img src="//upload.wikimedia.org/wikipedia/commons/archive/b/b2/20250210204050%21CarolM_Collage_Knowledge_is_Her.png" alt="Knowledge is her collage">
    </div>
  <div id="comms-kih-toggle-box">
        <div id="comms-kih-toggle-icon" href="#" title="{{int:centralnotice-shared-hide}}" onclick="mw.centralNotice.hideBanner();return false;"></div>
  </div>
</a>
</div>