/*======================================================= 1. THEME STYLING START ========================================================*/

@font-face {
    font-family: 'Libre Baskerville';
    src: url('../fonts/LibreBaskerville-Regular.eot');
    src: url('../fonts/LibreBaskerville-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/LibreBaskerville-Regular.woff2') format('woff2'), url('../fonts/LibreBaskerville-Regular.woff') format('woff'), url('../fonts/LibreBaskerville-Regular.ttf') format('truetype'), url('../fonts/LibreBaskerville-Regular.svg#LibreBaskerville-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Baskerville';
    src: url('../fonts/LibreBaskerville-Bold.eot');
    src: url('../fonts/LibreBaskerville-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/LibreBaskerville-Bold.woff2') format('woff2'), url('../fonts/LibreBaskerville-Bold.woff') format('woff'), url('../fonts/LibreBaskerville-Bold.ttf') format('truetype'), url('../fonts/LibreBaskerville-Bold.svg#LibreBaskerville-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Baskerville';
    src: url('../fonts/LibreBaskerville-Italic.eot');
    src: url('../fonts/LibreBaskerville-Italic.eot?#iefix') format('embedded-opentype'), url('../fonts/LibreBaskerville-Italic.woff2') format('woff2'), url('../fonts/LibreBaskerville-Italic.woff') format('woff'), url('../fonts/LibreBaskerville-Italic.ttf') format('truetype'), url('../fonts/LibreBaskerville-Italic.svg#LibreBaskerville-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}



/* START Tajawal NEW FONTS */

@font-face {
    font-family: 'Tajawal';
    src: url('../fonts/Tajawal-Black.eot');
    src: url('../fonts/Tajawal-Black.eot?#iefix') format('embedded-opentype'), url('../fonts/Tajawal-Black.woff2') format('woff2'), url('../fonts/Tajawal-Black.woff') format('woff'), url('../fonts/Tajawal-Black.ttf') format('truetype'), url('../fonts/Tajawal-Black.svg#Tajawal-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tajawal';
    src: url('../fonts/Tajawal-Bold.eot');
    src: url('../fonts/Tajawal-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Tajawal-Bold.woff2') format('woff2'), url('../fonts/Tajawal-Bold.woff') format('woff'), url('../fonts/Tajawal-Bold.ttf') format('truetype'), url('../fonts/Tajawal-Bold.svg#Tajawal-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tajawal';
    src: url('../fonts/Tajawal-ExtraBold.eot');
    src: url('../fonts/Tajawal-ExtraBold.eot?#iefix') format('embedded-opentype'), url('../fonts/Tajawal-ExtraBold.woff2') format('woff2'), url('../fonts/Tajawal-ExtraBold.woff') format('woff'), url('../fonts/Tajawal-ExtraBold.ttf') format('truetype'), url('../fonts/Tajawal-ExtraBold.svg#Tajawal-ExtraBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tajawal';
    src: url('../fonts/Tajawal-Medium.eot');
    src: url('../fonts/Tajawal-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/Tajawal-Medium.woff2') format('woff2'), url('../fonts/Tajawal-Medium.woff') format('woff'), url('../fonts/Tajawal-Medium.ttf') format('truetype'), url('../fonts/Tajawal-Medium.svg#Tajawal-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tajawal';
    src: url('../fonts/Tajawal-Light.eot');
    src: url('../fonts/Tajawal-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/Tajawal-Light.woff2') format('woff2'), url('../fonts/Tajawal-Light.woff') format('woff'), url('../fonts/Tajawal-Light.ttf') format('truetype'), url('../fonts/Tajawal-Light.svg#Tajawal-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tajawal';
    src: url('../fonts/Tajawal-Regular.eot');
    src: url('../fonts/Tajawal-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Tajawal-Regular.woff2') format('woff2'), url('../fonts/Tajawal-Regular.woff') format('woff'), url('../fonts/Tajawal-Regular.ttf') format('truetype'), url('../fonts/Tajawal-Regular.svg#Tajawal-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tajawal';
    src: url('../fonts/Tajawal-ExtraLight.eot');
    src: url('../fonts/Tajawal-ExtraLight.eot?#iefix') format('embedded-opentype'), url('../fonts/Tajawal-ExtraLight.woff2') format('woff2'), url('../fonts/Tajawal-ExtraLight.woff') format('woff'), url('../fonts/Tajawal-ExtraLight.ttf') format('truetype'), url('../fonts/Tajawal-ExtraLight.svg#Tajawal-ExtraLight') format('svg');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

/* END Tajawal NEW FONTS */



/*Default-CSS*/
input[type="file"]::-webkit-file-upload-button {
    cursor: pointer;
}

input[type="file"]::-moz-file-upload-button {
    cursor: pointer;
}

input[type="file"]::-ms-file-upload-button {
    cursor: pointer;
}

input[type="file"]::-o-file-upload-button {
    cursor: pointer;
}

input[type="file"] {
    cursor: pointer;
}

html body {
    font-family: "Tajawal";
    margin: 0;
    background: #ffffff;
}

.main-wrapper {
    position: relative;
    padding-top: 113px;
    min-height: calc(100vh - 113px);
}

    .main-wrapper.home {
        padding-top: 0px;
    }

*::-moz-selection {
    color: #fff;
    background: #b61932;
}

*::-webkit-selection {
    color: #fff;
    background: #b61932;
}

*::-webkit-input-placeholder {
    color: #333;
    opacity: 1;
}

*:-moz-placeholder {
    color: #333;
    opacity: 1;
}

*::-moz-placeholder {
    color: #333;
    opacity: 1;
}

*:-ms-input-placeholder {
    color: #333;
    opacity: 1;
}

a, div a:hover, div a:active, div a:focus, button {
    text-decoration: none;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

a, span, div a:hover, div a:active, button {
    text-decoration: none;
}

*::after, *::before, * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
    display: block;
}

ul, ul li, ol, li {
    /* list-style: outside none none; */
    color: #000;
}

body ul {
    margin: 0;
    padding: 0;
}

body a {
    outline: none;
    color: #b61932;
}

    body a:active, body a:focus, body a:hover {
        color: #000;
    }

body .clearfix, body .clear {
    clear: both;
    line-height: 100%;
}

body .clearfix {
    height: auto;
}

* {
    outline: none !important;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

.clr:after, ul:after, .clearfix:after, li:after {
    clear: both;
    display: block;
    content: "";
}

div input, div select, div textarea, div button {
    font-family: "Tajawal";
}

body h1, body h2, body h3, body h4, body h5, body h6 {
    font-family: "Tajawal";
    line-height: 140%;
    color: #000;
    font-weight: bold;
    margin: 0 0 15px;
}

body h1 {
    font-size: 24px;
}

body h2 {
    font-size: 30px;
    font-weight: 700;
}

body h3 {
    font-size: 18px;
}

body h4 {
    font-size: 16px;
}

body h5 {
    font-size: 12px;
}

body h6 {
    font-size: 10px;
}

    body h1:last-child, body h2:last-child, body h3:last-child, body h4:last-child, body h5:last-child, body h6:last-child {
        margin-bottom: 0;
    }

div select {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    div select option {
        font-size: 13px;
        color: #333;
        padding: 2px 5px;
    }

img {
    margin: 0 auto;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

body p {
    color: #000;
    font-family: "Tajawal";
    font-size: 20px;
    line-height: 150%;
    margin: 0 0 15px;
    padding: 0;
    font-weight: normal;
}

    body p:empty {
        margin: 0;
        line-height: 0;
    }

    body p:last-child {
        margin-bottom: 0;
    }

p strong {
    font-weight: bold;
}

.kd-left {
    text-align: left;
}

.kd-right {
    text-align: right;
}

.center-btn, .kd-center {
    text-align: center;
}

.mt-50 {
    margin-top: 50px;
}

label em {
    color: #ff0000;
    display: inline-block;
    font-style: normal;
    vertical-align: top;
    margin-left: 5px;
}

.hidden {
    display: none !important;
}

.gm-style img {
    max-height: inherit;
    max-width: none;
}

.container:after {
    content: "";
    display: block;
    clear: both;
}

.container {
    width: 100%;
    max-width: 100%;
    padding-left: 9.9%;
    padding-right: 9.9%;
    margin: 0 auto;
    position: relative;
    float: none;
}

body .container .container {
    padding-left: 0;
    padding-right: 0;
}
/*scroll Hide*/
html.no-scroll {
    overflow: hidden;
}

    html.no-scroll body {
        overflow: hidden;
        height: 100%;
    }
/*button*/
button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}
/* Buttons styles start */
.ltr {
    direction: ltr;
}

.btn, button {
    display: inline-block;
    border: none;
    padding: 15px 20px;
    margin: 0;
    text-decoration: none;
    border-radius: 0;
    color: #ffffff;
    font-size: 16px;
    line-height: 120%;
    font-weight: normal;
    cursor: pointer;
    text-align: center;
    background: #b61932;
}

    .btn:hover, .btn:focus, button:hover, button:focus {
        background: #000;
        color: #fff;
    }

.round-coner {
    border-radius: 5px;
}
/* Button styles end */
/*lozad*/
.lozad {
    -webkit-transition: all 1.2s ease;
    -moz-transition: all 1.2s ease;
    -o-transition: all 1.2s ease;
    transition: all 1.2s ease;
    filter: blur(10px);
    visibility: hidden;
    opacity: 0;
}

[data-loaded="true"] {
    filter: blur(0);
    transition: all 1.2s ease;
    visibility: visible;
    opacity: 1;
}

@keyframes fade {
    from {
        opacity: 0;
        visibility: hidden;
    }

    to {
        opacity: 1;
        visibility: visible;
    }
}
/*lozad*/
/*grid*/
.kd-row:after {
    content: "";
    display: block;
    clear: both;
}

.kd-row {
    margin-right: -15px;
    margin-left: -15px;
}

.kd-half-offset {
    margin-left: 4.166666667%;
}

.kd-md-offset-12 {
    margin-left: 100%;
}

.kd-md-offset-11 {
    margin-left: 91.66666667%;
}

.kd-md-offset-10 {
    margin-left: 83.33333333%;
}

.kd-md-offset-9 {
    margin-left: 75%;
}

.kd-md-offset-8 {
    margin-left: 66.66666667%;
}

.kd-md-offset-7 {
    margin-left: 58.33333333%;
}

.kd-md-offset-6 {
    margin-left: 50%;
}

.kd-md-offset-5 {
    margin-left: 41.66666667%;
}

.kd-md-offset-4 {
    margin-left: 33.33333333%;
}

.kd-md-offset-3 {
    margin-left: 25%;
}

.kd-md-offset-2 {
    margin-left: 16.66666667%;
}

.kd-md-offset-1 {
    margin-left: 8.33333333%;
}

.kd-md-offset-0 {
    margin-left: 0;
}

.kd-1, .kd-2, .kd-3, .kd-4, .kd-5, .kd-6, .kd-7, .kd-8, .kd-9, .kd-10, .kd-11, .kd-12 {
    float: right;
}

.kd-1, .kd-2, .kd-3, .kd-4, .kd-5, .kd-6, .kd-7, .kd-8, .kd-9, .kd-10, .kd-11, .kd-12 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.kd-1 {
    width: 8.33%;
}

.kd-2 {
    width: 16.66%;
}

.kd-3 {
    width: 25%;
}

.kd-4 {
    width: 33.33%;
}

.kd-5 {
    width: 41.66%;
}

.kd-6 {
    width: 50%;
}

.kd-7 {
    width: 58.33%;
}

.kd-8 {
    width: 66.66%;
}

.kd-9 {
    width: 75%;
}

.kd-10 {
    width: 83.33%;
}

.kd-11 {
    width: 91.66%;
}

.kd-12 {
    width: 100%;
}
/*grid*/
#wrapper {
    opacity: 1;
    visibility: visible;
    z-index: 1;
    -webkit-transition: 0.5s opacity;
    transition: 0.5s opacity;
}
/*Gapping*/
.section-gapping, section {
    padding-bottom: 40px;
    padding-top: 40px;
    overflow: visible;
}

    .section-gapping::after {
        clear: both;
        content: "";
        display: block;
    }
/*Gapping close*/
/*header*/
header#header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2000000;
    width: 100%;
    padding-right: 8.2%;
    padding-left: 1.5%;
    padding-top: 34px;
    padding-bottom: 15px;
}

.leaderboard-ad {
    position: relative;
    z-index: 0;
}

.header .container {
    max-width: 100%;
    padding: 0;
}

.top-bar::after {
    clear: both;
    content: "";
    display: block;
}

.header .logo {
    float: right;
    margin-top: 6px;
    position: relative;
    z-index: 2;
}

.header .search-profile {
    float: left;
    font-size: 0;
}

.logo a {
    max-width: 180px;
    width: 100%;
    display: block;
    transition: all 0.5s ease;
}

.search-profile > div {
    display: inline-block;
    vertical-align: top;
}

    .search-profile > div.profile {
        display: none;
    }

    .search-profile > div.search {
        padding-right: 0;
        margin-right: 0;
        height: 42px;
        margin-top: 0;
        padding-top: 0;
        position: relative;
        width: 250px;
    }

.search .form-field {
    width: 60px;
    float: none;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 0;
}

.search.search-popup .form-field {
    width: 100%;
    visibility: visible;
    opacity: 1;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.search .form-field input {
    height: 42px;
    border: none;
    border-radius: 5px;
    padding: 0 20px 0 40px;
    background: rgba(255,255,255,0.9);
    width: 100%;
    font-size: 16px;
}

.search-profile .profile > a {
    width: 153px;
    background: #666666;
    height: 47px;
    display: block;
    color: #fff;
    font-size: 25px;
    font-weight: 400;
    text-align: left;
    padding: 9px 65px 5px 22px;
    position: relative;
}

.search > a {
    display: block;
    width: 28px;
    position: absolute;
    top: 2px;
    bottom: 0;
    margin: auto;
    height: 30px;
    left: 7px;
    z-index: 1;
}

.search.search-popup > a > img {
    filter: sepia(1) saturate(5) brightness(0.5) hue-rotate(135deg);
}

.search-profile .profile > a > span {
    position: absolute;
    right: 0;
    top: 0;
    width: 52px;
    text-align: center;
    height: 100%;
    padding: 11px 11px 11px 16px;
}

    .search-profile .profile > a > span::before {
        content: "";
        position: absolute;
        left: 0;
        top: 12px;
        bottom: 10px;
        width: 2px;
        background: #ffffff;
    }

.menu-click {
    position: absolute;
    width: 40px;
    height: 40px;
    margin: 0;
    display: inline-block;
    right: 33px;
    top: 36px;
    z-index: 1;
}

.menu-line, .menu-line::after, .menu-line::before {
    position: absolute;
    width: 40px;
    height: 4px;
    transition-timing-function: ease;
    transition-duration: 0.15s;
    transition-property: transform;
    border-radius: 4px;
    background-color: #000;
}

.menu-click:hover .menu-line, .menu-click:hover .menu-line:after, .menu-click:hover .menu-line:before {
    background-color: #b61932;
}

.menu-line {
    top: 50%;
    display: block;
    margin-top: -2px;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition-duration: 75ms;
}

    .menu-line::after, .menu-line::before {
        display: block;
        content: "";
    }

    .menu-line::before {
        top: -10px;
    }

    .menu-line::after {
        bottom: -10px;
    }

    .menu-line::after {
        transition: bottom 75ms ease 0.12s, transform 75ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    .menu-line::before {
        transition: top 75ms ease 0.12s, opacity 75ms ease;
    }

.show-menu .menu-line::before {
    top: 0;
    transition: top 75ms ease, opacity 75ms ease 0.12s;
    opacity: 0;
}

.show-menu .menu-line::after {
    bottom: 0;
    transition: bottom 75ms ease, transform 75ms cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s;
    transform: rotate(-90deg);
}

.show-menu .menu-line {
    transition-delay: 0.12s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: rotate(45deg);
}

header .slide-menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 108px;
    background: #f0f0f0;
    height: 100vh;
    padding: 0;
    z-index: 99;
    overflow: visible;
    transition: all 0.5s ease;
}

    header .slide-menu.show-menu {
        width: 430px;
        transition: all 0.5s ease;
    }

.menu-row {
    position: relative;
    height: 100%;
    width: 107px;
    float: left;
    text-align: center;
    border-right: 1px solid transparent;
    padding: 115px 0 27px 0;
}

.show-menu .menu-row {
    border-color: #8f8f91;
}

.slide-menu .menu-widget {
    position: absolute;
    bottom: 30px;
    left: 26px;
    margin: auto;
    width: 60px;
}

    .slide-menu .menu-widget > a {
        display: block;
        width: 54px;
        height: 54px;
        border-radius: 50px;
        background: #000;
        text-align: center;
        overflow: visible;
        margin-bottom: 15px;
        padding: 9px 7px 7px 7px;
        position: relative;
    }

        .slide-menu .menu-widget > a::after {
            color: #fff;
            content: attr(data-tooltip);
            position: absolute;
            right: 80%;
            margin: auto 10px auto 0px;
            top: 0;
            background-color: #000;
            display: block;
            padding: 0 25px;
            text-align: center;
            font-weight: 300;
            white-space: nowrap;
            border-radius: 1px;
            opacity: 0;
            font-size: 18px;
            -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 4px 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 4px 0 rgba(0, 0, 0, 0.2);
            line-height: 36px;
            visibility: hidden;
            -webkit-transition: all 0.5s ease;
            transition: all 0.5s ease;
            bottom: 0;
            height: 35px;
        }

        .slide-menu .menu-widget > a::before {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 18px 0 18px 18px;
            border-color: transparent transparent transparent #000;
            top: 0;
            bottom: 0;
            margin: auto;
            right: 100%;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: all 0.1s ease;
            transition: all 0.1s ease;
        }

        .slide-menu .menu-widget > a:hover::after {
            visibility: visible;
            opacity: 1;
            right: 100%;
            -webkit-transition: all 0.25s ease;
            transition: all 0.25s ease;
        }

        .slide-menu .menu-widget > a:hover::before {
            visibility: visible;
            opacity: 1;
            -webkit-transition: all 0.1s ease;
            transition: all 0.1s ease;
            -webkit-transition-delay: 0.1s;
            transition-delay: 0.1s;
        }

        .slide-menu .menu-widget > a.icon-3 {
            padding-top: 6px;
        }

        .slide-menu .menu-widget > a:last-child {
            margin-bottom: 0;
        }

        .slide-menu .menu-widget > a:hover {
            background: #000;
        }

.menu-social {
    text-align: center;
    width: 100%;
    opacity: 1;
    visibility: visible;
    transition: all 0.2s ease;
}

    .menu-social ul {
        list-style: none;
    }

    .menu-social li {
        margin-bottom: 12px;
    }

        .menu-social li > a {
            font-size: 32px;
            color: #000000;
            display: inline-block;
            vertical-align: top;
        }

            .menu-social li > a:hover {
                color: #b61932;
            }

        .menu-social li:last-child {
            margin-bottom: 0px;
        }

.show-menu .menu-social {
    opacity: 1;
    visibility: visible;
    transition: all 0.2s ease;
}

.slide-menu .main-menu {
    position: relative;
    float: right;
    width: calc(100% - 107px);
    margin-top: 130px;
    padding-right: 80px;
    padding-left: 40px;
    padding-bottom: 40px;
    overflow: auto;
    height: calc(100vh - 130px);
    scrollbar-color: #b61932 #d9d9d9;
    scrollbar-width: thin;
}

    .slide-menu .main-menu::-webkit-scrollbar {
        width: 5px;
    }

    .slide-menu .main-menu::-webkit-scrollbar-track {
        background-color: #d9d9d9;
    }

    .slide-menu .main-menu::-webkit-scrollbar-thumb {
        background-color: #b61932;
        outline: none;
    }

.main-menu a.menu-logo {
    max-width: 220px;
    display: block;
    width: 100%;
    margin-bottom: 20%;
}

ul.menu {
    margin-bottom: 40px;
    list-style: none;
}

    ul.menu li {
        margin-bottom: 5.5%;
        position: relative;
        display: block;
        width: 100%;
    }

        ul.menu li:last-child {
            margin-bottom: 0;
        }

        ul.menu li > a {
            font-size: 20px;
            color: #000000;
            font-weight: 400;
            line-height: 100%;
            display: inline-block;
            vertical-align: top;
        }

            ul.style-menu > li > a.red, ul.menu li > a.red {
                color: #b61932;
            }

                ul.style-menu > li > a.red:hover, ul.menu li > a.red:hover {
                    color: #000;
                }

        ul.menu li.submenu {
            padding-left: 25px;
        }

            ul.menu li.submenu .sub-click {
                width: 20px;
                background: url("../images/menu-arrow.png") no-repeat 4px 7px;
                height: 20px;
                cursor: pointer;
                display: inline-block;
                vertical-align: top;
                -moz-transition: all 0.5s ease;
                -webkit-transition: all 0.5s ease;
                transition: all 0.5s ease;
            }

            ul.menu li.submenu.show-sub-memu span.sub-click, ul.menu li.submenu:hover span.sub-click {
                background-position: -27px 7px;
            }

        ul.menu li ul.sub {
            margin-top: 5.5%;
            display: none;
            list-style: none;
        }

            ul.menu li ul.sub a {
                color: #666666;
                font-size: 16px;
            }

                ul.menu .submenu:hover > a, ul.menu .submenu.show-sub-memu > a, ul.menu li ul.sub li.active a, ul.menu li.active > a, ul.menu li ul.sub a:hover, ul.menu li a:hover {
                    color: #b61932;
                }

.show-sub-memu .sub-click {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -moz-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.header-menu ul.style-menu {
    padding: 0;
    position: absolute;
    left: 17.5%;
    right: 9.9%;
    margin: auto;
    top: 27px;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
}

.header-menu .slide-up-menu {
    bottom: auto;
    top: 105%;
    padding-left: 50px;
    padding-right: 50px;
    max-width: 100%;
    margin: auto;
}

.header-menu .toggle-menu .slide-up-menu {
    overflow: hidden;
    padding-top: 50px;
    padding-bottom: 50px;
}

header ul.style-menu > li {
    margin: 0 1.8%;
}

.inner-page #header, .fixed #header {
    padding-top: 15px;
    padding-bottom: 15px;
    transition: all 0.5s ease;
}

#header.show-topmenu, .inner-page #header {
    background: #f0f0f0;
}

.inner-page .logo > a, .fixed .logo > a {
    max-width: 165px;
    transition: all 0.5s ease;
}

.inner-page .logo, .fixed .header .logo {
    margin-top: 0px;
}

.inner-page .search-profile, .fixed .search-profile {
    margin-top: 23px;
    transition: all 0.5s ease;
}

.home header .header-menu ul.style-menu {
    opacity: 0;
    visibility: hidden;
}

.home header.show-topmenu .header-menu ul.style-menu, .inner-page .header-menu ul.style-menu, .fixed .header-menu ul.style-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

header ul.style-menu > li > a {
    padding: 0;
}
/*header end*/
/*main slider*/
section.main-slider {
    padding-top: 0;
    overflow: hidden;
    position: relative;
    padding-bottom: 0;
    min-height: calc(100vh - 8vh);
}

.main-slider .hero-flexslider {
    border: none;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    /*direction: ltr;
    */;
}

.main-slider .flexslider .slides > li {
    position: relative;
    overflow: hidden;
}

.main-slider .hero-flexslider .owl-nav > div.owl-next, .main-slider .hero-flexslider .owl-nav > div.owl-prev, .flexslider:hover .flex-direction-nav a.flex-next, .main-slider .flex-direction-nav .flex-nav-next a, .flexslider:hover .flex-direction-nav a.flex-prev, .main-slider .flex-direction-nav .flex-nav-prev a {
    left: auto;
    right: 8.1%;
    background: transparent;
    text-align: center;
    line-height: 37px;
    border-radius: 5px;
    border: none;
    opacity: 0.8;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: 0;
    font-size: 0;
    text-indent: 0;
}

.main-slider .hero-flexslider .owl-nav > div.owl-next, .flexslider:hover .flex-direction-nav a.flex-next, .main-slider .flex-direction-nav .flex-nav-next a {
    left: 1.5%;
    right: auto;
}

    .main-slider .hero-flexslider .owl-nav > div.owl-prev:before, .main-slider .hero-flexslider .owl-nav > div.owl-next:before, .main-slider .flex-direction-nav .flex-nav-next a::before, .main-slider .flex-direction-nav .flex-nav-prev a::before {
        content: "\f105";
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
        font-size: 48px;
        color: #fff;
        text-shadow: none;
    }

    .main-slider .hero-flexslider .owl-nav > div.owl-next:before, .main-slider .flex-direction-nav .flex-nav-next a::before {
        content: "\f104";
    }

    .main-slider .hero-flexslider .owl-nav > div.owl-next:hover, .main-slider .hero-flexslider .owl-nav > div.owl-prev:hover, .main-slider .flex-direction-nav .flex-nav-prev a:hover, .main-slider .flex-direction-nav .flex-nav-next a:hover {
        opacity: 1;
    }

        .main-slider .hero-flexslider .owl-nav > div.owl-next:hover:before, .main-slider .hero-flexslider .owl-nav > div.owl-prev:hover:before, .main-slider .flex-direction-nav .flex-nav-next a:hover:before, .main-slider .flex-direction-nav .flex-nav-prev a:hover:before {
            color: #b61932;
        }

.main-slider .hero-flexslider .owl-nav div > i {
    display: none;
}
/*for firefox only hack*/
/*@-moz-document url-prefix() {
     .main-slider .hero-flexslider {
         direction: ltr;
    }
}
*/
.hero-flexslider .flex-control-nav {
    display: none;
}

.slider-img {
    padding-top: 0;
    position: relative;
    height: calc(100vh - 8vh);
}

.hero-flexslider .flex-viewport {
    max-height: 100%;
}

.hero-flexslider .slider-img {
    position: relative;
}

.hero-flexslider .slides .slider-img img {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: 0 0;
}

.slider-content {
    position: absolute;
    z-index: 99;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    max-width: 100%;
    width: auto;
    padding: 15px 5.6% 0 0;
    direction: rtl;
    bottom: 0;
    padding-bottom: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

    .slider-content .date {
        display: inline-block;
        vertical-align: middle;
        direction: ltr;
    }

    .slider-content > p > strong {
        font-weight: 600;
        font-size: 20px;
        color: #b61932;
        display: inline-block;
        vertical-align: middle;
        position: relative;
        padding-left: 45px;
    }

        .slider-content > p > strong:before {
            content: "";
            position: absolute;
            left: 0;
            width: 37px;
            top: 0;
            bottom: 0;
            margin: auto;
            height: 1px;
            background-color: #000;
        }

    .slider-content h2 {
        font-size: 48px;
        font-weight: 400;
        margin-top: 0;
        position: relative;
        z-index: 1;
        background: rgba(255,255,255,0.7);
        display: inline-block;
        vertical-align: top;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        padding: 15px 20px 10px 20px;
        max-width: 100%;
    }

    .slider-content > p {
        display: none;
    }

.bottom-section {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2.8%;
    z-index: 1;
}

    .bottom-section ul {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        list-style: none;
    }

        .bottom-section ul li {
            width: 25%;
        }

            .bottom-section ul li > .box {
                display: flex;
            }

    .bottom-section .box .img-box {
        position: relative;
        width: 57%;
        padding-top: 31%;
        float: left;
        margin: 0;
        overflow: hidden;
    }

        .bottom-section .box .img-box img {
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 100%;
            object-fit: cover;
            object-position: 0 center;
        }

        .bottom-section .box .img-box:hover img {
            -webkit-transform: scale(1.08);
            transform: scale(1.08);
        }

    .bottom-section .box-content {
        width: 43%;
        padding: 0px 13px 30px 13px;
        position: relative;
    }

    .bottom-section .box .title-link, .bottom-section .box h3 {
        font-size: 20px;
        line-height: 140%;
        color: #000;
        font-weight: 300;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-height: 100px;
        margin-top: 0;
        white-space: normal;
        text-decoration: none !important;
    }

        .bottom-section .box .title-link:hover h3, .bottom-section .box .title-link:hover {
            color: #b61932;
        }

    .bottom-section .box-content > span, .bottom-section .box a.link {
        margin-top: 10%;
        display: block;
        font-weight: 500;
        font-size: 20px;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 100%;
        white-space: nowrap;
        text-decoration: underline;
        position: absolute;
        bottom: 0;
        left: 0;
        padding: 0px 13px;
    }
/*main slider end*/
/*second menu*/
section.sec-menu {
    padding: 0;
    background: #f0f0f0;
    overflow: visible;
    position: relative;
}

.sec-menu .container {
    position: static;
}

ul.style-menu {
    font-size: 0;
    padding: 0px;
    text-align: center;
}

    ul.style-menu > li {
        display: inline-block;
        vertical-align: top;
        margin: 0 2.1%;
    }

        ul.style-menu > li.active > a {
            color: #b61932;
        }

        ul.style-menu > li > a {
            font-size: 24px;
            color: #000;
            display: block;
            line-height: 140%;
            font-weight: 400;
            padding: 30px 0;
        }

            ul.style-menu > li > a.mobile-menu-click {
                display: none;
            }

            ul.style-menu > li.toggle-menu > a, ul.style-menu > li > a:hover {
                color: #b61932;
            }

.slide-up-menu {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    background: #f0f0f0;
    z-index: 9;
    padding-left: 9.9%;
    padding-right: 9.9%;
    padding-top: 0;
    padding-bottom: 0;
    transition: all 0.5s ease;
    max-height: 0;
    overflow: hidden;
}

    .slide-up-menu:after {
        content: "";
        clear: both;
        display: block;
    }

    .slide-up-menu .left-menu {
        float: left;
        width: 80%;
    }

    .slide-up-menu .right-menu {
        width: 20%;
        float: right;
    }

    .slide-up-menu li.active > a, .slide-up-menu li.active > a p {
        color: #b61932;
    }

.image-menu {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: row;
}

    .image-menu li {
        width: 28.0439%;
        margin-right: 4%;
    }

        .image-menu li:first-child {
            margin-right: 0;
        }

        .image-menu li a {
            display: block;
        }

    .image-menu .img-wrap {
        margin-bottom: 10px;
    }

    .image-menu li p {
        text-align: right;
        font-size: 20px;
        line-height: 140%;
    }

    .image-menu li a:hover p {
        color: #b61932;
        font-weight: normal;
    }

    .img-popup .img-wrap > a:hover img, .image-menu li a:hover .img-wrap > img {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

.img-wrap > a:hover > img {
    transform: scale(1.05);
}

.right-menu ul {
    text-align: right;
    list-style: none;
}

    .right-menu ul > li {
        margin-bottom: 12px;
    }

        .right-menu ul > li:last-child {
            margin-bottom: 0px;
        }

    .right-menu ul li a {
        font-size: 20px;
        text-align: right;
        display: inline-block;
        color: #969696;
        font-weight: normal;
    }

        .right-menu ul li a:hover {
            color: #000;
        }

ul.style-menu > li:hover > .slide-up-menu, .toggle-menu .slide-up-menu {
    max-height: 1000px;
    overflow: hidden;
    transition: all 0.5s ease;
    padding-top: 50px;
    padding-bottom: 50px;
    scrollbar-width: none;
}

.slide-menu .main-menu::-webkit-scrollbar {
    display: none;
}
/*second menu end*/
section.add-section {
    padding: 38px 0;
}

.add-img {
    max-width: 733px;
    width: 100%;
    display: block;
    margin: 0 auto;
    line-height: 0;
}

    .add-img img {
        width: 100%;
    }

.add-section .bg-gray {
    padding: 53px 0;
    margin-top: 55px;
}

section.featured-news {
    padding-top: 0;
    margin-top: -20px;
}

.title {
    position: relative;
    margin-bottom: 15px;
}

    .video.article-video .title h1, .title h1, .title h2 {
        font-size: 60px;
        font-weight: 300;
        line-height: 140%;
        display: inline-block;
        background-color: #fff;
        position: relative;
        z-index: 1;
        padding-left: 15px;
    }

    .title:before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        height: 1px;
        margin: auto;
        background: #b2b2b2;
    }

.bg-gray .title h2 {
    background-color: #e0e0e0;
}

.bg-light-gray .title h2 {
    background-color: #f0f0f0;
}

.news-section::after {
    clear: both;
    display: block;
    content: "";
}

.sidebar-section:after {
    content: "";
    display: block;
    clear: both;
}

.sidebar-section {
    display: flex;
    flex-direction: row;
    position: relative;
}

.right-section {
    width: 70%;
    padding-left: 3.2%;
}

.left-sidebar {
    width: 30%;
    padding-right: 2.9%;
    border-right: 1px solid #707070;
}

    .left-sidebar > div {
        margin-bottom: 30px;
    }

        .left-sidebar > div + div.magazine {
            margin-top: 60px;
        }

        .left-sidebar > div:last-child {
            margin-bottom: 0;
        }

.img-wrap {
    position: relative;
    padding-top: 56.25%;
    margin-bottom: 15px;
    display: block;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    overflow: hidden;
}

    .img-wrap iframe {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 100%;
        width: 100%;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

body .video iframe, body .media iframe {
    max-width: 100%;
}

.img-wrap img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

a .img-wrap:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.box-content p.post-date {
    font-size: 18px;
}

.post-date .date {
    display: inline-block;
    vertical-align: middle;
    direction: ltr;
    color: #8f8f91;
    font-weight: 400;
}

.post-date > strong {
    font-weight: 500;
    font-size: 20px;
    color: #b61932;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding-left: 45px;
}

    .post-date > strong:before {
        content: "";
        position: absolute;
        left: 0;
        width: 37px;
        top: 0;
        bottom: 0;
        margin: auto;
        height: 1px;
        background-color: #000;
    }

.box-content {
    max-width: 700px;
    margin: 0 auto;
}

    .box-content h3 {
        font-size: 45px;
        font-weight: 400;
        line-height: 140%;
        margin-top: 18px;
    }

    .box-content p {
        font-size: 30px;
        font-weight: 300;
        line-height: 140%;
    }

    .box-content > a {
        font-size: 30px;
        text-decoration: none !important;
        font-weight: 400;
    }

.news-listing .kd-6:nth-child(2n) {
    margin-bottom: 40px;
}

.news-listing .kd-6:nth-child(2n + 1) {
    clear: both;
}

.news-listing .kd-6:last-child {
    margin-bottom: 0px;
}

.news-listing a {
    display: block;
}

.news-listing .img-wrap {
    margin-bottom: 15px;
}

.news-listing .box-content p.post-date {
    font-size: 18px;
    line-height: 110%;
    margin-bottom: 10px;
}

.classics-img-box h4, .magazine h4, .news-listing h4 {
    font-size: 35px;
    font-weight: 400;
    line-height: 150%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 110px;
}

div.magazine h4 {
    font-size: 22px;
}

    div.magazine h4 a {
        display: inline-block;
        vertical-align: top;
    }

section.add-section + section.famous-ppl {
    padding-top: 10px;
}

.featured-news .left-sidebar {
    padding-top: 0;
}

.magazine .img-wrap {
    padding-top: 106.4%;
    overflow: visible;
}

    .magazine .img-wrap img.rotate-img {
        opacity: 1;
        -webkit-transform: rotate(6deg);
        -moz-transform: rotate(6deg);
        transform: rotate(6deg);
        right: -5px;
        top: -8px;
        height: 100%;
        bottom: 30px;
        width: 100%;
        left: -13px;
    }

.magazine .box-content {
    max-width: 360px;
}

.magazine h4 {
    margin-bottom: 15px;
}

.popl-news-box::after {
    content: "";
    display: block;
    clear: both;
}

.popl-news-box {
    display: flex;
    position: relative;
}

ul.popl-news-list {
    list-style: none;
}

.popl-news-list > li {
    margin-bottom: 25px;
}

    .popl-news-list > li:last-child {
        margin-bottom: 0px;
    }

.popl-news-box > .img-wrap {
    float: right;
    width: 48.9%;
    padding-top: 27.3%;
    margin-bottom: 0;
}

.popl-news-box > .box-content {
    padding: 0px 15px 45px 5px;
    float: left;
    width: 51.1%;
    max-width: 100%;
    position: relative;
}

    .popl-news-box > .box-content h4 {
        font-size: 20px;
        font-weight: normal;
        line-height: 140%;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-height: 60px;
        min-height: 60px;
        margin-bottom: 10px;
    }

    .popl-news-box > .box-content .post-date {
        font-size: 16px;
        position: absolute;
        bottom: 0;
        right: 15px;
        margin-bottom: 0;
    }

        .popl-news-box > .box-content .post-date > strong {
            padding-left: 20px;
        }

            .popl-news-box > .box-content .post-date > strong::before {
                width: 16px;
            }

section.video {
    padding-bottom: 30px;
}

.bg-gray {
    background-color: #e0e0e0;
}

.bg-light-gray {
    background-color: #f0f0f0;
}

.video .flexslider {
    direction: ltr;
    background: transparent;
    margin: 0;
    border: none;
}
/*for firefox only hack*/
@-moz-document url-prefix() {
    .video .flexslider {
        direction: ltr;
    }
}

.video .title {
    margin-bottom: 12px;
}

    .video .title:before {
        display: none;
    }

    .video .title h2 {
        background: transparent;
        color: #b61932;
    }

#video-slider .flex-viewport {
    margin: 0 auto 40px auto;
}

#video-slider .video-box {
    position: relative;
    margin-bottom: 40px;
}

#video-slider .video-box {
    max-width: 87%;
    margin: 0 auto 40px auto;
}

    #video-slider .video-box .share-bookmark {
        position: absolute;
        top: 20px;
        left: 20px;
        z-index: 3;
    }

        #video-slider .video-box .share-bookmark a {
            font-size: 36px;
        }

            #video-slider .video-box .share-bookmark a:active, #video-slider .video-box .share-bookmark a:focus, #video-slider .video-box .share-bookmark a:hover {
                color: #fff;
            }

    #video-slider .video-box .img-wrap {
        margin: 0 auto;
        padding-top: 56.35%;
    }

        #video-slider .video-box .img-wrap:before {
            content: "";
            position: absolute;
            left: 0;
            bottom: 0;
            height: 40%;
            width: 100%;
            z-index: 1;
            background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.53) 50%, rgba(255, 255, 255, 1) 100%);
            background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.53) 50%, rgba(255, 255, 255, 1) 100%);
            background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.53) 50%, rgba(255, 255, 255, 1) 100%);
        }

