@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600&family=Passion+One:wght@400;700;900&display=swap");
/* app state commencement unified stylesheet */
 #skip-to,#skip-to *,#skip-to *::before,#skip-to *::after {
  box-sizing:border-box
}

#skip-to img{max-width:100%; height:auto; display:block}

@media all {
  .strip{}

  .strip>div{}

  .strip>div>div{}

  .strip>div>div>div>:last-child{margin-bottom:0}

  .more{margin:15px 0 0; font-family:"Oswald"; font-size:1em; font-weight:300; text-align:right; line-height:1.2em}

  .more a{display:inline-block; padding:5px 15px 8px; border:1px solid #1a99e0; border-radius:5px; background:#1a99e0; color:#fff; transition:color .25s,background .25s; text-decoration:none}

  #skip-to h1{font-weight:600}

  #skip-to p{margin-bottom:5px}

  #skip-to .lead{font-size:1.3em; line-height:1.3em; font-weight:100}

  @media all and(min-width:480px) {

  }
  @media all and(min-width:800px) {

  }

}

@media all {

  /* header */
 #skip-to .strip.strip-header {
    position:relative; width:100%; height:calc(100vh - 320px); min-height:220px; background:#000; overflow:hidden
  }
  #skip-to .strip.strip-header::after{position:absolute; top:0; left:0; width:100%; height:100%; content:''; background:rgba(0,0,0,.5); z-index:200}

  #skip-to .strip.strip-header .image{position:absolute; width:100%; height:100%}

  #skip-to .strip.strip-header .image.image-001{background:#000 url(../_images/_slideshow/001-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-002{background:#000 url(../_images/_slideshow/002-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-003{background:#000 url(../_images/_slideshow/003-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-004{background:#000 url(../_images/_slideshow/004-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-005{background:#000 url(../_images/_slideshow/005-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-006{background:#000 url(../_images/_slideshow/006-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-007{background:#000 url(../_images/_slideshow/007-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-008{background:#000 url(../_images/_slideshow/008-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-009{background:#000 url(../_images/_slideshow/009-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-010-1{background:#000 url(../_images/_slideshow/010-1-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-011{background:#000 url(../_images/_slideshow/011-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-012{background:#000 url(../_images/_slideshow/012-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-013-1{background:#000 url(../_images/_slideshow/013-grad-1.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-013-2{background:#000 url(../_images/_slideshow/013-grad-2.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014{background:#000 url(../_images/_slideshow/014-grad.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-1{background:#000 url(../_images/_slideshow/014-grad-1.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-2{background:#000 url(../_images/_slideshow/014-grad-2.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-3{background:#000 url(../_images/_slideshow/014-grad-3.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-4{background:#000 url(../_images/_slideshow/014-grad-4.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-5{background:#000 url(../_images/_slideshow/014-grad-5.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-6{background:#000 url(../_images/_slideshow/014-grad-6.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-7{background:#000 url(../_images/_slideshow/014-grad-7.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-11{background:#000 url(../_images/_slideshow/014-grad-11.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-12{background:#000 url(../_images/_slideshow/014-grad-12.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-12-1{background:#000 url(../_images/_slideshow/014-grad-12-1.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-4-1{background:#000 url(../_images/_slideshow/014-grad-4-1.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-4-2{background:#000 url(../_images/_slideshow/014-grad-4-2.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .image.image-014-16{background:#000 url(../_images/_slideshow/014-grad-16.jpg) center center; background-size:cover}

  #skip-to .strip.strip-header .text{position:absolute; left:20%; top:85%; width:80%; color:#fff; transform:translate(-12.5%,-50%); text-align:center; z-index:300}

  #skip-to .strip.strip-header .text h1{font-family:"Passion One"; font-size:2.7em; line-height:.8em; margin-bottom:12px; letter-spacing:0.02em; text-shadow:1px 1px 4px rgba(0,0,0,0.4)}

  #skip-to .strip.strip-header .text h2{font-family:"Oswald"; font-size:2em; line-height:1.3em; margin-bottom:24px; text-shadow:1px 1px 4px rgba(0,0,0,0.4)}

  @media all and(min-width:480px) {
    #skip-to .strip.strip-header .text h1{font-size:3em; line-height:1em}

  }
  @media all and(min-width:600px) {
    #skip-to .strip.strip-header .text h1{font-size:4.5em; line-height:.9em}

    #skip-to .strip.strip-header .text p{font-size:2.3em; line-height:1.4em; margin-bottom:36px}

  }
  @media all and(min-width:768px) {
    #skip-to .strip.strip-header{height:calc(100vh - 178px)}

  }
  @media all and(min-width:800px) {
    #skip-to .strip.strip-header .text h1{font-size:5.5em; line-height:.9em}

  }
  @media all and(min-width:1000px) {
    #skip-to .strip.strip-header .text h1{font-size:6em; line-height:.8em}

  }

}

