:root {
   --color_base: #fff;
   --color_primary: #3a4752;
   --color_secondary: #333;
   --color_red: red;
   --color_border: #ddd;
   --color_input: #f2f2f2;
   --color_btn: #388e3c;
   --color_btn_hover: #2bac31;
   --color_green: #d9ead3;
   --color_yellow: #fff2cc;
   --color_dark: #f3f3f3;
   --color_comments_priamry: #9faeb5;
   --color_comments_secondary: #eeee;
   --color_comments_text: rgb(65, 65, 65);
   --color_comments_hover: #5f95ad;
}

.cta * {
   margin: 0 !important;
   -webkit-margin-before: 0 !important;
           margin-block-start: 0 !important;
   -webkit-margin-after: 0 !important;
           margin-block-end: 0 !important;
   -webkit-margin-start: 0 !important;
           margin-inline-start: 0 !important;
   -webkit-margin-end: 0 !important;
           margin-inline-end: 0 !important;
   padding: 0 !important;
   border-style: none !important;
   border-width: 0 !important;
   border-color: transparent !important;
   font-size: 100% !important;
   -webkit-box-sizing: border-box !important;
           box-sizing: border-box !important;
}

.cenz * {
   margin: 0 !important;
   -webkit-margin-before: 0 !important;
           margin-block-start: 0 !important;
   -webkit-margin-after: 0 !important;
           margin-block-end: 0 !important;
   -webkit-margin-start: 0 !important;
           margin-inline-start: 0 !important;
   -webkit-margin-end: 0 !important;
           margin-inline-end: 0 !important;
   padding: 0 !important;
   border-style: none !important;
   border-width: 0 !important;
   border-color: transparent !important;
   font-size: 100% !important;
   -webkit-box-sizing: border-box !important;
           box-sizing: border-box !important;
}

/* Comments==================================================== */
.comments {
   position: relative !important;
   margin: 0 !important;
   margin-bottom: 30px !important;
   padding: 0 15px !important;
   -webkit-box-sizing: border-box !important;
           box-sizing: border-box !important;
}

.comments > * {
   -webkit-box-sizing: border-box !important;
           box-sizing: border-box !important;
}

/* Header */
.comments__header {
   position: relative !important;
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-pack: justify !important;
       -ms-flex-pack: justify !important;
           justify-content: space-between !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   gap: 5px !important;
   margin: 0 0 30px 0 !important;
   padding: 0 0 !important;
   -webkit-box-sizing: border-box !important;
           box-sizing: border-box !important;
}

.comments__header::before {
   content: "" !important;
   position: absolute !important;
   bottom: 0 !important;
   left: 0 !important;
   z-index: 0 !important;
   width: 100% !important;
   height: 2px !important;
   background-color: var(--color_comments_secondary) !important;
}

/* Header left box */
.comments__left-box {
   position: relative !important;
   z-index: 1 !important;
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-pack: justify !important;
       -ms-flex-pack: justify !important;
           justify-content: space-between !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   gap: 5px !important;
   padding: 10px 0 !important;
   border-bottom: 2px solid var(--color_comments_priamry) !important;
}

.comments__header-count {
   margin: 0 !important;
   padding: 0 !important;
   font-size: 20px !important;
   font-weight: 700 !important;
   color: var(--color_comments_text) !important;
   -webkit-box-sizing: border-box !important;
           box-sizing: border-box !important;
}

.comments__header-title {
   margin: 0 !important;
   padding: 0 !important;
   font-size: 20px !important;
   font-weight: 700 !important;
   text-transform: capitalize !important;
   color: var(--color_comments_text) !important;
   -webkit-box-sizing: border-box !important;
           box-sizing: border-box !important;
}

/* Header Right box */
.comments__right-box {
   position: relative !important;
   z-index: 1 !important;
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-pack: justify !important;
       -ms-flex-pack: justify !important;
           justify-content: space-between !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   gap: 25px !important;
   padding: 10px 0 !important;
}

.comments__right-box > a {
   box-shadow: none !important;
}

.comments__header-icon path {
   -webkit-transition: all 0.2s ease-in-out !important;
   -o-transition: all 0.2s ease-in-out !important;
   transition: all 0.2s ease-in-out !important;
}

.comments__header-icon:hover path {
   fill: var(--color_comments_hover) !important;
}

/* Comments item list */
.comments__item-list {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-orient: vertical !important;
   -webkit-box-direction: normal !important;
       -ms-flex-flow: column !important;
           flex-flow: column !important;
   gap: 30px !important;
}

/* Comments item */
.comments__item {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-orient: vertical !important;
   -webkit-box-direction: normal !important;
       -ms-flex-flow: column !important;
           flex-flow: column !important;
   gap: 10px !important;
}

.comments__item-header {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   gap: 15px !important;
}

.comments__item-header.hidden {
   display: none !important;
}

.comments__item-avatar {
   width: 60px !important;
   height: 60px !important;
   min-width: 60px !important;
   min-height: 60px !important;
   margin: 0 !important;
   border-radius: 100% !important;
   -o-object-fit: cover !important;
      object-fit: cover !important;
}

