MediaWiki:Common.css.bak: Difference between revisions

From softwear.directory
Jump to navigation Jump to search
No edit summary
No edit summary
 
Line 2,157: Line 2,157:
}
}
/* ----->END------ SEARCH PAGE */
/* ----->END------ SEARCH PAGE */
/* ----->START------ TOOLTIP EVENT CARDS  */
.tooltip-popup {
  position: fixed;
  padding: 6px 12px;
  background-color: black;
  color: white;
  font-size: 13px;
  border-radius: 4px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
  z-index: 9999;
}
/* ----->END------ TOOLTIP EVENT CARDS */

Latest revision as of 12:55, 26 June 2025

/* ----->START------ FONTS */ @font-face { 

   font-family: 'HALColant-TextRegular';
   src: url('/fonts/HALColant-TextRegular.woff2') format('woff2'),
       url('/fonts/HALColant-TextRegular.woff') format('woff');
   font-weight: normal;
   font-style: normal;

}

  • {
   color: #292828; /* Specific black color */

}

/* Change text color of links on hover */ a:hover { 

   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;

}

/* Change text color of links on focus */ a:focus { 

   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;

}

html, body { 

   font-family: HALColant-TextRegular!important;
   background: #FAFAFA 0%;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-smoothing: antialiased;
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="black" /></svg>') 14 14, auto;

} html { 

   scrollbar-width: none; /* Firefox */

} body { 

   background: #FAFAFA 0%;
   transition: background-color 1s ease;

}

-webkit-scrollbar {
   display: none;

} pre.mw-code.mw-css { 

   font-family: sans-serif!important;

} /* -----END<------ FONTS */

/* ----->START------ GENERAL RULES FOR MEDIAWIKI SKIN */ /* Page Margins */ .mw-body { 

   padding: 0 !important;
   margin-left: 0 !important;
   border: none;
   background: #FAFAFA 0%;

} .mw-search-profile-tabs { 

   display: none;

} .mw-parser-output { 

   background: #FAFAFA 0%;
   transition: background-color 1s ease;
   /*padding: 25px;*/
   padding: 1.3%;

}

  1. mw-searchoptions {
   display: none;

} /* Hide Mediawiki logo */

  1. p-logo a {
   display: none;

} /* Hide left vertical toolbar */

  1. mw-panel {
   display: none;

} .mw-parser-output a.external { 

   background-image: none;

} .mw-search-result-data { 

   display: none;

} .mw-search-result-heading { 

 font-size: 16pt;
 line-height: 27px;
 letter-spacing: 0.4px;

} .mw-search-results li a { 

 font-size: 16pt!important;
 line-height: 27px;
 letter-spacing: 0.4px;
 color: black;
 text-decoration: underline;

}

  1. mw-indicator-mw-helplink {
 display: none;

} .mw-search-results-container h2 { 

 display: none;

}

  1. mw-content-text .mw-search-results {
 margin-top: 0 !important;

} .mw-search-results li { 

 list-style: none;
 margin-bottom: 0 !important;

} .results-info { 

 display: none;

} .vector-body p { 

 margin-top: 0px!important;
 margin-bottom: 0px!important;

}

  1. firstHeading {
   display: none;

} .mw-footer { 

   display: none;

} a.mw-selflink { 

   font-weight: normal;
   text-decoration: underline;

} a.mw-selflink:hover { 

   font-weight: normal;
   text-decoration: underline;

}

  1. mw-head {
   background-color: #FAFAFA;
   transition: background-color 1s ease;
   display: none;

} .mw-body, #left-navigation, #mw-data-after-content, .mw-footer { 

   margin-left: 0!important;

}

  1. mw-page-base {
   background-color: #FAFAFA;
   transition: background-color 1s ease;
   background-image: none;
   display: none;

}

  1. catlinks {
   display: none;

} /* Don't display 3 vertical lines. This is loading of Mediawiki*/ .mw-indicators { 

   display: none;

} /* Don't display loading load spinner. This is loading of Semantic Mediawiki*/ .smw-overlay-spinner { 

   display: none;

} .mw-content-subtitle, #contentSub, #contentSub2 { 

   display: none;

} /* -----END<------ GENERAL RULES FOR MEDIAWIKI SKIN */

