* {
  font-family: "Roboto", sans-serif;
}

html {
  scroll-behavior: smooth;
}

#author-mobile {
  padding: 0 15px;
}

#author-mobile .title-big-container {
  font-weight: 700;
  font-size: 22px;
  line-height: 33px;
}

#author-mobile .title-small-container {
  font-weight: 700;
  font-size: 18px;
  line-height: 150%;
  margin-bottom: 12px;
  margin-top: 24px;
  display: flex;
  justify-content: space-between;
  color: #212121;
}

#author-mobile .pimpinan .big-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: var(--bigbox);
  cursor: pointer;
  padding: 12px 0;
  height: 266px;
  background: #F5F5F5;
  box-shadow: 0px 3px 9px rgba(184, 184, 184, 0.25);
  border-radius: 20px;
}

#author-mobile .grup-redaktur {
  height: 116px;
}

#flex-author .grup-redaktur {
  height: 94px !important;
}

#author-mobile .grup-redaktur,
#flex-author .grup-redaktur {
  display: flex;
  margin-bottom: 12px;
  cursor: pointer;
  margin-top: 12px;
  align-items: center;
  width: 100%;
  background: #F5F5F5;
  box-shadow: 0px 3px 9px rgba(184, 184, 184, 0.25);
  border-radius: 20px;
}

#author-mobile .image,
#flex-author .image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 100%;
}

#author-mobile .con-image-big {
  width: 120px;
  height: 120px;
}

#author-mobile .con-image,
#flex-author .con-image {
  width: 70px;
  height: 70px;
  margin-top: auto;
  margin-bottom: auto;
  margin-right: 12px;
  margin-left: 16px;
}

#author-mobile .pimpinan .text-1 {
  font-weight: 600;
  font-size: 16px;
  margin-top: 20px;
  line-height: 150%;
  color: #2f2d2f;
}

#author-mobile .pimpinan .text-2 {
  font-weight: 700;
  font-size: 18px;
  margin: 4px 0;
  color: #000000;
  line-height: 21px;
}

#author-mobile .pelaksana .text1,
#author-mobile .pimpinan .text1,
#flex-author .text1 {
  color: #2f2d2f;
  font-size: 14px;
  line-height: 21px;
  letter-spacing: 0.3%;
}

#author-mobile .pelaksana .text1,
#author-mobile .pimpinan .text1 {
  font-weight: 600;
}

#flex-author .text1 {
  font-weight: 400;
}

#author-mobile .text2 {
  font-weight: 700;
  font-size: 20px;
  line-height: 23px;
  color: #000000;
}

#flex-author .text2 {
  font-weight: 700;
  font-size: 16px;
  line-height: 18.75px;
  letter-spacing: 0.005em;
  color: #282828;
}

#author-mobile .con-desc div:nth-child(2),
#author-mobile .con-desc div:nth-child(3),
#flex-author .con-desc div:nth-child(2),
#flex-author .con-desc div:nth-child(3) {
  padding-top: 8px;
}


#author-mobile .con-desc,
#flex-author .con-desc {
  padding-right: 14px;
  width: calc(100% - 80px - 19px) !important;
}


#author-mobile .tohide2,
#author-mobile .tohide3,
#author-mobile .tohide4,
#author-mobile .tohide5,
#author-mobile .tohide6,
#author-mobile .tohide7,
#author-mobile .tohide8,
#author-mobile .tohide9,
#author-mobile .tohide10 {
  display: none !important;
}

#author-mobile .toshow2,
#author-mobile .toshow3,
#author-mobile .toshow4,
#author-mobile .toshow5,
#author-mobile .toshow6,
#author-mobile .toshow7,
#author-mobile .toshow8,
#author-mobile .toshow9,
#author-mobile .toshow10 {
  display: block !important;
}

.rotate-image {
  transform: rotate(180deg);
}

/* title mobile  */

#title-author-mob {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 15px;
  margin: 43px 0 24.5px;
}

#title-author-mob .text-author-mob {
  font-family: "Heebo", sans-serif !important;
  color: #282828;
  font-weight: 700;
  font-size: 18px;
  line-height: 29px;
}

#title-author-mob .more-author-mob {
  border: 1px solid #004a8e;
  border-radius: 4px;
  padding: 3px 18px;
  margin-right: 0px;
}

#title-author-mob .more-author-mob a {
  font-family: "Heebo", sans-serif !important;
  color: #004a8e;
  font-weight: 700;
  font-size: 14px;
  line-height: 29px;
}

/* news-content author mobile */

.news-content__inner .title {
  font-family: "Roboto", sans-serif !important;
  font-weight: 700;
}

#tab-ter-author {
  display: flex;
  justify-content: space-around;
  padding: 0 15px;
  text-align: center;
}

#tab-ter-author div {
  font-family: "Heebo", sans-serif !important;
  color: #7e7e7e;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  width: 100%;
}

.img-no-author-mobile {
  padding: 24px 15px 0;
  display: flex;
  justify-content: center;
  margin: 0 auto;
}

.img-no-author-mobile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#ads-author {
  margin: 0 auto;
  width: 300px;
  height: 250px;
  padding-bottom: 15px;
}

#ads-author img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* paging detail mobile */

#paging-author-mob {
  display: flex;
  justify-content: center;
}

#paging-author-mob div {
  padding: 6px 10px;
  margin-right: 10px;
  border: 1px solid #a5a5a5;
  color: #a5a5a5;
  border-radius: 5px;
  font-weight: 700;
  font-size: 16px;
  line-height: 18.75px;
}

/* redaksi lainnya mobile */

#flex-author {
  padding: 0 15px;
}

#flex-author .flex-author {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 32px;
}