@media all {

  /* commencement */
 .strip.strip-statement {

  }
  .act-wrap{margin-bottom:60px}

  .act-wrap p{font-size:20px; font-weight:200; font-family:'Oswald'; color:white; text-align:center; margin-bottom:24px; line-height:27px}

  .dark-bg h2{font-family:'Oswald'; color:#fff; font-size:29px; margin-top:24px; margin-bottom:12px}

  .overview{background:#3d3d3d; padding:48px 24px}

  .overview h1{font-size:35px; font-weight:600; font-family:'Oswald'; color:white; text-align:center; margin-bottom:36px}

  .highlight{margin:0px auto 24px; text-align:center}

  .highlight a{background-color:gold; color:#222; border-radius:6px; font-weight:bold; padding:6px 24px; font-size:20px; font-family:'Oswald'; border:1px solid gold; -webkit-transition:border 150ms ease-out; -moz-transition:border 150ms ease-out; -o-transition:border 150ms ease-out; font-weight:400; display:inline-block}

  .highlight a:hover{background-color:white; border:solid 1px #222; text-decoration:none}

  .highlight a.larger{font-size:16px}

  .highlight a::after{content:'\276f'; padding-left:10px}

  a.fade-white:hover{border:solid 1px white; color:#333}

  ul.no-attend{padding-left:24px}

  ul.no-attend li{margin-bottom:6px}

  .box-2{align-self:center; flex:1; text-align:center; padding:36px 0px}

  .box-2 h2{font-size:53px; font-family:'Passion One'; margin-bottom:0; line-height:45px}

  .box-2 h3{font-family:'Oswald'; font-size:26px; margin-bottom:24px}

  .box-2 p{margin-bottom:24px}

  .attend{margin:0 auto; max-width:1400px; display:flex; flex-direction:column}

  .overview-int-wrap{max-width:1100px; margin:0 auto}

  .iso-facts{display:flex; flex-wrap:wrap; flex-direction:row; color:white; flex:2; padding:48px 0px}

  .iso-facts>*{flex:1 1 160px; font-size:14px; line-height:18px; font-family:'Oswald'; width:100%; padding:24px 0px; text-align:center; margin:0 auto}

  .flex-facts{display:flex; flex-direction:column; max-width:1200px; margin:0 auto; width:90%}

  .fact-head{padding:36px 0px 0px; align-self:center; text-align:center; flex:1}

  .overview-intro{max-width:900px; margin:0 auto}

  .attend-wrap{flex:1; padding:48px 0px; background-color:#ddd}

  .attend-interior{max-width:300px; margin:0 auto}

  .attend-interior h1{font-size:35px; font-weight:600; font-family:'Oswald'; color:#222; text-align:center}

  .attend-interior h2{font-family:'Oswald'; font-size:26px; margin-bottom:24px}

  .flex-facts .iso-facts>div>img{max-width:100px; display:block; margin:0 auto 12px}

  .facts{background-color:#014266}

  .fact-head-int{font-size:53px; font-family:'Passion One'; color:white; line-height:43px}

  .fact-head-int-sub{font-size:20px; font-family:'Passion One'; color:white; text-transform:uppercase}

  .gold{color:gold}

  .strip.strip-stats>div>div>div>ul>li{padding:10px; border:none; border-radius:15px}

  .strip.strip-stats>div>div>div>ul{grid-template-columns:repeat(2,1fr); grid-gap:30px}

  .attend-interior>div>ul>li>ul{padding-left:24px}

  .schedule-interior>div>h2{color:white; font-weight:300; margin-bottom:24px; font-size:16px; line-height:normal}

  .schedule-interior>.no-margin>h2{color:white; font-weight:300; margin-bottom:6px; font-size:16px; line-height:normal}

  .gold-bold-large{color:gold; font-size:21px}

  ul.ceremony{margin:0px auto 36px}

  ul.ceremony li{display:inline-block; padding:6px 12px; background-color:white; border-radius:6px; margin:6px}

  ul.ceremony li:last-child{}

  ul.ceremony li a:link::after{content:'\276f'; padding-left:8px}

  ul.gold-nav li a:link::after{content:'\276f'; padding-left:8px}

  .mace{width:100%; max-width:870px; margin:0 auto 48px; text-align:center}

  .mace p{font-size:15px; line-height:26px; text-align:left; color:#444; margin-bottom:18px}

  .mace h2{margin-bottom:24px}

  .accordion{background-color:transparent; color:gold; cursor:pointer; padding-bottom:12px; width:100%; border:none; text-align:left; outline:none; transition:0.4s; font-size:23px; border-bottom:1px dotted #999}

  .active,.accordion:hover{}

  .accordion:after{content:'\002B'; color:gold; font-weight:bold; float:right; margin-left:5px}

  .active:after{content:"\2212"}

  .panel{padding:0 18px; max-height:0; overflow:hidden; transition:max-height 0.2s ease-out}

  .panel p{font-size:14px; line-height:21px; text-align:left; color:#666; margin-bottom:12px}

  .panel p:first-child{margin-top:12px}

  .schedule-interior{display:flex; flex-direction:column; width:100%; max-width:1000px; margin:0 auto}

  .sched-col{flex:1; padding:12px}

  #myBtn{position:fixed; bottom:20px; right:30px; border:none; background-color:#ffcc00; color:#010101; cursor:pointer; padding:10px; font-size:11px; font-weight:bolder; font-family:'Open Sans',sans-serif; border-radius:6px; z-index:10000}

  #myBtn:hover{background-color:#feea9b}

  .bio-wrap>div>p{font-size:15px; line-height:26px; text-align:left; color:#444; margin-bottom:12px}

  .bio-wrap>div>p:last-child{margin-bottom:0px}

  .bio-wrap{display:flex; flex-direction:column; margin-bottom:48px}

  .bio-wrap:last-child{margin-bottom:0px}

  .bio-wrap .img-block{flex:1; width:100%; padding-right:0px; max-width:250px; padding-bottom:24px}

  .bio-wrap .text-block{flex:2}

  .c-align{text-align:center}

  .col{flex:1; padding:0px 12px}

  .thanks-mace{max-width:768px; text-align:center; padding:0px 12px 24px; margin:0 auto}

  .thanks-mace.banner-carrier{padding:24px 30px 0px 30px; margin:0 auto 40px; border:1px solid #bbb; background:#ededed; border-radius:15px}

  .thanks-mace h1{font-size:35px; font-weight:600; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:#222}

  .thanks-mace h2{font-size:28px; font-weight:400; margin-bottom:24px}

  .thanks-mace h3{font-size:14px; font-weight:600}

  .bearer-wrap:first-child{margin:0px auto 24px}

  .bearer-wrap{display:flex; justify-content:space-between; margin:12px auto 24px; width:100%; max-width:900px}

  .bearer-wrap img{width:225px}

  .bearer-wrap.toolkit img{width:100%}

  .bearer-wrap .col p{font-size:12px; line-height:16px; color:#555}

  .abt-commencement{text-align:center; padding:60px 24px; max-width:768px; margin:0 auto}

  .abt-commencement h1{font-size:35px; font-weight:600; margin-bottom:24px; text-align:center; font-family:'Oswald'; margin-top:0px}

  .abt-commencement p{color:white; margin-bottom:24px; line-height:27px; text-align:left}

  .abt-commencement p:last-child{margin-bottom:0px}

  .packet-block{text-align:center; padding:60px 24px; max-width:768px; margin:0 auto}

  .packet-block h1{font-size:35px; font-weight:600; margin-bottom:24px; text-align:center; font-family:'Oswald'; margin-top:0px}

  .packet-block p{color:#222; margin-bottom:24px; line-height:27px; text-align:left}

  .packet-block p:last-child{margin-bottom:0px}

  .packet-block ul{padding-left:24px; margin-bottom:24px; line-height:27px; color:#222}

  .packet-block ul li{margin-bottom:24px}

  .packet-block h2{font-size:29px; font-weight:500; margin-bottom:24px; font-family:'Oswald'; text-align:center}

  .bio-wrap img{}

  .spkrs-int{max-width:960px; text-align:center; padding:48px 24px; margin:0 auto}

  .spkrs-int h1{font-size:35px; font-weight:600; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:#222}

  .spkrs-int h2{text-align:left; font-weight:700; font-size:31px; color:#333; font-family:'Oswald'}

  .spkrs-int p.subtitle{text-align:left; margin-bottom:24px; color:#444}

  .mace-large{width:100%; height:200px; background-image:url(../_images/commencement-mace-bg-large-3.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .tassle-large{width:100%; height:450px; background-image:url(../_images/commencement-tassle-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .cap-large{width:100%; height:450px; background-image:url(../_images/commencement-cap-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .guest-large{width:100%; height:450px; background-image:url(../_images/commencement-guest-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .faculty-large{width:100%; height:450px; background-image:url(../_images/commencement-faculty-4.11-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .parking-large{width:100%; height:450px; background-image:url(../_images/commencement-parking-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .regalia-large{width:100%; height:450px; background-image:url(../_images/commencement-regalia-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .accessibility-large{width:100%; height:450px; background-image:url(../_images/commencement-accessibility-2-bg-large.jpg); background-repeat:no-repeat; background-position:45% 72%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .stream-header-wrap{display:flex; max-width:210px; margin:0px auto}

  .shw-text{flex:1; padding:6px; text-transform:uppercase; font-size:12px; font-weight:700}

  .shw-graphic{flex:1; padding:6px; align-self:center}

  .nowrap{white-space:inherit}

  .watch-main{max-width:768px; text-align:center; padding:48px 12px; margin:0 auto}

  .watch-main h1{font-size:2.4em; font-weight:400; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:#222}

  .dark-bg .watch-main h1{color:#fff}

  .dark-bg .watch-main p{text-align:center; color:#fff}

  .watch-interior{margin-bottom:36px}

  .watch-interior h3{font-family:'Oswald'; font-size:2em; margin-top:40px}

  .watch-interior h4{font-family:'Oswald'; font-size:26px; font-weight:100; line-height:37px}

  .watch-interior p{font-weight:300; font-size:18px; font-family:'Open Sans',Arial; line-height:normal; margin-bottom:15px}

  .watch-interior p.subtext{font-style:italic; font-weight:300; font-size:16px; font-family:'Open Sans',Arial; line-height:normal}

  .congrats-wrap{text-align:center; padding:60px 12px; max-width:900px; margin:0 auto}

  .congrats-wrap h1{font-size:28px; font-family:'Oswald'; text-align:center; margin-bottom:24px; font-weight:400}

  .congrats-wrap p{color:white; font-size:14px; margin-bottom:24px}

  hr.thanks-divide{border:0; height:1px; background-image:linear-gradient(to right,rgba(0,0,0,0),rgba(0,0,0,0.35),rgba(0,0,0,0)); width:55%}

  p.sched-subtitle{text-align:center; margin-bottom:12px; color:gold; font-size:19px}

  .block-a-sched{margin:0 auto; width:75px; text-align:center}

  .dec-section{max-width:768px; text-align:center; padding:48px 12px; margin:0 auto}

  .dec-section h1{font-size:35px; font-weight:600; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:white; line-height:43px}

  .dec-section p{text-align:left; margin-bottom:24px; color:white; line-height:27px}

  .dec-section p:last-child{text-align:left; margin-bottom:36px; color:white; line-height:27px}

  .social-tag{max-width:768px; text-align:center; padding:48px 12px; margin:0 auto}

  .social-tag p{margin-bottom:12px; line-height:27px}

  .social-tag ul li{display:inline-block; margin:0px 12px 0px}

  .social-tag ul li:last-child{display:inline-flex; align-self:center}

  .social-tag ul{list-style-type:none; max-width:768px; margin:0 auto 6px; width:100%}

  .tag-last{border-bottom:0; font-weight:normal; font-size:10px; align-self:center}

  .social-tag h1{font-size:35px; font-weight:bold; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:#222}

  .social-tag h2{font-size:21px; font-weight:600; border-bottom:3px solid gold}

  .thanks-mace p{margin-bottom:24px; line-height:27px}

  .img-block figcaption{font-size:11px; text-align:left; line-height:16px}

  .invite-wrap{display:flex; border:1px solid #888; flex-direction:row; border-radius:12px; max-width:500px; margin:0px auto}

  .invite-wrap .invite-thumb{flex:1; padding:6px}

  .invite-wrap .invite-thumb img{width:100%; max-width:145px}

  .invite-wrap .invite-info{flex:2; padding:12px 0px; text-align:left}

  .invite-wrap .invite-info a{background-color:gold; border-radius:6px; padding:12px; color:#111; font-size:9px}

  .invite-wrap .invite-info a:hover{background-color:white}

  .invite-wrap .invite-info a::after{content:'\276f'; padding-left:10px}

  .invite-wrap .invite-info h2{color:white; font-size:23px; font-weight:300; margin-bottom:24px}

  .vid-placeholder{width:100%; height:400px; background-image:url(../_images/campus-pano-commencement-video-thumb-bg-2000px); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

  .color-overlay{position:absolute; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,.7); z-index:99}

  .guest h1{font-size:35px; font-weight:600; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:#222}

  .guest-int{display:flex; flex-direction:column; max-width:900px; margin:0 auto 24px; background-color:gold; padding:24px; border-radius:12px}

  .guest-int .img-block{flex:1}

  .guest-int .desc-text{flex:1; padding-left:0px}

  .guest-int .desc-text p{font-size:16px; line-height:27px}

  .guest-int .desc-text h2{font-size:31px; font-weight:600; font-family:'Oswald'; margin-bottom:12px; color:#333}

  .guest{margin-bottom:48px}

  .related{margin:48px auto; max-width:960px; padding:0px 24px}

  .related h1{font-size:35px; font-weight:600; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:#222}

  ul.related-wrap{display:flex; flex-direction:row; list-style-type:none; flex-wrap:wrap}

  ul.related-wrap li{margin-right:24px; margin-bottom:24px; flex:1 1 200px}

  ul.related-wrap li p{text-transform:uppercase; font-size:13px}

  ul.related-wrap li h2{font-size:15px; line-height:22px}

  .tag-wrap-top{border:1px solid #999; padding:12px; border-radius:12px}

  .tag-wrap-top .social-tag-top ul li h2{color:white; font-size:18px; font-weight:600; border-bottom:3px solid gold; font-family:'Open Sans'}

  .tag-wrap-top h2{font-family:'Oswald'; color:gold; margin-bottom:12px; font-size:30px}

  .social-tag-top ul li{display:inline-block; margin:0px 12px 0px}

  .social-tag-top ul li:last-child{display:inline-flex; align-self:center}

  .social-tag-top ul{list-style-type:none; max-width:768px; margin:0 auto 6px; width:100%}

  .social-tag-top .tag-last{border-bottom:0; font-weight:normal; font-size:17px; align-self:center; color:white}

  a.stamp-btn{background-color:gold; padding:1px 12px; border-radius:6px; color:#111; font-weight:600; font-size:15px; text-transform:uppercase}

  .w-btn-wrap{margin-bottom:24px}

  a.action-steps{background-color:gold; color:#222; padding:6px 12px; font-size:15px; border-radius:6px}

  a.action-steps::after{content:'\276f'; padding-left:10px}

  .team-thanks{max-width:960px; margin:0 auto}

  .team-thanks ul li{font-size:14px; line-height:20px; color:#444; margin-bottom:6px}

  .team-thanks ul{margin-bottom:12px; padding-left:24px}

  .team-thanks>.ty-col>p{font-size:15px; margin-bottom:12px; color:#444; text-align:left}

  .team-thanks h1{font-size:35px; font-weight:600; font-family:'Oswald'; text-align:center; margin-bottom:24px; color:#222}

  .ty-col{column-count:2; column-gap:40px; margin-bottom:48px; padding:0px 12px}

  .team-thanks p{text-align:center; margin-bottom:24px}

  .long-btn{background-color:gold; padding:12px; border-radius:12px}

  ul.gold-nav{margin:8px auto; max-width:1040px}

  ul.gold-nav li{display:inline-block; background-color:transparent; border-radius:0px; margin:6px 12px; padding-bottom:8px}

  ul.gold-nav li a{color:black; padding:6px 36px; border-bottom:2px solid #333; font-size:15px}

  ul.gold-nav li a:hover{background-color:white; border-radius:12px; text-decoration:none; border-bottom:0px; transition:all .4s ease; -webkit-transition:all .4s ease}

  .dark-bg{background-color:#111}

  .dark-bg p>a:link{color:#62b9eb !important}

  .gold-nav-wrap{background-color:gold; text-align:center; padding:8px 0px}

  ul.colleges{display:flex; list-style-type:none; -webkit-flex-wrap:wrap; flex-wrap:wrap; justify-content:center}

  ul.colleges li{margin:12px}

  ul.colleges li a{color:black; background-color:white; padding:6px 12px; border-radius:6px; text-decoration:none}

  ul.colleges li a:hover{color:black; background-color:gold; padding:6px 12px; border-radius:6px; text-decoration:underline; transition:all .4s ease; -webkit-transition:all .4s ease}

  ul.colleges li a::after{content:'\276f'; padding-left:10px}

  .sub-block{border:1px solid #555; border-radius:15px; padding:20px; margin:20px 0; background:#fff; text-align:center}

  .grid-video>div{margin-bottom:30px}

  .candidates h2{margin-bottom:15px}

  .candidates h3{margin-bottom:15px}

  .candidates h4{margin-top:23px}

  .candidates h5{margin-top:15px}

  @media all and(min-width:400px) {

  }
  @media all and(min-width:480px) {

  }
  @media all and(min-width:600px) {
    .ty-col{column-count:3; column-gap:40px; margin-bottom:48px}

    .nowrap{white-space:nowrap}

    .act-wrap p{font-size:26px; font-weight:200; font-family:'Oswald'; color:white; text-align:center; margin-bottom:24px; line-height:31px}

    .attend{margin:0 auto; max-width:1400px; display:flex; flex-direction:row}

    .highlight a.larger{font-size:24px}

    .invite-wrap .invite-info a{background-color:gold; border-radius:6px; padding:12px; color:#333; font-size:14px}

    .tag-last{border-bottom:0; font-weight:normal; font-size:16px; align-self:center}

  }
  @media all and(min-width:800px) {
    ul.related-wrap li h2{font-size:22px; line-height:28px}

    .guest-int .desc-text{flex:1; padding-left:36px}

    .guest-int{flex-direction:row}

    .congrats-wrap h1{font-size:35px; font-family:'Oswald'; text-align:center; margin-bottom:24px}

    .congrats-wrap p{font-size:16px}

    .bio-wrap{display:flex; flex-direction:row; margin-bottom:48px}

    .bio-wrap .img-block{flex:1; padding-right:36px; max-width:inherit; width:100%; padding-bottom:0px}

    .mace-large{width:100%; height:450px; background-image:url(../_images/commencement-mace-bg-large-3.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

    .tassle-large{width:100%; height:450px; background-image:url(../_images/commencement-tassle-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

    .cap-large{width:100%; height:450px; background-image:url(../_images/commencement-cap-bg-large.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:100%; -moz-background-size:cover; -o-background-size:cover; -webkit-background-size:cover; background-size:cover}

    .thanks-mace h3{font-size:17px; font-weight:600}

    .bearer-wrap .col p{font-size:13px; line-height:16px; color:#555}

    .strip.strip-stats>div>div>div>ul{grid-template-columns:repeat(3,1fr)}

    .schedule-interior{display:flex; flex-direction:row; width:100%; max-width:1000px; margin:0 auto}

    .sched-col{flex:1; padding:12px}

    .grid-video{display:grid; grid-template-columns:1fr 1fr; grid-gap:30px}

  }

}

/* macebearers legacy file merged */

/* macebearers banner/name sections layout */
 #macebearers {
  background-color:#fff; margin-top:36px; margin-right:40px
}

/* contain the content nicely on large screens */
 .thanks-mace,.mace {
  max-width:1200px; margin:0 auto 3rem; padding:0 24px; box-sizing:border-box
}

.thanks-mace h1,.banner-carrier h1{font-size:2rem; margin-bottom:1.5rem}

/* core flex layout for all the grids */
 .bearer-wrap {
  display:flex; flex-wrap:wrap; gap:24px;
  /* space between columns */
 align-items:flex-start
}

/* each column */
 .bearer-wrap .col {
  box-sizing:border-box; flex:1 1 calc(33.333% - 16px);
  /* 3-up on desktop */
 min-width:260px;
  /* prevents absurdly skinny columns */
}

/* portrait images fluid */
 .thanks-mace img {
  display:block; width:100%; height:auto; margin-bottom:12px
}

/* tighten type a bit */
 .thanks-mace h2,.banner-carrier h2 {
  margin:0.5rem 0 0.25rem
}

.thanks-mace h3,.thanks-mace h4,.banner-carrier h3,.banner-carrier h4{margin:0 0 0.25rem}

.thanks-mace p,.banner-carrier p{margin:0 0 0.75rem; line-height:1.5}

/* about the mace text block */
 .mace p {
  margin-bottom:1rem; line-height:1.6
}

/* breakpoints */

/* tablet:2 columns */
 @media(max-width:1024px) {
  .bearer-wrap .col{flex:1 1 calc(50% - 16px)}

}

/* mobile:single column stack */
 @media(max-width:768px) {

  /* kill that right margin so it doesnt shove */
 #macebearers {
    margin-right:0 !important; margin-left:0 !important
  }
  .thanks-mace,.mace{padding:0 16px}

  .bearer-wrap{gap:16px}

  .bearer-wrap .col{flex:1 1 100%; min-width:0}

  .thanks-mace h1,.banner-carrier h1{font-size:1.6rem}

}

/* extra-small phones */
 @media(max-width:480px) {
  .thanks-mace,.mace{padding:0 12px}

}

/* core source of truth merged last */

/* app state commencement consolidated stylesheet */

/* 1 design tokens */
:root{--app-gold:#ffcc00; --app-black:#010101; --ink:#111; --text:#222; --muted:#444; --muted-2:#666; --line:#bbb; --bg-dark:#111; --bg-mid:#222; --bg-light:#f4f4f4; --bg-white:#fff; --font-head:"Oswald",Arial,sans-serif; --font-accent:"Passion One",Impact,sans-serif; --font-body:"Open Sans",Arial,sans-serif; --container:1140px; --container-narrow:800px; --space-1:6px; --space-2:12px; --space-3:18px; --space-4:24px; --space-5:36px; --space-6:48px; --space-7:60px; --r-1:6px; --r-2:12px; --r-3:15px}

/* 2 base accessibility defaults */
 #skip-to,#skip-to *,#skip-to *::before,#skip-to *::after {
  box-sizing:border-box
}

#skip-to img{max-width:100%; height:auto; display:block}

#skip-to:where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--app-gold); outline-offset:3px}

@media(prefers-reduced-motion:reduce) {
  #skip-to *,#skip-to *::before,#skip-to *::after{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important}

}

.visually-hidden{position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

/* optional helper if you ever need it */
 .flow>*+* {
  margin-top:var(--space-3)
}

/* 3 strip system shared layout */
 .strip>div>div {
  max-width:var(--container); min-width:320px; margin:0 auto
}

.strip.single-col>div>div{max-width:var(--container-narrow)}

.strip>div>div>div{padding:30px 15px}

@media(min-width:768px) {
  .strip>div>div>div{padding:30px}

}

/* background helpers replace inline styles with these classes */
 .white {
  background:var(--bg-white)
}

.grey{background:var(--bg-light)}

.dark-bg{background:var(--bg-dark)}

/* 4 shared components used on subpages optionally homepage */

/* 4.1 subnav gold pills on black */
 .comm-subnav {
  background:var(--app-black); padding:var(--space-7)var(--space-2); text-align:center
}

.comm-subnav__inner{max-width:900px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:center; gap:12px}

.comm-pill{display:inline-flex; align-items:center; gap:10px; padding:6px 24px; border-radius:var(--r-1); border:1px solid var(--app-gold); background:var(--app-gold); color:var(--text); font-family:var(--font-head); font-weight:400; font-size:20px; text-decoration:none; transition:background-color .2s ease,color .2s ease,border-color .2s ease}

.comm-pill:hover,.comm-pill:focus-visible{background:#fff; color:var(--ink); border-color:#fff}

/* 4.2 buttons replaces inline hover js */
 .comm-btn {
  display:inline-block; padding:10px 24px; border-radius:var(--r-1); font-family:var(--font-head); font-weight:400; text-decoration:none; border:1px solid transparent; transition:background-color .2s ease,color .2s ease,border-color .2s ease
}

.comm-btn--gold{background:var(--app-gold); color:var(--text); border-color:var(--app-gold)}

.comm-btn--gold:hover,.comm-btn--gold:focus-visible{background:#fff; color:var(--ink); border-color:var(--ink)}

.comm-cta{text-align:center; margin:10px 0 0}

.comm-cta__note{text-align:center; margin:10px auto 0; max-width:900px}

/* 4.3 back to top button keep your existing */
 #myBtn {
  position:fixed; bottom:20px; right:30px; border:0; background:var(--app-gold); color:var(--app-black); cursor:pointer; padding:10px; font-size:11px; font-weight:800; font-family:var(--font-body); border-radius:var(--r-1); z-index:10000
}

#myBtn:hover{background:#feea9b}

/* 4.4 accordion aa-clean expects button markup */
 .acc {
  margin:30px 0 60px
}

.acc__btn{width:100%; display:flex; justify-content:space-between; align-items:center; background:transparent; border:0; border-bottom:1px dotted #999; padding:0 0 12px; font-family:var(--font-head); font-size:23px; color:var(--app-gold); cursor:pointer; text-align:left}

.acc__icon::before{content:"+"; font-weight:700}

.acc__btn[aria-expanded="true"].acc__icon::before{content:"−"}

.acc__panel{padding:12px 18px 0}

/* 4.5 bearer grid macebearers / banner bearers */
 .bearer-grid {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; width:100%; max-width:1200px; margin:0 auto; padding-inline:12px
}

@media(max-width:900px) {
  .bearer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

}

@media(max-width:600px) {
  .bearer-grid{grid-template-columns:1fr}

}

/* 4.6 toolkit media grid thumb galleries */
 .media-grid {
  display:grid; gap:24px; max-width:1100px; margin:0 auto; justify-items:center
}

.media-grid--thumbs{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}

.media-grid--stories{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}

.media-grid--gifs{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

.media-grid--panel{background:#b2b3b3; padding:24px 16px; border-radius:var(--r-2)}

.media-grid img{width:100%; height:auto; max-width:450px}

.media-grid--stories img{max-width:180px}

/* 5 subpages baseline toolkit look */
 .comm-subpage .strip.strip-text>div>div>div h1 {
  font-family:var(--font-head); font-size:3em; margin:10px 0 18px
}

.comm-subpage .strip.strip-text>div>div>div h2{font-family:var(--font-head); font-size:2.25em; margin:26px 0 10px; text-align:left; padding-bottom:8px; border-bottom:1px solid #ddd}

.comm-subpage .strip.strip-text>div>div>div h3{font-family:var(--font-head); font-size:1.6em; margin:20px 0 8px; padding-bottom:6px; border-bottom:1px solid #eee}

.comm-subpage .strip.strip-text>div>div>div h4{font-family:var(--font-head); margin:10px 0}

.comm-subpage .strip.strip-text>div>div>div p{margin-bottom:15px}

.comm-subpage .strip.strip-text>div>div>div p.lead{font-size:1.2em; line-height:1.5em}

/* optional sidebar pattern only if your html uses */
 @media(min-width:768px) {
  .comm-subpage .strip.strip-text>div>div>div{display:flex}

  .comm-subpage .strip.strip-text>div>div>div .main-flex{flex:2}

  .comm-subpage .strip.strip-text>div>div>div .sidebar-flex{flex:1; margin-left:60px}

}

/* 6 page modules scoped */

/* 6.1 candidates module */
 .comm-subpage .candidates {
  max-width:64rem; margin:0 auto 4rem
}

.comm-subpage .candidates-header{margin-bottom:24px}

.comm-subpage .candidates-title{text-align:left; margin:0 0 12px; font-family:var(--font-head)}

.comm-subpage .candidates-rule{border:0; height:6px; background:var(--app-gold); margin:0}

/* heading rhythm inside candidates */
 .comm-subpage .candidates h2 {
  margin-top:36px
}

.comm-subpage .candidates h3{margin-top:18px}

.comm-subpage .candidates h4{margin-top:18px}

.comm-subpage .candidates h5{margin-top:12px}

/* name lists */
 .comm-subpage .candidates ul {
  margin:8px 0 18px; padding-left:0; list-style:none
}

.comm-subpage .candidates li{margin:0 0 6px}

/* responsive columns for names */
 @media(min-width:700px) {
  .comm-subpage .candidates ul{column-count:2; column-gap:32px}

  .comm-subpage .candidates li{break-inside:avoid}

}

@media(min-width:1000px) {
  .comm-subpage .candidates ul{column-count:3}

}

/* 7 homepage module important */

/* ---- hero / header strip placeholder scope ---- */
 .comm-home .strip.strip-header {

  /* paste/port your hero slideshow rules from style-commencement.css here. */
}

/* ---- homepage modules placeholder scopes ---- */
 .comm-home .overview {

  /* port overview block rules here */
}

.comm-home .facts{/* port facts block rules here */}

.comm-home .iso-facts{/* port iso-facts rules here */}

.comm-home .attend{/* port attend rules here */}

.comm-home .schedule-interior{/* port schedule rules here */}

/* 8 legacy compatibility shims temporary */

/* map existing .highlight to the new pill/button look */
 .highlight a {
  background:var(--app-gold); color:var(--text); border-radius:var(--r-1); border:1px solid var(--app-gold); font-family:var(--font-head); font-weight:400; display:inline-block; padding:6px 24px; text-decoration:none
}

.highlight a:hover,.highlight a:focus-visible{background:#fff; border-color:var(--ink); color:var(--ink); text-decoration:none}

.highlight a::after{content:"❯"; padding-left:10px}

/* keep gold-nav behavior if any page still uses */
 ul.gold-nav {
  margin:8px auto; max-width:1040px
}

ul.gold-nav li{display:inline-block; margin:6px 12px; padding-bottom:8px}

ul.gold-nav li a{color:#000; padding:6px 36px; border-bottom:2px solid #333; font-size:15px; text-decoration:none}

ul.gold-nav li a:hover{background:#fff; border-radius:var(--r-2); border-bottom:0}

/* patch:homepage macebearer layout */
 .comm-home .bearer-wrap {
  display:flex; flex-wrap:wrap; gap:30px; justify-content:center; align-items:flex-start
}

/* works whether children are div or a */
 .comm-home .bearer-wrap>* {
  flex:1 1 300px;
  /* responsive base */
 max-width:360px;
  /* prevents the giant third card */
}

@media(min-width:1000px) {
  .comm-home .bearer-wrap>*{flex:0 0 calc(33.333% - 20px); /* three across */ max-width:none}

}

.comm-home .bearer-wrap img{width:100%; height:auto; display:block}

/* patch:subnav pill links */
 .comm-subpage .comm-subnav a.comm-pill,.comm-subpage .comm-subnav a.comm-pill:visited {
  color:#222 !important; text-decoration:none !important
}

.comm-subpage .comm-subnav a.comm-pill:hover,.comm-subpage .comm-subnav a.comm-pill:focus-visible{text-decoration:none !important}

/* patch:toolkit media-grid centering */
 .comm-subpage .media-grid>a {
  display:flex; align-items:center;
  /* vertical centering */
 justify-content:center;
  /* horizontal centering */
 width:100%
}

/* gif tiles:give them a consistent frame height */
 .comm-subpage .media-grid--gifs>a {
  min-height:220px
}

/* keep images from stretching weirdly */
 .comm-subpage .media-grid>a img {
  width:auto; max-width:100%; height:auto
}

/* patch:home macebearers 3-up */
 #macebearers .bearer-wrap {
  display:grid; grid-template-columns:1fr; gap:30px; align-items:start
}

@media(min-width:900px) {
  #macebearers .bearer-wrap{grid-template-columns:repeat(3,minmax(0,1fr))}

}

/* prevent third one becomes a giant */
 #macebearers .bearer-wrap>.col {
  width:auto; max-width:none
}

/* images behave */
 #macebearers .bearer-wrap img {
  width:100%; height:auto; display:block
}

/* patch:toolkit gif tile alignment */
 .media-grid {
  align-items:center
}

.media-grid .media-grid__item{display:flex; align-items:center; justify-content:center; width:100%}

.media-grid--gifs .media-grid__item{min-height:220px; /* adjust if you want tighter rows */}

.media-grid .media-grid__item img{width:auto; max-width:100%; height:auto; display:block}

/* patch:banner bearers name readers layout home page */
 .banner-carrier .bearer-wrap {
  display:grid !important;
  /* beat inline display:flex */
 grid-template-columns:1fr;
  /* mobile default */
 gap:24px !important; justify-content:stretch !important;
  /* beat inline space-between */
 align-items:start !important
}

/* 2 across on medium screens */
 @media(min-width:700px) {
  .banner-carrier .bearer-wrap{grid-template-columns:repeat(2,minmax(0,1fr))}

}

/* 3 across on desktop */
 @media(min-width:1024px) {
  .banner-carrier .bearer-wrap{grid-template-columns:repeat(3,minmax(0,1fr))}

}

/* neutralize inline sizing that causes wrapping/weird widths */
 .banner-carrier .bearer-wrap>.col {
  min-width:0 !important;
  /* beat inline min-width:260px */
 width:auto !important; flex:none !important;
  /* ignore inline flex sizing */
}

/* patch zone temporary */

/* typography rhythm patch */

/* base text polish */
 .comm-subpage {
  font-family:var(--font-body); color:#222
}

.comm-subpage .strip.strip-text p,.comm-subpage .strip.strip-text li{line-height:1.6; font-size:1.05rem}

.comm-subpage .strip.strip-text p.lead{font-size:1.2rem; line-height:1.55; max-width:70ch}

/* heading reset:predictable spacing */
 .comm-subpage .strip.strip-text h1,.comm-subpage .strip.strip-text h2,.comm-subpage .strip.strip-text h3,.comm-subpage .strip.strip-text h4 {
  font-family:var(--font-head); font-weight:400; line-height:1.12; letter-spacing:0.01em; margin:0
}

/* h1:page title rhythm */
 .comm-subpage .strip.strip-text h1 {
  font-size:clamp(2.2rem,3.5vw,3rem); margin-bottom:0.75rem
}

/* h2:section titles */
 .comm-subpage .strip.strip-text h2 {
  font-size:clamp(1.75rem,2.4vw,2.25rem); margin-top:2.2rem; margin-bottom:0.75rem; padding-bottom:0.5rem; border-bottom:1px solid #ddd; text-align:left;
  /* unify */
}

/* h3:subsection titles */
 .comm-subpage .strip.strip-text h3 {
  font-size:clamp(1.35rem,1.8vw,1.6rem); margin-top:1.6rem; margin-bottom:0.5rem; padding-bottom:0.35rem; border-bottom:1px solid #eee
}

/* h4:minor headings */
 .comm-subpage .strip.strip-text h4 {
  font-size:1.15rem; margin-top:1.2rem; margin-bottom:0.4rem
}

/* keep paragraphs from feeling stacked weird */
 .comm-subpage .strip.strip-text p {
  margin:0 0 0.9rem
}

.comm-subpage .strip.strip-text ul,.comm-subpage .strip.strip-text ol{margin:0 0 1rem}

/* optional:make strong label then text look cleaner */
 .comm-subpage .strip.strip-text p strong {
  font-weight:700
}

/* candidates rhythm lists can visually overwhelm */
 .comm-subpage .candidates h2 {
  margin-top:2.6rem;
  /* slightly more breathing room */
}

.comm-subpage .candidates h3{margin-top:1.8rem}

.comm-subpage .candidates li{line-height:1.45}

/* homepage harmony dont override hero just tame headings */
 .comm-home .strip h2 {
  font-family:var(--font-head); font-weight:400; line-height:1.12
}

.comm-home .strip h3{font-family:var(--font-head); font-weight:400; line-height:1.15}

/* h2 unification no highlight */
:root{--comm-h2-size:clamp(2.0rem,3.0vw,2.75rem); --comm-h2-weight:400; --comm-h2-line:1.05; --comm-h2-track:0.01em}

/* subpages toolkit/info/candidates */
 .comm-subpage h2 {
  font-family:var(--font-head); font-weight:var(--comm-h2-weight)!important;
  /* beats legacy bold */
 font-size:var(--comm-h2-size); line-height:var(--comm-h2-line); letter-spacing:var(--comm-h2-track)
}

/* home only if wrapper exists */
 .comm-home h2 {
  font-family:var(--font-head); font-weight:var(--comm-h2-weight); font-size:var(--comm-h2-size); line-height:var(--comm-h2-line); letter-spacing:var(--comm-h2-track)
}

/* candidates:unify h2 look to match commencement home */
 .candidates h2,.candidates-header h2,.candidates h2#grad-school {
  font-family:var(--font-head); font-weight:400 !important;
  /* beat candidates sheet */
 font-size:clamp(2.0rem,3.0vw,2.75rem);
  /* home-like scale */
 line-height:1.05; letter-spacing:0.01em; margin:0 0 0.75rem; text-align:left;
  /* matches your intent */
}

/* if some css is adding extra padding/background/etc. */
 .candidates h2 {
  background:none !important; text-shadow:none !important
}

/* commencement primary h1 typography unified */
 .main-content-00 h1,.watch-main h1,.strip h1 {
  font-family:inherit; font-weight:400;
  /* thinner matches digital toolkit */
 letter-spacing:-0.02em; line-height:1.1
}

/* hero / image-overlay h1s */
 .strip h1 {
  color:#ffffff
}

/* prevent legacy overrides from re-boldening */
 .main-content-00 h1 strong {
  font-weight:500
}

/* h1 unification force info hero/title to match toolkit */

/* any commencement hero strip title */
 #skip-to .strip.strip-header h1,#skip-to .strip.strip-header .title,.strip.strip-statement h1 {
  font-weight:400 !important; letter-spacing:-0.02em; line-height:1.1
}

/* any app state page title wrapper often used */
 .page-title-00 h1,.page-title-02 h1 {
  font-weight:400 !important; letter-spacing:-0.02em; line-height:1.1
}

/* info page:hero h1 should match toolkit thin */
 #skip-to .strip.strip-header .text h1.title {
  font-weight:400 !important; letter-spacing:-0.02em; line-height:1.1;
  /* optional:keep size responsive but consistent */
 font-size:clamp(2.4rem,5vw,4.25rem); margin:0
}

/* info page:hero h1 should match toolkit display */
 #skip-to .strip.strip-header .text h1.title {
  font-family:"Roboto Condensed","Roboto","Arial Narrow",Arial,sans-serif !important; font-weight:400 !important; letter-spacing:-0.02em; line-height:1.1; font-size:clamp(2.4rem,5vw,4.25rem); margin:0; font-synthesis:none
}

/* commencement typography unified headings */
 .main-content-00 .strip h2,.main-content-00 h2,.watch-main h2 {
  font-family:"Oswald","Roboto Condensed",Arial,sans-serif; font-weight:400; font-size:42px; line-height:1.12; margin:0 0 0.6em
}

.main-content-00 .strip h3,.main-content-00 h3,.watch-main h3{font-family:"Open Sans",Arial,sans-serif; font-weight:400; font-size:28px; line-height:1.25; margin:0 0 0.6em}

.main-content-00 .strip h4,.main-content-00 h4,.watch-main h4{font-family:"Open Sans",Arial,sans-serif; font-weight:600; font-size:22px; line-height:1.3; margin:0 0 0.5em}

.main-content-00 .strip h5,.main-content-00 h5,.watch-main h5{font-family:"Open Sans",Arial,sans-serif; font-weight:600; font-size:16px; line-height:1.35; margin:0 0 0.4em}

@media(max-width:700px) {
  .main-content-00 .strip h2,.main-content-00 h2,.watch-main h2{font-size:34px}

  .main-content-00 .strip h3,.main-content-00 h3,.watch-main h3{font-size:24px}

}

/* candidates page:force h2s including grad-school onto unified */
 .candidates h2,.candidates h2#grad-school {
  font-size:42px !important
}

/* commencement unified headings approved scale */

/* h2 section headline */
 .main-content-00 h2,.watch-main h2 {
  font-family:"Oswald",Arial,sans-serif; font-size:44px; font-weight:400; line-height:1.15; margin:2.5rem 0 1.2rem
}

/* h3 major subsection */
 .main-content-00 h3,.watch-main h3 {
  font-family:"Oswald",Arial,sans-serif; font-size:36px; font-weight:400; line-height:1.18; margin:2rem 0 1rem
}

/* h4 minor section / label-style header */
 .main-content-00 h4,.watch-main h4 {
  font-family:"Oswald",Arial,sans-serif; font-size:28px; font-weight:200; line-height:1.2;
  /* spacing rules you requested */
 margin-top:2.2rem;
  /* more space above */
 margin-bottom:0.4rem;
  /* less space below */
}

/* tighten h4 h5 relationship */
 .main-content-00 h4+h5,.watch-main h4+h5 {
  margin-top:0.25rem
}

/* commencement unified headings broader targeting */

/* target the real shared structure:strips their content */
 .strip.strip-text h2,.strip.strip-statement h2,.strip.strip-text h3,.strip.strip-statement h3,.strip.strip-text h4,.strip.strip-statement h4,.strip.strip-text h5,.strip.strip-statement h5 {

  /* nothing here each level below overrides cleanly */
}

/* h2 oswald 44 / 400 */
 .strip.strip-text h2,.strip.strip-statement h2,.main-content-00 h2,.watch-main h2 {
  font-family:"Oswald",Arial,sans-serif !important; font-size:44px !important; font-weight:400 !important; line-height:1.15; margin:2.5rem 0 1.2rem
}

/* h3 oswald 36 / 400 */
 .strip.strip-text h3,.strip.strip-statement h3,.main-content-00 h3,.watch-main h3 {
  font-family:"Oswald",Arial,sans-serif !important; font-size:36px !important; font-weight:400 !important; line-height:1.18; margin:2rem 0 1rem
}

/* h4 oswald 28 / 200 spacing tuned */
 .strip.strip-text h4,.strip.strip-statement h4,.main-content-00 h4,.watch-main h4 {
  font-family:"Oswald",Arial,sans-serif !important; font-size:28px !important; font-weight:200 !important; line-height:1.2; margin-top:2.2rem;
  /* more space above */
 margin-bottom:0.4rem;
  /* less space below */
}

/* h5 open sans 20 / 600 */
 .strip.strip-text h5,.strip.strip-statement h5,.main-content-00 h5,.watch-main h5 {
  font-family:"Open Sans",Arial,sans-serif !important; font-size:20px !important; font-weight:600 !important; line-height:1.35; margin:0.3rem 0 0.6rem
}

/* tighten h4 p and h4 h5 */
 .strip.strip-text h4+p,.strip.strip-statement h4+p,.main-content-00 h4+p,.watch-main h4+p {
  margin-top:0.2rem
}

.strip.strip-text h4+h5,.strip.strip-statement h4+h5,.main-content-00 h4+h5,.watch-main h4+h5{margin-top:0.2rem}

/* optional responsive downshift recommended */
 @media(max-width:700px) {
  .strip.strip-text h2,.strip.strip-statement h2,.main-content-00 h2,.watch-main h2{font-size:36px !important}

  .strip.strip-text h3,.strip.strip-statement h3,.main-content-00 h3,.watch-main h3{font-size:30px !important}

  .strip.strip-text h4,.strip.strip-statement h4,.main-content-00 h4,.watch-main h4{font-size:24px !important}

}

/* hero title:restore strip-header title styling */
 #skip-to .strip.strip-header .text {

  /* re-establish the designed title treatment */
 display:inline-block; padding:18px 26px; background:rgba(36,120,150,0.55);
  /* teal overlay feel */
 border-radius:6px
}

#skip-to .strip.strip-header .text .title{font-family:"Oswald",Arial,sans-serif; font-weight:300; /* thin/modern your preference */ letter-spacing:-0.02em; line-height:1.05; margin:0; color:#fff; text-shadow:none; /* keeps it crisp */ font-size:clamp(2.6rem,5.2vw,5rem)}

/* if you want the title box centered reliably */
 #skip-to .strip.strip-header {
  text-align:center
}

/* h5:larger slightly bolder better spacing to paragraph */
 .strip.strip-text h5,.strip.strip-statement h5,.main-content-00 h5,.watch-main h5 {
  font-size:20px !important;
  /* larger */
 font-weight:600 !important;
 margin:2.0rem 0 0.25rem;
  /* keep h5 tight-ish */
}

/* add space between h5 and the paragraph that */
 .strip.strip-text h5+p,.strip.strip-statement h5+p,.main-content-00 h5+p,.watch-main h5+p {
  margin-top:0.75rem;
  /* the breath you asked for */
}

/* hero h1 commencement strip-header title */
 #skip-to .strip.strip-header .text .title,#skip-to .strip.strip-header h1.title {
  font-family:"Oswald",Arial,sans-serif !important; font-weight:400 !important; font-size:clamp(3rem,5.5vw,5.25rem); line-height:1.05; letter-spacing:-0.015em; color:#ffffff !important; background:none !important; padding:0 !important; margin:0; text-transform:none
}

/* ensure the hero container itself does not impose */
 #skip-to .strip.strip-header .text {
  background:transparent !important; padding:0 !important
}

/* commencement hero h1 canonical */
 #skip-to .strip.strip-header h1.title {
  font-family:"Oswald",Arial,sans-serif; font-weight:400; font-size:clamp(3rem,5.5vw,5.25rem); line-height:1.05; letter-spacing:-0.015em; color:#ffffff; margin:0
}

/* ensure no visual container styling leaks in */
 #skip-to .strip.strip-header .text {
  background:none; padding:0
}

/* commencement:interior hero h1 toolkit / info / */
 #skip-to .strip.strip-header .text h1,#skip-to .strip.strip-header .text h1.title {
  font-family:"Oswald",var(--font-head),sans-serif !important; font-weight:400; letter-spacing:-0.02em; line-height:1.1; font-size:clamp(2.6rem,5vw,4.25rem); margin:0; color:#fff; text-transform:none
}

/* commencement:base paragraph typography */
 .commencement p,.strip p,.main-content-00 p,.main-content-01 p {
  font-size:20px; line-height:1.55; font-weight:400; margin:0 0 1.25rem
}

/* commencement home:hero h1 passion bold statement */
 .commencement-home h1,.commencement-home .strip-header h1 {
  font-family:"Passion One",sans-serif; font-size:80px; font-weight:400; line-height:1.05; letter-spacing:0
}

/* commencement:global h1 non-home pages */
 .commencement h1,.strip-header h1 {
  font-family:"Oswald",sans-serif; font-size:80px; font-weight:400; line-height:1.1
}

/* commencement:paragraph typography */
 .commencement p,.strip p,.main-content-00 p,.main-content-01 p {
  font-size:18px; line-height:1.6; font-weight:400; margin:0 0 1.2rem
}

/* lead paragraphs */
 .commencement p.lead,.strip p.lead {
  font-size:20px; line-height:1.55; font-weight:400
}

/* home:macebearer typography */
 .commencement-home .macebearers p,.commencement-home .macebearer p,.commencement-home .macebearer-bio,.commencement-home .macebearer-text {
  font-size:18px; line-height:1.65
}

.commencement-home .macebearers .college,.commencement-home .macebearer-college,.commencement-home .macebearers .dept,.commencement-home .macebearers .unit{font-size:20px; font-weight:600; line-height:1.25; margin-top:0.25rem}

.commencement-home h2,.commencement-home .strip h2{font-size:44px; font-weight:400}

/* home:macebearers banner bearers name readers typography */

/* 1 macebearer bio paragraphs your pem.../em/p */
 #macebearers .thanks-mace .bearer-wrap .col p,#macebearers .thanks-mace .bearer-wrap .col p em {
  font-size:16px !important; line-height:1.65
}

/* optional:keep those bios from feeling cramped */
 #macebearers .thanks-mace .bearer-wrap .col p {
  margin-top:0.75rem; margin-bottom:0
}

/* 2 banner bearers / name readers college line */
 #macebearers .banner-carrier .col p {
  font-size:16px !important; line-height:1.35; margin:0.35rem 0 0.75rem 0
}

/* make the college line read like a subhead */
 #macebearers .banner-carrier .col h5+p {
  font-weight:600; letter-spacing:0.01em
}

/* 3 if you want all normal paragraphs sitewide:*/
 #commencement p,#macebearers p {
  font-size:18px; line-height:1.65
}

#commencement p.lead,#macebearers p.lead{font-size:20px; line-height:1.65}

/* 4 spacing:more space above h4 less space */
 #macebearers h4 {
  margin-top:1.25rem; margin-bottom:0.35rem
}

#macebearers h4+h5{margin-top:0.25rem}

/* candidates:match interior content width to other pages */
 .candidates .watch-main,#candidates .watch-main {
  max-width:900px; margin-left:auto; margin-right:auto
}

/* digital toolkit:match interior content width */
 #digital-toolkit .watch-main,.digital-toolkit .watch-main,#digital-toolkit .strip.strip-text>div,#digital-toolkit .strip.strip-statement>div {
  max-width:900px; margin-left:auto; margin-right:auto
}

/* digital toolkit:unify interior content width */
 .comm-subpage main .thanks-mace {
  max-width:900px !important; margin-left:auto !important; margin-right:auto !important
}

/* digital toolkit:mobile padding for sections esp. social */
 @media(max-width:700px) {
  #social-flair .thanks-mace,#gif-section .thanks-mace,#hashtags .thanks-mace,#instagram-stories .thanks-mace{padding-left:16px !important; padding-right:16px !important}

}

/* digital toolkit:instagram stories single row on desktop */
 @media(min-width:1000px) {
  .media-grid--stories{display:grid; grid-template-columns:repeat(6,1fr); /* 6 tiles in one line */ gap:16px; align-items:start}

  .media-grid--stories .media-grid__item{margin:0}

  .media-grid--stories img{width:100%; height:auto; display:block}

}

/* digital toolkit:social media flair mobile padding fix */
 #social-flair .thanks-mace {
  padding-left:16px; padding-right:16px
}

@media(min-width:700px) {
  #social-flair .thanks-mace{padding-left:24px; padding-right:24px}

}

/* digital toolkit:mobile spacing above social media flair */
 @media(max-width:768px) {
  #social-flair.strip{padding-top:28px !important; /* space above the h2 */ margin-top:16px !important; /* extra separation from prior section */}

  /* if any margin-collapsing shenanigans occur this forces a */
 #social-flair.strip>.thanks-mace {
    padding-top:0.1px;
    /* harmless prevents margin collapse */
  }

  /* optional:tighten the titles own top margin if */
 #social-flair h2 {
    margin-top:0 !important
  }

}

/* toolkit:social media flair mobile top spacing */
 @media(max-width:768px) {

  /* create real space inside the gray strip */
 #social-flair {
    padding-top:28px !important
  }

  /* kill any margin-collapse weirdness and add predictable spacing */
 #social-flair>.thanks-mace {
    margin-top:0 !important; padding-top:0 !important
  }

  /* ensure the h2 isnt glued to the top */
 #social-flair h2 {
    margin-top:0 !important; padding-top:0 !important
  }

  /* add the space explicitly above the title */
 #social-flair h2#social-flair-title {
    padding-top:18px !important
  }

}

/* commencement headings final tune */

/* h3 */
 .comm-subpage h3 {
  font-size:32px; line-height:1.15
}

/* tighten h2 h3 spacing */
 .comm-subpage h2 {
  margin-bottom:0.4em
}

/* tighten h3 h4 spacing */
 .comm-subpage h3 {
  margin-bottom:0.35em
}

/* slightly pull h3 closer to h2 */
 .comm-subpage h3 {
  margin-top:0.4em
}

/* slightly pull h4 closer to h3 */
 .comm-subpage h4 {
  margin-top:0.35em
}

/* final typography authority wins over earlier important */

/* h3 size rhythm beats earlier 36px important rules */
 .comm-subpage .strip h3,.comm-subpage .watch-main h3,.comm-subpage h3 {
  font-size:32px !important; line-height:1.15 !important; margin-top:0.4em !important;
  /* tighter h2 h3 */
 margin-bottom:0.35em !important;
  /* tighter h3 next */
 padding-bottom:0 !important;
  /* kill legacy underline spacing */
 border-bottom:0 !important;
  /* remove strip-text underline if any */
}

/* h2 h3 tighter */
 .comm-subpage .strip h2,.comm-subpage .watch-main h2,.comm-subpage h2 {
  margin-bottom:0.4em !important
}

/* h3 h4 tighter halve prior spacing */
 .comm-subpage .strip h4,.comm-subpage .watch-main h4,.comm-subpage h4 {
  margin-top:0.35em !important
}

/* if strip-text adds divider lines under h3 that */

/* toolkit:loosen heading rhythm keep h332 */
 .comm-subpage main h2 {
  margin-bottom:0.65em !important
}

.comm-subpage main h3{font-size:32px !important; line-height:1.15 !important; margin-top:0.9em !important; /* give h3 room toolkit repeats h3 a lot */ margin-bottom:0.55em !important}

.comm-subpage main h4{margin-top:0.6em !important; /* restore some separation from h3 */ margin-bottom:0.4em !important}

/* final override:h3 must be 32px everywhere */
 .strip.strip-text h3,.strip.strip-statement h3,.main-content-00 h3,.watch-main h3,.comm-subpage h3 {
  font-size:32px !important; line-height:1.15 !important
}

/* toolkit only:restore a little breathing room */
 .comm-subpage main h2 {
  margin-bottom:0.65em !important
}

.comm-subpage main h3{margin-top:0.9em !important; margin-bottom:0.55em !important}

.comm-subpage main h4{margin-top:0.6em !important}

/* college banner bearers spacing fix */

/* 1 give ceremony line h4 real separation */
 .banner-carrier h4 {
  margin-bottom:1rem !important
}

/* 2 names h5:breathe a bit more */
 .banner-carrier h5 {
  margin-top:1.25rem !important;
  /* space before each name */
 margin-bottom:0.35rem !important
}

/* 3 college / unit line under each name */
 .banner-carrier h5+p {
  margin-top:0 !important; margin-bottom:0.9rem !important;
  /* space before next name */
 font-weight:600; line-height:1.3
}

/* 4 first name after ceremony needs extra push */
 .banner-carrier h4+h5 {
  margin-top:1.75rem !important
}

.banner-carrier h5+p{color:#555}

/* remove white gap between hero image and next */
 .strip.strip-statement {
  margin-top:0 !important
}

.strip.strip-statement>div>div>div{padding-top:48px}

/* fix white gap between image strip and gray */
 .strip.strip-statement {
  margin-top:0 !important; overflow:hidden
}

.strip.strip-statement>div>div>div{padding-top:48px}

/* home:banner bearers name readers spacing 50 less */
 #skip-to .thanks-mace.banner-carrier {
  margin:18px auto !important; padding:18px 20px 16px !important;
  /* was 34 36 26 */
 max-width:900px !important
}

/* section titles */
 #skip-to .thanks-mace.banner-carrier>h1,#skip-to .thanks-mace.banner-carrier>h2 {
  margin:0 0 14px !important;
  /* was 24 */
}

/* column spacing */
 #skip-to .thanks-mace.banner-carrier .bearer-wrap {
  gap:18px !important;
  /* was 28 */
}

/* date bars name readers uses h2 others use */
 #skip-to .thanks-mace.banner-carrier .col>div>h2,#skip-to .thanks-mace.banner-carrier .col>div>h3 {
  margin:0 0 10px !important;
  /* was 14 */
}

/* ceremony line name readers uses h3 others use */
 #skip-to .thanks-mace.banner-carrier .col>div>h3+h3,#skip-to .thanks-mace.banner-carrier .col>div>h4 {
  margin:0 0 12px !important;
  /* was 18 */
 padding-bottom:0 !important
}

/* names name readers uses h4 others use h5 */
 #skip-to .thanks-mace.banner-carrier .col>div>h4,#skip-to .thanks-mace.banner-carrier .col>div>h5 {
  margin:12px 0 4px !important;
  /* was 18 0 6 */
}

/* school line */
 #skip-to .thanks-mace.banner-carrier .col>div>p {
  margin:0 0 12px !important;
  /* was 18 */
 padding-bottom:0 !important
}

#skip-to .thanks-mace.banner-carrier .col>div>p:last-child{margin-bottom:0 !important}

/* home:remove the white spacer before the social */
 #skip-to .mace-large {
  height:0 !important; margin:0 !important; padding:0 !important
}

/* home:banner bearers name readers spacing tune */
 #skip-to #macebearers .thanks-mace.banner-carrier {

  /* inside-the-frame breathing room */
 max-width:1200px !important; margin:28px auto !important; padding:44px 52px 40px !important;
  /* top / sides / bottom */
}

@media(max-width:900px) {
  #skip-to #macebearers .thanks-mace.banner-carrier{padding:34px 22px 30px !important}

}

/* title date bars spacing */
 #skip-to #macebearers .thanks-mace.banner-carrier>h2 {
  margin:0 0 26px !important; padding:0 !important
}

/* the 3-column wrapper */
 #skip-to #macebearers .thanks-mace.banner-carrier .bearer-wrap {
  gap:34px !important;
  /* space between columns */
 margin:0 !important; padding:0 !important
}

/* each column:keep content readable not glued */
 #skip-to #macebearers .thanks-mace.banner-carrier .bearer-wrap>.col {
  padding:0 8px !important
}

/* date bar */
 #skip-to #macebearers .thanks-mace.banner-carrier .col h2 {
  margin:0 0 16px !important; padding:14px 12px !important;
  /* overrides your inline padding */
}

/* ceremony line */
 #skip-to #macebearers .thanks-mace.banner-carrier .col h3 {
  margin:0 0 16px !important; padding-bottom:0 !important;
  /* overrides inline padding-bottom */
}

/* name school spacing */
 #skip-to #macebearers .thanks-mace.banner-carrier .col h4 {
  margin:16px 0 8px !important
}

/* school line and spacing before next name block */
 #skip-to #macebearers .thanks-mace.banner-carrier .col p {
  margin:0 0 24px !important;
  /* creates separation before next name */
 padding-bottom:0 !important;
  /* overrides inline padding-bottom */
}

/* final override banner bearers name readers spacing */
 #skip-to .thanks-mace.banner-carrier {

  /* more interior frame padding but not huge */
 margin:18px auto !important; padding:32px 36px 26px !important
}

@media(max-width:700px) {
  #skip-to .thanks-mace.banner-carrier{padding:22px 16px 20px !important}

}

/* section title - date bars gap */
 #skip-to .thanks-mace.banner-carrier>h2 {
  margin:0 0 26px !important
}

/* space between the 3 columns */
 #skip-to .thanks-mace.banner-carrier .bearer-wrap {
  gap:28px !important
}

/* date bar h3 */
 #skip-to .thanks-mace.banner-carrier .col h3 {
  font-size:32px !important;
  /* beats the 36px important */
 margin:0 0 14px !important; padding:10px 12px !important;
  /* a little breathing room in the bar */
}

/* ceremony line h4 */
 #skip-to .thanks-mace.banner-carrier .col h4 {
  margin:0 0 18px !important
}

/* person name h5 */
 #skip-to .thanks-mace.banner-carrier .col h5 {
  margin:16px 0 8px !important
}

/* school line separation before next name */
 #skip-to .thanks-mace.banner-carrier .col h5+p {
  margin:0 0 22px !important;
  /* key:space between people */
}

/* final overrides banner/name reader spacing h3 sizing */

/* 1 h3 everywhere in subpages/toolkit where legacy important */
 .comm-subpage h3,.comm-subpage .strip h3 {
  font-size:32px !important
}

/* 2 banner / name reader framed panels college/university/name */
 #skip-to #macebearers .thanks-mace.banner-carrier {

  /* split-the-difference:more breathing room than too tight */
 padding:42px 42px 30px !important;
  /* overrides inline padding */
 margin:30px auto !important;
  /* overrides inline margin */
 max-width:1080px !important
}

/* tighten title-to-dates spacing but not suffocating */
 #skip-to #macebearers .thanks-mace.banner-carrier h2 {
  margin:0 0 22px !important
}

/* the date pill bar */
 #skip-to #macebearers .thanks-mace.banner-carrier h3 {
  margin:0 0 18px !important; padding:14px 16px !important
}

/* ceremony line */
 #skip-to #macebearers .thanks-mace.banner-carrier h4 {
  margin:16px 0 18px !important
}

/* grid spacing */
 #skip-to #macebearers .thanks-mace.banner-carrier .bearer-wrap {
  gap:30px !important;
  /* space between the 3 columns */
 padding:0 !important; margin:0 auto !important
}

/* each column:give the inside edges some room */
 #skip-to #macebearers .thanks-mace.banner-carrier .col {
  padding:0 10px !important
}

/* kill the inline min-height:200px if its creating weird */
 #skip-to #macebearers .thanks-mace.banner-carrier .col>div {
  min-height:unset !important
}

/* name school spacing this is the too tight */
 #skip-to #macebearers .thanks-mace.banner-carrier h5 {
  margin:18px 0 8px !important
}

#skip-to #macebearers .thanks-mace.banner-carrier h5+p{margin:0 0 18px !important; /* space after school before next name */}

/* also helps when markup is p then next */
 #skip-to #macebearers .thanks-mace.banner-carrier p+h5 {
  margin-top:22px !important
}

/* end of stylesheet */

/* utilities used to replace common inline styles */
 .u-ib-m15-5 {
  display:inline-block; margin:15px 5px
}

.u-datebar{background:#b3b3b3; padding:10px}

.u-center{text-align:center}

.u-max800{max-width:800px; margin:0 auto}

.u-wrap-900{max-width:900px; margin:24px auto; padding:24px 24px 0 24px}

/* home page layout fixes scoped by section ids */

/* consistent vertical rhythm for statement strips */
 #ceremonies.strip.strip-statement>div>div>div,#schedule.strip.strip-statement>div>div>div,#about.strip.strip-statement>div>div>div,#information.strip.strip-statement>div>div>div,#social.strip.strip-statement>div>div>div,#future.strip.strip-statement>div>div>div {
  padding-top:56px !important; padding-bottom:56px !important
}

/* dark statement strips need a touch more breathing */
 .strip.strip-statement.dark-bg>div>div>div {
  padding-top:72px !important; padding-bottom:72px !important
}

/* headings centered but paragraphs/lists left-aligned where theres real */
 #about h2,#about h3,#mace h2,#mace h3,#ceremonies h2,#schedule h2,#information h2,#social h2,#future h2 {
  text-align:center !important; margin-top:0 !important
}

#about p,#about li,#mace p,#mace li,.team-thanks p{text-align:left !important}

/* thank you:center heading left-align body copy */
 .team-thanks {
  max-width:900px; margin:0 auto
}

.team-thanks h1,.team-thanks h2{text-align:center !important}

.team-thanks p{text-align:center !important}

/* ceremonies:center the block */
 #ceremonies .watch-main {
  max-width:900px; margin:0 auto; text-align:center
}

#ceremonies .watch-main p{text-align:center; margin-left:auto; margin-right:auto; max-width:720px}

#ceremonies .watch-interior h4,#ceremonies .watch-interior h5,#ceremonies .watch-interior p{text-align:center}

/* about commencement:keep container centered but copy left */
 #about .watch-main {
  max-width:900px; margin:0 auto
}

#about .watch-main p,#about .watch-main ul{max-width:720px; margin-left:auto; margin-right:auto}

#about .watch-main ul{padding-left:1.25rem}

/* about the mace:center container title left copy */
 #mace .content {
  max-width:900px; margin:0 auto
}

#mace h2{text-align:center !important}

#mace p{text-align:left !important}

/* buttons:enforce same stacked/centered behavior everywhere */
 .congrats-wrap {
  max-width:1100px; margin:0 auto; text-align:center
}

.congrats-wrap .u-max800{width:100%; max-width:820px; margin:0 auto; text-align:center}

.congrats-wrap .highlight{display:inline-block; margin:15px 5px !important}

.congrats-wrap{gap:12px}

.congrats-wrap br{display:block}

/* remove the double brbr spacer effect */

/* ceremony information button group:match the good group */
 #information .u-max800 {
  text-align:center !important
}

/* ceremony information buttons:keep responsive wrap like the */
 #information .u-max800 {
  text-align:center !important
}

#information .highlight{display:inline-block; margin:15px 5px !important}

/* social media section:restore v4-ish layout */
 #social {
  background-color:#ddd !important; margin-top:0 !important
}

#social .thanks-mace{max-width:1000px; margin:0 auto; padding:0 24px}

#social h2{padding-top:0 !important}

#social p{max-width:820px; margin-left:auto; margin-right:auto; text-align:center}

/* white box */
 #social .white-box,#social div[style*="border:1px solid #bbb"] {
  border:1px solid #bbb !important; border-radius:15px !important; background:#fff !important; padding:24px 30px 18px !important; margin:28px auto 18px !important; max-width:980px !important
}

