body {
	background: #ffffc1;
	/* margin: 0 auto; */
    font-family: Arial, sans-serif;
      }
 /* * {
  box-sizing: border-box;
 } */
 .bikewrapper {
	display: flex;
	flex-direction: column;
  justify-content: space-between;
	max-width: 1200px;
	border: 0.25rem solid red;
  border-radius: 0.5rem;
  padding: 0.5rem;
 }
.video-container {
           display: flex;
            width: 100%;
            justify-content: space-around;
            /* border: 3px solid red;
            border-radius: 0.5rem; */
            /* background-color: white; */
            margin-top: 0.5rem;
            margin-bottom: 0.5rem;
        }

.image-container {
            
            display: flex;
            flex-wrap:nowrap;
            gap: 10px;
            align-items: center;
            max-width: 950px;
            margin: 10px auto;
            /* outline: 3px dashed black; */
        }
 .image {
            flex: 1;
            position: relative;
			outline: 0px dashed black;
            /* border: 0.375rem solid red;
            border-radius: 0.5rem; */
        }

        .image img {
            max-width: 100%;
            height: auto;
            cursor: pointer;
            border: 0.375rem solid red;
            border-radius: 0.5rem;
        }

        .overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(255, 255, 255, 0.80);
            justify-content: center;
            align-items: center;
            z-index: 5000;
         
        }

 .overlay img {
    max-width: 90%;
    max-height: 90%;
    cursor: pointer;
    border: 0.375rem solid red;
    border-radius: 0.5rem;
}
 @media only screen and (max-width: 768px) {
.bikewrapper {
    justify-content: space-between;
    border: 0.25rem solid red;
    border-radius: 0.5rem;
         }
.video-container {
     display: flex;
     width: 100%;
     justify-content: space-around;
     border-radius: 0.5rem;
     margin-top: 0.5rem;
     margin-bottom: 0.5rem;
 }
          
 .image-container {
      display: flex;
      flex-wrap:nowrap;
      gap: 10px;
      align-items: center;
      max-width: 768px;
      margin: 10px auto;
  }
  .image {
      flex: 1;
      position: relative;
      outline: 0px dashed black;
  }
          
  .image img {
      max-width: 100%;
      height: auto;
      cursor: pointer;
      border: 0rem solid red;
       border-radius: 0.5rem;
   }
          
  .overlay {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(255, 255, 255, 0.80);
      justify-content: center;
      align-items: center;
      z-index: 5000;
  }
          
  .overlay img {
      max-width: 90%;
      max-height: 90%;
      cursor: pointer;
      border: 0.375rem solid red;
      border-radius: 0.5rem;
  }
  }