/* ------> STYLING HEADER */ .custom-navbar { 

   display:none;

} .logo p { 

 font-size: 17px;
 line-height: 22px;
 letter-spacing: 0.37px;
 text-align: right;
 text-decoration: underline;
 margin-top: -0.33rem !important;

} div.hf-header { 

   position: fixed;
   top: 0;
   left: 0;
   width: -moz-available; /* For Firefox */
   width: -webkit-fill-available; /* For Chrome and Safari */
   background: transparent linear-gradient(180deg, #FAFAFA 0%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
   z-index: 9999;
   /*padding: 25px 25px 0 25px;*/
   padding: 1.3%;

} div#hf-nsheader- { 

   position: fixed;
   top: 0;
   left: 0;
   width: -moz-available; /* For Firefox */
   width: -webkit-fill-available; /* For Chrome and Safari */
   background: transparent linear-gradient(180deg, #FAFAFA 0%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
   z-index: 9999;
   /*padding: 25px 25px 0 25px;*/
   padding: 1.3%;

} div#hf-nsheader-Special { 

   position: fixed;
   top: 0;
   left: 0;
   width: -moz-available; /* For Firefox */
   width: -webkit-fill-available; /* For Chrome and Safari */
   background: transparent linear-gradient(180deg, #FAFAFA 0%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
   z-index: 9999;
   /*padding: 25px 25px 0 25px;*/
   padding: 1.3%;

}

  1. header-container {
   display: flex;
   flex-wrap: wrap;
   margin: 0 auto;
   /*padding-bottom: 100px;*/

} .head-col { 

   width: calc(20% - 0px);
   box-sizing: border-box;
   height: fit-content;
   padding: 10px;

} .head-links.head-col { 

 width: calc(20% - 3px);

} .head-col-extend { 

   box-sizing: border-box;
   height: fit-content;

} .head-box { 

   border: 1px solid black;
   background: #FAFAFA;
   z-index: 2;
   position: relative;

} .head-box:hover { 

   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;

} .head-nav { 

   padding-left: 15px;
   padding-top: 5px;
   line-height: 23px;

} .head-links { 

   padding-top: 5px;

}

/* FILTERS HEADER */ .head-filter.head-col-extend { 

   width: calc(40% + 3px);
   overflow: hidden;

} .container-filter-label-button {

}

.buttons-filters { 

   font-size: 16px;
   line-height: 20px;
   letter-spacing: 0.35px;
   padding-bottom: 5px;
   display: grid;
   grid-template-columns: 1fr 1fr; /* two equal columns */
   align-items: center;
   gap: 10px;

}

.count-filters-container { 

 border-bottom: 1px solid black;
 padding-bottom: 5px;

}

.count-filtered-cards { 

 font-size: 17px;
 line-height: 22px;
 font-style: italic;
 margin-top: 0;
 width: fit-content;

}

.count-filtered-cards span { 

 margin-right: 2px;
 background-color: #EDEDED;
 padding: 1px 3px;

}


.reset-button {

} .reset-button { 

   justify-self: end;

} .open-close-button { 

   justify-self: start;

} .reset-symbol { 

 font-size: 20px;

} .reset-filter { 

   font-family: HALColant-TextRegular !important;
   background: none;
   border: none;
   font-size: 17px;
   line-height: 20px;
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   text-transform: uppercase;

} .toggle-filters.general-toggle { 

   font-family: HALColant-TextRegular !important;
   background: none;
   border: none;
   font-size: 17px;
   line-height: 20px;
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   text-transform: uppercase;
   padding-left: 0!important;

} .toggle-filters.open-filter { 

   font-family: HALColant-TextRegular !important;
   position: absolute;
   background: none;
   font-weight: normal;
   text-transform: uppercase;
   letter-spacing: 0px;
   border: none;
   padding: 5px 0;
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   text-decoration: underline;
   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.95px;

} .toggle-filters.open-filter:hover { 

   font-style: italic;

} .filter-button { 

   font-family: HALColant-TextRegular !important;
   padding: 0 !important;
   white-space: nowrap;
   background: rgb(237,237,237);
   margin-bottom: 5px;
   border: none;
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   font-size: 19px;
   line-height: 26px;
   letter-spacing: 0.95px;

} .filter-button:hover { 

   font-style: italic;

} .values { 

   display: none; /* Keep the filter values hidden initially */
   padding-top: 30px;

} button.active { 

   text-decoration: underline;

}

  1. filters {
   display: none; /* Hidden initially, will be shown on button click */
   width: 100%; /* Full width of the parent container */
   grid-template-columns: repeat(4, 1fr); /* Creates four columns with equal width */
   gap: 5px; /* Space between grid items */
   box-sizing: border-box;
   opacity: 0;
   transition: opacity 0.5s ease, height 0.5s ease;
   height: 0;
   overflow: hidden;
   background: transparent linear-gradient(180deg,#FAFAFA 0%,#FFFFFF00 100%) 0% 0% no-repeat padding-box;

} @media screen and (max-width: 1366px) { 

   .toggle-filters.open-filter {
       font-size: 15px;
       line-height: 24px;
       letter-spacing: 0.95px;
   }

   .filter-button {
       font-size: 16px;
       line-height: 24px;
       letter-spacing: 0.95px;
   }

   #filters {
       grid-template-columns: 0.65fr 0.8fr 1fr 1fr; 
   }

}

  1. filters.is-visible {
   display:grid;
   opacity: 1;
   height: auto; /* Adjust to the natural height of the content */

} .filter { 

   white-space: normal;
   overflow-wrap: break-word;

} .filter-label { 

   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;

}

.header-entry-number { 

   font-size: 17px;
   line-height: 24px;
   letter-spacing: 0.37px;
   padding-bottom: 5px;
   float: left;

} .header-authors { 

   font-size: 19px;
   line-height: 26px;
   letter-spacing: 0.95px;
   padding-left: 5em;

} .header-title { 

   border-top: 1px solid black;
   font-size: 19px;
   line-height: 26px;
   letter-spacing: 0.95px;
   padding: 4px 0;

} .header-authors a { 

   color: black;
   text-decoration: none;

} .header-authors a:hover { 

   font-style: italic;

} .header-title a { 

   color: black;
   text-decoration: none;

} .header-title a:hover { 

   font-style: italic;

} .header-type { 

   border-top: 1px solid black;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.95px;
   padding-top: 4px;

} .header-index { 

   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;

} .header-index a { 

   color: black;

} .header-index a:hover { 

   color: black;

} .header-people { 

   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;

} .header-people a{ 

   color: black!important;

} .header-people a:hover{ 

   color: black;

} .header-community { 

   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;

} .header-community a { 

   color: black!important;

} .header-community a:hover{ 

   color: black;

} .header-date { 

   color: #4D4D4D;
   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;

} .header-about { 

   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;

} .header-about a { 

   color: black!important;

} .header-about a:hover{ 

   color: black;

} .about-hide { 

   opacity: 0; /* Make it invisible initially */
   visibility: hidden; /* Ensure it's not interactable */
   display: none;
   color: black;
   font-size: 28px;
   line-height: 34px;
   letter-spacing: 1.4px;
   width: 200%;
   border-bottom: 1px solid black;
   padding-bottom: 5px;
   padding-top: 5px;
   transition: opacity 0.8s ease, visibility 0.8s;

} .header-about:hover + .about-hide { 

   display: block;
   opacity: 1; /* Make it fully visible on hover */
   visibility: visible; /* Make it interactable */

}

  1. about-container {
   display: flex;
   flex-wrap: wrap;
   margin: 0 auto;
   padding-bottom: 12%;
   top: 420px;
   position: relative;
   width: 100%;

} .about-col { 

   width: calc(40% - 0px);
   box-sizing: border-box;
   height: fit-content;
   padding: 0 0 0 0;
   margin-bottom: 30px;
   margin-right: 15px;

} .about-details-col { 

   width: calc(18% - 0px);
   box-sizing: border-box;
   height: fit-content;
   margin-bottom: 30px;
   font-size: 10pt;
   line-height: 16px;
   letter-spacing: 0.4px;
   border-bottom: 1px solid black;

} .about-details-label { 

   border-top: 1px solid black;
   padding-top: 5px;
   margin-bottom: 0 !important;
   text-indent: 35px;

} .about-details-text { 

   margin: 3px 0 !important;

} .about-main-text { 

   text-indent: 35px;
   font-size: 23px;
   line-height: 31px;
   letter-spacing: 1.29px;
   margin-top: 0 !important;

} .about-bullets { 

   text-indent: 35px;
   padding-left: 35px;

} .about-more-text { 

   text-indent: 35px;
   font-size: 23px;
   line-height: 31px;
   letter-spacing: 1.29px;
   margin-top: 0 !important;

} .about-label { 

   font-size: 15px;
   line-height: 19px;
   letter-spacing: 0.48px;
   border-top: none!important;
   text-indent: 35px;
   margin-bottom: 0 !important;

} .about-details-contact-label { 

   font-size: 15px;
   line-height: 19px;
   letter-spacing: 0.48px;
   border-top: none!important;
   text-indent: 35px;
   margin-bottom: 0 !important;

} .about-details-contact { 

   font-size: 15px;
   line-height: 18px;
   text-indent: 35px;
   letter-spacing: 0.84px;
   margin-top: 0 !important;

} /* -----END<------ STYLING HEADER */


img { 

   border: 0;
   width: 50px;
   height: auto;

}

.home-block-view { 

   display: none;
   position: relative;
   top: 440px;
   width: -moz-available!important;
   width: -webkit-fill-available!important;

} .home-list-view { 

   display: none;
   position: relative;
   top: 440px;

}

/* ----->START------ BUTTONS IN HOME LIST BLOCK CHRONICLE RANDOM ALPHABETICAL */

.active-view-button button { 

   text-decoration: underline;

}

/* Block and List View Buttons */ .view-container-buttons { 

   display: flex;
   justify-content: space-between; /* This puts one group on the left, and the other on the right */
   position: relative;
   top: 420px;

} .view-buttons, .order-buttons { 

   display: flex; 
   justify-content: left;

} .home-view-buttons, .home-order-buttons { 

   display: flex; 
   justify-content: left;
   position: relative;
   z-index: 1000;

} .view-buttons, .order-buttons { 

   display: flex; 
   justify-content: left;
   position: relative;
   z-index: 1000;

} .home-list-sorting-buttons, .home-block-sorting-buttons { 

   position: absolute; 
   top: 0;
   left: 0;
   width: 100%;
   display: flex; 
   justify-content: flex-end;

} .list-sorting-buttons, .block-sorting-buttons { 

   position: absolute; 
   top: 0;
   left: 0;
   width: 100%;
   display: flex; 
   justify-content: flex-end;

} .home-list-sorting-buttons { 

   display: none; /* Initially hide the sorting buttons */

} .block-sorting-buttons { 

   display: none; /* Initially hide the sorting buttons */

} .list-view-button, .block-view-button, .chronicle-button, .random-button, .alphabetical-button, .chronicle-list-button, .random-list-button, .alphabetical-list-button, .chronicle-block-button, .random-block-button, .alphabetical-block-button, .home-list-view-button, .home-block-view-button, .home-chronicle-list-button, .home-random-list-button, .home-alphabetical-list-button, .home-chronicle-block-button, .home-random-block-button, .home-alphabetical-block-button { 

   font-size: 19px;
   line-height: 26px;
   letter-spacing: 0.95px;
   padding-inline: 2px;
   display: inline-block;

} .home-list-view-button button:hover, .home-block-view-button button:hover, .home-chronicle-block-button button:hover, .home-chronicle-list-button button:hover, .home-random-block-button button:hover, .home-random-list-button button:hover, .home-alphabetical-block-button button:hover, .home-alphabetical-list-button button:hover{ 

 text-decoration: underline;
 cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;

} .home-list-view-button button:focus, .home-block-view-button button:focus, .home-chronicle-block-button button:focus, .home-chronicle-list-button button:focus, .home-random-block-button button:focus, .home-random-list-button button:focus, .home-alphabetical-block-button button:focus, .home-alphabetical-list-button button:focus{ 

 text-decoration: underline;
 cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;

} .list-view-button button, .block-view-button button, .chronicle-button button, .random-button button, .alphabetical-button button, .chronicle-list-button button, .random-list-button button, .alphabetical-list-button button, .chronicle-block-button button, .random-block-button button, .alphabetical-block-button button, .home-list-view-button button, .home-block-view-button button, .home-chronicle-list-button button, .home-random-list-button button, .home-alphabetical-list-button button, .home-chronicle-block-button button, .home-random-block-button button, .home-alphabetical-block-button button{ 

   background: transparent;
   border: none;
   font-family: HALColant-TextRegular!important;
   font-size: 19px;
   line-height: 26px;
   letter-spacing: 0.4px;
   padding-inline: 5px;

}

/* -----END<------ BUTTONS IN HOME LIST BLOCK CHRONICLE RANDOM ALPHABETICAL */

/* ----->START------ LIST AND BLOCK VIEW */

/* BLOCK VIEW */ .home-chronicle-block div.list-container { 

   display: flex;
   flex-wrap: wrap;
   margin: 0 auto;
   padding-left: 1px;

} /* Card for BLOCK view */ .home-chronicle-block div.list-container div.card { 

 position: relative;
 width: calc(20% - 0px);
 box-sizing: border-box;
 border: 1px solid black;
 height: fit-content;
 padding: 5px 10px;
 margin-bottom: 30px;
 font-size: 17px;
 line-height: 24px;
 letter-spacing: 0.9px;
 cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-size="24" font-family="Arial" fill="black">⤢</text></svg>') 16 16, auto;

} .home-chronicle-block div.list-container div.card:hover { 

   background: #f3f3f3;

} .home-chronicle-list div.list-container div.card:hover { 

   background: #f3f3f3;

} .home-chronicle-block div.list-container div.event:hover { 

 background: black;
 color: white !important;
 cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;

}

.home-chronicle-block div.list-container div.event:hover .entry-number, .home-chronicle-block div.list-container div.event:hover .event-link, .home-chronicle-block div.list-container div.event:hover .title, .home-chronicle-block div.list-container div.event:hover .container-people-date .people a, .home-chronicle-block div.list-container div.event:hover .container-people-date .date, .home-chronicle-block div.list-container div.event:hover .type a { 

 color: white !important;

}

.home-chronicle-list div.list-container div.event:hover { 

 background: black;
 color: white !important;
 cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;

}

.home-chronicle-list div.list-container div.event:hover .entry-number, .home-chronicle-list div.list-container div.event:hover .event-link, .home-chronicle-list div.list-container div.event:hover .title, .home-chronicle-list div.list-container div.event:hover .container-people-date .people a, .home-chronicle-list div.list-container div.event:hover .container-people-date .date, .home-chronicle-list div.list-container div.event:hover .type a { 

 color: white !important;

}

.home-chronicle-block div.list-container div.event div.entry-number { 

   z-index: 100000;

} .home-chronicle-block div.list-container div.event div.entry-number:hover { 

   color: white;

} .home-chronicle-block div.list-container div.card:not(:first-child) { 

   margin-left: -1px;
   border-left: 1px solid black;

} .home-chronicle-block div.list-container div.card:nth-child(5n + 1) { 

   transform: none;
   width: calc(20% - 0px);

} .home-chronicle-block div.list-container div.card:last-child { 

   margin-right: 0;
   border-right: 1px solid black;

}

/* Contents of Card for BLOCK view */ .home-chronicle-block div.list-container div.card div.images { 

   border-top: 1px solid black;
   padding-top: 5px;
   padding-bottom: 5px;
   display: flex; 
   flex-wrap: nowrap;

} .home-chronicle-block div.list-container div.card div.image1, .home-chronicle-block div.list-container div.card div.image2 { 

   margin-right: 10px; 
   transition: transform 0.3s ease;
   transform-origin: top left;

} .home-chronicle-block div.list-container div.card div.image1 img, .home-chronicle-block div.list-container div.card div.image2 img{ 

   display: block;
   width: auto;
   height: 75px;

}

.home-chronicle-block div.list-container div.card div.image1:hover, .home-chronicle-block div.list-container div.card div.image2:hover { 

   transform: scale(2); 
   position: relative;
   z-index: 900000;

}

.home-chronicle-block div.list-container div.card div.image3, .home-chronicle-block div.list-container div.card div.image4, .home-chronicle-block div.list-container div.card div.image5 { 

   display: none;

} .home-chronicle-block div.list-container div.card div.image3 img, .home-chronicle-block div.list-container div.card div.image4 img, .home-chronicle-block div.list-container div.card div.image5 img { 

   display: none;

}

.home-chronicle-block div.list-container div.card div.entry-number { 

 padding-bottom: 3px;
 float: left;

} .title a { 

 color: black !important;
 pointer-events: none;
 cursor: default;

}

.home-chronicle-block div.list-container div.card div.event-link { 

   text-decoration: underline;
   font-size: 16px;
   line-height: 26px;
   float: right;
   margin-top: -2px;
   font-family: Arial, sans-serif;
   text-underline-offset: 3px;

}

.home-chronicle-block div.list-container div.card.event .title { 

 font-size: 23px;
 line-height: 26px;
 font-style: italic;
 text-align: left;
 letter-spacing: 0.9px;
 padding: 6px 6px 6px 0;
 border-top: 1px solid black

} .home-chronicle-list div.list-container div.card.event div.title { 

 font-size: 17px;
 line-height: 24px;
 letter-spacing: 0.9px;
 font-style: italic;
 text-align: left;
 width: calc(60% - 0px);
 max-width: 40%;

} .home-chronicle-list div.list-container div.card.event .container-people-date { 

 display: flex;
 width: calc(20% - 0px);
 padding-right: 50px;

} .home-chronicle-list div.list-container div.card.event div.people { 

 width: auto;
 flex: 1;

} .home-chronicle-list div.list-container div.card.event div.date { 

   width: auto;
   flex: 1;

} .home-chronicle-block div.list-container div.card.event div.container-people-date { 

   display: flex; /* Enables flexbox layout mode */
   justify-content: space-between;
   border-top: 1px solid black;

} .home-chronicle-block div.list-container div.card.event div.people { 

   padding-left: 0!important;

}

.home-chronicle-block div.list-container div.card div.container-people-date .people { 

 flex: 1; 
 text-align: left;
 border: none!important;
 line-height: 23px !important;
 padding-top: 6px;

} .home-chronicle-block div.list-container div.card div.container-people-date .date { 

 flex: 1; 
 text-align: right;
 line-height: 23px !important;
 padding-top: 6px;

}

.home-chronicle-block div.list-container div.card div.people { 

 line-height: 23px!important;
 padding-top: 2px;
 padding-left: 5em;

} .home-chronicle-block div.list-container div.card div.people a { 

   color: black;
   text-decoration: underline;

} .home-chronicle-block div.list-container div.card div.people a:hover { 

   font-style: italic;
   color: black;

}

.home-chronicle-block div.list-container div.card div.title { 

 font-size: 23px;
 padding: 6px 0;
 border-top: 1px solid black;

}

.home-chronicle-block div.list-container div.card div.type { 

   border-top: 1px solid black;
   padding-top: 5px;

} .home-chronicle-block div.list-container div.card div.type a { 

   color: black;
   text-decoration: none;

} .home-chronicle-block div.list-container div.card div.type a:hover { 

   font-style: italic;
   color: black;

} .home-chronicle-block div.list-container div.card.event div.type a:hover {

} /* Card for LIST view */ .home-chronicle-list div.list-container { 

   width: 100%; /* For Chrome and other browsers */
   padding-bottom: 80px;

} .home-chronicle-list div.list-container div.card { 

 width: -moz-available!important;
 width: -webkit-fill-available!important;
 width: 100%;
 margin-bottom: 0;
 border-left: 1px solid black;
 border-right: 1px solid black;
 border-bottom: none;
 border-top: 1px solid black;
 cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-size="24" font-family="Arial" fill="black">⤢</text></svg>') 16 16, auto;
 display: flex;
 align-items: flex-start;
 justify-content: start;
 font-size: 17px;
 line-height: 24px;
 letter-spacing: 0.9px;
 transition-delay: .001s;
 padding: 5px 10px;

} .home-chronicle-list div.list-container div.card:not(:first-child) { 

   margin-left: 0;
   border-left: 1px solid black;

} .home-chronicle-list div.list-container div.card:nth-child(5n + 1) { 

   margin-left: 0;
   transform: none;

} /* .home-chronicle-list div.list-container div.card:last-child { 

   margin-right: 0;
   border-bottom: 1px solid black;

} */ .home-chronicle-list div.list-container div.card.last-visible { 

   margin-right: 0;
   border-bottom: 1px solid black;

}

/* Contents of Card for LIST view */ .home-chronicle-list div.list-container div.card div.entry-number { 

   width: calc(10% - 0px);

} .home-chronicle-list div.list-container div.event div.entry-number { 

   width: calc(3.5% + 5px);

} .home-chronicle-list div.list-container div.event div.event-link { 

   width: calc(6.2% - 0px);
   text-decoration: underline;
   font-size: 16px;
   line-height: 24px;
   float: right;
   margin-top: -3.4px;
   font-family: Arial, sans-serif;
   text-underline-offset: 3px;

} .home-chronicle-list div.list-container div.card div.people { 

   width: calc(20% - 0px);
   border: none;
   padding-right: 50px;

} .home-chronicle-list div.list-container div.card div.people a { 

   text-decoration: underline;
   color: black;

} .home-chronicle-list div.list-container div.card.event div.people a {

} .home-chronicle-list div.list-container div.card div.people a:hover { 

   font-style: italic;

} .home-chronicle-list div.list-container div.card div.title-images { 

   display: flex;
   width: calc(60% - 0px);
   max-width: 50%;

} .home-chronicle-list div.list-container div.card div.images { 

   display: flex;
   border: none;
   padding-top: 0;
   padding-bottom: 0;

}

.home-chronicle-list div.list-container div.card div.image1 img, .home-chronicle-list div.list-container div.card div.image2 img{ 

   display: block;
   max-width: 100%;
   width: auto;
   height: 25px;

} .home-chronicle-list div.list-container div.card div.image1, .home-chronicle-list div.list-container div.card div.image2 { 

   margin-right: 10px;
   transition: transform 0.3s ease;
   transform-origin: top left;

} .home-chronicle-list div.list-container div.card div.image3, .home-chronicle-list div.list-container div.card div.image4, .home-chronicle-list div.list-container div.card div.image5 { 

   display: none;

} .home-chronicle-list div.list-container div.card div.type { 

   width: calc(10% - 0px);
   border: none;
   white-space: nowrap;
   position: absolute;
   left: 90%;

} .home-chronicle-list div.list-container div.card.event div.type a {

} .home-chronicle-list div.list-container div.card div.type a { 

   color: black;
   text-decoration: none;

} .home-chronicle-list div.list-container div.card div.type a:hover { 

   font-style: italic;

} .home-chronicle-list div.list-container div.card div.title { 

   max-width: 50%;

} .home-chronicle-list div.list-container div.card div.image1:hover, .home-chronicle-list div.list-container div.card div.image2:hover { 

   transform: scale(6);

}

.card.event + .card.event { 

   border-left: none;

} /* -----END<------ LIST AND BLOCK VIEW */

/* ----->START------ POP UP ARTICLE */

  1. list {
   width: 100%!important;

}

  1. show-article-wrapper-entry {
   display: block;
   position: fixed; /* Change to fixed */
   top: 0;
   /*right: 24px;*/
   right: 1.3%;
   width: 41%;
   height: 100vh; /* Set to full viewport height */
   overflow: auto; /* Enables scrolling if content overflows */
   scrollbar-width: none; /* Firefox */
   -ms-overflow-style: none;  /* Internet Explorer 10+ */
   z-index: 9999; /* Ensure it's above #list */
   /*padding-left: 100px;*/
   margin-top: 50px;

}

  1. show-article-wrapper-entry #show-article {
   padding-bottom: 50px;

} /* Hides scrollbar for Webkit browsers */

  1. show-article-wrapper-entry::-webkit-scrollbar {
   display: none;

}

  1. show-article-wrapper {
   display: none;
   position: fixed; /* Change to fixed */
   top: 5%;
   /*right: 24px;*/
   right: 1.3%;
   width: 41%;
   height: 100vh; /* Set to full viewport height */
   overflow: auto; /* Enables scrolling if content overflows */
   scrollbar-width: none; /* Firefox */
   -ms-overflow-style: none;  /* Internet Explorer 10+ */
   z-index: 9999; /* Ensure it's above #list */
   /*padding-left: 100px;*/

} /* Hides scrollbar for Webkit browsers */

  1. show-article-wrapper::-webkit-scrollbar {
   display: none;

}

  1. show-article {
   background-color: #FAFAFA;
   border: 1px solid;
   padding: 0px 10px 0 10px;
   position: relative;
   top: 40px;
   /*margin-left: 36px;*/
   margin-left: 4.6%;

}

  1. show-article-before {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: #FAFAFA;
   border: 1px solid #080808;
   transition: all 0.3s ease;
   opacity: 0; /* Initially hidden */
   z-index: -1; /* Ensures it's under the main content */

}

  1. show-article:hover #show-article-before {
   opacity: 1; 
       scrollbar-width: none; /* Firefox */
   -ms-overflow-style: none;  /* Internet Explorer 10+ */

} /* Hides scrollbar for Webkit browsers */

  1. show-article::-webkit-scrollbar {
   display: none;

}

