arabic-style.css

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@100;200;300;400;500;600;700;800&display=swap');


div {
 direction: rtl;
}


body {
    text-align: right;
    font-family: 'Noto Sans Arabic', sans-serif;
}

h1 {
  font-family: 'Noto Sans Arabic', sans-serif;
  font-weight: 500;
  color: blue;

  /* color: #757474; */
}

h2 {
  font-family: 'Noto Sans Arabic', sans-serif;
  font-weight: 400;
  /* color: #757474; */

}

h3 {
  font-family: 'Noto Sans Arabic', sans-serif;
  font-weight: 400;
  /* color: #757474; */

}

#site-navigation li > a {
  font-size: 1.1em;
}

/*--------------------------------------------------------------------*\

Styling for Embedded Videos (iframes)

- Ensures that videos can resize to suit the screen the book is read from.
- Also ensures that videos are horizontally centered.

\*--------------------------------------------------------------------*/

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 35px;
  height: 0;
  overflow: hidden;
}

.video-container iframe {
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}

iframe {
  margin: auto;
  display:block;
}

/*--------------------------------------------------------------------*\

Styling for Tables

- Improves styling of tables over the default Markdown standard
- Adds borders to tables, and allows a rows to be highlighted when hovered

\*--------------------------------------------------------------------*/

th, td {
  border: 1px solid #999999 !important;
  text-align: center;
  padding: 10px
}

th {
  font-weight: bold;
  background-color: #EEEEEE;
}

table caption {
  color: black;
  text-align: center;
}

table caption .footnote {
  color: #666666;
  text-align: left;
  font-size: smaller;
}

tr:hover {
  background-color: #f7f7f7;
}


div {
 direction: rtl;
}

body {
 direction: rtl;
}

h1 {
 direction: rtl;
}

h2 {
 direction: rtl;
}

h3 {
 direction: rtl;
}

body {
  background: #fff;
  color: #666666;
  family: 'IBM Plex Sans Arabic', sans-serif;
}


.caption-number {
  direction: rtl;
  text-align: right;
}

.fa-angle-right {
  transform: rotate(180deg)
}