.slider {
    position: relative;
  /*  height: 36em;
    width: 100%;*/
	aspect-ratio: 3.12/1;
    background: gray;
    overflow: hidden;
  }
  .slide,
  .slide img {
    position: absolute;
    top: 0;
    left: 0;
   /* height: inherit;
    width: inherit;*/
	height:100%;
	width:100%;
  }

  .slide h1 {
    position: absolute;
    top: 20%;
    right: 0;
    height: 10%;
    color: white;
  }
  .slide p {
    position: absolute;
    top: 40%;
    left: 0;
    height: 60%;
    color: white;
  }
  .slide a
  {
	  width:100%;
	  height:100%;
	  display:flex;
  }
   .slide {
    transform: translateX(100%);
	background-image: url(../images/media_safe_sleep.jpg);
    -webkit-animation: animslide 50s ease-in-out 0s infinite;
  }
  .slide:nth-child(2) {
	  background-image: url(../images/media_2_lg.jpg);
    -webkit-animation-delay: 10s;
  }
  .slide:nth-child(3) {
	  background-image: url(../images/media_3_lg.jpg);
    -webkit-animation-delay: 20s;
  }
  .slide:nth-child(4) {
	  background-image: url(../images/media_4_lg.jpg);
    -webkit-animation-delay: 30s;
  }
  .slide:nth-child(5) {
	  background-image: url(../images/media_lg.jpg);
    -webkit-animation-delay: 40s;
  }
  @-webkit-keyframes animslide {
    0% {
      transform: translateX(100%);
    }
    2% {
      transform: translateX(0);
    }
    20% {
      transform: translateX(0);
    }
    22% {
      transform: translateX(-100%);
    }
    100% {
      transform: translateX(-100%);
    }
  }
	@-webkit-keyframes ulslide
	{
		15% {transform: translateX(0)}
		
		20% {transform: translateX(-100%)}
		25% {transform: translateX(-100%)}
		
		30% {transform: translateX(-200%)}
		35% {transform: translateX(-200%)}
		
		40% {transform: translateX(-300%)}
		45% {transform: translateX(-300%)}
		
		50% {transform: translateX(-400%)}
		55% {transform: translateX(-400%)}
		
		60% {transform: translateX(-500%)}
		65% {transform: translateX(-500%)}
		
		70% {transform: translateX(-600%)}
		75% {transform: translateX(-600%)}
		
		80% {transform: translateX(-700%)}
		85% {transform: translateX(-700%)}
		
		90% {transform: translateX(-800%)}
		95% {transform: translateX(-800%)}
		
		100% {transform: translateX(-900%)}
	}
  	.ul-slider
	{
		display:flex;
		position: relative;
		aspect-ratio: 3.12/1;
		background: gray;
	/*	gap:4vw;*/
				
		overflow-x:hidden;
		scroll-snap-type:x mandatory;
		anchor-name:--myslider;
	}
	.ul-slider>li
	{
		scroll-snap-align:center;
		height:100%;
		width:100%;
		-webkit-animation:ulslide 60s ease infinite;
		flex: 0 0 100%;
		list-style:none;
		background-size:contain;
		background-position:center;
		background-repeat:no-repeat;
	}
	.ul-slider>li>a
	{
		display:block;
		height:100%;
		width:100%;
	}
	.ul-slider>li:nth-child(1),
	.ul-slider>li:last-child
	{
		background-image: url(../images/slider/media_back_to_school_2026.jpg);
	}
	.ul-slider>li:nth-child(2)
	{
		background-image: url(../images/slider/media_school_snacks_juices_2026.jpg);
	}
	.ul-slider>li:nth-child(3)
	{
		background-image: url(../images/slider/media_safe_sleep.jpg);
	}
	.ul-slider>li:nth-child(4)
	{
		background-image: url(../images/slider/media_safe_sleep_2.jpg);
	}
	.ul-slider>li:nth-child(5)
	{
		background-image: url(../images/slider/media_safe_sleep_3.jpg);
	}
	.ul-slider>li:nth-child(6)
	{
		background-image: url(../images/slider/media_6_lg.jpg);
	}
	.ul-slider>li:nth-child(7)
	{
		background-image: url(../images/slider/media_2_lg.jpg);
	}
	.ul-slider>li:nth-child(8)
	{
		background-image: url(../images/slider/media_3_lg.jpg);
	}
	.ul-slider>li:nth-child(9)
	{
		background-image: url(../images/slider/media_4_lg.jpg);
	}
/*	.ul-slider>li:nth-child(8)
	{
		background-image: url(../images/slider/media_lg.jpg);
	}
	.ul-slider>li:nth-child(9)
	{
		background-image: url(../images/slider/media_7_lg.jpg);
	}*/

	.ul-slider::scroll-button(*)
	{
		border:0;
		font-size:4rem;
		background:none;
		color: rgb(0, 0, 0, 0.5);
		cursor: pointer;
		position: absolute;
		position-anchor: --myslider;
	}
	.ul-slider::scroll-button(*):hover,
	.ul-slider::scroll-button(*):focus
	{
		color: rgb(0, 0, 0, 1);
	}
	.ul-slider::scroll-button(*):active
	{
		translate:1px, 1px;
	}
	.ul-slider::scroll-button(*):disabled
	{
		color:rgb(0,0,0,0.2);
	}
	.ul-slider::scroll-button(right)
	{
	/*	content:"►";*/
		left: calc(anchor(right) - 70px);
		bottom: calc(anchor(top) - 200px);
	}
	.ul-slider::scroll-button(left)
	{
	/*	content:"◄";*/
		right: calc(anchor(left) - 70px);
		bottom: calc(anchor(top) - 200px);
	}