.article-metadata { 

   display: flex;
   border-bottom: 1px solid black;
   padding: 5px 0 5px 0;

} .article-metadata-label { 

   text-transform: uppercase;
   margin-bottom: 0 !important;
   margin-top: 5px!important;
   font-size: 15px;
   line-height: 23px;
   letter-spacing: 0.48px;

} .article-metadata-value { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;

} .article-metadata-value a { 

 color: black !important;

}

.article-metadata-column:not(:first-child) { 

   margin-left: 20px;

}

.article-metadata-column:nth-child(n+2) { 

   margin-left: 10%;

} .article-label-description { 

   text-transform: uppercase;
   text-indent: 35px;
   padding-top: 5px;
   font-size: 15px;
   line-height: 23px;
   letter-spacing: 0.48px;

} .article-label-image { 

   text-transform: uppercase;
   text-indent: 35px;
   font-size: 15px;
   line-height: 23px;
   letter-spacing: 0.48px;
   padding-top: 5px;

} .article-label-reflection { 

   text-transform: uppercase;
   text-indent: 35px;
   padding-top: 5px;
   font-size: 15px;
   line-height: 23px;
   letter-spacing: 0.48px;

} .article-label-quote { 

   text-transform: uppercase;
   text-indent: 35px;
   font-size: 15px;
   line-height: 23px;
   letter-spacing: 0.48px;
   padding-top: 5px;

} .article-label-modification-date { 

   text-transform: uppercase;
   padding-top: 5px;
   text-indent: 35px;
   color: grey;
   display: inline-block;
   font-size: 15px;
   line-height: 23px;
   letter-spacing: 0.48px;

} .article-entry-number { 

   border-bottom: 1px solid black;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0px;
   padding-bottom: 5px;
   padding-top: 7px;

} .article-people { 

   font-size: 25px;
   line-height: 30px;
   letter-spacing: 1.4px;
   text-decoration: underline;
   text-align: center;
   padding-top: 15px;
   margin-bottom: 5px!important;

} .article-people a { 

   color: black;
   text-decoration: underline;

} .article-people a:hover { 

   font-style: italic;
   color: black;

} .article-title-link { 

   border-bottom: 1px solid black;
   padding-bottom: 10px;
   display: flex; /* Use flexbox */
   flex-direction: column; /* Stack items vertically */
   align-items: center; /* Align items horizontally in the center */
   justify-content: center; /* Align items vertically in the center */
   text-align: center; /* Center the text */

} .article-title { 

   font-size: 25px;
   line-height: 30px;
   letter-spacing: 1.4px;
   text-align: center;
   margin-bottom: 0!important;
   margin-top: 0 !important;
   max-width: 70%;

} .article-title a{ 

   color: black!important;
   font-size: 25px;
   line-height: 30px;
   letter-spacing: 1.4px;
   text-align: center;
   margin-bottom: 0!important;
   margin-top: 0 !important;
   max-width: 70%;

} .article-type { 

   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.4px;
   border-bottom: 1px solid black;
   margin-top: 0 !important;
   margin-bottom: 0 !important;
   padding: 5px 0 5px 0;

} .article-type a { 

   color: black;
   text-decoration: none;

} .article-type a:hover { 

   font-style: italic;
   color: black;

} .article-entity { 

   font-size: 12pt;
   line-height: 25px;
   letter-spacing: 0.4px;
   margin-top: 0 !important;

} .article-discipline { 

   font-size: 12pt;
   line-height: 25px;
   letter-spacing: 0.4px;
   margin-top: 0 !important;

} .article-subject { 

   font-size: 12pt;
   line-height: 25px;
   letter-spacing: 0.4px;
   margin-top: 0 !important;

} .article-images { 

   border-bottom: 1px solid black;
   padding-bottom: 7px;

} .article-image { 

   position: relative;

} .external-link-icon { 

   display: flex; /* Use flexbox */
   align-items: center; /* Align items vertically in the center */
   justify-content: center; /* Center the content horizontally */
   width: 20px; /* Adjust the width as needed */
   height: 20px; /* Adjust the height as needed */
   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.48px;
   color: black !important;
   text-decoration: none;

} .external-link-icon a { 

   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.48px;
   color: black !important;
   text-decoration: none;

} .external-link-icon a:hover { 

   text-decoration: underline;

} p.pdf-link-icon { 

 margin-right: 10px;

} .text-symbol { 

   color: black; /* Ensure the symbol is black */
   font-size: 15px;

}