/* toolkit flex row:beat the inline column styles */
 #social .bearer-wrap.toolkit {
  display:flex !important; flex-direction:row !important; flex-wrap:wrap !important; justify-content:center !important; align-items:center !important; gap:40px !important; row-gap:24px !important; padding:0 !important; margin:0 auto !important
}

#social .bearer-wrap.toolkit .col{flex:0 1 360px}

#social .bearer-wrap.toolkit img{max-width:100%; height:auto; display:block; margin:0 auto}

/* social tag block */
 #social .social-tag {
  margin:0 !important; text-align:center
}

#social .social-tag p{margin:8px 0 !important}

/* keep the gold buttons consistent override inline hover */
 #social .highlight a,#social a[style*="background-color:gold"] {
  background-color:gold !important; color:#222 !important; border:1px solid gold !important; border-radius:6px !important; font-family:'Oswald' !important; font-weight:400 !important; font-size:20px !important; padding:6px 24px !important; display:inline-block !important; text-decoration:none !important
}

#social .highlight a:hover,#social a[style*="background-color:gold"]:hover{background-color:#fff !important; color:#101010 !important; border-color:#101010 !important}

/* macebearer bios:left-align the paragraphs only */
 #macebearers p {
  text-align:left !important
}

/* fix social media white box alignment */
 .comm-home #social .white-box {
  max-width:980px; margin:0 auto; text-align:center
}