.comments__item-info {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-orient: vertical !important;
   -webkit-box-direction: normal !important;
       -ms-flex-flow: column !important;
           flex-flow: column !important;
   gap: 0 !important;
}

.comments__item-name {
   margin: 0 !important;
   padding: 0 !important;
   font-size: 20px !important;
   font-weight: 600 !important;
   text-align: left !important;
   text-transform: capitalize !important;
   color: var(--color_comments_text) !important;
}

.comments__item-data {
   margin: 0 !important;
   padding: 0 !important;
   font-size: 15px !important;
   font-weight: 500 !important;
   text-align: left !important;
   text-transform: initial !important;
   color: var(--color_comments_priamry) !important;
}

.comments__item-data-now {
   color: rgb(41, 187, 12) !important;
}

.comments__item-data.hidden {
   display: none !important;
}

.comments__item-body {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-orient: vertical !important;
   -webkit-box-direction: normal !important;
       -ms-flex-flow: column !important;
           flex-flow: column !important;
   gap: 15px !important;
}

.comments__item-content {
   margin: 0 !important;
   padding: 0 !important;
   font-size: 16px !important;
   font-weight: 400 !important;
   text-align: left !important;
   text-transform: initial !important;
   color: var(--color_comments_text) !important;
}

.comments__item-content.hidden {
   display: none !important;
}

.comments__item-picture {
   display: none !important;
}

.comments__item-picture.active {
   display: block !important;
}

.comments__item-picture.hidden {
   display: none !important;
}

.comments__item-img {
   display: block !important;
   width: 100% !important;
   height: auto !important;
   max-width: 100% !important;
   margin: 0 !important;
}

/* Comments item footer */
.comments__item-footer {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-pack: justify !important;
       -ms-flex-pack: justify !important;
           justify-content: space-between !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
}

.comments__item-footer.hidden {
   display: none !important;
}

.comments__item-replay {
   margin: 0 !important;
   font-size: 18px !important;
   font-weight: 400 !important;
   text-decoration: none !important;
   text-transform: initial !important;
   color: var(--color_comments_priamry) !important;
   -webkit-transition: all 0.2s ease-in-out !important;
   -o-transition: all 0.2s ease-in-out !important;
   transition: all 0.2s ease-in-out !important;
   box-shadow: none !important;
}

.comments__item-replay:hover {
   color: var(--color_comments_hover) !important;
}

.comments__item-grade {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   gap: 15px !important;
}

.comments__item-icon {
   cursor: pointer !important;
   width: 20px !important;
   height: 20px !important;
}

.comments__item-icon path {
   -webkit-transition: all 0.2s ease-in-out !important;
   -o-transition: all 0.2s ease-in-out !important;
   transition: all 0.2s ease-in-out !important;
}

.comments__item-icon[data-type="like"]:hover path {
   fill: rgb(32, 161, 20) !important;
}

.comments__item-icon[data-type="like"].active path {
   fill: rgb(32, 161, 20) !important;
}

.comments__item-icon[data-type="dislike"]:hover path {
   fill: rgb(185, 33, 28) !important;
}

.comments__item-icon[data-type="dislike"].active path {
   fill: rgb(185, 33, 28) !important;
}

