/* HOMEPAGE Styles */

#oppi-homepage-carousel .carousel-control-next, #oppi-homepage-carousel .carousel-control-prev {
  opacity:1;
}
#oppi-homepage-carousel .carousel-control-next-icon, #oppi-homepage-carousel .carousel-control-prev-icon {
  height:30px;
  width:30px;
   margin-bottom:65px;
}
#oppi-homepage-carousel .carousel-item .carousel-item-wrap {
  height:55vh;
  background-color: var(--huron-sky);
  }
#oppi-homepage-carousel .carousel-image {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  }
#oppi-homepage-carousel .slide-content-wrap {
  padding-left:7%;
  padding-right:7%;
}
#oppi-homepage-carousel .content-column {
  background-color: var(--huron-sky);
  color: var(--deep-lake);
  height:80%;
}
#oppi-homepage-carousel .slide-content-wrap h2 {
  color: var(--deep-lake);
  padding-bottom:10px;
  font-size: 5rem;
  line-height:52px;
}
#oppi-homepage-carousel .slide-content-wrap p {
    color: var(--deep-lake);
}
#oppi-homepage-carousel a.btn-design-small {
  line-height: 18px;
  color: #074e86;
  min-width: 120px;
  font-size: 14px;
  font-size: 1.8rem;
  padding: 18px;
  height:inherit;
}
#oppi-homepage-carousel .carousel-indicators {
	justify-content:start;
	margin-left:10%;
	bottom:30px;
}
#oppi-homepage-carousel .carousel-indicators li {
	background-color: inherit;
    border: 1px solid var(--deep-lake);
}
#oppi-homepage-carousel .carousel-indicators .active {
	background-color: var(--deep-lake);
}

#oppi-homepage-carousel a.btn-design-small:hover {
  background-color:#fff;
  color: #074e86;
}
#oppi-homepage-carousel .carousel-indicators li {
  width: 20px;
    height: 20px;
    margin-right: 10px;
    margin-left: 10px;
  border-radius:50%;
}
#oppi-homepage-carousel .navigation-chevrons {
	font-size:24px;
	color: var(--deep-lake) !important;
	text-decoration:none;
	position: absolute;
    bottom: 0px;
    top: -105px;
    z-index: 15;
}
#oppi-homepage-carousel .carousel-control-prev {
	left:25%;
}
#oppi-homepage-carousel .carousel-control-next {
	right:25%;
}
#Home2024 > section#HomeIntroduction {
	margin-top:0;
	background-color:var(--limestone);
	padding-top:10rem;
	padding-bottom:10rem;
}
#HomeIntroduction #Introductory-Content {
	font-family: "Urania", "Helvetica Neue", Arial, sans-serif;
	font-weight:400;
	font-size:2.8rem;
	color: var(--deep-lake);
	line-height:1.4;
}
.aboutSectionContent {
  margin-top:0rem;
  margin-bottom:0rem;
  text-align:center;
}
.aboutSectionContent p {
  font-size:3rem;
  line-height:3.5rem;
}
#Home2024 > section {
  margin-top:8rem;
  margin-bottom:8rem;
  }

#ThreeHorizontalCTAs, #TwoStackedCTAs, #HomeIntroductionContainer, #HomeVideoContainer {
	max-width:1450px;
  }
#ThreeHorizontalCTAs .cta-item {
	  width:32%;
	  height:400px;
	  background-size: cover;
	  background-position: center center;
	  background-repeat: no-repeat;
	  padding:2rem;
	  display: flex;
	  flex-direction: column;
	  justify-content: flex-end;
	  container-type: inline-size;
	  background-image: url("/wp-content/uploads/line-pattern-1-for-CTAs.png");
  }
  
  #ThreeHorizontalCTAs .bg-boreal-forest {
	  background-color: var(--boreal-forest);
  }
  #ThreeHorizontalCTAs .bg-boreal-forest .btn-design-small:hover {
	  background-color: #fff !important;
	  color: var(--boreal-forest) !important;
  }
  
  #ThreeHorizontalCTAs .bg-deep-lake {
	  background-color: var(--deep-lake);
  }
  #ThreeHorizontalCTAs .bg-deep-lake .btn-design-small:hover {
	  background-color: #fff !important;
	  color: var(--deep-lake) !important;
  }
  
  #ThreeHorizontalCTAs .bg-clay {
	  background-color: var(--clay);
  }
   #ThreeHorizontalCTAs .bg-clay .btn-design-small:hover {
	  background-color: #fff !important;
	  color: var(--clay) !important;
  }
  