#video-slider .vide-caption {
    direction: rtl;
    text-align: center;
    position: absolute;
    bottom: 5%;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 5;
    max-width: 87%;
    margin: auto;
}

    #video-slider .vide-caption h4 {
        color: #000;
        font-size: 60px;
        font-weight: 400;
        line-height: 140%;
    }

#video-slider .post-date .date {
    color: #000;
}

.play-icon, #video-slider .play-icon {
    position: absolute;
    display: block;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 111px;
    width: 111px;
    margin: auto;
    background: rgba(255, 255, 255, 0.74);
    border-radius: 50%;
    padding: 31px 25px 28px 37px;
    z-index: 2;
}

    .play-icon img, #video-slider .play-icon img {
        width: auto;
        display: block;
        height: auto;
        position: static;
    }

.flexslider .video-box {
    position: relative;
}

#video-thum .vide-caption {
    direction: rtl;
    text-align: right;
}

#video-thum .img-wrap {
    margin-bottom: 5px;
    cursor: pointer;
    border: 2px solid transparent;
}

#video-thum .current .img-wrap {
    border-color: #b61932;
}

#video-thum .vide-caption h4 {
    font-size: 25px;
    font-weight: 400;
    letter-spacing: 0;
    padding-left: 10px;
    line-height: 140%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 100px;
}

