@import url("/Portals/_default/PortalDefaults.css");
@import url('https://fonts.googleapis.com/css?family=Open Sans|Raleway');

.header_bg .dnn_layout {
    width: 100% !important;
}

#dnn_dnnLOGO_imgLogo {
    max-height: 70%;
}

.tilegrid .album .subalbumlogo, .tilegrid .album .albumlogo, .tilegrid .album .albumshadow1, .tilegrid .album .albumshadow2, .tilegrid .album .albumshadow3, .tilegrid .album .albumshadow4, .tilegrid .album .albumshadow5, .tilegrid .album .albumshadow6 
{
    width: 204px !important;
    height: 204px !important;
}


.symposiumVids .col-sm-6
{
	margin-bottom:30px;
}

.breadcrumb_box .breadcrumb_top a {
    border: 3px solid #ffffff !important;
}

#frontIconsList{
	margin: auto;
	padding: 0;
	text-align: center;
}
 
li.frontIcon {
	 position: relative;
	 bottom: 20px;
	 left: -10px;
	 width: 140px;
	 height: 100px;
	 margin: 90px 4% 0 4%;
	 display: inline-block;
	 padding: 0px !important;
	 content-align: center;
 }
 
.frontIcon h2{
	position: absolute;
    top: -70%;
    right: -16%;
    font-size: 16px;
    width: 110%;
}

.frontIcon p{
	font-size: medium;
	padding-top: 30px;
	margin: 10px;
	text-align: left;
	width: 110%;
}
 
.frontIcon::before,.frontIcon::after{
		position: absolute;
}
 
.frontIcon::before{
	top: -30px;
	left: 30px;
}

.frontIcon::after{
	top: -30px;
	right: -5px;
}
 
 .frontIcon img {
	position: absolute;
    height: 60px;
    width: 60px;
    top: -12px;
    left: 58px;
}
 
.withDesigns::before{
	position: relative;
	content: url(img/oliveBranchBeforeSmall.png);
	left: -10px;
	top: 30px;
}

.withDesigns::after{
	position: relative;
	content: url(img/oliveBranchAfterSmall.png);
	right: -10px;
	top: 30px;
}

.withStar::after{
	display: inline;
	margin: 0 20px;
	content: url(img/star.png);
}

		
.frontIcon::before{
	content: url('/portals/sdc/images/oliveBranchBefore.png');
}
.frontIcon::after{
	content: url('/portals/sdc/images/oliveBranchAfter.png');
}
	
#dnn_ctr872_dnnTITLE10_titleLabel
{
    display:none !important;
}

/* ===== Rio Hero styles ===== */
.rio-hero{
  --hero-height: 72vh;                     /* adjust section height */
  position:relative;
  min-height:var(--hero-height);
  display:flex; align-items:center;
  color:#fff;
  background-image:var(--hero-img);
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;             /* desktop parallax */
  overflow:hidden;
}

/* Right-side dark gradient to improve legibility
.rio-hero:before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(90deg,
              rgba(0,0,0,.05) 0%,
              rgba(0,0,0,.20) 45%,
              rgba(0,0,0,.45) 65%,
              rgba(0,0,0,.60) 100%);
  pointer-events:none;
} */

/* Optional translucent panel directly behind the text for extra contrast */
.hero-panel{
  background:rgba(0,0,0,.35);
  /* nice if supported; harmless elsewhere */
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  border-radius:12px;
  padding:22px 26px;
}

/* Heading */
.hero-title{
  margin:0 0 12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:1px;
  line-height:1.15;
  /* add a small white bar like the sample
  position:relative; padding-left:18px; */
  color:White !important;
  font-size:40px;
}
/*.hero-title:before{
  content:""; position:absolute; left:0; top:.2em;
  width:4px; height:1.1em; background:#fff; border-radius:2px;
}*/

/* Body text + button */
.rio-hero p{ margin:0 0 12px; line-height:1.6; }
.btn-hero{
  display:inline-block;
  color:#fff !important; border:2px solid #fff; background:transparent;
  padding:10px 22px; border-radius:999px; font-weight:700;
  text-decoration:none;
}
.btn-hero:hover,.btn-hero:focus{ background:#fff; color:#0b5dbb !important; }

/* Mobile tweaks: disable fixed-attachment and reduce height */
@media (max-width: 991px){
  .rio-hero{
    background-attachment:scroll;          /* iOS/Android fix */
    min-height:60vh;
  }
  .hero-panel{ padding:18px 20px; }
}


.carousel_2 .item .img_box img {
    border-radius: 18px;
}

.header_top .ht_right {
    height: 60px;
    overflow: hidden;
}


/* =========================
   SPONSOR LOGO TICKER
   ========================= */

.sponsorTicker{
  position: relative;
  background: #ffffff;
  border: 0px solid rgba(17, 24, 39, 0.10);
  border-radius: 16px;
  padding: 50px 0 60px 0;
  overflow: hidden;
}

/* Soft fades at edges (looks premium, hides loop edges) */
.sponsorTicker__fade{
  position:absolute;
  top:0; bottom:0;
  width: 90px;
  z-index: 2;
  pointer-events:none;
}
.sponsorTicker__fade--left{
  left:0;
  background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.sponsorTicker__fade--right{
  right:0;
  background: linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}

.sponsorTicker__viewport{
  overflow:hidden;
}

.sponsorTicker__track{
  display:flex;
  width: max-content;
  animation: sponsorMarquee 28s linear infinite;
  will-change: transform;
}

/* Each set is one full pass worth of logos */
.sponsorTicker__set{
  display:flex;
  align-items:center;
  gap: 46px;
  padding: 0 46px;
}

/* Logo “slots” */
.sponsorTicker__logo{
  display:flex;
  align-items:center;
  justify-content:center;
  height: 90px;
  padding: 6px 0;
  text-decoration:none;
  opacity: .92;
  transition: opacity 140ms ease, transform 140ms ease;
}

.sponsorTicker__logo:hover{
  opacity: 1;
  transform: translateY(-1px);
}

/* Normalize the images so different files look consistent */
.sponsorTicker__logo img{
  height: 120px;
  width: auto;
  max-width: 250px;
  object-fit: contain;
  display:block;
  filter: grayscale(0%);
}

/* The magic: track moves left by exactly half its width (because we duplicated the set) */
@keyframes sponsorMarquee{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* Pause on hover (nice UX for reading logos) */
.sponsorTicker:hover .sponsorTicker__track{
  animation-play-state: paused;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .sponsorTicker__track{ animation: none; }
}

/* Mobile tightening */
@media (max-width: 767px){
  .sponsorTicker__fade{ width: 55px; }
  .sponsorTicker__set{ gap: 26px; padding: 0 26px; }
  .sponsorTicker__logo{ height: 74px; }
  .sponsorTicker__logo img{ height: 54px; max-width: 180px; }
}