.comm-home #social .bearer-wrap.toolkit{justify-content:center; align-items:center; gap:40px}

.comm-home #social .bearer-wrap.toolkit .col{text-align:center}

.comm-home #social .bearer-wrap.toolkit img{display:block; margin:0 auto; height:auto; max-width:100%}

.comm-home #social .social-tag{text-align:center}

.comm-home #social .social-tag p{text-align:center; margin-left:auto; margin-right:auto}

/* ensure bordered callout boxes span full content width */
 .comm-home #future .congrats-wrap>div[style*="border"] {
  width:100%; box-sizing:border-box; max-width:1100px; margin-left:auto; margin-right:auto
}

/* center commencement-related stories thank you blocks */
 .comm-home #instagram-stories .related {
  text-align:center
}

.comm-home #instagram-stories .related-wrap{justify-content:center}

.comm-home #thankyou .thanks-mace{max-width:980px; margin:0 auto; text-align:center}

.comm-home #thankyou .thanks-mace p{text-align:center; margin-left:auto; margin-right:auto; max-width:900px}

/* fix:center the entire commencement ceremonies strip */
 .comm-home #ceremonies,.comm-home #ceremonies * {
  text-align:center
}

.comm-home #ceremonies .watch-interior,.comm-home #ceremonies .watch-main{margin-left:auto; margin-right:auto}

