*{margin: 0;   padding: 0;  box-sizing: border-box}
body{background-color: #131313}
.tinos-bold {font-family: "Tinos", serif;  font-weight: 700;  font-style: normal;  letter-spacing: 1px}
.alegreya {
  font-family: "Alegreya", serif;
  font-optical-sizing: auto;
  font-style: normal;
  letter-spacing: .5px !important;
  text-transform:capitalize
}
dl, ol, ul{margin-bottom:0}
.color-fe-sma{color: #F8F8F8}
.color-13-sma{color: #131313}
.gold-sma{color: #d79b4b}
.jomhuria-regular {font-family: "Jomhuria", serif;  font-weight: 400;  font-style: normal}
.fustat {  font-family: "Fustat", sans-serif; font-optical-sizing: auto; font-style: normal}
.bg-dark-sma{background-color: #131313}
.bg-dark-sma2{background-color: #131313}
.rtl, .dir-rtl {direction: rtl}
body.dark-mode .color-fe-sma { color: #131313; }
body.dark-mode .footer-contact .color-fe-sma { color: #3e3e3e }
body.dark-mode .bg-dark-sma, body.dark-mode .bg-dark-sma2 {background-color: #e5e5e5}
.bgc-f8-sma{background-color: #f8f8f8}
.active a{color: #d79b4b}
body.dark-mode .active a{color: #7d7a7a}
.border-r-10{border-radius: 10px}
.p-li-md-sma{padding: 3px 10px} 
.position-relative-sma{position: relative}
.fit-content-sma {  max-width: fit-content;   margin-inline: auto}
.first-img-sma{position: fixed;   top: 0;   left: 0;   width: 100%}
@media(max-width: 767px){
    .bgi-main-sma-sm{background:  url('../../../public/front/images/main/polysm.webp') repeat center center;  background-size: cover}
    .bgi-main-sma-sm2{background-size: auto}
    body.dark-mode .bgi-main-sma-sm {
        background: url(../../../public/front/images/main/O9FG5Q0sm.webp) repeat center center;
        background-size: cover;
    }
    .fs-13-sm{font-size: 13px}
    .p-md-sma{padding: 5px 10px}
    .letter-spacing-one{ letter-spacing: 1px}
}
@media(min-width: 768px){
    .p-md-sma{padding: 5px 25px}
    .fs-59-md-sma{font-size: 59px}
    .letter-spacing-one{ letter-spacing: 1px !important}
}
.gold-one-sma:hover{border-top: 2px solid #d79b4b;   color: #d79b4b;   font-weight: bold}
.gold-one-sma:hover a{color: #d79b4b}
body.dark-mode .gold-one-sma:hover {border-top: 2px solid #131313;   color: #131313}
body.dark-mode .gold-one-sma:hover a{color: #131313}
.border-all-sma::before, 
.border-top-sma::before{ 
    content: "";
    display: block;
    position: absolute;
    width: 90%;
    left: 5%;
    background-color: #d79b4b;
    height: 1px
}
body.dark-mode .border-all-sma::before, body.dark-mode .border-top-sma::before{    background-color: #3e3e3e}
.border-all-sma::before{ bottom: 0}
.border-top-sma::before{ top: 0}
.navbar .btn-hover-sma:hover{color: #d79b4b}
body.dark-mode .gold-sma,
body.dark-mode .navbar .btn-hover-sma:hover{color: #131313}
div.openMenu {z-index: 99999999 !important;}
.offcanvas{height: auto; z-index: 99999;}
.offcanvas.offcanvas-start{width:100%;}
.offcanvas .offcanvas-header .btn-close-sma{font-size: 33px; color: grey }
.offcanvas .offcanvas-header .btn-close-sma:hover{border-bottom: 2px solid #d79b4b;  color: #d79b4b}
.footer-links ul { border-top: 1px solid #d79b4b;  border-bottom: 1px solid #d79b4b}
body.dark-mode .offcanvas .offcanvas-header .btn-close-sma:hover{color: #898989;     border-bottom: 2px solid #898989}
.footer-links ul { border-top: 1px solid #d79b4b;  border-bottom: 1px solid #d79b4b}
body.dark-mode .footer-links ul {  border-top: 1px solid #131313;  border-bottom: 1px solid #131313}
.first-img-sma-r,
.second-img-sma,
.the-main-logo2,
body.dark-mode .first-img-sma-r, 
body.dark-mode .the-main-logo2,
.the-black-logo{display: none}
.the-black-logo2{width: 100px}
body:not(.dark-mode)  .the-main-logo2,
body.dark-mode .the-black-logo {display: inline-block}
@media(min-width: 768px){
    body:not(.dark-mode) .first-img-sma-r{ display: block}
    body:not(.dark-mode) .second-img-sma  {display: none}
    body.dark-mode .second-img-sma  { display: block}
    .the-main-logo { width: 100px }
}
@media(max-width:990px){
    .first-nav-sma{ flex-direction: row}
    .first-nav-sma .color-fe-sma {font-size: 11px}
    .offcanvas.offcanvas-start {  overflow: scroll !important; height: auto}
}
.gold-gradient-sma{
    background: linear-gradient(358deg, rgba(248,248,248,1) 25%,  rgba(214,155,75,1) 50%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}
body.dark-mode .gold-gradient-sma {
    background: linear-gradient(358deg, #3e3e3e 25%, rgb(13 13 13) 25%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.blog-sma .title-sma::before, .blog-sma .title-sma::after {
    content: " ";
    position: absolute;
    bottom: -10px;
    width: 0;
    height: 2px;
    transition: all .15s ease-in-out
}
.blog-sma .title-sma::after {right: 50%;   animation: animate_two 1s linear forwards}   
.blog-sma .title-sma::before {left: 50%;   animation: animate_one 1s linear forwards}
body.dark-mode .blog-sma .title-sma::after,
body.dark-mode .blog-sma .title-sma::before{animation: none; background: linear-gradient(15deg, #131313 10%,  #131313 50%); opacity: 1;   width: 7%}
@keyframes animate_two {
    0% {opacity: 0}
    50%{opacity: .5;  width: 5%; }
    100%{opacity: 1;   width: 7%;  background: linear-gradient(15deg, rgb(177, 177, 177)10%,  rgba(214,155,75,1) 50%)}
}
@keyframes animate_one {
    0% {opacity: 0}
    50%{opacity: .5;    width: 5%; }
    100%{opacity: 1;    width: 7%;   background: linear-gradient(15deg,  rgba(214,155,75,1) 50%, rgba(177, 177, 177) 10%)}
}
.articles-sma{ word-break: break-all}
.articles-sma .article-container-sma{background-color: rgba(19,19,19, .55); border-radius: 4px}
body.dark-mode .articles-sma .article-container-sma{background-color: rgba(19,19,19, .05)}
.articles-sma .article-container-sma .image-container-sma{
    padding: 25px 25px 0 25px;
    border-top: 1px solid #d79b4b;
    border-right: 1px solid #d79b4b;
    border-left: 1px solid #d79b4b;
    overflow: hidden
}
body.dark-mode .articles-sma .article-container-sma .image-container-sma {
    border-top: 1px solid #898989;
    border-right: 1px solid #898989;
    border-left: 1px solid #898989;
}
.articles-sma .article-container-sma .image-container-sma img{border-radius: 3px; transition: all 1s ease-in-out}
.articles-sma .article-container-sma:hover .image-container-sma img{transform: scale(1.05)}    
.articles-sma .article-container-sma:hover .image-container-sma{border-top: 1px solid #EAB543;   border-right: 1px solid #EAB543;   border-left: 1px solid #EAB543}
.articles-sma .article-container-sma .article-content-sma{padding: 25px;   text-align: justify}
.articles-sma .article-container-sma .article-content-sma h5{height: 65px}
.articles-sma .article-container-sma .article-content-sma::before{
    content: " ";
    position: absolute;
    top: -2px;
    left: 0;
    width: 1px;
    height: 90%;
    background-color: #cd9448
}
body.dark-mode .articles-sma .article-container-sma .article-content-sma::before,
body.dark-mode .articles-sma .article-container-sma .article-content-sma::after{background-color: #898989}
.link-sma{text-align: right}
.articles-sma .article-container-sma .article-content-sma::after{
    content: " ";
    position: absolute;
    bottom: 38px;
    left: 0;
    width: 65%;
    height: 1px;
    background-color: #cd9448
}
.articles-sma .article-container-sma:hover .article-content-sma::before,
.articles-sma .article-container-sma:hover .article-content-sma::after{background-color: #EAB543}
.articles-sma .article-container-sma .article-content-sma:hover h5{color: #EAB543}
body.dark-mode .articles-sma .article-container-sma .article-content-sma:hover h5{color: #131313}
.articles-sma .article-container-sma .article-content-sma:hover .link-sma{padding-right: 3px; font-weight: bold}
.articles-sma .article-container-sma .article-content-sma .link-sma i{font-size: 13px;   position: absolute;  right: 31%;   bottom: 28%}
.active>.page-link, .page-link.active{background-color: #d79b4b;   border-color: #d79b4b}
.page-link:hover{background-color: #f8f8f8;   border-color: #d79b4b; color: #d79b4b}
.page-link {background-color: transparent; color: #d79b4b; border: 1px solid #d79b4b}
li.page-item{    margin-right: .25rem !important;   margin-left: .25rem !important}
li.page-item.disabled .page-link{border: 1px solid #f8d19f; color: #f8f8f8; background-color: #d79b4b}
@media(max-width: 360px){
    .articles-sma .article-container-sma .article-content-sma::before{height: 90%} 
    .articles-sma .article-container-sma .article-content-sma h5{font-size:16px; height: 67px}
    .articles-sma .article-container-sma .article-content-sma p{height: 200px}
    .articles-sma .article-container-sma .article-content-sma .link-sma i{right: 40%}
    .articles-sma .article-container-sma .article-content-sma::after{width: 57%} 
}
@media(min-width: 361px) and (max-width: 425px){
    .articles-sma .article-container-sma .article-content-sma::before{height: 88%} 
    .articles-sma .article-container-sma .article-content-sma h5{font-size:16px; height: 50px}
    .articles-sma .article-container-sma .article-content-sma p{height: 155px}
    .articles-sma .article-container-sma .article-content-sma .link-sma i{right: 33%}
    .articles-sma .article-container-sma .article-content-sma::after{width: 64%}
}
@media(min-width: 426px) and (max-width: 500px){
    .articles-sma .article-container-sma .article-content-sma::before{height: 86%} 
    .articles-sma .article-container-sma .article-content-sma p{height: 125px}
}
@media(min-width: 501px) and (max-width: 575px){
    .articles-sma .article-container-sma .article-content-sma::before{height: 85%} 
    .articles-sma .article-container-sma .article-content-sma p{height: 110px}
}
@media(min-width: 426px) and (max-width: 575px){
    .articles-sma .article-container-sma .article-content-sma h5{font-size:16px; height: 30px}
    .articles-sma .article-container-sma .article-content-sma .link-sma i{right: 33%}
}
@media(min-width: 576px) and (max-width: 767px){
    .articles-sma .article-container-sma .article-content-sma h5{height: 40px}
    .articles-sma .article-container-sma .article-content-sma::before{height: 85%} 
    .articles-sma .article-container-sma .article-content-sma .link-sma i{right: 33%}
}
@media(max-width: 767px){.xs-mt-0 {margin-top: 0 !important}}
@media(min-width: 768px) and (max-width: 991px){
    .articles-sma .article-container-sma .article-content-sma h5{font-size: 17px}
    .articles-sma .article-container-sma .article-content-sma p{font-size: 15px; height: 190px}
}
@media(min-width: 992px) and (max-width: 1199px){
    .articles-sma .article-container-sma .article-content-sma::before{height: 89%}
    .articles-sma .article-container-sma .article-content-sma h5{font-size: 19px}
    .articles-sma .article-container-sma .article-content-sma p{height: 150px}
    .articles-sma .article-container-sma .article-content-sma .link-sma i{right: 32%}
}
@media(min-width: 1200px) and (max-width: 1399px){
    .articles-sma .article-container-sma .article-content-sma h5 {font-size: 18px}
    .articles-sma .article-container-sma .article-content-sma p{height: 200px}
}
@media(min-width: 1400px){
    .articles-sma .article-container-sma .article-content-sma h5{height: 77px; font-size: 22px}
    .articles-sma .article-container-sma .article-content-sma p{height: 220px; font-size: 19px}
    .articles-sma .article-container-sma .article-content-sma::before {top: -1px;   height: 90% }
}
@media(min-width: 991px){  .w-md-75{width:75%; font-size:  19px}}
@media(max-width: 550px){  .w-75-xs{font-size: 13px;   width: 75%}}
@media(min-width: 768px){h5{font-size: 19px}}
@media(max-width: 767px){h5{font-size: 16px}  .article-content-sma{font-size: 15px}}
.footer .call-sma {position: fixed;  bottom: 80px; cursor: pointer}
.footer .call-sma i{color: #25d366; border-radius: 5%}
.footer .fa-brands{line-height: .7}
@media(min-width: 768px) {
    .footer .call-sma{right: 3%}
    .footer .call-sma i{font-size: 59px}
    .footer .call-sma .content{display: inline-block !important;    margin: 0 10px 15px;  font-size: 13px;   border: 1px solid #d79b4b}
    body.dark-mode .footer .call-sma .content{border: 1px solid #131313}
    .Background-img-designed { font-size: 11px}
}
@media(max-width: 767px){
    .first-img-sma{display: none}
    .footer-logo img{width: 60%}
    .menu-smaimg{width: 20%}
    .footer-links ul li a{font-size: 12px}
    .footer-contact ul li a{font-size: 11px}
    .footer .call-sma{left: 2%}
    .footer .call-sma i{font-size: 40px}
    .bgidd{text-align: center}
    .Background-img-designed { font-size: 8px}
}