.pdf-link-icon { 

 font-size: 17px;
 line-height: 22px;
 letter-spacing: 0.48px;
 color: black !important;
 margin-right: 25px;
 margin-left: -20px;

} .pdf-link-icon a { 

 font-size: 17px;
 line-height: 22px;
 letter-spacing: 0.48px;
 color: black !important;

} .link-pdf { 

   display: flex;
   margin-top: 5px;
   align-items: center;

}

.image-container { 

   position: relative;
   display: inline-block;

}

.image-container img { 

   display: block;
   max-width: 100%; 
   width: auto;
   height: 400px; 
   padding-bottom: 3px;

}

.arrows-and-image { 

   position: relative;
   width: fit-content;

}

.image-navigation { 

   position: relative;
   display: inline-block;

} .image-navigation:hover .prev-arrow, .image-navigation:hover .next-arrow { 

   display: block;

}


.image-navigation:hover .caption-image1, .image-navigation:hover .caption-image2, .image-navigation:hover .caption-image3, .image-navigation:hover .caption-image4, .image-navigation:hover .caption-image5, .image-navigation:hover .related-article-caption-image1, .image-navigation:hover .related-article-caption-image2, .image-navigation:hover .related-article-caption-image3, .image-navigation:hover .related-article-caption-image4, .image-navigation:hover .related-article-caption-image5 { 

   display: block;

}

