.page {
   display: flex;
   justify-content: center;
   align-items: start;
   width: 100%;
   padding: 10px;
   gap: 5px;
   width: 100vw;
   flex-direction: row;
   margin-bottom: 10%;
}
.page__left {
   width: 60%;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   max-width: 70%;
   background-color: white;
   padding: 20px 2%;
   border-radius: 10px;
   box-shadow: 0 0 10px 1px rgb(0,0,0,.1);
}
.page__left__links {
   width: 100%;
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin: 6px 0
}
.page__left__links > a {
   font-size: 22px;
}
.page__left__text {
   width: 100%;
   max-width: 100%;
   hyphens: auto;
   word-break: break-all;
}

.love {
   font-size: 26px;
   background-color: transparent;
   transition: all .3s linear;
}
.love:hover {
   color: rgb(0, 249, 141, .5);
   cursor: pointer;
}
.page__left__comments {
   width: 100%;
}
.page__left__comments h2 {
   width: 100%;
   font-size: 26px;
   border-bottom: 1px solid rgb(0,0,0,.1);
   padding: 4px 0;
   margin-bottom: 4px;
}
.page__left__comments form {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
}
.page__left__comments form input {
   width: 100%;
   font-size: 20px;
   padding: 8px ;
   border-bottom: 2px solid black;
   background-color: transparent;
   transition: all .3s linear;
}
.page__left__comments form input:hover {
   border-color: #00f98d;
}
.page__left__comments form input:focus {
   border-color: #00f98d;
}

.comments__objects {
   display: flex;
   justify-content: start;
   align-items: start;
   flex-direction: column;
   width: 100%;
   margin-top: 10px;
}
.comment {
   width: 100%;
   margin-bottom: 8px;
   border-bottom: 1px solid rgb(0,0,0,.1);
}
.comment__header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
   margin-bottom: 4px;
}
.comment__header__right {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 5px
}
.comment__header__right a {
   font-size: 22px;
   cursor: pointer;
}

.page__right {
   width: 30%;
   padding: 10px;
}
.page__right h3 {
   margin-top: 10px;
   border-bottom: 1px solid rgb(0,0,0,.1);
}
.page__right article {
   margin:2% 0 0 0;
   padding: 5px;
}

img {
   width: 100%;
   max-width: 100%;
}

/* page__delete */
.page__delete {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
}
.page__item {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   max-width: 600px;
   width: 100%;
   background-color: white;
   padding: 20px;
   border-radius: 10px;
   box-shadow:   0  0  10px 1px rgb(0,0,0,.1);
}
.page__item h2 {
   width: 100%;
   margin-bottom: 10px;
}
.page__item__delete {
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
}

@media screen and (max-width: 500px) {
   .page {
      width: 100%;
      flex-direction: column;
   }
   .page__left {
      width: 100%;
      max-width: 100%;
   }
   .page__right {
      width: 100%;
      max-width: 100%;
   }
}