:root{
    --black:#111;
    --dark:#000;
    --gray:#f5f5f5;
    --lightgray:#eaeaea;
    --white:#ffffff;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

a {
  text-decoration: none;
}
body , html{
  margin: 0;
  padding: 0;
  text-align: center;
}
body{
    font-family:"Noto Kufi Arabic", sans-serif;
    background:var(--white);
    color:var(--black);
    line-height:1.8;
}

/* Top Bar */
.topbar{
    background:var(--black);
    color:var(--white);
    text-align:center;
    padding:8px;
    font-size:14px;
}

/* Header */
header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 8%;
    border-bottom:1px solid var(--lightgray);
    background:var(--white);
    position:sticky;
    top:0;
}

.logo{
    font-size:26px;
    font-weight:700;
}

footer{
  z-index: 1000;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}

.articleBody{
    width: 100%;
    padding-right: 10vw;
    padding-left: 10vw;
}
br{
  user-select: none;
}