#ThreeHorizontalCTAs .cta-item h4 {
  color:#fff;
  padding-top:0px;
  padding-bottom:0px;
  }
#ThreeHorizontalCTAs .cta-item p {
  color:#fff;
  padding-top:5px;
  padding-bottom:0px;
  line-height:25px;
  font-size:1.8rem;
  }
#ThreeHorizontalCTAs .cta-item .btn-design-small {
  width:100%;
  font-size:1.6rem;
  height:inherit;
  line-height:16px;
  color: #fff !important;
  border:1px solid #fff;
  }

@container (inline-size < 270px) {
    .mb-small-3 {
    margin-bottom:1.5rem;
    }
}


#TwoStackedCTAs h2 {
   padding:0px;
}
#TwoStackedCTAs .btn-design-small {
   width:fit-content;
   padding:5px 35px;
  height:inherit;
  margin-top:10px;
}
#TwoStackedCTAs .image-info-bottom {
   height:38px;
  bottom:0px;
  background-color:#0B4E85;
  width:90%;
  color: #fff;
  padding-top: 5px;
  padding-bottom: 5px;
  line-height: 25px;
  font-size: 16px;
}
#TwoStackedCTAs .mobile-alt-text {
  font-family: "Urania", "Helvetica Neue", Arial, sans-serif;
  font-size:12px;
}
#TwoStackedCTAs #TwoStackedCTAs-row-1 .content-column {
	padding-left:5%;
	padding-right:10%;
	padding-top:5%;
	padding-bottom:5%;
}

#TwoStackedCTAs #TwoStackedCTAs-row-2 .content-column {
	padding-left:5%;
	padding-right:10%;
	padding-top:5%;
	padding-bottom:5%;
}
#TwoStackedCTAs .image-column {
	overflow: hidden;
}
#TwoStackedCTAs img {
	object-fit:cover;
	display:block;
	width: 100%;
  height: 100%;
}
#TwoStackedCTAs-row-1 img {
	padding-left:5%;
}

#TwoStackedCTAs-row-2 img {
	padding-right:5%;
}

.tooltip .arrow {
  background-color:#fff;
  }
.tooltip .tooltip-inner {
   background-color:#0B4E85;
  }
.tooltip .tooltip-inner {
   font-size:1.5rem;
  }

#Home2024 > section#YMagazine  {
  margin-top:20rem;
  margin-bottom:10rem;
}

#YMagazine-Background {
  background-image: url("/wp-content/uploads/Line-Pattern-Background-2-White-34percent-scaled.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top left;
  background-color: var(--deep-lake);
  padding-top:50px;
  padding-bottom:50px;
}
#Read-Latest-Issue {
	color:#fff;
	font-family: "Urania", "Helvetica Neue", Arial, sans-serif;
    font-weight: 500;
}

#YMagazine h2 {
  padding-bottom:0px;
  color:#fff;
}
#YMagazine p {
  font-size: 1.7rem;
  margin: 0;
  padding-top: 12px;
  padding-bottom: 12px;
  line-height: 30px;
  color:#fff;
}
#YMagazine #ymag-button {
  display:block;
  margin-left:auto;
  margin-right:auto;
  width:max-content;
  margin-bottom:10px;
  margin-top:60px;
  height:inherit;
}
#ymag-link {
	text-decoration:underline;
	color:#fff;
}
#YMagazine #desktop-ymag-cover-image {
  left:0px;
  bottom:-29%;
  width:74%;
  height:auto;
  transform: rotate(-5deg);
}
#YMagazine #mobile-ymag-cover-image {
  display:none;
}

@media (max-width: 1600px) { 
	#YMagazine #desktop-ymag-cover-image {
		bottom:-15%;
		width:94%;
	}
}

/* Less than xtra Large devices */
@media (max-width: 1200px) { 
  #Home2024 > section#YMagazine  {
     margin-top:14rem;
   }
  #TwoStackedCTAs .image-info-bottom {
    font-size:14px;
    }
}


