/*
    Use this stylesheet to modify the layout of your
    conference.

*/

/* * { */
/*     font-family: Verdana, sans-serif; */
/*     font-smoothing: antialiased; */
/* } */

/* ----------- Styles for the conference header ----------- */

/*
The wrapper of the whole conference page.
*/


.conf {
/*  width: 100%;*/
/*  border: none;*/
/*  margin: auto;*/
  font-family: Verdana, sans-serif;
  /*  font-size: 90%;*/
  font-size: 1em;
  color: #64696C;
/*  color: #777;*/
}

.page-content .editor-output {
    font-family: Verdana, sans-serif;
    font-smoothing: antialiased;
    font-size: 1em;
    /*    color: #777;*/
    color: #64696C
}

.conferenceDetails .description {
    font-size: 1.0em;
    margin: 1em 0 2em 0;
    color: #64696C;
}

body {
    background-color: #0D3B0D !important;
    /*#194724;*/
    font-family: Verdana, sans-serif;
/*    font-size:90%;*/
    font-color:#fafafa;
}

/*Wraps around the upper part of the conference header.*/
.confTitleBox {
color: #f5f5f5;
min-height: 90px;
border-top: none;
border-bottom: none;
background: #0D3B0D !important;
padding: 2rem 0;
}

/*
Sets the width of the upper part of the conference header.
Is set to 950px and centered by default.
*/
.confTitle {
  width: 950px;
  margin: 0 auto;
}

/*
The box containing the logo. By the default the logo is placed
on the left of the conference title.
*/

.confLogoBox {
  float: left;
  padding-right: 10px;
  background: #0D3B0D;
      /*#194724;*/
}

/*
The box containing the logo when configured in banner mode.
*/

.confLogoBannerBox img {
width: 90%;
margin-bottom: 1rem;
background: #0D3B0D;
    /*#194724; */
}

/*
The style for the title text.
*/
.conference-title-link {
  font-size: 22pt;
  display: block;
  padding: 25px 0;
  color: green;
}

span[itemprop="title"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/*
Wrapper around the bottom part of the conference header
*/

.confSubTitleBox {
    border: none;
    padding: 1.2em;
    background-color: #0D3B0D !important;
	/*#194724 !important;*/
}
/*
The content of the lower part of the header. Is by default
centered and has a fixed width.
*/
.confSubTitleContent {
    width: 100%;
    color: #ffffff !important;
    font-family: Verdana, sans-serif;
    font-size: 2em;
    margin: 0;
    align-items: center;
}

confheader {
    background: #0D3B0D !important;
}

/*
Style for links in the lower part of the header
*/
.confSubTitle a {
  font-size: 11pt;
}

/*
Styles for the date and place information.
*/
.datePlace {
  font-size: 12pt;
}

/*
Announcement styles
*/

#footer {
    border-top: none;
    background: transparent;
    position: relative;
}

.footer {
    color: #b8e6d9;
    font-size: 90%;
    position: relative;
}

/* --- Start of Minimal Modifications --- */

/* 1. CORRECTED RULE: Un-nested from .footer */
.footer a {
    color: white;
}

/* 2. MODIFIED: The original class for the CERN logo */
/* We float it left and give it a size so it appears correctly. */
.footer-logo {
    background: url(/static/custom/files/cern_small_light.svg) no-repeat center center;
    background-size: contain; /* Makes the logo fit nicely */
    display: block;
    width: 100px; /* Give it a width */
    height: 40px; /* Give it a height */
    float: left;  /* Position it on the left */
}

/* 3. CORRECTED RULE: Un-nested from .footer-logo */
.footer-logo img {
    visibility: hidden;
}

/* 
4. NEW: This is where we add your new logos.
We use the ::after pseudo-element of the .footer to create a "virtual" box.
*/
.footer::after {
    content: ""; /* This is required for the pseudo-element to exist */
    display: block;
    float: right; /* Position the new logos on the right */

    /* --- IMPORTANT: Change these values to match your combined logo image --- */
    width: 337px;  /* The TOTAL width of your combined logo image */
    height: 40px; /* The height of your combined logo image */
    background-image: url(/event/1526482/images/49327-small-footer-logos.png); /* The path to your new image */
    background-size: contain;
    background-repeat: no-repeat;
}

/* 
5. CRITICAL: The Clearfix.
This prevents the #footer from collapsing. We use the ::after
pseudo-element of the PARENT container (#footer) for this.
*/
#footer::after {
    content: "";
    display: table;
    clear: both;
}

/* --- End of Minimal Modifications --- */

/* .footer-logo { */
/*     background: url(/static/custom/files/cern_small_light.svg); */
/*     img { */
/*       visibility: hidden; */
/*     } */
/* } */

/* Or use this for alignment with footer content */
/*.footer .share-container {
  float: right;
  margin-top: 10px;
  z-index: 1000;
}*/


/* /\* Responsive: stack and center logos on smaller screens *\/ */
/* @media (max-width: 768px) { */
/*     .footer { */
/*         flex-direction: column; */
/*         gap: 1.5rem; */
/*     } */
    
/*     .footer-logos-right { */
/*         justify-content: center; */
/*         width: 100%; */
/*     } */
/* } */

/* .conferenceDetails .description strong { */
/*     color: #0D3B0D */
/*     font-weight: 600; */
/* } */

