/*Sitewide notice*/
#sitewide-banner .sitewide-banner-inner {
    padding: 0.5rem 3rem;
}
#sitewide-banner .sitewide-banner-inner p {
    margin-bottom: 0.25rem;
}
#sitewide-banner .banner-title{
    font-weight: 700;
}
#sitewide-banner .sitewide-banner-inner.emergency {
    background: rgba(252, 177, 153, 1);
    border-left: 10px solid rgba(160, 0, 31, 1);
}
#sitewide-banner .sitewide-banner-inner.emergency a, #sitewide-banner .sitewide-banner-inner.warning a{
    color: #000000;
}
#sitewide-banner .sitewide-banner-inner.warning{
 	background: rgba(255, 233, 181, 1);
    border-left: 10px solid rgba(192, 136, 0, 1);
}
#sitewide-banner .sitewide-banner-inner.info{
   background: rgba(175, 215, 255, 1);
   border-left: 10px solid rgba(0, 65, 129, 1);
   color: rgba(0, 65, 129, 1);
}
#sitewide-banner .sitewide-banner-inner.info a{
    color: rgba(0, 65, 129, 1);     
}
#sitewide-banner a.banner-cta {
    text-decoration: underline;
}
#sitewide-banner .banner-message a{
  	text-decoration: underline;
}
#sitewide-banner a.banner-cta:hover,  #sitewide-banner a.banner-cta:focus, #sitewide-banner .banner-message a:hover, #sitewide-banner .banner-message a:focus{
    color: #333333;
}
/* Container banners can remain static/flow; each banner is its own positioning context */
.sitewide-banner-inner {
  position: relative;          /* anchor for the close button */
  padding-right: 48px;         /* room so text doesn't run under the X */
}

/* Close button pinned to the top-right */
.banner-close {
  position: absolute;
  bottom: 50%;                   /* adjust as desired */
  right: 16px;                 /* adjust as desired */
  width: 44px;
  height: 44px;
  line-height: 24px;
  font-weight: 300;
  text-align: center;
  font-size: 2rem;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
}
.banner-close:focus {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
#sitewide-banner .sitewide-banner-inner.emergency .banner-close{
  color:rgba(160, 0, 31, 1);
}
#sitewide-banner .sitewide-banner-inner.emergency .banner-close:hover, #sitewide-banner .sitewide-banner-inner.emergency .banner-close:focus{
  background:rgba(160, 0, 31, 1);
  color: white;
}
#sitewide-banner .sitewide-banner-inner.warning .banner-close{
  color: #000000;
}
#sitewide-banner .sitewide-banner-inner.warning .banner-close:hover, #sitewide-banner .sitewide-banner-inner.warning .banner-close:focus{
  background:rgba(192, 136, 0, 1);
  color: #333333;
}
#sitewide-banner .sitewide-banner-inner.info .banner-close{
  color: rgba(0, 65, 129, 1);
}
#sitewide-banner .sitewide-banner-inner.info .banner-close:hover, #sitewide-banner .sitewide-banner-inner.info .banner-close:focus{
  background: rgba(0, 65, 129, 1);
  color:#ffffff;
}
#sitewide-banner p.banner-title {
    margin-bottom: 0 !important;
}
#sitewide-banner .sitewide-banner-inner {
    padding: 0.5rem 2rem;
    display: flex;
    align-items: flex-start;
}
#sitewide-banner .banner-icon {
    flex: 0 0 auto;
    margin-right: 2.5rem;
}
#sitewide-banner .banner-icon img {
    display: block;
    width: 30px;
    height: 30px;
    bottom: 35%;
    position: absolute;
}
@media only screen and (max-width: 919px) {
    #sitewide-banner .banner-icon img {
      width: 24px;
      height: 24px;
      bottom: 32%;
	}
}
/* White Border on images */
img.img-border {
    outline: 3px solid #fff;
    outline-offset: -18px;
}

/* Fifty Fifty background colors */
.fifty-fifty.yellow article, .fifty-fifty.yellow figure {
    background-color: #ffc845;
}

.fifty-fifty.teal article, .fifty-fifty.teal figure {
    background-color: #9cdbd9;
}

.tile.gray .tile-content {
    color: #000;
    background-color: #d2d2d2;
}

/* Social Media */
main.main-content--landing .sidebar-social-media {
    margin-bottom: 65px;
    padding-left: 40px;
    padding-right: 40px;
}


/*limit Studio Site logo size in footer*/
site-footer .footer-link-list img {
   	max-height: 150px;
}