#video-thum .play-icon {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 34px;
    height: 34px;
    background: #e0e0e0;
    padding: 8px;
    left: auto;
    border-radius: 0;
    transform: none;
}

    #video-thum .play-icon img {
        width: auto;
    }

    .play-icon:hover, #video-thum .play-icon:hover, #video-slider .play-icon:hover {
        background: #fff;
    }

.article-slider .flex-direction-nav .flex-nav-prev, .article-slider .flex-direction-nav .flex-nav-next, #video-thum .flex-nav-prev, #video-thum .flex-nav-next {
    position: absolute;
    top: 28.2%;
    height: 30px;
    width: 25px;
    left: -50px;
}

.owl-carousel div.owl-nav > div {
    position: absolute;
    top: 34%;
    -webkit-transform: translateY(-50%) scaleX(-1);
    transform: translateY(-50%) scaleX(-1);
    right: -2.5%;
    left: auto;
    height: 30px;
    width: 25px;
    background: url("../images/carasole-icon.png") no-repeat 0 0;
    opacity: 1;
    font-size: 0;
    text-indent: -9999px;
    display: block;
    z-index: 2;
    cursor: pointer;
}

    .owl-carousel div.owl-nav > div.owl-next {
        right: auto;
        left: -2.5%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .owl-carousel div.owl-nav > div.disabled {
        opacity: 1;
    }

.slides.owl-carousel {
    list-style: none;
}

.sync-slide {
    position: relative;
}

    .sync-slide #article-slider, .sync-slide #video-slider {
        position: static;
    }

    .sync-slide #article-slider {
        background: #fff;
        list-style: none;
    }

    .sync-slide .owl-carousel div.owl-nav > div {
        top: 81.4%;
        -webkit-transform: translateY(-81.4%) scaleX(-1);
        transform: translateY(-81.4%) scaleX(-1);
    }

        .sync-slide .owl-carousel div.owl-nav > div.owl-next {
            -webkit-transform: translateY(-81.4%);
            transform: translateY(-81.4%);
        }

