html{scroll-behavior:smooth}.slider{position:relative;height:350px;margin:50px auto;box-shadow:#0000001a 0 20px 25px -5px,#0000000a 0 10px 10px -5px;overflow:hidden}.slider-controls{position:absolute;bottom:0;left:50%;width:200px;transform:translate(-50%);z-index:1000;list-style:none;text-align:center}.slider input[type=radio]{position:absolute;top:0;left:0;opacity:0;width:0;height:0}.slider-controls label{display:inline-block;border:none;height:20px;width:20px;border-radius:50%;cursor:pointer;background-color:#212121;transition:background-color .2s linear}#btn-1:checked~.slider-controls label[for=btn-1]{background-color:#ff4081}#btn-2:checked~.slider-controls label[for=btn-2]{background-color:#ff4081}#btn-3:checked~.slider-controls label[for=btn-3]{background-color:#ff4081}.slides{list-style:none;margin:0;height:100%}.slide{position:absolute;top:0;left:0;display:flex;justify-content:space-between;width:100%;height:100%;opacity:0;transform:translate(-100%);transition:transform .25s linear}.slide-content{width:500px}.slide-title{margin-bottom:20px;font-size:36px}.slide-text{margin-bottom:20px}.slide-link{display:inline-block;padding:10px 20px;color:#fff;border-radius:3px;text-decoration:none;background-color:#ff4081}.slide-image img{max-width:100%}#btn-1:checked~.slides .slide:nth-child(1){transform:translate(0);opacity:1}#btn-2:checked~.slides .slide:nth-child(2){transform:translate(0);opacity:1}#btn-3:checked~.slides .slide:nth-child(3){transform:translate(0);opacity:1}#btn-1:not(:checked)~.slides .slide:nth-child(1){animation-name:swap-out;animation-duration:.3s;animation-timing-function:linear}#btn-2:not(:checked)~.slides .slide:nth-child(2){animation-name:swap-out;animation-duration:.3s;animation-timing-function:linear}#btn-3:not(:checked)~.slides .slide:nth-child(3){animation-name:swap-out;animation-duration:.3s;animation-timing-function:linear}@keyframes swap-out{0%{transform:translate(0);opacity:1}50%{transform:translate(50%);opacity:0}to{transform:translate(100%)}}.bg-cream{background-color:#244d61}.bg-yellow-500{background-color:#f48c06}.text-yellow-500{color:#f48c06}.floating{animation-name:floating;animation-duration:3s;animation-iteration-count:infinite;animation-timing-function:ease-in-out}@keyframes floating{0%{transform:translate(0)}50%{transform:translateY(8px)}to{transform:translateY(-0px)}}.floating-4{animation-name:floating;animation-duration:4s;animation-iteration-count:infinite;animation-timing-function:ease-in-out}@keyframes floating-4{0%{transform:translate(0)}50%{transform:translateY(8px)}to{transform:translateY(-0px)}}.text-darken{color:#2f327d}