/* Responsive */
    @media (max-width: 768px) {
        .section4-container {
            padding: 50px 0px;
        }



        .section4-text-section p {
            font-size: 2.2rem;
            line-height: 40px;
        }


        .unmarked {
            background-color: black;
        }

        .first-img img {
            width: 90%;
        }

        .first-img {
            margin-top: -180px;
        }

        .art {
            letter-spacing: -15px;
        }

        .small-text {
            width: 100%;
            margin-top: 0px;
            text-transform: uppercase;
        }

        .line {
            padding: 50px 0px;
        }

        .line img {
            object-fit: fill;
            height: 100px;
            width: 100%;
        }

        .let {
            flex-direction: column;
            padding: 50px 0px;
        }

        .letoneone-container {
            padding: 10px 0px;
        }

        .letone {
            width: 100%;
            order: 2;
        }

        .lettwo {
            width: 100%;
            order: 1;
            padding-left: 10px;
            justify-content: left;
        }

        .letoneone-text-section p {
            font-size: 40px;
            line-height: 40px;
        }

        .letonetwo {
            padding: 10px 0px;
            text-transform: uppercase;
        }

        .email {
            flex-direction: column;
            padding: 0px;
        }

        .year {
            flex-direction: column;
            text-align: center;
            
        }

        .yearone,
        .yeartwo,
        .yearthree {
            width: 100%;
        }

        .years {
            display: none;
        }

        .yearone,
        .yearthree {
            font-size: 32px;
        }

        .emailone {
            width: 100%;
        }

        .emailtwo {
            width: 100%;
        }

        .emailthree {
            width: 100%;
        }

        .created {
            flex-direction: column;
            padding: 0px;
            margin: 0px;
        }
    }


    /* chat */
    
    @media (max-width: 768px) {
  .year {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    text-align: center;
    border-bottom: 0px;
  }

  .yearone {
    order: 1;
  }

  .yeartwo {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .yeartwo p {
    order: 2;
    font-weight: bold;
    text-transform: uppercase;
    margin: 10px 0;
  }

  .yearthree {
    order: 3;
    color: #a5a5a5;
  }

    }


@media (max-width: 768px) {
  .yeartwo {
    position: relative;
  }

  .yeartwo img {
    width: 90%;
    margin: 40px auto;
    display: block;
    opacity: 0;
    left: 0;
    transform: rotateY(90deg);
    transform-origin: center;
    backface-visibility: hidden;
    transition: transform 0.6s ease, opacity 0.6s ease;
    will-change: transform, opacity;
    z-index: 1;
    position: relative;
  }

  .yeartwo img.visible {
    opacity: 1;
    transform: rotateY(0deg);
    z-index: 2;
  }

  .yeartwo img.hidden {
    opacity: 0;
    transform: rotateY(-90deg);
    z-index: 0;
  }
}