.link {
    display: inline-block;
    vertical-align: top;
    font-size: 30px;
    text-decoration: underline !important;
    font-weight: 400;
    margin-top: 10px;
}

section.classics {
    padding-top: 34px;
    padding-bottom: 44px;
}

.kd-row.three-row {
    margin-left: -27px;
    margin-right: -27px;
}

    .kd-row.three-row .kd-4 {
        padding: 0 27px;
        margin-bottom: 25px;
    }

        .kd-row.three-row .kd-4:nth-child(3n + 1) {
            clear: both;
        }

        .kd-row.three-row .kd-4:nth-child(3n) {
            margin-bottom: 25px;
        }

        .kd-row.three-row .kd-4:last-child {
            margin-bottom: 0px;
        }

.classics-img-box .post-date, .classics-img-box .img-wrap {
    margin-bottom: 15px;
}

    .classics-img-box .post-date > strong {
        padding: 0;
    }

        .classics-img-box .post-date > strong::before {
            display: none;
        }

.classics-img-box .box-content p.post-date {
    margin-bottom: 5px;
}

.photo-section .title {
    margin-bottom: 23px;
}

.img-popup .img-wrap > span, .img-wrap .img-popup {
    position: absolute;
    top: 0;
    right: 0;
    width: 84px;
    height: 84px;
    display: block;
}

.img-popup .img-wrap > a {
    display: block;
    height: 100%;
    width: 100%;
}

.img-popup .img-wrap > span, .search-result .video-box .img-popup, .kd-4 .img-wrap .img-popup, .kd-6 .img-wrap .img-popup {
    width: 55px;
    height: 55px;
}

.left-sidebar .program {
    padding: 20px 20px 60px 20px;
}

.program .title {
    margin-left: -20px;
    margin-bottom: 17px;
}

.program .img-wrap {
    margin-bottom: 13px;
}

.program .post-date strong {
    color: #000;
    font-weight: normal;
}

.program .link {
    font-size: 20px;
    margin-top: 14px;
}

.podcasts ul > li {
    margin-bottom: 25px;
    line-height: 0;
}

.podcasts .link {
    font-size: 20px;
    margin-top: 2px;
}

.podcasts + .lef-adv {
    margin-top: 58px;
}

.left-sidebar > div.ad-div:last-child, .left-sidebar > div.advertisement:last-child, .lef-adv:last-child {
    position: sticky;
    top: 130px;
    z-index: 3;
}

.lef-adv .add-img {
    max-width: 300px;
    margin: 0 auto;
}

.ad-inner {
    text-align: center;
}

    .ad-inner iframe, .advertisement iframe {
        display: inline-block;
        margin: 0 auto;
    }

.left-sidebar .ad-inner iframe {
    max-width: 300px;
    width: 100%;
    min-width: 1px;
}

section.insta-section {
    padding-top: 6px;
}

.insta-section .inta-icon {
    background: #fff;
    font-size: 43px;
    position: absolute;
    left: 0px;
    top: 19px;
    display: block;
    text-align: left;
    padding-right: 10px;
}

.insta-post .img-wrap {
    width: 25%;
    float: right;
    padding-top: 25%;
}

section.app-section {
    position: relative;
    overflow: visible;
    z-index: 1;
    padding-top: 50px;
    margin-top: 9%;
    padding-bottom: 25px;
}

    section.app-section::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 28.9%;
        background-image: url("../images/app-bg.png");
        background-blend-mode: multiply;
        background-repeat: no-repeat;
        background-position: 0 0;
        background-color: #f0f0f0;
        background-size: 100% auto;
        height: 100%;
        display: none;
    }

.mobile-img {
    float: left;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row-reverse;
    margin-left: 0;
    margin-top: -9.6%;
    width: 50%;
    flex-wrap: wrap;
    padding-left: 38px;
}

.mobile {
    position: relative;
    padding-top: 66.2%;
    width: 45%;
}

    .mobile::before {
        content: "";
        position: absolute;
        background: rgba(255, 255, 255, 0.5);
        top: 20%;
        left: 20%;
        right: 20%;
        bottom: 9%;
        z-index: 0;
        background-blend-mode: hard-light;
        border-radius: 10px;
        display: none;
    }

    .mobile::after {
        content: "";
        position: absolute;
        top: 3.3%;
        left: 18%;
        background: #f7f7f7;
        padding-top: 33.9%;
        z-index: 0;
        right: 18%;
        border-radius: 10px;
        display: none;
    }

    .mobile > img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: contain;
        z-index: 1;
        object-position: 0 0;
    }

.m-content {
    max-width: 145px;
    width: 100%;
    margin-left: -14px;
    margin-top: 30px;
}

    .m-content h6 {
        font-size: 30px;
        text-align: center;
        line-height: 140%;
        font-weight: 400;
    }

.app-icon a {
    font-size: 44px;
    margin: 0 20px 0 0;
    text-shadow: 0 0px 10px rgba(0, 0, 0, 0.3);
}

    .app-icon a .fab.fa-apple {
        font-size: 50px;
    }

    .app-icon a:first-child {
        margin-right: 0;
    }

.subscribe {
    float: right;
    max-width: 462px;
    background: #f6f6f6;
    width: 100%;
    border: 10px solid #fff;
    padding: 20px 42px;
}

    .subscribe h6 {
        font-size: 30px;
        font-weight: 300;
        line-height: 140%;
        padding: 0 15px;
        margin-bottom: 15px;
    }

    .subscribe form {
        margin-top: -12px;
        position: relative;
        margin-bottom: 25px;
    }

    .subscribe input[type="text"] {
        width: 100%;
        border: none;
        background: transparent;
        padding: 0 0 13px 50px;
        border-bottom: 2px solid #b61932;
        font-size: 20px;
        font-weight: 300;
    }

    .subscribe .submit {
        position: absolute;
        top: -7px;
        left: 0;
        width: 38px;
        height: 38px;
    }

        .subscribe .submit:hover img {
            opacity: 0.65;
        }

        .subscribe .submit input {
            position: absolute;
            left: 0;
            right: 0;
            background: transparent;
            border: none;
            height: 100%;
            width: 100%;
            text-indent: -999px;
            z-index: 1;
            cursor: pointer;
        }

    .subscribe > p {
        text-align: right;
        color: #b61932;
        font-weight: 300;
        line-height: 140%;
    }
/*footer*/
footer#footer {
    background: #f0f0f0;
    padding-top: 25px;
    padding-bottom: 25px;
    border-top: 1px solid #cfcfcf;
}

footer .container {
    padding-right: 7.4%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    padding-left: 2%;
}

    footer .container > div.f-logo {
        float: right;
        width: 7%;
        margin-left: 1.1%;
    }

    footer .container > div.copyright {
        width: 27%;
        margin-left: 4.3%;
    }

    footer .container > div.footer-menu {
        width: 37%;
        margin-left: 13.5%;
    }

    footer .container > div.f-app-icon {
        width: 10%;
        display: none;
    }

footer a, footer p {
    font-size: 16px;
    font-weight: 400;
    color: #000;
}

    footer a:hover, .footer-menu li.active a {
        color: #b61932;
    }

.footer-menu li {
    display: inline-block;
    vertical-align: middle;
    margin-left: 8.6%;
}

    .footer-menu li:last-child {
        margin-left: 0;
    }

.f-app-icon > * {
    display: inline-block;
    vertical-align: middle;
    line-height: 140%;
}

.f-app-icon p {
    color: #b61932;
    margin: 5px 0 0 15px;
    font-size: 18px;
}

.f-app > a {
    display: inline-block;
    vertical-align: middle;
    font-size: 22px;
    margin-left: 14px;
    color: #b61932;
}

    .f-app > a:hover {
        color: #000;
    }

    .f-app > a .fa-apple {
        font-size: 28px;
        margin-top: -3px;
        display: block;
    }

    .f-app > a:last-child {
        margin-left: 0;
    }
/*footer end*/
/*article*/
section.video.article-video {
    padding-bottom: 50px;
}

.article-video .bg-gray {
    padding: 20px 0 0px 0;
    margin-top: 20px;
    background: #fff;
}

    .article-video .bg-gray .hastag {
        background: #fff;
        z-index: 9;
    }

.title.kd-center::before {
    display: none;
}

.video.article-video .title h1, .video.article-video .title h2 {
    color: #000;
    padding: 0;
    font-weight: bold;
}

.hastag {
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    font-size: 45px;
    color: #b61932;
    padding: 10px 20px;
    font-weight: 500;
    display: block;
    z-index: 9;
}


#article-slider .img-wrap {
    padding-top: 56.25%;
    max-width: 100%;
    margin: 0 auto;
}

#article-thum .img-wrap {
    margin: 0;
}

.article-slider {
    position: relative;
}

    .article-slider li .img-wrap img {
        object-fit: contain;
        object-position: center center;
    }

    .article-slider .owl-carousel div.owl-nav > div {
        top: 87.5%;
        right: -30px;
        left: auto;
    }

        .article-slider .owl-carousel div.owl-nav > div.owl-next {
            left: -30px;
            right: auto;
        }

    .article-slider .owl-carousel .owl-stage {
        white-space: nowrap;
    }

    .article-slider .owl-carousel.owl-rtl .owl-item {
        float: none;
        display: inline-block;
        vertical-align: top;
    }

.article-content ul.tag-list-wrapper {
    list-style: none;
    padding: inherit;
}

#article-thum .img-wrap {
    margin: 0;
    border: 3px solid transparent;
}

#article-thum .current .img-wrap {
    border-color: #b61932;
}

.article-slider .vide-caption {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 23px;
    z-index: 2;
    direction: rtl;
    text-align: right;
    left: 0;
}

.article-slider #article-thum {
    margin-top: 40px;
}

.article-slider .vide-caption p {
    color: #fff;
    font-weight: 300;
    position: relative;
    z-index: 2;
    text-shadow: 0 2px 2px rgba(0,0,0,0.25);
}

.article-content > h3 {
    color: #b61932;
    font-size: 31px;
    margin-bottom: 20px;
    padding-left: 100px;
}

.article-content .post-date {
    font-size: 27px;
    color: #8f8f91;
}

    .article-content .post-date strong {
        color: #666666;
        font-weight: normal;
        font-size: 31px;
    }

.article-content p {
    font-weight: 300;
}

.article-content ul {
    list-style: disc;
    margin-bottom: 30px;
    padding-right: 45px;
}

.article-content li {
    font-size: 20px;
    font-weight: 300;
    line-height: 140%;
    margin-bottom: 20px;
}

    .article-content li:last-child {
        margin-bottom: 0px;
    }

.article-content figure {
    text-align: center;
}

    .article-content figure img {
        width: 100%;
        margin-bottom: 2px;
    }

.article-content figcaption {
    color: #8f8f91;
    font-weight: 300;
    text-align: center;
}

.article-img p {
    color: #8f8f91;
    font-weight: 300;
}

.article-content::after {
    content: "";
    display: block;
    clear: both;
}

.share-bookmark {
    float: left;
}

    .share-bookmark > span {
        display: inline-block;
        vertical-align: top;
        margin-left: 17px;
    }

        .share-bookmark > span:last-child {
            margin-left: 0px;
        }

        .share-bookmark > span > a {
            font-size: 38px;
        }

.share > a {
    transition: none;
    display: block;
    vertical-align: top;
    height: 100%;
    width: 100%;
    margin-top: 3px;
}

.social-share {
    position: absolute;
    top: 7px;
    background: transparent;
    left: 0;
    width: 130px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
    list-style: none;
    padding-right: 0;
}

.article-content ul.social-share {
    list-style: none;
    padding-right: 0;
    top: 58%;
    transform: translateY(-50%);
    width: 210px;
}

.article-right .share-popup .social-share {
    width: 210px;
}

.share-popup .social-share {
    opacity: 1;
    visibility: visible;
    transition: all 0.2s ease;
    margin: 0;
    left: 100%;
    padding-left: 10px;
    width: 130px;
    pointer-events: auto;
}

    .share-popup .social-share > * + * {
        margin-left: 10px;
    }

.social-share > li {
    float: left;
    margin: 0;
}

    .social-share > li > a {
        display: block;
        text-align: center;
        width: 30px;
        height: 30px;
        line-height: 15px;
        color: #fff;
        overflow: hidden;
        border-radius: 0;
        justify-content: center;
    }

        .social-share > li > a > i {
            color: #fff;
            font-size: 15px;
            transition: all 0.2s ease;
            line-height: 30px;
        }

        .social-share > li > a:hover > i {
            transition: all 0.2s ease;
            opacity: 0.5;
        }

    .social-share > li.in > a {
        background: #0782a6;
    }

    .social-share > li.fb > a {
        background: #414f8b;
    }

    .social-share > li.pin > a {
        background: #b70a28;
    }

    .social-share > li.tw > a {
        background: #05abe9;
    }

    .social-share > li.mail > a {
        background: #e1b908;
    }

    .social-share > li.whatsapp > a {
        background: #94d82d;
    }

.share {
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
    position: relative;
}

.social-view {
    position: absolute;
    top: 20px;
    left: 50px;
}

    .social-view .views {
        width: 89px;
        border: 1px solid #edd1a1;
        height: 50px;
        display: inline-block;
        vertical-align: top;
        text-align: center;
        color: #edd1a1;
        line-height: 50px;
    }
/*article end*/
/*featured*/
.bg-gray.featured-video {
    padding: 0;
    background: #f0f0f0;
}

.featured-video .hastag {
    background: #fff;
}

.featured-video #article-slider .img-wrap {
    max-width: 100%;
    padding-top: 56.44%;
}

