/*
1.  Global Section CSS
2.  Header Section CSS
3.  Slider Section CSS
4.  About Section CSS
5.  Service Section CSS
6.  Gallery Section CSS
7.  Posts Section CSS
8.  Newsletter Section CSS
9.  Footer Section CSS

*/

/*------------------------ 1.  Global Section CSS ------------------------*/

@font-face {
    font-family: 'NotoKufiArabic-Light';
    src: url('assets/fonts/NotoKufiArabic-Light.ttf');
}

@font-face {
    font-family: 'NotoKufiArabic-Medium';
    src: url('assets/fonts/NotoKufiArabic-Medium.ttf');
}

@font-face {
    font-family: 'NotoKufiArabic-Bold';
    src: url('assets/fonts/NotoKufiArabic-Bold.ttf');
}

@font-face {
    font-family: 'NotoKufiArabic-Black';
    src: url('assets/fonts/NotoKufiArabic-Black.ttf');
}

@font-face {
    font-family: 'IranNastaliq';
    src: url('assets/fonts/IranNastaliq.woff');
}

@font-face {
    font-family: 'Arabic';
    src: url('assets/fonts/Arabic.woff2');
}

:root {
    --Primary-Color: rgb(55, 115, 125);
}

html {
    scroll-behavior: smooth;
}

body {
    direction: rtl;
    font-family: 'NotoKufiArabic-Medium';
    font-size: 1rem;
    line-height: 2;
    background: rgb(255, 255, 255);
    color: rgb(75, 75, 75);
    padding: 0 !important;
    overflow: auto !important;
}

a {
    text-decoration: none;
    transition: all .25s ease;
}

