

.sutp-accordion .pixel-corners::after {
    position: absolute;
    right: 1em;
}





.sutp__stdgrid--thumbnail {
    width: 100%;
    height: 225px;
    border: 0;
    overflow: hidden;
}

.sutp--btn-wrapper button {
  border:0;
  background:transparent;
  font-weight:600
}





.sutp--modal .modal-content {
    background: #FFEADD;
    border-radius: 1em;
    border: 0;
    margin-top: 2em;
}


.sutp-social .sutp-social--icon {
    width: 4em;
    height: 4em;
    display: block;
    padding: 0em;
}
.sutp-social {
  padding:1rem 1rem .5rem .5rem;
}

.sutp--modal .modal-content .field_links {
  display:flex;
  justify-content:center;
}

.sutp--modal .modal-content .field_links .sutp--btn-wrapper {
  margin:.5rem;
}

.sutp-dates {
  margin-left:auto;
  margin-right:auto;
}

.sutp-backdrop img {
    width: 100% !important;
}
.clan-logo img {
    width: auto !important;
}
.sutp-backdrop #block-orientation-2024-5g-content img {
    width: auto !important;
}




@media (max-width: 767px) {
 .sutp-logo > img {
    max-height: 320px;
    height: auto !important;
    width: 100% !important;
  } 
}


.sutp-dates .sutp-date1 {
  background-size: 100% auto;
  background-repeat:no-repeat;
  position:relative;
}

.sutp-dates .sutp-date2 {
  background-size: 100% auto;
  background-repeat:no-repeat;
  position:relative;
}

.sutp-dates .sutp-date3 {
  background-size: 100% auto;
  background-repeat:no-repeat;
  position:relative;
}

.sutp-dates .sutp-date1:after {
  content: " ";
  background-color:#ffb17f;
  width:100%;
  height:calc(100% - 20px);
  bottom:0px;
  left:0;
  position:absolute;
  z-index:-1;
}

.sutp-dates .sutp-date2:after {
  content: " ";
  background-color:#5ce1e6;
  width:100%;
  height:calc(100% - 20px);
  bottom:0px;
  left:0;
  position:absolute;
  z-index:-1;
}

.sutp-dates .sutp-date3:after {
  content: " ";
  background-color:#e094e4;
  width:100%;
  height:calc(100% - 20px);
  bottom:0px;
  left:0;
  position:absolute;
  z-index:-1;
}



.btn-orientation-2025 {
  background-size: 100% auto;
  background-repeat:no-repeat;
  position:relative;
  font-family:Poppins, sans-serif
}





@media screen and (max-width: 567px) {
    .sutp-main .sutp-dates div {
        padding: 1.5rem 0 1rem;
    }
}



.sutp-dates {
text-transform: uppercase;
}

/* About | Clans */
.sutp__stdgrid--thumbnail {
border-radius: 1rem;
}

/* It is spelt as LUMINA, not LUMNIA */
.sutp__about--spirits .Lumina .views-field-nothing {
background-color: rgba(163, 201, 248, .5);
border: 4px solid #A3C9F8;
border-radius: 20px;
padding: .3em;
}

/* Can add a class call clan-name for this styles? */
.sutp__about--spirits div:not(.clan-logo).display-6 > div {
text-transform: uppercase;
font-style: none;
}

/* Programme | Programme Table */
/* Support | Contacts Table */
ul.sutp-table li:last-child {
border: 0 !important;
border-radius: 0 0 1rem 1rem;
}

/* CCA CBD | Thumbnails */
/* Remove the inline background-size css for each logo */
.sutp__stdgrid--thumbnail {
border-radius: 1rem;
}

a[data-bs-toggle="modal"] .sutp__stdgrid--thumbnail > div {
background-size: 90%;
background-repeat: no-repeat;
background-color: #FFF;
-webkit-transition: background-size 0.3s ease-in-out;
transition: background-size 0.3s ease-in-out;
}

a[data-bs-toggle="modal"]:hover .sutp__stdgrid--thumbnail > div {
background-size: 95%;
}




.sutp-backdrop #block-orientation-2024-5g-content .carousel-inner img {
    width: 100% !important;
}





.btn-orientation-2025 {
  background-image:none;
  background-color:#ffb17f;
  margin-top:2rem;
  padding:1rem;
}

.btn-orientation-2025:before {
  content:" ";
  background-image:url("/sites/orientation.smu.edu.sg/files/2025/button-top.png");
  width: calc(100% + 2px);
  height:21px;
  position:absolute;
  left:-1px;
  top:-20px;
  background-repeat:no-repeat;
  background-size:100% auto;
}

.sutp-accordion .pixel-corners:before {
    background-color: #a3c9f8;
}

.sutp-accordion .accordion-body {
   overflow-wrap: break-word;   
}

@media screen and (max-width: 991px) {
    .sutp-social {
        left: auto;
      right:1rem;
    }
  .sutp-dates span {
        display: inline-block;
        margin-left: 10px;
    }
}


@media screen and (max-width: 567px) {
  .btn-orientation-2025:before {
     top:-16px;
  }
  
  .sutp-carousel .carousel-inner {
    max-width: 100%;
}
  
  .sutp-carousel .carousel-inner div[class^=col] {
    padding: 0 ;
}
  
  .sutp-carousel .sutp-carousel--image figcaption {
    position: relative;
    bottom: 1rem;
    left: 0;
    right: 0;
    margin: auto;
    color: #333;
    background-color: rgba(163, 201, 248, 0.75);
    font-size: 0.75em;
    padding: .75em;
    backdrop-filter: blur(6px);
}
  
  .sutp-carousel .sutp-carousel--image h3 {
    font-size:1.2rem;
  }
  
  .sutp-carousel {
    justify-content: flex-end;
    display: flex;
    flex-wrap: wrap;
  }
  
  .sutp-social {
  display:flex;
  flex-wrap:nowrap;
  flex-direction: row-reverse;
}

.sutp-social--icon:first-child {
  margin-left:-10px;
  margin-top:-10px;
}
  
  .sutp--btn-wrapper {
    width:100%;
  }
  .sutp-accordion .accordion-collapse {
    padding: 0 1em;
}
  .sutp__subpages p {
        text-align: center;
    }
  
}