.article-slider .vide-caption:before {
    content: "";
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.38) 54%, rgba(0, 0, 0, 0.52) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.38) 54%, rgba(0, 0, 0, 0.52) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.38) 54%, rgba(0, 0, 0, 0.52) 100%);
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
}

.featured-video #article-slider .img-wrap img {
    height: 100%;
    width: 100%;
}

.featured-video #article-thum {
    padding: 0 60px;
}

.featured-video .article-slider .owl-carousel div.owl-nav > div {
    top: 90%;
    right: 20px;
    left: auto;
}

    .featured-video .article-slider .owl-carousel div.owl-nav > div.owl-next {
        left: 20px;
        right: auto;
    }

.featured-box {
    padding: 0px 100px 50px 100px;
    position: relative;
    max-width: 90%;
    margin: 50px auto 0 auto;
}

    .featured-box .share-bookmark {
        position: absolute;
        left: 0;
        top: 0;
    }

    .featured-box p.post-date {
        color: #666666;
    }

    .featured-box > .kd-center {
        max-width: 1000px;
        margin: 0 auto;
    }

    .featured-box p {
        color: #8f8f91;
        line-height: 150%;
        font-weight: 300;
    }

.article-content h4 {
    font-size: 30px;
    font-weight: 400;
    margin-top: 25px;
    margin-bottom: 20px;
}

.article-content strong {
    font-weight: 500;
}
/*featured*/
/* coupon */
.main-bg {
    font-family: "Tajawal";
    background: url("../images/main-bg.jpg") no-repeat 0 0;
    background-size: cover;
    background-attachment: fixed;
    min-height: calc(100vh - 74px);
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

.coupone-continer {
    padding: 1.8% 8.3%;
    width: 100%;
    margin: 0 auto;
}

.coupone-form {
    background: #fff;
    max-width: 38.635%;
    width: 100%;
    float: right;
    padding: 30px;
    position: relative;
    -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.2);
    box-shadow: 0 0 20px 0 rgba(0,0,0,0.2);
}

    .coupone-form .c-logo {
        max-width: 215px;
        margin: 0 auto 3% auto;
        width: 100%;
        display: block;
    }

    .coupone-form h1 {
        text-align: center;
        color: #6d6e71;
        font-size: 1.7vw;
        line-height: 140%;
        font-weight: 500;
    }

    .coupone-form .form .form-row {
        margin-bottom: 18px;
        position: relative;
    }

        .coupone-form .form .form-row:last-child {
            margin-bottom: 0;
        }

    .coupone-form .form input {
        width: 100%;
        display: inline-block;
        vertical-align: top;
        border: none;
        font-size: 1.3vw;
        color: #6d6e71;
        height: 50px;
        padding-right: 12px;
    }

    .coupone-form .form .form-row {
        border-width: 0 0 1px 0;
        border-style: dotted;
        display: flex;
    }

    .coupone-form .form input::-webkit-input-placeholder {
        color: #6d6e71;
        opacity: 1;
    }

    .coupone-form .form input:-moz-placeholder {
        color: #6d6e71;
        opacity: 1;
    }

    .coupone-form .form input::-moz-placeholder {
        color: #6d6e71;
        opacity: 1;
    }

    .coupone-form .form input:-ms-input-placeholder {
        color: #6d6e71;
        opacity: 1;
    }

    .coupone-form .form .submit-btn > a, .coupone-form .form .submit-btn input[type="submit"] {
        background: #000;
        color: #fff;
        padding: 15px;
        height: auto;
        line-height: 100%;
        cursor: pointer;
        width: 100%;
        display: block;
        text-align: center;
        font-size: 1.3vw;
    }

        .coupone-form .form .submit-btn > a:hover, .coupone-form .form .submit-btn input[type="submit"]:hover {
            background: #333;
        }

    .coupone-form .condition {
        margin-top: 5%;
    }

        .coupone-form .condition > strong {
            display: block;
            font-size: 1vw;
            margin-bottom: 10px;
            color: #000;
            font-weight: 500;
        }

        .coupone-form .condition li {
            position: relative;
            padding-right: 15px;
            font-size: 0.75vw;
            color: #6d6e71;
            margin-bottom: 2px;
            line-height: 120%;
        }

            .coupone-form .condition li::before {
                content: "";
                position: absolute;
                top: 6px;
                right: 0;
                height: 8px;
                width: 8px;
                background: #6d6e71;
                border-radius: 50px;
            }
/*subscribe page*/
.subscribe-page section.app-section {
    display: none;
}

section.subscribe-section {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 0;
    background-color: #f0f0f0;
    padding-top: 72px;
    min-height: 100vh;
}

.subscribe-form {
    max-width: 648px;
    background: rgba(255, 255, 255, 0.59);
    padding: 30px 50px 30px 50px;
    position: relative;
    min-height: 420px;
    margin-bottom: 40px;
}

    .subscribe-form::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
        padding-top: 36.5%;
        z-index: 0;
    }

    .subscribe-form ul.tabs {
        margin-bottom: 45px;
        position: relative;
        z-index: 1;
    }

.tab_container {
    position: relative;
    z-index: 1;
}

ul.tabs {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.subscribe-form ul.tabs li {
    width: 50%;
    border-left: 1px solid #f0f0f0;
    cursor: pointer;
}

    .subscribe-form ul.tabs li:last-child {
        border-left: none;
    }

    .subscribe-form ul.tabs li a {
        color: #fff;
        font-size: 28px;
        font-weight: 400;
        display: block;
        line-height: 180%;
    }

    .subscribe-form ul.tabs li:hover a, .subscribe-form ul.tabs li.active a {
        color: #b61932;
    }

p.mandatory {
    text-align: left;
    font-size: 16px;
    color: #b61932;
}

.form .form-field {
    margin-bottom: 15px;
}

.form select, .form textarea, :not(.coupone-form) > .form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="submit"]):not([type="reset"]):not([type="image"]) {
    width: 100%;
    background-color: #fff;
    border: none;
    height: 51px;
    color: #000;
    font-size: 20px;
    padding: 6px 15px 0 15px;
    font-weight: 300;
}

.form textarea {
    height: 100px;
    resize: none;
    padding: 15px;
}

.form select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("../images/select-arrow.png");
    background-repeat: no-repeat;
    background-position: 20px center;
    padding-left: 50px;
}

    .form select::-ms-expand {
        display: none;
    }

.subscribe-form .form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="submit"]):not([type="reset"]):not([type="image"]) {
    color: #b61932;
}

.contact-form textarea::-webkit-input-placeholder, .contact-form input::-webkit-input-placeholder, .subscribe-form input::-webkit-input-placeholder {
    color: #b61932;
}

.contact-form textarea:-moz-placeholder, .contact-form input:-moz-placeholder, .subscribe-form input:-moz-placeholder {
    color: #b61932;
}

.contact-form textarea::-moz-placeholder, .contact-form input::-moz-placeholder, .subscribe-form input::-moz-placeholder {
    color: #b61932;
}

.contact-form textarea:-ms-input-placeholder, .contact-form input:-ms-input-placeholder, .subscribe-form input:-ms-input-placeholder {
    color: #b61932;
}

.form .form-field.ph-no .ctr-code input::-webkit-input-placeholder, .form .form-field.dob input::-webkit-input-placeholder {
    color: #b2b2b2;
}

.form .form-field.ph-no .ctr-code input:-moz-placeholder, .form .form-field.dob input:-moz-placeholder {
    color: #b2b2b2;
}

.form .form-field.ph-no .ctr-code input::-moz-placeholder, .form .form-field.dob input::-moz-placeholder {
    color: #b2b2b2;
}

.form .form-field.ph-no .ctr-code input:-ms-input-placeholder, .form .form-field.dob input:-ms-input-placeholder {
    color: #b2b2b2;
}

.form .form-field.dob {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    background-color: #fff;
    align-items: center;
}

    .form .form-field.dob > label {
        width: 42.7%;
        height: 51px;
        line-height: 51px;
        border-left: 1px solid #b2b2b2;
        color: #b61932;
        font-size: 20px;
        padding: 0 15px;
    }

    .form .form-field.dob .year {
        width: 24.2%;
        border-left: 1px solid #b2b2b2;
    }

    .form .form-field.dob .year {
        width: 24.2%;
        border-left: 1px solid #b2b2b2;
    }

    .form .form-field.dob .month {
        width: 14.8%;
        border-left: 1px solid #b2b2b2;
    }

    .form .form-field.dob .day {
        width: 18%;
    }

    .form .form-field.dob input {
        text-align: center;
    }

.form select {
    color: #b61932;
}

.form .form-field.ph-no {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
}

    .form .form-field.ph-no .number {
        width: 81.6%;
        border-left: 1px solid #b2b2b2;
    }

    .form .form-field.ph-no .ctr-code {
        width: 18.4%;
        direction: ltr;
    }

        .form .form-field.ph-no .ctr-code input {
            text-align: center;
        }

form .btn {
    font-size: 24px;
    font-weight: normal;
    margin-top: 26px;
    padding: 10px 35px;
    line-height: 100%;
}

    form .btn:hover {
        background-color: #000;
    }

    form .btn.webform-submit {
        min-height: 44px;
        line-height: 44px;
        padding: 0 15px 1px 4px;
        text-align: center;
        min-width: 110px;
    }
/*subscribe page*/
/*zak tv*/
section.add-section + section.news-inner {
    padding-top: 0;
}

section.multimedia-section, section.zak-tv {
    padding-top: 82px;
    padding-bottom: 0;
}

.tv .hastag {
    padding: 10px 26px;
    background: #fff;
}

.tv > .img-wrap {
    position: relative;
}

    .tv > .img-wrap::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.7) 53%, rgba(0, 0, 0, 0.91) 100%);
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.7) 53%, rgba(0, 0, 0, 0.91) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.7) 53%, rgba(0, 0, 0, 0.91) 100%);
        height: 48.485%;
        z-index: 1;
    }

.tv .video-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 35px;
    z-index: 3;
    text-align: center;
}

    .news-caption p.post-date strong, .news-caption p.post-date, .tv .video-caption p.post-date strong, .tv .video-caption p.post-date {
        font-size: 30px;
        color: #fff;
        line-height: 150%;
    }

    .tv .video-caption p.post-date {
        padding: 0 55px;
    }

.news-caption p.post-date {
    color: #B2B2B2;
}

    .news-caption p.post-date strong, .tv .video-caption p.post-date strong {
        color: #B61932;
        font-weight: 400;
    }

        .tv .video-caption p.post-date strong::before {
            background-color: #FFFFFF;
        }

.tv .video-caption .share {
    float: left;
    margin-bottom: -14px;
    margin-left: -4px;
}

    .tv-content .share > a, .tv .video-caption .share > a {
        font-size: 40px;
    }

        .tv-content .share > a:active, .tv-content .share > a:focus, .tv-content .share > a:hover {
            color: #000;
        }

        .tv .video-caption .share > a:active, .tv .video-caption .share > a:focus, .tv .video-caption .share > a:hover {
            color: #fff;
        }

.tv-content {
    padding: 25px 75px 35px;
    position: relative;
}

    .tv-content .share {
        position: absolute;
        left: 30px;
        top: 30px;
    }

    .tv-content h1 {
        font-size: 60px;
        font-weight: normal;
        line-height: 140%;
    }

    .tv-content .time > span {
        display: inline-block;
        vertical-align: top;
        color: #B61932;
        font-size: 40px;
        font-weight: normal;
    }

        .tv-content .time > span.timing {
            direction: ltr;
            font-weight: 300;
            margin-right: 20px;
            border-left: 2px solid #B61932;
            padding-left: 20px;
            line-height: 100%;
            padding-top: 7px;
        }

            .tv-content .time > span.timing:last-child {
                border-left: none;
                padding-left: 0px;
            }

    .tv-content .time {
        margin-bottom: 15px;
    }

    .tv-content > p {
        max-width: 620px;
        margin: 0 auto;
        font-size: 24px;
        font-weight: 300;
    }

.kd-row.podcasts-grid, .kd-row.news-grid {
    margin: 30px -35px 0 -35px;
}

.podcasts-grid > .kd-4, .news-grid > .kd-4 {
    padding: 0 35px;
    margin-bottom: 40px;
}

    .podcasts-grid > .kd-4:nth-child(3n+1), .news-grid > .kd-4:nth-child(3n+1) {
        clear: both;
    }

    .news-grid > .kd-4 > a {
        display: block;
    }

.news-grid .img-wrap {
    margin-bottom: 15px;
}

section.news-inner + .news-inner {
    padding-top: 0;
}

.dropdown.form {
    width: 290px;
}

    .dropdown.form > select {
        border: 1px solid #ccc !important;
        color: #000;
    }

        .dropdown.form > select option {
            font-size: 16px;
        }
/*zak tv*/
/*podcasts tv*/
section.podcasts-section {
    padding-top: 71px;
}

.podcasts-wrap {
    position: relative;
    padding: 3.7% 3.7% 0 3.7%;
    overflow: hidden;
}

.bg-red {
    position: relative;
    background: #B61932;
}

.podcasts-wrap .opact-logo {
    position: absolute;
    left: -4.8%;
    width: 76.3%;
    top: 0;
    z-index: 0;
}

.podcasts-wrap .hastag {
    background: #fff;
}

.podcasts-wrap .player {
    padding-top: 24%;
    position: relative;
    z-index: 1;
    max-width: 150px;
}

.podcasts-caption::after {
    clear: both;
    content: "";
    display: block;
}

.podcasts-caption {
    margin-top: 34px;
    padding-left: 10px;
    padding-bottom: 20px;
    position: relative;
    z-index: 1;
}

    .podcasts-caption .share {
        float: left;
        width: 2.2%;
    }

        .podcasts-caption .share > a {
            color: #fff;
            font-size: 35px;
        }

            .podcasts-caption .share > a:hover {
                color: #fff;
                opacity: 0.6;
            }