.prev-arrow, .next-arrow { 

   position: absolute;
   top: 53%;
   transform: translateY(-53%);
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   user-select: none;
   font-size: 40px;
   color: white; /* Adjust color as needed */
   display: none; /* Hide arrows initially */
   z-index: 10;

}

.prev-arrow { 

   left: 10px;

}

.next-arrow { 

   right: 10px;

} .caption-line { 

   display: contents;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%,-50%);
 color: white;
 padding: 0px;
 text-align: center;
 font-size: 25px;
 line-height: 28px;
 letter-spacing: 0.4px;
 font-style: italic;
 font-weight: bold;
 max-width: 100%;
 white-space: normal;
 overflow: visible;
 text-overflow: ellipsis;
 text-shadow: 2px 2px 40px rgba(0,0,0,.8);

} .caption-image1, .caption-image2, .caption-image3, .caption-image4, .caption-image5, .related-article-caption-image1, .related-article-caption-image2, .related-article-caption-image3, .related-article-caption-image4, .related-article-caption-image5 { 

   display: none;
   caption-side: bottom;
   font-size: 15px;
   line-height: 18px;
   letter-spacing: 0.48px;

} .article-book { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;

} .article-web { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-year { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-has-url { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-has-pdf { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-internal-ref { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-external-ref { 

   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-external-reference { 

   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;
   text-indent: 35px;
   padding-bottom: 5px;

} .article-label-external-reference { 

 text-transform: uppercase;
 text-indent: 35px;
 padding-top: 5px;
 font-size: 15px;
 line-height: 23px;
 letter-spacing: 0.48px;

} .article-external-ref a { 

 padding-right: 0px !important;
 color: black !important;

} .article-external-reference a { 

   padding-right: 0px !important;
   color: black !important;

} .article-format-participation { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-setting { 

   text-transform: capitalize;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0.6px;
   margin-top: 0 !important;
   margin-bottom: 7px !important;
   border-bottom: 1px solid black;

} .article-notes { 

   font-size: 23px;
   line-height: 31px;
   letter-spacing: 1.29px;
   text-align: left;
   text-indent: 35px;
   border-bottom: 1px solid black;

} .image-container:hover .caption-image1, .image-container:hover .caption-image2, .image-container:hover .caption-image3, .image-container:hover .caption-image4, .image-container:hover .caption-image5 { 

   display: block;

}

.image-container:hover .related-article-caption-image1, .image-container:hover .related-article-caption-image2, .image-container:hover .related-article-caption-image3, .image-container:hover .related-article-caption-image4, .image-container:hover .related-article-caption-image5 { 

   display: block;

}

.article-description { 

   font-size: 23px;
   line-height: 31px;
   letter-spacing: 1.29px;
   text-align: left;
   text-indent: 35px;
   border-bottom: 1px solid black;

} .article-reflection { 

   font-size: 23px;
   line-height: 31px;
   letter-spacing: 1.29px;
   text-align: left;
   text-indent: 35px;
   margin-top: 0 !important;
   border-bottom: 1px solid black;
   padding-bottom: 5px;

} .article-quote { 

   font-size: 30px;
   line-height: 31px;
   letter-spacing: 1.5px;
   font-style: italic;
   text-align: left;
   text-indent: 35px;
   margin-top: 0 !important;
   border-bottom: 1px solid black;
   padding-bottom: 5px;

}

.article-modification-date { 

   color: grey;
   text-align: left;
   text-indent: 10px;
   margin-top: 0 !important;
   display: inline-block;
   padding-bottom: 5px;
   font-size: 15px;
   line-height: 23px;
   letter-spacing: 0.48px;

}

  1. related-articles {
   margin-top: 0px;
   /*margin-left: 36px;*/
   margin-left: 4.6%;
   padding-bottom: 80px;
   padding-top: 100px;

} .related-articles-label { 

   text-transform: uppercase;
   margin-bottom: 0 !important;
   text-indent: 35px;

} .related-articles-container { 

   display: flex;
   flex-wrap: wrap;
   gap: 0; /* No gap between articles */

} .related-article { 

   width: calc(50% - 0px); /* Adjusted width */
   box-sizing: border-box;
   border: 1px solid black;
   height: fit-content;
   padding: 3px 10px 6px 10px;
   margin-bottom: 30px;
   font-size: 19px;
   line-height: 26px;
   letter-spacing: 0.95px;
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   background-color: #FAFAFA;

}

.related-article:not(:first-child) { 

   margin-left: -1px;

}

.related-article:nth-child(2n + 1) { 

   margin-left: 0;

}

.related-article:last-child { 

   margin-right: 0;

} .related-article-entry-number { 

   padding-bottom: 3px;

} .related-article-people { 

   text-decoration: underline;
   border-top: 1px solid black;
   line-height: 23px!important;
   padding-top: 6px;

} .related-article-people a { 

   color: black;
   text-decoration: underline;

} .related-article a:hover { 

   font-style: italic;
   color: black;

} .related-article-title {

} .related-article-type { 

   border-top: 1px solid black;

}

.related-article-type a { 

   color: black;
   text-decoration: none;

} .related-article-type a:hover { 

   font-style: italic;
   color: black;

}

  1. close-button {
   float: right; 
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto; 
   padding: 5px 0 0 0;
   font-size: 20px;
   line-height: 24px;
   letter-spacing: 0px;

} .fade-out { 

   position: absolute;
   width: 100%;
   height: 100%;
   background: #FAFAFA;
   opacity: 0.4;
   z-index: 999;

}

/* -----END<------ POP UP ARTICLE */


/* ----->START------ EVENT HOMEPAGE */

  1. show-event-wrapper {
   display: block;
   position: fixed; /* Change to fixed */
   top: 0;
   /*right: 24px;*/
   right: 1.3%;
   width: 41%;
   height: 100vh; /* Set to full viewport height */
   overflow: auto; /* Enables scrolling if content overflows */
   scrollbar-width: none; /* Firefox */
   -ms-overflow-style: none;  /* Internet Explorer 10+ */
   z-index: 9999; /* Ensure it's above #list */
   /*padding-left: 100px;*/
   margin-top: 50px;

}

  1. show-event {
   background-color: #FAFAFA;
   border: 3px solid;
   padding: 0px 10px 0 10px;
   position: relative;
   top: 40px;
   /*margin-left: 36px;*/
   margin-left: 4.6%;

} .event-entry-number { 

   border-bottom: 1px solid black;
   font-size: 19px;
   line-height: 23px;
   letter-spacing: 0px;
   padding-bottom: 5px;
   padding-top: 7px;

} .event-people { 

   font-size: 25px;
   line-height: 30px;
   letter-spacing: 1.4px;
   text-decoration: underline;
   text-align: center;
   padding-top: 15px;
   margin-bottom: 5px !important;

} .event-people a { 

   color: black;
   text-decoration: underline;

} .event-title-link { 

   border-bottom: 1px solid black;
   padding-bottom: 10px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   text-align: center;

} .event-title { 

   font-size: 25px;
   line-height: 30px;
   letter-spacing: 1.4px;
   text-align: center;
   margin-bottom: 0 !important;
   margin-top: 0 !important;
   max-width: 70%;

} .event-link { 

   display: flex;
   margin-top: 5px;
   align-items: center;

}

/* -----END<------ EVENT HOMEPAGE */

/* ----->START------ FOOTER and SEARCH */

  1. view-more-footer {
   display: none;

} .footer { 

 position: fixed;
 left: 0;
 bottom: 0;
 width: 100%;
 box-sizing: border-box;
 z-index: 11;
 background: transparent linear-gradient(180deg, #FFF0 0%, rgba(250, 250, 250, 0.97) 80%) 0% 0% no-repeat padding-box;
 padding-bottom: 1%;
 padding-top: 100px;
 padding-left: 1.3%;
 padding-right: 1.3%;
 
 display: flex;
 justify-content: flex-start; /* Aligns the buttons to the right */
 align-items: center; /* Vertically center the items */

}

.submit-container { 

   position: relative; /* Positioning context for absolute children */
   display: inline-block; /* Constrain hover area to the container */
   width: calc(20% - 0px);

}

  1. submit {
   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   color: black !important;

}

  1. submit:hover {
   color: black;
   text-decoration: underline;

} .submit-hide { 

   opacity: 0; /* Make it invisible initially */
   visibility: hidden; /* Ensure it's not interactable */
   display: none;
   background: black;
   width: 20%;
   position: absolute; /* Position relative to the parent */
   bottom: 100%; /* Position above the parent */
   left: 0; /* Align left with the parent */
   z-index: 1; /* Ensure it's above other content */
   transform: translateY(-10px); /* Slightly offset to prevent overlap */

} .submit-hide p { 

   color: white!important;
   font-size: 17px;
   line-height: 22px;
   letter-spacing: 0.37px;
   padding: 10px;

} .submit-hide p .italics { 

   color: white;
   font-style: italic;

} .submit-hide p .underline { 

   text-decoration: underline;

} .submit-container:hover .submit-hide { 

   display: block;
   opacity: 1;
   visibility: visible;
   width: auto;

}


.suggestions { 

   display: none!important;

}

.simpleSearch { 

 position: relative;
 display: inline-block;
 width: calc(20% - 0px);

}

  1. simpleSearch, #simpleSearchSpecial {
   text-align: left; 
   letter-spacing: normal;
   font-family: 'HALColant-TextRegular';
   cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"><circle cx="14" cy="14" r="4.5" fill="white" stroke="black" stroke-width="1" /></svg>') 14 14, auto;
   text-transform: uppercase;
   background: none;
   border: none;
   font-size: 17px;
   line-height: 20px;

}

/* Style footer background and gradient */

  1. simpleSearch:before, #simpleSearchSpecial:before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   z-index: -1;

}

  1. searchInput,

.closing-bracket { 

   display: none;
   border: none;

} .searchresult { 

   display: none;

}

  1. simpleSearch:hover #searchInput {
 display: inline-block;
 border-bottom: 1px solid black;
 margin-left: -9.5px;
 background: #FAFAFA;
 width: calc(75% - 20px); /* Default width */

}

/* Small screens */ @media (max-width: 600px) { 

 #simpleSearch:hover #searchInput {
   width: calc(50% - 20px);
 }

}

/* Medium screens */ @media (min-width: 601px) and (max-width: 760px) { 

 #simpleSearch:hover #searchInput {
   width: calc(50% - 20px);
 }

}

/* Medium large screens */ @media (min-width: 761px) and (max-width: 900px) { 

 #simpleSearch:hover #searchInput {
   width: calc(50% - 20px);
 }

}

/* Large screens */ @media (min-width: 901px) and (max-width: 1000px) { 

 #simpleSearch:hover #searchInput {
   width: calc(60% - 20px);
 }

}

/* Large screens */ @media (min-width: 1001px) and (max-width: 1100px) { 

 #simpleSearch:hover #searchInput {
   width: calc(65% - 20px);
 }

}

