<div class="is-boxArab">
  <div class="is-teksArab">
  	بِسْمِ اللّٰهِ الرَّحْمٰنِ الرَّحِيْمِ ١ اَلْحَمْدُ لِلّٰهِ رَبِّ الْعٰلَمِيْنَۙ ٢ الرَّحْمٰنِ الرَّحِيْمِۙ ٣ مٰلِكِ يَوْمِ الدِّيْنِۗ ٤ اِيَّاكَ نَعْبُدُ وَاِيَّاكَ نَسْتَعِيْنُۗ ٥ اِهْدِنَا الصِّرَاطَ الْمُسْتَقِيْمَۙ ٦ صِرَاطَ الَّذِيْنَ اَنْعَمْتَ عَلَيْهِمْ ۙ غَيْرِ الْمَغْضُوْبِ عَلَيْهِمْ وَلَا الضَّاۤلِّيْنَࣖ ٧
  </div>
  <div class="is-teksLatin">
    Bismillâhir-raḫmânir-raḫîm. Al-ḫamdu lillâhi rabbil-‘âlamîn, ar-raḫmânir-raḫîm, mâliki yaumid-dîn. Iyyâka na‘budu wa iyyâka nasta‘în. ihdinash-shirâthal-mustaqîm, shirâthalladzîna an‘amta ‘alaihim ghairil-maghdlûbi ‘alaihim wa ladl-dlâllîn.
  </div>
  <div class="is-artiArab">
    “Dengan nama Allah Yang Maha Pengasih lagi Maha Penyayang. Segala puji bagi Allah Tuhan semesta alam, Yang Maha Pengasih lagi Maha Penyayang, Pemilik hari Pembalasan. Hanya kepada Engkaulah kami menyembah dan hanya kepada Engkaulah kami memohon pertolongan. Bimbinglah kami ke jalan yang lurus, (yaitu) jalan orang-orang yang telah Engkau beri nikmat, bukan (jalan) mereka yang dimurkai dan bukan (pula jalan) orang-orang yang sesat.”
  </div>
</div>

/* Example CSS Code */
body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f9;
    color: #333333;
}

/* Font Arabic Uthmani Normal */
@font-face {
  font-family: UthmanicHafs_V22;
  font-style: normal;
  font-weight: normal;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/gh/imansani93/imansani.com@main/font/Arabic/UthmanicHafs_V22.ttf") format("truetype");
}
/* Font Arabic Uthmani Tebal */
@font-face {
  font-family: UthmanicHafs1B Ver13;
  font-style: normal;
  font-weight: bold;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/gh/imansani93/imansani.com@main/font/Arabic/UthmanicHafs1B%20Ver13.ttf") format("truetype");
}

/* Kode CSS Font Arabic by imansani.com*/
.is-boxArab {
  background-color: #ffffff;
  border: 1px solid #eceff1;
  border-radius: 8px;
  padding: 10px;
  margin: 1.5em 0;
  box-shadow: 0 10px 8px -8px rgba(0,0,0,.05)
}
.is-teksArab {
  font-family: 'UthmanicHafs_V22',serif;
  font-size: 34px;
  font-weight: 400;
  text-align: right;
  direction: rtl;
  line-height: 1.8;
}
.is-teksLatin {
  margin-top: 15px;
  font-style: italic;
  line-height: 1.6;
}
.is-artiArab {
  position: relative;
  background-color: #f9f9fb;
  font-weight: 400;
  border: 1px solid #eceff1;
  border-radius: 4px;
  padding: 20px 10px 10px;
  margin: 2.5em 0 0;
  line-height: 1.6;
}
.is-artiArab:before {
  content: "Artinya";
  position: absolute;
  font-weight: bold;
  border-radius: 50px;
  background-color: #f9f9fb;
  border: 1px solid #eceff1;
  padding: 0 15px 1px;
  top: -17px;
  left: 15px;
}