.podcasts-name {
    float: right;
    width: 35%;
}

    .podcasts-name > span {
        display: inline-block;
        vertical-align: top;
        color: #fff;
        font-size: 30px;
    }

.podcasts-caption h6 {
    width: 62%;
    text-align: right;
    color: #fff;
    font-size: 45px;
    line-height: 140%;
    float: left;
    padding-right: 7%;
    margin: 0;
    font-weight: 500;
}

.podcasts-name {
    float: right;
    width: 34.5%;
}

    .podcasts-name > span {
        display: inline-block;
        vertical-align: top;
        color: #fff;
        font-size: 30px;
        line-height: 140%;
        margin-left: 15px;
        padding-left: 15px;
        border-left: 2px solid #fff;
        padding-top: 2px;
        padding-bottom: 6px;
        font-weight: 500;
    }

        .podcasts-name > span:last-child {
            border: none;
            padding-left: 0;
            margin-left: 0;
            padding-top: 7px;
            padding-bottom: 0;
        }

.podcasts-wrap::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding-top: 20%;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, rgba(0, 0, 0, 0.65) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, rgba(0, 0, 0, 0.65) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, rgba(0, 0, 0, 0.65) 100%);
    z-index: 0;
}

.podcasts-grid .podcasts-box .img-wrap {
    margin: 0;
}

.podcasts-box .img-wrap::before {
    content: "";
    position: absolute;
    padding-top: 40%;
    left: 0;
    right: 0;
    z-index: 1;
    bottom: 0;
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.44) 51%, rgba(0,0,0,0.88) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.44) 51%,rgba(0,0,0,0.88) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0, 0, 0, 0.44) 51%,rgba(0, 0, 0, 0.88) 100%);
}

.podcasts-box .podcasts-detail {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: right;
    width: 100%;
    padding: 15px 12px;
    z-index: 1;
}

    .podcasts-box .podcasts-detail .podcasts-name {
        width: 100%;
        float: none;
    }

        .podcasts-box .podcasts-detail .podcasts-name h4 {
            color: #fff;
            font-size: 35px;
            font-weight: 400;
            margin-bottom: 6px;
            line-height: 140%;
        }

.podcasts-detail .podcasts-name > span {
    font-size: 20px;
    padding-top: 0;
    padding-bottom: 0;
    margin-left: 6px;
    padding-left: 10px;
}

    .podcasts-detail .podcasts-name > span:last-child {
        padding-top: 2px;
        padding-left: 0;
        margin-left: 0;
    }

.podcasts-player > *, .podcasts-player > img {
    width: 100%;
}

.podcasts_detail_wrap {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
    margin-top: 50px;
    z-index: 1;
    position: relative;
}

.podcasts_img_wrap {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
}

.podcasts_img {
    max-width: 230px;
    width: 100%;
}

    .podcasts_img img {
        margin-bottom: 0;
    }

.podcasts_info_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    max-width: 240px;
}

.pod_title {
    margin-top: auto;
    margin-bottom: 10px;
}

.come-one-music-img {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    width: 100%;
}

.come-one-img {
    height: 117px;
    width: 117px;
    margin-left: 14px;
}

    .come-one-img > img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: top;
    }

.come-on-info p {
    font-size: 15px;
    font-weight: 400;
    color: #fff;
    margin-bottom: 0;
}

.come-one-music-img .come-on-info {
    width: calc(100% - 137px);
}

.live_pod_title h2 {
    color: #fff;
}

.pod_title p {
    color: #fff;
}

.play-song-info {
    max-width: 60%;
    margin-left: 20px;
    width: 100%;
}

.catchupvideo-div {
    position: relative;
    height: 66px;
    margin-bottom: 15px;
}

.music-name p {
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    color: #fff;
    text-align: left;
}

.play-song-info .catchupvideo-div iframe {
    height: 66px;
    border: none;
    width: 100%;
}
/*podcasts tv*/
/*famous people*/
section.famous-ppl {
    padding-top: 80px;
}

.famous-ppl-lissting .news-listing > div {
    margin-bottom: 24px;
}

    .famous-ppl-lissting .news-listing > div:last-child {
        margin-bottom: 0px;
    }

.famous-ppl .sidebar-section > .right-section {
    padding-left: 1.5%;
    width: 68.5%;
}

.famous-ppl-lissting {
    float: left;
    width: 31.5%;
}

.famous-ppl .sidebar-section > .right-section .hastag {
    background: #fff;
}
/*famous people end*/
/*multimedia*/
section.multimedia-section {
    padding-bottom: 0;
}

section.add-section + .multi-video {
    padding-top: 0;
}

.multi-video + section.photo-section {
    padding-top: 0;
}

.photo-section + section.podcasts-inner {
    padding-top: 0;
}

.multimedia-section .tv .img-wrap::before {
    display: none;
}

.multimedia-section .tv .video-caption .share > a:active, .multimedia-section .tv .video-caption .share > a:focus, .multimedia-section .tv .video-caption .share > a:hover {
    color: #000;
}

.multimedia-section .tv-content {
    padding: 0;
}

.video-box {
    position: relative;
    margin-bottom: 5px;
    cursor: pointer;
    border: 2px solid transparent;
    display: block;
}

.m-play-icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 42px;
    height: 42px;
    background: #fff;
    padding: 11px;
    left: auto;
    border-radius: 0;
    transform: none;
}

    .m-play-icon img {
        position: relative;
        width: auto;
    }

.podcasts-grid .img-wrap {
    margin-bottom: 10px;
}

.podcasts-grid .post-date {
    margin-bottom: 7px;
}

.podcasts-grid + .kd-center > a.link {
    margin-top: 0;
}

.podcasts-grid .box-content h4, .podcasts-grid .video-box h4 {
    font-size: 25px;
    font-weight: 400;
    line-height: 140%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 100px;
}
/*multimedia end*/
/*search*/
.search-section .advertisement iframe {
    min-width: 300px;
}

.s-result {
    margin-bottom: 20px;
}

    .s-result > h5 {
        font-size: 35px;
        display: inline-block;
        vertical-align: top;
        font-weight: 300;
        margin: 0 0 0 10px;
        line-height: 140%;
    }

    .s-result > .search-label {
        font-size: 35px;
        display: inline-block;
        vertical-align: top;
        line-height: 170%;
    }

.search-section .left-sidebar {
    border: none;
}

header + section.search-section {
    padding-bottom: 0;
}

.search-filter {
    margin-bottom: 40px;
}

    .search-filter .s-filter {
        text-align: right;
        display: block;
        margin-bottom: 40px;
    }

        .search-filter .s-filter > li {
            display: inline-block;
            vertical-align: top;
            margin-left: 30px;
        }

            .search-filter .s-filter > li:last-child {
                margin-left: 0px;
            }

            .search-filter .s-filter > li a {
                font-size: 35px;
                color: #000;
                font-weight: 300;
                cursor: pointer;
                display: block;
            }

                .search-filter .s-filter > li a:hover, .search-filter .s-filter > li.active a {
                    color: #b61932;
                    text-decoration: underline;
                }

.search-result > li {
    margin-bottom: 30px;
}

.search-result .video-box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
}

    .search-result .video-box .img-wrap {
        width: 49.3%;
        padding-top: 27.878%;
        margin: 0 0 0 3%;
        line-height: 0;
    }

.search-result .s-podcasts .podcasts-box {
    width: 49.3%;
}

.search-result .video-box .vide-caption {
    width: 40%;
}

.search-result .s-podcasts .podcasts-box .img-wrap {
    margin: 0;
}

section.add-section + .search-section {
    padding-top: 0;
}

.podcasts-player img {
    width: 100%;
}
/*search end*/
/*terms*/
section.inner-banner {
    padding-top: 0;
    display: none;
}

section.terms {
    padding-top: 60px;
}

.inner-banner .banner-img {
    line-height: 0;
}

section.inner-banner .title h2 {
    padding: 5px 0 0 0;
    font-weight: 400;
}

.terms .article-content {
    max-width: 985px;
    width: 100%;
}

    .terms .article-content > h4:first-child {
        margin-top: 0;
    }

.no-border .left-sidebar {
    border-right: none;
}
/*terms end*/
/*contact us*/
section.contact-section {
    position: relative;
    min-height: calc(100vh - 226px);
    padding-top: 0;
}

    section.contact-section > .container {
        padding-top: 40px;
    }

.contact-img {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    max-width: 656px;
}

    .contact-img > img {
        position: absolute;
        left: 0;
        top: 0;
        object-fit: cover;
        object-position: 0 0;
        height: 100%;
        width: 100%;
    }

    .contact-img::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        width: 100%;
        background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.39) 62%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.39) 62%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.39) 62%,rgba(255,255,255,1) 100%);
        z-index: 1;
    }

    .contact-img::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
        height: 70px;
    }

.title.no-border::before {
    display: none;
}

.title.no-border h2 {
    background: transparent;
    padding: 0;
}

.contact-form {
    max-width: 72.1%;
    width: 100%;
    position: relative;
    z-index: 1;
}

    .contact-form form select, .contact-form form textarea, .contact-form form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="submit"]):not([type="reset"]):not([type="image"]) {
        border: 1px solid #B2B2B2;
    }

    .contact-form .kd-row {
        margin: 0 -5px;
    }

    .contact-form .kd-6 {
        padding: 0 5px;
    }

    .contact-form .kd-12 {
        padding: 0 5px;
    }

    .contact-form .form .form-field.ph-no .number input, .contact-form .form .form-field.ph-no .number {
        border-left: none !important;
    }

    .contact-form .form .form-field.ph-no {
        width: 50%;
    }

    .contact-form form textarea {
        padding: 15px;
        height: 265px;
    }

label.big-label {
    font-size: 30px;
    display: block;
    margin-bottom: 15px;
}

.radio-row > .radio {
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin-left: 30px;
    margin-top: 9px;
}

    .radio-row > .radio:last-child {
        margin-left: 0px;
    }

.radio > input[type="radio"] {
    position: absolute;
    opacity: 0;
}

    .radio > input[type="radio"] + label {
        font-size: 20px;
        font-weight: 400;
        position: relative;
        padding-right: 22px;
        display: block;
        line-height: 20px;
    }

        .radio > input[type="radio"] + label::before {
            content: "";
            position: absolute;
            right: 0;
            top: 3px;
            width: 15px;
            height: 15px;
            background-color: #C3C3C3;
            border-radius: 50px;
            display: block;
        }

    .radio > input[type="radio"]:checked + label::before {
        background-color: #B61932;
    }

.captcha-wrap > span {
    display: inline-block;
    vertical-align: top;
}

    .captcha-wrap > span.captcha-input {
        width: 45.5%;
        margin-left: 5%;
    }

    .captcha-wrap > span.captcha-refresh {
        width: 45.8%;
        padding-left: 50.9px;
        position: relative;
        float: left;
    }

.captcha-wrap::after {
    clear: both;
    content: "";
    display: block;
}

.captcha-wrap > span.captcha-refresh img {
    width: 100%;
    border: 1px solid #c3c3c3;
    height: 51px;
}

.captcha-wrap > span.captcha-refresh small {
    position: absolute;
    top: 0;
    left: 0;
    width: 51px;
    height: 51px;
    text-align: center;
    line-height: 53px;
    font-size: 25px;
    border: 1px solid #c3c3c3;
    background: #fff;
}

    .captcha-wrap > span.captcha-refresh small a {
        color: #c3c3c3;
        transform: rotate(-55deg);
        display: block;
    }

.captcha-row label.big-label {
    margin-bottom: 10px;
}
/*contact us end*/
/*404 page*/
.wrap-404 {
    width: 100%;
    margin: 7% auto 4% auto;
    padding-bottom: 20px;
}

.logo-404 {
    margin-bottom: 40px;
}

    .logo-404 > span {
        display: block;
        text-align: center;
        max-width: 80%;
        margin: 0 auto 20px auto;
    }

.wrap-404 .buttom {
    text-align: center;
}

    .wrap-404 .buttom .btn {
        font-size: 24px;
        padding: 18px 40px;
    }
/*404 page end*/
div.embed-responsive-16by9::before {
    padding-top: 56.35%;
}

#video-slider .video-box .embed-responsive-16by9 {
    background: #e0e0e0;
}
/*popup img full screen*/
figure img.mfp-img {
    padding: 0;
    width: 100%;
    object-fit: contain;
    height: 100%;
    background: #fff;
}

div.mfp-container {
    padding: 0;
}

.mfp-image-holder .mfp-content {
    max-width: 100%;
    width: 100%;
}

.mfp-content .mfp-figure {
    background: #fff;
}

    .mfp-content .mfp-figure::after {
        display: none;
    }

.mfp-image-holder button.mfp-close, .mfp-iframe-holder button.mfp-close {
    right: 10px;
    text-align: right;
    padding-right: 6px;
    width: 100%;
    top: 10px;
    font-size: 45px;
    opacity: 1;
    color: #b61932;
}

div.mfp-image-holder button.mfp-close:hover, div.mfp-iframe-holder button.mfp-close:hover {
    opacity: 0.5;
}
/*popup img full screen end*/
body > div[data-studioassetid] {
    position: fixed !important;
    z-index: 9999 !important;
    top: 50% !important;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0 !important;
    right: 0 !important;
    margin: auto;
    width: 100% !important;
    text-align: center;
    max-height: 480px;
}

    body > div[data-studioassetid] > div {
        display: inline-block;
        vertical-align: top;
        max-width: 100%;
        width: auto !important;
        min-width: 320px;
    }
/*poll*/
.poll-section .article-content {
    margin: 0;
    max-width: 100%;
}

.poll-content {
    text-align: right;
    margin-bottom: 60px;
}

.poll-form.form {
    margin-top: 30px;
    margin-bottom: 30px;
}

.poll-content .radio {
    display: inline-block;
    vertical-align: top;
    margin-bottom: 10px;
}

.poll-section .title {
    margin-bottom: 40px;
}

.poll-content .radio > input[type="radio"] + label::before {
    background: #fff;
    border: 1px solid #3d3d3d;
}

