
    .layout {
      margin-inline: auto; max-width: 625px;
      background-color: var(--main-bkg);
      margin-top:0;
    }

    .conf-header {
      background-image: url("../img/banner5.avif"); 
      background-size: contain;
      background-repeat: no-repeat; 
      background-position: center;
      aspect-ratio: 625 /139;
      box-shadow: 0px 4px 5px #d5cebe; 
      display: grid;
      align-content: center; 
      justify-content: center;
      filter: grayscale(30%);
    }

          
    h1 {font-size: clamp(1rem, 0.125rem + 4vw, 1.6rem);text-align: center;font-family:'Times New Roman', Times, serif;}
    h1 > span {font-size: 32px;}
    .conf-meta {
        font-size: clamp(.8rem, 1rem, 1.2rem);
        margin-top: 6px;
        font-weight: 500;
    }
    img {width: 100%;}
    main {
        background: linear-gradient(
          to bottom, 
          light-dark(#f6f3ea, hsl(45, 2%, 61%)) 0%, 
          light-dark(#f1ebdd, hsl(42, 0%, 23%)) 0%
        );
      }
      
main > h2 {text-align: center;}
main > div {padding: 0 1rem;}

    .flex-between {display: flex; justify-content: space-between; align-items:center; background-color: #676767;}

    footer {text-align: center;}
        @media (prefers-color-scheme: dark) {
          .svg-icon {stroke: #fff; fill:none;}
          .svg-google {fill:#fff;}
          .item {color: #fff;}
          .btn-link {border: 1px solid white}
          .btn-link:hover {background-color: grey; border: 1px solid black;color: #000;}
        }
      @media screen and (max-width: 625px) {
        @view-transition {navigation: auto;}
        ::view-transition-group(root) {
          animation-duration: 0.5s;
        }
        ::view-transition-old(root){
          animation-name: slide-out;
        }
        ::view-transition-new(root){
          animation-name: slide-in;
        }
        @keyframes slide-in {
          from {
            translate: -100% 0;
          }
        }
        @keyframes slide-out {
          to {
            translate: 100% 0;
          }
        }
      }
   