/* Large screens */ @media (min-width: 1101px) and (max-width: 1200px) { 

 #simpleSearch:hover #searchInput {
   width: calc(65% - 20px);
 }

}

/* Large screens */ @media (min-width: 1201px) and (max-width: 1300px) { 

 #simpleSearch:hover #searchInput {
   width: calc(70% - 20px);
 }

}

/* Large screens */ @media (min-width: 1301px) and (max-width: 1400px) { 

 #simpleSearch:hover #searchInput {
   width: calc(70% - 20px);
 }

}


/* Large screens */ @media (min-width: 1401px) and (max-width: 1750px) { 

 #simpleSearch:hover #searchInput {
   width: calc(75% - 20px);
 }

}

/* Large screens */ @media (min-width: 1751px) { 

 #simpleSearch:hover #searchInput {
   width: calc(80% - 20px);
 }

}



  1. simpleSearchSpecial:hover #searchInput {
   display: inline-block;
   border-bottom: 1px solid black;
   margin-left: -5px;
   background: #FAFAFA;

}

  1. simpleSearch:hover .closing-bracket, #simpleSearchSpecial:hover .closing-bracket {
   display: inline-block;

}


/* ----->END------ FOOTER and SEARCH */

/* ----->START------ AUTHORS CREATORS */ /* Styling for Authors/Creators */ .smw-columnlist-container { 

 top: 420px;
 position: relative;
 margin: 0;
 width: 100%;

}