.poll-content .radio > input[type="radio"]:checked + label::before {
    background: #b61932;
    border-color: transparent;
}

.poll-content p {
    color: #484848;
    line-height: 140%;
    font-weight: 300;
}

.poll-section .article-content > h3 {
    padding: 0;
    color: #000;
    font-weight: bold;
}

form.poll-form form .btn {
    padding: 0px 35px;
    line-height: 44px;
}

.poll-content .img-wrap {
    margin-bottom: 30px;
    width: 100%;
}

.coupone-form .form input.ltr {
    padding-left: 65px;
}

.form-row .ph-number {
    position: absolute;
    left: 0;
    bottom: 3px;
    font-size: 1.3vw;
    color: #6d6e71;
    direction: ltr;
}

.coupone-form .form .placeholder {
    color: #6d6e71;
    font-size: 1.3vw;
    display: inline-block;
    white-space: nowrap;
    vertical-align: top;
}

.coupone-form .thank-message {
    display: none;
}

.coupone-form .thank-message {
    text-align: center;
    font-size: 35px;
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
    padding: 10px 10px 8px 10px;
}

.coupone-form.hide form.form {
    display: none;
}

.coupone-form.hide .thank-message {
    display: block;
}

.footer {
    background: #fff;
    padding: 10px;
    position: relative;
}

    .footer ul {
        text-align: center;
        list-style: none;
    }

        .footer ul li {
            display: inline-block;
            vertical-align: middle;
            width: 100px;
            text-align: center;
        }

        .footer ul > li > a {
            width: 100px;
            display: inline-block;
            vertical-align: top;
        }

            .footer ul > li > a > img {
                margin: 0;
            }

        .footer ul li.instagram-icon > a {
            width: 35px;
            display: inline-block;
            vertical-align: top;
        }

        .footer ul > li > a:hover {
            opacity: 0.75;
            transform: scale(0.9);
        }
/*coupon*/
.overlay-popup {
    background: #000;
    opacity: 0.35;
    top: 0;
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 999;
    left: 0;
    visibility: visible;
    pointer-events: auto;
    transition: all 0.5s ease;
}

.welcome-popup {
    position: fixed;
    max-width: 435px;
    width: 100%;
    padding: 0;
    left: 0;
    margin: auto;
    background-color: #fff;
    background-image: url("../images/coupon-img.jpg");
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: cover;
    border: 1px solid #000;
    z-index: 1000;
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transition: all 0.5s ease;
    bottom: 0;
}

    .welcome-popup .coupon-popup {
        padding: 10px 180px 10px 10px;
        text-align: center;
        position: relative;
    }

.coupon-popup .close-popup {
    position: absolute;
    right: -1px;
    top: -1px;
    height: 40px;
    width: 40px;
    background: #fff;
    padding: 12px;
    border: 1px solid #000;
}

    .coupon-popup .close-popup:hover > img {
        opacity: 0.6;
    }

.coupon-popup .coupon-logo {
    max-width: 200px;
    width: 100%;
    margin: 0 auto;
}

.coupon-detail h3 {
    font-size: 14px;
    font-weight: lighter;
    margin-bottom: 10px;
}

.coupon-detail a {
    border: 1px solid #000;
    max-width: 203px;
    width: 100%;
    display: inline-block;
    line-height: 28px;
    border-radius: 5px;
    background: #fff;
    font-size: 16px;
    font-weight: bold;
    vertical-align: top;
}

    .coupon-detail a:hover {
        background: #b61932;
        color: #fff;
    }

.close-popup .welcome-popup {
    z-index: -1;
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    transition: all 0.5s ease;
}

.close-popup .overlay-popup {
    opacity: 0;
    z-index: -1;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.5s ease;
}
/*iframe video popup*/
.iframe-popup {
    position: fixed;
    padding: 0;
    background-color: #fff;
    z-index: 1000;
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transition: all 0.5s ease;
    bottom: auto;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 55%;
    width: 100%;
    height: auto;
    transform: translateY(-50%);
}

.iframe-sec {
    height: 100%;
    padding-bottom: 55%;
    position: relative;
}

.iframe-close-popup img {
    margin-bottom: 0;
}

.iframe-sec iframe {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 100%;
    max-height: 100%;
}

.iframe-close-popup {
    position: absolute;
    height: 35px;
    width: 35px;
    background: #fff;
    padding: 0;
    right: -15px;
    top: -15px;
    z-index: 9;
    border-radius: 50%;
    border: none;
    line-height: 45px;
    text-align: center;
}

.iframe-popup > h2 {
    text-align: center;
    padding-top: 10px;
    color: #b61932;
    font-weight: bold;
    margin-bottom: 10px;
}

.iframe-add-popup .iframe-popup, .iframe-add-popup .overlay-popup {
    z-index: -1;
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    transition: all 0.5s ease;
    display: none;
}

a.w-images {
    height:;
    display: block;
    overflow: hidden;
    position: relative;
}

    a.w-images img {
        width: 100%;
        transition: all 0.5s ease;
    }

    a.w-images:hover img {
        transition: all 0.5s ease;
        transform: scale(1.05);
    }

.border-btn {
    border: 1px solid #B41A30;
    padding: 10px 13px;
    border-radius: 5px;
    line-height: 110%;
    min-width: 196px;
    text-align: center;
    display: table;
    margin: 15px auto 0 auto;
}

    .border-btn:hover {
        background: #B41A30;
        color: #fff;
    }

.right-section .add-section:last-child {
    padding-bottom: 0;
}
/*magazine popuop*/
.left-sidebar > div.magazine {
    position: relative;
}

    .left-sidebar > div.magazine.show-maz-popup {
        position: relative;
    }

    .left-sidebar > div.magazine span.border-btn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 0;
        right: 0;
        margin: auto;
        z-index: 1;
        background: rgba(255,255,255,0.76);
        font-weight: normal;
        font-size: 22px;
        color: #000;
        max-width: 188px;
        width: 100%;
        border-radius: 10px;
        padding: 12px;
        box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
    }

        .left-sidebar > div.magazine span.border-btn:hover {
            background: #a72c37;
            color: #fff;
        }

    .left-sidebar > div.magazine .box-content > a.border-btn {
        height: auto;
        min-height: 1px;
        line-height: 0;
        max-width: 188px;
        margin-top: 20px;
        padding-top: 12px;
        padding-bottom: 7px;
    }

        .left-sidebar > div.magazine .box-content > a.border-btn:hover {
            background: #fff;
            box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
        }

.magazine-popup {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.5s ease;
}

.show-maz-popup .magazine-popup {
    z-index: 2000001;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: all 0.5s ease;
}