/* keep lines from getting absurdly wide */
 .comm-home #ceremonies p,.comm-home #ceremonies .watch-interior {
  max-width:900px
}

/* fix:social media white box center image caption */
 .comm-home #social .white-callout {
  margin-left:auto; margin-right:auto
}

.comm-home #social .white-callout .col{text-align:center}

.comm-home #social .white-callout img{display:block; margin:0 auto}

.comm-home #social .social-tag{text-align:center}

/* social media:ensure white callout centers image text */
 .comm-home #social .white-box,.comm-home #social .white-callout {
  max-width:980px; margin:0 auto; text-align:center
}

.comm-home #social .white-box .col,.comm-home #social .white-callout .col{text-align:center}

.comm-home #social .white-box img,.comm-home #social .white-callout img{display:block; margin:0 auto}

.comm-home #social .social-tag,.comm-home #social .social-tag p{text-align:center}

/* home:widen bordered callout boxes save the date */
 .comm-home .sub-block {
  max-width:1100px; margin-left:auto; margin-right:auto
}

.comm-home #future .congrats-wrap>div[style*="border"]{max-width:1100px; margin-left:auto; margin-right:auto}

/* ceremonies:force centering for location schedule text */
 #ceremonies .watch-main,#ceremonies .watch-interior {
  text-align:center
}