#outer {
    border: 2px solid #0D3B0D !important;
    border-radius: 8px !important;
}

#outer li a:hover {
    background-color: #0D3B0D !important;
}

#outer > li.menuConfTitle {
    background-color: #0D3B0D !important;
}

.menuConfTitle a {
    color: #0D3B0D !important;
}

.menuConfTitle.selected > a, .menuConfMiddleCell.selected > a {
    background-color: #0D3B0D !important;
    color: #ffffff !important;
}

/* div.timetableHeader { */
/*     color: #1b3a4b !important; */
/* } */

/*
.conferenceDetails .description strong {
    color: #1b3a4b !important;
}*/

/* grid container for sponsor logos
*/


.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  gap: 1rem;
  align-items: center;
  justify-items: center;
}

.grid-item {
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.grid-item img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* table format
*/
.table_component {
overflow: auto;
width: 85%;
margin-top: 1rem;
}

.table_component table {
border: none;
width: 100%;
table-layout: fixed;
border-collapse: collapse;
border-spacing: 0;
}

.table_component th {
border: none;
background-color: #eceff1;
padding: 3px;
font: Verdana, sans-serif;
/*font-size: 90%;*/
font-weight: bold;
color: #64696C;
font-smoothing: antialiased;
}

.table_component td {
border: none;
background-color: transparent;
font: Verdana, sans-serif;
/*font-size: 90%;*/
padding: 1px;
color: #64696C;
font-smoothing: antialiased;
}

/*
Announcement styles
*/
.simpleTextAnnouncement {
  background: #f5faff url(/images/conf/sprites_blue.png) repeat-x scroll 0 -400px;
  border-top: 1px solid #c2d6e7;
  font-family: Verdana, sans-serif;
  font-weight: bold;
  font-size: 10pt;
  text-align: center;
  color: #0f283d;
  padding: 8px 0;
}

/* ----------- Styles for the main content ----------- */

/*
The wrapper around the menu and the page content.
By default centered with a fix width.
*/

/* default full width of screen */
/*#confSectionsBox {
  width: 950px;
  margin: 0 auto;
  margin-top: 30px;
}*/

#confSectionsBox {
    /*    width: auto;*/
/*    width: 950px;*/
    width: 1050px;
    background: #fff;
    margin: 0 auto;
    margin-top: 30px;
    padding: 50px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

#outer {
    background: #f6f6f6;
    border: 1px solid #0D3B0D !important;
    border-radius: 8px;
    overflow: hidden;
}

#outer li a {
    font-family: Verdana, sans-serif;
    color: #0D3B0D ;
/*    font-size: 1.1em;*/
    font-size: 10pt;
    background-color: #f8f9fa;
}

#outer li a:hover {
    background-color: #0D3B0D !important;
    color: #ffffff !important;
}

.menuConfTitle a {
    color: #0D3B0D;
/*    color: #1e4d40;*/
    padding: 7px 12px;
}

.menuConfSelected {
    border-top: none !important;
    border-bottom: none !important;
}

.menuConfTitle.selected > a, .menuConfMiddleCell.selected > a {
    background-color: #0D3B0D; 
    color: #ffffff !important;
/*    color: #ffffff !important;*/
}


div.timetableHeader {
    color: #0D3B0D ;
    /*#1e4d40;*/
    font-size: 2em;
    font-family: Verdana, sans-serif;
    background: none;
}
/*#confSectionsBox {
  width: 950px;
  margin: 0 auto;
  margin-top: 30px;
}*/

/* ----------- Styles for the menu ----------- */

/* Styles for all menu Items */

/*
Wrapper around the menu
*/
.conf_leftMenu {
  float: left;
  width: 200px;
}

/*
sub menu item
*/
li ul.inner li a {
  padding: 3px 12px 3px 30px;
  background: transparent url(/images/conf/left_menu_bullet.png) scroll no-repeat 15px center;
}

/*
Support box
*/

.support_box {
  background: #f6f6f6;
  border: 1px solid #0D3B0D;
  font-family: Verdana, sans-serif;
  font-size:10pt
}

.support_box > h3 {
  color: #f3f3f3 ;
  background: #0D3B0D;
  font-family: Verdana, sans-serif;
  font-size:10pt
	    /*#1a64a0;*/
}

/* ----------- Styles for the page content ----------- */

/*
Wrapper around the content
*/
.confBodyBox {
  margin-left: 240px;
}

/* ===== More customizations =====  */
.timezone {
    display: none;
}

#event-search-box input.prompt {
    border-radius: 8px !important;
}

.support_box {
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid #0D3B0D !important;
    font-family: Verdana, sans-serif;
}

.support_box h3 {
    background-color: #0D3B0D;
    font-family: Verdana, sans-serif;
    padding: 7px 12px;
    margin: 0 !important;
    font-size: 1rem;
}

.support_box > ul {
    padding: 7px 12px !important;
}

.support_box > ul > li {
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: .5em;
}

.action-box {
    border-radius: 8px;
}

.action-box a.i-button, .action-box button.i-button {
    border-radius: 8px;
}

/* ul { */
/* /\*    list-style-type: none !important;*\/ */
/*     margin: 5px !important; */
/*     font-size: 90%; */
/* } */

/* li { */
/*     margin: 1.5px !important; */
/* } */

/*
    Use this stylesheet to modify the layout of your
    conference.

*/