@import url("w3.css");
/* Including one css file into other */


/* styling the schedules */
tbody#event_schedule tr:nth-child(even) {
  background-color: #F0C2C6;
  color: black;
}

th#event_schedule_leader {
	background-color: #D1272E;
	color: white;
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
	font-size: 24px;
	font-weight: bold;
}


/* switch off the membership payment list-item
if the user is already a member */
div#field_already_a_SCSC_member:has(option[value="1"]) + div#field_SCSC_membership {
	display: none;
}

/* sort a bug when adding documents via CMS Content from eDocman.
It was hard to see the top level categories */
#jform_articletext_editors-xtd_edocman_modal > div > div > div.modal-body.jviewport-height70 {
	height: 700px;
}

h2 {
    font-size: 25px;
}

h4 {
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
	font-weight: bold;
}

h5 {
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
	font-style: italic;
}

.item-pagetest h1{
	text-align: center;
	font-size: 36px;
	color: #D1272E;
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
	font-weight: bold;
}


/* for the new custom position bottom-c 
   this portion is copied from template.css and basically adds bot-c to the grids
   and duplicate the styling for container-bottom-b */

@supports (display: grid) {
  .site-grid {
    display: grid;
    grid-template-areas: ". banner banner banner banner ." ". top-a top-a top-a top-a ." ". top-b top-b top-b top-b ." ". comp comp comp comp ." ". side-r side-r side-r side-r ." ". side-l side-l side-l side-l ." ". bot-a bot-a bot-a bot-a ." ". bot-b bot-b bot-b bot-b ." ". bot-c bot-c bot-c bot-c .";
    grid-template-columns: [full-start] minmax(0, 1fr) [main-start] repeat(4, minmax(0, 19.875rem)) [main-end] minmax(0, 1fr) [full-end];
    grid-gap: 0 1em;
  }
  .site-grid > [class^=container-],
  .site-grid > [class*=" container-"] {
    width: 100%;
    max-width: none;
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
  }
  .site-grid > .full-width {
    grid-column: full-start/full-end;
  }
  @media (min-width: 992px) {
    .site-grid {
      grid-template-areas: ". banner banner banner banner ." ". top-a top-a top-a top-a ." ". top-b top-b top-b top-b ." ". side-l comp comp side-r ." ". bot-a bot-a bot-a bot-a ." ". bot-b bot-b bot-b bot-b ." ". bot-c bot-c bot-c bot-c .";
    }
  }
}

.container-bottom-c {
  position: relative;
}

.container-bottom-c > * {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin: 0.5em 0;
}

@media (max-width: 991.98px) {
  .container-bottom-c {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }

  .container-bottom-c > * {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
  }
}

.container-bottom-c {
  grid-area: bot-c;
}

/* end of bottom-c */


/* SCSC styles */

/* make the menu diamond nearer the menu text */
#navbar1 > ul > li.metismenu-item.level-1.deeper.parent > a {
padding: 0px !important; 
} 

 
 /* to convert text into link without the underline
  and changes in colour when hovering */
a.undecoratedlink, a.undecoratedlink:hover {
    text-decoration: none !important;
    color: white !important;
    background-color: #D1272E !important;
}

/* Forum styles */
.forum-title {
	text-align: center;
	font-size: 36px;
	color: #D1272E;
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
	font-weight: bold;
}

.forum-create-post {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

.breaking-news-header {
	color: #D1272E;
	font-size: 36px;
	font-weight: bold;
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
}

.newsflash-title{
	font-weight: normal;
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
}

.microsite {
  background: rgb(243, 243, 243, .1);
}


/* limit what can be done through the TinyMCE editor. 
   Mainly done to make the Working Group Leads interactions simpler
*/


/* hide the Content, Publication and Metadata menu options */
div[role="tablist"] > button[aria-controls="publishing"] {
  display: none !important;
} 

div[role="tablist"] > button[aria-controls="metadata"] {
  display: none !important;
} 

/* hide additional tabs when creating a simple WG event */
div[role="tablist"] > button[aria-controls="group-registration-rates-page"] {
  display: none !important;
}
div[role="tablist"] > button[aria-controls="misc-page"] {
  display: none !important;
}
div[role="tablist"] > button[aria-controls="discount-page"] {
  display: none !important;
}

/* next three hide the alias editing aspects - this is automatic
   based on title and doesn't allow duplicates
*/

label[id="jform_alias-lbl"] {
  display: none !important;
}

input[name="jform[alias]"] {
    display: none !important;
}

div#jform_alias-desc {
    display: none !important;
}

