/*Layouts css goes here*/
a.news-headline {
  font-size:18px;
  color: #00b2ab;
  line-height: 1.6; 
  margin: 10px 0;
  font-weight: 700;
}

.subtitle {
  font-size:14px;
  font-weight:400;
  margin: 10px 0;
}

.news-headline {
  line-height: normal;
}

.large-card {
    width: 100%;
    border: 1px solid #d5d5d5;
    margin-bottom: 10px;
}

.inline {
    display: block;
    font-size: 13px;
    margin-top: 10px;
    line-height: 1.2em;
}

.inline span.author {
    letter-spacing: 1px;
    margin-right: 10px;
    padding: 0;
    color: #8f2a27;
}
.text-uppercase {
    text-transform: uppercase;
}
.large-card .text {
    padding: 8px 15px;
}
.large-card .image-container, .small-card .image-container {
    height: 189px;
    overflow: hidden;
    position: relative;
}

.large-card img, .large-horizontal-card img, .small-card img {
    height: auto;
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.b-lazy {
    -webkit-transition: opacity 500ms ease-in-out;
    transition: opacity 500ms ease-in-out;
    max-width: 100%;
    opacity: 0;
}

.b-loaded {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}


.stripe {
   background-color: #f2f2f2;
}

.form-group input, .form-group select, .form-group textarea {
     padding: 0; 
}

.custom-date-format {
    text-align: center; /* Center-align the entire date block */
}

.custom-date-format .day {
    font-size: 0.9em; /* Smaller font for the day */
    color: #555; /* Optional: Gray color for a subtle look */
}

.custom-date-format .month-day {
    font-size: 1.5em; /* Larger font for the month and day */
    font-weight: bold; /* Bold for emphasis */
}

.custom-date-format .year {
    font-size: 1.5em; /* Match the size of the month and day */
    font-weight: bold; /* Bold for emphasis */
    margin-top: 0.2em; /* Add some spacing above the year */
}

/* Mobile stuff forms mostly*/
@media only screen and (max-width:320px) {
#input_1_31 * {display:block!important;}
}

/* Add broader breakpoints */
@media screen and (max-width: 768px) {
  a.news-headline {
    font-size: 16px; /* Slightly smaller for mobile */
  }
  
  .large-card .image-container {
    height: auto;
    aspect-ratio: 16/9; /* Use aspect ratio instead of fixed height */
  }
  
  .form-group input,
  .form-group select,
  .form-group textarea {
    padding: 8px; /* Add padding for better touch targets */
    font-size: 16px; /* Prevent iOS zoom on focus */
  }
  
  .inline {
    line-height: 1.4em; /* More readable line height */
  }
}

/* Add touch-friendly form styling */
@media screen and (max-width: 480px) {
  .form-group input,
  .form-group select,
  .form-group textarea {
    margin-bottom: 15px;
    width: 100%;
  }
}

/* this is for post metadata */
.entry-meta {
    margin-bottom: 0; /* Remove spacing below the meta block */
}

.entry-meta .post-author,
.entry-meta .posted-on {
    margin: 0; /* Remove default margins */
    line-height: 1.4; /* Optional: Adjust line spacing for better readability */
    font-size: 14px; /* Ensure uniform font size */
    color: #666;
}

.entry-meta .post-author {
    font-weight: bold; /* Make author stand out */
}

.entry-meta .posted-on {
    margin-top: 2px; /* Slight spacing between lines */
}

// for home page

/* Target the main container */
#event-title-container {
    border-left: 7px solid #FED143 !important;
    padding-left: 32px !important;
    margin-bottom: 25px !important;
}

/* Target the heading */
#event-title-container {
    border-left: 7px solid #0d2c6c !important;
    padding-left: 32px !important;
    margin-bottom: 25px !important;
}

/* Target the link */
#event-title-container a, #alumni-news-container a {
    display: block;
    line-height: 20px !important;
    font-weight: 700;
    color: #007ac1;
}

#alumni-news-container {
    border-left: 7px solid #662e91 !important;
    padding-left: 32px !important;
    margin-bottom: 25px !important;
}

#alumni-news-container h2 {
    font-size: 27px;
    padding-bottom: 10px;
    color: #0d2c6c;
}

/* fix forms on toolset */

@media screen and (max-width: 768px) {
    .cred-form .wp-editor-container,
    .cred-form .mce-toolbar,
    .cred-form .ed_button {
        max-width: 100% !important;
        overflow-x: auto !important;
    }
    
    .cred-form .mce-container {
        width: 100% !important;
    }
    
    /* Make buttons wrap */
    .cred-form .ed_button {
        font-size: 12px !important;
        padding: 4px 8px !important;
    }
}