.smw-column { 

   width: 20%!important;

} .smw-column ul li { 

   list-style: none;

} .smw-column-header { 

   font-weight:normal;
   border-bottom: 1px solid black;
   margin-right: 10px;

} .smw-column ul { 

   font-size: 16pt;
   line-height: 27px;
   letter-spacing: 0.4px;
   text-align: center;
   text-decoration: underline;

} .smw-column a { 

   color: black;

} /* ----->END------ AUTHORS CREATORS */

/* ----->START------ COMMUNITY PAGE */ /* Styling for Community */ .community-col { 

   width: calc(100% - 0px);
   box-sizing: border-box;
   height: fit-content;
   padding: 0 0 0 0;

} .community-main-text { 

   margin-top: 0 !important;
   position: relative;
   top: 400px;
   font-size: 22px;
   line-height: 25px;
   letter-spacing: 0px;

}

  1. community-list {
   -moz-column-count: 5;
   -webkit-column-count: 5;
   -ms-column-count: 5;
   column-count: 5;
   -moz-column-gap: 10px;
   -ms-column-gap: 10px;
   -webkit-column-gap: 10px;
   column-gap: 10px;
   position: relative;
   margin: 0;
   width: 100%;
   top: 430px;

}

.community-card { 

   font-size: 12px;
   line-height: 25px;
   letter-spacing: 0.4px;
   display: inline-block;
   width: 100%;
   box-sizing: border-box;
   padding: 0 0 20px 0;
   margin-bottom: -1px; /* Negative margin, same as border thickness */
   border-top: 1px solid black;
   border-bottom: 1px solid black;
   break-inside: avoid-column;
   z-index: 1; /* Ensures the card is above the bottom border of the card above */
   background: #FAFAFA; /* Assuming cards have a white background */

} /* Add margin-top to individual community pages */ .community-page { 

   position: relative;
   top: 300px;

} /* Removes top border from the first card in each column */

  1. community-list .community-card:first-of-type {
   border-top: none;

}