ul,
ol {
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong {
    color: rgb(15, 65, 55);
    font-family: 'NotoKufiArabic-Bold';
    font-weight: normal;
    line-height: 1.5
}

h1 {
    font-size: 1.85rem;
}

h2 {
    font-size: 1.65rem;
}

h3 {
    font-size: 1.45rem;
}

h4 {
    font-size: 1.25rem;
}

h5 {
    font-size: 1.15rem;
}

h5 {
    font-size: 1rem;
}

hr {
    background: rgb(235, 235, 235);
    opacity: 1;
}

img {
    max-height: 100%;
}

/*------------------------ 2.  Header Section CSS ------------------------*/

.a-offcanvas-section ul li {
    width: 100%;
    display: inline-block;
}

.a-offcanvas-section ul li a {
    display: block;
    padding: 5px;
}

.a-offcanvas-section button:focus {
    outline: 0;
    box-shadow: none;
}

.a-offcanvas-section nav ul li {
    width: 100%;
    display: inline-block;
    position: relative;
}

.a-offcanvas-section nav ul li a {
    display: block;
    padding: 10px;
    position: relative;
    color: rgb(75, 75, 75);
    border-radius: 5px;
}

.a-offcanvas-section nav ul li.menu-item-has-children>a:after {
    content: '\f117';
    position: absolute;
    top: 20px;
    left: 0;
    font-family: 'Icon-Straight';
    font-size: .75rem;
    line-height: 1;
}

.a-offcanvas-section nav ul ul {
    display: none;
    padding: 0 15px 0 0;
    position: relative;
    font-size: .90rem;
}

.a-offcanvas-section ul li ul li a {
    display: block;
    padding: 5px 25px 5px 10px;
    position: relative;
}

.a-offcanvas-section ul li ul li a:before {
    content: '';
    width: 15px;
    height: 1.5px;
    position: absolute;
    top: 20px;
    right: 0;
    background: rgb(75, 75, 75);
}

.a-header-section {
    width: 100%;
    float: right;
    padding: 15px 0;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 25
}

.a-header-section.a-page {
    background: var(--Primary-Color);
}

.a-header-section img {
    max-width: 150px;
}

.a-header-section .a-actions {
    display: flex;
    justify-content: flex-end;
}

.a-header-section .a-actions ul li {
    display: inline-block;
}

.a-header-section .a-actions ul li a {
    display: block;
    padding: 10px;
    position: relative;
    color: rgb(255, 255, 255);
}

.a-header-section .a-actions ul li .a-responsive {
    display: none;
}

.a-header-section .a-actions ul li .a-responsive button {
    background: transparent;
    border: 0;
    color: rgb(255, 255, 255);
}

.a-header-section .a-menu-section {
    width: 100%;
}

.a-header-section .a-menu-section nav ul {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.a-header-section .a-menu-section nav ul li {
    display: inline-block;
    position: relative;
}

.a-header-section .a-menu-section nav ul li a {
    display: block;
    padding: 15px 5px;
    position: relative;
    color: rgb(255, 255, 255);
    text-align: center;
}

.a-header-section .a-menu-section nav ul li a:hover {
    opacity: .90;
}

.a-header-section .a-menu-section nav ul li a.a-active:before {
    content: '\f32c';
    font-family: 'Icon-Straight';
    position: absolute;
    bottom: -15px;
    right: 0;
    left: 0;
}

.a-header-section .a-menu-section nav ul li a:hover,
.a-header-section .a-menu-section nav ul li a.a-active {
    color: rgb(255, 255, 255);
}

.a-header-section .a-menu-section nav ul li.menu-item-has-children>a {
    padding: 15px 0 15px 20px;
    position: relative;
}

.a-header-section .a-menu-section nav ul li.menu-item-has-children>a:before {
    content: '\f117';
    position: absolute;
    top: 25px;
    left: 0;
    font-family: 'Icon-Straight';
    font-size: .75rem;
    line-height: 1;
}

.a-header-section .a-menu-section nav ul li ul li.menu-item-has-children>a {
    padding: 5px 15px;
}

.a-header-section .a-menu-section nav ul li ul li.menu-item-has-children>a:before {
    top: 15px;
    left: 15px;
}

.a-header-section .a-menu-section nav ul li ul {
    min-width: 200px;
    display: none;
    margin: 15px 0;
    padding: 5px 0;
    position: absolute;
    top: 100%;
    right: 0;
    font-size: .95rem;
    background: rgb(255, 255, 255);
    border: 1px solid rgb(235, 235, 235);
    border-radius: 5px;
    animation: rotateY 300ms ease-in-out forwards;
    transform-origin: top center;
    perspective: 1000px;
    box-shadow: 0 0 10px rgb(0 0 0 / 15%);
    z-index: 1090;
}

.a-header-section .a-menu-section nav ul li ul ul {
    top: 0;
    right: 100%;
}

.a-header-section .a-menu-section nav ul li:hover>ul {
    display: block;
    margin: 0;
}

.a-header-section .a-menu-section nav ul li ul li {
    width: 100%;
}

.a-header-section .a-menu-section nav ul li ul li a {
    display: block;
    padding: 5px 15px;
    text-align: right;
    color: rgb(75, 75, 75);
}

.a-header-section .a-menu-section nav ul li ul li a:hover {
    color: var(--Primary-Color);
}

@-moz-keyframes rotateY {
    0% {
        transform: rotateY(90deg);
    }

    80% {
        transform: rotateY(-10deg);
    }

    100% {
        transform: rotateY(0);
    }
}

@-webkit-keyframes rotateY {
    0% {
        transform: rotateY(90deg);
    }

    80% {
        transform: rotateY(-10deg);
    }

    100% {
        transform: rotateY(0);
    }
}

@keyframes rotateY {
    0% {
        transform: rotateY(90deg);
    }

    80% {
        transform: rotateY(-10deg);
    }

    100% {
        transform: rotateY(0);
    }
}

.a-search-section {
    position: relative;
}

.a-search-section form input {
    width: 100%;
    height: 45px;
    margin: 0 5px 0 0;
    padding: 0 10px;
    background: #fff;
    color: rgb(15, 65, 55);
    border: 1px solid rgb(15, 65, 55);
    border-radius: 5px;
}

.a-search-section form input::placeholder {
    color: rgb(15, 65, 55);
}

.a-search-section form input:focus {
    outline: 0;
}

.a-search-section form button {
    padding: 0;
    position: absolute;
    top: 15px;
    left: 5px;
    background: transparent;
    color: rgb(15, 65, 55);
    border: 0;
}

@media screen and (max-width: 991px) {

    .a-header-section {
        position: relative;
        background: var(--Primary-Color);
    }

    .a-header-section .a-actions {
        text-align: center;
    }

    .a-header-section .a-actions ul li .a-responsive {
        display: block;
    }
}

@media screen and (max-width: 576px) {

    .a-header-section img {
        max-width: 100px;
    }

    .a-header-section .a-actions ul li a.a-profile {
        display: none;
    }
}

/*------------------------ 6.  Books Section CSS ------------------------*/

.a-books-section {
    width: 100%;
    display: inline-block;
    padding: 0 0 90px;
}

.a-books-section figure {
    margin: 0;
    padding: 0 0 0 90px;
}

.a-books-section .a-section {
    margin: 0 auto;
    padding: 0 0 15px;
    position: relative;
}

.a-books-section .a-section h2 {
    display: inline-block;
    margin: 0;
    position: relative;
    font-family: 'IranNastaliq';
    font-size: 2.5rem;
    color: var(--Primary-Color);
}

.a-books-section .a-section h2:after {
    content: '';
    width: 45px;
    height: 45px;
    position: absolute;
    top: 0;
    left: -60px;
    background: url(assets/img/Heading-Left.png) no-repeat;
    background-size: contain;
}

.a-books-section .a-content {
    text-align: justify;
}

@media screen and (max-width: 991px) {

    .a-books-section figure {
        padding: 0;
    }
}

@media screen and (max-width: 576px) {

    .a-books-section .a-section h2:after {
        display: none;
    }
}

/*------------------------ 9. Footer Section CSS ------------------------*/

.a-footer-section {
    width: 100%;
    display: inline-block;
    position: relative;
    z-index: 15;
}

.a-footer-section .a-section {
    margin: 0 auto;
    padding: 0 0 15px;
    position: relative;
}

.a-footer-section .a-copyright {
    padding: 30px 0;
    position: relative;
    font-family: 'NotoKufiArabic-Light';
    text-align: center;
}

.a-footer-section .a-copyright p {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}

@media screen and (max-width: 991px) {

    .a-footer-section {
        text-align: center;
    }

    .a-footer-section .a-menu strong,
    .a-footer-section .a-social strong {
        margin: 15px 0;
    }

    .a-footer-section .a-about {
        padding: 0 0 15px;
    }

    .a-footer-section .a-social ul {
        justify-content: center;
    }

    .a-footer-section .a-copyright {
        padding: 15px 0;
    }
}

/*------------------------ 10. Cover Section CSS ------------------------*/

.a-cover-section {
    width: 100%;
    clear: both;
    margin: 0 0 30px;
    padding: 90px 0 160px;
    position: relative;
    background: var(--Primary-Color);
}

.a-cover-section .svg {
    width: 100%;
    position: absolute;
    bottom: -55px;
    right: 0;
    left: 0;
    z-index: 15;
}

.a-cover-section .svg img {
    width: 100%;
}

@media screen and (max-width: 991px) {

    .a-cover-section {
        margin: 0;
        padding: 0 0 130px;
    }

    .a-cover-section .svg {
        bottom: 0;
    }
}

@media screen and (max-width: 335px) {

    .a-cover-section .svg {
        bottom: -5px
    }
}

@media screen and (max-width: 260px) {

    .a-cover-section .svg {
        bottom: -10px
    }
}

/*------------------------ 13. Post Section CSS ------------------------*/

.a-excerpt-section {
    width: 100%;
    display: block;
    margin: 60px 0 -180px;
    position: relative;
    color: rgb(255, 255, 255);
    z-index: 15;
}

.a-excerpt-section .a-content {
    padding: 0 30px 0 0;
    font-size: 1rem;
}

.a-excerpt-section .a-content span {
    display: inline-block;
    margin: 0 0 15px;
    padding: 0 15px;
    font-size: .90rem;
    line-height: 2;
    color: rgb(255, 255, 255);
    border-radius: 300px;
    box-shadow: 5px 5px 30px 0 rgb(35 33 33 / 5%);
}

.a-excerpt-section .a-content h1 {
    font-size: 1.25rem;
    line-height: 1.5;
    color: rgb(255, 255, 255);
}

.a-excerpt-section .a-content p {
    color: rgba(255, 255, 255, .75);
    line-height: 1.95;
    text-align: justify;
}

.a-excerpt-section .a-meta ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.a-excerpt-section .a-meta ul li {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    gap: 5px;
    padding: 0 5px 0 0;
    font-size: 1.25rem
}

.a-excerpt-section .a-meta ul li i {
    display: block;
    font-size: 1rem;
    line-height: .5;
    color: rgb(255, 160, 25)
}

.a-thumbnail-section {
    width: 100%;
    display: inline-block;
    position: relative;
}

.a-thumbnail-section img {
    width: 100%;
    height: 600px;
    display: block;
    border-radius: 30px;
    box-shadow: 5px 5px 30px 0 rgb(0 0 0 / 5%);
    object-fit: cover;
}

.a-author-section {
    width: 100%;
    padding: 0 30px;
    display: flex;
    align-items: center;
    gap: 5px;
    position: relative;
    font-size: .85rem;
    z-index: 15
}

.a-author-section img {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    box-shadow: 5px 5px 30px 0 rgb(0 0 0 / 5%)
}

.a-author-section .a-info strong {
    display: block;
    padding: 0 0 5px;
    line-height: 1.15
}

.a-author-section .a-info span {
    display: block;
    font-size: .75rem;
    color: rgb(95, 95, 95);
}

@media screen and (max-width: 767px) {

    .a-author-section {
        margin: 15px 0;
        padding: 0;
    }
}

.a-social-section {
    width: 100%;
    display: inline-block;
    padding: 0 30px;
    position: relative;
    z-index: 100
}

.a-social-section ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.a-social-section ul li {
    display: inline-block;
}

.a-social-section ul li img {
    max-width: 45px;
    border-radius: 50%;
    box-shadow: 5px 5px 30px 0 rgb(0 0 0 / 5%)
}

.a-content-section {
    width: 100%;
    display: inline-block;
    padding: 30px 0 190px;
}

.a-content-section .a-description {
    width: 100%;
    float: right;
    margin: 0 0 15px;
    padding: 30px;
    position: relative;
    font-size: 1rem;
    background: rgb(255, 255, 255);
    text-align: justify;
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 5px 5px 30px 0 rgb(0 0 0 / 5%);
    z-index: 15
}

.a-content-section .a-description figure {
    margin: 0;
    padding: 15px 15px 0
}

.a-content-section .a-description figure img {
    width: 100%;
    border-radius: 20px;
}

.a-content-section .a-description h1,
.a-content-section .a-description h2,
.a-content-section .a-description h3,
.a-content-section .a-description h4,
.a-content-section .a-description h5,
.a-content-section .a-description h6 {
    text-align: right;
}

.a-content-section .a-description h1 {
    font-size: 1.5rem
}

.a-content-section .a-description h2 {
    font-size: 1.35rem
}

.a-content-section .a-description h3 {
    font-size: 1.25rem
}

.a-content-section .a-description h4 {
    font-size: 1.15rem
}

.a-content-section .a-description h5 {
    font-size: 1rem
}

.a-content-section .a-description img {
    display: block;
    margin: 0 auto 15px;
    border-radius: 15px;
}

.a-content-section .a-description p {
    margin: 0 0 15px;
    color: rgb(60, 60, 60);
    line-height: 2;
    text-align: justify;
}

.a-content-section .a-description table {
    width: 100%;
    margin: 0 0 15px;
}

.a-content-section .a-description table th,
.a-content-section .a-description table td {
    padding: 5px;
    font-weight: normal;
    border-bottom: 1px solid rgb(250, 250, 250);
}

.a-content-section .a-description ul li {
    width: 100%;
    float: right;
    display: inline-block;
    padding: 0 15px;
    line-height: 2;
    position: relative;
}

.a-content-section .a-description ul li:before {
    content: '';
    width: 5px;
    height: 5px;
    position: absolute;
    top: 12px;
    right: 0;
    background: var(--Primary-Color);
    box-shadow: 0 0 0 2px rgb(250 165 15 / 50%);
    border-radius: 50%;
}

.a-content-section .a-description .a-popular {
    width: 100%;
    float: right;
    padding: 15px 0 0;
}

.a-content-section .a-description .a-popular ul li {
    width: auto;
    display: inline-block;
    padding: 0;
    line-height: normal;
}

.a-content-section .a-description .a-popular ul li:before {
    display: none;
}

.a-content-section .a-description .a-popular ul li a {
    display: inline-block;
    margin: 0 0 5px 5px;
    padding: 0 15px;
    font-size: .75rem;
    line-height: 2;
    color: rgb(100, 100, 100);
    border: 1px solid rgb(100, 100, 100);
    border-radius: 300px;
    box-shadow: rgb(30 25 30 / 15%) 0 0 5px;
}

.a-content-section .a-description .a-popular ul li a:hover {
    background: rgb(100, 100, 100);
    color: rgb(255, 255, 255);
}

@media screen and (max-width: 991px) {

    .a-excerpt-section {
        margin: 30px 0 -60px
    }

    .a-excerpt-section .a-content {
        padding: 0 15px;
    }

    .a-excerpt-section .a-info ul {
        justify-content: center;
        margin: 0 0 15px;
    }

    .a-thumbnail-section img {
        height: auto;
        margin: 15px auto;
    }

    .web-author-section {
        justify-content: center;
        margin: 60px 0 0;
    }

    .a-social-section ul {
        justify-content: center;
        padding: 15px 0 0;
    }

    .a-content-section .a-description {
        padding: 30px 15px;
        text-align: right;
    }

    .a-content-section .a-description p {
        text-align: right;
    }
}

/*------------------------ 14. Search Section CSS ------------------------*/

.a-search-posts-sction {
    width: 100%;
    display: inline-block;
    margin: -120px 0 0;
    padding: 0 0 190px;
}

/*------------------------ 15. 404 Section CSS ------------------------*/

.a-404-section {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.a-404-section .row {
    width: 100%;
}

.a-404-section h2 {
    width: 100%;
    height: 200px;
    display: flex;
    font-family: 'NotoKufiArabic-Black';
    font-size: 12rem;
    position: relative;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    align-items: center;
}

.a-404-section h2:before,
.a-404-section h2:after {
    content: attr(data-content);
    position: absolute;
    color: var(--Primary-Color);
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 40%, 0 60%);
    clip-path: polygon(0 100%, 100% 100%, 100% 40%, 0 60%);
    -webkit-animation: transition 1.5s infinite linear;
    animation: transition 1.5s infinite linear;
    -webkit-animation-delay: .5s;
    animation-delay: .5s;
}

.a-404-section h2:after {
    color: var(--Primary-Color);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 36%, 0 56%);
    clip-path: polygon(0 0, 190% 0, 100% 36%, 0 56%);
    -webkit-animation: slide 1.5s infinite linear;
    animation: slide 1.5s infinite linear;
    -webkit-animation-delay: .5s;
    animation-delay: .5s;
}

.a-404-section .a-content a {
    width: 200px;
    height: 45px;
    line-height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    position: relative;
    font-size: .90rem;
    background: var(--Primary-Color);
    color: rgb(255, 255, 255);
    text-align: center;
    box-shadow: 0 0 5px 0 rgb(30 25 30 / 5%);
    border-radius: 300px;
    outline: 2px solid var(--Primary-Color);
    outline-offset: 5px;
}

.a-404-section .a-content a:hover {
    opacity: .90;
}

@-webkit-keyframes transition {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    50% {
        -webkit-transform: translate(5px, -2%);
        transform: translate(5px, -2%)
    }
}

@keyframes transition {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    50% {
        -webkit-transform: translate(5px, -2%);
        transform: translate(5px, -2%)
    }
}

@media screen and (max-width: 767px) {

    .a-404-section {
        text-align: center;
    }

    .a-404-section .a-content a {
        margin: 0 auto;
    }
}

.a-nav-section {
    width: 100%;
    display: inline-block;
    padding: 10px 15px;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    text-align: center;
    background: rgb(255, 255, 255);
    box-shadow: 5px 5px 30px 0 rgb(0 0 0 / 5%);
    z-index: 25;
}

.a-nav-section .a-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.a-nav-section .a-nav input {
    width: 45px;
    height: 30px;
    text-align: center;
    color: rgb(15, 65, 55);
    border: 1px solid rgb(15, 65, 55);
    border-radius: 300px;
}

.a-nav-section .a-nav input:focus {
    border-color: var(--Primary-Color);
    outline: 0;
}

.a-book-section {
    width: 100%;
    display: inline-block;
    padding: 0 0 30px;
    position: relative;
    z-index: 15;
}

.a-book-section .container-fluid {
    padding: 0 60px;
}

@media screen and (max-width: 1260px) {

    .a-book-section .container-fluid {
        padding: 0 15px;
    }
}

.a-book-section .a-book {
    width: 100%;
    display: inline-block;
    position: relative;
    z-index: 15;
}

.a-book-section .a-book .a-menus-section {
    width: 100%;
    display: inline-block;
}

.a-book-section .a-book .a-menus-section.stickit {
    max-width: 425px;
    position: fixed;
    top: 15px;
}

.a-book-section .a-book .a-menus-section.stickit-end {
    position: absolute;
    right: 0;
    bottom: 30px;
}

.a-book-section .a-book .a-menus-section .a-search {
    width: 100%;
    display: inline-block;
    margin: 0 0 25px;
    padding: 15px;
    position: relative;
    background: rgb(255, 255, 255);
    box-shadow: 5px 5px 30px 0 rgb(0 0 0 / 5%);
}

.a-book-section .a-book .a-menus-section .a-search form {
    position: relative;
}

.a-book-section .a-book .a-menus-section .a-search form input {
    width: 100%;
    height: 45px;
    padding: 0 10px;
    background: rgb(255, 255, 255);
    color: rgb(15, 65, 55);
    border: 1px solid rgb(15, 65, 55);
    border-radius: 5px;
}

.a-book-section .a-book .a-menus-section .a-search form input:focus {
    outline: 0;
}

.a-book-section .a-book .a-menus-section .a-search form button {
    padding: 0;
    position: absolute;
    top: 15px;
    left: 10px;
    background: transparent;
    color: rgb(15, 65, 55);
    border: 0;
}

.a-book-section .a-book .a-menus-section .a-menu {
    width: 100%;
    display: inline-block;
    margin: 0 0 25px;
    padding: 15px;
    position: relative;
    background: rgb(255, 255, 255);
    box-shadow: 5px 5px 30px 0 rgb(0 0 0 / 5%);
    overflow: scroll;
}

.a-book-section .a-book .a-menus-section .a-menu ul li {
    width: 100%;
    display: block;
    padding: 2.5px 0;
    position: relative;
    font-size: .95rem;
    white-space: nowrap;
}

.a-book-section .a-book .a-menus-section .a-menu ul li a {
    display: block;
    padding: 0 15px 0 0;
}

.a-book-section .a-book .a-menus-section .a-menu ul li.menu-item-has-children>a:after {
    content: '\f118';
    position: absolute;
    top: 15px;
    right: 0;
    font-family: 'Icon-Straight';
    font-size: .75rem;
    line-height: .75;
}

.a-book-section .a-book .a-menus-section .a-menu ul li ul li a {
    color: rgb(90, 90, 90);
}

.a-book-section .a-book .a-menus-section .a-menu ul li div {
    display: flex;
    align-items: center;
    gap: 5px;
}

.a-book-section .a-book .a-menus-section .a-menu ul li i {
    font-size: .75rem;
    cursor: pointer;
}

.a-book-section .a-book .a-menus-section .a-menu ul li ul {
    display: none;
    margin: 15px 0;
    padding: 0 30px 0 0;
    position: relative;
}

.a-book-section .a-book .a-menus-section .a-menu ul li ul:before {
    content: '';
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    border-right: 1px dashed rgb(90, 90, 90);
}

.a-book-section .a-book .a-menus-section .a-menu ul li ul li {
    color: rgb(90, 90, 90);
}

.a-book-section .a-book .a-menus-section .a-menu ul li ul li:before {
    content: '';
    width: 5px;
    height: 5px;
    background: rgb(90, 90, 90);
    position: absolute;
    top: 15px;
    right: -15px;
    border-radius: 50%;
}

.a-book-section .a-book .a-description article {
    width: 100%;
    min-height: 600px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin: 0 0 30px;
    padding: 30px;
    position: relative;
    font-size: 1rem;
    background: rgb(245, 245, 235);
    text-align: justify;
    overflow: hidden;
    border: 1px solid rgb(235, 235, 235);
    border-radius: 20px;
    box-shadow: 0 0 15px 0 rgba(245, 245, 235, .5);
    z-index: 15;
}

.a-book-section .a-book .a-description header {
    display: block;
    margin: 0 0 30px;
    padding: 0 0 15px;
    color: rgb(90, 90, 90);
    border-bottom: 1px solid rgba(90, 90, 90, .15);
}

.a-book-section .a-book .a-description header h2 {
    margin: 0;
    font-size: 1.25rem;
    color: rgb(90, 90, 90);
}

.a-book-section .a-book .a-description header span {
    display: block;
    text-align: left;
    font-size: 1.25rem;
}

.a-book-section .a-book .a-description .a-ref {
    position: relative;
    top: -5px;
    font-family: 'NotoKufiArabic-Medium';
    font-size: 1rem;
    font-weight: normal;
    color: rgb(200, 15, 15);
    cursor: pointer;
}

.a-book-section .a-book .a-description .a-arabic {
    font-family: 'Arabic';
    font-weight: bold;
}

.a-book-section .a-book .a-description .a-content .a-arabic {
    font-size: 1.5rem;
    font-weight: bold;
    color: rgb(0, 115, 10);
}

.a-book-section .a-book .a-description ul li {
    width: 100%;
    display: inline-block;
}

/*
.a-book-section .a-book .a-description ul li {
    padding: 0 15px 0 0;
    display: inline-block;
    position: relative;
}

.a-book-section .a-book .a-description ul li:before {
    content: '';
    width: 10px;
    height: 10px;
    position: absolute;
    top: 10px;
    right: 0;
    background: var(--Primary-Color);
    border-radius: 50%;
}
*/

.a-book-section .a-book .a-description footer {
    width: 100%;
    display: inline-block;
    margin: 15px 0 0;
    padding: 15px 0 0;
    border-top: 1px solid rgba(90, 90, 90, .15);
}

.a-book-section .a-book .a-description footer ul li {
    display: flex;
    gap: 5px;
    font-size: .90rem;
}

.a-book-section .a-book .a-description footer ul li p {
    margin: 0 0 5px;
}

.a-book-section .a-book .a-description footer ul li i {
    font-style: normal;
    color: rgb(200, 15, 15);
}

.a-book-section .a-book .a-description footer ul li:last-child {
    margin: 0 0 -10px;
}

.a-book-section .a-book .a-description footer ul li:last-child p {
    margin: 0;
}