#ceremonies .watch-main p,#ceremonies .watch-interior p,#ceremonies .watch-interior h3,#ceremonies .watch-interior h4,#ceremonies .watch-interior h5{text-align:center !important; margin-left:auto; margin-right:auto}

/* social:white box centered image centered caption v4-ish */
 #social .white-box,#social .white-callout,#social .social-box {
  max-width:900px; margin:0 auto; background:#fff; border-radius:14px; padding:40px 32px; text-align:center
}

/* center the image */
 #social img {
  display:block; margin:0 auto 18px
}

/* center the text under the image */
 #social p,#social .social-tag,#social .social-tag p {
  text-align:center !important; margin-left:auto; margin-right:auto
}

/* if you have a toolkit flex wrapper keep */
 #social .bearer-wrap.toolkit {
  justify-content:center; align-items:center
}

#social .bearer-wrap.toolkit .col{text-align:center}

/* strips:consistent vertical rhythm top/bottom match */

/* one consistent vertical pad for all statement strips */
 .strip.strip-statement {
  padding-top:60px; padding-bottom:60px
}

/* prevent first/last child margins from creating fake extra */
 .strip.strip-statement>div>div>div>:first-child {
  margin-top:0
}

.strip.strip-statement>div>div>div>:last-child{margin-bottom:0}

/* if any legacy rule adds padding-top only neutralize */
 .strip.strip-statement>div>div>div {
  padding-top:0; padding-bottom:0
}

/* optional:tighten on mobile so it doesnt feel */
 @media(max-width:700px) {
  .strip.strip-statement{padding-top:42px; padding-bottom:42px}

}

/* global vertical rhythm tightening cut excess space 50 */

/* reduce strip padding */
 .strip.strip-statement {
  padding-top:36px; padding-bottom:36px
}

/* kill stacked margins at top/bottom of sections */
 .strip.strip-statement>div>div>div>:first-child {
  margin-top:0 !important
}

.strip.strip-statement>div>div>div>:last-child{margin-bottom:0 !important}

/* tighten common wrappers that were ballooning space */
 .watch-main,.congrats-wrap,.team-thanks,.attend,.flex-facts {
  padding-top:24px; padding-bottom:24px
}

/* reduce heading vertical margins safe not aggressive */
 .strip h2 {
  margin-bottom:18px
}

.strip h3{margin-bottom:14px}

.strip p{margin-bottom:14px}

/* banner bearers name readers:center college text */
 .comm-home .bearer-wrap .col {
  text-align:center
}

/* specifically ensure college lines center */
 .comm-home .bearer-wrap .col p {
  text-align:center; margin-left:auto; margin-right:auto
}

/* final patch jan 2026:banner bearers spacing box */

/* 1 center college text inside banner/name-reader cards override */
 .comm-home #macebearers .thanks-mace.banner-carrier .col,.comm-home #macebearers .thanks-mace.banner-carrier .col * {
  text-align:center
}

/* strong override for paragraphs beats macebearers p text-align:left */
 .comm-home #macebearers .thanks-mace.banner-carrier .col p {
  text-align:center !important; margin-left:auto !important; margin-right:auto !important
}

/* keep bio paragraphs elsewhere macebearer recognition bios left-aligned */
 .comm-home #macebearers .bearer-wrap:not(.banner-carrier).col p {
  text-align:left
}

/* 2 reduce vertical whitespace in banner/name-reader blocks */
 .comm-home #macebearers .thanks-mace.banner-carrier {

  /* match social white box width radius */
 max-width:900px !important; margin:18px auto !important; padding:24px 24px 18px !important; border-radius:15px !important
}

/* tighten spacing between rows/cards */
 .comm-home #macebearers .thanks-mace.banner-carrier .bearer-wrap {
  margin:12px auto 18px !important; gap:20px !important
}

/* tighten headings inside these blocks */
 .comm-home #macebearers .thanks-mace.banner-carrier h2 {
  margin-bottom:18px !important
}

.comm-home #macebearers .thanks-mace.banner-carrier h3{margin:6px 0 6px !important}

/* 3 thank you:remove extra bottom margin that */
 .comm-home #thankyou .thanks-mace {
  max-width:900px !important;
  /* align with social box width */
 margin:0 auto !important;
  /* kills margin-bottom from generic .thanks-mace */
 padding:0 24px !important;
  /* keep a little breathing room */
 text-align:left
}

.comm-home #thankyou h2{text-align:center}

.comm-home #thankyou p{text-align:left}

/* 4 save the date box:match social white */
 .comm-home #save-the-date .sub-block,.comm-home #save-the-date .sub-block-white,.comm-home #save-the-date .save-date-box,.comm-home #save-the-date .thanks-mace {
  max-width:900px; margin-left:auto; margin-right:auto; border-radius:15px
}

/* if save the date uses a plain bordered */
 .comm-home #save-the-date div[style*="border"] {
  max-width:900px; margin-left:auto; margin-right:auto; border-radius:15px
}

/* 5 align other boxed homepage blocks to social */
 .comm-home #social .white-box {
  max-width:900px; border-radius:15px
}

/* final patch jan 2026:banner bearers spacing box */

/* 1 center college text inside banner/name-reader cards override */
 .comm-home #macebearers .thanks-mace.banner-carrier .col,.comm-home #macebearers .thanks-mace.banner-carrier .col * {
  text-align:center
}

/* strong override for paragraphs beats macebearers p text-align:left */
 .comm-home #macebearers .thanks-mace.banner-carrier .col p {
  text-align:center !important; margin-left:auto !important; margin-right:auto !important
}

/* keep bio paragraphs elsewhere macebearer recognition bios left-aligned */
 .comm-home #macebearers .bearer-wrap:not(.banner-carrier).col p {
  text-align:left
}

/* 2 reduce vertical whitespace in banner/name-reader blocks */
 .comm-home #macebearers .thanks-mace.banner-carrier {

  /* match social white box width radius */
 max-width:900px !important; margin:18px auto !important; padding:24px 24px 18px !important; border-radius:15px !important
}

/* tighten spacing between rows/cards */
 .comm-home #macebearers .thanks-mace.banner-carrier .bearer-wrap {
  margin:12px auto 18px !important; gap:20px !important
}

/* tighten headings inside these blocks */
 .comm-home #macebearers .thanks-mace.banner-carrier h2 {
  margin-bottom:18px !important
}

.comm-home #macebearers .thanks-mace.banner-carrier h3{margin:6px 0 6px !important}

/* 3 thank you:remove extra bottom margin that */
 .comm-home #thankyou .thanks-mace {
  max-width:900px !important;
  /* align with social box width */
 margin:0 auto !important;
  /* kills margin-bottom from generic .thanks-mace */
 padding:0 24px !important;
  /* keep a little breathing room */
 text-align:left
}

.comm-home #thankyou h2{text-align:center}

.comm-home #thankyou p{text-align:left}

/* 4 save the date box:match social white */
 .comm-home #save-the-date .sub-block,.comm-home #save-the-date .sub-block-white,.comm-home #save-the-date .save-date-box,.comm-home #save-the-date .thanks-mace {
  max-width:900px; margin-left:auto; margin-right:auto; border-radius:15px
}

/* if save the date uses a plain bordered */
 .comm-home #save-the-date div[style*="border"] {
  max-width:900px; margin-left:auto; margin-right:auto; border-radius:15px
}

/* 5 align other boxed homepage blocks to social */
 .comm-home #social .white-box {
  max-width:900px; border-radius:15px
}

/* utilities callouts shared width/radius */
 .u-max1100 {
  max-width:1000px; width:min(1000px,calc(100% - 48px)); margin-left:auto; margin-right:auto
}

.callout{background:#fff; border-radius:14px; padding:28px 28px 24px}

.callout--outline{background:transparent; border:2.3px solid #fff}

.callout-title{margin:0 0 12px; text-align:center}

.callout-subtitle{margin:0 0 18px; text-align:center}

/* banner bearers name readers:center college lines */
 .comm-home .thanks-mace.banner-carrier {
  max-width:1100px;
  /* match social media white box */
}

.comm-home .thanks-mace.banner-carrier .bearer-wrap,.comm-home .thanks-mace.banner-carrier .col{text-align:center}

.comm-home .thanks-mace.banner-carrier p{text-align:center !important; margin-left:auto; margin-right:auto}

/* keep bios in macebearer recognition left-aligned */
 .comm-home #macebearers .thanks-mace:not(.banner-carrier)p {
  text-align:left
}

/* social toolkit:tighten vertical gaps inside white box */
 .comm-home #social .bearer-wrap.toolkit {
  gap:18px
}

.comm-home #social .bearer-wrap.toolkit .col{margin:0; padding:0}

.comm-home #social .bearer-wrap.toolkit p{margin:10px 0 0}

/* thank you strip:even top/bottom spacing */
 .comm-home #future .team-thanks {
  padding:0
}

.comm-home #future .team-thanks p{margin:0 0 14px}

.comm-home #future .callout{margin:0 auto 30px}

/* also apply on interior pages that use the */
 .thanks-mace.banner-carrier .bearer-wrap,.thanks-mace.banner-carrier .col {
  text-align:center
}

.thanks-mace.banner-carrier p{text-align:center !important; margin-left:auto; margin-right:auto}

/* social media toolkit spacing cleanup desktop mobile */
 #social .thanks-mace>p {
  margin:10px 0 18px
}

#social .thanks-mace>p+p{margin-top:0}

/* keeps the two intro paragraphs tight */
 #social .thanks-mace h3 {
  margin:14px 0 10px; line-height:1.15
}

#social .thanks-mace .highlight{margin:10px 0 !important}