.magazine-popup .bg-overlay {
    background: #000;
    border: 1px solid #707070;
    opacity: 0.7;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.magazine-popup .option {
    width: 300px;
    height: auto;
    border-radius: 16px;
    background: #fff;
    opacity: 0.93;
    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
    padding: 50px 12px 35px 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    z-index: 2;
}

.maz-list a.border-btn {
    width: 230px;
    height: 49px;
    border-radius: 10px;
    background: rgba(255,255,255,0.76);
    border: 1px solid #a72c37;
    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
    display: flex;
    justify-content: center;
    align-items: center;
}

ul.maz-list {
    list-style: none;
}

.maz-list a.border-btn:hover {
    background: #a72c37;
}

.magazine-popup .maz-popop-close {
    position: absolute;
    left: 0;
    right: 0;
    top: -24px;
    width: 47px;
    height: 47px;
    border-radius: 23.5px;
    background: #fff;
    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    z-index: 1;
}

    .magazine-popup .maz-popop-close img {
        transition: all 0.5s ease;
    }

    .magazine-popup .maz-popop-close:hover img {
        transition: all 0.5s ease;
        transform: rotate(90deg);
    }

    .maz-list a.border-btn img, .magazine-popup .maz-popop-close img {
        margin: auto;
    }
/*magazine popuop end*/
.top-bar .expo-link {
    display: none;
}

.podcasts ul > li a {
    overflow: hidden;
    border-radius: 5px;
    display: flex;
    flex-wrap: wrap;
}

    .podcasts ul > li a > img {
        width: 150px;
        height: 150px;
        object-fit: cover;
    }

.podcasts-inner .container {
    padding-left: 2.8%;
    padding-right: 8.2%;
}

.podcasts ul {
    list-style: none;
}

.podcast-detail {
    width: calc(100% - 140px);
    min-height: 70px;
    border-radius: 0;
    background: #f0f0f0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    padding: 10px;
    justify-content: space-between;
    position: relative;
}

    .podcast-detail > p {
        max-width: 100%;
        width: 100%;
        font-weight: normal;
        font-size: 13px;
        letter-spacing: -0.1px;
        line-height: 150%;
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 8;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

        .podcast-detail > p > span {
            display: block;
            font-size: 14px;
            margin-bottom: 10px;
            padding-left: 80px;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            width: 100%;
            line-height: 140%;
        }

    .podcast-detail > .p-time {
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        flex-wrap: wrap;
        width: 35px;
        /*width: 75px;
    */
        background: #b61932;
        color: #fff;
        font-size: 14px;
        padding: 10px 7px;
        line-height: 100%;
        justify-content: center;
        flex-direction: row-reverse;
        border-radius: 0 0 8px 0;
    }

        .podcast-detail > .p-time:hover {
            background: #000;
            transition: all 0.5s ease;
        }

        .podcast-detail > .p-time .pp-icon {
            line-height: 0;
            filter: brightness(10);
            width: 12px;
            margin-left: 0;
        }

.podcasts.podcasts-grid ul {
    margin: 20px auto;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

    .podcasts.podcasts-grid ul::after {
        display: none;
    }

    .podcasts.podcasts-grid ul > li {
        padding: 0 8px;
        width: 33.33%;
    }

.new-player-line {
    position: fixed;
    z-index: 3;
    bottom: -300px;
    width: 100%;
    left: 0;
    right: 0;
    height: 163px;
    background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.45) 100%);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding-left: 2.8%;
    padding-right: 8.2%;
    z-index: 98;
}

    .new-player-line.show-player {
        bottom: 0;
        transition: all 0.5s ease;
    }

    .new-player-line .new-player {
        position: relative;
        max-width: 80%;
        height: 110px;
        background: rgba(182, 25, 50, 0.67);
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: flex-end;
        padding: 10px 10px;
        border-radius: 6px;
    }

.new-player .podcast-duration, .new-player .podcast-action {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.new-player .podcast-action {
    flex-direction: row-reverse;
}

.new-player .podcast-img {
    line-height: 0;
    border-radius: 6px;
    overflow: hidden;
    height: 66px;
    width: 66px;
}

.new-player .podcast-action > div {
    margin-right: 25px;
    line-height: 0;
}

    .new-player .podcast-duration > span.line,
    .new-player .podcast-duration > span.share,
    .new-player .podcast-action > div.volume,
    .new-player .podcast-action > div.play-pause {
        cursor: pointer;
        width: 25px;
        height: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }

        .new-player .podcast-action > div.play-pause > span {
            position: absolute;
            opacity: 0;
            pointer-events: none;
            transition: all 0.5s ease;
        }

            .new-player .podcast-action > div.play-pause > span.play {
                opacity: 1;
                pointer-events: auto;
            }

        .new-player .podcast-action > div.play-pause.paused > span.play {
            opacity: 0;
            pointer-events: none;
        }

        .new-player .podcast-action > div.play-pause.paused > span.pause {
            opacity: 1;
            pointer-events: auto;
        }

        .new-player .podcast-duration > span.share .social-share {
            top: auto;
            width: 30px;
            bottom: 100%;
            left: 0;
            padding: 0 0 5px 0;
        }

            .new-player .podcast-duration > span.share .social-share a {
                background: rgba(182, 25, 50, 0.8);
            }

.new-player .podcast-name p {
    color: #fff;
    font-family: "Segoe UI";
    font-size: 19px;
    color: #fff;
    max-width: 250px;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.new-player .podcast-duration > span {
    margin-left: 25px;
    font-family: "Segoe UI";
    font-size: 18px;
    color: #fff;
}

.new-player .podcast-duration span.remove-player {
    width: 66px;
    height: 66px;
    border-radius: 5px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-left: 10px;
}

    .new-player .podcast-duration span.remove-player:hover {
        opacity: 0.8;
    }

.new-player-line.show-player {
    bottom: 0;
    transition: all 0.5s ease;
    height: 130px;
}

.podcast-action iframe {
    height: 66px;
    z-index: 1;
    position: absolute;
    bottom: 10px;
    left: 90px;
    width: calc(100% - 176px);
}

.podcast-action > h2 {
    position: absolute;
    top: 7px;
    right: 85px;
    color: #ffffff;
    z-index: 2;
    font-size: 17px;
    margin: 0;
}

.podcasts > .title > h2 {
    width: auto;
    position: relative;
    background: #fff;
}

    .podcasts > .title > h2 span {
        width: 54px;
        height: 54px;
        border-radius: 50px;
        background: #000;
        text-align: center;
        overflow: visible;
        margin-bottom: 15px;
        padding: 9px 7px 7px 7px;
        position: absolute;
        top: 15px;
        left: 12px;
        display: flex;
    }

.podcasts.podcasts-grid {
    margin-bottom: 50px;
}

.title-with-button {
    position: relative;
    margin-bottom: 30px;
}

    .title-with-button h2 {
        position: static;
    }

    .title-with-button .btn.more {
        position: absolute;
        top: 3px;
        left: 0;
        border-radius: 5px;
        padding: 8px 30px;
        border: 1px solid #b61932;
        background: #fff;
        color: #b61932;
    }

        .title-with-button .btn.more:hover {
            background: #b61932;
            color: #fff;
        }

.podcasts.podcasts-grid .owl-stage {
    display: flex;
    flex-wrap: nowrap;
}

    .podcasts.podcasts-grid .owl-stage .owl-item > li {
        background: #f5f5f5;
        height: 100%;
        position: relative;
        overflow: hidden;
        padding: 0;
        border-radius: 5px;
        line-height: 0;
    }

.podcasts.podcasts-grid .owl-nav > div {
    top: 50%;
}

.podcasts.podcasts-grid .owl-stage li > a.player-click {
    display: flex;
    flex-wrap: wrap;
    border-radius: 5px;
    overflow: hidden;
    height: 100%;
    flex-direction: column;
}

    .podcasts.podcasts-grid .owl-stage li > a.player-click > img {
        width: 130px;
        height: 130px;
        object-fit: cover;
        border: 1px solid #b61932;
        margin: 5px;
        border-radius: 5px;
    }

.title-withimg {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 36px;
    margin-bottom: 30px;
}

    .title-withimg > img {
        margin: 0 5px 0 0;
        width: 180px;
    }

.podcasts-inner {
    overflow: hidden;
}

.podcasts.podcasts-grid ul.owl-carousel {
    width: 100%;
    margin: 0;
    padding-left: 15%;
}

.podcasts > .owl-carousel .owl-stage-outer {
    overflow: visible;
}

.podcasts.podcasts-grid ul.owl-carousel .owl-nav {
    display: none;
}

.title-withimg.center {
    text-align: center;
    justify-content: center;
    flex-direction: column;
}

    .title-withimg.center img {
        display: block;
        width: 250px;
        margin: 0 auto;
    }

    .title-withimg.center span {
        display: block;
        font-size: 26px;
        line-height: 120%;
    }

.podcasts.podcasts-grid ul.more-podcasts {
    max-width: 1440px;
}

.new-player span.share {
    position: absolute;
    right: -109%;
    background: rgba(182, 25, 50, 0.67);
    border-radius: 0px 10px 7px 0px;
    width: 45px;
    height: 45px;
    margin: 0;
    top: -40px;
    border-radius: 0 5px 5px 0;
    padding: 18px;
}

    .new-player span.share i {
        color: #fff;
    }

.new-player .share-popup .social-share > * + * {
    margin: 5px 0 0 0;
}

.new-player .share > a {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.new-player .share-popup .social-share {
    margin-top: 5px;
}

.left-sidebar .podcasts ul > li a > img {
    width: 100%;
    height: auto;
}

.left-sidebar .podcasts ul > li a .podcast-detail {
    width: 100%;
    padding-left: 40px;
    padding-right: 10px;
}

.left-sidebar .podcast-detail > .p-time {
    background: transparent;
    top: 0;
    bottom: 0;
    height: 30px;
    padding: 0;
    width: 30px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 5px;
}

    .left-sidebar .podcast-detail > .p-time .pp-icon {
        filter: none;
        width: 15px;
    }

.left-sidebar .podcast-detail > p > span {
    padding-left: 0;
    margin-bottom: 5px;
}

.pp-time {
    font-weight: normal;
    font-size: 12px;
    text-align: left;
    color: #b3b3b3;
    display: block;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}
/*podcasts-block-sec start*/
.npodcasts-block-list ul {
    display: flex;
    flex-wrap: wrap;
    width: auto;
    margin: 0 -15px;
    list-style: none;
}

    .npodcasts-block-list ul li {
        width: calc(20% - 15px);
        margin-left: 7.5px;
        margin-right: 7.5px;
    }

.np-image-box-item {
    background-color: #f0f0f0;
    border-radius: 4px;
    height: 100%;
}

.np-image-box {
    background-color: #B61932;
    padding: 10px;
    border-radius: 4px;
    text-align: center;
    position: relative;
    width: 100%;
    display: block;
    height: 155px;
}

.np-image-box-img {
    width: 130px;
    height: 130px;
    margin: 0 auto;
}

.npodcasts-block-list .np-image-btn {
    width: 35px;
    height: 35px;
    background: #fff;
    color: #fff;
    font-size: 14px;
    padding: 10px 7px;
    justify-content: center;
    border-radius: 8px 0 8px 0 !important;
    align-items: center;
    position: absolute;
    bottom: 10px;
    right: 10px;
}

    .npodcasts-block-list .np-image-btn:hover {
        background-color: #000;
    }

.np-image-box-info h4 {
    font-size: 16px;
    margin-bottom: 6px;
}

.np-image-box-info {
    background-color: #f5f5f5;
    padding: 10px;
    border-radius: 4px;
}

.npodcasts-block-list .player-click {
    background: #f5f5f5;
    height: 100%;
    flex-direction: column;
    display: flex;
}

.np-image-box-info p {
    font-size: 14px;
    margin-bottom: 2px;
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 180%;
}

.left-sidebar .podcast-detail .date, .np-image-box-info .date {
    color: #8f8f91;
    font-weight: 400;
    display: block;
    line-height: 130%;
    padding: 1px 0;
    font-size: 13px;
}

.owl-carousel .np-image-btn img {
    width: auto !important;
}

.npodcasts-block-list .np-image-btn img {
    width: auto;
}

.np-image-box-img img {
    width: 100%;
    margin: 0 auto;
}

.success-msg {
    display: table;
    margin-top: 15px;
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
    position: relative;
    padding: .75rem 1.25rem;
    font-size: 20px;
}

.error-msg {
    display: table;
    margin-top: 15px;
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
    position: relative;
    padding: .75rem 1.25rem;
    font-size: 20px;
}
/*ramadan-popup*/
.ramadan-popup {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 999;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
}

    .ramadan-popup .ramadan-popup-wrap {
        max-width: 480px;
        min-height: 416px;
        position: relative;
        padding: 0px 35px;
        width: 100%;
        max-height: 90vh;
        overflow: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

        .ramadan-popup .ramadan-popup-wrap::-webkit-scrollbar {
            display: none;
        }

    .ramadan-popup .close {
        position: sticky;
        margin-right: -30px;
        width: 15px;
        height: 15px;
        line-height: 0;
        cursor: pointer;
        transition: all 0.5s ease;
        z-index: 1;
        top: 15px;
    }

        .ramadan-popup .close:hover {
            transition: all 0.5s ease;
            transform: rotate(180deg);
        }

.ramadan-content {
    position: relative;
    background-color: #fff;
    background-image: url(../images/ramdan-popup-bg.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 100% auto;
    padding: 30px 30px 0 30px;
}

    .ramadan-content .step-1 > div {
        text-align: center;
    }

    .ramadan-content .step-1 p {
        font-family: 'Tajawal';
        font-weight: 700;
        font-size: 16px;
        color: #231F20;
        margin-bottom: 0;
    }

    .ramadan-content .step-1 h6 {
        font-family: 'Tajawal';
        font-weight: 700;
        font-size: 20px;
        color: #231F20;
    }

    .ramadan-content .ramadan-img {
        max-width: 236px;
        width: 100%;
        line-height: 0;
        margin: 0 auto 10px auto;
        padding-top: 36.25%;
        position: relative;
    }

        .ramadan-content .ramadan-img img {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;
            object-fit: cover;
        }

        .ramadan-content .ramadan-img + p {
            font-family: 'Tajawal';
            font-weight: 400;
            font-size: 16px;
            line-height: 154.5%;
            text-align: center;
            color: #231F20;
        }

    .ramadan-content div.option-select {
        position: relative;
        margin: 15px -30px -82px -30px;
        padding: 20px 30px;
        text-align: right;
        background: linear-gradient(225deg, #FFF2EA 0%, #DAB29A 100%);
        padding-bottom: 80px;
    }

        .ramadan-content .popup-foot.step-bg-1:before, .ramadan-content .popup-foot.step-bg-2:before, .ramadan-content div.option-select::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
            opacity: 0.1;
            height: 21px;
        }

    .ramadan-content .select-checkbox {
        position: relative;
        background: #fff;
        margin-bottom: 13px;
        padding: 13px 13px;
    }

        .ramadan-content .select-checkbox label {
            font-family: 'Tajawal';
            font-weight: 400;
            font-size: 16px;
            line-height: 24px;
            text-align: right;
            color: #231F20;
            padding-right: 30px;
            position: relative;
            cursor: pointer;
            display: block;
        }

            .ramadan-popup-wrap .dont-show-checkbox label::before, .ramadan-content .select-checkbox label::before {
                content: "";
                position: absolute;
                top: 2px;
                right: 0;
                height: 20px;
                width: 20px;
                border: 1px solid #DAB29A;
                box-shadow: 0px 0px 0px 16px #fff inset;
                transition: all 0.5s ease;
            }

        .ramadan-content .select-checkbox > input {
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0;
        }

            .ramadan-popup-wrap .dont-show-checkbox > input:checked + label::before, .ramadan-content .select-checkbox > input:checked + label::before {
                box-shadow: 0px 0px 0px 4px #DAB29A inset;
                transition: all 0.5s ease;
            }

    .ramadan-content .popup-foot {
        position: relative;
        background: transparent;
        box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.15);
        margin: 0 -30px;
        padding: 20px 30px;
        text-align: center;
        z-index: 1;
    }

        .ramadan-content .popup-foot .btn {
            width: 110px;
            height: 42px;
            background: #231F20;
            font-family: 'Tajawal';
            font-style: normal;
            font-weight: 700;
            font-size: 16px;
            text-align: center;
            color: #FFFFFF;
            padding: 0;
            line-height: 42px;
        }

            .ramadan-content .popup-foot .btn:hover {
                background: #000;
            }

            .ramadan-content .popup-foot .btn img {
                margin-top: 2px;
                display: inline-block;
                vertical-align: middle;
                margin-right: 5px;
            }

            .ramadan-content .popup-foot .btn.close-click {
                display: none;
            }

    .ramadan-content .step-1 {
        display: block;
    }

    .ramadan-content .step-2 {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
        opacity: 0;
        visibility: hidden;
        z-index: -1;
        pointer-events: none;
        margin-bottom: 30px;
        transition: all 0.5s ease;
    }

    .ramadan-content h5 {
        font-family: 'Tajawal';
        font-style: normal;
        font-weight: 700;
        font-size: 25px;
        line-height: 30px;
        text-align: center;
        color: #231F20;
        margin-bottom: 30px;
    }

.info-form > .field {
    margin-bottom: 13px;
    position: relative;
}

    .info-form > .field > p {
        color: #b61932;
        font-size: 29px;
        display: block;
        position: absolute;
        top: 13px;
        left: 15px;
    }

    .info-form > .field > select, .info-form > .field > input {
        background-color: #FFFFFF;
        box-shadow: 0px 7px 7px rgba(237, 205, 186, 0.25);
        height: 50px;
        padding: 0 20px;
        width: 100%;
        border: 1px solid #DAB29A;
        margin: 0;
        font-family: 'Tajawal';
        font-weight: 400;
        font-size: 16px;
        color: rgba(0, 0, 0, 0.8);
    }

    .info-form > .field > select {
        -webkit-appearance: none;
        -moz-appearance: none;
        background-image: url("../images/drop-arrow.png");
        background-repeat: no-repeat;
        background-position: 15px 19px;
    }

        .info-form > .field > select::-ms-expand {
            display: none;
        }

.ramadan-content .step-3 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0;
    visibility: hidden;
    z-index: -1;
    pointer-events: none;
    text-align: center;
    padding: 0px 0 30px 0;
    transition: all 0.5s ease;
}

    .ramadan-content .step-3 .thankyou {
        font-family: 'Tajawal';
        font-weight: 700;
        font-size: 100px;
        line-height: 150px;
        text-align: center;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(86, 86, 86, 0.7) 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
        margin-bottom: 30px;
    }

    .ramadan-content .step-3 p {
        font-family: 'Tajawal';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        text-align: center;
        color: #231F20;
        margin-bottom: 1px;
    }

.ramadan-content .alert-message {
    margin-top: 15px;
}

    .ramadan-content .alert-message p {
        color: #b61932;
        font-size: 14px;
        text-align: center;
    }

.ramadan-popup-wrap .dont-show {
    margin-top: 20px;
}

.ramadan-popup-wrap .dont-show-checkbox {
    display: block;
    position: relative;
}

    .ramadan-popup-wrap .dont-show-checkbox input {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
    }

    .ramadan-popup-wrap .dont-show-checkbox label {
        font-family: 'Tajawal';
        font-weight: 400;
        font-size: 16px;
        line-height: 20px;
        text-align: right;
        color: #FFFFFF;
        position: relative;
        padding-right: 30px;
        display: block;
    }

.show-step-2 .step-1 {
    pointer-events: none;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    transition: all 0.5s ease;
}

.ramadan-content > div.step-1, .ramadan-content > div.step-2, .ramadan-content > div.step-3 {
    pointer-events: none;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    transition: all 0.5s ease;
}

    .ramadan-content > div.step-1.active, .ramadan-content > div.step-2.active, .ramadan-content > div.step-3.active {
        pointer-events: auto;
        z-index: 1;
        opacity: 1;
        visibility: visible;
        position: relative;
        transition: all 0.5s ease;
    }

.ramadan-content .popup-foot.step-bg-1, .ramadan-content .popup-foot.step-bg-2 {
    background: linear-gradient(225deg, #FFF2EA 0%, #DAB29A 100%);
}

    .ramadan-content .popup-foot.step-bg-2 > .next-click {
        display: none;
    }

    .ramadan-content .popup-foot.step-bg-2 > .close-click {
        display: inline-block;
        vertical-align: top;
    }

.ramadan-content .popup-foot .btn.close-click img {
    filter: invert(1) brightness(100);
}
/*ramadan-popup end*/
/* font-family: 'Tajawal';
 font-family: 'Libre Baskerville';
 font-family: 'Tajawal', sans-serif;
 */
.main-image {
    width: 100%;
    margin-bottom: 25px;
    line-height: 0;
}

    .main-image > img {
        width: 100%;
    }

@media screen and (max-width:1200px) {
    .main-image {
        margin-bottom: 10px;
    }
}

@media screen and (max-width:767px) {
    .main-image {
        width: auto;
        margin: 0 -15px 10px -15px;
    }

        .main-image > img {
            margin-bottom: 0;
        }
}