/* Hide CMS Content menu options
   that we don't want WG Leads to use
*/

div[title="Article"] {display: none !important;}
div[title="Code"] {display: none !important;}
div[title="Field"] {display: none !important;}
div[title="Contact"] {display: none !important;}
div[title="Menu"] {display: none !important;}
div[title="Module"] {display: none !important;}
div[title="Source code+"] {display: none !important;}

/* end of hides for article editing */

/* hide the My Subscriptions tab in Edit Profile as Corporate membership plans links
   were broken */
 button[aria-controls="my-subscriptions-page"] {display: none !important;}  
   

/* logout button on right of screen not left */
.com-users-logout__submit {
  float: right;
}


/* This give articles a trailing border
   so it is easier to distinguish them - but superseded by the blog-item settings
   
.com-content-article, .com-content-category-blog__item {
 border-bottom: 15px;
 border-bottom-style: outset;
 border-bottom-color: #FFB6C130;
}

*/

/* make individual blog entries more distinctive */
.blog-item {
  display: inline;
  background-color: #fcfbf4;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 8px;
}

/* add a little bit of text paddding around the blog entry */
.item-content {
      padding: 20px;
}

/* Following for floating images and text on the main spash banner images */
/* Top left text */
.top-left {
  position: absolute;
  width: 35%;
  top: 20px;
  left: 20px;
}

/* Bottom left text */
.bottom-left-text {
  position: absolute;
  max-width: 40%;
  bottom: 40px;
  left: 20px;
}

/* for zooming images on hover */
.zoom {
  transition: transform 4s; /* Animation */
}

.zoom:hover {
  transform: scale(1.1); 
}