#flex-author .flex-author div:first-child {
  font-family: "Heebo", sans-serif !important;
  font-weight: 700;
  font-size: 18px;
  line-height: 29px;
  color: #282828;
}

#flex-author .flex-author div:nth-child(2) {
  border: 1px solid #337ab7;
  border-radius: 4px;
  padding: 3px 18px;
  margin-right: 0px;
}

#flex-author .flex-author a {
  font-family: "Heebo", sans-serif !important;
  font-weight: 700;
  color: #004a8e;
  font-size: 14px;
  line-height: 29px;
}

/* card mobile */

.big-card-mob .bg-card-mob {
  border-radius: 20px;
}

.big-card-mob {
  position: relative;
}

.big-card-mob .grup-1 {
  width: 100%;
  height: 250px;
}

.big-card-mob .grup-1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.big-card-mob .grup-2 {
  position: absolute;
  top: 16px;
  left: 16px;
}

.big-card-mob .grup-2 .flex-grup-2 {
  display: flex;
  align-items: center;
  gap: 16px;
}

.big-card-mob .grup-2 .flex-grup-2 div img {
  width: 80px;
  height: 80px;
  border-radius: 100%;
  object-fit: cover;
}

.big-card-mob .grup-2 .flex-grup-2 .text-1 {
  font-weight: 600;
  font-size: 12px;
  line-height: 150%;
  color: #282828;
  margin-bottom: 8px;
}

.big-card-mob .grup-2 .flex-grup-2 .text-2 {
  font-weight: 700;
  font-size: 20px;
  line-height: 24px;
  color: #282828;
  margin-bottom: 8px;
}

.big-card-mob .grup-2 .flex-grup-2 .text-3 {
  font-weight: 500;
  font-size: 8px;
  line-height: 10px;
  letter-spacing: 0.003em;
  color: #FF0000;
  background-color: #FFFFFF;
  box-shadow: 0px 4px 9px rgba(166, 166, 166, 0.11);
  border-radius: 5px;
  padding: 4px;
  width: max-content;
}

.big-card-mob .grup-2 div:nth-child(2) {
  margin-top: 8px;
  color: #7e7e7e;
  font-weight: 400;
  line-height: 22px;
  font-size: 14px;
  padding-right: 16px;
}

/* sosmed  */

.big-card-mob .grup-2 .flex-box .instagram {
  background-image: url("https://cdn.okezone.com/underwood/revamp/2022/remake/desktop/img/follow/instagram.svg");
}
.big-card-mob .grup-2 .flex-box .facebook {
  background-image: url("https://cdn.okezone.com/underwood/revamp/2022/remake/desktop/img/follow/facebook.svg");
}
.big-card-mob .grup-2 .flex-box .twitter {
  background-image: url("https://cdn.okezone.com/underwood/revamp/2022/remake/desktop/img/follow/twitter.svg");
}
.big-card-mob .grup-2 .flex-box .youtube {
  background-image: url("https://cdn.okezone.com/underwood/revamp/2022/remake/desktop/img/follow/youtube.svg");
}

.big-card-mob .grup-2 .flex-box .tiktok {
  background-image: url("https://cdn.okezone.com/underwood/revamp/2022/remake/desktop/img/follow/tiktok.svg");
}

.big-card-mob .grup-2 .flex-box .img {
  width: 28px;
  height: 28px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 12px;
}

.big-card-mob .grup-2 .flex-box {
  display: flex;
  justify-content: center;
  margin-right: 16px;
  margin-top: 16px;
}

#tab-ter-author {
  margin: 24px 0;
}

.mt-min15 {
    margin-top: -15px;
}

.hide {
  display: none;
}

.active-author-news {
  color: #004A8E !important;
}

.active-author-news::after {
  content: "";
  width: 100%;
  height: 1px;
  border-bottom: solid 2px #004A8E;
  position: relative;
  display: inline-block;
  top: 9px;
}

#paging-author {
  display: flex;
  justify-content: center;
}

#paging-author a {
  padding: 7px 9px;
  margin-right: 8px;
  border: 1px solid #a5a5a5;
  color: #a5a5a5;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  line-height: 18.75px;
}

#paging-author a:visited,
#paging-author a:link {
  border: 1px solid #a5a5a5;
  color: #a5a5a5;
}

.active-paging-author {
  background-color: #337AB7;
  color: white !important;
  border: solid 1px #337AB7 !important;
}

.active-paging-author:first-child {
  color: white !important;
}

.active-text-paging {
  color: #337AB7 !important;
  display: flex;
  align-items: center;
}

.active-text-paging:hover {
  color: #337AB7 !important;
}

.active-text-paging div:first-child {
  margin-left: 7px;
}

.img-active-text-paging {
  height: 10.5px;
  width: 5.25px;

}

.img-active-text-paging img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#author-mobile .menu-authors {
  display: flex;
}

#author-okz .menu-authors a,
#menu-authors a  {
  font-weight: 500;
  font-size: 16px;
  line-height: 25.6px;
  color: #909090;
  cursor: pointer;
}

#author-okz .active-menu-author,
#menu-authors .active-menu-author {
  color: #212121 !important;
  font-weight: 700 !important;
}

#author-okz .menu-authors a span,
#menu-authors a span {
  margin: 0 10px;
}

#menu-authors {
  position: relative;
  margin-bottom: 34px;
}

#menu-authors::after {
  content: "";
  width: 100%;
  height: 1px;
  border-bottom: solid 1px #e2e2e2;
  position: absolute;
  bottom: -12px;
}

.to-top .fa-angle-up {
  margin-top: 13px;
}

.redaksi-active-class {
  border-bottom: 2px solid #f7c574;
}