/* Less than Large devices */
@media (max-width: 992px) { 
  #ThreeHorizontalCTAs {
    max-width:100%;
    }
   #Home2024 > section#YMagazine  {
    max-width:100%;
  }
  #oppi-homepage-carousel .carousel-item .carousel-item-wrap {
    height:80vh;
    }
  #oppi-homepage-carousel a.btn-design-small {
  font-size: 1.4rem;
  padding: 10px;
}
  #oppi-homepage-carousel .carousel-image {
    height:45vh;
    }
  #oppi-homepage-carousel .content-column {
    height:55%;
    }
#oppi-homepage-carousel .slide-content-wrap h2 {
    font-size: 4rem;
    line-height: 50px;
    padding-bottom:10px;
    padding-top:20px;
  }
  #oppi-homepage-carousel .slide-content-wrap p {
    color: var(--deep-lake);
    line-height:25px;
  }
  #TwoStackedCTAs-row-1 img {
	padding-left:0%;
}

#TwoStackedCTAs-row-2 img {
	padding-right:0%;
}
#TwoStackedCTAs #TwoStackedCTAs-row-1 .content-column, #TwoStackedCTAs #TwoStackedCTAs-row-2 .content-column {
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 2%;
    padding-bottom: 5%;
}
  	#YMagazine #desktop-ymag-cover-image {
		bottom:-3%;
	}
}

/* Less than Medium devices */
@media (max-width: 768px) { 
#oppi-homepage-carousel .slide-content-wrap {
  padding-left: 5%;
  padding-right: 5%;
}  

.aboutSectionContent p {
  font-size:2.5rem;
  line-height:3.25rem;
}
  #ThreeHorizontalCTAs .cta-item {
    width:100%;
    height:400px;
    margin-bottom:1rem;
    }
  .mb-small-3 {
    margin-bottom:1.5rem;
    }
  #TwoStackedCTAs .content-column {
    padding-left:5% !important;
    }
  #Home2024 > section#YMagazine  {
    margin-top:5rem;
    max-width:100%;
  }
  #mag-image-column {
    display:none;
  }
  #YMagazine #ymag-button {
    margin-top:10px;
  }
   #YMagazine #mobile-ymag-cover-image {
    display:block;
    margin:30px auto 10px;
    max-width:330px;
    width:100%;
    height:auto;
  }
  #oppi-homepage-carousel .carousel-indicators {
	  bottom:15px;
  }
  #oppi-homepage-carousel .navigation-chevrons {
	  top:-70px;
  }
    #HomeIntroduction #Introductory-Content {
        font-size: 2.3rem;
    }
	#Home2024 > section#HomeIntroduction {
		padding-top: 5rem;
        padding-bottom: 5rem;
	}

}

/* Less than Small devices */
@media (max-width: 576px) { 
  #TwoStackedCTAs .image-info-bottom {
    font-size:1.1rem;
    }
    #oppi-homepage-carousel .carousel-image {
        height: 30vh;
    }
  #oppi-homepage-carousel .carousel-item .carousel-item-wrap {
      height: 92vh;
  }
}
@media (max-width: 400px) { 

  #oppi-homepage-carousel .slide-content-wrap {
    padding-left: 1%;
    padding-right: 1%;
  }
  #oppi-homepage-carousel .slide-content-wrap h2 {
    font-size: 3.5rem;
    line-height: 40px;
    padding-bottom: 5px;
    padding-top: 10px;
  }
  #oppi-homepage-carousel .slide-content-wrap p {
    font-size:16px;  
    }
}

@media (min-width: 992px) { /* large screens only */
    .carousel-content-col {
        position: relative;
        overflow: visible; /* ensure the shape can extend outward */
    }

    .carousel-content-col::after {
        content: "";
        position: absolute;
        top: 0;
        right: -150px; /* adjust based on how far it should extend */
        width: 150px; /* width of the trapezoid */
        height: 130%;
        background: var(--huron-sky); /* your trapezoid color */

        /* trapezoid shape */
        clip-path: polygon(0 0, 0% 100%, 100% 100%);

        z-index: 2;
    }
}