/*CTA - temp solution - merge with master BB 02/22/2025*/
.program-cta__wrapper{
    padding-bottom: 1.5rem;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
.program-cta__wrapper a.button{
    margin-top: 0.5rem;
    margin-left: 0.75rem;
}

/* Font size issue BB*/
.hero-image .caption-container .caption p {
    font-size: 1.25rem; /* Change fixed size to relative REM for better scalability */
}

@media (max-width: 576px) {
    .hero-image .caption-container .caption p {
        font-size: 1rem; /* Slightly smaller size for narrow screens */
    }
  .hero-image .caption-container {
       padding: 10px;
   }
}

/*Visit Page BB*/
/* Container */
.container {
    margin: 0 auto;
    margin-bottom: 2rem;
}

/* Row */
.row {
    display: grid;
    gap: 3rem;
    grid-template-columns: repeat(12, 1fr); /* 12-column system */
}

/* Default column classes (col-*) */
.col-1 { grid-column: span 1; }
.col-2 { grid-column: span 2; }
.col-3 { grid-column: span 3; }
.col-4 { grid-column: span 4; }
.col-5 { grid-column: span 5; }
.col-6 { grid-column: span 6; }
.col-7 { grid-column: span 7; }
.col-8 { grid-column: span 8; }
.col-9 { grid-column: span 9; }
.col-10 { grid-column: span 10; }
.col-11 { grid-column: span 11; }
.col-12 { grid-column: span 12; }

@media (min-width: 768px) {
    .col-md-1 { grid-column: span 1; }
    .col-md-2 { grid-column: span 2; }
    .col-md-3 { grid-column: span 3; }
    .col-md-4 { grid-column: span 4; }
    .col-md-5 { grid-column: span 5; }
    .col-md-6 { grid-column: span 6; }
    .col-md-7 { grid-column: span 7; }
    .col-md-8 { grid-column: span 8; }
    .col-md-9 { grid-column: span 9; }
    .col-md-10 { grid-column: span 10; }
    .col-md-11 { grid-column: span 11; }
    .col-md-12 { grid-column: span 12; }
}
/* Row-cols classes */
.row-cols-1 { grid-template-columns: repeat(1, 1fr); }
.row-cols-2 { grid-template-columns: repeat(2, 1fr); }
.row-cols-3 { grid-template-columns: repeat(3, 1fr); }
.row-cols-4 { grid-template-columns: repeat(4, 1fr); }
.row-cols-5 { grid-template-columns: repeat(5, 1fr); }
.row-cols-6 { grid-template-columns: repeat(6, 1fr); }

/* Responsive row-cols classes */
@media (min-width: 576px) {
    .row-cols-sm-1 { grid-template-columns: repeat(1, 1fr); }
    .row-cols-sm-2 { grid-template-columns: repeat(2, 1fr); }
    .row-cols-sm-3 { grid-template-columns: repeat(3, 1fr); }
    .row-cols-sm-4 { grid-template-columns: repeat(4, 1fr); }
    .row-cols-sm-5 { grid-template-columns: repeat(5, 1fr); }
    .row-cols-sm-6 { grid-template-columns: repeat(6, 1fr); }
}

@media (min-width: 768px) {
    .row-cols-md-1 { grid-template-columns: repeat(1, 1fr); }
    .row-cols-md-2 { grid-template-columns: repeat(2, 1fr); }
    .row-cols-md-3 { grid-template-columns: repeat(3, 1fr); }
    .row-cols-md-4 { grid-template-columns: repeat(4, 1fr); }
    .row-cols-md-5 { grid-template-columns: repeat(5, 1fr); }
    .row-cols-md-6 { grid-template-columns: repeat(6, 1fr); }
}

@media (min-width: 992px) {
    .row-cols-lg-1 { grid-template-columns: repeat(1, 1fr); }
    .row-cols-lg-2 { grid-template-columns: repeat(2, 1fr); }
    .row-cols-lg-3 { grid-template-columns: repeat(3, 1fr); }
    .row-cols-lg-4 { grid-template-columns: repeat(4, 1fr); }
    .row-cols-lg-5 { grid-template-columns: repeat(5, 1fr); }
    .row-cols-lg-6 { grid-template-columns: repeat(6, 1fr); }
}

@media (min-width: 1200px) {
    .row-cols-xl-1 { grid-template-columns: repeat(1, 1fr); }
    .row-cols-xl-2 { grid-template-columns: repeat(2, 1fr); }
    .row-cols-xl-3 { grid-template-columns: repeat(3, 1fr); }
    .row-cols-xl-4 { grid-template-columns: repeat(4, 1fr); }
    .row-cols-xl-5 { grid-template-columns: repeat(5, 1fr); }
    .row-cols-xl-6 { grid-template-columns: repeat(6, 1fr); }
}



table.profile-table img {
width: 125px;
height: 150px !important;
max-width: 125px;
}




.ribbon-cta a:focus-visible{
    outline: 3px solid #ffffff !important; 
    outline-offset: 3px;
    box-shadow: 0 0 0 3px #000000 !important;
    border-radius: 4px;
}
.site-footer a#page-top-link:focus-visible,  a.picture-tile:focus-visible, .photo-gallery__item a:focus-visible, .slick-slider a.featured-video-card:focus-visible{
    outline: 3px solid #0057b8 !important;
    outline-offset: 3px;
    border-radius: 4px;
    box-shadow: 0 0 0 3px #ffffff !important;
}
.photo-gallery__item:has(a:focus-visible) {
    outline: 3px solid #0057b8;
    border-radius: 4px;
}