/* Adds top border to the very first card in the grid */

  1. community-list .community-card:first-child {
   border-top: 1px solid black;

} .community-name { 

   font-size: 25px;
   line-height: 34px;
   letter-spacing: 1.4px;
   text-align: center;
   text-decoration: underline;
   padding-top: 45px;
   padding-bottom: 45px;
   border-bottom: 1px solid black;

} .community-name a { 

 color: black !important;

} .community-name a:hover { 

 font-style: italic;

} .community-external-reference { 

   text-align: center;
   font-size: 25px;
   line-height: 34px;
   letter-spacing: 1.4px;
   border-bottom: 1px solid black;

} .community-external-reference a { 

   color: white!important;

} .community-external-reference a:hover { 

   text-decoration: none;
   font-style: italic;

}

  1. community-list div.community-external-reference a {
 color: black !important;
 text-decoration:none;

} .community-setting { 

   font-size: 15px;
   line-height: 30px;
   letter-spacing: 0.48px;
   text-transform: uppercase;
   border-bottom: 1px solid black;

} .community-location { 

   font-size: 15px;
   line-height: 30px;
   letter-spacing: 0.48px;
   text-transform: uppercase;
   border-bottom: 1px solid black;

} .community-type { 

   font-size: 15px;
   line-height: 30px;
   letter-spacing: 0.48px;
   text-transform: uppercase;
   border-bottom: 1px solid black;

} .community-domain { 

   font-size: 15px;
   line-height: 30px;
   letter-spacing: 0.48px;
   text-transform: uppercase;
   border-bottom: 1px solid black;

} .community-description p { 

   text-indent: 35px;
   font-size: 19px;
   line-height: 26px;
   letter-spacing: 0.95px;
   margin: 0 !important;

} .community-description-label { 

   text-transform: uppercase;
   text-indent: 35px;
   font-size: 15px;
   margin: 0 !important;
   line-height: 30px;

} /* ----->END------ COMMUNITY PAGE */

/* ----->START------ SEARCH PAGE */ .hidden { 

   display: none;

} .oo-ui-layout.oo-ui-fieldLayout.oo-ui-fieldLayout-align-top.oo-ui-actionFieldLayout { 

   margin-top: 420px;

} .mw-search-exists { 

   padding-bottom: 20px;
   font-size: 17px;

} .mw-search-createlink { 

   padding-bottom: 20px;
   font-size: 17px;

} .mw-search-nonefound { 

   padding-bottom: 20px;
   font-size: 17px!important;

}

  1. mw-content-text .searchresults {
   padding: 25px;

}

  1. mw-search-top-table div.oo-ui-actionFieldLayout {
 padding-left: 25px;
 padding-right: 25px;

} /* ----->END------ SEARCH PAGE */

/* ----->START------ TOOLTIP EVENT CARDS */ .tooltip-popup { 

 position: fixed;
 padding: 6px 12px;
 background-color: black;
 color: white;
 font-size: 13px;
 border-radius: 4px;
 pointer-events: none;
 opacity: 0;
 transition: opacity 0.15s ease;
 z-index: 9999;

} /* ----->END------ TOOLTIP EVENT CARDS */

Retrieved from "https://softwear.directory/index.php?title=MediaWiki:Common.css.bak&oldid=4788"