/* white toolkit box matches your inline border box */
 #social .thanks-mace>div[style*="border:1px solid"] {
  padding:18px 30px 18px !important
}

/* toolkit stack:button - image - tag copy */
 #social .bearer-wrap.toolkit {
  padding:0 !important; margin:0 !important; gap:0 !important; row-gap:0 !important
}

#social .bearer-wrap.toolkit .col{margin:0 !important; padding:0 !important}

#social .bearer-wrap.toolkit img{display:block !important; width:100%; max-width:900px; height:auto; margin:12px auto 12px !important}

/* this was the real culprit:global .social-tag padding */
 #social .social-tag {
  padding:12px 12px 0 !important; margin:0 auto !important; max-width:768px
}

#social .social-tag p{margin:8px 0 !important}

#social .social-tag p.lead{margin:8px 0 !important; line-height:1.35 !important}

/* tighten on very small screens */
 @media(max-width:600px) {
  #social .thanks-mace h2{padding-top:36px !important}

  /* your inline is 55px */
 #social .thanks-mace>div[style*="border:1px solid"] {
    padding:16px 18px 16px !important
  }
  #social .bearer-wrap.toolkit img{margin:10px auto 10px !important}

  #social .social-tag{padding:10px 12px 0 !important}

}

/* digital toolkit:kill the flex:1 space-eater and tighten */
 #social .bearer-wrap.toolkit {
  margin:0 auto !important; padding:0 !important; gap:0 !important; row-gap:0 !important
}

#social .bearer-wrap.toolkit .col{flex:0 0 auto !important; /* -- this is the money line */ padding:0 !important; margin:0 !important; width:100%}

#social .bearer-wrap.toolkit img{display:block; max-width:100%; height:auto; margin:10px auto 10px !important}

#social .bearer-wrap.toolkit .social-tag{margin:8px 0 0 !important; padding:0 !important}

/* digital toolkit button spacing parity */
 #social .highlight {
  margin:12px 0 !important;
  /* matches fb button rhythm */
}

/* tighten space above and below the toolkit button */
 #social .highlight a {
  margin:0 !important
}

/* white box padding balance */
 #social .strip-statement>div>div[style*="background:#fff"] {
  padding-top:24px !important; padding-bottom:28px !important;
  /* slightly more than top visual balance */
}

/* ensure no extra space sneaks in after social */
 #social .social-tag {
  margin-bottom:0 !important
}

/* social:normalize centering spacing */
 #social>.thanks-mace {
  max-width:1000px; margin:0 auto; padding:0 24px 24px; text-align:center; box-sizing:border-box
}

#social .toolkit-box{padding:24px 30px 28px; /* bottom slightly bigger than top */}

#social .toolkit-box h3{margin:0 0 12px}

#social .highlight.u-ib-m15-5{margin:15px 5px !important; /* matches your other button spacing */}

#social .toolkit img{margin:10px auto 8px !important}

#social .social-tag{margin:10px 0 0 !important}

@media(max-width:600px) {
  #social .toolkit-box{padding:18px 18px 22px}

}

/* social / digital toolkit spacing centering fixes */
 #social .thanks-mace {
  max-width:900px;
  /* prevents the pushed left feel on wide screens */
 margin:0 auto; text-align:center
}

/* the two paragraphs above the white box:keep */
 #social .thanks-mace>p {
  margin-left:auto; margin-right:auto; max-width:72ch
}

/* white box:make padding symmetric consistent */
 #social .toolkit-box {
  padding:24px 30px;
  /* fixes bottom being tighter than top */
}

/* kill default h3 margins that create the big */
 #social .toolkit-box h3 {
  margin:0 0 12px
}

/* match the top button spacing style */
 #social .toolkit-cta {
  margin:6px 0 12px !important
}

#social .toolkit-cta a{margin:0 !important; /* your inline anchor margin was adding extra air */}

/* image tag block spacing:tighten the ginormous gap */
 #social .bearer-wrap.toolkit {
  margin:0 !important; padding:0 !important; gap:0 !important
}

#social .bearer-wrap.toolkit img{display:block !important; margin:10px auto 10px !important; max-width:100%; height:auto}

/* social tag text block:keep it snug */
 #social .social-tag {
  margin:0 !important; padding:0 0 6px !important
}

#social .social-tag .lead{margin:0 0 6px !important}

/* mobile:slightly tighter still */
 @media(max-width:600px) {
  #social .toolkit-box{padding:20px 18px}

  #social .bearer-wrap.toolkit img{margin:8px auto 8px !important}

}

/* social digital toolkit spacing fixes */

/* keep the two intro paragraphs centered not pushed */
 #social .thanks-mace {
  text-align:center
}

#social .thanks-mace>p{max-width:900px; margin-left:auto; margin-right:auto}

/* tighten the white box overall give it a */
 #social .toolkit-box {
  padding:18px 30px 26px !important;
  /* bottom slightly larger than top */
}

/* kill default h3 margins causing extra air */
 #social .toolkit-box h3 {
  margin:0 0 12px !important
}

/* make the toolkit button breathe like the facebook */
 #social .toolkit-box .highlight {
  margin:6px 0 !important
}

#social .toolkit-box .highlight a{margin:6px 0 !important; /* matches your inline anchor spacing */}

/* the real villain:global .social-tag padding */
 #social .toolkit-box .social-tag {
  padding:10px 12px 16px !important;
  /* was 48px 12px */
 margin:0 auto !important
}

/* make sure the last line and tag doesnt */
 #social .toolkit-box .social-tag p:last-child {
  margin-bottom:0 !important
}

/* optional:tighten image spacing just a hair */
 #social .toolkit-box .bearer-wrap.toolkit img {
  margin:6px auto 10px !important
}

/* mobile centering fix banner carriers name readers */
 @media(max-width:600px) {
  .thanks-mace.banner-carrier{padding-left:0; padding-right:0}

  .thanks-mace.banner-carrier .bearer-wrap{padding-left:24px; padding-right:24px}

}

/* social / digital toolkit spacing centering */
 #social .thanks-mace>p {
  text-align:center; margin-left:auto; margin-right:auto
}

#social .toolkit-box{padding:16px 30px 24px !important}

#social .toolkit-box h3{margin:12px 0 12px}

#social .toolkit-box .highlight{margin:6px 0 12px !important}

#social .toolkit-box .highlight a{margin:6px 0 !important}

#social .toolkit-box .bearer-wrap.toolkit{margin:0 !important; padding:0 !important}

#social .toolkit-box .bearer-wrap.toolkit img{display:block; margin:10px auto 8px !important}

#social .toolkit-box .social-tag{margin:8px 0 0 !important; padding:0 !important}

#social .toolkit-box .social-tag p{margin-left:auto; margin-right:auto}

#social .toolkit-box .social-tag p:last-child{margin-bottom:0 !important}

/* scoped cta spacing only affects social section */
 #social a.cta-btn {
  margin:10px 0 18px !important
}

#social .toolkit-box a.cta-btn{margin:14px 0 18px !important}

/* give the toolkit box a balanced bottom cushion */
 #social .toolkit-box {
  padding-bottom:24px !important
}

/* ensure last line in social-tag doesnt smash the */
 #social .toolkit-box .social-tag {
  margin-top:10px !important
}

/* commencement hero:match /commencement/ exactly */
 #skip-to .strip.strip-header {
  position:relative; width:100%; height:calc(100vh - 320px); min-height:220px; background:#000; overflow:hidden
}

#skip-to .strip.strip-header .text{position:absolute !important; left:20% !important; top:85% !important; width:80% !important; transform:translate(-12.5%,-50%)!important; text-align:center !important; z-index:300 !important; background:transparent !important; padding:0 !important}

#skip-to .strip.strip-header .text h1{font-family:"Passion One" !important; font-size:2.7em !important; line-height:.8em !important; margin:0 0 12px !important; letter-spacing:0.02em !important; text-shadow:1px 1px 4px rgba(0,0,0,.4)!important; color:#fff !important}

#skip-to .strip.strip-header .text h2{font-family:"Oswald" !important; font-size:2em !important; line-height:1.3em !important; margin:0 0 24px !important; text-shadow:1px 1px 4px rgba(0,0,0,.4)!important; color:#fff !important}

/* breakpoints exactly like the live stylesheet */
 @media all and(min-width:480px) {
  #skip-to .strip.strip-header .text h1{font-size:3em !important; line-height:1em !important}

}

@media all and(min-width:600px) {
  #skip-to .strip.strip-header .text h1{font-size:4.5em !important; line-height:.9em !important}

}

@media all and(min-width:768px) {
  #skip-to .strip.strip-header{height:calc(100vh - 178px)!important}

}

@media all and(min-width:800px) {
  #skip-to .strip.strip-header .text h1{font-size:5.5em !important; line-height:.9em !important}

}

@media all and(min-width:1000px) {
  #skip-to .strip.strip-header .text h1{font-size:6em !important; line-height:.8em !important}

}

/* mobile centering fix for macebearers/banner-carrier blocks */
 @media(max-width:600px) {

  /* make these wrappers truly full-width and centered */
 #macebearers .thanks-mace,#macebearers .thanks-mace.banner-carrier,#macebearers .thanks-mace.u-max1100 {
    width:100% !important; max-width:100% !important; margin-left:auto !important; margin-right:auto !important; box-sizing:border-box
  }

  /* keep outer padding consistent this is the frame */
 #macebearers .thanks-mace,#macebearers .thanks-mace.u-max1100 {
    padding-left:12px !important; padding-right:12px !important
  }
  #macebearers .thanks-mace.banner-carrier{padding-left:24px !important; padding-right:24px !important}

  /* strip padding/width tricks off the inner flex wrap */
 #macebearers .bearer-wrap {
    width:100% !important; max-width:100% !important; margin-left:auto !important; margin-right:auto !important; padding-left:0 !important; padding-right:0 !important; box-sizing:border-box
  }

  /* safety:prevent weird min-width pushing */
 #macebearers .bearer-wrap .col {
    min-width:0; box-sizing:border-box
  }

  /* safety:images never push layout */
 #macebearers img {
    max-width:100%; height:auto
  }

}

/* mobile centering overflow guard macebearers section */
 #macebearers .thanks-mace,#macebearers .thanks-mace * {
  box-sizing:border-box
}

/* match centered inset width 24px gutters */
 #macebearers .thanks-mace.banner-carrier {
  width:min(1000px,calc(100% - 48px)); margin-left:auto; margin-right:auto
}

/* extra small screens:tighten gutters */
 @media(max-width:360px) {
  #macebearers .thanks-mace.banner-carrier{width:min(1000px,calc(100% - 32px))}

}

/* fix:keep macebearer banner bearers name readers centered */
 @media(max-width:1024px) {

  /* outer region:kill any inherited column shove */
 #skip-to #macebearers {
    margin-left:0 !important; margin-right:0 !important; width:100% !important
  }

  /* force these wrappers to truly center and not */
 #skip-to #macebearers .thanks-mace,#skip-to #macebearers .thanks-mace.banner-carrier,#skip-to #macebearers .thanks-mace.u-max1100 {
    width:100% !important; max-width:100% !important; margin-left:auto !important; margin-right:auto !important; box-sizing:border-box !important
  }

  /* consistent frame padding so it looks centered */
 #skip-to #macebearers .thanks-mace,#skip-to #macebearers .thanks-mace.u-max1100 {
    padding-left:12px !important; padding-right:12px !important
  }
  #skip-to #macebearers .thanks-mace.banner-carrier{padding-left:20px !important; padding-right:20px !important}

  /* stop inner layout from using old max-widths that */
 #skip-to #macebearers .bearer-wrap {
    width:100% !important; max-width:100% !important; margin-left:auto !important; margin-right:auto !important; padding-left:0 !important; padding-right:0 !important; box-sizing:border-box !important
  }

  /* center everything in these blocks by default */
 #skip-to #macebearers .thanks-mace,#skip-to #macebearers .thanks-mace.banner-carrier {
    text-align:center
  }

  /* except the two things you asked to keep */
 #skip-to #macebearers .thanks-mace .bearer-wrap .col p,#skip-to #macebearers .thanks-mace .bearer-wrap .col p em,#skip-to #macebearers #mace .watch-main,#skip-to #macebearers #mace p {
    text-align:left !important
  }

}

/* tighten spacing on the congrats block the strip */
 #skip-to .strip.strip-header+.strip.strip-statement.dark-bg {
  padding-top:36px !important; padding-bottom:48px !important
}

/* that block also has its own inner padding */
 #skip-to .strip.strip-header+.strip.strip-statement.dark-bg .congrats-wrap {
  padding-top:0px !important; padding-bottom:0px !important
}

/* commencement-related stories:center the block */
 #skip-to .related {
  margin:0 auto !important; max-width:1200px !important;
  /* optional:match other strips */
}

#skip-to .related>h2{text-align:center !important; margin-top:0 !important}

/* center the two-story row within the strip */
 #skip-to ul.related-wrap {
  justify-content:center !important; gap:24px;
  /* modern spacing instead of margin-right */
 padding-left:0 !important; margin:0 !important
}

/* remove the old asymmetric spacing */
 #skip-to ul.related-wrap li {
  margin-right:0 !important; margin-bottom:24px !important
}

/* keep story title meta left aligned */
 #skip-to ul.related-wrap li h3,#skip-to ul.related-wrap li p {
  text-align:left !important
}

/* mobile:center the commencement-related stories block */
 @media(max-width:768px) {

  /* kill any leftover ul indentation */
 #skip-to .related ul.related-wrap {
    padding-left:0 !important; margin-left:0 !important; list-style:none !important; display:flex !important; flex-direction:column !important; align-items:center !important;
    /* -- key:centers the card */
  }

  /* center the card itself in the strip */
 #skip-to .related ul.related-wrap li {
    width:100% !important; max-width:650px !important;
    /* matches your visual card width */
 margin-left:auto !important; margin-right:auto !important
  }

  /* make sure the image block isnt inheriting weird */
 #skip-to .related ul.related-wrap li img {
    display:block !important; margin-left:auto !important; margin-right:auto !important
  }

  /* title centered story text left */
 #skip-to .related>h2 {
    text-align:center !important
  }
  #skip-to .related ul.related-wrap li h3,#skip-to .related ul.related-wrap li p{text-align:left !important}

}

