/*fonts*/
@font-face {
    font-family: 'main-font';
    font-weight: normal;
    src: url('../fonts/BukraAlt_Regular.eot');
    src: url('../fonts/BukraAlt_Regular.eot') format('embedded-opentype'), url('../fonts/BukraAlt_Regular.woff2') format('woff2'), url('../fonts/BukraAlt_Regular.woff') format('woff'), url('../fonts/BukraAlt_Regular.ttf') format('truetype'), url('../fonts/BukraAlt_Regular.svg#BukraAlt_Regular') format('svg');
}

@font-face {
    font-family: 'main-font';
    font-weight: bold;
    src: url('../fonts/BukraAlt_Bold.eot');
    src: url('../fonts/BukraAlt_Bold.eot') format('embedded-opentype'), url('../fonts/BukraAlt_Bold.woff2') format('woff2'), url('../fonts/BukraAlt_Bold.woff') format('woff'), url('../fonts/BukraAlt_Bold.ttf') format('truetype'), url('../fonts/BukraAlt_Bold.svg#BukraAlt_Bold') format('svg');
}
@font-face {
    font-family: 'numbers-font';
    src:url('../fonts/AlHilal-number-Regular.ttf') format('truetype');
} 


body {
    font-family: 'main-font';
    direction: rtl;
    font-size: 16px;
    background: #f5f5f5;
    color: #333;
    line-height: 1.5;
}
[dir="rtl"] body{
    text-align: right;
}


/*header*/
.top-header-cont {
    background-color: #000A46;
    padding: 10px 0px;
}
.top-header-content-cont {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.top-header-content-cont * {
    color: #fff !important;
    font-size: 14px;
}
.top-header-links ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
.header-bottom-cont .container {
    display: flex;
    align-items: center;
}
.header-bottom-links ul {
    list-style: none;
    padding: 0 30px;
    margin: 0px;
}
.header-bottom-links ul a {
    font-weight: bold;
    font-size: 14px;
}
.header-bottom-cont {
    margin: 15px 0px;
}


/*main nav*/
.main-nav{
    background-image: url(../images/nav-bg.svg);
    background-size: cover;
    min-height: 200px;
    background-position: center;
}
.main-nav .container{
    background-image: url(../images/nav-shadow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    min-height: 200px;
    display: flex;
    align-items: center;
}
.main-nav-title{
    font-size: 40px;
    font-weight: bold;
    color: #fff;
}
.main-nav-title small {
    display: block;
    font-size: 12px;
    max-width: 400px;
    margin-top: 8px;
    line-height: 2;
}

/*footer*/
.main-footer{
    background-color: #000D50;
    padding: 10px 0px;
}
.main-footer *{
    color:#fff;
    font-size: 14px;
}
.main-footer p{
    margin: 0px;
}


/*packages*/
.membership-package {
    height: 200px;
    display: flex;
    align-items: center;
    background-position: center;
    background-size: cover;
    padding-bottom: 50px;
}
.membership-package-1 {
    background-image: url(../images/membership-bg-1.svg);
}
.membership-package-2 {
    background-image: url(../images/membership-bg-2.svg);
}
.membership-package-3 {
    background-image: url(../images/membership-bg-3.svg);
}
.membership-package-title {
    font-weight: bold;
    font-size: 30px;
    margin-bottom: 10px;
    color: #fff;
}
.membership-package-des {
    font-size: 12px;
    color: #fff;
    max-width: 400px;
}
.membership-package-items {
    margin-top: -60px;
}

.membership-package-item {
    background-color: #fff;
    box-shadow: 0px 0px 30px #00000014;
    margin-bottom:100px;
    flex:1;
    max-width: 300px;
}

.membership-package-item-header {
    display: flex;
    justify-content: space-between;
    padding-top: 22.5px;
    position: sticky;
    top: -23px;
    background-color: #fff;
}

.membership-package-item-header-name {
    padding: 8px 20px;
    background-color: #e8e8e8;
    font-weight: bold;
    font-size: 14px;
}

.membership-package-item-header-price {
    padding: 0px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.membership-package-item-header-price span {
    font-weight: bold;
    font-size: 25px;
}

.membership-package-item-feature {
    font-size: 9px;
}

.membership-package-item-features {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 20px;
}

.membership-package-item-features .membership-package-item-feature {
    padding-top:1px;
    padding-bottom: 5px;
    display: flex;
    justify-content: space-between;
    height: 19px;
    align-items: center;
}
.membership-package-item-features .membership-package-item-feature:not(:last-child) {
    border-bottom: 0.5px solid #e9e9e9;
}

.membership-package-items .container {
    display: flex;
    gap: 20px;
    overflow-x: auto;
}
.membership-package-item-btn a{
    display: block;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    padding: 14px;
    color: #fff;
    text-decoration: none !important;
}
.membership-package-items-1 .packages-features-yes {
    fill: #0021f9;
}
.membership-package-items-1 .membership-package-item-header-name {
    background-color: #0021f9;
    color: #fff;
}
.membership-package-items-1 .membership-package-item-header-price span {
    color: #0021f9;
}
.membership-package-items-1 .membership-package-item-btn a{
    background-color: #0021f9;
}

.membership-package-items-2 .packages-features-yes {
    fill: #D0C07A;
}
.membership-package-items-2 .membership-package-item-header-name {
    background-color: #D0C07A;
    color: #fff;
}
.membership-package-items-2 .membership-package-item-header-price span {
    color: #D0C07A;
}
.membership-package-items-2 .membership-package-item-header-price svg *{
 fill: #D0C07A !important;
}
.membership-package-items-2 .membership-package-item-btn a{
    background-color: #D0C07A;
}

.membership-package-items-3 .packages-features-yes {
    fill: #7030A0;
}
.membership-package-items-3 .membership-package-item-header-name {
    background-color: #7030A0;
    color: #fff;
}
.membership-package-items-3 .membership-package-item-header-price span {
    color: #7030A0;
}
.membership-package-items-3 .membership-package-item-header-price svg *{
 fill: #7030A0 !important;
}
.membership-package-items-3 .membership-package-item-btn a{
    background-color: #7030A0;
}