.card {
  border: none;
 /* background: #E0E0E0; opacity was .3 before */
  background: rgb(243, 243, 243, .5);
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.memnag {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 70%;
  background: rgb(243, 243, 243, .5);
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
  font-size: 125%; 
  }

.border {
  border: none;
}

.border-light {
  border: none !important;
}

.py-1 {
  border-color: red !important;
    background-color: white;
}

.col-md-12 {

  margin-left: 10px;

}

.lm_content_wrapper {
  border: none!important; 
}

html {
        scroll-behavior: smooth;
        scroll-padding: 5rem;
}

/* the new SCSC web fonts and colour palette */
/* red has been changed to match the logo red #D1272E was #D1272E */
.new-scsc-background-white {background-color: white;}
.new-scsc-background-red {background-color: #D1272E;}
.new-scsc-background-pink {background-color: #F0C2C6;}
.new-scsc-background-green {background-color: #5EAF2F; padding: 10px; opacity: 0.85;}
.new-scsc-background-purple {background-color: #71378C;}
.new-scsc-blue {color: #000CC5;}
.new-scsc-red {color: #D1272E;}
.new-scsc-white {color: white;}
.new-scsc-black {color: black;}
.new-scsc-font-title {font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;}
.new-scsc-font-footer-title {font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial; font-weight: bold;}
.new-scsc-font-body {font-family: "Source Sans Pro", Tahoma, Verdana, Arial;}
.cookie-background {
	
	border-width:3px; 
	border-style:solid; 
	border-color:#FF0000; 
	padding: 0.2em;
	background: rgb(243, 243, 243, .5);
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}



.boxlinks:link {color: #ffffff; !important;}
.boxlinks:hover {color: #ffffff; text-decoration-line: underline;}

.new-scsc-event {width: 100px;}

.signup-banner {
  height: 80px; 
  display: flex; 
  align-items: center; 
  justify-content: center;
  font-size: 24px;
  padding: 5px;
}

.signup-banner > a, .signup-banner > a:visited, .signup-banner > a.active {
  color: white !important;
  font-size: 24px; 
}

/* for the SmartSearch module */
.js-finder-searchform {
    background-color: #D1272E;
    text-align: left;
    position: fixed;
    overflow: hidden;
    z-index: 100;
    left: 10%;
    top: 10px;
   }

/* floating panel for the social media icons */
    .panelfloat {
     position: fixed;
     overflow: hidden;
     z-index: 100;
     right: 30px;
     top: 10px !important;
 }

/* floating panel for the top section which moves when scrolling */
.panelfloatbanner {
  position: fixed;
  overflow: hidden;
  top: 0px !important;
  width:100%;
  z-index: 0 !important;
  height:60px;

}

/* modifications to w3.css styles */
h1 {margin-bottom: 0px}
h2 {color: #cb2c39}

.container-header {
  background-color: #D1272E;
  background-image: none;
}

.container-footer {
    background-color: #D1272E;
    background-image: none;
}

.container-topbar {
    background-color: #cb2c39;
    background-image: none;
}

/* Menu text white*/
.container-header .mod-menu {
    color: white;
}

/* We add padding and radius so that on hover there is a nice background */
.container-header .mod-menu a {
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px; 
    padding: 3px 15px;
     color: #0088cc;
}

/* On hover there should be a green background */
.container-header .mod-menu a:hover {
    background-color: #5EAF2F;
    color:#ffffff !important;
}

/* but not for table anchors (primarily for schedule icons) - make invisible through opacity = 0 */
#event_schedule > tr > td > a:hover {
    background-color: rgba(255, 255, 255, 0);
}

/* subtle scaling when hovering over a schedule resource icon */
#event_schedule > tr > td > a > img:hover {
	 transition: transform 3s; 
	 transform: scale(1.2);
}

/* remove hover effects */
.no-style {
  text-decoration: none;
  color: inherit; 
  border: none;        
  outline: none;
}

.splash_container > img:hover {
	
}

/* We need to change the color of the Hamburger Menu because white on white is not good */
.container-header .navbar-toggler {
    color: #0088cc;
    border: 1px solid #0088cc;
}

/* button colours for forums etc */
.btn-primary {
  background-color: #cb2c39;
  color: white !important;
}

/* hover over buttons should change colour to green */
.btn-primary:hover {
  background-color: #5EAF2F;
  color: white !important;
}

/* centre images for the publications pages*/
/* this was called .center but clashed with Event Booking 
   so renamed to centerpub but not sure if it is used now? */
.centerpub{
  display: block;
  margin: auto;
 width: 100px;
}

/* circle round author profile images */
.auth-img  {
 max-width: 7em;
  border-radius: 50%;
}

/* management of the footer into a grid */
.footer-grid-container {
  display: grid;
  width: 100%;
  grid-template-columns: auto auto auto;
}

.footer-grid-container > div {
  text-align: left;
  padding: 2px 2px; 
  font-size: 12px;
}


.footer-grid-container > div > a:link, .footer-grid-container > div > a:visited {
  color: white !important; text-decoration: underline;
}

.footer-grid-container > div > p > a:link, .footer-grid-container > div > p > a:visited {
  color: white !important; text-decoration: underline;
}

.footer-longrow {
  grid-column-start: 1;
  grid-column-end: 4;
}

/* Programme grid container */

.prog-grid-container {
  display: grid;
  width: 100%;
  grid-template-columns: 30% auto auto auto;
}

.prog-grid-container-full {
  display: grid;
  width: 100%;
  grid-template-columns: 15% auto 40% 5% 5% 5%;
}

.prog-grid-container > div {
  text-align: left;
  padding: 2px 2px; 
   height: auto; 
}

.prog-grid-container-full > div {
  text-align: left;
  padding: 2px 2px; 
   height: auto; 
}


.prog-grid-container > div > a:link, .prog-grid-container > div > a:visited {
  color: #D1272E !important; text-decoration: underline;
}

.prog-grid-container > div > p > a:link, .prog-grid-container > div > p > a:visited {
  color: #D1272E !important; text-decoration: underline;
}

.prog-grid-container-full > div > a:link, .prog-grid-container > div > a:visited {
  color: #D1272E !important; text-decoration: underline;
}

.prog-grid-container-full > div > p > a:link, .prog-grid-container > div > p > a:visited {
  color: #D1272E !important; text-decoration: underline;
}


.prog-title {
	grid-column-start: 1;
	grid-column-end: 5;
	background-color: #D1272E;
	color: white;
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
	font-size: 24px;
	font-weight: bold;
}

.prog-title-full {
	grid-column-start: 1;
	grid-column-end: 7;
	background-color: #D1272E;
	color: white;
	font-family: "Franklin Gothic Demi", Tahoma, Verdana, Arial;
	font-size: 24px;
	font-weight: bold;
}

.pink-row {
	grid-column-start: 1;
	grid-column-end: 5;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
}

.pink-row-full {
	grid-column-start: 1;
	grid-column-end: 7;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
	font-weight: bold;
}

.pink-c1 {
	grid-column-start: 1;
	grid-column-end: 2;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
	font-weight: bold;
}
.pink-c2 {
	grid-column-start: 2;
	grid-column-end: 3;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
}

.pink-c3 {
	grid-column-start: 3;
	grid-column-end: 4;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
}
.pink-c4 {
	grid-column-start: 4;
	grid-column-end: 5;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
}

.pink-c5 {
	grid-column-start: 5;
	grid-column-end: 6;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
}

.pink-c6 {
	grid-column-start: 6;
	grid-column-end: 7;
	background-color: #F0C2C6;
	color: black;
	height: 30px;
}


.white-c1 {
	grid-column-start: 1;
	grid-column-end: 2;
	color: black;
	height: 30px;
	font-weight: bold;
}
.white-c2 {
	grid-column-start: 2;
	grid-column-end: 3;
	color: black;
	height: 30px;
}

.white-c3 {
	grid-column-start: 3;
	grid-column-end: 4;
	color: black;
	height: 30px;
}

.white-c4 {
	grid-column-start: 4;
	grid-column-end: 5;
	color: black;
	height: 30px;
}

.white-c5 {
	grid-column-start: 5;
	grid-column-end: 6;
	color: black;
	height: 30px;
}

.white-c6 {
	grid-column-start: 6;
	grid-column-end: 7;
	color: black;
	height: 30px;
}

.white-row {
	grid-column-start: 1;
	grid-column-end: 5;
	color: black;
	height: 30px;
}	

.white-row-full {
	grid-column-start: 1;
	grid-column-end: 7;
	color: black;
	height: 30px;
	font-weight: bold;
}


/* End of Programme grid */


.pending_res_table, .pending_res_table th, .pending_res_table td {
    border: 1px solid black;
    border-collapse: collapse;
}



/* this is to hide the profile edit block when editing core Joomla profile */
/* we don't use this as Membership Pro will manage our profile so we only use it to maintain WG membership */
.com-users-profile__edit > form > fieldset:first-of-type {
  display: none;
  visibility: hidden;
}

/* hide the preamble entry box. We are repurposing a field so we can show some
   instructive text. */
.form-control#jform_com_fields_wg_preamble {
  display: none;
}

/* this hides the Action Log Notify option when a Super User. This seems to 
   appear in the Edit Profile section otherwise */
fieldset:has(>div > div > label#jform_actionlogs_actionlogsNotify-lbl) {
  display: none;
}

/* Printing specific layouts */
@media print {
	
	* {
		font-size: 95% !important;
	}
	
	
	
  /* All your print styles go here */
p.panelfloat, header, i._access-icon, a.btn, footer,  div.com-content-category-blog__navigation {
    display: none !important;
  }
  
div.lm_list_wrapper > div > div.col-12.lm_position.lm_position-top.overflow-auto.py-1.d-table,
div.lm_list_wrapper > div > div.col-12.lm_position.lm_position-bottom.overflow-auto.py-1.d-table  {
      display: none !important;
  }
  
}

/* for the featured video iframe and to make it responsive */
.featured_video_iframe {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}


/* playing with table formats from Gemini */
/* Container styling */
.table-container {
  perspective: 1000px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  padding: 20px;
  background-color: #f0f2f5;
}

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 12px; /* This creates the "banded" gap */
}

th {
  font-size: 0.85rem;
  letter-spacing: 1px;
  color: #666;
  padding: 10px 20px;
  text-align: left;
}

/* The 3D Banded Row */
tbody tr {
  background: linear-gradient(180deg, #ffffff 0%, #f9f9f9 100%);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

tbody td {
  padding: 15px 20px;
  border-top: 1px solid #fff; /* Highlight on top edge */
  border-bottom: 1px solid #ddd; /* Lowlight on bottom edge */
  
  /* Shadow to create depth */
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 
              0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Rounding the corners of the bands */
tbody td:first-child {
  border-radius: 8px 0 0 8px;
}

tbody td:last-child {
  border-radius: 0 8px 8px 0;
}

/* Hover Interaction: The "Pop" effect */
tbody tr:hover {
  transform: translateY(-4px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
  z-index: 10;
}

/* Adding a color accent to the first column */
tbody td:first-child {
  border-left: 10px solid #4a90e2;
}



/* Gemini styling for detail fields */
/* Base Container Styling */
  details {
    margin-bottom: 10px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
  }

  /* Main Button Style (The Summary) */
  summary {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    background-color: #007BFF;
    color: white;
    font-weight: 600;
    cursor: pointer;
    list-style: none; /* Removes default arrow */
    border-radius: 8px;
    transition: background-color 0.2s ease;
  }

  /* Custom Arrow Indicator */
  summary::before {
    content: '▶';
    margin-right: 12px;
    font-size: 0.8em;
    transition: transform 0.2s ease;
  }

  /* Rotate arrow and change color when open */
  details[open] > summary {
    background-color: #0056b3;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  details[open] > summary::before {
    transform: rotate(90deg);
  }

  summary:hover {
    background-color: #0069d9;
  }

  /* Content Area Styling */
  .content-panel {
    padding: 15px;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-top: none;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
  }

  /* Nested "Stream" Button Styling */
  .nested-details {
    margin-top: 8px;
  }

  .nested-details summary {
    background-color: #6c757d;
    font-size: 0.95em;
    padding: 10px 15px;
  }

  .nested-details[open] > summary {
    background-color: #495057;
  }



/* Gemini styling for responsive schedule tables */
/* This wrapper allows the table to scroll horizontally on small screens */
  .table-container {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1rem;
  }

  /* Basic styling for a clean, professional look */
  #schedule {
    width: 100%;
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 14px;
    min-width: 600px; /* Prevents squishing */
  }

  #schedule th, #schedule td {
    border: 1px solid #ddd;
    padding: 12px 8px;
    vertical-align: top;
  }

  #schedule th {
    background-color: #f8f9fa;
  }

  /* --- ICON STYLING --- */
  
  /* Center the content of the icon columns (the last 3) */
  #schedule td:nth-last-child(-n+3) {
    text-align: center;
    vertical-align: middle; /* Center vertically for better look */
  }

  /* Target the <img> inside the link <a> */
  #schedule td a img {
    display: block; /* Helps with centering */
    margin: 0 auto; /* Horizontally center */
    
    /* MODIFIED: Increased icon size */
    max-width: 48px; /* Was 24px - Adjust this value as needed */
    height: auto;
    
    /* Adds spacing if icons stack on tiny screens */
    padding: 2px 0; 
  }
  
  /* Reset fixed heights for mobile flexibility */
  #schedule tr {
    height: auto !important;
  }
  
  /* end Gemini */





/* This for the CrossRef Form Styling */

        .form-box h3 {
            margin-top: 0;
            text-decoration: underline;
        }
 
        .checkbox-group label {
            margin-left: 5px;
        }
		
		.form-box { 
        border: 1px solid #dee2e6; 
        padding: 20px; 
        border-radius: 8px; 
        height: 100%; 
        background-color: #fcfcfc; 
    }

    .section-header { border-bottom: 2px solid #0d6efd; padding-bottom: 5px; margin-bottom: 15px; font-weight: bold; }
	
	/* END CrossRef Form */








/* the following was imported from the old website css */

/* colours */
.scsc-red{background-color: #cb2c39;}
.scsc-text-red{color: #cb2c39;}

.scsc-pale-red{background-color: #ffeeee;}
.scsc-light-red{background-color: #ee7777;}
.scsc-text-pale-red{color: #ffeeee;}

/* colours for single .scsc-col-x selectors */
.scsc-col-b{background-color: white;}
.scsc-col-bS{background-color: #cb2c39;}
.scsc-col-bs{background-color: #ee7777;}
.scsc-col-bR{background-color: #ee7777;}
.scsc-col-br{background-color: #fff6f6;}
.scsc-col-bG{background-color: #77ee77;}
.scsc-col-bg{background-color: #eeffee;}
.scsc-col-bB{background-color: #7777ff;}
.scsc-col-bb{background-color: #eeeeff;}
.scsc-col-bY{background-color: #ffff77;}
.scsc-col-by{background-color: #ffffcc;}
.scsc-col-bO{background-color: #ffb833;}
.scsc-col-bo{background-color: #fff1d9;}
.scsc-col-bW{background-color: #dddddd;}
.scsc-col-bw{background-color: #eeeeee;}
.scsc-col-t{color: black;}
.scsc-col-tS{color: #cb2c39;}
.scsc-col-ts{color: #ee7777;}
.scsc-col-tR{color: #cb2c39;}
.scsc-col-tr{color: #ee7777;}
.scsc-col-tG{color: #22dd22;}
.scsc-col-tg{color: #44dd44;}
.scsc-col-tB{color: #2222dd;}
.scsc-col-tb{color: #4444dd;}
.scsc-col-tY{color: #bbbb22;}
.scsc-col-ty{color: #dddd44;}
.scsc-col-tO{color: #cc5800;}
.scsc-col-to{color: #ffa500;}
.scsc-col-tW{color: #444444;}
.scsc-col-tw{color: #777777;}


.scsc-rightbar{font-weight:bold; border-right: 20px solid #cb2c39;}
.scsc-leftbar{border-left: 10px solid #cb2c39;}
.scsc-flag{margin: 16px 0px; padding: 8px 0px; background-color: white!important;}
.scsc-title-padding{padding: 8px 16px 8px 24px;}

.scsc-editbar{border-left:6px solid #4444dd}

.scsc-alert-1{color: black; border-left: 5px solid #cb2c39; padding-left: 5px; background-color: #ffeeee;}
.scsc-alert-2{color: black; border-left: 5px solid #ffe500; padding-left: 5px; background-color: #ffffcc;}
.scsc-alert-3{color: black; border-left: 5px solid #44dd44; padding-left: 5px; background-color: #eeffee;}
.scsc-alert-4{color: black; border-left: 5px solid #2196f3; padding-left: 5px; background-color: #eeeeff;}

.scsc-padding-small{padding: 4px 16px !important;}
.scsc-padding-menu-block{padding: 0px 32px 0px 16px !important;}
.scsc-padding-menu-item{padding: 12px 8px 4px 0px !important; white-space: nowrap !important;}
.scsc-padding-very-small{padding: 2px 16px 2px 0px !important;}
.scsc-drop-item{padding: 8px 2px !important;}
.scsc-bar-item{margin: 8px 0px; padding: 8px 5px !important; border-radius: 8px;}

.slide-button {height:13px; width:13px; padding:0px; cursor:pointer}

/* Default link settings */


/* More custom tweaks PH */
a:link, a:visited {color: #cb2c39; text-decoration: underline;}



/* 
a:link, a:visited {text-decoration: none;}
*/

/* END PH */

/* changed all hover backgrounds to green:#5EAF2F */

a:hover {background: #5EAF2F;  border-radius: 4px;}
.scsc-link a:link, .scsc-link a:visited {background: #ffeeee; border-radius: 4px;}
.scsc-link a:hover {background: #5EAF2F; border-radius: 4px;}
.scsc-link-hov:hover {background: #5EAF2F; border-radius: 4px;}

/* Main button settings */
.scsc-button {background: #ffeeee; border-radius: 4px;}
.scsc-button-sel {background: #ee7777; border-radius: 4px;}
.scsc-button:hover {background: #5EAF2F; border-radius: 4px;}

/* email style */
.scsc-email a:link, .scsc-email a:visited {color: #cb2c39; text-decoration: underline;}
.scsc-email {max-width: 600px; margin: auto;}

/* Tab menu styles */
.tab-selected {background: #ee7777; border-radius: 4px; padding: 0px 8px !important; }
.tab-unselected {background: #ffeeee; border-radius: 4px; padding: 0px 8px !important;}

/* Pages display controls */
a.page-link:link, a.page-link:visited {text-decoration: none;}
a.page-link:hover {background: #5EAF2F; border-radius: 8px;}

/* caret display controls */
.scsc-caret {border-radius: 8px; cursor: pointer; padding: 2px; text-decoration: none;}
.scsc-caret:hover {background-color: #5EAF2F !important;}

/* Events listing styles */
.event-title {color: #cb2c39; font-size: 1.1em; font-weight: bold;}
.event-desc {font-size: 0.8em; font-style: italic;}
a.event-link:link, a.event-link:visited {text-decoration: none;}
xa.event-link:hover {background: #5EAF2F; border-radius: 8px;}

/* News listing styles */
.news-title {color: #cb2c39; font-size: 1.1em; font-weight: bold;}
.news-desc {font-size: 0.8em;}
.news-desc-edit {font-size: 0.9em; border: 1px solid #dddddd;}

/* Messages listing styles */
.mess-title {color: #cb2c39; font-size: 1.1em; font-weight: bold;}
.mess-desc {font-size: 0.8em;}
.mess-desc-edit {font-size: 0.9em; border: 1px solid #dddddd;}
.mess-comment {font-size: 0.7em; color: #777777;}

/* Publications listing styles */
.pubs-title {color: #cb2c39; text-align:center; font-size: 1.1em; font-weight: bold;}
.pubs-desc {font-size: 0.8em; font-style: italic;}
a.pubs-link:link, a.event-link:visited {text-decoration: none;}
a.pubs-link:hover {background: #5EAF2F; border-radius: 8px;}

/* Resource listing styles */
.res-hits {font-size: 0.8em;}

/* Tooltip container */
.tooltip { position: relative; display: inline-block;}
menu
/* Tooltip text */
.tooltip .tooltip-text {visibility: hidden; width: 300px; background-color: black; color: #fff; text-align: center; padding: 5px 0; border-radius: 6px;}
.tooltip .tooltip-left {position: absolute; z-index: 1; top: -5px; right: 105%;}
.tooltip:hover .tooltip-text {visibility: visible;}

/* table */
.scsc-table {width: 100%; border-collapse: collapse; border-spacing: 0;}
.scsc-table td {padding: 1px 2px;}
.scsc-table tr:nth-child(odd) {filter: brightness(90%); }

/* Animations */
.scsc-spin {transition-duration: 0.8s; transition-property: transform; }
.scsc-spin:hover {transform: rotate(24deg); }

/* SSS'26 promo boxes */

.container-promo {
  display: flex;
  gap: 20px;
  padding: 20px;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.promo-text-box {
  flex: 1;
  min-width: 150px;
  padding: 30px 20px;
  border-radius: 8px;
  color: white;
  font-family: Arial, sans-serif;
  text-align: center;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.promo-box-1 {
  background-color: #CC1010;
}

.promo-box-2 {
  background-color: #5EAF2F;
}

.promo-box-3 {
  background-color: #71378C;
  color: #ffffff;
}

.promo-box-4 {
  background-color: #DB6D2F;
  color: #ffffff;
}

.promo-box-5 {
  background-color: #0758DB;
  color: #ffffff;
}
/* END SCSC styles */