button.slick-prev:not(.slick-disabled):focus-visible,
button.slick-next:not(.slick-disabled):focus-visible {
  border-radius: 4px;
  outline: none;
  box-shadow:
    inset 0 0 0 1px #ffffff,
    inset 0 0 0 4px #0057b8;
  background: #e6e6e6;
}
button.slick-prev:not(.slick-disabled):focus-visible{
  left: 0 !important;
}
button.slick-next:not(.slick-disabled):focus-visible {
  right: 0 !important;
}
/*new*/
button.slick-prev:not(.slick-disabled):focus-visible svg use,
button.slick-next:not(.slick-disabled):focus-visible svg use{
    fill: #0057b8 !important;
    color: #0057b8 !important;
}
a.mayo-lightbox__close:focus-visible, .mayo-lightbox .mayo-lightbox-slider__thumbs .mayo-lightbox-thumb>a:focus-visible {
    outline: 3px solid #0057b8 !important;
    outline-offset: 3px;
    border-radius: 4px;
    box-shadow: 0 0 0 3px #ffffff !important;
}
/*https://college.mayo.edu/about/news/commencement/*/

a.tile.color-tile.blue .tile-content .h3 {
    color: #fff;
}
a.tile.color-tile .tile-content .h3 {
    color: #0057b8;
}
.tile.blue .tile-content .h3 {
    color: #fff;
}
.tile.color-tile .h3 {
    margin-bottom: 0;
    word-wrap: break-word;
    color: #000;
}
.tile .h3 {
    display: inline-block;
    font-family: mayo-sans, Arial, sans-serif;
    margin-bottom: .25rem;
}
a.tile.color-tile .tile-content .h3:after {
    content: "";
    width: 36px;
    height: 3px;
    background: #0057b8;
    margin: 9px auto 4.5px;
    display: block;
    transition: all .35s 
cubic-bezier(.77, 0, .175, 1);
}
.h3 {
    font-size: 1.5rem !important;
    line-height: 1.2;
}
.h3{
    font-weight: 700;
    font-family: mayo-display, EB Garamond, serif;
}
a.tile.color-tile .tile-content:hover .h3:after {
    background-color: #0057b8;
    width: 100%;
}
a.tile.color-tile.blue .tile-content .h3:after, a.tile.color-tile.blue .tile-content .h3:before {
    background-color: #fff;
}


/*24px touch target*/
.program-nav__title a {
    min-height: 24px;
    align-content: center;
}

/*Focused element is completely covered by other content*/
html {
    scroll-padding-top: 150px;
}


/*Button missing role and name*/
button.tooltip-label.lock.academic-enrich {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
}
.tooltip-label:focus .search-label-text, .tooltip-label:focus-visible .search-label-text {
    visibility: visible;
}
button.tooltip-label.lock.academic-enrich:focus, button.tooltip-label.lock.academic-enrich:focus-visible {
    outline: none;
    box-shadow: 0 0 1px 2px rgba(0, 87, 184, .75);
    border-radius: 0;
}

/*Table issue - https://college.mayo.edu/about/college-profile/consumer-information-and-disclosures/professional-licensure-disclosures/*/
@media (max-width: 538px) {
  table:not(.cal-table):not(.profile-table) td {
    padding-left: 0;
    height: auto;
    box-sizing: border-box;
  }

  table:not(.cal-table):not(.profile-table) td::before {
    display: block;
    position: static; /* KEY FIX */
    width: auto;
    height: auto;
    white-space: normal;
  }
}


/*News content type*/
.news .social-share-wrapper {
    display: flex;
    align-items: baseline;
}
.news span.social-share-label {
    margin-right: .5rem;
}

/* Mega Menu */

/* Button appearance */
.main-nav button.main-link {
  appearance: none;
  -webkit-appearance: none;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

/* Shared layout styles for links and buttons */
.main-nav > ul > li > a,
.main-nav > ul > li > button.main-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  line-height: inherit;
}

/* Mobile styles */
@media screen and (max-width: 1023px) {
  .main-nav > ul > li > button.main-link {
    font-size: 1.5rem;
    padding: 1rem 40px;
    color: #fff;
  }

  .main-nav > ul > li > button.main-link:hover,
  .main-nav > ul > li > button.main-link:active {
    text-decoration: underline;
  }
}

/* Desktop styles */
@media only screen and (min-width: 1024px) {
  .main-nav > ul > li > button.main-link {
    padding: 14px 20px 0.75rem;
    font-weight: 700;
    background-color: transparent;
  }
}

/* Accordion arrow rotation (active + hover states) */
.main-nav > ul > li.is-active > button.main-link .accordion-more,
.main-nav > ul > li.hovering > button.main-link .accordion-more {
  transform: rotate(180deg);
}

/* Focus styles */
.main-nav button.main-link:focus-visible {
  outline: 3px solid #0057b8;
  outline-offset: 3px;
  border-radius: 4px;
}

/* 7. Remove inner focus ring in Firefox */
.main-nav button.main-link::-moz-focus-inner {
  border: 0;
}