@media all and (min-width: 576px) {
   .comments__item-name {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 22px !important;
      font-weight: 600 !important;
      color: var(--color_comments_text) !important;
   }

   .comments__item-data {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 16px !important;
      font-weight: 500 !important;
      text-align: left !important;
      color: var(--color_comments_priamry) !important;
   }

   .comments__item-content {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 18px !important;
      font-weight: 400 !important;
      color: var(--color_comments_text) !important;
   }

   .comments__item-img {
      display: block !important;
      width: 100% !important;
      height: auto !important;
      max-width: 350px !important;
      margin: 0 !important;
   }

   .comments__item-footer {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: justify !important;
          -ms-flex-pack: justify !important;
              justify-content: space-between !important;
      -webkit-box-align: center !important;
          -ms-flex-align: center !important;
              align-items: center !important;
      max-width: 350px !important;
   }
}
@media all and (min-width: 768px) {
   .comments__header {
      position: relative !important;
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: justify !important;
          -ms-flex-pack: justify !important;
              justify-content: space-between !important;
      -webkit-box-align: center !important;
          -ms-flex-align: center !important;
              align-items: center !important;
      gap: 5px !important;
      margin: 0 0 50px 0 !important;
      padding: 0 0 !important;
      -webkit-box-sizing: border-box !important;
              box-sizing: border-box !important;
   }

   .comments__item-name {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 22px !important;
      font-weight: 600 !important;
      color: var(--color_comments_text) !important;
   }

   .comments__item-data {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 16px !important;
      font-weight: 500 !important;
      text-align: left !important;
      color: var(--color_comments_priamry) !important;
   }

   .comments__item-content {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 18px !important;
      font-weight: 400 !important;
      color: var(--color_comments_text) !important;
   }

   .comments__item-img {
      display: block !important;
      width: 100% !important;
      height: auto !important;
      max-width: 350px !important;
      margin: 0 !important;
   }

   .comments__item-footer {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: justify !important;
          -ms-flex-pack: justify !important;
              justify-content: space-between !important;
      -webkit-box-align: center !important;
          -ms-flex-align: center !important;
              align-items: center !important;
      max-width: 350px !important;
   }
}
@media all and (min-width: 992px) {
   .comments__header-count {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 22px !important;
      font-weight: 700 !important;
      text-align: left !important;
      color: var(--color_comments_text) !important;
      -webkit-box-sizing: border-box !important;
              box-sizing: border-box !important;
   }

   .comments__header-title {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 22px !important;
      font-weight: 700 !important;
      color: var(--color_comments_text) !important;
      -webkit-box-sizing: border-box !important;
              box-sizing: border-box !important;
   }

   .comments__item-name {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 24px !important;
      font-weight: 600 !important;
      color: var(--color_comments_text) !important;
   }

   .comments__item-data {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 18px !important;
      font-weight: 500 !important;
      color: var(--color_comments_priamry) !important;
   }

   .comments__item-content {
      margin: 0 !important;
      padding: 0 !important;
      font-size: 20px !important;
      font-weight: 400 !important;
      color: var(--color_comments_text) !important;
   }

   .comments__item-img {
      display: block !important;
      width: 100% !important;
      height: auto !important;
      max-width: 350px !important;
      margin: 0 !important;
   }

   .comments__item-footer {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: justify !important;
          -ms-flex-pack: justify !important;
              justify-content: space-between !important;
      -webkit-box-align: center !important;
          -ms-flex-align: center !important;
              align-items: center !important;
      max-width: 200px !important;
   }
}

/* Btn =================================== */
.btn {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-pack: center !important;
       -ms-flex-pack: center !important;
           justify-content: center !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   width: -webkit-fit-content !important;
   width: -moz-fit-content !important;
   width: fit-content !important;
   margin: 0 auto !important;
   padding: 15px 30px !important;
   border-radius: 10px !important;
   font-size: 22px !important;
   font-weight: 500 !important;
   text-decoration: none !important;
   text-transform: uppercase !important;
   text-align: center !important;
   color: var(--color_base) !important;
   background-color: #fa3d3d !important;
   -webkit-transition: all 0.2s ease-in 0s !important;
   -o-transition: all 0.2s ease-in 0s !important;
   transition: all 0.2s ease-in 0s !important;
}

.btn:hover {
   background-color: #f52b2b !important;
   -webkit-transform: scale(1.1) !important;
       -ms-transform: scale(1.1) !important;
           transform: scale(1.1) !important;
}

/* Cenz==================================== */
.cenz {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-orient: vertical !important;
   -webkit-box-direction: normal !important;
       -ms-flex-flow: column !important;
           flex-flow: column !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   gap: 30px !important;
   width: 100% !important;
   margin: 20px 0 !important;
}

.cenz__item {
   cursor: pointer !important;
   position: relative !important;
}

.cenz__item.active > .cenz__content {
   display: none !important;
}

.cenz__item.active > .cenz__img {
   display: block !important;
}

.cenz__content {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-orient: vertical !important;
   -webkit-box-direction: normal !important;
       -ms-flex-flow: column !important;
           flex-flow: column !important;
   -webkit-box-pack: center !important;
       -ms-flex-pack: center !important;
           justify-content: center !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   gap: 30px !important;
   width: 300px !important;
   height: 300px !important;
   margin-bottom: 15px !important;
   padding: 15px !important;
   border: 5px solid var(--color_red) !important;
   text-align: center !important;
}

.cenz__age {
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-pack: center !important;
       -ms-flex-pack: center !important;
           justify-content: center !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   width: 180px !important;
   height: 180px !important;
   border: 10px solid var(--color_red) !important;
   border-radius: 100% !important;
   font-size: 60px !important;
   font-weight: 700 !important;
}

.cenz__cta {
   cursor: pointer !important;
   display: -webkit-box !important;
   display: -ms-flexbox !important;
   display: flex !important;
   -webkit-box-pack: center !important;
       -ms-flex-pack: center !important;
           justify-content: center !important;
   -webkit-box-align: center !important;
       -ms-flex-align: center !important;
           align-items: center !important;
   padding: 10px 25px !important;
   border-radius: 10px !important;
   font-size: 26px !important;
   font-weight: 600 !important;
   color: var(--color_base) !important;
   background-color: var(--color_red) !important;
}

.cenz__img {
   display: none !important;
   width: 100% !important;
   height: 100% !important;
   min-width: 250px !important;
   max-width: 500px !important;
   margin-bottom: 15px !important;
}

.cenz__palceholder {
   font-size: 24px !important;
   font-weight: 600 !important;
   text-align: center !important;
}

.cenz__palceholder.hidden {
   display: none !important;
}