@media(max-width:768px) {
  #skip-to .related{padding-left:12px !important; padding-right:12px !important}

}

/* commencement-related stories:center the group */

/* center the h2 */
 .comm-home .related>h2,.related>h2 {
  text-align:center !important
}

/* make the list a centered flex group with */
 .comm-home ul.related-wrap,ul.related-wrap {
  display:flex !important; flex-wrap:wrap !important; justify-content:center !important;
  /* -- centers the two cards as a group */
 gap:24px !important;
  /* -- symmetric spacing */
 padding:0 !important;
  /* kill default ul indent */
 margin:0 auto !important;
  /* center the ul itself if it has a */
 list-style:none !important; box-sizing:border-box !important
}

/* kill the old one-sided spacing that makes it */
 .comm-home ul.related-wrap>li,ul.related-wrap>li {
  margin:0 !important;
  /* removes margin-right:24px and friends */
 box-sizing:border-box !important
}

/* keep story title date left-aligned */
 .comm-home ul.related-wrap h3,.comm-home ul.related-wrap p,ul.related-wrap h3,ul.related-wrap p {
  text-align:left !important
}

/* mobile:center the single card block within the */
 @media(max-width:768px) {
  .comm-home ul.related-wrap,ul.related-wrap{flex-direction:column !important; align-items:center !important; /* -- centers the li block */}

  .comm-home ul.related-wrap>li,ul.related-wrap>li{width:100% !important; max-width:650px !important; margin-left:auto !important; margin-right:auto !important}

}

/* commencement info subpage header only */

/* h1 typography */
 #skip-to.commencement-info-subpage .strip-header h1 {
  font-family:"Oswald",Arial,Helvetica,sans-serif; font-size:80px; font-weight:400; line-height:1.05; letter-spacing:0.02em
}

/* match hero image height to live info page */
 #skip-to.commencement-info-subpage .strip-header {
  min-height:420px;
  /* matches commencement-info.php */
}

#skip-to.commencement-info-subpage .strip-header .image{min-height:420px}

/* bullet list fix indent spacing */
 #skip-to.commencement-info-subpage ul {
  list-style:disc outside; padding-left:32px;
  /* restores proper indent */
 margin:16px 0 32px
}

#skip-to.commencement-info-subpage li{margin:12px 0}

/* commencement info subpage fixes scoped safe */

/* --- h1:oswald only as requested --- */
 #skip-to.commencement-info-subpage .strip-header h1 {
  font-family:"Oswald",Arial,Helvetica,sans-serif; font-size:80px; font-weight:400; line-height:1.05; letter-spacing:0.02em
}

/* --- hero height:force the background-image container --- */

/* adjust 420px if needed once we see it */
 #skip-to.commencement-info-subpage .strip-header .image {
  height:420px; min-height:420px; background-size:cover; background-position:center
}

/* --- bullets:apply only to main content not */

/* keep your indent fix but narrow it to */
 #skip-to.commencement-info-subpage .strip-statement ul,#skip-to.commencement-info-subpage .strip-content ul,#skip-to.commencement-info-subpage main ul {
  list-style:disc outside; padding-left:32px; margin:16px 0 32px
}

#skip-to.commencement-info-subpage .strip-statement li,#skip-to.commencement-info-subpage .strip-content li,#skip-to.commencement-info-subpage main li{margin:12px 0}

/* --- footer:undo any list indentation damage center */
 #skip-to.commencement-info-subpage footer ul {
  padding-left:0 !important; margin-left:0 !important
}

#skip-to.commencement-info-subpage footer .footer-logo,#skip-to.commencement-info-subpage footer .logo{text-align:center}

#skip-to.commencement-info-subpage footer .footer-logo img,#skip-to.commencement-info-subpage footer .logo img{display:block; margin:0 auto}

/* footer:protect it from list resets center the */

/* stop content list patches from affecting footer lists */
 footer ul,footer ol {
  padding-left:0 !important; margin-left:0 !important; list-style:none !important
}

/* if footer has nav lists that should keep */

/* center footer logo reliably */
 footer .logo,footer .footer-logo,footer .footer-brand {
  text-align:center !important
}

footer .logo img,footer .footer-logo img,footer .footer-brand img{display:block !important; margin:0 auto !important}

/* footer:protect it from list resets center the */

/* stop content list patches from affecting footer lists */
 footer ul,footer ol {
  padding-left:0 !important; margin-left:0 !important; list-style:none !important
}

/* if footer has nav lists that should keep */

/* center footer logo reliably */
 footer .logo,footer .footer-logo,footer .footer-brand {
  text-align:center !important
}

footer .logo img,footer .footer-logo img,footer .footer-brand img{display:block !important; margin:0 auto !important}

/* commencement hero:keep home full hero make subpages */

/* home:keep the big hero behavior full-ish height */
 #skip-to.commencement-home .strip.strip-header {
  height:calc(100vh - 320px); min-height:220px
}

/* subpages:match legacy info page hero height */
 #skip-to.commencement-subpage .strip.strip-header {
  height:320px; min-height:320px
}

/* subpages:only the h1 changes oswald 80px / */
 #skip-to.commencement-subpage .strip.strip-header .text h1 {
  font-family:"Oswald",Arial,sans-serif !important; font-weight:400 !important; font-size:80px !important; line-height:1.05 !important; letter-spacing:0.01em
}

/* responsive sanity so 80px doesnt explode on phones */
 @media(max-width:900px) {
  #skip-to.commencement-subpage .strip.strip-header .text h1{font-size:56px !important}

}

@media(max-width:600px) {
  #skip-to.commencement-subpage .strip.strip-header .text h1{font-size:40px !important}

}

/* lists:fix bullet indent only in content area */
 #skip-to .column-two-02 ul,#skip-to .strip-statement ul,#skip-to .strip ul {
  list-style-position:outside; padding-left:1.25em; margin-left:0
}

#skip-to .column-two-02 li,#skip-to .strip-statement li,#skip-to .strip li{margin-left:0}

/* footer:center logo avoid list/bullet side effects */
 #skip-to footer img {
  display:block; margin-left:auto; margin-right:auto
}

/* last-word overrides subpages only */

/* 1 subpages:force hero height oswald h1 */
 #skip-to.commencement-subpage .strip.strip-header {
  height:420px !important; min-height:420px !important
}

#skip-to.commencement-subpage .strip.strip-header .image{height:420px !important}

#skip-to.commencement-subpage .strip.strip-header .text h1{font-family:"Oswald",Arial,Helvetica,sans-serif !important; font-size:80px !important; font-weight:400 !important; line-height:1.05 !important}

/* 2 subpage hero images:use each sections real */
 #skip-to.commencement-info-subpage .strip.strip-header .image.image-019 {
  background:#000 url(../information/_images/_slideshow/019.jpg) center center / cover no-repeat !important
}

#skip-to.commencement-candidates-subpage .strip.strip-header .image.image-019{background:#000 url(../fall-2025-candidates/_images/_slideshow/019.jpg) center center / cover no-repeat !important}

#skip-to.commencement-toolkit-subpage .strip.strip-header .image.image-029{background:#000 url(../digital-toolkit/_images/_slideshow/029.jpg) center center / cover no-repeat !important}

/* 4 candidates page:remove bullets from name lists */
 #skip-to.commencement-candidates-subpage h4+ul,#skip-to.commencement-candidates-subpage h5+ul {
  list-style:none !important; padding-left:0 !important; margin-left:0 !important
}

#skip-to.commencement-candidates-subpage h4+ul>li,#skip-to.commencement-candidates-subpage h5+ul>li{margin:6px 0 !important}

/* 5 toolkit:keep gifs on one line on */
 @media(min-width:900px) {
  #skip-to.commencement-toolkit-subpage .media-grid--gifs{grid-template-columns:repeat(3,1fr)!important; gap:16px !important}

  #skip-to.commencement-toolkit-subpage .media-grid--gifs img{max-width:320px !important}

}

/* 6 footer:stop list styles bleeding center logo */
 #skip-to footer ul,#skip-to footer ol {
  padding-left:0 !important; margin-left:0 !important; list-style:none !important
}

#skip-to footer img{display:block !important; margin:0 auto !important}

/* final overrides safe subpage-scoped */

/* subpage hero h1:dial down on phones */
 @media(max-width:900px) {
  #skip-to.commencement-subpage .strip.strip-header .text h1{font-size:52px !important}

}

@media(max-width:600px) {
  #skip-to.commencement-subpage .strip.strip-header .text h1{font-size:34px !important}

}

@media(max-width:420px) {
  #skip-to.commencement-subpage .strip.strip-header .text h1{font-size:30px !important}

}

/* toolkit gifs:prevent overflow keep 3-up on desktop */
 @media(min-width:900px) {
  #skip-to.commencement-toolkit-subpage .media-grid--gifs{grid-template-columns:repeat(3,minmax(0,1fr))!important}

  #skip-to.commencement-toolkit-subpage .media-grid--gifs img{width:100% !important; max-width:100% !important; height:auto !important}

}

/* patch:stop hero h1 clipping on subpages mid */
 @media(max-width:1100px) {
  #skip-to.commencement-subpage .strip.strip-header{height:auto !important; min-height:420px !important; overflow:visible !important; padding-bottom:24px}

  #skip-to.commencement-subpage .strip.strip-header .text{left:50% !important; top:50% !important; width:100% !important; transform:translate(-50%,-50%)!important; padding:0 16px !important; text-align:center}

  #skip-to.commencement-subpage .strip.strip-header .text h1{font-size:clamp(34px,6vw,56px)!important; line-height:1.05 !important; overflow-wrap:anywhere; text-wrap:balance; margin:0}

}

/* final:center hero title within the exposed image */
 #skip-to.commencement-subpage .strip.strip-header .text {
  position:absolute !important; left:50% !important; top:50% !important;
  /* center vertically in the hero */
 width:100% !important; transform:translate(-50%,-50%)!important; padding:0 16px !important; text-align:center !important
}

#skip-to.commencement-subpage .strip.strip-header .text h1{margin:0 !important; text-align:center !important; overflow-wrap:anywhere; text-wrap:balance}

/* home hero fix:center h1 horizontally prevent clipping */
 #skip-to.commencement-home .strip.strip-header {
  position:relative; overflow:visible;
  /* prevent h1 clipping */
}

#skip-to.commencement-home .strip.strip-header .text{position:absolute !important; left:50% !important; top:68% !important; width:100% !important; transform:translate(-50%,-50%)!important; padding:0 16px !important; text-align:center !important}

#skip-to.commencement-home .strip.strip-header .text h1{text-align:center !important; margin:0 !important; line-height:1.05}

/* gold date/subhead stays centered under h1 */
 #skip-to.commencement-home .strip.strip-header .text h2 {
  text-align:center !important
}

/* about:bullets spacing that ignore global ol/ul resets */
 #skip-to #about .watch-main ul {
  max-width:720px; margin:20px auto !important; padding-left:0 !important
}

#skip-to #about .watch-main ul li{position:relative; padding-left:1.35em; /* bullet indent */ margin:0 0 12px 0 !important; /* spacing between bullets */ font-size:inherit !important; /* match paragraph */ line-height:1.5 !important}

#skip-to #about .watch-main ul li::before{content:"•"; position:absolute; left:0; top:0.05em; /* nudge to align with text */}

#skip-to #about .watch-main ul li:last-child{margin-bottom:0 !important}

/* home about final:lock about bullets to same */
 #skip-to.commencement-home #about .watch-main ul.about-list {
  max-width:720px !important; width:100% !important; margin:20px auto !important; padding-left:40px !important; box-sizing:border-box !important; list-style:disc outside !important; font-size:18px !important; line-height:1.5 !important
}

#skip-to.commencement-home #about .watch-main ul.about-list>li{margin:0 0 12px 0 !important}

#skip-to.commencement-home #about .watch-main ul.about-list>li:last-child{margin-bottom:0 !important}

/* home hero h1 size */
#skip-to.commencement-home .strip-header .text h1{
  font-size: 96px !important;
  line-height: 1.05 !important;
}

@media (max-width: 768px){
  #skip-to.commencement-home .strip-header .text h1{
    font-size: 48px !important;
  }
}

/* =========================================================
   INFO page only — force paragraph spacing
   ========================================================= */
#skip-to.commencement-info-subpage .strip p,
#skip-to.commencement-info-subpage .strip-text p,
#skip-to.commencement-info-subpage .strip-content p,
#skip-to.commencement-info-subpage .watch-main p{
  margin-bottom: 16px !important;
}

@media (max-width: 768px){
  #skip-to.commencement-info-subpage .strip p,
  #skip-to.commencement-info-subpage .strip-text p,
  #skip-to.commencement-info-subpage .strip-content p,
  #skip-to.commencement-info-subpage .watch-main p{
    margin-bottom: 22px !important;
  }
}

/* =========================================================
   Fix extra spacing around nested circle lists (robust)
   ========================================================= */

/* Any circle sub-list: remove default bottom margin */
#skip-to ul[style*="list-style-type:circle"]{
  margin-bottom: 0 !important;
}

/* Nested ULs generally: keep tight, no extra bottom gap */
#skip-to ul ul{
  margin-bottom: 0 !important;
}

/* If a sublist is the last thing in a bullet, don't add extra space */
#skip-to li > ul:last-child{
  margin-bottom: 0 !important;
}

/* After a main list block, restore normal spacing before the following paragraph */
#skip-to ul[style*="padding-left:40px"] + p{
  margin-top: 12px !important;
}

/* =========================================================
   HOME only: h5 should be 20 / 600 (override legacy !important)
   ========================================================= */
#skip-to.commencement-home .strip.strip-text h5,
#skip-to.commencement-home .strip.strip-statement h5,
#skip-to.commencement-home .main-content-00 h5,
#skip-to.commencement-home .watch-main h5{
  font-size:20px !important;
  font-weight:600 !important;
}
