@font-face {
    font-family: DroidKufiLight;
    src: url(../fonts/droidkufi-regular.eot);
    src: url(../fonts/droidkufi-regular.eot?#iefix) format("embedded-opentype"),url(../fonts/droidkufi-regular.woff) format("woff");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: MasrawyIcons;
    src: url(../fonts/masrawyicons.eot?ref=1.1);
    src: url(../fonts/masrawyicons.eot?#iefix) format("embedded-opentype"),url(../fonts/masrawyicons.woff?ref=1.1) format("woff");
    font-weight: 400;
    font-style: normal
}

.breadcrumb li a:after, .bx-wrapper .bx-next:before, .bx-wrapper .bx-prev:before, .cd-tab-filter::after, .custom-header nav span:before, .icon-leftArr:after, .icon-more:after, .lg-actions .lg-next:before, .lg-actions .lg-prev:after, .lg-autoplay-button:after, .lg-show-autoplay .lg-autoplay-button:after, .lg-toolbar .lg-close:after, .surveyDiv .allQues .answersDiv .answerItem.selected .imgMask:after, .surveyDiv .allQues .nxtPrevDiv .btn a.next:after, .surveyDiv .allQues .nxtPrevDiv .btn a.prev:before, .ui-datepicker .ui-icon-circle-triangle-e:before, .ui-datepicker .ui-icon-circle-triangle-w:before, [class*=" icon-"]:before, [class^=icon-]:before, article .details blockquote:before {
    font-family: MasrawyIcons;
    font-style: normal;
    font-weight: 400;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1.7em
}

a, li, ul {
    text-decoration: none
}

* {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    list-style: none;
    -webkit-tap-highlight-color: transparent;
    -moz-tap-highlight-color: transparent;
    -ms-tap-highlight-color: transparent;
    -o-tap-highlight-color: transparent;
    tap-highlight-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
    appearance: none
}

.lstNwsNtfy, header {
    position: fixed;
    top: 0;
    right: 0;
    display: inline-block
}

.ui-widget-content .ui-state-default:hover, .ui-widget-content a.ui-state-active {
    background: #ddd;
    color: #1d1d1d
}

.ui-widget-content .ui-datepicker-today .ui-state-default, .ui-widget-content .ui-datepicker-today .ui-state-default:hover {
    background: #aa120d;
    color: #fff
}

.ui-widget-content .ui-state-disabled .ui-state-default {
    cursor: default !important;
    color: #ddd
}

    .ui-widget-content .ui-state-disabled .ui-state-default:hover {
        background: #fff;
        color: #ddd
    }

.lstNwsNtfy {
    width: 100%;
    height: 0;
    background: #aa120d;
    overflow: hidden;
    left: 0;
    z-index: 4;
    text-align: center;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-top-nav, body.lastNews .lstNwsNtfy, header {
    height: 50px
}

.lstNwsNtfy .cnts {
    width: calc(100% - 144px);
    margin: 0 60px 0 84px;
    display: inline-block;
    max-width: 1440px;
    padding: 8px 0
}

    .lstNwsNtfy .cnts img {
        float: right;
        margin-left: 12px;
        border: none
    }

    .lstNwsNtfy .cnts p {
        display: inline-block;
        font-family: DroidKufiLight,Arial;
        color: #fff;
        font-size: 16px;
        opacity: 0;
        transition-delay: .3s
    }

        .lstNwsNtfy .cnts p span {
            font-weight: 700;
            font-size: 18px
        }

        .lstNwsNtfy .cnts p a {
            background: #fff;
            color: #aa120d;
            padding: 5px 10px;
            line-height: 1;
            display: inline-block;
            margin-right: 5px
        }

#cd-top-nav .rightDiv date, #cd-top-nav > ul > li > a {
    font-family: DroidKufiLight,arial;
    color: #b8b8b8
}

.lstNwsNtfy .cnts .icon-notify:before {
    content: "i";
    float: right;
    margin-left: 12px;
    font-size: 22px
}

body.lastNews .lstNwsNtfy .cnts p {
    opacity: 1
}

header {
    width: 100%;
    float: right;
    z-index: 3;
    background: #1d1d1d;
    box-shadow: 0 0 1px 1px #1d1d1d;
    -webkit-transform: translateZ(0);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: .4s;
    -moz-transition-duration: .4s;
    transition-duration: .4s
}

#cd-top-nav .masLogo, #cd-top-nav .rightDiv date {
    float: right;
    opacity: 1;
    visibility: visible;
    transition: all .2s ease-in-out 0
}

#cd-top-nav {
    float: right;
    margin-right: 14px;
    display: inline-block;
    width: calc(100% - 74px)
}

    #cd-top-nav .rightDiv {
        float: right;
        display: inline-block
    }

    #cd-top-nav .masLogo {
        width: 137px;
        height: 40px;
        background: url(http://www.masrawy.com/Images/masrawyLogo.png?ver=2) center center no-repeat;
        background-size: 137px 40px;
        margin-top: 6px;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

    #cd-top-nav .rightDiv date {
        direction: rtl;
        font-size: 16px;
        margin-right: 14px;
        padding-right: 14px;
        border-right: 1px solid #474747;
        height: 50px;
        line-height: 3.4;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

    #cd-top-nav ul > li > .subMenu, .lateral-menu-is-open #cd-top-nav .masLogo, .lateral-menu-is-open #cd-top-nav date {
        visibility: hidden;
        opacity: 0
    }

    #cd-top-nav > ul {
        float: left;
        margin-left: 84px
    }

        #cd-top-nav > ul > li {
            float: right;
            width: 84px;
            height: 50px;
            border-left: 1px solid #474747;
            position: relative;
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

            #cd-top-nav > ul > li:hover {
                background: #444
            }

            #cd-top-nav > ul > li > a {
                font-size: 10px;
                display: block;
                text-align: center;
                width: 80px;
                height: 50px;
                padding-top: 5px
            }

            #cd-top-nav > ul > li:hover > a {
                color: #fff
            }

            #cd-top-nav > ul > li.thanawya, #cd-top-nav > ul > li.thanawya .firstLevel {
                width: 100px
            }

    #cd-top-nav ul li.thanawya .firstLevel .thanawyaIcon {
        background: url(http://www.masrawy.com/Images/thanawya.png) center center no-repeat;
        height: 24px
    }

    #cd-top-nav ul li .icon-newsPntr:before {
        content: "b";
        display: block;
        font-size: 24px;
        line-height: 1
    }

    #cd-top-nav ul li .icon-archive:before {
        content: "c";
        display: block;
        font-size: 20px;
        line-height: 1;
        margin: 2px 0
    }

    #cd-top-nav ul li .icon-prayerTms:before {
        content: "e";
        display: block;
        font-size: 24px;
        line-height: 1
    }

    #cd-top-nav ul li .icon-currency:before {
        content: "d";
        display: block;
        font-size: 24px;
        line-height: 1
    }

    #cd-top-nav ul li .icon-gold:before {
        content: "2";
        display: block;
        font-size: 24px;
        line-height: 1
    }

    #cd-top-nav ul li .icon-weather:before {
        content: "J";
        display: block;
        font-size: 24px;
        line-height: 1
    }

    #cd-top-nav ul li .icon-ads:before {
        content: "n";
        display: block;
        font-size: 24px;
        line-height: 1
    }

    #cd-top-nav ul li > .icon-search:before {
        content: "f";
        display: block;
        font-size: 22px;
        line-height: 1;
        margin: 1px 0
    }

    #cd-top-nav ul li .weather > span {
        font-family: Arial;
        font-size: 20px;
        font-weight: 700;
        margin-right: 14px;
        line-height: 2.2;
        position: relative
    }

    #cd-top-nav ul li .weather > .icon-temp:before {
        content: "H";
        font-size: 8px;
        position: absolute;
        right: -5px;
        top: 5px
    }

    #cd-top-nav ul > li > .subMenu {
        background: #444;
        width: 252px;
        height: 0;
        position: absolute;
        right: -1px;
        top: 50px;
        z-index: 999;
        overflow: hidden;
        padding: 12px;
        -moz-transition: all .2s ease-in-out 0;
        -webkit-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0;
        transition: all .2s ease-in-out 0
    }

.morphSearchDiv, .morphsearch {
    -webkit-transition: all .5s ease-in-out 0;
    left: 0
}

#cd-top-nav ul > li:hover > .subMenu {
    z-index: 9999;
    visibility: visible;
    opacity: 1;
    transition-delay: 0;
    height: 278px;
    overflow: visible
}

#cd-top-nav ul > li:first-child > .subMenu {
    right: 0
}

#cd-top-nav ul .subMenu .more {
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 40px;
    background: #333;
    font-family: DroidKufiLight,Arial;
    font-size: 14px;
    text-align: center;
    color: #fff;
    float: right;
    line-height: 2.8
}

#cd-top-nav ul .subMenu .icon-more:after {
    content: "q";
    margin-right: 12px;
    font-size: 10px
}

#cd-top-nav ul .subMenu .more:hover {
    background: #1d1d1d
}

#cd-top-nav ul .subMenu.thanawya .thanawyaCnts {
    display: inline-block;
    width: 100%;
    background: 0 0;
    margin-bottom: 0;
    box-shadow: none
}

    #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts {
        display: inline-block;
        width: 100%;
        margin: 12px 0 0;
        font-family: DroidKufiLight,Arial;
        font-size: 20px;
        color: #fff;
        text-align: center
    }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.comingSoon p {
            width: 100%;
            display: block;
            font-family: DroidKufiLight,Arial;
            font-size: 26px;
            color: #fff;
            text-align: center;
            line-height: 2;
            margin-top: 30px
        }

            #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.comingSoon p span {
                display: block;
                font-family: DroidKufiBold,Arial;
                color: #e63b34;
                font-size: 36px
            }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .ttl {
            display: none
        }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .labelDiv {
            float: right;
            width: 100%
        }

            #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .labelDiv label {
                font-family: DroidKufiLight,Arial;
                font-size: 16px;
                color: #fff;
                direction: rtl;
                text-align: right;
                float: right;
                margin-bottom: 5px
            }

            #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .labelDiv span {
                color: #e63b34;
                float: right;
                margin-right: 2px;
                line-height: 1.5
            }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber input {
            width: 100%;
            height: 40px !important;
            border: 1px solid #ddd;
            float: right;
            outline: 0;
            padding: 12px;
            font-family: DroidKufiLight,Arial;
            color: #888;
            font-size: 14px
        }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .errorMsg {
            position: relative;
            float: right;
            right: 0;
            display: inline-block;
            font-family: DroidKufiLight,Arial;
            font-size: 12px;
            color: #aaa;
            direction: rtl;
            text-align: right;
            visibility: hidden;
            margin-top: 5px
        }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber a {
            display: inline-block;
            width: 132px;
            font-family: DroidKufiLight,Arial;
            background: #e63b34;
            color: #fff;
            font-size: 16px;
            text-align: center;
            padding: 5px 0;
            margin: 5px
        }

            #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber a:hover {
                background: #aa120d
            }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .thanawyaSponsor {
            display: inline-block;
            width: 100%
        }

            #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .thanawyaSponsor .cnts {
                display: inline-block;
                width: 166px;
                margin: 0;
                float: right;
                padding: 8px 0
            }

                #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .thanawyaSponsor .cnts .spnsr {
                    float: right;
                    margin-left: 24px;
                    margin-top: 4px;
                    font-family: DroidKufiLight,Arial;
                    color: #fff;
                    font-size: 14px
                }

                #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .thanawyaSponsor .cnts a {
                    float: right;
                    width: auto;
                    background: 0 0;
                    color: none;
                    padding: 0;
                    margin: 0
                }

                #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.seatNumber .thanawyaSponsor .cnts img {
                    width: auto;
                    height: 27px;
                    border: none
                }

        #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.comingSoon .thanawyaSponsor {
            display: inline-block;
            width: 100%
        }

            #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.comingSoon .thanawyaSponsor .cnts {
                display: inline-block;
                width: 166px;
                margin: 0;
                float: right;
                padding: 8px 0
            }

                #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.comingSoon .thanawyaSponsor .cnts .spnsr {
                    float: right;
                    margin-left: 24px;
                    margin-top: 4px;
                    font-family: DroidKufiLight,Arial;
                    color: #fff;
                    font-size: 14px
                }

                #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.comingSoon .thanawyaSponsor .cnts a {
                    float: right;
                    width: auto;
                    background: 0 0;
                    color: none;
                    padding: 0;
                    margin: 0
                }

                #cd-top-nav ul .subMenu.thanawya .thanawyaCnts .cnts.comingSoon .thanawyaSponsor .cnts img {
                    width: auto;
                    height: 27px;
                    border: none
                }

#cd-top-nav ul .subMenu.newsPntr ul {
    display: inline-block;
    width: 100%;
    height: 254px
}

    #cd-top-nav ul .subMenu.newsPntr ul li {
        display: inline-block;
        width: 100%;
        height: 76px;
        border-bottom: 1px solid #555;
        float: right
    }

        #cd-top-nav ul .subMenu.newsPntr ul li:last-child {
            border-bottom: none
        }

        #cd-top-nav ul .subMenu.newsPntr ul li .trendDiv {
            float: right;
            width: 40px;
            height: 60px;
            border: 1px solid #aaa;
            display: inline-block;
            margin: 8px 0 0 12px
        }

            #cd-top-nav ul .subMenu.newsPntr ul li .trendDiv .trendImg {
                width: 38px;
                height: 29px;
                display: block;
                text-align: center
            }

                #cd-top-nav ul .subMenu.newsPntr ul li .trendDiv .trendImg img {
                    width: 18px;
                    height: 18px;
                    border: none;
                    margin-top: 5px
                }

.morphsearch-input, .openSearch .morphsearch.open .morphsearch-input:focus {
    border: none !important
}

#cd-top-nav ul .subMenu.newsPntr ul li .trendDiv .vstrs {
    text-align: center;
    background: #aaa;
    width: 38px;
    height: 29px;
    font-family: Arial;
    color: #1d1d1d;
    font-size: 12px;
    line-height: 2.8
}

#cd-top-nav ul .subMenu.newsPntr ul li .news {
    float: right;
    display: block;
    font-family: DroidKufiLight,arial;
    color: #fff;
    font-size: 13px;
    width: calc(100% - 52px);
    padding: 0;
    text-align: right;
    height: 66px;
    overflow: hidden;
    margin-top: 5px;
    line-height: 1.7
}

#cd-top-nav ul .subMenu.prayerTms .cnts, #cd-top-nav ul .subMenu.prayerTms .cnts .cntdwn, #cd-top-nav ul .subMenu.prayerTms .cnts .timerDiv, #cd-top-nav ul .subMenu.prayerTms .cnts date, #cd-top-nav ul .subMenu.prayerTms .cnts p {
    display: inline-block;
    width: 100%
}

#cd-top-nav ul .subMenu.newsPntr ul li .news:hover {
    color: #aaa
}

#cd-top-nav ul > li:hover > .subMenu.archive {
    height: auto
}

#cd-top-nav ul .subMenu.archive .ui-datepicker {
    width: 228px;
    height: auto;
    box-shadow: none
}

#cd-top-nav ul .subMenu.prayerTms .cnts {
    height: 254px;
    background: 0 0;
    margin-bottom: 0;
    box-shadow: none
}

    #cd-top-nav ul .subMenu.prayerTms .cnts date {
        color: #fff;
        margin: 12px 0;
        font-family: DroidKufiLight,arial;
        font-size: 13px
    }

    #cd-top-nav ul .subMenu.prayerTms .cnts .location {
        display: inline-block;
        width: 100%;
        margin-bottom: 12px;
        color: #fff;
        font-size: 30px
    }

    #cd-top-nav ul .subMenu.prayerTms .cnts p {
        color: #aaa;
        font-family: DroidKufiLight,arial;
        font-size: 16px;
        margin: 0 0 12px;
        text-align: center
    }

    #cd-top-nav ul .subMenu.prayerTms .cnts .timerDiv ul {
        display: inline-block;
        width: 100%;
        margin: 0 auto
    }

        #cd-top-nav ul .subMenu.prayerTms .cnts .timerDiv ul li {
            float: left;
            width: 60px;
            height: 50px;
            text-align: center;
            color: #fff;
            font-family: Arial;
            font-size: 32px;
            position: relative;
            background: #4e4e4e;
            margin-right: 24px;
            line-height: 1.5
        }

            #cd-top-nav ul .subMenu.prayerTms .cnts .timerDiv ul li:last-child {
                margin-right: 0
            }

            #cd-top-nav ul .subMenu.prayerTms .cnts .timerDiv ul li:nth-child(1):after, #cd-top-nav ul .subMenu.prayerTms .cnts .timerDiv ul li:nth-child(2):after {
                content: ":";
                background: rgba(0,0,0,0);
                color: #fff;
                display: block;
                font-size: 28px;
                position: absolute;
                top: 3px;
                right: -16px
            }

#cd-top-nav ul .subMenu.weather .wtrCnts {
    display: inline-block;
    width: 100%;
    height: 254px;
    background: 0 0;
    margin-bottom: 0;
    box-shadow: none
}

    #cd-top-nav ul .subMenu.weather .wtrCnts .location {
        display: inline-block;
        width: 100%;
        color: #fff;
        font-size: 30px;
        margin: 0 0 12px;
        text-align: right;
        font-family: DroidKufiLight,arial
    }

    #cd-top-nav ul .subMenu.weather .wtrCnts .cntdwn, #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls {
        display: inline-block;
        width: 100%
    }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon {
            float: right;
            width: 70px;
            height: 70px;
            margin-left: 24px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .highTemp {
            float: right;
            position: relative;
            margin-left: 10px;
            width: 62px;
            height: 70px;
            text-align: center;
            font-family: arial;
            font-size: 48px;
            color: #fff;
            line-height: 1.8
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .icon-high:before {
            content: "H";
            font-size: 14px;
            position: absolute;
            right: -5px;
            top: 5px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .lowTemp {
            float: right;
            position: relative;
            width: 62px;
            height: 70px;
            text-align: center;
            font-family: arial;
            font-size: 32px;
            color: #aaa;
            line-height: 2.8
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .icon-low:before {
            content: "H";
            font-size: 10px;
            position: absolute;
            right: 6px;
            top: 18px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.sunny {
            background: url(http://www.masrawy.com/images/weatherSprite.png) no-repeat;
            height: 70px;
            margin: 2px 0 12px 24px;
            background-size: 70px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.cloudy {
            background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -68px no-repeat;
            height: 46px;
            margin: 8px 0 18px 24px;
            background-size: 70px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.partlycloudy {
            background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -124px no-repeat;
            height: 52px;
            margin: 5px 0 15px 24px;
            background-size: 70px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.patchylightdrizzle {
            background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -184px no-repeat;
            height: 62px;
            margin: 0 0 10px 24px;
            background-size: 70px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.lightdrizzle {
            background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -256px no-repeat;
            height: 48px;
            margin: 7px 0 17px 24px;
            background-size: 70px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.lightrainshower, #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.lightsleetshowers {
            background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -184px no-repeat;
            height: 62px;
            margin: 0 0 10px 24px;
            background-size: 70px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.patchylightrain {
            background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -256px no-repeat;
            height: 48px;
            margin: 7px 0 17px 24px;
            background-size: 70px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .weatherDtls .weatherIcon.patchyrainnearby {
            background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -184px no-repeat;
            height: 62px;
            margin: 0 0 10px 24px;
            background-size: 70px
        }

    #cd-top-nav ul .subMenu.weather .wtrCnts .windHum {
        display: inline-block;
        width: 100%;
        margin-top: 5px
    }

        #cd-top-nav ul .subMenu.weather .wtrCnts .windHum > div {
            width: 100%;
            float: right;
            font-family: DroidKufiLight,Arial;
            color: #aaa;
            font-size: 13px;
            display: inline-block
        }

            #cd-top-nav ul .subMenu.weather .wtrCnts .windHum > div span {
                color: #fff
            }

        #cd-top-nav ul .subMenu.weather .wtrCnts .windHum .hum {
            margin-bottom: 2px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .windHum .icon-hum:before {
            content: "K";
            float: right;
            margin-left: 5px;
            font-size: 16px
        }

        #cd-top-nav ul .subMenu.weather .wtrCnts .windHum .icon-wind:before {
            content: "L";
            float: right;
            margin-left: 5px;
            font-size: 16px
        }

.morphsearch-form.icon-search:before, .morphsearch-submit.icon-search:before {
    content: "f";
    line-height: 1;
    pointer-events: none
}

#cd-top-nav ul .subMenu.currency .currCnts {
    display: inline-block;
    width: 100%;
    background: 0 0;
    margin-bottom: 0;
    box-shadow: none;
    height: 254px
}

    #cd-top-nav ul .subMenu.currency .currCnts p {
        display: inline-block;
        width: 100%;
        margin: 12px 0 0;
        font-family: DroidKufiLight,Arial;
        font-size: 20px;
        color: #fff;
        text-align: center
    }

        #cd-top-nav ul .subMenu.currency .currCnts p:nth-child(2) {
            color: #aaa;
            font-size: 14px;
            margin: 12px 0
        }

    #cd-top-nav ul .subMenu.currency .currCnts .number {
        display: inline-block;
        width: 100%;
        text-align: center;
        font-family: Arial;
        font-size: 62px;
        color: #fff;
        margin-top: 24px
    }

        #cd-top-nav ul .subMenu.currency .currCnts .number span {
            margin-left: 10px;
            font-size: 24px;
            color: #aaa
        }

#cd-top-nav ul .subMenu.gold .goldCnts {
    display: inline-block;
    width: 100%;
    background: 0 0;
    margin-bottom: 0;
    box-shadow: none
}

    #cd-top-nav ul .subMenu.gold .goldCnts p {
        display: inline-block;
        width: 100%;
        margin: 12px 0 0;
        font-family: DroidKufiLight,Arial;
        font-size: 20px;
        color: #fff;
        text-align: center
    }

        #cd-top-nav ul .subMenu.gold .goldCnts p:nth-child(2) {
            color: #aaa;
            font-size: 14px;
            margin: 12px 0
        }

    #cd-top-nav ul .subMenu.gold .goldCnts .number {
        display: inline-block;
        width: 100%;
        text-align: center;
        font-family: Arial;
        font-size: 62px;
        color: #fff;
        margin-top: 24px
    }

        #cd-top-nav ul .subMenu.gold .goldCnts .number span {
            margin-left: 10px;
            font-size: 24px;
            color: #aaa
        }

.morphSearchDiv {
    position: fixed;
    width: 84px;
    height: 50px;
    display: inline-block;
    top: 0;
    z-index: 3;
    background: 0 0;
    transition: all .5s ease-in-out 0;
    overflow: hidden
}

.openSearch .morphSearchDiv {
    width: 100%;
    height: 100%;
    box-shadow: none !important
}

.morphsearch {
    width: 84px;
    min-height: 50px;
    background: #1d1d1d;
    position: absolute;
    z-index: 10000;
    top: 0;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    transition: all .5s ease-in-out 0
}

.openSearch .morphsearch.open {
    width: 100%;
    min-height: 100%;
    top: 0;
    left: 0;
    background: #fff
}

.morphsearch-form {
    width: 100%;
    height: 50px;
    margin: 0 auto;
    position: relative;
    -webkit-transition: all .5s ease-in-out 0;
    transition: all .5s ease-in-out 0
}

    .morphsearch-form.icon-search:before {
        display: block;
        font-size: 22px;
        color: #b8b8b8;
        position: absolute;
        right: 50%;
        margin: 6px -11px 0 0;
        visibility: visible;
        opacity: 1;
        -webkit-transition: all .5s ease-in-out 0;
        transition: all .5s ease-in-out 0
    }

.openSearch .morphsearch.open .morphsearch-form {
    width: 80%;
    height: 160px;
    -webkit-transform: translate3d(0,3em,0);
    transform: translate3d(0,3em,0)
}

    .openSearch .morphsearch.open .morphsearch-form.icon-search:before {
        visibility: hidden;
        opacity: 0
    }

.morphsearch-input {
    width: 100%;
    height: 100%;
    padding: 28px 28px 0 20px;
    text-align: right;
    cursor: pointer;
    background: 0 0;
    font-family: DroidKufiBold,Arial;
    font-size: 10px;
    color: #b8b8b8;
    -webkit-transition: all .5s ease-in-out 0;
    transition: all .5s ease-in-out 0
}

    .morphsearch-input::-ms-clear {
        display: none
    }

.morphsearch.hideInput .morphsearch-input {
    color: transparent;
    -webkit-transition: all .5s ease-in-out 0;
    transition: all .5s ease-in-out 0
}

.openSearch .morphsearch.open .morphsearch-input {
    font-size: 3em;
    text-align: right;
    cursor: text;
    padding: 0
}

    .openSearch .morphsearch.open .morphsearch-input:focus img, .openSearch .morphsearch.open .morphsearch-input:hover img {
        display: none
    }

input[type=search]::-webkit-search-cancel-button {
    display: none
}

.morphsearch-input::-webkit-input-placeholder {
    color: #c2c2c2
}

.morphsearch-input:-moz-placeholder {
    color: #c2c2c2
}

.morphsearch-input::-moz-placeholder {
    color: #c2c2c2
}

.morphsearch-input:-ms-input-placeholder {
    color: #c2c2c2
}

.gn-search:focus::-webkit-input-placeholder {
    color: transparent
}

input[type=search] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.morphsearch-input:focus, .morphsearch-submit:focus {
    outline: 0
}

.morphsearch-submit.icon-search:before {
    color: #ddd;
    font-size: 68px;
    position: absolute;
    width: 80px;
    height: 80px;
    overflow: hidden;
    left: 0;
    top: 50%;
    border: none;
    transform-origin: 50% 50%;
    opacity: 0;
    -webkit-transform: translate3d(-30px,-50%,0) scale3d(0,0,1);
    transform: translate3d(-30px,-50%,0) scale3d(0,0,1)
}

.openSearch .morphsearch.open .morphsearch-submit.icon-search:before {
    pointer-events: auto;
    opacity: 1;
    -webkit-transform: translate3d(-30px,-50%,0) scale3d(1,1,1);
    transform: translate3d(-30px,-50%,0) scale3d(1,1,1);
    -webkit-transition: all .5s ease-in-out 0;
    transition: all .5s ease-in-out 0
}

.morphsearch-close, .ps-container.ps-in-scrolling, .ps-container:hover.ps-in-scrolling {
    pointer-events: none
}

.morphsearch-submit.icon-search:hover:before {
    color: #b8b8b8
}

.morphsearch-close {
    width: 36px;
    height: 36px;
    position: absolute;
    left: 1em;
    top: 1em;
    overflow: hidden;
    text-indent: 100%;
    cursor: pointer;
    opacity: 0;
    -webkit-transform: scale3d(0,0,1);
    transform: scale3d(0,0,1)
}

.openSearch .morphsearch.open .morphsearch-close {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
    -webkit-transition: all .3s ease-in-out 0;
    transition: all .3s ease-in-out 0
}

.morphsearch-close::after, .morphsearch-close::before {
    content: '';
    position: absolute;
    width: 2px;
    height: 100%;
    top: 0;
    left: 50%;
    border-radius: 3px;
    opacity: .2;
    background: #1d1d1d;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

.morphsearch-close:hover.morphsearch-close::after, .morphsearch-close:hover.morphsearch-close::before {
    opacity: 1
}

.morphsearch-close::before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.morphsearch-close::after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.morphsearch-content {
    color: #333;
    margin-top: 4.5em;
    width: 100%;
    height: 0;
    overflow: hidden;
    padding: 0 10.5%;
    background: #fff;
    position: absolute;
    opacity: 0
}

.openSearch .morphsearch.open .morphsearch-content {
    opacity: 1;
    height: auto;
    overflow: visible;
    -webkit-transition: all .3s ease-in-out .5s;
    transition: all .3s ease-in-out .5s
}

.morphsearch-content h2 {
    float: right;
    display: block;
    font-family: DroidKufiBold,Arial;
    font-size: 32px;
    color: #1d1d1d;
    margin-bottom: 24px
}

.morphsearch-content .keywordsDiv {
    display: inline-block;
    width: 100%
}

    .morphsearch-content .keywordsDiv .item {
        float: right;
        padding: 4px 30px;
        background: #eee;
        margin: 0 0 24px 24px;
        font-family: DroidKufiLight,Arial;
        font-size: 18px;
        color: #1d1d1d
    }

        .morphsearch-content .keywordsDiv .item:hover {
            background: #e2e2e2
        }

.overflow-hidden.openSearch .openSearch .morphsearch.open {
    width: calc(100% - 320px)
}

@media screen and (max-width:53.125em) {
    .openSearch .morphsearch.open .morphsearch-input {
        font-size: 2em
    }
}

#cd-lateral-nav .masLogo {
    display: inline-block;
    width: 150px;
    height: 44px;
    background: url(http://www.masrawy.com/Images/masrawyLogo.png?ver=2) center center no-repeat;
    background-size: 150px 44px;
    margin: 10px
}

.cd-img-replace {
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap
}

.overflow-hidden {
    overflow: hidden;
    margin-right: 17px;
    width: calc(100% - 17px)
}

.cd-main-content {
    background: #d8d8d8;
    min-height: 100%;
    position: relative;
    z-index: 2;
    width: 100%;
    display: inline-block;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: .4s;
    -moz-transition-duration: .4s;
    transition-duration: .4s
}

    .cd-main-content.lateral-menu-is-open, header.lateral-menu-is-open {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

header.is-fixed {
    position: fixed
}

header.lateral-menu-is-open #cd-menu-trigger {
    -webkit-transform: translateX(-320px);
    -moz-transform: translateX(-320px);
    -ms-transform: translateX(-320px);
    -o-transform: translateX(-320px);
    transform: translateX(-320px);
    visibility: visible;
    -webkit-transition: -webkit-transform .4s 0s,visibility 0 0;
    -moz-transition: -moz-transform .4s 0s,visibility 0 0;
    transition: transform .4s 0s,visibility 0 0;
    -webkit-overflow-scrolling: touch
}

#cd-menu-trigger {
    position: relative;
    right: 0;
    top: 0;
    height: 100%;
    width: 60px;
    background-color: #aa120d;
    float: right;
    -webkit-transform: translateZ(0);
    -webkit-transition: -webkit-transform .4s 0s,visibility 0 .4s;
    -moz-transition: -moz-transform .4s 0s,visibility 0 .4s;
    transition: transform .4s 0s,visibility 0 .4s;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}

    #cd-menu-trigger .cd-menu-icon {
        display: inline-block;
        position: absolute;
        left: 50%;
        top: 50%;
        bottom: auto;
        right: auto;
        width: 30px;
        height: 3px;
        background-color: #FFF;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -moz-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
        -o-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%)
    }

        #cd-menu-trigger .cd-menu-icon::before, #cd-menu-trigger .cd-menu-icon:after {
            content: '';
            width: 100%;
            height: 100%;
            position: absolute;
            background-color: inherit;
            left: 0
        }

        #cd-menu-trigger .cd-menu-icon::before {
            bottom: 8px
        }

        #cd-menu-trigger .cd-menu-icon::after {
            top: 8px
        }

    #cd-menu-trigger.is-clicked .cd-menu-icon {
        background-color: rgba(255,255,255,0)
    }

        #cd-menu-trigger.is-clicked .cd-menu-icon::after, #cd-menu-trigger.is-clicked .cd-menu-icon::before {
            background-color: #fff
        }

        #cd-menu-trigger.is-clicked .cd-menu-icon::before {
            bottom: 0;
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        #cd-menu-trigger.is-clicked .cd-menu-icon::after {
            top: 0;
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            transform: rotate(-45deg)
        }

#cd-lateral-nav {
    position: fixed;
    height: 100%;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 3;
    width: 320px;
    background-color: #1d1d1d;
    -webkit-transform: translateZ(0);
    -webkit-transition: -webkit-transform .4s 0s,visibility 0 .4s;
    -moz-transition: -moz-transform .4s 0s,visibility 0 .4s;
    transition: transform .4s 0s,visibility 0 .4s;
    -webkit-transform: translateX(320px);
    -moz-transform: translateX(320px);
    -ms-transform: translateX(320px);
    -o-transform: translateX(320px);
    transform: translateX(320px)
}

#cd-menu-trigger .notify {
    position: absolute;
    top: 5px;
    left: -10px;
    width: 20px;
    height: 20px;
    background: red;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    font-family: Arial;
    font-size: 14px;
    line-height: 1.5
}

#cd-lateral-nav .scroll {
    width: 320px;
    height: 100%;
    overflow-y: scroll;
    margin: 0;
    mix-blend-mode: multiply;
    background: #1d1d1d
}

.scrollContainer {
    width: 320px;
    height: calc(100% - 88px);
    margin: 0;
    overflow: auto;
    position: absolute;
    top: 0;
    right: 0;
    background: url(http://www.masrawy.com/Images/scrollBarBg.jpg) left top repeat-y #fff;
    background-size: 17px
}

@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none) {
    .ps-container {
        overflow: auto !important
    }
}

.scrollContainer .scroll {
    width: 310px;
    height: 100%;
    margin: 0
}

.ps-container.ps-active-y > .ps-scrollbar-x-rail {
    display: none
}

.ps-container.ps-active-y > .ps-scrollbar-y-rail {
    display: block;
    background-color: transparent
}

.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
    background-color: #1d1d1d;
    opacity: .9
}

    .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
        background-color: #444
    }

.ps-container > .ps-scrollbar-y-rail {
    display: none;
    position: absolute;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    opacity: 0;
    -webkit-transition: background-color .2s linear,opacity .2s linear;
    -moz-transition: background-color .2s linear,opacity .2s linear;
    -o-transition: background-color .2s linear,opacity .2s linear;
    transition: background-color .2s linear,opacity .2s linear;
    right: 3px;
    width: 6px
}

    .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
        position: absolute;
        background-color: #444;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        -webkit-transition: background-color .2s linear;
        -moz-transition: background-color .2s linear;
        -o-transition: background-color .2s linear;
        transition: background-color .2s linear;
        right: 0;
        width: 6px
    }

.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
    background-color: #1d1d1d;
    opacity: .9
}

    .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
        background-color: #444
    }

.ps-container:hover > .ps-scrollbar-y-rail {
    opacity: .6
}

    .ps-container:hover > .ps-scrollbar-y-rail:hover {
        background-color: #1d1d1d;
        opacity: .9
    }

        .ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
            background-color: #444
        }

#show-result #content {
    -moz-transition: opacity .1s;
    -webkit-transition: opacity .1s;
    -o-transition: opacity .1s;
    -ms-transition: opacity .1s;
    transition: opacity .1s;
    opacity: 0
}

#branding, #branding .changelog-badge, #content, #header, .abuseDetected {
    position: relative;
    height: 100%
}

#cd-lateral-nav .cd-navigation {
    margin: 0 0 24px;
    display: inline-block;
    width: 100%
}

#cd-lateral-nav .sub-menu {
    padding: 0 10px 20px 15px;
    display: none;
    font-family: DroidKufiLight,arial;
    font-size: 14px
}

#cd-lateral-nav a {
    display: block;
    line-height: 3.6em;
    padding: 0 10px;
    color: #fff;
    font-family: DroidKufiLight,Arial;
    font-size: 16px
}

#cd-lateral-nav .sub-menu a {
    line-height: 50px
}

#cd-lateral-nav li .sub-menu li.selected a {
    color: #fff;
    background: 0 0
}

#cd-lateral-nav li:hover .sub-menu a {
    background: 0 0
}

#cd-lateral-nav .item-has-children .sub-menu li a {
    color: #888;
    font-size: 14px
}

    #cd-lateral-nav .item-has-children .sub-menu li a:hover {
        color: #fff
    }

#cd-lateral-nav.lateral-menu-is-open {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    visibility: visible;
    -webkit-transition: -webkit-transform .4s 0s,visibility 0 0;
    -moz-transition: -moz-transform .4s 0s,visibility 0 0;
    transition: transform .4s 0s,visibility 0 0;
    -webkit-overflow-scrolling: touch
}

#cd-lateral-nav li {
    margin: 0 10px 0 5px
}

#cd-lateral-nav .sub-menu li {
    border-bottom: none;
    margin: 0
}

#cd-lateral-nav li > a {
    position: relative;
    font-family: DroidKufiLight,arial;
    height: 60px;
    font-size: 16px;
    color: #fff;
    overflow: hidden;
    border-bottom: 1px solid #333;
    text-align: right
}

#cd-lateral-nav li.selected > a, #cd-lateral-nav li:hover > a {
    background: #333
}

#cd-lateral-nav .item-has-children > .icon-leftArr:after {
    content: "q";
    position: absolute;
    left: 10px;
    top: 16px;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-lateral-nav .item-has-children > .icon-leftArr.submenu-open:after {
    transform: rotate(-90deg)
}

#cd-lateral-nav .item-has-children .icon-news:before {
    content: "g";
    float: right;
    margin-left: 8px;
    font-size: 22px;
    line-height: 2.8
}

#cd-lateral-nav .item-has-children .icon-sports:before {
    content: "Z";
    float: right;
    margin-left: 10px;
    font-size: 22px;
    line-height: 2.8
}

#cd-lateral-nav .item-has-children .icon-howa_w_hya:before {
    content: "V";
    float: right;
    margin-left: 10px;
    font-size: 20px;
    line-height: 2.9
}

#cd-lateral-nav .item-has-children .icon-arts:before {
    content: "X";
    float: right;
    margin-left: 9px;
    font-size: 22px;
    line-height: 2.73
}

#cd-lateral-nav .item-has-children .icon-autos:before {
    content: "l";
    float: right;
    margin-left: 10px;
    font-size: 18px;
    line-height: 3.3
}

#cd-lateral-nav .item-has-children .icon-islameyat:before {
    content: "T";
    float: right;
    margin-left: 8px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .icon-economy:before {
    content: "U";
    float: right;
    margin-left: 9px;
    font-size: 20px;
    line-height: 2.95
}

#cd-lateral-nav .icon-reports:before {
    content: "W";
    float: right;
    margin-left: 10px;
    font-size: 20px;
    line-height: 2.95
}

#cd-lateral-nav .icon-media:before {
    content: "j";
    float: right;
    margin-left: 10px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .icon-technology:before {
    content: "0";
    float: right;
    margin-left: 10px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .icon-service:before {
    content: "1";
    float: right;
    margin-left: 10px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .cd-navigation .icon-newspntr:before {
    content: "b";
    float: right;
    margin-left: 8px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .cd-navigation .icon-archive:before {
    content: "c";
    float: right;
    margin-left: 10px;
    font-size: 18px;
    line-height: 3.2
}

#cd-lateral-nav .cd-navigation .icon-prayertms:before {
    content: "e";
    float: right;
    margin-left: 8px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .cd-navigation .icon-weather:before {
    content: "J";
    float: right;
    margin-left: 8px;
    font-size: 20px;
    line-height: 2.6
}

#cd-lateral-nav .cd-navigation .icon-currency:before {
    content: "d";
    float: right;
    margin-left: 8px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .cd-navigation .icon-gold:before {
    content: "2";
    float: right;
    margin-left: 8px;
    font-size: 20px;
    line-height: 2.8
}

#cd-lateral-nav .cd-navigation .icon-ads:before {
    content: "n";
    float: right;
    margin-left: 6px;
    font-size: 22px;
    line-height: 2.6
}

#cd-lateral-nav .cd-navigation .icon-ramadan:before {
    content: "Y";
    float: right;
    margin-left: 6px;
    font-size: 22px;
    line-height: 2.7
}

#cd-lateral-nav .cd-navigation .icon-thanawya:before {
    content: "6";
    float: right;
    margin-left: 6px;
    font-size: 22px;
    line-height: 2.7
}

#cd-lateral-nav .cd-navigation .icon-aqar:before {
    content: "m";
    float: right;
    margin-left: 6px;
    font-size: 22px;
    line-height: 2.7
}

#cd-lateral-nav .linksMenu {
    width: 234px;
    margin: 12px;
    display: none
}

    #cd-lateral-nav .linksMenu a {
        display: inline-block;
        font-size: 12px;
        color: #fff;
        float: right;
        margin-left: 20px;
        font-family: DroidKufiLight,arial;
        padding: 0;
        line-height: 1
    }

.sponsorBanner p, .sponsorBtnText {
    text-align: center;
    font-family: DroidKufiBold,Arial
}

#cd-lateral-nav .linksMenu a:last-child {
    margin-left: 0
}

#cd-lateral-nav .linksMenu a:hover {
    color: #888
}

#cd-lateral-nav .socialDiv {
    width: 248px;
    height: 40px;
    margin: 0;
    display: inline-block
}

    #cd-lateral-nav .socialDiv a {
        width: 40px;
        height: 40px;
        display: inline-block;
        font-size: 24px;
        color: #fff;
        text-align: center;
        background: #2d2d2d;
        float: right;
        margin-left: 12px;
        border-radius: 50%;
        padding: 0;
        line-height: 0
    }

        #cd-lateral-nav .socialDiv a:last-child {
            margin-left: 0
        }

        #cd-lateral-nav .socialDiv a:hover {
            color: #fff
        }

#cd-lateral-nav .icon-fb:before {
    content: "u"
}

#cd-lateral-nav .icon-fb:hover {
    background: #3c5899
}

#cd-lateral-nav .icon-tw:before {
    content: "v"
}

#cd-lateral-nav .icon-tw:hover {
    background: #229ff3
}

#cd-lateral-nav .icon-ggl:before {
    content: "w"
}

#cd-lateral-nav .icon-ggl:hover {
    background: #d65142
}

#cd-lateral-nav .icon-yt:before {
    content: "x"
}

#cd-lateral-nav .icon-yt:hover {
    background: #e62117
}

#cd-lateral-nav .icon-rss:before {
    content: "A"
}

#cd-lateral-nav .icon-rss:hover {
    background: #ffaf5c
}

.overlay {
    position: absolute;
    left: 0;
    top: 0;
    background: #000;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    z-index: 1;
    transition: all .4s ease-in-out 0;
    -webkit-transition: all .4s ease-in-out 0;
    -moz-transition: all .4s ease-in-out 0;
    -ms-transition: all .4s ease-in-out 0;
    -o-transition: all .4s ease-in-out 0
}

.content, .content-wrap {
    position: relative;
    background: #f2f2f2;
    display: inline-block
}

.overflow-hidden .overlay {
    visibility: visible;
    opacity: .85
}

.content-wrap {
    top: 0;
    width: calc(100% - 144px);
    margin: 0 60px 0 84px;
    padding: 14px 14px 40px;
    max-width: 1440px;
    -webkit-overflow-scrolling: touch;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    z-index: 2
}

.takeover .content-wrap {
    margin: 60px 60px 0 84px
}

.content {
    width: 100%
}

#cd-vertical-nav::before, .content-wrap::before {
    position: absolute;
    top: 0;
    z-index: 10;
    height: 100%;
    background: rgba(0,0,0,.5);
    content: ''
}

.content-wrap::before {
    left: 0;
    visibility: hidden;
    width: 100%;
    opacity: 0;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition: opacity .3s,-webkit-transform 0 .3s;
    transition: opacity .3s,transform 0 .3s
}

.show-sponsor .content-wrap::before {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

#cd-vertical-nav::before {
    right: 0;
    visibility: hidden;
    width: 36px;
    opacity: 0;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition: opacity .3s,-webkit-transform 0 .3s;
    transition: opacity .3s,transform 0 .3s
}

.show-sponsor #cd-vertical-nav::before, .sponsorHome #cd-vertical-nav::before {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.sponsor {
    position: fixed;
    font-weight: 700;
    opacity: 1;
    -webkit-transition: opacity 1s;
    transition: opacity 1s;
    width: 100%;
    display: block;
    height: 100%;
    background: #aa120d
}

    .sponsor .content, .sponsor .right {
        display: inline-block;
        height: 100%;
        position: relative
    }

    .sponsor .content {
        width: 100%;
        margin: 60px 0 0;
        background-size: 100% !important;
        background-repeat: no-repeat !important;
        background-position: center 0 !important
    }

    .sponsor .right {
        width: calc(((100% - 1440px)/ 2) - 12px);
        float: right;
        right: 0;
        top: -60px;
        min-width: 60px
    }

    .sponsor .middle {
        position: relative;
        float: right;
        width: calc(100% - 144px);
        height: 100%;
        max-width: 1440px;
        max-height: 400px;
        overflow: hidden
    }

        .sponsor .middle .sponsorContent {
            width: auto;
            height: 100%;
            text-align: center;
            margin-top: 1px
        }

            .sponsor .middle .sponsorContent a {
                display: block;
                height: 100%
            }

            .sponsor .middle .sponsorContent img {
                width: 100%;
                height: auto
            }

    .sponsor .left {
        position: relative;
        width: calc(((100% - 1440px)/ 2) + 12px);
        height: 100%;
        float: right;
        display: inline-block;
        left: 0;
        top: -60px;
        min-width: 84px
    }

.currGoldDiv .currGoldTable .currGoldDtls .item:first-child, .currGoldDiv .currGoldTable .title .name:first-child {
    min-width: 150px
}

.sponsor .sponsorLogoBtn {
    display: block;
    position: absolute;
    margin: 0 12px;
    bottom: 172px;
    left: 0;
    transition: none;
    width: 60px
}

    .sponsor .sponsorLogoBtn img {
        width: 100%;
        height: 100%
    }

.sponsor img {
    width: auto;
    height: 100%;
    border: none
}

.sponsorBanner {
    position: fixed;
    top: 50px;
    height: 60px;
    z-index: 3;
    transition: 0;
    width: 100%;
    margin: 0 !important;
    display: inline-block;
    max-width: 1584px
}

    .sponsorBanner img {
        width: 100%;
        height: auto;
        border: none;
        position: absolute;
        right: 0;
        bottom: 0
    }

.show-sponsor, .sponsorBtnText, .sponsorClick, .sponsorHome {
    position: fixed
}

.sponsorBanner p {
    font-size: 18px;
    color: #fff;
    line-height: 3.4
}

.sponsorClick {
    left: 0;
    top: 50px;
    z-index: 1;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    background: 0 0;
    -webkit-transition: -webkit-transform .3s;
    transition: transform .3s
}

.sponsorBtnText {
    left: 98px;
    top: 70px;
    z-index: 4;
    background: #fff;
    width: 180px;
    height: 40px;
    font-size: 14px;
    color: #1d1d1d;
    -webkit-transition: top .3s;
    -moz-transition: top .3s;
    -ms-transition: top .3s;
    -o-transition: top .3s;
    transition: top .3s
}

    .sponsorBtnText:after {
        content: "مشاهدة كل الإعلان";
        line-height: 3
    }

.icon-spnsrBottom:before {
    content: "o";
    font-size: 20px;
    float: right;
    margin: 0 5px 0 -5px;
    line-height: 2;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg)
}

.show-sponsor .sponsorBtnText:after, .sponsorHome .sponsorBtnText:after {
    content: "الرجوع الى مصراوى"
}

.show-sponsor .sponsor {
    margin-right: 9px;
    width: calc(100% - 17px);
    opacity: 1
}

.show-sponsor .cd-main-content {
    background: 0 0
}

.show-sponsor .container {
    margin-right: 8px
}

.show-sponsor.takeover .content-wrap {
    width: calc(100% - 161px);
    margin: 60px 69px 0 92px
}

.show-sponsor .sponsorBanner, .sponsorHome .sponsor {
    margin-right: 9px;
    width: calc(100% - 17px)
}

.show-sponsor .sponsorBtnText {
    background: #fff;
    color: #1d1d1d
}

    .show-sponsor .sponsorBtnText:before {
        transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg)
    }

.sponsorHome .sponsor {
    opacity: 1
}

.sponsorHome .cd-main-content {
    background: 0 0
}

.sponsorHome .container {
    margin-right: 8px
}

.sponsorHome.takeover .content-wrap {
    width: calc(100% - 161px);
    margin: 60px 69px 0 92px
}

.sponsorHome .sponsorBtnText:before {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg)
}

.sponsorHome .content-wrap::before {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.sponsorHome .content-wrap {
    top: 340px
}

.sponsorHome .sponsorBanner {
    margin-right: 9px;
    width: calc(100% - 17px);
    top: 50px
}

.sponsorHome .sponsorBtnText {
    background: #fff;
    color: #1d1d1d;
    top: 411px
}

footer {
    display: inline-block;
    width: 100%;
    position: relative;
    z-index: 4;
    background: #fff
}

    footer .top {
        display: block;
        width: 100%;
        height: 80px;
        background: #222
    }

        footer .top .cnts {
            width: 618px;
            padding: 20px 0;
            margin: 0;
            display: inline-block
        }

            footer .top .cnts h2 {
                font-family: DroidKufiLight,arial;
                font-size: 20px;
                color: #fff;
                float: right;
                margin-left: 24px;
                line-height: 2
            }

            footer .top .cnts .subTxt button, footer .top .cnts .subTxt input {
                height: 40px;
                font-size: 16px;
                font-family: DroidKufiLight,arial;
                float: right
            }

            footer .top .cnts .subTxt {
                width: 300px;
                float: right;
                height: 40px;
                display: inline-block
            }

                footer .top .cnts .subTxt input {
                    display: block;
                    color: #aaa;
                    direction: rtl;
                    text-align: right;
                    padding: 0 10px;
                    width: 200px;
                    border: none;
                    outline: 0
                }

                footer .top .cnts .subTxt button {
                    background: #aa120d;
                    width: 100px;
                    color: #fff;
                    line-height: .5
                }

                    footer .top .cnts .subTxt button:hover {
                        background: #7f0a06
                    }

    footer .middle {
        display: block;
        width: 100%;
        height: auto;
        background: #111
    }

        footer .middle .navMenu {
            width: calc(100% - 216px);
            padding: 10px 0;
            margin: 12px 108px;
            display: inline-block
        }

            footer .middle .navMenu ul .has-children {
                float: right;
                width: 132px;
                height: 310px;
                margin-left: calc((100% - 882px)/ 6)
            }

                footer .middle .navMenu ul .has-children:last-child {
                    width: 90px;
                    margin-left: 0
                }

                footer .middle .navMenu ul .has-children a {
                    font-family: DroidKufiLight,arial;
                    font-size: 14px;
                    display: block;
                    color: #fff;
                    white-space: nowrap;
                    text-align: right
                }

                    footer .middle .navMenu ul .has-children a:hover {
                        color: #888
                    }

            footer .middle .navMenu ul .is-hidden a {
                font-family: DroidKufiLight,arial;
                font-size: 12px;
                color: #888
            }

                footer .middle .navMenu ul .is-hidden a:hover {
                    color: #fff
                }

        footer .middle .socialDiv {
            width: 248px;
            height: 40px;
            margin: 0 calc((100% - 248px)/ 2) 10px;
            display: inline-block
        }

            footer .middle .socialDiv a {
                width: 40px;
                height: 40px;
                display: inline-block;
                font-size: 24px;
                color: #fff;
                text-align: center;
                background: #2d2d2d;
                float: right;
                margin-left: 12px;
                border-radius: 50%
            }

                footer .middle .socialDiv a:last-child {
                    margin-left: 0
                }

                footer .middle .socialDiv a:hover {
                    color: #fff
                }

        footer .middle .icon-fb:before {
            content: "u"
        }

        footer .middle .icon-fb:hover {
            background: #3c5899
        }

        footer .middle .icon-tw:before {
            content: "v"
        }

        footer .middle .icon-tw:hover {
            background: #229ff3
        }

        footer .middle .icon-ggl:before {
            content: "w"
        }

        footer .middle .icon-ggl:hover {
            background: #d65142
        }

        footer .middle .icon-yt:before {
            content: "x"
        }

        footer .middle .icon-yt:hover {
            background: #e62117
        }

        footer .middle .icon-rss:before {
            content: "A"
        }

        footer .middle .icon-rss:hover {
            background: #ffaf5c
        }

        footer .middle .linksMenu {
            width: 298px;
            margin: 0 calc((100% - 298px)/ 2);
            display: inline-block
        }

            footer .middle .linksMenu a {
                display: inline-block;
                font-size: 14px;
                color: #fff;
                float: right;
                margin-left: 36px;
                font-family: DroidKufiLight,arial
            }

                footer .middle .linksMenu a:last-child {
                    margin-left: 0
                }

                footer .middle .linksMenu a:hover {
                    color: #888
                }

    footer .bottom {
        display: block;
        width: 100%;
        height: 40px;
        background: #000
    }

    footer .copyright {
        display: inline-block;
        width: 294px;
        margin: 0 calc((100% - 294px)/ 2)
    }

        footer .copyright p {
            float: right;
            font-family: DroidKufiLight,arial;
            font-size: 12px;
            color: #fff;
            line-height: 1.5;
            margin-left: 10px;
            margin-top: 12px
        }

        footer .copyright .icon-copy:before {
            content: "B";
            font-size: 14px;
            float: right;
            margin-left: 5px;
            line-height: 1.4
        }

        footer .copyright .masLogo {
            float: right;
            width: 82px;
            height: 24px;
            background: url(http://www.masrawy.com/Images/masrawyLogo.png?ver=2) center center no-repeat;
            background-size: 82px 24px;
            margin-top: 8px
        }

#cd-vertical-nav {
    position: fixed;
    margin-right: -50px;
    bottom: auto;
    z-index: 1;
    background: #f2f2f2;
    padding: 12px 0;
    width: 50px;
    box-shadow: 2px 2px 2px 0 rgba(0,0,0,.2)
}

    #cd-vertical-nav li {
        text-align: right;
        margin: 0;
        width: 32px
    }

        #cd-vertical-nav li:last-child {
            margin-bottom: 0
        }

.featuredArea ul li, .mainKeywords {
    margin-bottom: 12px;
    overflow: hidden
}

#cd-vertical-nav a {
    display: inline-block;
    backface-visibility: hidden;
    text-align: center
}

    #cd-vertical-nav a:after {
        content: "";
        display: table;
        clear: both
    }

    #cd-vertical-nav a span, .mainKeywords h2 {
        display: inline-block
    }

    #cd-vertical-nav a:hover .cd-label {
        opacity: 1
    }

#cd-vertical-nav .cd-dot {
    position: relative;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    background-color: #ddd;
    color: #1d1d1d;
    -webkit-transition: -webkit-transform .2s,background-color .2s;
    -moz-transition: -moz-transform .2s,background-color .2s;
    transition: transform .2s,background-color .2s;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

#cd-vertical-nav .icon-news:before {
    content: "g";
    font-size: 24px;
    line-height: 1.4;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-seen:before {
    content: "N";
    font-size: 24px;
    line-height: 1.4;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-ramadan:before {
    content: "Y";
    font-size: 24px;
    line-height: 1.4;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-sports:before {
    content: "Z";
    font-size: 22px;
    line-height: 1.5;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-media:before {
    content: "j";
    font-size: 18px;
    line-height: 1.7;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-economy:before {
    content: "U";
    font-size: 20px;
    line-height: 1.7;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-howa_w_hya:before {
    content: "V";
    font-size: 20px;
    line-height: 1.7;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-arts:before {
    content: "X";
    font-size: 24px;
    line-height: 1.4;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-autos:before {
    content: "l";
    font-size: 20px;
    line-height: 1.5;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-islameyat:before {
    content: "T";
    font-size: 22px;
    line-height: 1.4;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-ads:before {
    content: "n";
    font-size: 24px;
    line-height: 1.4;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

#cd-vertical-nav .icon-news:hover, #cd-vertical-nav .icon-seen:hover, #cd-vertical-nav a.is-selected .icon-news, #cd-vertical-nav a.is-selected .icon-seen {
    background: #aa120d;
    color: #fff
}

#cd-vertical-nav .icon-ramadan:hover, #cd-vertical-nav a.is-selected .icon-ramadan {
    background: #c15709;
    color: #fff
}

#cd-vertical-nav .icon-sports:hover, #cd-vertical-nav a.is-selected .icon-sports {
    background: #006829;
    color: #fff
}

#cd-vertical-nav .icon-media:hover, #cd-vertical-nav a.is-selected .icon-media {
    background: #1d1d1d;
    color: #fff
}

#cd-vertical-nav .icon-economy:hover, #cd-vertical-nav a.is-selected .icon-economy {
    background: #aa120d;
    color: #fff
}

#cd-vertical-nav .icon-howa_w_hya:hover, #cd-vertical-nav a.is-selected .icon-howa_w_hya {
    background: #9224a5;
    color: #fff
}

#cd-vertical-nav .icon-arts:hover, #cd-vertical-nav a.is-selected .icon-arts {
    background: #c15709;
    color: #fff
}

#cd-vertical-nav .icon-autos:hover, #cd-vertical-nav a.is-selected .icon-autos {
    background: #1877b6;
    color: #fff
}

#cd-vertical-nav .icon-islameyat:hover, #cd-vertical-nav a.is-selected .icon-islameyat {
    background: #119e9e;
    color: #fff
}

#cd-vertical-nav .icon-ads:hover {
    background: #3c14c1;
    color: #fff
}

.mainKeywords {
    height: 36px;
    background: #f2f2f2;
    border-bottom: 1px solid #ddd;
    box-shadow: none
}

    .mainKeywords h2 {
        float: right;
        font-family: DroidKufiBold,Arial;
        font-size: 14px;
        color: #1d1d1d;
        width: 160px;
        height: 36px;
        text-align: center;
        line-height: 2.8;
        background: #ddd
    }

    .akhbarThemak .ttl h2, .featuredArea .desc p, .featuredArea ul li .secName, .mainKeywords .keywords a {
        font-family: DroidKufiLight,Arial
    }

    .mainKeywords .keywords {
        float: right;
        display: inline-block;
        width: calc(100% - 160px)
    }

        .mainKeywords .keywords a {
            float: right;
            padding: 5px 20px;
            color: #1d1d1d;
            font-size: 14px;
            background: #f2f2f2
        }

            .mainKeywords .keywords a:hover {
                background: #e8e8e8
            }

.featuredArea {
    padding: 12px;
    margin-left: 12px;
    width: calc(100% - 312px);
    float: right
}

    .featuredArea ul li {
        float: right;
        margin-left: 12px;
        width: calc((100% - 24.1px)/ 3);
        height: auto;
        position: relative;
        border: 1px solid #ddd
    }

        .featuredArea ul li a {
            display: block
        }

        .featuredArea ul li .secName {
            padding: 0 10px;
            font-size: 14px;
            color: #fff;
            background: #aa120d;
            position: absolute;
            top: 0;
            right: 0;
            z-index: 1
        }

        .featuredArea ul li:first-child .secName {
            font-size: 18px
        }

        .featuredArea ul li a .imageCntnr {
            position: relative;
            overflow: hidden;
            padding-bottom: 75%
        }

        .featuredArea .desc, .featuredArea .desc p, .featuredArea ul li a img {
            position: absolute;
            right: 0;
            bottom: 0
        }

        .featuredArea ul li:first-child a .imageCntnr {
            padding-bottom: calc(75% + 4px)
        }

        .featuredArea ul li a img {
            top: 0;
            left: 0;
            margin: 0 auto;
            width: 100%;
            height: 100%;
            border: none;
            filter: brightness(100%) contrast(100%);
            -webkit-filter: brightness(100%) contrast(100%);
            -moz-filter: brightness(100%) contrast(100%);
            -o-filter: brightness(100%) contrast(100%);
            -ms-filter: brightness(100%) contrast(100%);
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .featuredArea ul li:first-child {
            width: calc(100% - ((100% + 12px)/ 3))
        }

        .featuredArea ul li:last-child, .featuredArea ul li:nth-child(2), .featuredArea ul li:nth-child(3) {
            margin-left: 0
        }

        .featuredArea ul li:last-child, .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5) {
            margin-bottom: 0
        }

        .featuredArea ul li:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

    .featuredArea .desc {
        width: 100%;
        height: 50%;
        overflow: hidden;
        cursor: pointer;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

        .featuredArea .desc p {
            color: #fff;
            text-align: right;
            line-height: 1.6;
            padding: 12px;
            font-size: 16px
        }

    .featuredArea ul li:first-child .desc p {
        font-size: 24px;
        line-height: 1.8
    }

.akhbarThemak {
    float: right;
    width: 300px;
    height: 384px;
    box-shadow: none;
    background: #1d1d1d;
    overflow: hidden;
    position: relative
}

    .akhbarThemak .ttl {
        display: block;
        width: 100%;
        height: 48px;
        overflow: hidden;
        border-bottom: none !important
    }

        .akhbarThemak .ttl h2 {
            float: right;
            padding: 4px 12px;
            font-size: 20px;
            color: #fff;
            display: block;
            line-height: inherit
        }

            .akhbarThemak .ttl h2:after {
                display: none
            }

            .akhbarThemak .ttl h2 a {
                color: #fff
            }

        .akhbarThemak .ttl .icons {
            display: inline-block;
            float: left
        }

            .akhbarThemak .ttl .icons .cd-popup-notify, .akhbarThemak .ttl .icons .cd-popup-setting {
                display: inline-block;
                float: right
            }

            .akhbarThemak .ttl .icons .cd-popup-notify {
                margin: 0 16px 0 12px
            }

            .akhbarThemak .ttl .icons .icon-setting:before {
                content: "p";
                color: #fff;
                font-size: 22px;
                line-height: 2.2
            }

            .akhbarThemak .ttl .icons .icon-notify:before {
                content: "M";
                color: #fff;
                font-size: 18px;
                line-height: 2.8
            }

    .akhbarThemak .popupNotify, .akhbarThemak .popupSetting {
        position: fixed;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        background-color: rgba(255,255,255,.95);
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s 0s,visibility 0 .3s;
        -moz-transition: opacity .3s 0s,visibility 0 .3s;
        transition: opacity .3s 0s,visibility 0 .3s
    }

        .akhbarThemak .popupNotify.is-visible, .akhbarThemak .popupSetting.is-visible {
            opacity: 1;
            visibility: visible;
            z-index: 10;
            -webkit-transition: opacity .3s 0s,visibility 0 0;
            -moz-transition: opacity .3s 0s,visibility 0 0;
            transition: opacity .3s 0s,visibility 0 0
        }

    .akhbarThemak .cd-popup-container {
        position: relative;
        padding: 24px;
        width: 1000px;
        height: 430px;
        margin: 120px auto;
        background: #FFF;
        text-align: center;
        box-shadow: 0 0 20px rgba(0,0,0,.4);
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        -webkit-backface-visibility: hidden;
        -webkit-transition-property: -webkit-transform;
        -moz-transition-property: -moz-transform;
        transition-property: transform;
        -webkit-transition-duration: .3s;
        -moz-transition-duration: .3s;
        transition-duration: .3s
    }

        .akhbarThemak .cd-popup-container h2 {
            display: inline-block;
            width: 100%;
            font-family: DroidKufiBold,Arial;
            font-size: 22px;
            color: #1d1d1d;
            margin-bottom: 0;
            padding: 0
        }

            .akhbarThemak .cd-popup-container h2:after {
                display: none
            }

        .akhbarThemak .cd-popup-container h4 {
            display: inline-block;
            width: 100%;
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #888;
            margin-bottom: 12px;
            padding: 0;
            text-align: right
        }

        .akhbarThemak .cd-popup-container .sec {
            display: inline-block;
            width: calc((100% - 60px)/ 6);
            float: right;
            margin-left: 12px
        }

            .akhbarThemak .cd-popup-container .sec:nth-child(6n+1) {
                margin-left: 0
            }

        .akhbarThemak .cd-popup-container h3 {
            display: inline-block;
            width: 100%;
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #1d1d1d;
            margin-bottom: 12px;
            padding-right: 12px;
            background: #eee
        }

        .akhbarThemak .cd-popup-container .cd-buttons {
            position: absolute;
            right: 0;
            bottom: 0;
            width: 100%;
            height: 60px
        }

            .akhbarThemak .cd-popup-container .cd-buttons a {
                position: relative;
                top: 0;
                left: 0;
                float: right;
                background: #ddd;
                width: calc(100% / 2);
                height: 60px;
                font-family: DroidKufiLight,Arial;
                font-size: 16px;
                color: #1d1d1d;
                text-align: center;
                display: block;
                line-height: 3.5
            }

                .akhbarThemak .cd-popup-container .cd-buttons a:after, .akhbarThemak .cd-popup-container .cd-buttons a:before {
                    display: none
                }

                .akhbarThemak .cd-popup-container .cd-buttons a:first-child {
                    background: #1d1d1d;
                    color: #fff
                }

                .akhbarThemak .cd-popup-container .cd-buttons a:hover {
                    background: #ccc
                }

                .akhbarThemak .cd-popup-container .cd-buttons a:first-child:hover {
                    background: #aa120d
                }

    .akhbarThemak .cd-popup-notify {
        position: relative
    }

        .akhbarThemak .cd-popup-notify .ntfyNum {
            position: absolute;
            top: 8px;
            right: -10px;
            width: 17px;
            height: 17px;
            background: red;
            border-radius: 50%;
            color: #fff;
            text-align: center;
            font-family: Arial;
            font-size: 12px;
            line-height: 1.5
        }

    .akhbarThemak .cd-popup-container.notify {
        width: 769px;
        height: 200px
    }

        .akhbarThemak .cd-popup-container.notify p {
            display: inline-block;
            width: 100%;
            font-family: DroidKufiLight,Arial;
            font-size: 18px;
            color: #1d1d1d;
            margin-bottom: 24px;
            padding: 0
        }

    .akhbarThemak .cd-popup-container .cd-popup-close {
        position: absolute;
        top: 12px;
        left: 12px;
        width: 36px;
        height: 36px
    }

        .akhbarThemak .cd-popup-container .cd-popup-close::after, .akhbarThemak .cd-popup-container .cd-popup-close::before {
            content: '';
            position: absolute;
            top: 0;
            width: 2px;
            height: 100%;
            background-color: #1d1d1d;
            opacity: .2;
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .akhbarThemak .cd-popup-container .cd-popup-close:hover::after, .akhbarThemak .cd-popup-container .cd-popup-close:hover::before {
            opacity: 1
        }

        .akhbarThemak .cd-popup-container .cd-popup-close::before {
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        .akhbarThemak .cd-popup-container .cd-popup-close::after {
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            transform: rotate(-45deg)
        }

    .akhbarThemak .is-visible .cd-popup-container, article .pagination ul li.nextPrev .icon-prev:before {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0)
    }

    .akhbarThemak .is-visible .cd-popup-container {
        transform: translateY(0)
    }

    .akhbarThemak li {
        width: 100%;
        display: block;
        padding: 12px;
        height: 84px;
        position: relative
    }

        .akhbarThemak li:nth-child(odd) {
            background: #363636
        }

        .akhbarThemak li:nth-child(even) {
            background: #2a2a2a
        }

        .akhbarThemak li:hover {
            background: #444
        }

    .akhbarThemak ul li a .imageCntnr {
        position: relative;
        overflow: hidden;
        padding-bottom: calc((80px * 75)/ 100);
        float: right;
        width: 80px;
        margin-left: 12px
    }

    .akhbarThemak li img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: 0 auto;
        float: right;
        width: 100%;
        height: 100%;
        max-width: 80px;
        border: 1px solid #555
    }

    .akhbarThemak li p {
        float: right;
        width: calc(100% - 92px);
        font-family: DroidKufiLight,Arial;
        color: #fff;
        font-size: 13px;
        line-height: 1.6;
        margin-top: -2px;
        height: 40px;
        overflow: hidden
    }

    .akhbarThemak li .secName:before, .ttl h2:after {
        content: "";
        float: right;
        margin-top: 4px;
        background: #aa120d
    }

    .akhbarThemak li .secName {
        position: absolute;
        right: 104px;
        bottom: 6px;
        font-family: DroidKufiLight,Arial;
        color: #aaa;
        font-size: 12px
    }

.ttl .more, .ttl h2 {
    color: #1d1d1d;
    display: block
}

.akhbarThemak li .secName:before {
    margin-left: 5px;
    width: 4px;
    height: 12px
}

.akhbarThemak.fixed {
    position: fixed
}

.ttl {
    display: block;
    width: 100%;
    height: 46px;
    overflow: hidden;
    border-bottom: 1px solid #aa120d
}

    .ttl h2 {
        float: right;
        padding: 0;
        font-family: DroidKufiBold,Arial;
        font-size: 24px;
        line-height: 1.4
    }

.opinions, .pattern01 {
    padding: 12px
}

    .opinions .allItems li .desc p, .pattern01 ul li .desc p, .pattern01 ul li .secName, .ttl .more {
        font-family: DroidKufiLight,Arial
    }

.ttl h2:after {
    width: 4px;
    height: 24px;
    margin-left: 12px
}

.ttl .more {
    float: left;
    font-size: 18px
}

.ttl .icon-more:before {
    content: "q";
    font-size: 18px;
    float: left;
    margin-right: 5px;
    line-height: 2
}

.ttl .more:hover {
    color: #888
}

.pattern01 .allItems {
    display: inline-block;
    width: 100%;
    padding: 24px 0
}

.pattern01 ul li {
    float: right;
    margin-left: 24px;
    margin-bottom: 24px;
    padding-bottom: 5px;
    width: calc((100% - 96px)/ 5);
    height: auto;
    position: relative;
    overflow: hidden
}

    .pattern01 ul li a {
        display: block
    }

        .pattern01 ul li a .imageCntnr {
            position: relative;
            overflow: hidden;
            padding-bottom: 75%
        }

    .pattern01 ul li .item img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: 0 auto;
        width: 100%;
        height: 100%;
        filter: brightness(100%) contrast(100%);
        -webkit-filter: brightness(100%) contrast(100%);
        -moz-filter: brightness(100%) contrast(100%);
        -o-filter: brightness(100%) contrast(100%);
        -ms-filter: brightness(100%) contrast(100%);
        transition: all .2s ease-in-out 0;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

    .pattern01 ul li .item:hover img {
        filter: brightness(108%) contrast(108%);
        -webkit-filter: brightness(108%) contrast(108%);
        -moz-filter: brightness(108%) contrast(108%);
        -o-filter: brightness(108%) contrast(108%);
        -ms-filter: brightness(108%) contrast(108%)
    }

    .pattern01 ul li:nth-child(5n) {
        margin-left: 0
    }

    .pattern01 ul li:nth-last-child(-n+5) {
        margin-bottom: 0
    }

    .pattern01 ul li .desc {
        width: 100%;
        overflow: hidden;
        cursor: pointer
    }

        .pattern01 ul li .desc p {
            color: #1d1d1d;
            height: 84px;
            cursor: pointer;
            margin-bottom: 5px;
            overflow: hidden;
            text-align: right;
            line-height: 1.6;
            padding: 10px 0;
            font-size: 15px;
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0
        }

    .pattern01 ul li .item:hover .desc p {
        color: #888
    }

    .pattern01 ul li .secName {
        font-size: 14px;
        color: #888;
        display: inline-block
    }

        .pattern01 ul li .secName:after {
            content: "";
            width: 4px;
            height: 14px;
            background: #aa120d;
            float: right;
            margin-left: 5px;
            margin-top: 6px
        }

        .pattern01 ul li .secName:hover {
            color: #1d1d1d
        }

    .pattern01 ul li.icon-image, .pattern01 ul li.icon-video {
        background: #1d1d1d
    }

        .pattern01 ul li.icon-image .desc p, .pattern01 ul li.icon-video .desc p {
            color: #fff;
            padding: 10px
        }

        .pattern01 ul li.icon-image .item:hover .desc p, .pattern01 ul li.icon-video .item:hover .desc p {
            color: #aaa
        }

        .pattern01 ul li.icon-image .secName, .pattern01 ul li.icon-video .secName {
            margin-right: 10px;
            color: #bbb
        }

            .pattern01 ul li.icon-image .secName:hover, .pattern01 ul li.icon-video .secName:hover {
                color: #888
            }

        .pattern01 ul li.icon-image:before, .pattern01 ul li.icon-video:before {
            color: #fff;
            font-size: 30px;
            background: rgba(0,0,0,.7);
            position: absolute;
            top: 1px;
            left: 1px;
            width: 41px;
            height: 40px;
            line-height: 1.35;
            pointer-events: none;
            z-index: 1
        }

        .pattern01 ul li.icon-video:before {
            content: "s"
        }

        .pattern01 ul li.icon-image:before {
            content: "t"
        }

.opinions {
    height: 266px;
    width: calc(100% - 696px);
    float: right;
    margin-left: 48px
}

    .opinions .allItems {
        display: inline-block;
        width: 100%;
        padding: 12px 0 0
    }

        .opinions .allItems li {
            width: 100%;
            margin-bottom: 24px;
            display: inline-block;
            position: relative;
            float: right
        }

            .opinions .allItems li:after {
                content: "";
                position: absolute;
                bottom: -12px;
                right: 0;
                width: 100%;
                height: 1px;
                background: #ddd
            }

            .opinions .allItems li:last-child:after {
                display: none
            }

    .opinions ul li a .imageCntnr {
        position: relative;
        overflow: hidden;
        padding-bottom: calc((60px * 75)/ 100);
        float: right;
        width: 60px
    }

    .opinions .allItems li img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: 0 auto;
        width: 100%;
        height: 100%;
        float: right;
        filter: brightness(100%) contrast(100%);
        -webkit-filter: brightness(100%) contrast(100%);
        -moz-filter: brightness(100%) contrast(100%);
        -o-filter: brightness(100%) contrast(100%);
        -ms-filter: brightness(100%) contrast(100%);
        transition: all .2s ease-in-out 0;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

    .opinions .allItems li .desc {
        float: right;
        width: calc(100% - 60px);
        padding-right: 12px
    }

        .opinions .allItems li .desc p {
            font-size: 14px;
            color: #1d1d1d;
            line-height: 1.5;
            height: 22px;
            overflow: hidden
        }

    .opinions .allItems li .date, .opinions .allItems li .writer {
        bottom: -4px;
        font-size: 12px;
        display: inline-block;
        font-family: DroidKufiLight,Arial
    }

    .opinions .allItems li .writer {
        position: absolute;
        right: 72px;
        color: #888
    }

.pattern02 .desc, .pattern02 .desc p, .pattern02 ul li a img {
    right: 0;
    bottom: 0;
    position: absolute
}

.opinions .allItems li .date {
    position: absolute;
    left: 0;
    color: #888;
    cursor: default
}

.mobawaba .desc, .pattern02 .desc, .specialFiles .desc {
    cursor: pointer;
    overflow: hidden
}

.opinions .allItems li .icon-date:before {
    content: "c";
    float: right;
    margin-left: 5px
}

.opinions .allItems li .item:hover img {
    filter: brightness(108%) contrast(108%);
    -webkit-filter: brightness(108%) contrast(108%);
    -moz-filter: brightness(108%) contrast(108%);
    -o-filter: brightness(108%) contrast(108%);
    -ms-filter: brightness(108%) contrast(108%)
}

.opinions .allItems li .item:hover .desc p {
    color: #888
}

.opinions .allItems li .writer:hover {
    color: #1d1d1d
}

.entrypoints {
    background: 0 0;
    box-shadow: none;
    width: 300px;
    height: 266px;
    margin-left: 48px
}

    .entrypoints .bx-wrapper:first-child {
        margin-bottom: 24px !important
    }

    .entrypoints ul {
        display: inline-block;
        width: 300px !important;
        height: 121px !important;
        margin-bottom: 24px;
        overflow: hidden;
        float: right
    }

        .entrypoints ul:last-child {
            margin-bottom: 0
        }

        .entrypoints ul li {
            display: inline-block;
            width: 100%;
            transition: none
        }

            .entrypoints ul li img {
                width: 300px;
                height: 121px
            }

.pattern02 {
    padding: 12px
}

    .pattern02 .allItems {
        display: inline-block;
        width: 100%;
        padding: 24px 0 0
    }

    .pattern02 ul li {
        float: right;
        margin-left: 24px;
        margin-bottom: 24px;
        width: calc((50% - 72.1px)/ 3);
        height: auto;
        position: relative;
        overflow: hidden
    }

        .pattern02 ul li a {
            display: block
        }

            .pattern02 ul li a .imageCntnr {
                position: relative;
                overflow: hidden;
                padding-bottom: 75%
            }

        .pattern02 ul li:first-child a .imageCntnr {
            padding-bottom: calc(75% + 5px)
        }

        .pattern02 ul li a img {
            top: 0;
            left: 0;
            margin: 0 auto;
            width: 100%;
            height: 100%;
            border: 1px solid #ddd;
            filter: brightness(100%) contrast(100%);
            -webkit-filter: brightness(100%) contrast(100%);
            -moz-filter: brightness(100%) contrast(100%);
            -o-filter: brightness(100%) contrast(100%);
            -ms-filter: brightness(100%) contrast(100%);
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .pattern02 ul li:first-child {
            width: 50%
        }

        .pattern02 ul li:nth-child(2), .pattern02 ul li:nth-child(3) {
            width: calc((50% - 48px)/ 2)
        }

        .pattern02 ul li:last-child, .pattern02 ul li:nth-child(3) {
            margin-left: 0
        }

        .pattern02 ul li:first-child, .pattern02 ul li:last-child, .pattern02 ul li:nth-child(4), .pattern02 ul li:nth-child(5) {
            margin-bottom: 0
        }

        .pattern02 ul li .item:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

    .pattern02 .desc {
        width: 100%;
        height: 50%;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

        .pattern02 .desc p {
            color: #fff;
            text-align: right;
            line-height: 1.6;
            padding: 12px;
            font-size: 16px;
            font-family: DroidKufiLight,Arial
        }

    .pattern02 ul li:first-child .desc p {
        font-size: 20px;
        line-height: 1.6
    }

    .pattern02 ul li .secName {
        padding: 0 10px;
        font-family: DroidKufiLight,Arial;
        font-size: 14px;
        color: #fff;
        background: #aa120d;
        position: absolute;
        top: 1px;
        right: 1px;
        z-index: 1
    }

    .pattern02 ul li:first-child .secName {
        font-size: 18px
    }

    .pattern02 ul li:nth-last-child(-n+3) .desc {
        position: relative;
        background: 0 0
    }

        .pattern02 ul li:nth-last-child(-n+3) .desc p {
            position: relative;
            color: #1d1d1d;
            font-size: 14px;
            line-height: 1.4;
            padding: 5px 0;
            height: 62px;
            overflow: hidden
        }

    .pattern02 ul li:nth-last-child(-n+3) .secName {
        position: relative;
        background: 0 0 !important;
        padding: 0;
        color: #888;
        top: auto;
        bottom: -2px;
        right: 0;
        display: inline-block
    }

        .pattern02 ul li:nth-last-child(-n+3) .secName:after {
            content: "";
            width: 4px;
            height: 14px;
            background: #aa120d;
            float: right;
            margin-left: 5px;
            margin-top: 6px
        }

    .media ul li.icon-video:before, .pattern02 ul li.icon-video:before {
        content: "s"
    }

    .pattern02 ul li:nth-last-child(-n+3) .item:hover .desc p {
        color: #888
    }

    .pattern02 ul li:nth-last-child(-n+3) .secName:hover {
        color: #1d1d1d
    }

    .pattern02 ul li:nth-last-child(-n+3).icon-image, .pattern02 ul li:nth-last-child(-n+3).icon-video {
        background: #1d1d1d
    }

        .pattern02 ul li:nth-last-child(-n+3).icon-image .desc p, .pattern02 ul li:nth-last-child(-n+3).icon-video .desc p {
            color: #fff;
            padding: 5px
        }

        .pattern02 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .pattern02 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
            color: #aaa
        }

        .pattern02 ul li:nth-last-child(-n+3).icon-image .secName, .pattern02 ul li:nth-last-child(-n+3).icon-video .secName {
            margin-right: 5px;
            color: #bbb
        }

            .pattern02 ul li:nth-last-child(-n+3).icon-image .secName:hover, .pattern02 ul li:nth-last-child(-n+3).icon-video .secName:hover {
                color: #888
            }

    .pattern02 ul li.icon-image:before, .pattern02 ul li.icon-video:before {
        color: #fff;
        background: rgba(0,0,0,.7);
        position: absolute;
        top: 1px;
        left: 1px;
        z-index: 1;
        pointer-events: none
    }

    .pattern02 ul li.icon-video:before {
        font-size: 30px;
        width: 41px;
        height: 40px;
        line-height: 1.35
    }

    .pattern02 ul li:first-child.icon-video:before {
        font-size: 56px;
        width: 70px;
        height: 70px;
        line-height: 1.25
    }

    .pattern02 ul li.icon-image:before {
        content: "t";
        font-size: 30px;
        width: 41px;
        height: 40px;
        line-height: 1.35
    }

    .pattern02 ul li:first-child.icon-image:before {
        font-size: 56px;
        width: 70px;
        height: 70px;
        line-height: 1.25
    }

.mostRead {
    padding: 12px;
    height: 616px;
    width: calc(100% - 696px);
    float: right;
    margin-left: 48px
}

    .mostRead .allItems {
        display: inline-block;
        width: 100%;
        padding: 12px 0 0
    }

        .mostRead .allItems li {
            width: 100%;
            margin-bottom: 24px;
            display: inline-block;
            position: relative;
            float: right
        }

            .mostRead .allItems li:after {
                content: "";
                position: absolute;
                bottom: -12px;
                right: 0;
                width: 100%;
                height: 1px;
                background: #ddd
            }

            .mostRead .allItems li:last-child:after {
                display: none
            }

    .mostRead ul li a .imageCntnr {
        position: relative;
        overflow: hidden;
        padding-bottom: calc((116px * 75)/ 100);
        float: right;
        width: 116px
    }

    .mostRead .allItems li img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: 0 auto;
        width: 100%;
        height: 100%;
        float: right;
        filter: brightness(100%) contrast(100%);
        -webkit-filter: brightness(100%) contrast(100%);
        -moz-filter: brightness(100%) contrast(100%);
        -o-filter: brightness(100%) contrast(100%);
        -ms-filter: brightness(100%) contrast(100%);
        transition: all .2s ease-in-out 0;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

    .mostRead .allItems li .desc {
        float: right;
        width: calc(100% - 116px);
        padding-right: 12px
    }

        .mostRead .allItems li .desc p {
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #1d1d1d;
            line-height: 1.5;
            height: 62px;
            overflow: hidden
        }

    .mostRead .allItems li .secName {
        position: absolute;
        right: 128px;
        bottom: -7px;
        font-family: DroidKufiLight,Arial;
        font-size: 14px;
        color: #888;
        display: inline-block
    }

        .mostRead .allItems li .secName:after {
            content: "";
            width: 4px;
            height: 14px;
            background: #aa120d;
            float: right;
            margin-left: 5px;
            margin-top: 6px
        }

    .mostRead .allItems li .number {
        position: absolute;
        top: 1px;
        right: 1px;
        width: 30px;
        height: 30px;
        border-left: 1px solid #fff;
        border-bottom: 1px solid #fff;
        background: #aa120d;
        color: #fff;
        font-family: Arial;
        font-weight: 700;
        font-size: 24px;
        text-align: center;
        line-height: 1.25;
        pointer-events: none;
        z-index: 1
    }

    .mostRead .allItems li .item:hover img {
        filter: brightness(108%) contrast(108%);
        -webkit-filter: brightness(108%) contrast(108%);
        -moz-filter: brightness(108%) contrast(108%);
        -o-filter: brightness(108%) contrast(108%);
        -ms-filter: brightness(108%) contrast(108%)
    }

    .mostRead .allItems li .item:hover .desc p {
        color: #888
    }

    .mostRead .allItems li .secName:hover {
        color: #1d1d1d
    }

.specialFiles {
    padding: 0;
    width: 300px;
    height: 225px;
    margin-bottom: 24px;
    direction: ltr;
    overflow: hidden
}

    .specialFiles ul li {
        position: relative;
        overflow: hidden
    }

        .specialFiles ul li a {
            display: block
        }

            .specialFiles ul li a img {
                width: 100%;
                height: auto;
                max-height: 225px;
                filter: brightness(100%) contrast(100%);
                -webkit-filter: brightness(100%) contrast(100%);
                -moz-filter: brightness(100%) contrast(100%);
                -o-filter: brightness(100%) contrast(100%);
                -ms-filter: brightness(100%) contrast(100%);
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0
            }

        .specialFiles ul li:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

    .specialFiles .desc {
        width: 100%;
        height: 50%;
        position: absolute;
        bottom: 0;
        right: 0;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

        .specialFiles .desc p {
            color: #fff;
            text-align: center;
            line-height: 1.6;
            padding: 12px;
            font-size: 20px;
            font-family: DroidKufiLight,Arial;
            position: absolute;
            bottom: 20px;
            right: 0;
            height: 80px;
            overflow: hidden
        }

    .specialFiles .name {
        width: 150px;
        height: 70px;
        background: #aa120d;
        border-bottom: 5px solid #fff;
        position: absolute;
        left: -52px;
        top: -8px;
        z-index: 999;
        pointer-events: none;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg)
    }

        .specialFiles .name h2 {
            padding: 0;
            font-family: DroidKufiBold,arial;
            color: #fff;
            font-size: 20px;
            display: block;
            line-height: 4;
            text-align: center
        }

.bx-wrapper {
    width: 100%;
    height: auto;
    position: relative
}

    .bx-wrapper img {
        max-width: 100%;
        display: block;
        border: none
    }

    .bx-wrapper .bx-controls-auto, .bx-wrapper .bx-pager {
        position: absolute;
        bottom: 0;
        width: 100%
    }

    .bx-wrapper .bx-controls-direction a {
        top: 50%;
        margin-top: -39px;
        outline: 0;
        display: block;
        position: absolute;
        color: #fff;
        opacity: .7
    }

        .bx-wrapper .bx-controls-direction a:hover {
            opacity: 1
        }

        .bx-wrapper .bx-controls-direction a.disabled {
            display: none
        }

        .bx-wrapper .bx-controls-direction a:before {
            font-size: 46px
        }

    .bx-wrapper .bx-next {
        right: 0
    }

        .bx-wrapper .bx-next:before {
            content: "r"
        }

    .bx-wrapper .bx-prev {
        left: 0
    }

        .bx-wrapper .bx-prev:before {
            content: "q"
        }

    .bx-wrapper .bx-pager {
        text-align: center
    }

    .bx-wrapper .bx-pager-item {
        margin-right: 3px
    }

        .bx-wrapper .bx-pager-item:last-child {
            margin-right: 0
        }

    .bx-wrapper .bx-controls-auto .bx-controls-auto-item, .bx-wrapper .bx-pager .bx-pager-item {
        display: inline-block;
        position: relative
    }

    .bx-wrapper .bx-pager a {
        background: 0 0;
        text-indent: -9999px;
        display: block;
        width: 12px;
        height: 12px;
        outline: 0;
        border: 1px solid #fff;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px
    }

        .bx-wrapper .bx-pager a.active, .bx-wrapper .bx-pager a:hover {
            background: #fff
        }

.mobawaba {
    padding: 12px;
    background: #0683a4;
    width: 300px;
    height: 367px
}

    .mobawaba .border {
        border: 1px solid #5daebf;
        height: 343px
    }

    .mobawaba .ttl {
        padding: 0 8px;
        height: 49px;
        border-bottom: 1px solid #5daebf !important
    }

        .mobawaba .ttl h2 a {
            background: url(http://www.masrawy.com/Images/mobawabaLogo.png) right 0 no-repeat;
            height: 33px;
            line-height: 4.4;
            padding: 10px 80px 5px 0;
            color: #fff;
            font-size: 14px;
            font-family: DroidKufiLight,arial
        }

        .mobawaba .ttl h2:after {
            display: none
        }

    .mobawaba .allItems {
        padding: 8px;
        border-bottom: 1px solid #5daebf
    }

    .mobawaba ul li {
        position: relative
    }

    .mobawaba .desc, .mobawaba .desc p, .mobawaba .footer {
        position: absolute;
        right: 0
    }

    .mobawaba ul li a {
        display: block
    }

        .mobawaba ul li a img {
            width: 100%;
            height: auto;
            border: none;
            filter: brightness(100%) contrast(100%);
            -webkit-filter: brightness(100%) contrast(100%);
            -moz-filter: brightness(100%) contrast(100%);
            -o-filter: brightness(100%) contrast(100%);
            -ms-filter: brightness(100%) contrast(100%);
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

    .mobawaba ul li:hover img {
        filter: brightness(108%) contrast(108%);
        -webkit-filter: brightness(108%) contrast(108%);
        -moz-filter: brightness(108%) contrast(108%);
        -o-filter: brightness(108%) contrast(108%);
        -ms-filter: brightness(108%) contrast(108%)
    }

    .mobawaba .desc {
        width: 100%;
        height: 50%;
        bottom: 0;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

        .mobawaba .desc p {
            color: #fff;
            text-align: center;
            line-height: 1.6;
            padding: 12px;
            font-size: 18px;
            font-family: DroidKufiLight,Arial;
            bottom: 0;
            height: 80px;
            overflow: hidden
        }

    .mobawaba .footer {
        width: 100%;
        height: 65px;
        background: #01313d;
        padding: 8px;
        bottom: -82px;
        cursor: default
    }

        .mobawaba .footer .price {
            float: right;
            font-family: Arial;
            font-weight: 700;
            font-size: 22px;
            color: #fff;
            line-height: 2.2;
            cursor: default
        }

            .mobawaba .footer .price span {
                margin-right: 5px;
                font-family: DroidKufiLight,Arial;
                font-size: 14px;
                font-weight: 400
            }

        .mobawaba .footer .add {
            float: left;
            height: 49px;
            padding: 0 8px;
            font-family: DroidKufiLight,Arial;
            font-size: 15px;
            color: #fff;
            background: #0683a4;
            line-height: 3.4
        }

            .mobawaba .footer .add:hover {
                background: #08708a
            }

.tabs-nav {
    list-style: none;
    margin: 0;
    font-family: DroidKufiLight,arial
}

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

    .tabs-nav > li {
        position: relative;
        float: right;
        font-size: 12px
    }

        .tabs-nav > li > a {
            display: block;
            color: #8a8a8a;
            position: relative;
            text-align: center;
            height: 26px;
            line-height: 2;
            white-space: nowrap;
            -webkit-transition: all .4s ease-out;
            -moz-transition: all .4s ease-out;
            -o-transition: all .4s ease-out;
            transition: all .4s ease-out
        }

    .tabs-nav .tabs-selected > a {
        font-size: 12px;
        line-height: 1.5;
        background-color: #168039;
        color: #fff
    }

    .tabs-nav > li:active > a, .tabs-nav > li:focus > a, .tabs-nav > li:hover > a, .tabs-nav > li > a:active, .tabs-nav > li > a:focus, .tabs-nav > li > a:hover {
        background-color: #168039;
        color: #fff;
        outline: 0
    }

    .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited, .tabs-nav .tabs-selected > a:link, .tabs-nav .tabs-selected > a:visited {
        cursor: text
    }

    .media .desc, .tabs-nav > li > a:active, .tabs-nav > li > a:focus, .tabs-nav > li > a:hover {
        cursor: pointer
    }

.tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) 0 50% no-repeat
}

.matchesTabs, .sportsContainer {
    background: 0 0;
    box-shadow: none
}

.tabs-hide {
    display: none
}

.sportsContainer {
    margin-bottom: 0
}

.matchesTable {
    padding: 10px 15px;
    min-height: 142px;
    display: inline-block;
    width: 270px
}

    .matchesTable .tabs-container .slide .noMatches {
        text-align: center;
        font-family: DroidKufiLight,arial;
        font-size: 14px;
        padding-top: 0;
        line-height: 8
    }

.allMatches .tabs-nav li {
    width: 80px;
    height: 30px;
    margin-left: 2px
}

    .allMatches .tabs-nav li > a {
        height: 30px;
        line-height: 2.4;
        border: 0;
        box-shadow: none;
        font-size: 14px;
        background-color: #ddd;
        color: #1d1d1d
    }

.allMatches .tabs-nav .tabs-selected > a {
    background-color: #fff;
    color: #1d1d1d
}

.allMatches .tabs-nav > li > a {
    border-right: none;
    box-shadow: none
}

.allMatches #tab-content {
    border: 1px solid #d7d7d7;
    background-color: #eee;
    height: 100%;
    margin: 0;
    clear: both;
    padding: 0;
    display: block
}

.allMatches #tab-01, .allMatches #tab-02, .allMatches #tab-03 {
    width: 100%
}

.allMatches .tabs-container .slide p {
    text-align: center;
    font-family: DroidKufiLight,Arial;
    font-size: 13px;
    padding-top: 10px;
    color: #fff
}

.allMatches .tabs-container {
    overflow: auto;
    direction: rtl
}

.allMatches .slide {
    background: #fff;
    display: inline-block;
    width: 100%;
    height: 182px;
    overflow-x: hidden;
    overflow-y: hidden;
    white-space: nowrap;
    float: right
}

.allMatches .item {
    color: #1d1d1d;
    font-size: 12px;
    text-align: center;
    padding: 18px;
    position: relative;
    width: calc((100% /3) - .1px);
    float: right;
    white-space: normal
}

    .allMatches .item:after {
        content: "";
        position: absolute;
        top: 74px;
        left: -1px;
        height: 86px;
        width: 1px;
        background: #ddd
    }

    .allMatches .item:nth-child(3n):after {
        display: none
    }

    .allMatches .item .tourName {
        font-size: 16px;
        font-family: DroidKufiLight,arial;
        color: #1d1d1d;
        padding-bottom: 5px;
        margin-bottom: 18px;
        text-align: center;
        width: 100%;
        display: inline-block;
        border-bottom: 1px solid #006829
    }

    .allMatches .item .teamA {
        float: right;
        width: 110px;
        height: 90px
    }

        .allMatches .item .teamA img, .allMatches .item .teamB img {
            height: 60px;
            width: auto;
            border: none
        }

        .allMatches .item .teamA p, .allMatches .item .teamB p {
            display: block;
            margin: 0;
            padding-top: 5px;
            color: #1d1d1d;
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            line-height: 1.4
        }

    .allMatches .item .result {
        float: right;
        width: calc(100% - 220px);
        padding-top: 0;
        font-size: 42px
    }

        .allMatches .item .result.yesterday {
            padding-top: 12px;
            font-family: arial
        }

    .allMatches .item .teamB {
        float: right;
        width: 110px;
        height: 90px
    }

    .allMatches .item .result span {
        color: #1d1d1d;
        font-size: 18px !important;
        text-align: center
    }

    .allMatches .item .status a {
        background: #aaa;
        color: #fff;
        font-size: 12px;
        display: block
    }

.allMatches .status {
    position: relative;
    margin: 0 auto;
    width: 100%;
    font-family: arial
}

    .allMatches .status span {
        background: 0 0;
        color: #1d1d1d !important;
        line-height: 1;
        display: block;
        margin-top: 19px
    }

.allMatches .item .result span.now {
    width: 60px;
    height: 20px;
    background: #006829;
    color: #fff !important;
    text-align: center;
    font-family: DroidKufiLight,arial;
    font-size: 12px !important;
    line-height: 1.8;
    margin: 18px auto 0 !important;
    border-radius: 0 !important
}

.allMatches .matchResult {
    font-family: Arial;
    font-size: 42px;
    line-height: .9;
    margin-top: 10px
}

.matchesTabs .more {
    color: #fff;
    width: 100%;
    height: 36px;
    font-size: 16px;
    text-align: center;
    background: #006829;
    display: block;
    font-family: DroidKufiLight,arial;
    padding: 3px 0;
    line-height: 2;
    transition: background-color .4s ease 0
}

.masrawyServices li .item, .masrawyServices ul {
    display: inline-block
}

.masrawyServices li img, .media ul li a img {
    transition: all .2s ease-in-out 0;
    filter: brightness(100%) contrast(100%)
}

.matchesTabs .more:hover {
    background-color: #005220
}

.matchesTabs .slide .noMatches {
    font-size: 20px !important;
    padding-top: 56px !important;
    width: 100%;
    color: #1d1d1d !important;
    line-height: 3.5
}

.masrawyServices {
    padding: 12px;
    border-bottom: 4px solid #df182b
}

    .masrawyServices .ttl {
        border-bottom: 1px solid #df182b
    }

        .masrawyServices .ttl h2:after {
            background: #df182b
        }

    .masrawyServices .allItems {
        overflow: auto;
        direction: rtl;
        padding: 24px 0 0
    }

    .masrawyServices ul {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        float: right
    }

    .masrawyServices li {
        width: calc((100% - 48.1px)/ 3);
        position: relative;
        float: right;
        margin-left: 24px;
        white-space: normal
    }

        .masrawyServices li:last-child {
            margin-left: 0
        }

        .masrawyServices li img {
            width: 100%;
            height: auto;
            -webkit-filter: brightness(100%) contrast(100%);
            -moz-filter: brightness(100%) contrast(100%);
            -o-filter: brightness(100%) contrast(100%);
            -ms-filter: brightness(100%) contrast(100%);
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

    .masrawyServices ul li:hover img {
        filter: brightness(108%) contrast(108%);
        -webkit-filter: brightness(108%) contrast(108%);
        -moz-filter: brightness(108%) contrast(108%);
        -o-filter: brightness(108%) contrast(108%);
        -ms-filter: brightness(108%) contrast(108%)
    }

    .masrawyServices li .more {
        width: 150px;
        height: 40px;
        display: none;
        margin: 12px;
        background: #fc0;
        font-family: DroidKufiBold,Arial;
        color: #1d1d1d;
        font-size: 18px;
        text-align: center;
        line-height: 2.2
    }

.caricature li a .item, .caricature li p, .media .allItems, .media ul li {
    display: inline-block
}

    .caricature li p, .media .desc p, .media ul li .secName {
        font-family: DroidKufiLight,Arial
    }

.masrawyServices li .more:hover {
    background: #eebe00
}

.media {
    padding: 12px;
    background: #1d1d1d
}

    .media .ttl {
        border-bottom: none !important
    }

        .media .ttl h2, .media .ttl h2 a {
            color: #fff !important
        }

            .media .ttl h2:after {
                background: #fff !important
            }

        .media .ttl .icon-more:before, .media .ttl .more {
            color: #fff
        }

    .media .allItems {
        width: 100%;
        padding: 5px 0 0
    }

    .media ul li {
        position: relative;
        width: calc((100% - 72px)/ 4);
        margin-left: 24px;
        float: right;
        margin-bottom: 24px;
        border: 1px solid #333
    }

        .media ul li:first-child, .media ul li:nth-child(4) {
            width: calc((100% - 24px)/ 2)
        }

        .media ul li:nth-child(3), .media ul li:nth-child(4) {
            margin-left: 0
        }

        .media ul li:nth-child(4) {
            float: left
        }

        .media ul li:nth-last-child(-n+3) {
            margin-bottom: 0
        }

        .media ul li a .imageCntnr {
            position: relative;
            overflow: hidden;
            padding-bottom: 75%
        }

        .media .desc, .media .desc p, .media ul li .secName, .media ul li a img {
            position: absolute;
            right: 0
        }

        .media ul li a img {
            top: 0;
            bottom: 0;
            left: 0;
            margin: 0 auto;
            width: 100%;
            height: 100%;
            border: none;
            -webkit-filter: brightness(100%) contrast(100%);
            -moz-filter: brightness(100%) contrast(100%);
            -o-filter: brightness(100%) contrast(100%);
            -ms-filter: brightness(100%) contrast(100%);
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .media ul li:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

    .media .desc {
        width: 100%;
        height: 50%;
        overflow: hidden;
        bottom: 0;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

        .media .desc p {
            color: #fff;
            text-align: right;
            line-height: 1.6;
            padding: 12px;
            font-size: 16px;
            bottom: 0
        }

    .media ul li .secName {
        padding: 0 10px;
        font-size: 14px;
        color: #fff;
        background: #aa120d;
        top: 0;
        z-index: 1
    }

    .media ul li:first-child .desc p, .media ul li:nth-child(4) .desc p {
        font-size: 24px;
        line-height: 1.8
    }

    .media ul li:first-child .secName, .media ul li:nth-child(4) .secName {
        font-size: 18px
    }

    .media ul li.icon-image:before, .media ul li.icon-video:before {
        color: #fff;
        font-size: 30px;
        background: rgba(0,0,0,.7);
        position: absolute;
        width: 41px;
        height: 40px;
        line-height: 1.35;
        z-index: 1;
        left: 0;
        top: 0;
        pointer-events: none
    }

    .media ul li.icon-image:before {
        content: "t"
    }

    .media ul li:first-child.icon-image:before, .media ul li:first-child.icon-video:before, .media ul li:nth-child(4).icon-image:before, .media ul li:nth-child(4).icon-video:before {
        font-size: 56px;
        width: 70px;
        height: 70px;
        line-height: 1.25
    }

.caricature {
    padding: 12px;
    width: 100%;
    margin-left: 0
}

    .caricature .ttl {
        border-bottom: 1px solid #ccc269
    }

        .caricature .ttl h2:after {
            background: #ccc269
        }

    .caricature .allItems {
        padding: 24px 0 0
    }

    .caricature li {
        width: calc((100% - 96px)/ 5);
        position: relative;
        float: right;
        margin-left: 24px
    }

        .caricature li:last-child {
            margin-left: 0
        }

        .caricature li a .imageCntnr {
            position: relative;
            overflow: hidden;
            padding-bottom: 75%
        }

            .caricature li a .imageCntnr img {
                position: absolute;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                margin: 0 auto;
                width: 100%;
                height: 100%;
                filter: brightness(100%) contrast(100%);
                -webkit-filter: brightness(100%) contrast(100%);
                -moz-filter: brightness(100%) contrast(100%);
                -o-filter: brightness(100%) contrast(100%);
                -ms-filter: brightness(100%) contrast(100%);
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0
            }

    .caricature ul li:hover img {
        filter: brightness(108%) contrast(108%);
        -webkit-filter: brightness(108%) contrast(108%);
        -moz-filter: brightness(108%) contrast(108%);
        -o-filter: brightness(108%) contrast(108%);
        -ms-filter: brightness(108%) contrast(108%)
    }

    .caricature li p {
        width: 100%;
        height: 40px;
        color: #1d1d1d;
        font-size: 14px;
        text-align: right;
        line-height: 1.6;
        margin-top: 5px
    }

    .caricature li:hover p {
        color: #888
    }

.poll {
    padding: 12px;
    width: calc(100% - 696px);
    height: 266px;
    position: relative
}

    .poll .allItems, .poll .allItems h2 {
        width: 100%;
        display: inline-block
    }

        .poll .allItems h2 {
            background: #eee;
            padding: 5px 12px;
            text-align: right;
            font-family: DroidKufiBold,Arial;
            font-size: 14px;
            color: #1d1d1d;
            margin: 12px 0
        }

        .poll .allItems input[type=radio] + label {
            font-size: 14px;
            margin: 0 5px 8px
        }

        .poll .allItems .btns .social, .poll .allItems .btns .vote {
            height: 30px;
            margin-left: 2px;
            color: #fff;
            text-align: center;
            float: right
        }

        .poll .allItems .btns {
            position: absolute;
            left: 12px;
            bottom: 12px
        }

            .poll .allItems .btns .vote {
                width: 100px;
                background: #aa120d;
                font-family: DroidKufiLight,Arial;
                font-size: 14px;
                line-height: 2.2
            }

                .poll .allItems .btns .vote:hover {
                    background: #940500
                }

            .poll .allItems .btns .social {
                width: 30px
            }

                .poll .allItems .btns .social:last-child {
                    margin-left: 0
                }

            .poll .allItems .btns .icon-fb {
                background: #3c5899
            }

                .poll .allItems .btns .icon-fb:hover {
                    background: #2c4582
                }

                .poll .allItems .btns .icon-fb:before {
                    content: "u";
                    font-size: 20px;
                    line-height: 1.6
                }

            .poll .allItems .btns .icon-tw {
                background: #229ff3
            }

                .poll .allItems .btns .icon-tw:hover {
                    background: #178cd7
                }

                .poll .allItems .btns .icon-tw:before {
                    content: "v";
                    font-size: 20px;
                    line-height: 1.6
                }

.cd-articles::before {
    content: 'desktop';
    display: none
}

.cd-articles article {
    padding: 0;
    margin-top: 24px
}

    .cd-articles article:first-child {
        margin-top: 0
    }

    .cd-articles article:last-of-type {
        border-bottom: none
    }

.breadcrumb {
    display: inline-block;
    width: 100%;
    background: #f2f2f2;
    padding: 5px 24px;
    margin-bottom: 24px
}

    .breadcrumb li {
        display: inline-block;
        float: right
    }

        .breadcrumb li a {
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #1d1d1d;
            direction: rtl
        }

            .breadcrumb li a:after {
                content: "D";
                display: inline-block;
                float: left;
                margin: 0 15px;
                font-size: 18px
            }

        .breadcrumb li:last-child a:after {
            display: none
        }

        .breadcrumb li.active a {
            color: #aa120d
        }

article .articleHeader {
    display: inline-block;
    width: 100%;
    margin-bottom: 24px
}

    article .articleHeader h2 {
        font-family: DroidKufiBold,Arial;
        font-size: 34px;
        color: #1d1d1d;
        direction: rtl;
        margin-bottom: 12px;
        line-height: 1.6
    }

    article .articleHeader .time {
        display: inline-block;
        width: 100%;
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #888;
        float: right;
        direction: rtl
    }

        article .articleHeader .time span:last-child:after, article .imgDiv.crctr .desc {
            display: none
        }

    article .articleHeader .icon-time:before {
        content: "C";
        float: right;
        margin-left: 5px;
        font-size: 20px;
        line-height: 1.5
    }

    article .articleHeader .time span {
        margin-left: 24px;
        position: relative;
        float: right
    }

        article .articleHeader .time span:after {
            content: "";
            position: absolute;
            left: -12px;
            top: 8px;
            width: 1px;
            height: 16px;
            background: #888
        }

article .imgDiv {
    margin: 0 auto 24px;
    overflow: hidden;
    width: calc(100% - 72px);
    position: relative;
    max-width: 733px
}

    article .imgDiv .imageCntnr {
        padding-bottom: 75%;
        float: right;
        max-width: 733px;
        width: 100%;
        position: relative
    }

        article .imgDiv .imageCntnr img {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0
        }

    article .imgDiv .desc {
        width: 100%;
        height: 50%;
        overflow: hidden;
        cursor: pointer;
        position: absolute;
        bottom: 0;
        right: 0;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

        article .imgDiv .desc p {
            color: #fff;
            text-align: right;
            line-height: 1.6;
            padding: 12px;
            font-size: 12px;
            font-family: DroidKufiLight,Arial;
            position: absolute;
            bottom: 0;
            right: 0
        }

article .details li, article .writeBy p {
    font-family: DroidKufiLight,Arial;
    font-size: 16px
}

article .writeBy {
    display: inline-block;
    width: 100%
}

    article .writeBy .writerImg {
        float: right;
        margin-left: 12px;
        width: 50px;
        height: 50px
    }

        article .writeBy .writerImg img {
            width: 50px;
            height: auto
        }

    article .writeBy p {
        float: right;
        color: #888;
        direction: rtl;
        line-height: 3
    }

article p {
    cursor: default
}

article .details {
    direction: rtl;
    margin-bottom: 40px
}

    article .details, article .details h3, article .details p {
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #1d1d1d !important;
        text-align: right !important;
        line-height: 2.2;
        margin: 15px 0;
        display: inline-block;
        width: 100%
    }

        article .details ul {
            display: inline-block;
            width: 100%;
            padding-right: 36px
        }

        article .details li {
            list-style-type: square;
            display: list-item;
            margin: 15px 0;
            width: 100%;
            color: #1d1d1d;
            text-align: right;
            direction: rtl;
            cursor: default;
            font-style: italic
        }

        article .details h3 {
            font-family: DroidKufiBold,Arial
        }

        article .details p a {
            color: #777;
            position: relative
        }

            article .details p a:before {
                content: "";
                height: 1px;
                background: #777;
                width: 100%;
                position: absolute;
                right: 0;
                bottom: 1px
            }

        article .details p .kwhd {
            white-space: nowrap
        }

            article .details p .kwhd:before {
                width: calc(100% - 12px);
                right: 6px
            }

        article .details iframe, article .details img {
            margin: 40px;
            width: 600px
        }

        article .details img {
            height: auto
        }

        article .details iframe {
            height: 450px
        }

        article .details blockquote {
            display: inline-block;
            position: relative;
            width: 100%;
            margin: 15px 0;
            padding: 36px 24px 0 0;
            border-right: 3px solid #ccc
        }

            article .details blockquote:before {
                content: "E";
                font-size: 36px;
                line-height: 1;
                color: #ccc;
                position: absolute;
                top: 0;
                right: 24px;
                -moz-transform: scaleX(-1);
                -o-transform: scaleX(-1);
                -webkit-transform: scaleX(-1);
                transform: scaleX(-1);
                filter: FlipH;
                -ms-filter: FlipH
            }

.catPattern01 ul li a img, .catPattern02 ul li a img {
    filter: brightness(100%) contrast(100%);
    border: 1px solid #ddd
}

article .details blockquote p {
    font-style: italic;
    color: #aaa !important
}

article .pagination {
    display: inline-block;
    width: 100%;
    text-align: center;
    margin-bottom: 40px
}

    article .pagination ul {
        margin: 0 auto;
        text-align: center;
        border: 1px solid #ddd;
        display: inline-block
    }

        article .pagination ul li {
            float: right;
            border-left: 1px solid #ddd;
            margin: 0
        }

            article .pagination ul li:nth-child(5n), article .pagination ul:first-child li, article .pagination ul:last-child li {
                border-left: 0
            }

            article .pagination ul li .dots, article .pagination ul li a {
                display: block;
                overflow: hidden;
                width: 50px;
                background: #fff;
                height: 50px;
                text-align: center;
                font-family: Arial;
                font-size: 18px;
                color: #1d1d1d;
                line-height: 2.8
            }

                article .pagination ul li .dots:hover, article .pagination ul li a:hover, article .pagination ul li.current a {
                    background: #eee
                }

            article .pagination ul li.nextPrev a {
                width: 100px;
                font-family: DroidKufiLight,Arial;
                font-size: 14px
            }

article .nextLink h2, article .provider h2 {
    font-family: DroidKufiBold,Arial;
    color: #1d1d1d;
    float: right
}

article .pagination ul li.nextPrev .icon-prev:before {
    content: "r";
    font-size: 22px;
    display: block;
    width: 100%;
    height: 50px;
    line-height: 2.3;
    transform: translateY(0);
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

article .pagination ul li.nextPrev .icon-next:before, article .pagination ul li.nextPrev a .prev {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transition: all .2s ease-in-out 0;
    display: block;
    height: 50px;
    width: 100%
}

article .pagination ul li.nextPrev a .prev {
    line-height: 3.5;
    transform: translateY(0);
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

article .pagination ul li.nextPrev .icon-prev:hover:before, article .pagination ul li.nextPrev a:hover .prev {
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    -o-transform: translateY(-50px);
    transform: translateY(-50px)
}

article .pagination ul li.nextPrev .icon-next:before {
    content: "q";
    font-size: 22px;
    line-height: 2.3;
    transform: translateY(0);
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

article .pagination ul li.nextPrev a .next {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 3.5;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

article .pagination ul li.nextPrev .icon-next:hover:before, article .pagination ul li.nextPrev a:hover .next {
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    -o-transform: translateY(-50px);
    transform: translateY(-50px)
}

article .provider {
    display: inline-block;
    width: 100%;
    margin-bottom: 40px
}

    article .provider h2 {
        font-size: 16px;
        margin-left: 10px;
        width: 130px;
        line-height: 2.5
    }

    article .provider .providerImg {
        float: right;
        width: calc(100% - 140px);
        height: 40px;
        text-align: right
    }

        article .provider .providerImg img {
            width: auto;
            height: 40px
        }

article .keywordsDiv, article .nextLink {
    width: 100%;
    margin-bottom: 40px;
    display: inline-block
}

article .nextLink {
    border-bottom: 1px solid #ddd;
    padding-bottom: 40px
}

    article .nextLink h2 {
        font-size: 16px;
        margin-left: 5px
    }

    article .nextLink a {
        float: right;
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #aa120d;
        position: relative;
        direction: rtl;
        text-align: right
    }

article .keywordsDiv .item {
    float: right;
    padding: 2px 20px;
    background: #eee;
    margin: 0 0 24px 24px;
    font-family: DroidKufiLight,Arial;
    font-size: 14px;
    color: #1d1d1d
}

.newsPointer, article .pattern01 {
    padding: 0;
    border-bottom: 1px solid #ddd;
    box-shadow: none
}

article .keywordsDiv .item:hover {
    background: #e2e2e2
}

article .pattern01 {
    float: none
}

    article .pattern01 ul li {
        width: calc((100% - 72px)/ 4)
    }

        article .pattern01 ul li:last-child {
            margin-left: 0
        }

article .nwsPntrSC {
    display: inline-block;
    width: 100%
}

.newsPointer {
    width: calc(100% - 324px);
    height: 266px;
    margin-bottom: 40px;
    overflow: hidden
}

    .newsPointer .allItems {
        padding: 12px 0
    }

        .newsPointer .allItems ul {
            display: inline-block;
            width: 100%;
            overflow: hidden;
            text-align: center
        }

            .newsPointer .allItems ul iframe {
                text-align: center
            }

            .newsPointer .allItems ul li {
                display: block;
                width: 100%;
                height: 52px;
                border-bottom: 1px solid #eee;
                padding: 10px 0
            }

                .newsPointer .allItems ul li:last-child {
                    border-bottom: 0
                }

                .newsPointer .allItems ul li .trendDiv {
                    float: right;
                    width: 72px;
                    height: 32px;
                    border: 1px solid #ddd;
                    display: inline-block;
                    margin-left: 10px
                }

                    .newsPointer .allItems ul li .trendDiv .trendImg {
                        width: 30px;
                        height: 30px;
                        float: right;
                        display: inline-block;
                        text-align: center
                    }

                        .newsPointer .allItems ul li .trendDiv .trendImg img {
                            width: 18px;
                            height: 18px;
                            border: none;
                            margin-top: 6px
                        }

                    .newsPointer .allItems ul li .trendDiv .vstrs {
                        float: right;
                        display: inline-block;
                        text-align: center;
                        background: #ddd;
                        width: 40px;
                        height: 30px;
                        font-family: Arial;
                        color: #1d1d1d;
                        font-size: 12px;
                        line-height: 2.8
                    }

                .newsPointer .allItems ul li .news {
                    float: right;
                    display: block;
                    font-family: DroidKufiLight,arial;
                    color: #1d1d1d;
                    font-size: 13px;
                    width: calc(100% - 82px);
                    padding: 0;
                    text-align: right;
                    height: 32px;
                    line-height: 2.4;
                    overflow: hidden
                }

.demo-gallery > ul > li, .demo-gallery > ul > li img {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.newsPointer .allItems ul .leaderboardDiv {
    margin: 40px 0
}

article .fbComments {
    padding: 0;
    border-bottom: 1px solid #ddd;
    box-shadow: none;
    float: none
}

article .leaderboardDiv {
    float: none;
    margin-bottom: 40px
}

.demo-gallery {
    padding-bottom: 75%;
    float: right;
    max-width: 733px;
    width: 100%;
    position: relative
}

.articleCntnt .demo-gallery ul li::before {
    display: none
}

.demo-gallery > ul {
    margin-bottom: 0;
    padding-right: 0
}

    .demo-gallery > ul > li {
        display: none;
        position: absolute
    }

        .demo-gallery > ul > li a, .demo-gallery > ul > li:first-child {
            display: block
        }

        .demo-gallery > ul > li img {
            position: absolute
        }

        .demo-gallery > ul > li .showGal {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -20px;
            margin-left: -75px;
            background: rgba(0,0,0,.8);
            width: 150px;
            height: 40px;
            padding: 0 10px;
            font-family: DroidKufiLight,Arial;
            color: #fff;
            font-size: 14px;
            z-index: 9;
            line-height: 2.8
        }

        .demo-gallery > ul > li .icon-camera:before {
            content: "t";
            font-size: 22px;
            color: #fff;
            float: right;
            margin-left: 10px;
            line-height: 1.8
        }

        .demo-gallery > ul > li a > img {
            -webkit-transition: -webkit-transform .15s ease 0;
            -moz-transition: -moz-transform .15s ease 0;
            -o-transition: -o-transform .15s ease 0;
            transition: transform .15s ease 0;
            -webkit-transform: scale3d(1,1,1);
            transform: scale3d(1,1,1);
            height: 100%;
            width: 100%
        }

        .demo-gallery > ul > li a:hover > img {
            -webkit-transform: scale3d(1.1,1.1,1.1);
            transform: scale3d(1.1,1.1,1.1)
        }

        .demo-gallery > ul > li a:hover .demo-gallery-poster > img {
            opacity: 1
        }

        .demo-gallery > ul > li a .demo-gallery-poster {
            background-color: rgba(0,0,0,.1);
            bottom: 0;
            left: 0;
            position: absolute;
            right: 0;
            top: 0;
            -webkit-transition: background-color .15s ease 0;
            -o-transition: background-color .15s ease 0;
            transition: background-color .15s ease 0
        }

            .demo-gallery > ul > li a .demo-gallery-poster > img {
                left: 50%;
                margin-left: -10px;
                margin-top: -10px;
                opacity: 0;
                position: absolute;
                top: 50%;
                -webkit-transition: opacity .3s ease 0;
                -o-transition: opacity .3s ease 0;
                transition: opacity .3s ease 0
            }

        .demo-gallery > ul > li a:hover .demo-gallery-poster {
            background-color: rgba(0,0,0,.5)
        }

.demo-gallery .justified-gallery > a > img {
    -webkit-transition: -webkit-transform .15s ease 0;
    -moz-transition: -moz-transform .15s ease 0;
    -o-transition: -o-transform .15s ease 0;
    transition: transform .15s ease 0;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
    height: 100%;
    width: 100%
}

.demo-gallery .justified-gallery > a:hover > img {
    -webkit-transform: scale3d(1.1,1.1,1.1);
    transform: scale3d(1.1,1.1,1.1)
}

.demo-gallery .justified-gallery > a:hover .demo-gallery-poster > img {
    opacity: 1
}

.demo-gallery .justified-gallery > a .demo-gallery-poster {
    background-color: rgba(0,0,0,.1);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: background-color .15s ease 0;
    -o-transition: background-color .15s ease 0;
    transition: background-color .15s ease 0
}

    .demo-gallery .justified-gallery > a .demo-gallery-poster > img {
        left: 50%;
        margin-left: -10px;
        margin-top: -10px;
        opacity: 0;
        position: absolute;
        top: 50%;
        -webkit-transition: opacity .3s ease 0;
        -o-transition: opacity .3s ease 0;
        transition: opacity .3s ease 0
    }

.demo-gallery .justified-gallery > a:hover .demo-gallery-poster {
    background-color: rgba(0,0,0,.5)
}

.demo-gallery .video .demo-gallery-poster img {
    height: 48px;
    margin-left: -24px;
    margin-top: -24px;
    opacity: .8;
    width: 48px
}

.demo-gallery.dark > ul > li a {
    border: 3px solid #04070a
}

.lg-actions .lg-next, .lg-actions .lg-prev {
    background-color: rgba(0,0,0,.45);
    border-radius: 2px;
    color: #999;
    cursor: pointer;
    display: block;
    font-size: 22px;
    margin-top: -21px;
    padding: 8px 10px 9px;
    position: absolute;
    top: 50%;
    z-index: 1080
}

    .lg-actions .lg-next.disabled, .lg-actions .lg-prev.disabled {
        pointer-events: none;
        opacity: .5
    }

    .lg-actions .lg-next:hover, .lg-actions .lg-prev:hover {
        color: #FFF
    }

.lg-actions .lg-next {
    right: 0
}

    .lg-actions .lg-next:before {
        content: "r";
        font-size: 32px
    }

.lg-actions .lg-prev {
    left: 0
}

    .lg-actions .lg-prev:after {
        content: "q";
        font-size: 32px
    }

@-webkit-keyframes lg-right-end {
    0%,100% {
        left: 0
    }

    50% {
        left: -30px
    }
}

@-moz-keyframes lg-right-end {
    0%,100% {
        left: 0
    }

    50% {
        left: -30px
    }
}

@-ms-keyframes lg-right-end {
    0%,100% {
        left: 0
    }

    50% {
        left: -30px
    }
}

@keyframes lg-right-end {
    0%,100% {
        left: 0
    }

    50% {
        left: -30px
    }
}

@-webkit-keyframes lg-left-end {
    0%,100% {
        left: 0
    }

    50% {
        left: 30px
    }
}

@-moz-keyframes lg-left-end {
    0%,100% {
        left: 0
    }

    50% {
        left: 30px
    }
}

@-ms-keyframes lg-left-end {
    0%,100% {
        left: 0
    }

    50% {
        left: 30px
    }
}

@keyframes lg-left-end {
    0%,100% {
        left: 0
    }

    50% {
        left: 30px
    }
}

.lg-outer.lg-right-end .lg-object {
    -webkit-animation: lg-right-end .3s;
    -o-animation: lg-right-end .3s;
    animation: lg-right-end .3s;
    position: relative
}

.lg-outer.lg-left-end .lg-object {
    -webkit-animation: lg-left-end .3s;
    -o-animation: lg-left-end .3s;
    animation: lg-left-end .3s;
    position: relative
}

.lg-toolbar {
    z-index: 1082;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    background-color: rgba(0,0,0,.45)
}

    .lg-toolbar .lg-icon {
        color: #999;
        cursor: pointer;
        float: right;
        font-size: 24px;
        height: 47px;
        line-height: 27px;
        padding: 5px 0;
        text-align: center;
        width: 50px;
        text-decoration: none !important;
        outline: 0;
        -webkit-transition: color .2s linear;
        -o-transition: color .2s linear;
        transition: color .2s linear
    }

        .lg-toolbar .lg-icon:hover {
            color: #FFF
        }

    .lg-toolbar .lg-close:after {
        content: "O"
    }

    .lg-toolbar .lg-download {
        display: none
    }

.lg-sub-html {
    background-color: rgba(0,0,0,.8);
    bottom: 0;
    color: #EEE;
    font-size: 16px;
    left: 0;
    padding: 10px 40px;
    position: fixed;
    right: 0;
    text-align: center;
    z-index: 1080
}

    .lg-sub-html p {
        font-size: 14px;
        margin: 5px 0 0;
        font-family: DroidKufiLight,arial;
        line-height: 1.8;
        text-align: center
    }

#lg-counter {
    color: #999;
    display: inline-block;
    font-size: 20px;
    padding-left: 20px;
    padding-top: 14px;
    vertical-align: middle;
    font-family: arial
}

.lg-next, .lg-prev, .lg-toolbar {
    opacity: 1;
    -webkit-transition: -webkit-transform .35s cubic-bezier(0,0,.25,1) 0s,opacity .35s cubic-bezier(0,0,.25,1) 0s,color .2s linear;
    -moz-transition: -moz-transform .35s cubic-bezier(0,0,.25,1) 0s,opacity .35s cubic-bezier(0,0,.25,1) 0s,color .2s linear;
    -o-transition: -o-transform .35s cubic-bezier(0,0,.25,1) 0s,opacity .35s cubic-bezier(0,0,.25,1) 0s,color .2s linear;
    transition: transform .35s cubic-bezier(0,0,.25,1) 0s,opacity .35s cubic-bezier(0,0,.25,1) 0s,color .2s linear
}

.lg-hide-items .lg-prev {
    opacity: 0;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0)
}

.lg-hide-items .lg-next {
    opacity: 0;
    -webkit-transform: translate3d(10px,0,0);
    transform: translate3d(10px,0,0)
}

.lg-hide-items .lg-toolbar {
    opacity: 0;
    -webkit-transform: translate3d(0,-10px,0);
    transform: translate3d(0,-10px,0)
}

body:not(.lg-from-hash) .lg-outer.lg-start-zoom .lg-object {
    -webkit-transform: scale3d(.5,.5,.5);
    transform: scale3d(.5,.5,.5);
    opacity: 0;
    -webkit-transition: -webkit-transform 250ms cubic-bezier(0,0,.25,1) 0s,opacity 250ms cubic-bezier(0,0,.25,1) !important;
    -moz-transition: -moz-transform 250ms cubic-bezier(0,0,.25,1) 0s,opacity 250ms cubic-bezier(0,0,.25,1) !important;
    -o-transition: -o-transform 250ms cubic-bezier(0,0,.25,1) 0s,opacity 250ms cubic-bezier(0,0,.25,1) !important;
    transition: transform 250ms cubic-bezier(0,0,.25,1) 0s,opacity 250ms cubic-bezier(0,0,.25,1) !important;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

body:not(.lg-from-hash) .lg-outer.lg-start-zoom .lg-item.lg-complete .lg-object {
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
    opacity: 1;
    border: 1px solid #333
}

.lg-outer .lg-thumb-outer {
    background-color: #0D0A0A;
    bottom: 0;
    position: absolute;
    width: 100%;
    z-index: 1080;
    max-height: 350px;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    -webkit-transition: -webkit-transform .25s cubic-bezier(0,0,.25,1) 0;
    -moz-transition: -moz-transform .25s cubic-bezier(0,0,.25,1) 0;
    -o-transition: -o-transform .25s cubic-bezier(0,0,.25,1) 0;
    transition: transform .25s cubic-bezier(0,0,.25,1) 0
}

    .lg-outer .lg-thumb-outer.lg-grab .lg-thumb-item {
        cursor: -webkit-grab;
        cursor: -moz-grab;
        cursor: -o-grab;
        cursor: -ms-grab;
        cursor: grab
    }

    .lg-outer .lg-thumb-outer.lg-grabbing .lg-thumb-item {
        cursor: move;
        cursor: -webkit-grabbing;
        cursor: -moz-grabbing;
        cursor: -o-grabbing;
        cursor: -ms-grabbing;
        cursor: grabbing
    }

    .lg-outer .lg-thumb-outer.lg-dragging .lg-thumb {
        -webkit-transition-duration: 0 !important;
        transition-duration: 0 !important
    }

.lg-outer.lg-thumb-open .lg-thumb-outer {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.lg-outer .lg-thumb {
    padding: 10px 0;
    height: 100%;
    margin-bottom: -5px
}

.lg-outer .lg-thumb-item {
    cursor: pointer;
    float: left;
    overflow: hidden;
    height: 100%;
    border: 2px solid #FFF;
    border-radius: 4px;
    margin-bottom: 5px
}

@media (min-width:1025px) {
    .lg-outer .lg-thumb-item {
        -webkit-transition: border-color .25s ease;
        -o-transition: border-color .25s ease;
        transition: border-color .25s ease
    }
}

.lg-outer .lg-thumb-item.active, .lg-outer .lg-thumb-item:hover {
    border-color: #a90707
}

.lg-outer .lg-thumb-item img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.lg-outer.lg-has-thumb .lg-item {
    padding-bottom: 120px
}

.lg-outer.lg-can-toggle .lg-item {
    padding-bottom: 0
}

.lg-outer.lg-pull-caption-up .lg-sub-html {
    -webkit-transition: bottom .25s ease;
    -o-transition: bottom .25s ease;
    transition: bottom .25s ease
}

.lg-outer.lg-pull-caption-up.lg-thumb-open .lg-sub-html {
    bottom: 100px
}

.lg-outer .lg-toogle-thumb {
    background-color: #0D0A0A;
    border-radius: 2px 2px 0 0;
    color: #999;
    cursor: pointer;
    font-size: 24px;
    height: 39px;
    line-height: 27px;
    padding: 5px 0;
    position: absolute;
    right: 20px;
    text-align: center;
    top: -39px;
    width: 50px
}

    .lg-outer .lg-toogle-thumb:after {
        content: "\e1ff"
    }

    .lg-outer .lg-toogle-thumb:hover {
        color: #FFF
    }

.lg-outer .lg-video-cont {
    display: inline-block;
    vertical-align: middle;
    max-width: 1140px;
    max-height: 100%;
    width: 100%;
    padding: 0 5px
}

.lg-outer .lg-video {
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
    position: relative
}

    .lg-outer .lg-video .lg-object {
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important
    }

    .lg-outer .lg-video .lg-video-play {
        width: 84px;
        height: 59px;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -42px;
        margin-top: -30px;
        z-index: 1080;
        cursor: pointer
    }

.lg-outer .lg-has-vimeo .lg-video-play {
    background: url(http://www.masrawy.com/img/vimeo-play.png) no-repeat
}

.lg-outer .lg-has-vimeo:hover .lg-video-play {
    background: url(http://www.masrawy.com/img/vimeo-play.png) 0 -58px no-repeat
}

.lg-outer .lg-has-html5 .lg-video-play {
    background: url(http://www.masrawy.com/img/video-play.png) no-repeat;
    height: 64px;
    margin-left: -32px;
    margin-top: -32px;
    width: 64px;
    opacity: .8
}

.lg-outer .lg-has-html5:hover .lg-video-play {
    opacity: 1
}

.lg-outer .lg-has-youtube .lg-video-play {
    background: url(http://www.masrawy.com/img/youtube-play.png) no-repeat
}

.lg-outer .lg-has-youtube:hover .lg-video-play {
    background: url(http://www.masrawy.com/img/youtube-play.png) 0 -60px no-repeat
}

.lg-outer .lg-video-object {
    width: 100% !important;
    height: 100% !important;
    position: absolute;
    top: 0;
    left: 0
}

.lg-outer .lg-has-video .lg-video-object {
    visibility: hidden
}

.lg-outer .lg-has-video.lg-video-playing .lg-object, .lg-outer .lg-has-video.lg-video-playing .lg-video-play {
    display: none
}

.lg-outer .lg-has-video.lg-video-playing .lg-video-object {
    visibility: visible
}

.lg-progress-bar {
    background-color: #333;
    height: 5px;
    right: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1083;
    opacity: 0;
    -webkit-transition: opacity 80ms ease 0;
    -moz-transition: opacity 80ms ease 0;
    -o-transition: opacity 80ms ease 0;
    transition: opacity 80ms ease 0
}

    .lg-progress-bar .lg-progress {
        background-color: #c31717;
        height: 5px;
        width: 0;
        float: right
    }

    .lg-progress-bar.lg-start .lg-progress {
        width: 100%
    }

.lg-show-autoplay .lg-progress-bar {
    opacity: 1
}

.lg-autoplay-button:after {
    content: "P"
}

.lg-show-autoplay .lg-autoplay-button:after {
    content: "Q"
}

.lg-outer.lg-css3.lg-zoom-dragging .lg-item.lg-complete.lg-zoomable .lg-image, .lg-outer.lg-css3.lg-zoom-dragging .lg-item.lg-complete.lg-zoomable .lg-img-wrap {
    -webkit-transition-duration: 0;
    transition-duration: 0
}

.lg-outer .lg-item.lg-complete.lg-zoomable .lg-img-wrap {
    -webkit-transition: left .3s cubic-bezier(0,0,.25,1) 0s,top .3s cubic-bezier(0,0,.25,1) 0;
    -moz-transition: left .3s cubic-bezier(0,0,.25,1) 0s,top .3s cubic-bezier(0,0,.25,1) 0;
    -o-transition: left .3s cubic-bezier(0,0,.25,1) 0s,top .3s cubic-bezier(0,0,.25,1) 0;
    transition: left .3s cubic-bezier(0,0,.25,1) 0s,top .3s cubic-bezier(0,0,.25,1) 0;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden
}

.lg-outer .lg-item.lg-complete.lg-zoomable .lg-image {
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
    -webkit-transition: -webkit-transform .3s cubic-bezier(0,0,.25,1) 0s,opacity .15s !important;
    -moz-transition: -moz-transform .3s cubic-bezier(0,0,.25,1) 0s,opacity .15s !important;
    -o-transition: -o-transform .3s cubic-bezier(0,0,.25,1) 0s,opacity .15s !important;
    transition: transform .3s cubic-bezier(0,0,.25,1) 0s,opacity .15s !important;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden
}

#lg-zoom-in:after {
    content: "\e311"
}

#lg-actual-size {
    font-size: 20px
}

    #lg-actual-size:after {
        content: "\e033"
    }

#lg-zoom-out {
    opacity: .5;
    pointer-events: none
}

    #lg-zoom-out:after {
        content: "\e312"
    }

.lg-zoomed #lg-zoom-out {
    opacity: 1;
    pointer-events: auto
}

.lg-outer .lg-pager-outer {
    bottom: 60px;
    left: 0;
    position: absolute;
    right: 0;
    text-align: center;
    z-index: 1080;
    height: 10px
}

    .lg-outer .lg-pager-outer.lg-pager-hover .lg-pager-cont {
        overflow: visible
    }

.lg-outer .lg-pager-cont {
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    position: relative;
    vertical-align: top;
    margin: 0 5px
}

    .lg-outer .lg-pager-cont:hover .lg-pager-thumb-cont {
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    .lg-outer .lg-pager-cont.lg-pager-active .lg-pager {
        box-shadow: 0 0 0 2px #fff inset
    }

.lg-outer .lg-pager-thumb-cont {
    background-color: #fff;
    color: #FFF;
    bottom: 100%;
    height: 83px;
    left: 0;
    margin-bottom: 20px;
    margin-left: -60px;
    opacity: 0;
    padding: 5px;
    position: absolute;
    width: 120px;
    border-radius: 3px;
    -webkit-transition: opacity .15s ease 0s,-webkit-transform .15s ease 0;
    -moz-transition: opacity .15s ease 0s,-moz-transform .15s ease 0;
    -o-transition: opacity .15s ease 0s,-o-transform .15s ease 0;
    transition: opacity .15s ease 0s,transform .15s ease 0;
    -webkit-transform: translate3d(0,5px,0);
    transform: translate3d(0,5px,0)
}

    .lg-outer .lg-pager-thumb-cont img {
        width: 100%;
        height: 100%
    }

.lg-outer .lg-pager {
    background-color: rgba(255,255,255,.5);
    border-radius: 50%;
    box-shadow: 0 0 0 8px rgba(255,255,255,.7) inset;
    display: block;
    height: 12px;
    -webkit-transition: box-shadow .3s ease 0;
    -o-transition: box-shadow .3s ease 0;
    transition: box-shadow .3s ease 0;
    width: 12px
}

    .lg-outer .lg-pager:focus, .lg-outer .lg-pager:hover {
        box-shadow: 0 0 0 8px #fff inset
    }

.lg-outer .lg-caret {
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px dashed;
    bottom: -10px;
    display: inline-block;
    height: 0;
    left: 50%;
    margin-left: -5px;
    position: absolute;
    vertical-align: middle;
    width: 0
}

.lg-outer, .lg-outer .lg, .lg-outer .lg-inner {
    width: 100%;
    height: 100%
}

.lg-fullscreen:after {
    content: "\e20c"
}

.lg-fullscreen-on .lg-fullscreen:after {
    content: "\e20d"
}

.group:after, .group:before {
    display: table;
    content: "";
    line-height: 0
}

.group:after {
    clear: both
}

.lg-outer {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    opacity: 0;
    -webkit-transition: opacity .15s ease 0;
    -o-transition: opacity .15s ease 0;
    transition: opacity .15s ease 0
}

    .lg-outer * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .lg-outer.lg-visible {
        opacity: 1
    }

    .lg-outer.lg-css3 .lg-item.lg-current, .lg-outer.lg-css3 .lg-item.lg-next-slide, .lg-outer.lg-css3 .lg-item.lg-prev-slide {
        -webkit-transition-duration: inherit !important;
        transition-duration: inherit !important;
        -webkit-transition-timing-function: inherit !important;
        transition-timing-function: inherit !important
    }

    .lg-outer.lg-css3.lg-dragging .lg-item.lg-current, .lg-outer.lg-css3.lg-dragging .lg-item.lg-next-slide, .lg-outer.lg-css3.lg-dragging .lg-item.lg-prev-slide {
        -webkit-transition-duration: 0 !important;
        transition-duration: 0 !important;
        opacity: 1
    }

    .lg-outer.lg-grab img.lg-object {
        cursor: -webkit-grab;
        cursor: -moz-grab;
        cursor: -o-grab;
        cursor: -ms-grab;
        cursor: grab
    }

    .lg-outer.lg-grabbing img.lg-object {
        cursor: move;
        cursor: -webkit-grabbing;
        cursor: -moz-grabbing;
        cursor: -o-grabbing;
        cursor: -ms-grabbing;
        cursor: grabbing
    }

    .lg-outer .lg {
        position: relative;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
        max-height: 100%
    }

    .lg-outer .lg-inner {
        position: absolute;
        left: 0;
        top: 0;
        white-space: nowrap
    }

    .lg-outer .lg-item {
        display: none !important
    }

    .lg-outer.lg-css .lg-current, .lg-outer.lg-css3 .lg-current, .lg-outer.lg-css3 .lg-next-slide, .lg-outer.lg-css3 .lg-prev-slide {
        display: inline-block !important
    }

    .lg-outer .lg-img-wrap, .lg-outer .lg-item {
        display: inline-block;
        text-align: center;
        position: absolute;
        width: 100%;
        height: 100%
    }

        .lg-outer .lg-img-wrap:before, .lg-outer .lg-item:before {
            content: "";
            display: inline-block;
            height: 50%;
            width: 1px;
            margin-right: -1px
        }

    .lg-outer .lg-img-wrap {
        position: absolute;
        padding: 0 5px;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0
    }

    .lg-outer .lg-item.lg-complete {
        background-image: none
    }

    .lg-outer .lg-item.lg-current {
        z-index: 1060
    }

    .lg-outer .lg-image {
        display: inline-block;
        vertical-align: middle;
        max-width: 100%;
        max-height: 100%;
        width: auto !important;
        height: auto !important
    }

    .lg-on .component, .lg-on .headerBtns, .lg-on header, .lg-outer .lg-empty-html, .lg-outer.lg-hide-download #lg-download {
        display: none
    }

    .lg-outer.lg-show-after-load .lg-item .lg-object, .lg-outer.lg-show-after-load .lg-item .lg-video-play {
        opacity: 0;
        -webkit-transition: opacity .15s ease 0;
        -o-transition: opacity .15s ease 0;
        transition: opacity .15s ease 0
    }

    .lg-outer.lg-show-after-load .lg-item.lg-complete .lg-object, .lg-outer.lg-show-after-load .lg-item.lg-complete .lg-video-play {
        opacity: 1
    }

.lg-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1040;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity .15s ease 0;
    -o-transition: opacity .15s ease 0;
    transition: opacity .15s ease 0
}

    .lg-backdrop.in {
        opacity: 1
    }

.lg-css3.lg-no-trans .lg-current, .lg-css3.lg-no-trans .lg-next-slide, .lg-css3.lg-no-trans .lg-prev-slide {
    -webkit-transition: none 0 ease 0 !important;
    -moz-transition: none 0 ease 0 !important;
    -o-transition: none 0 ease 0 !important;
    transition: none 0 ease 0 !important
}

.lg-css3.lg-use-css3 .lg-item, .lg-css3.lg-use-left .lg-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden
}

.lg-css3.lg-fade .lg-item {
    opacity: 0
}

    .lg-css3.lg-fade .lg-item.lg-current {
        opacity: 1
    }

    .lg-css3.lg-fade .lg-item.lg-current, .lg-css3.lg-fade .lg-item.lg-next-slide, .lg-css3.lg-fade .lg-item.lg-prev-slide {
        -webkit-transition: opacity .1s ease 0;
        -moz-transition: opacity .1s ease 0;
        -o-transition: opacity .1s ease 0;
        transition: opacity .1s ease 0
    }

.lg-css3.lg-slide.lg-use-css3 .lg-item {
    opacity: 0
}

    .lg-css3.lg-slide.lg-use-css3 .lg-item.lg-prev-slide {
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0)
    }

    .lg-css3.lg-slide.lg-use-css3 .lg-item.lg-next-slide {
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }

    .lg-css3.lg-slide.lg-use-css3 .lg-item.lg-current {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }

    .lg-css3.lg-slide.lg-use-css3 .lg-item.lg-current, .lg-css3.lg-slide.lg-use-css3 .lg-item.lg-next-slide, .lg-css3.lg-slide.lg-use-css3 .lg-item.lg-prev-slide {
        -webkit-transition: -webkit-transform 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0;
        -moz-transition: -moz-transform 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0;
        -o-transition: -o-transform 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0;
        transition: transform 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0
    }

.lg-css3.lg-slide.lg-use-left .lg-item {
    opacity: 0;
    position: absolute;
    left: 0
}

    .lg-css3.lg-slide.lg-use-left .lg-item.lg-prev-slide {
        left: -100%
    }

    .lg-css3.lg-slide.lg-use-left .lg-item.lg-next-slide {
        left: 100%
    }

    .lg-css3.lg-slide.lg-use-left .lg-item.lg-current {
        left: 0;
        opacity: 1
    }

    .lg-css3.lg-slide.lg-use-left .lg-item.lg-current, .lg-css3.lg-slide.lg-use-left .lg-item.lg-next-slide, .lg-css3.lg-slide.lg-use-left .lg-item.lg-prev-slide {
        -webkit-transition: left 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0;
        -moz-transition: left 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0;
        -o-transition: left 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0;
        transition: left 1s cubic-bezier(0,0,.25,1) 0s,opacity .1s ease 0
    }

.lg-item iframe {
    overflow: hidden;
    padding: 0;
    margin: 0;
    width: 300px;
    height: 266px;
    position: relative;
    top: 133px
}

.repeatDiv {
    display: block;
    width: 600px;
    padding: 45px 20px;
    height: 100%;
    position: absolute;
    left: 50%;
    margin-left: -300px;
    top: 0
}

    .repeatDiv .repeatAlbum {
        display: block;
        width: 100%;
        margin-bottom: 20px;
        text-align: center
    }

        .repeatDiv .repeatAlbum p {
            display: block;
            color: #fff;
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            text-align: center
        }

        .repeatDiv .repeatAlbum .icon-repeat:before {
            content: "R";
            color: #fff;
            font-size: 50px;
            line-height: 1.1
        }

    .repeatDiv .nextAlbum {
        display: block;
        width: 100%;
        height: 95px;
        margin-bottom: 20px;
        padding: 15px 10px 10px;
        background: #aa120d;
        position: relative
    }

        .repeatDiv .nextAlbum .progress-bar {
            opacity: 1;
            background-color: #c31717;
            height: 5px;
            right: 0;
            position: absolute;
            top: 0;
            width: 100%;
            z-index: 1083;
            -webkit-transition: opacity 80ms ease 0;
            -moz-transition: opacity 80ms ease 0;
            -o-transition: opacity 80ms ease 0;
            transition: opacity 80ms ease 0
        }

            .repeatDiv .nextAlbum .progress-bar .progress {
                background-color: #fff;
                height: 5px;
                width: 0;
                float: right;
                transition: all 10s ease 0;
                -webkit-transition: all 10s ease 0;
                -moz-transition: all 10s ease 0;
                -o-transition: all 10s ease 0;
                -ms-transition: all 10s ease 0
            }

            .repeatDiv .nextAlbum .progress-bar.start .progress {
                width: 100%
            }

        .repeatDiv .nextAlbum img {
            width: 98px;
            height: 70px;
            float: right;
            border: 1px solid #eee;
            margin-left: 10px
        }

        .repeatDiv .nextAlbum h3 {
            font-family: DroidKufiBold,Arial;
            font-size: 16px;
            color: #fff;
            display: block;
            float: right;
            margin-bottom: 5px
        }

        .repeatDiv .nextAlbum p {
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #fff;
            display: block;
            float: right;
            width: calc(100% - 108px);
            height: 42px;
            overflow: hidden;
            line-height: 1.6;
            white-space: normal
        }

    .repeatDiv .relatedAlbum {
        display: block;
        width: 100%;
        padding: 10px 10px 0;
        background: #fff;
        position: relative
    }

        .repeatDiv .relatedAlbum .ttl {
            height: auto;
            border-bottom: none
        }

            .repeatDiv .relatedAlbum .ttl h2 {
                color: #aa120d;
                padding: 0;
                font-size: 18px
            }

                .repeatDiv .relatedAlbum .ttl h2:after {
                    display: none
                }

        .repeatDiv .relatedAlbum .content {
            display: inline-block;
            width: 100%;
            margin-top: 10px;
            background: 0 0;
            min-height: unset
        }

            .repeatDiv .relatedAlbum .content .itmDiv {
                padding: 12px 0;
                position: relative;
                width: 100%;
                display: block;
                height: 72px
            }

                .repeatDiv .relatedAlbum .content .itmDiv:before {
                    background-color: #dde2e4;
                    top: -1px;
                    clear: both;
                    content: "";
                    display: block;
                    float: none;
                    height: 1px;
                    margin: 0 auto;
                    position: absolute;
                    text-align: center;
                    width: 100%
                }

                .repeatDiv .relatedAlbum .content .itmDiv:first-child:before {
                    display: none
                }

                .repeatDiv .relatedAlbum .content .itmDiv img {
                    width: 65px;
                    height: 46px;
                    float: right;
                    border: 1px solid #eee;
                    margin-left: 10px
                }

                .repeatDiv .relatedAlbum .content .itmDiv p {
                    font-family: DroidKufiLight,arial;
                    font-size: 14px;
                    color: #1d1d1d;
                    display: block;
                    float: right;
                    width: calc(100% - 75px);
                    height: 42px;
                    overflow: hidden;
                    line-height: 1.6;
                    white-space: normal
                }

.catPattern01 .desc p, .catPattern02 .desc p, .catPattern03 .desc p, .wrapperDropdown, article .articleStrip p {
    font-family: DroidKufiLight,Arial
}

.lastSlide .lg-actions, .lastSlide .lg-toolbar #lg-counter, .lastSlide .lg-toolbar .lg-autoplay-button {
    display: none
}

.dropDownDiv {
    display: inline-block;
    width: 100%;
    margin-bottom: 40px;
    padding: 24px;
    background: #f2f2f2
}

.wrapperDropdown {
    position: relative;
    width: 100%;
    background: #fff;
    cursor: pointer;
    padding: 12px;
    border: 1px solid #ddd;
    z-index: 1;
    text-align: right;
    direction: rtl;
    font-size: 14px;
    color: #aaa;
    outline: 0;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -ms-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out
}

    .wrapperDropdown:after {
        content: "";
        width: 0;
        height: 0;
        position: absolute;
        top: 50%;
        left: 12px;
        margin-top: -3px;
        border-width: 6px 6px 0;
        border-style: solid;
        border-color: #aaa transparent
    }

    .wrapperDropdown .dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #fff;
        border-radius: 0 0 5px 5px;
        border: 1px solid rgba(0,0,0,.2);
        border-top: none;
        border-bottom: none;
        list-style: none;
        -webkit-transition: all .3s ease-out;
        -moz-transition: all .3s ease-out;
        -ms-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out;
        max-height: 0;
        overflow: hidden
    }

        .wrapperDropdown .dropdown li {
            padding: 0 10px
        }

            .wrapperDropdown .dropdown li a {
                display: block;
                text-decoration: none;
                color: #333;
                padding: 10px 0;
                transition: all .3s ease-out;
                border-bottom: 1px solid #e6e8ea
            }

            .wrapperDropdown .dropdown li:last-of-type a {
                border: none
            }

            .wrapperDropdown .dropdown li i {
                margin-right: 5px;
                color: inherit;
                vertical-align: middle
            }

            .wrapperDropdown .dropdown li:hover a {
                color: #aa120d
            }

    .wrapperDropdown.active {
        border-radius: 5px 5px 0 0;
        background: #aaa;
        box-shadow: none;
        border-bottom: none;
        color: #fff
    }

        .wrapperDropdown.active:after {
            border-color: #ccc transparent
        }

        .wrapperDropdown.active .dropdown {
            border-bottom: 1px solid rgba(0,0,0,.2);
            max-height: 400px
        }

article .authorDtls {
    display: inline-block;
    width: 100%;
    margin: 24px 0 36px;
    position: relative
}

    article .authorDtls .imageCntnr {
        padding-bottom: calc((190px * 75)/ 100);
        float: right;
        width: 190px;
        position: relative;
        margin-left: 24px
    }

        article .authorDtls .imageCntnr img {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0
        }

    article .authorDtls .articleHeader {
        width: calc(100% - 214px)
    }

        article .authorDtls .articleHeader h2 {
            margin-bottom: 0;
            font-size: 24px;
            height: 72px;
            overflow: hidden
        }

        article .authorDtls .articleHeader .authorName {
            display: block;
            font-family: DroidKufiLight,Arial;
            font-size: 18px;
            color: #888;
            float: right;
            direction: rtl
        }

        article .authorDtls .articleHeader .time {
            position: absolute;
            width: calc(100% - 214px);
            bottom: 0;
            right: 214px;
            font-size: 14px
        }

        article .authorDtls .articleHeader .icon-time:before {
            line-height: 1.3
        }

        article .authorDtls .articleHeader .time span:after {
            top: 6px
        }

article .articleStrip {
    display: inline-block;
    width: 100%;
    padding: 8px;
    background: #aa120d;
    text-align: center
}

    article .articleStrip p {
        font-size: 14px;
        color: #fff;
        text-align: center;
        direction: rtl;
        margin: 0 auto;
        display: inline-block;
        line-height: 2.9
    }

    article .articleStrip .icon-info:before {
        content: "h";
        float: right;
        font-size: 24px;
        margin-left: 8px
    }

article.articleVideo .videoCntnr {
    padding-bottom: 75%;
    float: right;
    max-width: 733px;
    width: 100%;
    position: relative
}

    article.articleVideo .videoCntnr iframe {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        transition: all .2s ease-in-out 0
    }

article.articleVideo .articleVideoEnd, article.articleVideo .videoEnd {
    display: inline-block;
    height: 1px
}

article.articleVideo .fixed iframe {
    position: fixed;
    top: auto;
    bottom: 0;
    right: 74px;
    left: auto;
    width: 300px;
    height: auto;
    z-index: 2;
    border: 12px solid #f2f2f2
}

.articleSocialMedia {
    position: fixed;
    margin-right: -54px;
    bottom: auto;
    z-index: 1;
    background: #f2f2f2;
    padding: 12px 9px;
    width: 50px;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

    .articleSocialMedia::before {
        position: absolute;
        top: 0;
        right: 0;
        visibility: hidden;
        z-index: 10;
        width: 40px;
        height: 100%;
        background: rgba(0,0,0,.5);
        content: '';
        opacity: 0;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        -webkit-transition: opacity .3s,-webkit-transform 0 .3s;
        transition: opacity .3s,transform 0 .3s
    }

.show-sponsor .articleSocialMedia::before, .sponsorHome .articleSocialMedia::before {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.articleSocialMedia a {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin-bottom: 12px;
    text-align: center;
    color: #fff
}

    .articleSocialMedia a:last-child {
        margin-bottom: 0
    }

.articleSocialMedia .icon-fb {
    background: #3a5799
}

    .articleSocialMedia .icon-fb:hover {
        background: #28437a
    }

    .articleSocialMedia .icon-fb:before {
        content: "u";
        font-size: 20px;
        line-height: 1.7
    }

.articleSocialMedia .icon-tw {
    background: #1fa2f0
}

    .articleSocialMedia .icon-tw:hover {
        background: #1083cf
    }

    .articleSocialMedia .icon-tw:before {
        content: "v";
        font-size: 20px;
        line-height: 1.7
    }

.articleSocialMedia .icon-ggl {
    background: #d55142
}

    .articleSocialMedia .icon-ggl:hover {
        background: #bc3f31
    }

    .articleSocialMedia .icon-ggl:before {
        content: "w";
        font-size: 20px;
        line-height: 1.6
    }

.articleSocialMedia .icon-wapp {
    background: #189d0e;
    display: none
}

    .articleSocialMedia .icon-wapp:hover {
        background: #108008
    }

    .articleSocialMedia .icon-wapp:before {
        content: "S";
        font-size: 22px;
        line-height: 1.6
    }

.articleSocialMedia .icon-msngr {
    background: #0084ff
}

    .articleSocialMedia .icon-msngr:hover {
        background: #0070d9
    }

    .articleSocialMedia .icon-msngr:before {
        content: "y";
        font-size: 20px;
        line-height: 1.6
    }

.articleSocialMedia .icon-mail {
    background: #75c155
}

    .articleSocialMedia .icon-mail:hover {
        background: #5ca43e
    }

    .articleSocialMedia .icon-mail:before {
        content: "z";
        font-size: 20px;
        line-height: 1.6
    }

.articleSocialMedia .icon-print {
    background: #566d7f
}

    .articleSocialMedia .icon-print:hover {
        background: #465c6d
    }

    .articleSocialMedia .icon-print:before {
        content: "G";
        font-size: 20px;
        line-height: 1.6
    }

.hideSocialBtns .articleSocialMedia {
    margin-right: 0
}

.catPattern01 {
    padding: 12px
}

    .catPattern01 .allItems {
        display: inline-block;
        width: 100%;
        padding: 24px 0 0
    }

    .catPattern01 ul li {
        float: right;
        margin-left: 24px;
        margin-bottom: 24px;
        width: calc((100% - 96px)/ 5);
        height: auto;
        position: relative;
        overflow: hidden
    }

        .catPattern01 ul li a {
            display: block
        }

            .catPattern01 ul li a .imageCntnr {
                position: relative;
                overflow: hidden;
                padding-bottom: 75%
            }

            .catPattern01 .desc, .catPattern01 .desc p, .catPattern01 ul li a img {
                position: absolute;
                bottom: 0;
                right: 0
            }

            .catPattern01 ul li a img {
                top: 0;
                left: 0;
                margin: 0 auto;
                width: 100%;
                height: 100%;
                -webkit-filter: brightness(100%) contrast(100%);
                -moz-filter: brightness(100%) contrast(100%);
                -o-filter: brightness(100%) contrast(100%);
                -ms-filter: brightness(100%) contrast(100%);
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0
            }

        .catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(2), .catPattern01 ul li:nth-child(3) {
            width: calc((100% - 48.1px)/ 3)
        }

        .catPattern01 ul li:last-child, .catPattern01 ul li:nth-child(3) {
            margin-left: 0
        }

        .catPattern01 ul li:nth-last-child(-n+5) {
            margin-bottom: 0
        }

        .catPattern01 ul li .item:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

    .catPattern01 .desc {
        width: 100%;
        height: 50%;
        overflow: hidden;
        cursor: pointer;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

        .catPattern01 .desc p {
            color: #fff;
            text-align: right;
            line-height: 1.6;
            padding: 12px;
            font-size: 16px
        }

    .catPattern01 ul li:first-child .desc p, .catPattern01 ul li:nth-child(2) .desc p, .catPattern01 ul li:nth-child(3) .desc p {
        font-size: 18px;
        line-height: 1.6
    }

    .catPattern01 ul li:nth-last-child(-n+5) .desc {
        position: relative;
        background: 0 0
    }

        .catPattern01 ul li:nth-last-child(-n+5) .desc p {
            position: relative;
            color: #1d1d1d;
            font-size: 14px;
            line-height: 1.4;
            padding: 5px 0;
            height: 62px;
            overflow: hidden;
            margin-bottom: 5px
        }

    .catPattern01 ul li.icon-image:before, .catPattern01 ul li.icon-video:before {
        background: rgba(0,0,0,.7);
        position: absolute;
        top: 1px;
        left: 1px;
        pointer-events: none;
        z-index: 1
    }

    .catPattern01 ul li:nth-last-child(-n+5) .item:hover .desc p {
        color: #888
    }

    .catPattern01 ul li:nth-last-child(-n+5) .secName:hover {
        color: #1d1d1d
    }

    .catPattern01 ul li.icon-video:before {
        content: "s";
        color: #fff;
        font-size: 30px;
        width: 41px;
        height: 40px;
        line-height: 1.35
    }

    .catPattern01 ul li:first-child.icon-video:before, .catPattern01 ul li:nth-child(2).icon-video:before, .catPattern01 ul li:nth-child(3).icon-video:before {
        font-size: 56px;
        width: 70px;
        height: 70px;
        line-height: 1.25
    }

    .catPattern01 ul li.icon-image:before {
        content: "t";
        color: #fff;
        font-size: 30px;
        width: 41px;
        height: 40px;
        line-height: 1.35
    }

    .catPattern01 ul li:first-child.icon-image:before, .catPattern01 ul li:nth-child(2).icon-image:before, .catPattern01 ul li:nth-child(3).icon-image:before {
        font-size: 56px;
        width: 70px;
        height: 70px;
        line-height: 1.25
    }

    .catPattern01 ul li:nth-last-child(-n+5).icon-image, .catPattern01 ul li:nth-last-child(-n+5).icon-video {
        background: #1d1d1d
    }

        .catPattern01 ul li:nth-last-child(-n+5).icon-image .desc p, .catPattern01 ul li:nth-last-child(-n+5).icon-video .desc p {
            color: #fff;
            padding: 5px
        }

        .catPattern01 ul li:nth-last-child(-n+5).icon-image .item:hover .desc p, .catPattern01 ul li:nth-last-child(-n+5).icon-video .item:hover .desc p {
            color: #aaa
        }

.catPattern02 {
    padding: 12px;
    width: calc((100% - 48px)/ 2);
    margin-left: 48px
}

    .catPattern02:last-child {
        margin-left: 0
    }

    .catPattern02 .allItems {
        display: inline-block;
        width: 100%;
        padding: 24px 0 0
    }

    .catPattern02 ul li {
        float: right;
        margin-left: 24px;
        margin-bottom: 24px;
        width: calc((100% - 48px)/ 3);
        height: auto;
        position: relative;
        overflow: hidden
    }

        .catPattern02 ul li a {
            display: block
        }

            .catPattern02 ul li a .imageCntnr {
                position: relative;
                overflow: hidden;
                padding-bottom: 75%
            }

            .catPattern02 .desc, .catPattern02 .desc p, .catPattern02 ul li a img {
                position: absolute;
                bottom: 0;
                right: 0
            }

            .catPattern02 ul li a img {
                top: 0;
                left: 0;
                margin: 0 auto;
                width: 100%;
                height: 100%;
                -webkit-filter: brightness(100%) contrast(100%);
                -moz-filter: brightness(100%) contrast(100%);
                -o-filter: brightness(100%) contrast(100%);
                -ms-filter: brightness(100%) contrast(100%);
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0
            }

        .catPattern02 ul li:first-child, .catPattern02 ul li:nth-child(2) {
            width: calc((100% - 24px)/ 2)
        }

        .catPattern02 ul li:last-child, .catPattern02 ul li:nth-child(2) {
            margin-left: 0
        }

        .catPattern02 ul li:nth-last-child(-n+3) {
            margin-bottom: 0
        }

        .catPattern02 ul li .item:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

    .catPattern02 .desc {
        width: 100%;
        height: 50%;
        overflow: hidden;
        cursor: pointer;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

.catPattern03 ul li a img, .cd-gallery li .item img {
    filter: brightness(100%) contrast(100%);
    transition: all .2s ease-in-out 0
}

.catPattern02 .desc p {
    color: #fff;
    text-align: right;
    line-height: 1.6;
    padding: 12px;
    font-size: 16px
}

.catPattern02 ul li:first-child .desc p, .catPattern02 ul li:nth-child(2) .desc p {
    font-size: 18px;
    line-height: 1.6
}

.catPattern02 ul li:nth-last-child(-n+3) .desc {
    position: relative;
    background: 0 0
}

    .catPattern02 ul li:nth-last-child(-n+3) .desc p {
        position: relative;
        color: #1d1d1d;
        font-size: 14px;
        line-height: 1.4;
        padding: 5px 0;
        height: 62px;
        overflow: hidden;
        margin-bottom: 5px
    }

.catPattern02 ul li.icon-image:before, .catPattern02 ul li.icon-video:before {
    background: rgba(0,0,0,.7);
    position: absolute;
    top: 1px;
    left: 1px;
    pointer-events: none;
    z-index: 1
}

.catPattern02 ul li:nth-last-child(-n+3) .item:hover .desc p {
    color: #888
}

.catPattern02 ul li:nth-last-child(-n+3) .secName:hover {
    color: #1d1d1d
}

.catPattern02 ul li.icon-video:before {
    content: "s";
    color: #fff;
    font-size: 30px;
    width: 41px;
    height: 40px;
    line-height: 1.35
}

.catPattern02 ul li:first-child.icon-video:before, .catPattern02 ul li:nth-child(2).icon-video:before {
    font-size: 56px;
    width: 70px;
    height: 70px;
    line-height: 1.25
}

.catPattern02 ul li.icon-image:before {
    content: "t";
    color: #fff;
    font-size: 30px;
    width: 41px;
    height: 40px;
    line-height: 1.35
}

.catPattern02 ul li:first-child.icon-image:before, .catPattern02 ul li:nth-child(2).icon-image:before {
    font-size: 56px;
    width: 70px;
    height: 70px;
    line-height: 1.25
}

.catPattern02 ul li:nth-last-child(-n+3).icon-image, .catPattern02 ul li:nth-last-child(-n+3).icon-video {
    background: #1d1d1d
}

    .catPattern02 ul li:nth-last-child(-n+3).icon-image .desc p, .catPattern02 ul li:nth-last-child(-n+3).icon-video .desc p {
        color: #fff;
        padding: 5px
    }

    .catPattern02 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .catPattern02 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
        color: #aaa
    }

.catPattern03 {
    padding: 12px;
    width: calc((100% - 96.1px)/ 3);
    margin-left: 48px;
    overflow: hidden
}

    .catPattern03:last-child {
        margin-left: 0
    }

    .catPattern03 .allItems {
        display: inline-block;
        width: 100%;
        padding: 24px 0 0
    }

    .catPattern03 ul li {
        float: right;
        margin-bottom: 24px;
        width: 100%;
        height: auto;
        position: relative
    }

        .catPattern03 ul li:after {
            content: "";
            position: absolute;
            bottom: -12px;
            right: 0;
            width: 100%;
            height: 1px;
            background: #ddd
        }

        .catPattern03 ul li:first-child:after, .catPattern03 ul li:last-child:after {
            display: none
        }

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

        .catPattern03 ul li a {
            display: block
        }

            .catPattern03 ul li a .imageCntnr {
                position: relative;
                overflow: hidden;
                padding-bottom: calc((88px * 75)/ 100);
                float: right;
                width: 88px;
                margin-left: 12px
            }

        .catPattern03 ul li:first-child a .imageCntnr {
            position: relative;
            overflow: hidden;
            padding-bottom: 75%;
            float: none;
            width: auto;
            margin-left: 0
        }

        .catPattern03 ul li a img {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            margin: 0 auto;
            width: 100%;
            height: 100%;
            border: 1px solid #ddd;
            -webkit-filter: brightness(100%) contrast(100%);
            -moz-filter: brightness(100%) contrast(100%);
            -o-filter: brightness(100%) contrast(100%);
            -ms-filter: brightness(100%) contrast(100%);
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .catPattern03 ul li .item:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

    .catPattern03 .desc {
        width: calc(100% - 100px);
        height: 50%;
        overflow: hidden;
        cursor: pointer;
        position: relative;
        float: right
    }

        .catPattern03 .desc p {
            color: #1d1d1d;
            text-align: right;
            line-height: 1.6;
            font-size: 14px;
            position: relative;
            bottom: 0;
            right: 0;
            margin-bottom: 5px
        }

.filterMainContent h3, .searchResult h2 {
    font-family: DroidKufiBold,Arial;
    direction: rtl
}

.catPattern03 ul li:first-child .desc {
    position: absolute;
    bottom: 0;
    right: 0;
    float: none;
    width: 100%;
    background: linear-gradient(270deg,rgba(0,0,0,0),#000);
    background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
    background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
    background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
    background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
}

.catPattern03 ul li.icon-image:before, .catPattern03 ul li.icon-video:before {
    background: rgba(0,0,0,.7);
    position: absolute;
    top: 1px;
    pointer-events: none;
    z-index: 1
}

.catPattern03 ul li:first-child .desc p {
    line-height: 1.6;
    margin-bottom: 0;
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 16px;
    color: #fff;
    padding: 12px
}

.catPattern03 ul li:nth-last-child(-n+3) .item:hover .desc p {
    color: #888
}

.catPattern03 ul li.icon-video:before {
    content: "s";
    color: #fff;
    font-size: 30px;
    right: 1px;
    width: 41px;
    height: 40px;
    line-height: 1.35
}

.catPattern03 ul li:first-child.icon-video:before {
    font-size: 56px;
    width: 70px;
    height: 70px;
    line-height: 1.25;
    left: 1px;
    right: auto
}

.catPattern03 ul li.icon-image:before {
    content: "t";
    color: #fff;
    font-size: 30px;
    right: 1px;
    width: 41px;
    height: 40px;
    line-height: 1.35
}

.catPattern03 ul li:first-child.icon-image:before {
    font-size: 56px;
    width: 70px;
    height: 70px;
    line-height: 1.25;
    left: 1px;
    right: auto
}

.catPattern03 ul li:nth-last-child(-n+3).icon-image, .catPattern03 ul li:nth-last-child(-n+3).icon-video {
    background: #1d1d1d
}

    .catPattern03 ul li:nth-last-child(-n+3).icon-image .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-video .desc p {
        color: #fff;
        padding: 5px
    }

    .catPattern03 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
        color: #aaa
    }

.searchResult {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px 24px 0
}

    .searchResult h2 {
        display: inline-block;
        width: 100%;
        font-size: 24px;
        color: #1d1d1d;
        margin-bottom: 24px
    }

        .searchResult h2 span {
            margin-right: 8px;
            color: #aaa
        }

    .searchResult form {
        display: inline-block;
        width: 100%;
        height: auto;
        margin-bottom: 30px;
        padding: 24px;
        background: #f2f2f2;
        position: relative
    }

        .searchResult form:before {
            display: none
        }

        .searchResult form input {
            display: inline-block;
            position: relative;
            width: 100%;
            height: auto;
            text-align: right;
            background: #fff;
            cursor: text;
            padding: 10px 12px;
            border: 1px solid #ddd !important;
            z-index: 1;
            direction: rtl;
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #aaa;
            outline: 0
        }

        .searchResult form .morphsearch-submit {
            position: absolute;
            width: 30px;
            height: 30px;
            margin-top: 0;
            overflow: hidden;
            left: 35px;
            top: 35px;
            background: #fff;
            z-index: 2;
            background-size: 100%;
            border: none;
            pointer-events: auto;
            transform-origin: 50% 50%;
            opacity: 1;
            -webkit-transform: translate3d(0,0,0) scale3d(1,1,1);
            transform: translate3d(0,0,0) scale3d(1,1,1)
        }

            .searchResult form .morphsearch-submit.icon-search:before {
                content: "f";
                color: #ddd;
                font-size: 30px;
                line-height: 1
            }

.cd-tab-filter-wrapper:after, .filterMainContent:after {
    content: "";
    display: table;
    clear: both
}

.searchResult form input:focus, .searchResult form textarea:focus {
    border: 1px solid #888 !important;
    outline: 0
}

.filterMainContent {
    position: relative;
    min-height: 28vh
}

    .filterMainContent h3 {
        float: right;
        width: 120px;
        font-size: 16px;
        color: #1d1d1d;
        line-height: 3.5
    }

.cd-tab-filter-wrapper {
    background-color: #fff;
    z-index: 2;
    width: calc(100% - 120px);
    float: right
}

.cd-tab-filter {
    position: relative;
    height: 50px;
    width: auto;
    margin: 0 auto;
    z-index: 2;
    cursor: auto
}

    .cd-tab-filter::after {
        content: 'q';
        position: absolute;
        left: 12px;
        top: 50%;
        color: #aaa;
        bottom: auto;
        -webkit-transform: rotate(-90deg) translateY(-50%);
        -moz-transform: rotate(-90deg) translateY(-50%);
        -ms-transform: rotate(-90deg) translateY(-50%);
        -o-transform: rotate(-90deg) translateY(-50%);
        transform: rotate(-90deg) translateY(-50%);
        display: none;
        line-height: .5;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        transition: all .3s;
        pointer-events: none
    }

    .cd-tab-filter ul {
        position: static;
        top: 0;
        left: 0;
        background-color: #fff;
        border-bottom: 1px solid #ddd
    }

    .cd-tab-filter li {
        display: inline-block
    }

        .cd-tab-filter li.placeholder {
            display: none !important
        }

        .cd-tab-filter li:first-child {
            display: block
        }

    .cd-gallery li, .cd-tab-filter a, .cd-tab-filter.is-open ul li {
        display: inline-block
    }

    .cd-tab-filter a {
        height: 50px;
        width: auto;
        line-height: 50px;
        padding: 0 24px;
        font-family: DroidKufiLight,arial;
        font-size: 16px;
        color: #aaa
    }

        .cd-tab-filter a.selected {
            background: 0 0;
            color: #1d1d1d;
            box-shadow: inset 0 -2px 0 #1d1d1d
        }

    .cd-tab-filter.is-open::after {
        -webkit-transform: translateY(-50%) rotate(-270deg);
        -moz-transform: translateY(-50%) rotate(-270deg);
        -ms-transform: translateY(-50%) rotate(-270deg);
        -o-transform: translateY(-50%) rotate(-270deg);
        transform: translateY(-50%) rotate(-270deg)
    }

    .cd-tab-filter.is-open ul {
        box-shadow: inset 0 0 0 #1d1d1d,0 2px 10px rgba(0,0,0,.2)
    }

    .cd-tab-filter.is-open .placeholder a {
        opacity: .4
    }

.cd-gallery {
    padding: 24px 0 0;
    width: 100%;
    box-shadow: none;
    margin-bottom: 0
}

    .cd-gallery ul {
        text-align: justify
    }

    .cd-gallery li {
        margin-bottom: 24px;
        width: calc((100% - 48px)/ 3);
        padding-bottom: 5px;
        height: auto;
        position: relative;
        overflow: hidden;
        transition: none;
        -webkit-transition: none;
        -moz-transition: none;
        -o-transition: none;
        -ms-transition: none
    }

        .cd-gallery li a .imageCntnr {
            position: relative;
            overflow: hidden;
            padding-bottom: 75%
        }

        .cd-gallery li .item img {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            margin: 0 auto;
            width: 100%;
            height: 100%;
            -webkit-filter: brightness(100%) contrast(100%);
            -moz-filter: brightness(100%) contrast(100%);
            -o-filter: brightness(100%) contrast(100%);
            -ms-filter: brightness(100%) contrast(100%);
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .cd-gallery li .item:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

        .cd-gallery li .desc {
            width: 100%;
            overflow: hidden;
            cursor: pointer
        }

            .cd-gallery li .desc p {
                color: #1d1d1d;
                height: 96px;
                margin-bottom: 5px;
                overflow: hidden;
                text-align: right;
                line-height: 1.8;
                padding: 10px 0;
                font-size: 16px;
                font-family: DroidKufiLight,Arial;
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0
            }

        .cd-gallery li .secName, .cd-gallery li .time {
            font-family: DroidKufiLight,Arial;
            font-size: 14px
        }

        .cd-gallery li .item:hover .desc p {
            color: #888
        }

        .cd-gallery li .articleDate, .cd-gallery li .authorName, .cd-gallery li .desc.authorDesc {
            display: none
        }

        .cd-gallery li .secName {
            color: #888;
            display: inline-block;
            margin-bottom: 5px
        }

            .cd-gallery li .secName:after {
                content: "";
                width: 4px;
                height: 14px;
                background: #aa120d;
                float: right;
                margin-left: 5px;
                margin-top: 6px
            }

            .cd-gallery li .secName:hover {
                color: #1d1d1d
            }

        .cd-gallery li .time {
            color: #888;
            display: inline-block;
            width: 100%;
            cursor: default
        }

        .cd-gallery li .icon-time:before {
            content: "C";
            font-size: 16px;
            float: right;
            margin-left: 5px;
            line-height: 1.6
        }

        .cd-gallery li.icon-image, .cd-gallery li.icon-video {
            background: #1d1d1d
        }

            .cd-gallery li.icon-image:before, .cd-gallery li.icon-video:before {
                font-size: 30px;
                background: rgba(0,0,0,.7);
                position: absolute;
                top: 1px;
                left: 1px;
                width: 41px;
                height: 40px;
                line-height: 1.35;
                z-index: 1;
                pointer-events: none
            }

            .cd-gallery li.icon-image .desc p, .cd-gallery li.icon-video .desc p {
                color: #fff;
                padding: 10px
            }

            .cd-gallery li.icon-image .item:hover .desc p, .cd-gallery li.icon-video .item:hover .desc p {
                color: #aaa
            }

            .cd-gallery li.icon-image .secName, .cd-gallery li.icon-video .secName {
                margin-right: 10px;
                color: #bbb
            }

                .cd-gallery li.icon-image .secName:hover, .cd-gallery li.icon-video .secName:hover {
                    color: #888
                }

            .cd-gallery li.icon-image .time, .cd-gallery li.icon-video .time {
                margin-right: 10px;
                color: #bbb
            }

            .cd-gallery li.icon-video:before {
                content: "s";
                color: #fff
            }

            .cd-gallery li.icon-image:before {
                content: "t";
                color: #fff
            }

.cd-filter, .cd-filter::before {
    position: absolute;
    top: 0;
    z-index: 2;
    left: 0
}

.cd-gallery li.gap {
    opacity: 0;
    height: 0;
    display: inline-block
}

.cd-gallery img {
    display: block;
    width: 100%
}

.cd-gallery .cd-fail-message {
    display: none;
    text-align: center
}

.cd-gallery .leaderboardDiv {
    margin: 16px auto 40px
}

.cd-filter {
    width: 280px;
    height: 100%;
    background: #fff;
    box-shadow: 4px 4px 20px transparent;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: -webkit-transform .3s,box-shadow .3s;
    -moz-transition: -moz-transform .3s,box-shadow .3s;
    transition: transform .3s,box-shadow .3s
}

    .cd-filter::before {
        content: '';
        height: 50px;
        width: 100%;
        background-color: #1d1d1d
    }

    .cd-filter .cd-close, .cd-filter-trigger {
        position: absolute;
        top: 0;
        height: 50px;
        line-height: 50px;
        width: 60px;
        z-index: 3
    }

    .cd-filter form {
        padding: 70px 20px
    }

    .cd-filter .cd-close {
        right: 0;
        color: #fff;
        font-size: 1.3rem;
        text-align: center;
        background: #37296a;
        opacity: 0;
        -webkit-transition: opacity .3s;
        -moz-transition: opacity .3s;
        transition: opacity .3s
    }

.no-touch .cd-filter .cd-close:hover {
    background: #32255f
}

.cd-filter.filter-is-visible {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    box-shadow: 4px 4px 20px rgba(0,0,0,.2)
}

    .cd-filter.filter-is-visible .cd-close {
        opacity: 1
    }

.no-touch .cd-tab-filter a:hover {
    color: #1d1d1d
}

.cd-filter-trigger {
    left: 0;
    overflow: hidden;
    text-indent: 100%;
    color: transparent;
    white-space: nowrap
}

.cd-filter-block .cd-select::after, .cd-filter-block h4::before {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    content: ''
}

.cd-filter-trigger.filter-is-visible {
    pointer-events: none
}

.cd-filter-block {
    margin-bottom: 1.6em
}

    .cd-filter-block h4 {
        position: relative;
        margin-bottom: .2em;
        padding: 10px 0 10px 20px;
        color: #9a9a9a;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 1.3rem;
        user-select: none;
        cursor: pointer
    }

.archivePage h2, .no-touch .cd-filter-block h4:hover {
    color: #1d1d1d
}

.cd-filter-block h4::before {
    position: absolute;
    left: 0;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    -webkit-transition: -webkit-transform .3s;
    -moz-transition: -moz-transform .3s;
    transition: transform .3s
}

.cd-filter-block h4.closed::before {
    -webkit-transform: translateY(-50%) rotate(-90deg);
    -moz-transform: translateY(-50%) rotate(-90deg);
    -ms-transform: translateY(-50%) rotate(-90deg);
    -o-transform: translateY(-50%) rotate(-90deg);
    transform: translateY(-50%) rotate(-90deg)
}

.cd-filter-block .checkbox-label::before, .cd-filter-block .radio-label::before, .cd-filter-block input, .cd-filter-block select {
    font-family: "Open Sans",sans-serif;
    border-radius: 0;
    background-color: #fff;
    border: 2px solid #e6e6e6
}

    .cd-filter-block input[type=search], .cd-filter-block input[type=text], .cd-filter-block select {
        width: 100%;
        padding: .8em;
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        -o-appearance: none;
        appearance: none;
        box-shadow: none
    }

        .cd-filter-block input[type=search]:focus, .cd-filter-block input[type=text]:focus, .cd-filter-block select:focus {
            outline: 0;
            background-color: #fff;
            border-color: #1d1d1d
        }

    .cd-filter-block input[type=search] {
        border-color: transparent;
        background-color: #e6e6e6;
        font-size: 1.6rem !important
    }

        .cd-filter-block input[type=search]::-webkit-search-cancel-button {
            display: none
        }

.cd-filter-block .cd-select {
    position: relative
}

    .cd-filter-block .cd-select::after {
        position: absolute;
        z-index: 1;
        right: 14px;
        display: block;
        width: 16px;
        height: 16px;
        pointer-events: none;
        transform: translateY(-50%)
    }

.cd-filter-block select {
    cursor: pointer;
    font-size: 1.4rem
}

    .cd-filter-block select::-ms-expand {
        display: none
    }

.cd-filter-block .list li {
    position: relative;
    margin-bottom: .8em
}

    .cd-filter-block .list li:last-of-type {
        margin-bottom: 0
    }

.cd-filter-block input[type=checkbox], .cd-filter-block input[type=radio] {
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    z-index: 2
}

.cd-filter-block .checkbox-label, .cd-filter-block .radio-label {
    padding-left: 24px;
    font-size: 1.4rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

    .cd-filter-block .checkbox-label::after, .cd-filter-block .checkbox-label::before, .cd-filter-block .radio-label::after, .cd-filter-block .radio-label::before {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%)
    }

.matchesSchedule .allMatches .icon-downArrow:before, .prayerTimes .main .icon-downArrow:before {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg)
}

.cd-filter-block .checkbox-label::before, .cd-filter-block .radio-label::before {
    width: 16px;
    height: 16px;
    left: 0
}

.cd-filter-block .checkbox-label::after, .cd-filter-block .radio-label::after {
    display: none
}

.cd-filter-block .checkbox-label::after {
    width: 16px;
    height: 16px
}

.cd-filter-block .radio-label::after, .cd-filter-block .radio-label::before {
    border-radius: 50%
}

.cd-filter-block .radio-label::after {
    width: 6px;
    height: 6px;
    background-color: #fff;
    left: 5px
}

.cd-filter-block input[type=checkbox]:checked + label::before, .cd-filter-block input[type=radio]:checked + label::before {
    border-color: #1d1d1d;
    background-color: #1d1d1d
}

.cd-filter-block input[type=checkbox]:checked + label::after, .cd-filter-block input[type=radio]:checked + label::after {
    display: block
}

.innerListing .akhbarThemak {
    height: 552px
}

    .innerListing .akhbarThemak.fixed {
        position: fixed
    }

.datepicker-form .ui-datepicker-trigger {
    display: none
}

.datepicker-form .icon-date {
    width: 30px;
    height: 30px;
    position: absolute;
    left: 35px;
    top: 35px;
    pointer-events: none;
    z-index: 2
}

    .datepicker-form .icon-date:before {
        content: "c";
        color: #aaa;
        font-size: 30px;
        line-height: 1
    }

.archivePage .cd-tab-filter {
    width: 100%;
    margin: 0
}

    .archivePage .cd-tab-filter::after {
        display: inline-block
    }

    .archivePage .cd-tab-filter ul {
        position: absolute;
        width: 100%
    }

    .archivePage .cd-tab-filter li {
        display: none
    }

        .archivePage .cd-tab-filter li.placeholder {
            display: block !important
        }

            .archivePage .cd-tab-filter li.placeholder a:hover {
                color: #aaa
            }

    .archivePage .cd-tab-filter a {
        display: inline-block;
        width: 100%;
        padding-right: 12px
    }

        .archivePage .cd-tab-filter a.selected {
            background: #f2f2f2;
            color: #1d1d1d;
            box-shadow: none;
            padding-right: 12px
        }

.innerListingContainer, .listing {
    padding: 24px
}

.archivePage .cd-tab-filter.is-open ul li {
    display: block
}

.listing {
    width: calc(100% - 324px);
    margin-left: 24px
}

    .listing .cd-gallery li {
        display: inline-block
    }

    .listing .cd-tab-filter-wrapper {
        display: none
    }

.innerListingAds {
    width: 100%;
    display: inline-block;
    text-align: center
}

.authorsListing h3 {
    display: none
}

.authorsListing .cd-tab-filter {
    width: 100%;
    margin: 0
}

    .authorsListing .cd-tab-filter::after {
        display: inline-block;
        left: 16px
    }

    .authorsListing .cd-tab-filter ul {
        display: inline-block;
        position: static;
        width: 100%;
        height: auto;
        max-height: 300px;
        overflow-x: hidden;
        overflow-y: auto;
        text-align: right;
        background: #fff;
        cursor: text;
        padding: 0 12px;
        border: 1px solid #ddd;
        z-index: 1;
        direction: rtl;
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #aaa;
        outline: 0
    }

    .authorsListing .cd-tab-filter li {
        display: none
    }

        .authorsListing .cd-tab-filter li.placeholder {
            display: block !important
        }

            .authorsListing .cd-tab-filter li.placeholder a:hover {
                color: #aaa
            }

    .authorsListing .cd-tab-filter a {
        display: inline-block;
        width: 100%;
        padding: 0
    }

        .authorsListing .cd-tab-filter a.selected {
            background: #f2f2f2;
            color: #1d1d1d;
            box-shadow: none;
            padding-right: 12px
        }

    .authorsListing .cd-tab-filter.is-open ul li {
        display: block
    }

.authorsListing .cd-tab-filter-wrapper {
    z-index: 2;
    width: 100%;
    height: auto;
    float: right;
    display: inline-block;
    margin: 24px 0 0;
    padding: 24px;
    background: #f2f2f2;
    position: relative
}

    .authorsListing .cd-tab-filter-wrapper:after {
        content: "";
        display: table;
        clear: both
    }

.authorsListing .cd-gallery li {
    width: calc((100% - 72px)/ 4)
}

    .authorsListing .cd-gallery li .desc.authorDesc {
        display: block
    }

        .authorsListing .cd-gallery li .desc.authorDesc p {
            height: 66px
        }

    .authorsListing .cd-gallery li .secName, .authorsListing .cd-gallery li .time {
        display: none
    }

    .authorsListing .cd-gallery li .authorName {
        display: block;
        font-family: DroidKufiLight,Arial;
        font-size: 14px;
        color: #888;
        height: 28px;
        overflow: hidden
    }

.author .authorData .data, .author .cd-tab-filter ul {
    font-family: DroidKufiLight,Arial;
    font-size: 16px;
    text-align: right;
    direction: rtl
}

.authorsListing .cd-gallery li .authorName:hover {
    color: #1d1d1d
}

.author .cd-tab-filter {
    width: 100%;
    margin: 0
}

    .author .cd-tab-filter::after {
        display: inline-block;
        left: 16px
    }

    .author .cd-tab-filter ul {
        display: inline-block;
        position: static;
        width: 100%;
        height: auto;
        max-height: 300px;
        overflow-x: hidden;
        overflow-y: auto;
        background: #fff;
        cursor: text;
        padding: 0 12px;
        border: 1px solid #ddd;
        z-index: 1;
        color: #aaa;
        outline: 0
    }

    .author .cd-tab-filter li {
        display: none
    }

        .author .cd-tab-filter li.placeholder {
            display: block !important
        }

            .author .cd-tab-filter li.placeholder a:hover {
                color: #aaa
            }

    .author .cd-tab-filter a {
        display: inline-block;
        width: 100%;
        padding: 0
    }

        .author .cd-tab-filter a.selected {
            background: #f2f2f2;
            color: #1d1d1d;
            box-shadow: none;
            padding-right: 12px
        }

    .author .cd-tab-filter.is-open ul li {
        display: block
    }

.author .cd-tab-filter-wrapper {
    z-index: 2;
    width: 100%;
    height: auto;
    float: right;
    display: inline-block;
    margin: 24px 0 0;
    padding: 24px;
    background: #f2f2f2;
    position: relative
}

    .author .cd-tab-filter-wrapper:after {
        content: "";
        display: table;
        clear: both
    }

.author .authorData {
    display: inline-block;
    width: 100%;
    margin: 24px 0 36px;
    box-shadow: none
}

    .author .authorData img {
        width: 186px;
        height: 140px;
        float: right
    }

    .author .authorData .data {
        float: right;
        margin-right: 24px;
        width: calc(100% - 210px);
        display: inline-block;
        color: #1d1d1d
    }

        .author .authorData .data .name {
            display: inline-block;
            width: 100%;
            font-family: DroidKufiBold,Arial;
            font-size: 22px;
            line-height: 1.2;
            float: right;
            margin-top: 5px
        }

        .author .authorData .data .artclsNum {
            display: inline-block;
            width: 100%;
            margin-bottom: 20px;
            float: right
        }

        .author .authorData .data .lastArtcl {
            display: inline-block;
            width: 100%;
            float: right;
            height: 32px;
            overflow: hidden
        }

            .author .authorData .data .lastArtcl span {
                color: #888;
                margin-left: 5px
            }

        .author .authorData .data .date {
            font-size: 14px;
            color: #888;
            display: inline-block;
            width: 100%;
            float: right
        }

        .author .authorData .data .icon-date:before {
            content: "c";
            font-size: 16px;
            float: right;
            margin-left: 5px;
            line-height: 1.6
        }

.author .allArtclsTtl {
    display: inline-block;
    width: 100%;
    background: #474747;
    height: 40px;
    padding: 0 12px
}

.author .cd-gallery li a .imageCntnr, .author .cd-gallery li.icon-image:before, .author .cd-gallery li.icon-video:before, .author .cd-gallery li:after {
    display: none
}

.author .allArtclsTtl h2 {
    font-family: DroidKufiLight,Arial;
    font-size: 18px;
    color: #fff;
    text-align: right;
    direction: rtl;
    line-height: 2.2
}

.author .cd-gallery li .item:hover .desc p, .author .cd-gallery li.icon-image .desc p, .author .cd-gallery li.icon-video .desc p {
    color: #1d1d1d
}

.author .cd-gallery li {
    width: calc((100% - 24px)/ 2);
    padding: 12px;
    background: #f5f5f5;
    border: 1px solid #ddd;
    margin-bottom: 24px
}

    .author .cd-gallery li .authorDesc {
        position: relative;
        width: 100%
    }

        .author .cd-gallery li .authorDesc p {
            padding: 0;
            margin-bottom: 0;
            margin-right: 14px;
            width: calc(100% - 14px);
            line-height: 1.8
        }

    .author .cd-gallery li:hover .item .desc p {
        color: #888
    }

    .author .cd-gallery li .authorDesc:after {
        content: "";
        width: 4px;
        height: 28px;
        background: #aa120d;
        float: right;
        margin-left: 5px;
        margin-top: 2px;
        top: 0;
        right: 0;
        position: absolute
    }

    .author .cd-gallery li .articleDate {
        font-family: DroidKufiLight,Arial;
        font-size: 14px;
        color: #888;
        display: inline-block;
        width: 100%
    }

    .author .cd-gallery li .icon-date:before {
        content: "c";
        font-size: 16px;
        float: right;
        margin-left: 5px;
        line-height: 1.6
    }

    .author .cd-gallery li .authorName {
        display: none
    }

.matchesSchedule .schedule {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 0;
    background: 0 0;
    box-shadow: none;
    margin-bottom: 0
}

    .matchesSchedule .schedule .cd-gallery li {
        display: inline-block
    }

.matchesSchedule .akhbarThemak {
    height: 552px
}

.matchesSchedule .allMatches .icon-downArrow:before {
    content: "q";
    position: absolute;
    left: 12px;
    line-height: 2.2;
    transform: rotate(-90deg)
}

.matchesSchedule .allMatches .wrapperDropdown:after {
    display: none
}

.matchesSchedule .allMatches .wrapperDropdown .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-radius: 0;
    border: 1px solid rgba(0,0,0,.2);
    border-top: none;
    border-bottom: none;
    list-style: none;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    max-height: 0;
    overflow: hidden
}

    .matchesSchedule .allMatches .wrapperDropdown .dropdown li {
        padding: 0 10px
    }

        .matchesSchedule .allMatches .wrapperDropdown .dropdown li a {
            display: block;
            text-decoration: none;
            color: #888;
            padding: 10px 0;
            transition: all .3s ease-out;
            border-bottom: 1px solid #e6e8ea
        }

        .matchesSchedule .allMatches .wrapperDropdown .dropdown li:last-of-type a {
            border: none
        }

        .matchesSchedule .allMatches .wrapperDropdown .dropdown li i {
            margin-right: 5px;
            color: inherit;
            vertical-align: middle
        }

        .matchesSchedule .allMatches .wrapperDropdown .dropdown li:hover a {
            color: #1d1d1d
        }

.matchesSchedule .allMatches .wrapperDropdown.active {
    border-radius: 0;
    background: #eee;
    box-shadow: none;
    border-bottom: none;
    color: #1d1d1d
}

    .matchesSchedule .allMatches .wrapperDropdown.active:after {
        border-color: #aaa transparent
    }

    .matchesSchedule .allMatches .wrapperDropdown.active .dropdown {
        border-bottom: 1px solid rgba(0,0,0,.2);
        max-height: 400px;
        overflow: auto
    }

.matchesSchedule .table {
    background: #fff;
    box-shadow: 0 6px 6px -3px rgba(0,0,0,.1);
    padding: 24px
}

    .matchesSchedule .table .allMatches {
        display: inline-block;
        width: 100%;
        margin: 24px 0 0
    }

        .matchesSchedule .table .allMatches .tabs-nav {
            position: static;
            top: 0;
            left: 0;
            background-color: #fff;
            border-bottom: 1px solid #ddd;
            margin-bottom: 24px
        }

            .matchesSchedule .table .allMatches .tabs-nav li {
                display: inline-block;
                width: auto;
                height: 50px;
                margin-left: 0
            }

                .matchesSchedule .table .allMatches .tabs-nav li > a {
                    display: inline-block;
                    height: 50px;
                    width: auto;
                    line-height: 50px;
                    padding: 0 48px;
                    font-family: DroidKufiLight,arial;
                    font-size: 16px;
                    color: #aaa;
                    background: 0 0
                }

                .matchesSchedule .table .allMatches .tabs-nav li .icon-date:before {
                    content: "c";
                    font-size: 22px;
                    line-height: 2.5
                }

                .matchesSchedule .table .allMatches .tabs-nav li.tabs-selected > a {
                    background: 0 0;
                    color: #1d1d1d;
                    box-shadow: inset 0 -2px 0 #1d1d1d
                }

                .matchesSchedule .table .allMatches .tabs-nav li > a:hover {
                    color: #1d1d1d
                }

                .matchesSchedule .table .allMatches .tabs-nav li a.date {
                    position: relative
                }

                    .matchesSchedule .table .allMatches .tabs-nav li a.date .calendarDiv {
                        position: absolute
                    }

.matchesSchedule .allMatches .dropDownDiv {
    margin-bottom: 24px
}

.matchesSchedule .allMatches h2 {
    display: inline-block;
    width: 100%;
    font-family: DroidKufiLight,Arial;
    color: #1d1d1d;
    font-size: 22px;
    text-align: right;
    direction: rtl;
    margin-bottom: 24px
}

    .matchesSchedule .allMatches h2 span {
        color: #888;
        margin-right: 5px
    }

.matchesSchedule .showCal .ui-datepicker {
    position: absolute;
    z-index: 2;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

.matchesSchedule .showCal.show .ui-datepicker {
    max-height: 250px;
    opacity: 1;
    visibility: visible
}

.matchesSchedule .table .allMatches .slide {
    height: auto
}

.matchesSchedule .table .allMatches .item {
    width: 100%;
    padding: 0;
    display: inline-block;
    margin-bottom: 24px
}

    .matchesSchedule .table .allMatches .item:last-child {
        margin-bottom: 0
    }

    .matchesSchedule .table .allMatches .item .tourName {
        padding-bottom: 0;
        height: 46px;
        text-align: right;
        border-bottom: none;
        background: #474747;
        padding-right: 12px;
        margin-bottom: 4px;
        color: #fff;
        line-height: 2.6
    }

    .matchesSchedule .table .allMatches .item .match {
        display: inline-block;
        width: 100%;
        margin-bottom: 4px;
        background: #ececec;
        height: 70px;
        overflow: hidden;
        padding: 12px;
        float: right
    }

.matchesSchedule .filterMainContent h3, .prayerTimes .main .ttl h2:after {
    display: none
}

.matchesSchedule .table .allMatches .item .match:last-child {
    margin-bottom: 0
}

.matchesSchedule .table .allMatches .item .time {
    float: right;
    width: 50px;
    font-family: Arial;
    font-size: 18px;
    color: #1d1d1d;
    line-height: 2.8;
    text-align: center
}

    .matchesSchedule .table .allMatches .item .time span {
        margin-top: 15px
    }

        .matchesSchedule .table .allMatches .item .time span.now {
            width: 50px;
            height: 26px;
            background: #006829;
            color: #fff !important;
            text-align: center;
            font-family: DroidKufiLight,arial;
            font-size: 14px !important;
            line-height: 2;
            margin: 10px auto 0 !important;
            border-radius: 0 !important
        }

.matchesSchedule .table .allMatches .item .teamA, .matchesSchedule .table .allMatches .item .teamB {
    float: right;
    width: calc((100% - 330px)/ 2);
    height: 46px
}

    .matchesSchedule .table .allMatches .item .teamA img {
        float: left;
        margin-right: 12px;
        height: 46px;
        width: auto
    }

    .matchesSchedule .table .allMatches .item .teamB img {
        float: right;
        margin-left: 12px;
        height: 46px;
        width: auto
    }

    .matchesSchedule .table .allMatches .item .teamA p {
        float: left;
        padding-top: 0;
        text-align: left;
        line-height: 3.4
    }

    .matchesSchedule .table .allMatches .item .teamB p {
        float: right;
        padding-top: 0;
        text-align: right;
        line-height: 3.4
    }

.matchesSchedule .table .allMatches .item .result {
    width: 160px
}

.matchesSchedule .table .allMatches .matchResult {
    margin-top: 2px
}

.matchesSchedule .table .allMatches .item .channel {
    float: right;
    width: 120px;
    font-family: DroidKufiLight,arial;
    font-size: 16px;
    color: #1d1d1d;
    line-height: 3;
    direction: rtl;
    text-align: center
}

.matchesSchedule .listing {
    width: 100%;
    margin-bottom: 0
}

.prayerTimes .akhbarThemak {
    height: 552px
}

.prayerTimes .prayerTimesTable {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 0;
    background: 0 0;
    box-shadow: none;
    margin-bottom: 0
}

.prayerTimes .main {
    padding: 24px;
    background: url(http://www.masrawy.com/Images/mosqueBg.jpg) right center no-repeat;
    background-size: cover
}

    .prayerTimes .main .ttl {
        border-bottom: none;
        margin-bottom: 24px
    }

        .prayerTimes .main .ttl h2 {
            color: #fff
        }

    .prayerTimes .main .location {
        display: inline-block;
        width: 100%;
        margin-bottom: 40px
    }

    .prayerTimes .main .cityDate {
        float: right;
        display: inline-block;
        margin-left: 24px;
        width: calc(100% - 324px)
    }

        .prayerTimes .main .cityDate .cityName {
            font-family: DroidKufiBold,Arial;
            font-size: 32px;
            color: #fff;
            direction: rtl;
            float: right
        }

            .prayerTimes .main .cityDate .cityName:after {
                content: "-";
                display: inline-block;
                float: left;
                margin: 0 15px;
                font-size: 36px
            }

        .prayerTimes .main .cityDate .countryName {
            font-family: DroidKufiBold,Arial;
            font-size: 32px;
            color: #fff;
            direction: rtl;
            float: right
        }

        .prayerTimes .main .cityDate date, .prayerTimes .main .wrapperDropdown {
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #fff;
            text-align: right;
            direction: rtl
        }

        .prayerTimes .main .cityDate date {
            float: right;
            display: inline-block;
            width: 100%
        }

    .prayerTimes .main .dropDownDiv {
        display: inline-block;
        float: left;
        width: 300px;
        margin-bottom: 0;
        padding: 0;
        background: 0 0
    }

    .prayerTimes .main .wrapper-demo {
        display: inline-block;
        width: 100%;
        margin-bottom: 12px
    }

        .prayerTimes .main .wrapper-demo:last-child {
            margin-bottom: 0
        }

    .prayerTimes .main .wrapperDropdown {
        position: relative;
        width: 100%;
        background: rgba(255,255,255,.3);
        cursor: pointer;
        padding: 6px 12px;
        border: none;
        z-index: 1;
        outline: 0;
        -webkit-transition: all .2s ease-out;
        -moz-transition: all .2s ease-out;
        -ms-transition: all .2s ease-out;
        -o-transition: all .2s ease-out;
        transition: all .2s ease-out
    }

    .prayerTimes .main .wrapper-demo:first-child .wrapperDropdown {
        z-index: 2
    }

    .prayerTimes .main .icon-downArrow:before {
        content: "q";
        position: absolute;
        left: 12px;
        line-height: 2.2;
        transform: rotate(-90deg)
    }

.contactUsDiv .contactForms .forms .icon-downArrow:before, .weatherDiv .main .icon-downArrow:before {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg)
}

.prayerTimes .main .wrapperDropdown:after {
    display: none
}

.prayerTimes .main .wrapperDropdown .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-radius: 0;
    border: 1px solid rgba(0,0,0,.2);
    border-top: none;
    border-bottom: none;
    list-style: none;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    max-height: 0;
    overflow: hidden
}

    .prayerTimes .main .wrapperDropdown .dropdown li {
        padding: 0 10px
    }

        .prayerTimes .main .wrapperDropdown .dropdown li a {
            display: block;
            text-decoration: none;
            color: #888;
            padding: 10px 0;
            transition: all .3s ease-out;
            border-bottom: 1px solid #e6e8ea
        }

        .prayerTimes .main .wrapperDropdown .dropdown li:last-of-type a {
            border: none
        }

        .prayerTimes .main .wrapperDropdown .dropdown li i {
            margin-right: 5px;
            color: inherit;
            vertical-align: middle
        }

        .prayerTimes .main .wrapperDropdown .dropdown li:hover a {
            color: #1d1d1d
        }

.prayerTimes .main .wrapperDropdown.active {
    border-radius: 0;
    background: #eee;
    box-shadow: none;
    border-bottom: none;
    color: #1d1d1d
}

    .prayerTimes .main .wrapperDropdown.active:after {
        border-color: #aaa transparent
    }

    .prayerTimes .main .wrapperDropdown.active .dropdown {
        border-bottom: 1px solid rgba(0,0,0,.2);
        max-height: 400px;
        overflow: auto
    }

.prayerTimes .mainTable {
    display: inline-block;
    width: 100%
}

.prayerTimes .cntdwn {
    display: inline-block;
    width: 240px;
    float: right;
    text-align: right;
    margin: 0 0 0 36px
}

    .prayerTimes .cntdwn p {
        display: inline-block;
        width: 100%;
        color: #fff;
        font-family: DroidKufiLight,arial;
        font-size: 18px;
        margin: 0 0 12px;
        text-align: right;
        direction: rtl
    }

        .prayerTimes .cntdwn p:first-child {
            font-size: 14px;
            margin-bottom: 10px
        }

            .prayerTimes .cntdwn p:first-child span {
                margin: 0 5px
            }

    .prayerTimes .cntdwn .timerDiv {
        display: inline-block;
        width: 228px;
        height: 50px;
        float: right
    }

        .prayerTimes .cntdwn .timerDiv ul {
            display: inline-block;
            width: 100%;
            margin: 0 auto;
            direction: ltr
        }

            .prayerTimes .cntdwn .timerDiv ul li {
                float: left;
                width: 60px;
                height: 50px;
                text-align: center;
                color: #fff;
                font-family: Arial;
                font-size: 32px;
                position: relative;
                background: rgba(255,255,255,.2);
                margin-right: 24px;
                line-height: 1.5
            }

                .prayerTimes .cntdwn .timerDiv ul li:last-child {
                    margin-right: 0
                }

                .prayerTimes .cntdwn .timerDiv ul li:nth-child(1):after, .prayerTimes .cntdwn .timerDiv ul li:nth-child(2):after {
                    content: ":";
                    background: rgba(0,0,0,0);
                    color: #fff;
                    display: block;
                    font-size: 28px;
                    position: absolute;
                    top: 3px;
                    right: -16px
                }

.prayerTimes .mainTable .prayersTable {
    float: right;
    width: calc(100% - 276px)
}

    .prayerTimes .mainTable .prayersTable .title {
        display: inline-block;
        width: 100%;
        float: right
    }

        .prayerTimes .mainTable .prayersTable .title .name {
            float: right;
            width: calc(100% / 6);
            font-family: DroidKufiBold,Arial;
            font-size: 16px;
            color: #1d1d1d;
            padding: 8px 0;
            text-align: center
        }

            .prayerTimes .mainTable .prayersTable .title .name.active {
                color: #119e9e
            }

            .prayerTimes .mainTable .prayersTable .title .name:nth-child(odd) {
                background: #ebebeb
            }

            .prayerTimes .mainTable .prayersTable .title .name:nth-child(even) {
                background: #f8f8f8
            }

    .prayerTimes .mainTable .prayersTable .allTimes {
        display: inline-block;
        width: 100%;
        float: right
    }

        .prayerTimes .mainTable .prayersTable .allTimes .time {
            float: right;
            width: calc(100% / 6);
            font-family: Arial;
            font-size: 26px;
            color: #888;
            padding: 16px 0;
            text-align: center;
            display: block
        }

            .prayerTimes .mainTable .prayersTable .allTimes .time span {
                display: block;
                font-size: 12px;
                font-family: DroidKufiLight,Arial;
                color: #1d1d1d;
                margin-top: 5px
            }

            .prayerTimes .mainTable .prayersTable .allTimes .time.active, .prayerTimes .mainTable .prayersTable .allTimes .time.active span {
                color: #119e9e
            }

            .prayerTimes .mainTable .prayersTable .allTimes .time:nth-child(odd) {
                background: #f2f2f2
            }

            .prayerTimes .mainTable .prayersTable .allTimes .time:nth-child(even) {
                background: #fff
            }

.prayerTimesTable button {
    display: inline-block;
    width: 280px;
    padding: 5px 0;
    font-family: DroidKufiLight,Arial;
    font-size: 16px;
    color: #fff;
    background: #1d1d1d;
    border: none;
    margin: 0
}

    .prayerTimesTable button.hide, .prayerTimesTable button:hover {
        background: #119e9e
    }

    .prayerTimesTable button:after {
        content: "عرض مواقيت الصلاة خلال شهر";
        display: block
    }

    .prayerTimesTable button.hide:after {
        content: "إخفاء مواقيت الصلاة خلال شهر"
    }

.prayerTimes .monthTable {
    max-height: 0;
    margin-bottom: 0;
    visibility: hidden;
    opacity: 0;
    transition: all .2s ease-in-out 0;
    -webkit-transition: all .2s ease-in-out 0;
    -moz-transition: all .2s ease-in-out 0;
    -ms-transition: all .2s ease-in-out 0;
    -o-transition: all .2s ease-in-out 0
}

    .prayerTimes .monthTable.show {
        max-height: 100%;
        visibility: visible;
        opacity: 1;
        margin-bottom: 40px
    }

    .prayerTimes .monthTable .prayersTable {
        float: right;
        width: 100%
    }

        .prayerTimes .monthTable .prayersTable .title {
            display: inline-block;
            width: 100%;
            float: right
        }

            .prayerTimes .monthTable .prayersTable .title .name {
                float: right;
                width: calc((100% - 220.1px)/ 6);
                font-family: DroidKufiLight,Arial;
                font-size: 16px;
                color: #fff;
                padding: 8px 0;
                text-align: center;
                background: #1d1d1d
            }

                .prayerTimes .monthTable .prayersTable .title .name:first-child {
                    width: 220px
                }

        .prayerTimes .monthTable .prayersTable .allTimes {
            display: inline-block;
            width: 100%;
            float: right;
            border-right: 1px solid #ddd;
            border-left: 1px solid #ddd
        }

            .prayerTimes .monthTable .prayersTable .allTimes .time {
                float: right;
                width: calc((100% - 220px)/ 6);
                font-family: DroidKufiLight,Arial;
                font-size: 16px;
                color: #1d1d1d;
                padding: 8px 0;
                text-align: center;
                display: block
            }

                .prayerTimes .monthTable .prayersTable .allTimes .time:first-child {
                    width: 220px
                }

                .prayerTimes .monthTable .prayersTable .allTimes .time span {
                    margin-left: 5px
                }

            .prayerTimes .monthTable .prayersTable .allTimes:nth-child(even) .time:first-child {
                background: #ebebeb
            }

            .prayerTimes .monthTable .prayersTable .allTimes:nth-child(even) .time, .prayerTimes .monthTable .prayersTable .allTimes:nth-child(odd) .time:first-child {
                background: #f2f2f2
            }

            .prayerTimes .monthTable .prayersTable .allTimes:nth-child(odd) .time {
                background: #fff
            }

            .prayerTimes .monthTable .prayersTable .allTimes:nth-child(2) .time:first-child {
                background: #ddd;
                color: #119e9e
            }

            .prayerTimes .monthTable .prayersTable .allTimes:nth-child(2) .time {
                background: #e8e8e8;
                color: #119e9e
            }

.weatherDiv .akhbarThemak {
    height: 552px
}

.weatherDiv .weatherCnts {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 0;
    background: 0 0;
    box-shadow: none;
    margin-bottom: 0
}

.weatherDiv .main {
    padding: 24px;
    background: url(http://www.masrawy.com/Images/weatherBg.jpg) right center no-repeat;
    background-size: cover
}

    .weatherDiv .main .ttl {
        border-bottom: none;
        margin-bottom: 24px
    }

.weatherDiv .ttl h2 {
    color: #fff
}

    .weatherDiv .ttl h2:after {
        display: none
    }

.weatherDiv .innerListingContainer .ttl {
    border-bottom: 1px solid #51c8f0
}

    .weatherDiv .innerListingContainer .ttl h2 {
        color: #1d1d1d
    }

        .weatherDiv .innerListingContainer .ttl h2:after {
            display: block;
            background: #51c8f0
        }

.weatherDiv .main .location {
    display: inline-block;
    width: 100%;
    margin-bottom: 24px
}

.weatherDiv .main .cityDate {
    float: right;
    display: inline-block;
    margin-left: 24px;
    width: calc(100% - 324px)
}

    .weatherDiv .main .cityDate .cityName {
        font-family: DroidKufiBold,Arial;
        font-size: 32px;
        color: #fff;
        direction: rtl;
        float: right
    }

        .weatherDiv .main .cityDate .cityName:after {
            content: "-";
            display: inline-block;
            float: left;
            margin: 0 15px;
            font-size: 36px
        }

    .weatherDiv .main .cityDate .countryName {
        font-family: DroidKufiBold,Arial;
        font-size: 32px;
        color: #fff;
        direction: rtl;
        float: right
    }

    .weatherDiv .main .cityDate date, .weatherDiv .main .wrapperDropdown {
        text-align: right;
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #fff;
        direction: rtl
    }

    .weatherDiv .main .cityDate date {
        float: right;
        display: inline-block;
        width: 100%
    }

.weatherDiv .main .dropDownDiv {
    display: inline-block;
    float: left;
    width: 300px;
    margin-bottom: 0;
    padding: 0;
    background: 0 0
}

.weatherDiv .main .wrapper-demo {
    display: inline-block;
    width: 100%;
    margin-bottom: 12px
}

    .weatherDiv .main .wrapper-demo:last-child {
        margin-bottom: 0
    }

.weatherDiv .main .wrapperDropdown {
    position: relative;
    width: 100%;
    background: rgba(255,255,255,.3);
    cursor: pointer;
    padding: 6px 12px;
    border: none;
    z-index: 1;
    outline: 0;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -ms-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out
}

.weatherDiv .main .wrapper-demo:first-child .wrapperDropdown {
    z-index: 2
}

.weatherDiv .main .icon-downArrow:before {
    content: "q";
    position: absolute;
    left: 12px;
    line-height: 2.2;
    transform: rotate(-90deg)
}

.weatherDiv .main .wrapperDropdown:after {
    display: none
}

.weatherDiv .main .wrapperDropdown .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-radius: 0;
    border: 1px solid rgba(0,0,0,.2);
    border-top: none;
    border-bottom: none;
    list-style: none;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    max-height: 0;
    overflow: hidden
}

    .weatherDiv .main .wrapperDropdown .dropdown li {
        padding: 0 10px
    }

        .weatherDiv .main .wrapperDropdown .dropdown li a {
            display: block;
            text-decoration: none;
            color: #888;
            padding: 10px 0;
            transition: all .3s ease-out;
            border-bottom: 1px solid #e6e8ea
        }

        .weatherDiv .main .wrapperDropdown .dropdown li:last-of-type a {
            border: none
        }

        .weatherDiv .main .wrapperDropdown .dropdown li i {
            margin-right: 5px;
            color: inherit;
            vertical-align: middle
        }

        .weatherDiv .main .wrapperDropdown .dropdown li:hover a {
            color: #1d1d1d
        }

.weatherDiv .main .wrapperDropdown.active {
    border-radius: 0;
    background: #eee;
    box-shadow: none;
    border-bottom: none;
    color: #1d1d1d
}

    .weatherDiv .main .wrapperDropdown.active:after {
        border-color: #aaa transparent
    }

    .weatherDiv .main .wrapperDropdown.active .dropdown {
        border-bottom: 1px solid rgba(0,0,0,.2);
        max-height: 400px;
        overflow: auto
    }

.weatherDiv .main .weatherIconCnts {
    float: right;
    width: 110px;
    margin-left: 48px
}

.weatherDiv .main .weatherIcon {
    width: 110px;
    margin: 0
}

    .weatherDiv .main .weatherIcon.sunny {
        background: url(http://www.masrawy.com/images/weatherSprite.png) no-repeat;
        height: 110px;
        margin-top: 2px
    }

    .weatherDiv .main .weatherIcon.cloudy {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -130px no-repeat;
        height: 86px;
        margin-top: 14px
    }

    .weatherDiv .main .weatherIcon.partlycloudy {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -236px no-repeat;
        height: 98px;
        margin-top: 8px
    }

    .weatherDiv .main .weatherIcon.patchylightdrizzle {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -354px no-repeat;
        height: 114px;
        margin-top: 0
    }

    .weatherDiv .main .weatherIcon.lightdrizzle {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -488px no-repeat;
        height: 90px;
        margin-top: 12px
    }

    .weatherDiv .main .weatherIcon.lightrainshower, .weatherDiv .main .weatherIcon.lightsleetshowers {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -354px no-repeat;
        height: 114px;
        margin-top: 0
    }

    .weatherDiv .main .weatherIcon.patchylightrain {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -488px no-repeat;
        height: 90px;
        margin-top: 12px
    }

    .weatherDiv .main .weatherIcon.patchyrainnearby {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -354px no-repeat;
        height: 114px;
        margin-top: 0
    }

.weatherDiv .temp {
    width: 100%;
    display: inline-block;
    margin-bottom: 24px
}

    .weatherDiv .temp .icon-high {
        float: right;
        font-family: Arial;
        color: #fff;
        font-size: 82px;
        position: relative;
        padding-right: 24px;
        margin-left: 48px;
        margin-top: 10px
    }

        .weatherDiv .temp .icon-high:before {
            content: "H";
            font-size: 24px;
            position: absolute;
            top: 0;
            right: 0
        }

    .weatherDiv .temp .icon-low {
        float: right;
        font-family: Arial;
        color: #fff;
        font-size: 60px;
        position: relative;
        padding-right: 18px;
        opacity: .5;
        margin-top: 28px
    }

        .weatherDiv .temp .icon-low:before {
            content: "H";
            font-size: 18px;
            position: absolute;
            top: 0;
            right: 0
        }

.weatherDiv .weatherTable {
    float: right;
    width: 100%
}

    .weatherDiv .weatherTable .title {
        display: inline-block;
        width: 100%;
        float: right
    }

        .weatherDiv .weatherTable .title .name {
            float: right;
            width: calc((100% / 3) - .1px);
            font-family: DroidKufiBold,Arial;
            font-size: 16px;
            color: #1d1d1d;
            padding: 8px 0;
            text-align: center
        }

            .weatherDiv .weatherTable .title .name.active {
                color: #119e9e
            }

            .weatherDiv .weatherTable .title .name:nth-child(odd) {
                background: #ebebeb
            }

            .weatherDiv .weatherTable .title .name:nth-child(even) {
                background: #f8f8f8
            }

    .weatherDiv .weatherTable .allTimes {
        display: inline-block;
        width: 100%;
        float: right
    }

        .weatherDiv .weatherTable .allTimes .dayTemp {
            float: right;
            width: calc((100% / 3) - .1px);
            height: 190px;
            padding: 16px 0;
            text-align: center;
            display: block
        }

            .weatherDiv .weatherTable .allTimes .dayTemp date {
                font-family: DroidKufiLight,Arial;
                color: #888;
                font-size: 14px;
                margin-bottom: 12px;
                display: inline-block
            }

.weatherDiv .main .weatherDayIcon {
    width: 58px
}

    .weatherDiv .main .weatherDayIcon.sunny {
        background: url(http://www.masrawy.com/images/weatherSprite.png) no-repeat;
        height: 58px;
        margin: 2px;
        background-size: 58px
    }

    .weatherDiv .main .weatherDayIcon.cloudy {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -68px no-repeat;
        height: 46px;
        margin: 8px;
        background-size: 58px
    }

    .weatherDiv .main .weatherDayIcon.partlycloudy {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -124px no-repeat;
        height: 52px;
        margin: 5px;
        background-size: 58px
    }

    .weatherDiv .main .weatherDayIcon.patchylightdrizzle {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -184px no-repeat;
        height: 62px;
        margin: 0;
        background-size: 58px
    }

    .weatherDiv .main .weatherDayIcon.lightdrizzle {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -256px no-repeat;
        height: 48px;
        margin: 7px;
        background-size: 58px
    }

    .weatherDiv .main .weatherDayIcon.lightrainshower, .weatherDiv .main .weatherDayIcon.lightsleetshowers {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -184px no-repeat;
        height: 62px;
        margin: 0;
        background-size: 58px
    }

    .weatherDiv .main .weatherDayIcon.patchylightrain {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -256px no-repeat;
        height: 48px;
        margin: 7px;
        background-size: 58px
    }

    .weatherDiv .main .weatherDayIcon.patchyrainnearby {
        background: url(http://www.masrawy.com/images/weatherSprite.png) 0 -184px no-repeat;
        height: 62px;
        margin: 0;
        background-size: 58px
    }

.weatherDiv .dayTempDtls {
    display: inline-block
}

    .weatherDiv .dayTempDtls .icon-high {
        float: right;
        font-family: Arial;
        color: #1d1d1d;
        font-size: 36px;
        position: relative;
        margin-left: 24px;
        text-align: left
    }

        .weatherDiv .dayTempDtls .icon-high:before {
            content: "H";
            font-size: 14px;
            position: absolute;
            top: -2px;
            right: -12px
        }

    .weatherDiv .dayTempDtls .icon-low {
        float: right;
        font-family: Arial;
        color: #888;
        font-size: 30px;
        position: relative;
        margin-top: 6px;
        text-align: right
    }

        .weatherDiv .dayTempDtls .icon-low:before {
            content: "H";
            font-size: 10px;
            position: absolute;
            top: -2px;
            right: -10px
        }

.weatherDiv .weatherTable .allTimes .dayTemp:nth-child(odd) {
    background: #f2f2f2
}

.weatherDiv .weatherTable .allTimes .dayTemp:nth-child(even) {
    background: #fff
}

.currGoldDiv .akhbarThemak {
    height: 552px
}

.currGoldDiv .currencyDiv {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 0;
    background: 0 0;
    box-shadow: none;
    margin-bottom: 0
}

.currGoldDiv .main {
    padding: 24px
}

.currGoldDiv .ttl {
    border-bottom: 1px solid #f5c525
}

    .currGoldDiv .ttl h2:after {
        background: #f5c525
    }

.currGoldDiv .main h3 {
    display: inline-block;
    width: 100%;
    margin: 24px 0;
    font-family: DroidKufiLight,arial;
    font-size: 18px;
    color: #1d1d1d;
    text-align: right;
    direction: rtl
}

    .currGoldDiv .main h3 span {
        color: #888;
        margin-right: 5px
    }

.currGoldDiv .currGoldTable {
    float: right;
    width: 100%;
    border: 1px solid #ddd
}

    .currGoldDiv .currGoldTable .title {
        display: inline-block;
        width: 100%;
        float: right
    }

        .currGoldDiv .currGoldTable .title .name {
            float: right;
            width: calc(100% / 4);
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #fff;
            padding: 8px 0;
            text-align: center;
            background: #1d1d1d
        }

    .currGoldDiv .currGoldTable .currGoldDtls {
        display: inline-block;
        width: 100%;
        float: right;
        height: 46px;
        overflow: hidden
    }

        .currGoldDiv .currGoldTable .currGoldDtls .item {
            float: right;
            width: calc(100% / 4);
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            line-height: 2.1;
            color: #1d1d1d;
            padding: 8px 0;
            text-align: center;
            display: block
        }

.currGoldDiv .goldDiv .currGoldTable .currGoldDtls .item:first-child, .currGoldDiv .goldDiv .currGoldTable .title .name:first-child {
    min-width: initial
}

.currGoldDiv .currGoldTable .currGoldDtls .item img {
    float: right;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    margin: 2px 10px 0
}

.currGoldDiv .currGoldTable .currGoldDtls .item p {
    line-height: 2.4;
    font-size: 14px
}

.currGoldDiv .currGoldTable .currGoldDtls:nth-child(even) .item:first-child {
    background: #ebebeb
}

.currGoldDiv .currGoldTable .currGoldDtls:nth-child(even) .item, .currGoldDiv .currGoldTable .currGoldDtls:nth-child(odd) .item:first-child {
    background: #f2f2f2
}

.currGoldDiv .currGoldTable .currGoldDtls:nth-child(odd) .item {
    background: #fff
}

@media screen and (min-width:1024px) and (max-width:1162px) {
    .currGoldDiv .currGoldTable .currGoldDtls .item, .currGoldDiv .currGoldTable .title .name {
        width: calc((100% - 150px)/ 3)
    }
}

@media screen and (min-width:320px) and (max-width:638px) {
    .currGoldDiv .currGoldTable .currGoldDtls .item, .currGoldDiv .currGoldTable .title .name {
        width: calc((100% - 150px)/ 3)
    }
}

.currGoldDiv .goldDiv {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 0;
    background: 0 0;
    box-shadow: none;
    margin-bottom: 0
}

    .currGoldDiv .goldDiv .currGoldTable .currGoldDtls .item, .currGoldDiv .goldDiv .currGoldTable .title .name {
        width: calc(100% / 2)
    }

    .currGoldDiv .goldDiv .goldProvider {
        width: 300px;
        display: inline-block;
        margin: 24px
    }

        .currGoldDiv .goldDiv .goldProvider p {
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #1d1d1d;
            text-align: center;
            cursor: default
        }

            .currGoldDiv .goldDiv .goldProvider p a {
                color: #888;
                cursor: pointer
            }

        .currGoldDiv .goldDiv .goldProvider a {
            display: inline-block;
            margin-top: 12px
        }

            .currGoldDiv .goldDiv .goldProvider a img {
                border: none
            }

.contactUsDiv .contactUsCnts {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px
}

.contactUsDiv .contactForms .forms, .contactUsDiv .contactForms h3 {
    width: 100%;
    display: inline-block
}

.contactUsDiv .akhbarThemak {
    height: 552px
}

.contactUsDiv .contactForms {
    background: 0 0;
    box-shadow: none;
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
    margin-bottom: 0
}

    .contactUsDiv .contactForms h3 {
        margin: 24px 0 36px;
        font-family: DroidKufiLight,arial;
        font-size: 16px;
        color: #1d1d1d;
        text-align: right;
        direction: rtl;
        background: #f2f2f2;
        padding: 12px 24px
    }

    .contactUsDiv .contactForms .forms .item {
        display: inline-block;
        width: 100%;
        margin-bottom: 36px;
        position: relative
    }

        .contactUsDiv .contactForms .forms .item .labelDiv {
            float: right;
            width: 156px
        }

            .contactUsDiv .contactForms .forms .item .labelDiv label {
                font-family: DroidKufiLight,Arial;
                font-size: 16px;
                color: #1d1d1d;
                direction: rtl;
                text-align: right;
                float: right
            }

            .contactUsDiv .contactForms .forms .item .labelDiv span {
                color: red;
                float: right;
                margin-right: 2px;
                line-height: 1.5
            }

        .contactUsDiv .contactForms .forms .item .errorMsg {
            position: absolute;
            top: 40px;
            right: 156px;
            display: inline-block;
            font-family: DroidKufiLight,Arial;
            font-size: 13px;
            color: red;
            direction: rtl;
            text-align: right;
            visibility: hidden
        }

        .contactUsDiv .contactForms .forms .item input, .contactUsDiv .contactForms .forms .item textarea {
            width: calc(100% - 156px) !important;
            height: 40px !important;
            border: 1px solid #ddd;
            float: right;
            outline: 0;
            padding: 12px;
            font-family: DroidKufiLight,Arial;
            color: #888;
            font-size: 14px
        }

        .contactUsDiv .contactForms .forms .item textarea {
            height: 200px !important
        }

        .contactUsDiv .contactForms .forms .item .captcha {
            float: right
        }

    .contactUsDiv .contactForms .forms input[type=submit] {
        display: inline-block;
        width: 300px;
        padding: 5px 0;
        background: #aa120d;
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #fff;
        text-align: center;
        border: none;
        margin: 24px;
        cursor: pointer
    }

    .contactUsDiv .contactForms .forms .wrapper-demo {
        display: inline-block;
        width: calc(100% - 156px);
        float: right
    }

    .contactUsDiv .contactForms .forms .wrapperDropdown {
        width: 100%;
        height: 40px !important;
        border: 1px solid #ddd;
        float: right;
        outline: 0;
        padding: 5px 12px;
        font-family: DroidKufiLight,Arial;
        color: #888;
        font-size: 14px;
        -webkit-transition: all .2s ease-out;
        -moz-transition: all .2s ease-out;
        -ms-transition: all .2s ease-out;
        -o-transition: all .2s ease-out;
        transition: all .2s ease-out
    }

    .contactUsDiv .contactForms .forms .icon-downArrow:before {
        content: "q";
        position: absolute;
        left: 12px;
        line-height: 2.2;
        transform: rotate(-90deg)
    }

    .contactUsDiv .contactForms .forms .wrapperDropdown:after {
        display: none
    }

    .contactUsDiv .contactForms .forms .wrapperDropdown .dropdown {
        position: absolute;
        width: calc(100% + 2px);
        top: 100%;
        left: 0;
        right: -1px;
        background: #fff;
        border-radius: 0;
        border: 1px solid rgba(0,0,0,.2);
        border-top: none;
        border-bottom: none;
        list-style: none;
        -webkit-transition: all .3s ease-out;
        -moz-transition: all .3s ease-out;
        -ms-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out;
        max-height: 0;
        overflow: hidden
    }

        .contactUsDiv .contactForms .forms .wrapperDropdown .dropdown li {
            padding: 0 10px
        }

            .contactUsDiv .contactForms .forms .wrapperDropdown .dropdown li a {
                display: block;
                text-decoration: none;
                color: #888;
                padding: 10px 0;
                transition: all .3s ease-out;
                border-bottom: 1px solid #e6e8ea
            }

            .contactUsDiv .contactForms .forms .wrapperDropdown .dropdown li:last-of-type a {
                border: none
            }

            .contactUsDiv .contactForms .forms .wrapperDropdown .dropdown li i {
                margin-right: 5px;
                color: inherit;
                vertical-align: middle
            }

            .contactUsDiv .contactForms .forms .wrapperDropdown .dropdown li:hover a {
                color: #1d1d1d
            }

    .contactUsDiv .contactForms .forms .wrapperDropdown.active {
        border-radius: 0;
        background: #eee;
        box-shadow: none;
        border-bottom: none;
        color: #1d1d1d
    }

        .contactUsDiv .contactForms .forms .wrapperDropdown.active:after {
            border-color: #aaa transparent
        }

        .contactUsDiv .contactForms .forms .wrapperDropdown.active .dropdown {
            border-bottom: 1px solid rgba(0,0,0,.2);
            max-height: 400px;
            overflow: auto
        }

.contactUsDiv .contactAds {
    background: 0 0;
    box-shadow: none;
    margin-bottom: 0
}

    .contactUsDiv .contactAds h3 {
        display: inline-block;
        width: 100%;
        margin: 24px 0;
        font-family: DroidKufiLight,arial;
        font-size: 18px;
        color: #fff;
        text-align: right;
        direction: rtl;
        background: #1d1d1d;
        padding: 12px 24px
    }

    .contactUsDiv .contactAds .ads {
        display: inline-block;
        width: 100%;
        margin: 0 0 12px
    }

        .contactUsDiv .contactAds .ads .item {
            display: inline-block;
            width: calc((100% - 24px)/ 2);
            position: relative;
            margin: 0 0 24px 24px;
            float: right
        }

            .contactUsDiv .contactAds .ads .item:nth-child(2n) {
                margin-left: 0
            }

            .contactUsDiv .contactAds .ads .item label {
                float: right;
                width: 100%;
                font-family: DroidKufiBold,Arial;
                font-size: 16px;
                color: #1d1d1d;
                direction: rtl;
                text-align: right
            }

            .contactUsDiv .contactAds .ads .item a, .contactUsDiv .contactAds .ads .item p {
                float: right;
                width: 100%;
                font-family: DroidKufiLight,Arial;
                font-size: 16px;
                color: #888;
                direction: rtl;
                text-align: right
            }

            #gmap_canvas, .contactUsDiv .contactAds .ads .item.phone p {
                direction: ltr
            }

            .contactUsDiv .contactAds .ads .item p {
                cursor: default
            }

            .contactUsDiv .contactAds .ads .item a {
                text-decoration: underline;
                color: #aa120d
            }

#gmap_canvas {
    height: 450px;
    width: 100%
}

    #gmap_canvas img {
        max-width: none !important;
        background: 0 0 !important
    }

    #gmap_canvas strong {
        font-weight: 700
    }

.zakahDiv .zakahCnts {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px
}

.zakahDiv .akhbarThemak {
    height: 552px
}

.zakahDiv .zakahForms {
    background: 0 0;
    box-shadow: none;
    padding-bottom: 12px;
    margin-bottom: 0
}

    .zakahDiv .zakahForms h3, .zakahDiv .zakahForms h4 {
        display: inline-block;
        width: 100%;
        font-family: DroidKufiLight,arial;
        padding: 12px 24px;
        direction: rtl;
        text-align: right
    }

    .zakahDiv .zakahForms h3 {
        margin: 24px 0 36px;
        font-size: 16px;
        color: #1d1d1d;
        background: #f2f2f2
    }

    .zakahDiv .zakahForms h4 {
        margin: 0;
        font-size: 18px;
        color: #fff;
        background: #1d1d1d
    }

    .zakahDiv .zakahForms .forms .item, .zakahDiv .zakahForms .forms .item .formItem {
        margin-bottom: 36px;
        position: relative;
        width: 100%;
        display: inline-block
    }

    .zakahDiv .zakahForms .forms {
        display: inline-block;
        width: 100%
    }

        .zakahDiv .zakahForms .forms .item .formItem {
            background: #f2f2f2;
            padding: 24px
        }

            .zakahDiv .zakahForms .forms .item .formItem:last-child {
                margin-bottom: 0
            }

        .zakahDiv .zakahForms .forms .item .top {
            display: inline-block;
            width: 100%;
            margin-bottom: 12px;
            position: relative
        }

        .zakahDiv .zakahForms .forms .item .labelDiv {
            float: right;
            width: 100%
        }

            .zakahDiv .zakahForms .forms .item .labelDiv label {
                font-family: DroidKufiLight,Arial;
                font-size: 16px;
                color: #1d1d1d;
                direction: rtl;
                text-align: right;
                float: right
            }

            .zakahDiv .zakahForms .forms .item .labelDiv span {
                color: red;
                float: right;
                margin-right: 2px;
                line-height: 1.5
            }

        .zakahDiv .zakahForms .forms .item .errorMsg {
            position: absolute;
            top: 40px;
            right: 156px;
            display: inline-block;
            font-family: DroidKufiLight,Arial;
            font-size: 13px;
            color: red;
            direction: rtl;
            text-align: right;
            visibility: hidden
        }

        .zakahDiv .zakahForms .forms .item input, .zakahDiv .zakahForms .forms .item textarea {
            width: 100% !important;
            height: 40px !important;
            border: 1px solid #ddd;
            float: right;
            outline: 0;
            padding: 12px;
            font-family: DroidKufiLight,Arial;
            color: #888;
            font-size: 14px
        }

        .zakahDiv .zakahForms .forms .item textarea {
            height: 200px !important
        }

        .zakahDiv .zakahForms .forms .item .captcha {
            float: right
        }

        .zakahDiv .zakahForms .forms .calculate {
            display: inline-block;
            width: 300px;
            padding: 5px 0;
            background: #119e9e;
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #fff;
            text-align: center;
            border: none;
            margin: 24px;
            cursor: pointer
        }

        .zakahDiv .zakahForms .forms .wrapper-demo {
            display: inline-block;
            width: calc(100% - 156px);
            float: right
        }

        .zakahDiv .zakahForms .forms .wrapperDropdown {
            width: 100%;
            height: 40px !important;
            border: 1px solid #ddd;
            float: right;
            outline: 0;
            padding: 5px 12px;
            font-family: DroidKufiLight,Arial;
            color: #888;
            font-size: 14px;
            -webkit-transition: all .2s ease-out;
            -moz-transition: all .2s ease-out;
            -ms-transition: all .2s ease-out;
            -o-transition: all .2s ease-out;
            transition: all .2s ease-out
        }

        .zakahDiv .zakahForms .forms .icon-downArrow:before {
            content: "q";
            position: absolute;
            left: 12px;
            line-height: 2.2;
            -webkit-transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -ms-transform: rotate(-90deg);
            -o-transform: rotate(-90deg);
            transform: rotate(-90deg)
        }

        .zakahDiv .zakahForms .forms .wrapperDropdown:after {
            display: none
        }

        .zakahDiv .zakahForms .forms .wrapperDropdown .dropdown {
            position: absolute;
            width: calc(100% + 2px);
            top: 100%;
            left: 0;
            right: -1px;
            background: #fff;
            border-radius: 0;
            border: 1px solid rgba(0,0,0,.2);
            border-top: none;
            border-bottom: none;
            list-style: none;
            -webkit-transition: all .3s ease-out;
            -moz-transition: all .3s ease-out;
            -ms-transition: all .3s ease-out;
            -o-transition: all .3s ease-out;
            transition: all .3s ease-out;
            max-height: 0;
            overflow: hidden
        }

            .zakahDiv .zakahForms .forms .wrapperDropdown .dropdown li {
                padding: 0 10px
            }

                .zakahDiv .zakahForms .forms .wrapperDropdown .dropdown li a {
                    display: block;
                    text-decoration: none;
                    color: #888;
                    padding: 10px 0;
                    transition: all .3s ease-out;
                    border-bottom: 1px solid #e6e8ea
                }

                .zakahDiv .zakahForms .forms .wrapperDropdown .dropdown li:last-of-type a {
                    border: none
                }

                .zakahDiv .zakahForms .forms .wrapperDropdown .dropdown li i {
                    margin-right: 5px;
                    color: inherit;
                    vertical-align: middle
                }

                .zakahDiv .zakahForms .forms .wrapperDropdown .dropdown li:hover a {
                    color: #1d1d1d
                }

        .zakahDiv .zakahForms .forms .wrapperDropdown.active {
            border-radius: 0;
            background: #eee;
            box-shadow: none;
            border-bottom: none;
            color: #1d1d1d
        }

    .surveyDiv .allQues .cd-popup-container, .zakahDiv .zakahForms .cd-popup-container {
        box-shadow: 0 0 20px rgba(0,0,0,.4);
        -moz-transform: translateY(-40px);
        -webkit-backface-visibility: hidden
    }

    .zakahDiv .zakahForms .forms .wrapperDropdown.active:after {
        border-color: #aaa transparent
    }

    .zakahDiv .zakahForms .forms .wrapperDropdown.active .dropdown {
        border-bottom: 1px solid rgba(0,0,0,.2);
        max-height: 400px;
        overflow: auto
    }

    .zakahDiv .zakahForms .popupSetting {
        position: fixed;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        background-color: rgba(255,255,255,.95);
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s 0s,visibility 0 .3s;
        -moz-transition: opacity .3s 0s,visibility 0 .3s;
        transition: opacity .3s 0s,visibility 0 .3s
    }

        .zakahDiv .zakahForms .popupSetting.is-visible {
            opacity: 1;
            visibility: visible;
            z-index: 9;
            -webkit-transition: opacity .3s 0s,visibility 0 0;
            -moz-transition: opacity .3s 0s,visibility 0 0;
            transition: opacity .3s 0s,visibility 0 0
        }

    .zakahDiv .zakahForms .cd-popup-container {
        position: relative;
        padding: 24px;
        width: 700px;
        height: 430px;
        margin: 120px auto;
        background: #FFF;
        text-align: center;
        -webkit-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        -webkit-transition-property: -webkit-transform;
        -moz-transition-property: -moz-transform;
        transition-property: transform;
        -webkit-transition-duration: .3s;
        -moz-transition-duration: .3s;
        transition-duration: .3s
    }

        .zakahDiv .zakahForms .cd-popup-container h2 {
            display: inline-block;
            width: 100%;
            font-family: DroidKufiBold,Arial;
            font-size: 22px;
            color: #1d1d1d;
            margin-bottom: 24px;
            padding: 0
        }

        .zakahDiv .zakahForms .cd-popup-container #lblres, .zakahDiv .zakahForms .cd-popup-container #txtGoldPriceValidation, .zakahDiv .zakahForms .cd-popup-container .labelDiv label {
            font-size: 16px;
            color: #1d1d1d;
            line-height: 2.6;
            text-align: right;
            float: right;
            direction: rtl
        }

        .zakahDiv .zakahForms .cd-popup-container h2:after {
            display: none
        }

        .zakahDiv .zakahForms .cd-popup-container .labelDiv {
            display: inline-block;
            width: 100%;
            float: right;
            margin: 24px 0
        }

            .zakahDiv .zakahForms .cd-popup-container .labelDiv label {
                font-family: DroidKufiLight,Arial;
                width: 200px
            }

        .zakahDiv .zakahForms .cd-popup-container #txtGoldPriceValidation {
            font-family: DroidKufiLight,Arial
        }

        .zakahDiv .zakahForms .cd-popup-container #lblres {
            font-family: DroidKufiBold,Arial
        }

        .zakahDiv .zakahForms .cd-popup-container .labelDiv p {
            font-family: Arial;
            font-size: 32px;
            color: #119e9e;
            float: right
        }

        .zakahDiv .zakahForms .cd-popup-container .labelDiv span {
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #1d1d1d;
            margin-right: 5px;
            font-weight: 400
        }

        .zakahDiv .zakahForms .cd-popup-container .cd-popup-close {
            position: absolute;
            top: 12px;
            left: 12px;
            width: 36px;
            height: 36px
        }

            .zakahDiv .zakahForms .cd-popup-container .cd-popup-close::after, .zakahDiv .zakahForms .cd-popup-container .cd-popup-close::before {
                content: '';
                position: absolute;
                top: 0;
                width: 2px;
                height: 100%;
                background-color: #1d1d1d;
                opacity: .2;
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0
            }

            .zakahDiv .zakahForms .cd-popup-container .cd-popup-close:hover::after, .zakahDiv .zakahForms .cd-popup-container .cd-popup-close:hover::before {
                opacity: 1
            }

            .zakahDiv .zakahForms .cd-popup-container .cd-popup-close::before {
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                transform: rotate(45deg)
            }

            .zakahDiv .zakahForms .cd-popup-container .cd-popup-close::after {
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                transform: rotate(-45deg)
            }

    .zakahDiv .zakahForms .is-visible .cd-popup-container {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

body.popupOverlay {
    position: fixed
}

.newsPointerDiv .newsPointer {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px;
    height: auto
}

.masrawyServicesDiv .akhbarThemak, .newsPointerDiv .akhbarThemak {
    height: 552px
}

.masrawyServicesDiv .ttl {
    border-bottom: 1px solid #e2192c
}

    .masrawyServicesDiv .ttl h2:after {
        background: #e2192c
    }

.masrawyServicesDiv .services {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px;
    height: auto
}

    .masrawyServicesDiv .services h3 {
        display: inline-block;
        width: 100%;
        margin: 24px 0;
        font-family: DroidKufiLight,arial;
        font-size: 18px;
        color: #1d1d1d;
        text-align: right;
        direction: rtl;
        background: #f2f2f2;
        padding: 12px 24px
    }

    .masrawyServicesDiv .services .servicesCnts {
        display: inline-block;
        width: 100%
    }

        .masrawyServicesDiv .services .servicesCnts .item {
            float: right;
            min-width: 300px;
            width: calc((100% - 24px)/ 2);
            margin: 0 0 24px 24px;
            border: 1px solid #ddd;
            text-align: center;
            padding: 24px
        }

            .masrawyServicesDiv .services .servicesCnts .item:nth-child(2n) {
                margin-left: 0
            }

            .masrawyServicesDiv .services .servicesCnts .item img {
                margin-bottom: 24px;
                border: none
            }

            .masrawyServicesDiv .services .servicesCnts .item h4 {
                font-family: Arial;
                font-size: 36px;
                color: #1d1d1d;
                display: inline-block;
                width: 100%;
                text-align: center;
                text-transform: uppercase;
                font-weight: 700;
                letter-spacing: -2px
            }

            .masrawyServicesDiv .services .servicesCnts .item h5 {
                display: inline-block;
                width: 100%;
                margin: 24px 0;
                font-family: DroidKufiLight,arial;
                font-size: 16px;
                color: #1d1d1d;
                text-align: center;
                direction: rtl;
                background: #f2f2f2;
                padding: 5px 0
            }

            .masrawyServicesDiv .services .servicesCnts .item p {
                display: inline-block;
                width: 100%;
                color: #1d1d1d;
                font-family: DroidKufiLight,arial;
                font-size: 14px;
                text-align: right;
                direction: rtl;
                height: 80px
            }

            .masrawyServicesDiv .services .servicesCnts .item button {
                width: 100%;
                padding: 5px 0;
                background: #1d1d1d;
                font-family: DroidKufiLight,Arial;
                font-size: 18px;
                color: #fff;
                text-align: center;
                border: none;
                margin: 24px 0 0
            }

            .masrawyServicesDiv .services .servicesCnts .item.bulk {
                border: 1px solid #ef7d46
            }

                .masrawyServicesDiv .services .servicesCnts .item.bulk button {
                    background: #ef7d46
                }

                    .masrawyServicesDiv .services .servicesCnts .item.bulk button:hover {
                        background: #d86c38
                    }

            .masrawyServicesDiv .services .servicesCnts .item.jm {
                border: 1px solid #85c34a
            }

                .masrawyServicesDiv .services .servicesCnts .item.jm button {
                    background: #85c34a
                }

                    .masrawyServicesDiv .services .servicesCnts .item.jm button:hover {
                        background: #6daa33
                    }

            .masrawyServicesDiv .services .servicesCnts .item.vas {
                border: 1px solid #7e5ae2
            }

                .masrawyServicesDiv .services .servicesCnts .item.vas button {
                    background: #7e5ae2
                }

                    .masrawyServicesDiv .services .servicesCnts .item.vas button:hover {
                        background: #6642c9
                    }

            .masrawyServicesDiv .services .servicesCnts .item.bulk img {
                margin: 2px 0 25px
            }

            .masrawyServicesDiv .services .servicesCnts .item.jumia img {
                margin: 13px 0 36px
            }

            .masrawyServicesDiv .services .servicesCnts .item.mob img {
                margin: 2px 0 26px
            }

@media screen and (min-width:1359px) and (max-width:1571px) {
    .masrawyServicesDiv .services .servicesCnts .item p {
        height: 108px
    }
}

@media screen and (min-width:1237px) and (max-width:1358px) {
    .masrawyServicesDiv .services .servicesCnts .item p {
        height: 135px
    }
}

@media screen and (min-width:1185px) and (max-width:1237px) {
    .masrawyServicesDiv .services .servicesCnts .item p {
        height: 162px
    }
}

@media screen and (min-width:1024px) and (max-width:1184px) {
    .masrawyServicesDiv .services .servicesCnts .item {
        min-width: 300px;
        width: 100%;
        margin: 0 0 24px
    }

        .masrawyServicesDiv .services .servicesCnts .item p {
            height: auto
        }
}

.pollListingDiv .akhbarThemak {
    height: 552px
}

.pollListingDiv .pollListing {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px;
    height: auto;
    min-height: 830px
}

    .pollListingDiv .pollListing .allItems, .pollListingDiv .pollListing .allItems ul li {
        padding: 12px 0;
        width: 100%;
        display: inline-block
    }

        .pollListingDiv .pollListing .allItems ul {
            display: inline-block;
            width: 100%
        }

            .pollListingDiv .pollListing .allItems ul li {
                border-bottom: 1px solid #eee
            }

                .pollListingDiv .pollListing .allItems ul li p {
                    display: inline-block;
                    width: 100%;
                    font-family: DroidKufiLight,Arial;
                    font-size: 16px;
                    color: #1d1d1d;
                    text-align: right;
                    direction: rtl;
                    margin-bottom: 12px
                }

                .pollListingDiv .pollListing .allItems ul li .allButtons {
                    display: inline-block;
                    width: 100%
                }

                    .pollListingDiv .pollListing .allItems ul li .allButtons button {
                        float: right;
                        margin-left: 5px;
                        width: 100px;
                        height: 30px;
                        background: #1d1d1d;
                        font-family: DroidKufiLight,Arial;
                        text-align: center;
                        font-size: 14px;
                        color: #fff
                    }

                        .pollListingDiv .pollListing .allItems ul li .allButtons button:last-child {
                            margin-left: 0
                        }

                        .pollListingDiv .pollListing .allItems ul li .allButtons button.results {
                            background: #1d1d1d
                        }

                        .pollListingDiv .pollListing .allItems ul li .allButtons button.choices {
                            background: #aa120d
                        }

                        .pollListingDiv .pollListing .allItems ul li .allButtons button.fb {
                            background: #3d5698;
                            width: 30px
                        }

                        .pollListingDiv .pollListing .allItems ul li .allButtons button.icon-fb:before {
                            content: "u";
                            font-size: 20px;
                            line-height: 1.6
                        }

                        .pollListingDiv .pollListing .allItems ul li .allButtons button.tw {
                            background: #219ff3;
                            width: 30px
                        }

                        .pollListingDiv .pollListing .allItems ul li .allButtons button.icon-tw:before {
                            content: "v";
                            font-size: 20px;
                            line-height: 1.5
                        }

.policyDiv .akhbarThemak {
    height: 552px
}

.policyDiv .policy {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px;
    height: auto;
    min-height: 830px
}

    .policyDiv .policy .policyDtls {
        display: inline-block;
        width: 100%;
        padding: 24px 0
    }

        .policyDiv .policy .policyDtls .item {
            display: inline-block;
            width: 100%;
            margin-bottom: 40px
        }

            .policyDiv .policy .policyDtls .item:last-child {
                margin-bottom: 0
            }

        .policyDiv .policy .policyDtls ul {
            display: inline-block;
            width: 100%;
            padding-right: 36px
        }

        .policyDiv .policy .policyDtls a, .policyDiv .policy .policyDtls li, .policyDiv .policy .policyDtls p {
            display: inline-block;
            width: 100%;
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #1d1d1d;
            text-align: right;
            direction: rtl;
            margin: 12px 0;
            cursor: default
        }

        .policyDiv .policy .policyDtls li {
            list-style-type: square;
            display: list-item;
            margin: 24px 0
        }

.loader, .showcaseDiv {
    display: inline-block
}

.policyDiv .policy .policyDtls a {
    color: #aa120d;
    text-decoration: underline;
    cursor: pointer
}

.policyDiv .policy .policyDtls p.head {
    font-family: DroidKufiBold,Arial;
    font-size: 16px;
    margin: 0
}

.policyDiv .policy .policyDtls p.point {
    font-family: DroidKufiBold,Arial;
    font-size: 14px;
    margin: 12px 0 0
}

.policyDiv .policy .policyDtls p strong {
    font-family: DroidKufiBold,Arial;
    font-size: 13px
}

.content .mainMedia section {
    background: #1d1d1d
}

.content .mainMedia .featuredArea li {
    border: 1px solid #333
}

.content .mainMedia .ttl {
    border-bottom: none
}

    .content .mainMedia .ttl h2, .content .mainMedia .ttl h2 a {
        color: #fff
    }

.billboardDiv .adTtl, .leaderboardDiv .adTtl, .monsterDiv .adTtl, .showcaseDiv .adTtl {
    font-family: DroidKufiLight,arial;
    color: #aaa;
    font-size: 11px;
    line-height: 1.6;
    text-align: center
}

.content .mainMedia .ttl h2:after {
    background: #fff
}

.content .mainMedia .catPattern01 .allItems {
    padding: 5px 0 0
}

.content .mainMedia .catPattern01 ul li a img {
    border: 1px solid #333
}

.loader img, .oneStickyDiv .onLogo img {
    border: none
}

.loader {
    width: 60px;
    margin: 24px
}

    .loader img {
        height: auto
    }

    .loader.grey {
        height: 206px;
        position: relative
    }

        .loader.grey img {
            position: absolute;
            top: 50%;
            left: 50%;
            margin: -30px 0 0 -30px
        }

.showcaseDiv {
    width: 300px;
    float: left;
    height: auto;
    margin-bottom: 12px;
    overflow: hidden;
    box-shadow: none;
    min-width: 300px
}

.billboardDiv, .leaderboardDiv {
    display: inline-block;
    box-shadow: none;
    float: none;
    overflow: hidden
}

.showcaseDiv .adTtl {
    background: #fff;
    width: 300px;
    height: 16px;
    cursor: default
}

.showcaseDiv .showcase {
    background: #ddd;
    width: 300px;
    height: auto
}

.billboardDiv {
    width: auto;
    height: auto;
    margin: 0 auto 40px;
    min-width: 728px
}

    .billboardDiv .adTtl {
        background: #fff;
        width: auto;
        height: 16px;
        cursor: default
    }

    .billboardDiv .billboard {
        background: #ddd;
        width: auto;
        height: auto
    }

.monsterDiv {
    display: inline-block;
    width: 300px;
    height: 616px;
    overflow: hidden;
    box-shadow: none;
    margin-left: 48px;
    min-width: 300px
}

    .monsterDiv .adTtl {
        background: #fff;
        width: 300px;
        height: 16px;
        cursor: default
    }

    .monsterDiv .monster {
        background: #ddd;
        width: 300px;
        height: auto
    }

.leaderboardDiv {
    width: auto;
    height: auto;
    margin: 0 auto 40px;
    min-width: 728px
}

    .leaderboardDiv .adTtl {
        background: #fff;
        width: auto;
        height: 16px;
        cursor: default
    }

.oneStickyDiv .onSlider li h3, .oneStickyDiv .onSlider li p {
    font-size: 24px;
    display: inline-block;
    float: right;
    cursor: default
}

.leaderboardDiv .leaderboard {
    background: #ddd;
    width: auto;
    height: auto
}

.oneStickyDiv {
    width: 100%;
    height: 50px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 51;
    visibility: visible;
    opacity: 1;
    transition: all .3s ease-in 0;
    background: linear-gradient(270deg,#4c88c4,#345985);
    background: -webkit-linear-gradient(270deg,#4c88c4,#345985);
    background: -o-linear-gradient(270deg,#4c88c4,#345985);
    background: -moz-linear-gradient(270deg,#4c88c4,#345985);
    background: -ms-linear-gradient(270deg,#4c88c4,#345985);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#4c88c4',endColorstr='#345985',GradientType=0)
}

    .oneStickyDiv .cnts {
        display: inline-block;
        width: calc(100% - 158px);
        margin: 0 74px 0 84px;
        position: relative
    }

    .oneStickyDiv .onLogo {
        float: right;
        width: 60px;
        height: 60px;
        position: absolute;
        right: 0;
        bottom: 0;
        z-index: 9
    }

    .oneStickyDiv .onSlider {
        float: right;
        display: inline-block;
        width: calc(100% - 108px);
        margin-right: 84px;
        height: 50px
    }

        .oneStickyDiv .onSlider li {
            display: inline-block;
            width: 100%;
            cursor: default
        }

            .oneStickyDiv .onSlider li h3 {
                font-family: DroidKufiBold,Arial;
                color: #cd1e25;
                margin-left: 24px;
                line-height: 2.2;
                background: #edf1f2;
                height: 50px;
                width: 100px;
                text-align: center
            }

            .oneStickyDiv .onSlider li p {
                font-family: DroidKufiLight,Arial;
                color: #edf1f2;
                line-height: 2;
                direction: rtl
            }

.surveyDiv .questionsDiv h3, .surveyDiv .timeLineDiv p {
    font-family: DroidKufiLight,arial;
    font-size: 16px;
    color: #1d1d1d;
    text-align: right
}

.oneStickyDiv .bx-controls {
    display: none
}

.show-sponsor .oneStickyDiv, .sponsorHome .oneStickyDiv {
    visibility: hidden;
    opacity: 0
}

.surveyDiv .akhbarThemak {
    height: 552px
}

.surveyDiv .questionsDiv {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px;
    height: auto;
    min-height: 830px
}

    .surveyDiv .questionsDiv h3, .surveyDiv .timeLineDiv, .surveyDiv .timeLineDiv ul {
        width: 100%;
        display: inline-block
    }

    .surveyDiv .questionsDiv h3 {
        margin: 24px 0 36px;
        direction: rtl;
        background: #f2f2f2;
        padding: 12px 24px
    }

.surveyDiv .timeLineDiv p {
    margin-bottom: 12px;
    cursor: default
}

    .surveyDiv .timeLineDiv p span {
        color: #c15709
    }

.surveyDiv .timeLineDiv ul {
    margin: 0
}

    .surveyDiv .timeLineDiv ul li {
        display: inline-block;
        width: calc(100% / 13);
        float: right;
        cursor: default
    }

.surveyDiv .timeLineDiv li:before {
    content: "";
    background-color: #cfcfcf !important;
    border-radius: 100px;
    z-index: 9;
    float: left;
    width: 14px;
    height: 14px;
    margin: 0;
    position: relative;
    cursor: default
}

.surveyDiv .timeLineDiv li:after, .surveyDiv .timeLineDiv ul:after {
    display: block;
    height: 2px;
    top: 6px;
    width: 100%;
    position: relative;
    content: "";
    right: 0
}

.surveyDiv .timeLineDiv li.checked:before {
    background-color: #c15709 !important
}

.surveyDiv .timeLineDiv li:after {
    background-color: #cfcfcf !important;
    z-index: 10
}

.surveyDiv .timeLineDiv li.checked:after {
    background-color: #c15709 !important
}

.surveyDiv .timeLineDiv ul:after {
    background-color: #cfcfcf !important
}

.surveyDiv .allQues h4 {
    color: #1d1d1d;
    font-family: DroidKufiBold,arial;
    font-size: 24px;
    margin: 60px 0 24px;
    text-align: center;
    background: #f2f2f2;
    padding: 5px 0
}

.surveyDiv .allQues .answersDiv {
    display: inline-block;
    width: 100%
}

    .surveyDiv .allQues .answersDiv .answerItem {
        float: right;
        display: inline-block;
        margin-left: 24px;
        margin-bottom: 24px;
        width: calc((100% - 72px)/ 4);
        cursor: pointer
    }

        .surveyDiv .allQues .answersDiv .answerItem:nth-child(4n) {
            margin-left: 0
        }

        .surveyDiv .allQues .answersDiv .answerItem .imgMask {
            display: inline-block;
            width: 100%;
            position: relative
        }

        .surveyDiv .allQues .answersDiv .answerItem.selected .imgMask:before {
            content: "";
            background: rgba(0,0,0,.5);
            text-align: center;
            height: 100%;
            position: absolute;
            right: 0;
            top: 0;
            width: 100%;
            z-index: 1
        }

        .surveyDiv .allQues .answersDiv .answerItem.selected .imgMask:after {
            content: "3";
            color: #fff;
            font-size: 72px;
            z-index: 2;
            position: absolute;
            top: 50%;
            left: 50%;
            width: 72px;
            height: 72px;
            line-height: 1;
            margin: -36px 0 0 -36px
        }

        .surveyDiv .allQues .answersDiv .answerItem .imgMask img {
            width: 100%;
            height: auto
        }

        .surveyDiv .allQues .answersDiv .answerItem p {
            display: inline-block;
            width: 100%;
            text-align: center;
            font-family: DroidKufiLight,Arial;
            font-size: 16px;
            color: #1d1d1d;
            padding: 5px 0
        }

        .surveyDiv .allQues .answersDiv .answerItem.selected p {
            color: #c15709
        }

.surveyDiv .allQues .nxtPrevDiv {
    width: 300px;
    height: 40px;
    margin: 24px
}

    .surveyDiv .allQues .nxtPrevDiv .btn {
        width: 144px;
        height: 40px;
        background: #c15709;
        float: left;
        margin-right: 12px;
        text-align: center;
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #fff
    }

        .surveyDiv .allQues .nxtPrevDiv .btn:last-child {
            margin-right: 0
        }

        .surveyDiv .allQues .nxtPrevDiv .btn a {
            color: #fff;
            float: right;
            padding: 4px 40px
        }

            .surveyDiv .allQues .nxtPrevDiv .btn a.prev {
                padding: 4px 37px
            }

            .surveyDiv .allQues .nxtPrevDiv .btn a.next {
                padding: 4px 40px
            }

            .surveyDiv .allQues .nxtPrevDiv .btn a.prev:before {
                content: "r";
                line-height: 2;
                float: right;
                margin-left: 5px
            }

            .surveyDiv .allQues .nxtPrevDiv .btn a.next:after {
                content: "q";
                line-height: 2;
                float: left;
                margin-right: 5px
            }

.surveyDiv .allQues .chooseAnswer {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(255,255,255,.95);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity .3s 0s,visibility 0 .3s;
    -moz-transition: opacity .3s 0s,visibility 0 .3s;
    transition: opacity .3s 0s,visibility 0 .3s
}

    .surveyDiv .allQues .chooseAnswer.is-visible {
        opacity: 1;
        visibility: visible;
        z-index: 10;
        -webkit-transition: opacity .3s 0s,visibility 0 0;
        -moz-transition: opacity .3s 0s,visibility 0 0;
        transition: opacity .3s 0s,visibility 0 0
    }

.surveyDiv .allQues .cd-popup-container {
    position: relative;
    padding: 24px;
    width: 420px;
    height: 180px;
    top: 50%;
    margin: -90px auto;
    background: #FFF;
    text-align: center;
    -webkit-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: .3s;
    -moz-transition-duration: .3s;
    transition-duration: .3s
}

.surveyDiv .allQues .chooseAnswer p {
    font-family: DroidKufiLight,Arial;
    font-size: 18px;
    color: #1d1d1d;
    direction: rtl;
    float: right;
    display: inline-block;
    width: 100%;
    margin-top: 24px
}

.surveyDiv .allQues .chooseAnswer .ok {
    position: absolute;
    bottom: 24px;
    left: 0;
    display: inline-block;
    width: 100px;
    padding: 5px 0;
    background: #c15709;
    font-family: DroidKufiLight,Arial;
    font-size: 16px;
    color: #fff;
    text-align: center;
    border: none;
    margin: 24px;
    cursor: pointer
}

.surveyDiv .allQues .cd-popup-container .cd-popup-close {
    position: absolute;
    top: 12px;
    left: 12px;
    width: 36px;
    height: 36px
}

    .surveyDiv .allQues .cd-popup-container .cd-popup-close::after, .surveyDiv .allQues .cd-popup-container .cd-popup-close::before {
        content: '';
        position: absolute;
        top: 0;
        width: 2px;
        height: 100%;
        background-color: #1d1d1d;
        opacity: .2;
        transition: all .2s ease-in-out 0;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

    .surveyDiv .allQues .cd-popup-container .cd-popup-close:hover::after, .surveyDiv .allQues .cd-popup-container .cd-popup-close:hover::before {
        opacity: 1
    }

    .surveyDiv .allQues .cd-popup-container .cd-popup-close::before {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .surveyDiv .allQues .cd-popup-container .cd-popup-close::after {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

.surveyDiv .allQues .is-visible .cd-popup-container {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
}

.surveyDiv .resultDiv {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px;
    height: auto;
    min-height: 830px
}

    .surveyDiv .resultDiv h3 {
        display: inline-block;
        width: 100%;
        margin: 24px 0 36px;
        font-family: DroidKufiLight,arial;
        font-size: 16px;
        color: #1d1d1d;
        text-align: right;
        direction: rtl;
        background: #f2f2f2;
        padding: 12px 24px;
        float: right
    }

        .surveyDiv .resultDiv h3 span {
            color: #c15709;
            font-weight: 700;
            line-height: 1.4;
            margin-right: 5px;
            font-size: 20px
        }

    .surveyDiv .resultDiv .grid-wrap {
        margin: 0;
        padding: 0;
        box-shadow: none
    }

    .surveyDiv .resultDiv .grid {
        margin: 0 auto;
        height: auto !important
    }

        .surveyDiv .resultDiv .grid li {
            min-width: 300px;
            width: calc((100% - 48px)/ 3);
            margin-left: 24px;
            margin-bottom: 24px;
            float: right;
            cursor: pointer;
            padding: 12px;
            border: 1px solid #ddd;
            box-shadow: 0 6px 6px -3px rgba(0,0,0,.1)
        }

            .surveyDiv .resultDiv .grid li .answersDiv .answerItem:last-child, .surveyDiv .resultDiv .grid li:nth-child(3n) {
                margin-left: 0
            }

            .surveyDiv .resultDiv .grid li .answersDiv, .surveyDiv .resultDiv .grid li h2 {
                width: 100%;
                margin-bottom: 12px;
                display: inline-block
            }

            .surveyDiv .resultDiv .grid li h2 {
                color: #1d1d1d;
                background: #ddd;
                padding: 5px 0;
                font-family: DroidKufiBold,Arial;
                font-size: 16px;
                text-align: center
            }

            .surveyDiv .resultDiv .grid li .answersDiv .answerItem {
                float: right;
                width: calc(100% / 3);
                display: inline-block
            }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem:nth-child(odd) {
                    background: #fff
                }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem:nth-child(even) {
                    background: #f2f2f2
                }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem img {
                    width: 100%;
                    height: auto
                }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem p {
                    display: inline-block;
                    width: 100%;
                    text-align: center;
                    font-family: DroidKufiLight,Arial;
                    font-size: 14px;
                    color: #1d1d1d;
                    padding: 8px 0;
                    line-height: 1.5;
                    height: 70px;
                    overflow: hidden
                }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem span {
                    color: #1d1d1d;
                    font-family: arial;
                    font-size: 32px;
                    width: 100%;
                    text-align: center;
                    display: inline-block;
                    margin-top: 12px
                }

                    .surveyDiv .resultDiv .grid li .answersDiv .answerItem span:after {
                        content: "%";
                        font-size: 18px
                    }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem:nth-child(1) span {
                    color: #fbb03b;
                    border-bottom: 4px solid #fbb03b
                }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem:nth-child(2) span {
                    color: #45bb61;
                    font-size: 42px;
                    line-height: .9;
                    border-bottom: 4px solid #45bb61
                }

                    .surveyDiv .resultDiv .grid li .answersDiv .answerItem:nth-child(2) span:after {
                        font-size: 22px
                    }

                .surveyDiv .resultDiv .grid li .answersDiv .answerItem:nth-child(3) span {
                    color: #f44;
                    border-bottom: 4px solid #f44
                }

            .surveyDiv .resultDiv .grid li .more {
                display: inline-block;
                width: 100%;
                padding: 5px 0;
                background: #c15709;
                font-family: DroidKufiLight,Arial;
                font-size: 14px;
                color: #fff;
                text-align: center
            }

    .surveyDiv .resultDiv .surveyCompleted {
        position: fixed;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        background-color: rgba(255,255,255,.95);
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s 0s,visibility 0 .3s;
        -moz-transition: opacity .3s 0s,visibility 0 .3s;
        transition: opacity .3s 0s,visibility 0 .3s
    }

        .surveyDiv .resultDiv .surveyCompleted.is-visible {
            opacity: 1;
            visibility: visible;
            z-index: 10;
            -webkit-transition: opacity .3s 0s,visibility 0 0;
            -moz-transition: opacity .3s 0s,visibility 0 0;
            transition: opacity .3s 0s,visibility 0 0
        }

    .surveyDiv .resultDiv .cd-popup-container {
        position: relative;
        padding: 24px;
        width: 420px;
        height: 180px;
        top: 50%;
        margin: -90px auto;
        background: #FFF;
        text-align: center;
        box-shadow: 0 0 20px rgba(0,0,0,.4);
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px);
        -webkit-backface-visibility: hidden;
        -webkit-transition-property: -webkit-transform;
        -moz-transition-property: -moz-transform;
        transition-property: transform;
        -webkit-transition-duration: .3s;
        -moz-transition-duration: .3s;
        transition-duration: .3s
    }

    .surveyDiv .resultDiv .surveyCompleted p {
        font-family: DroidKufiLight,Arial;
        font-size: 18px;
        color: #1d1d1d;
        direction: rtl;
        float: right;
        display: inline-block;
        width: 100%;
        margin-top: 24px
    }

    .surveyDiv .resultDiv .surveyCompleted .ok {
        position: absolute;
        bottom: 24px;
        left: 0;
        display: inline-block;
        width: 100px;
        padding: 5px 0;
        background: #c15709;
        font-family: DroidKufiLight,Arial;
        font-size: 16px;
        color: #fff;
        text-align: center;
        border: none;
        margin: 24px;
        cursor: pointer
    }

    .surveyDiv .resultDiv .cd-popup-container .cd-popup-close {
        position: absolute;
        top: 12px;
        left: 12px;
        width: 36px;
        height: 36px
    }

        .surveyDiv .resultDiv .cd-popup-container .cd-popup-close::after, .surveyDiv .resultDiv .cd-popup-container .cd-popup-close::before {
            content: '';
            position: absolute;
            top: 0;
            width: 2px;
            height: 100%;
            background-color: #1d1d1d;
            opacity: .2;
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .surveyDiv .resultDiv .cd-popup-container .cd-popup-close:hover::after, .surveyDiv .resultDiv .cd-popup-container .cd-popup-close:hover::before {
            opacity: 1
        }

        .surveyDiv .resultDiv .cd-popup-container .cd-popup-close::before {
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        .surveyDiv .resultDiv .cd-popup-container .cd-popup-close::after {
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            transform: rotate(-45deg)
        }

    .surveyDiv .resultDiv .is-visible .cd-popup-container {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    .surveyDiv .resultDiv .slideshow {
        position: fixed;
        background: rgba(0,0,0,.85);
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 500;
        opacity: 0;
        visibility: hidden;
        overflow: hidden;
        -webkit-perspective: 1000px;
        perspective: 1000px;
        -webkit-transition: opacity .5s,visibility 0 .5s;
        transition: opacity .5s,visibility 0 .5s
    }

    .surveyDiv .resultDiv .slideshow-open .slideshow {
        opacity: 1;
        visibility: visible;
        -webkit-transition: opacity .5s;
        transition: opacity .5s
    }

    .surveyDiv .resultDiv .slideshow ul {
        width: 100%;
        height: 100%;
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
        -webkit-transform: translate3d(0,0,150px);
        transform: translate3d(0,0,150px);
        -webkit-transition: -webkit-transform .5s;
        transition: transform .5s
    }

        .surveyDiv .resultDiv .slideshow ul.animatable li {
            -webkit-transition: -webkit-transform .5s;
            transition: transform .5s
        }

    .surveyDiv .resultDiv .slideshow-open .slideshow ul {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    .surveyDiv .resultDiv .slideshow li {
        width: 660px;
        height: 730px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -365px 0 0 -330px;
        visibility: hidden;
        transition: none
    }

        .surveyDiv .resultDiv .slideshow li h2 {
            color: #1d1d1d;
            background: #f2f2f2;
            padding: 5px 0;
            font-family: DroidKufiBold,Arial;
            font-size: 22px;
            text-align: center;
            display: inline-block;
            width: 100%;
            margin-bottom: 12px
        }

        .surveyDiv .resultDiv .slideshow li .answersDiv {
            display: inline-block;
            width: 100%
        }

            .surveyDiv .resultDiv .slideshow li .answersDiv .answerItem {
                float: right;
                width: calc((100% - 36px)/ 4);
                display: inline-block;
                margin-left: 12px;
                margin-bottom: 24px
            }

                .surveyDiv .resultDiv .slideshow li .answersDiv .answerItem:nth-child(4n) {
                    margin-left: 0
                }

                .surveyDiv .resultDiv .slideshow li .answersDiv .answerItem img {
                    width: 100%;
                    height: auto
                }

                .surveyDiv .resultDiv .slideshow li .answersDiv .answerItem p {
                    display: inline-block;
                    width: 100%;
                    text-align: center;
                    font-family: DroidKufiLight,Arial;
                    font-size: 14px;
                    color: #1d1d1d;
                    padding: 8px 0 0;
                    line-height: 1.5;
                    overflow: hidden;
                    height: 50px
                }

                .surveyDiv .resultDiv .slideshow li .answersDiv .answerItem span {
                    color: #888;
                    font-family: arial;
                    font-size: 24px;
                    width: 100%;
                    text-align: center;
                    display: inline-block
                }

.popupOverlay #OptDiv, .popupOverlay .sponsorBanner, .popupOverlay .sponsorBtnText, .srvyRslts #OptDiv, .srvyRslts .morphSearchDiv, .srvyRslts .sponsorBanner, .srvyRslts .sponsorBtnText, .srvyRslts footer, .srvyRslts header {
    display: none
}

.surveyDiv .resultDiv .slideshow li .answersDiv .answerItem span:after {
    content: "%";
    font-size: 18px
}

.surveyDiv .resultDiv .slideshow li.show {
    visibility: visible
}

.surveyDiv .resultDiv .slideshow li:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255,255,255,.8);
    -webkit-transition: opacity .3s;
    transition: opacity .3s
}

.surveyDiv .resultDiv .slideshow li.current:after {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .3s,visibility 0 .3s;
    transition: opacity .3s,visibility 0 .3s
}

.surveyDiv .resultDiv .slideshow figure {
    width: 100%;
    height: 100%;
    background: #fff;
    border: 24px solid #fff;
    overflow: hidden
}

.surveyDiv .resultDiv .slideshow nav span {
    position: fixed;
    z-index: 1000;
    color: #59656c;
    text-align: center;
    padding: 3% 1%;
    cursor: pointer;
    font-size: 2.2em
}

    .surveyDiv .resultDiv .slideshow nav span.nav-next, .surveyDiv .resultDiv .slideshow nav span.nav-prev {
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .surveyDiv .resultDiv .slideshow nav span.nav-next {
        left: 0
    }

    .surveyDiv .resultDiv .slideshow nav span.nav-prev {
        right: 0
    }

    .surveyDiv .resultDiv .slideshow nav span.icon-prev:before {
        content: "5";
        color: #1d1d1d;
        font-size: 36px
    }

    .surveyDiv .resultDiv .slideshow nav span.icon-next:before {
        content: "4";
        color: #1d1d1d;
        font-size: 36px
    }

    .surveyDiv .resultDiv .slideshow nav span.nav-close {
        top: 12px;
        left: 0;
        padding: .5em .8em;
        color: #fff
    }

        .surveyDiv .resultDiv .slideshow nav span.nav-close::after, .surveyDiv .resultDiv .slideshow nav span.nav-close::before {
            content: '';
            position: absolute;
            width: 5px;
            height: 100%;
            top: 0;
            left: 50%;
            border-radius: 3px;
            opacity: 1;
            background: #fff;
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .surveyDiv .resultDiv .slideshow nav span.nav-close::before {
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        .surveyDiv .resultDiv .slideshow nav span.nav-close::after {
            -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg)
        }

.srvyRslts .cd-main-content {
    background: #1d1d1d
}

.rssDiv .rssCnts {
    width: calc(100% - 324px);
    margin-left: 24px;
    padding: 24px
}

.rssDiv .akhbarThemak {
    height: 552px
}

.rssDiv .rssCnts .info {
    display: inline-block;
    width: 100%;
    margin: 24px 0 36px;
    direction: rtl;
    background: #f2f2f2;
    padding: 12px 24px
}

    .rssDiv .rssCnts .info h3 {
        display: inline-block;
        width: 100%;
        font-family: DroidKufiBold,arial;
        font-size: 16px;
        color: #1d1d1d;
        text-align: right;
        direction: rtl;
        font-weight: 700
    }

    .rssDiv .rssCnts .info ul {
        display: inline-block;
        width: 100%;
        padding-right: 30px
    }

    .rssDiv .rssCnts .info li {
        display: list-item;
        width: 100%;
        font-family: DroidKufiLight,Arial;
        font-size: 14px;
        color: #1d1d1d;
        text-align: right;
        direction: rtl;
        margin: 12px 0;
        cursor: default;
        list-style-type: square
    }

.rssDiv .rssCnts .allItems {
    display: inline-block;
    width: 100%
}

    .rssDiv .rssCnts .allItems .item {
        display: inline-block;
        width: 100%;
        padding: 10px 12px;
        background: #f2f2f2;
        cursor: pointer;
        float: right;
        margin-bottom: 12px;
        max-height: 50px;
        transition: all .2s ease-in-out 0;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

        .rssDiv .rssCnts .allItems .item.open {
            max-height: 800px
        }

    .rssDiv .rssCnts .allItems .icon-downArrow {
        position: relative
    }

        .rssDiv .rssCnts .allItems .icon-downArrow:before {
            content: "q";
            position: absolute;
            left: 12px;
            top: 12px;
            -webkit-transform: rotate(-90deg);
            -moz-transform: rotate(-90deg);
            -ms-transform: rotate(-90deg);
            -o-transform: rotate(-90deg);
            transform: rotate(-90deg);
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .rssDiv .rssCnts .allItems .icon-downArrow.open:before {
            -webkit-transform: rotate(-270deg);
            -moz-transform: rotate(-270deg);
            -ms-transform: rotate(-270deg);
            -o-transform: rotate(-270deg);
            transform: rotate(-270deg)
        }

    .rssDiv .rssCnts .allItems .item p {
        float: right;
        font-family: DroidKufiBold,Arial;
        font-size: 16px;
        color: #1d1d1d;
        margin-bottom: 12px
    }

        .rssDiv .rssCnts .allItems .item p:after {
            content: "";
            width: 4px;
            height: 18px;
            float: right;
            margin-left: 8px;
            margin-top: 7px
        }

    .rssDiv .rssCnts .allItems .item.news p:after {
        background: #aa120d
    }

    .rssDiv .rssCnts .allItems .item.arts p:after {
        background: #c15709
    }

    .rssDiv .rssCnts .allItems .item.lifeStyle p:after {
        background: #9224a5
    }

    .rssDiv .rssCnts .allItems .item.sports p:after {
        background: #006829
    }

    .rssDiv .rssCnts .allItems .item.autos p:after {
        background: #1877b6
    }

    .rssDiv .rssCnts .allItems .item.islameyat p:after {
        background: #119e9e
    }

    .rssDiv .rssCnts .allItems .item img {
        float: left;
        margin-top: 5px;
        border: none
    }

    .rssDiv .rssCnts .allItems .item .itemExpand {
        width: 100%;
        height: 0;
        visibility: hidden;
        opacity: 0;
        transition: all .2s ease-in-out 0;
        -webkit-transition: all .2s ease-in-out 0;
        -moz-transition: all .2s ease-in-out 0;
        -ms-transition: all .2s ease-in-out 0;
        -o-transition: all .2s ease-in-out 0
    }

    .rssDiv .rssCnts .allItems .item.open .itemExpand {
        display: inline-block;
        height: auto;
        visibility: visible;
        opacity: 1
    }

    .rssDiv .rssCnts .allItems .item .itemExpand li {
        display: inline-block;
        width: 100%;
        padding: 10px 12px;
        background: #fff;
        cursor: pointer;
        float: right;
        margin-bottom: 2px
    }

        .mobile.seatNumber, .rssDiv .rssCnts .allItems .item .itemExpand li p:after {
            display: none
        }

        .rssDiv .rssCnts .allItems .item .itemExpand li p {
            float: right;
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #1d1d1d;
            margin-bottom: 0
        }

img.lazy {
    background: url(http://www.masrawy.com/Images/lazyLoadBG.jpg) top left no-repeat;
    background-size: 100%;
    position: relative
}

    img.lazy:after {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 80%;
        height: 100%;
        opacity: .7;
        animation: lazyPosition 2s ease infinite;
        background: linear-gradient(0deg,transparent,#eee,transparent);
        background: -webkit-linear-gradient(0deg,transparent,#eee,transparent);
        background: -o-linear-gradient(0deg,transparent,#eee,transparent);
        background: -moz-linear-gradient(0deg,transparent,#eee,transparent);
        background: -ms-linear-gradient(0deg,transparent,#eee,transparent)
    }

@keyframes lazyPosition {
    from {
        left: -100%
    }

    to {
        left: 200%
    }
}

.article .strip {
    display: inline-block;
    margin-bottom: 20px
}

    .article .strip img {
        width: 100%;
        height: auto
    }

@media screen and (max-width:60em) {
    .surveyDiv .resultDiv .grid li {
        width: 33.3%
    }

    .surveyDiv .resultDiv .slideshow li {
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin: 0
    }

        .surveyDiv .resultDiv .slideshow li figure img {
            width: auto;
            margin: 0 auto;
            max-width: 100%
        }

    .surveyDiv .resultDiv .slideshow nav span, .surveyDiv .resultDiv .slideshow nav span.nav-close {
        font-size: 1.8em;
        padding: .3em
    }

    .surveyDiv .resultDiv .info-keys {
        display: none
    }
}

@media screen and (max-width:35em) {
    .surveyDiv .resultDiv .grid li {
        width: 50%
    }
}

@media screen and (max-width:24em) {
    .surveyDiv .resultDiv .grid li {
        width: 100%
    }
}

@media only screen and (max-height:690px) {
    .surveyDiv .resultDiv .slideshow nav span.nav-close::after, .surveyDiv .resultDiv .slideshow nav span.nav-close::before {
        background: #1d1d1d
    }
}

@media screen and (min-width:1601px) and (max-width:1950px) {
    .show-sponsor .sponsor, .sponsorHome .sponsor {
        margin-right: 0;
        width: 100%
    }

    .sponsorBtnText {
        left: calc(((100% - 1440px)/ 2) + 26px)
    }

    .show-sponsor .sponsorBtnText, .sponsorHome .sponsorBtnText {
        left: calc(((100% - 1440px)/ 2) + 18px)
    }

    .sponsor .sponsorLogoBtn {
        left: calc(((100% - 1440px)/ 2) - 72px)
    }

    .akhbarThemak {
        height: 560px
    }

        .akhbarThemak li {
            height: 85px
        }

    .sponsorBanner {
        margin-right: calc(((100% - 1440px)/ 2) - 73px)
    }

    .sponsor .content {
        background-size: 1584px !important
    }

    .show-sponsor .sponsorBanner, .sponsorHome .sponsorBanner {
        margin-right: calc(((100% - 1440px)/ 2) - 72px)
    }

    .oneStickyDiv .cnts {
        width: 1440px;
        margin: 0
    }
}

@media screen and (min-width:1185px) and (max-width:1508px) {
    .surveyDiv .allQues .answersDiv .answerItem {
        width: calc((100% - 48px)/ 3)
    }

        .surveyDiv .allQues .answersDiv .answerItem:nth-child(4n) {
            margin-left: 24px
        }

        .surveyDiv .allQues .answersDiv .answerItem:nth-child(3n) {
            margin-left: 0
        }

    .surveyDiv .resultDiv .grid li {
        width: calc((100% - 24px)/ 2)
    }

        .surveyDiv .resultDiv .grid li:nth-child(3n) {
            margin-left: 24px
        }

        .surveyDiv .resultDiv .grid li:nth-child(2n) {
            margin-left: 0
        }
}

@media screen and (min-width:1024px) and (max-width:1184px) {
    .surveyDiv .allQues .answersDiv .answerItem {
        width: calc((100% - 24px)/ 2)
    }

        .surveyDiv .allQues .answersDiv .answerItem:nth-child(4n) {
            margin-left: 24px
        }

        .surveyDiv .allQues .answersDiv .answerItem:nth-child(2n) {
            margin-left: 0
        }

    .surveyDiv .resultDiv .grid li {
        width: 100%;
        margin-left: 0
    }
}

@media screen and (max-width:660px) {
    footer .top .cnts {
        width: 560px;
        margin: 0
    }

        footer .top .cnts h2 {
            font-size: 16px;
            line-height: 2.5
        }

        footer .top .cnts .subTxt button, footer .top .cnts .subTxt input {
            font-size: 14px
        }
}

@media screen and (min-width:776px) and (max-width:1338px) {
    footer .middle .navMenu ul .has-children {
        margin-left: calc((100% - 480px)/ 3);
        margin-bottom: 24px
    }

        footer .middle .navMenu ul .has-children:nth-child(4) {
            width: 84px;
            margin-left: 0
        }

        footer .middle .navMenu ul .has-children:last-child {
            width: 117px;
            margin-left: 24px
        }
}

@media screen and (min-width:630px) and (max-width:775px) {
    footer .middle .navMenu {
        width: calc(100% - 96px);
        padding: 10px 0;
        margin: 0 48px
    }

        footer .middle .navMenu ul .has-children {
            margin-left: calc((100% - 480px)/ 3);
            margin-bottom: 24px
        }

            footer .middle .navMenu ul .has-children:nth-child(4) {
                width: 84px;
                margin-left: 0
            }

            footer .middle .navMenu ul .has-children:last-child {
                width: 117px;
                margin-left: 24px
            }
}

@media only screen and (max-width:1260px) {
    .newsPointer {
        width: 100%;
        height: 370px
    }

    article .showcaseDiv {
        margin: 0
    }
}

@media screen and (min-width:1440px) and (max-width:1599px) {
    .akhbarThemak li {
        padding: 20px 12px;
        height: 98px
    }

        .akhbarThemak li .secName {
            bottom: 12px
        }
}

@media screen and (min-width:1280px) and (max-width:1359px) {
    .akhbarThemak li {
        padding: 15px 12px;
        height: 90px
    }

        .akhbarThemak li .secName {
            bottom: 8px
        }
}

@media screen and (min-width:1152px) and (max-width:1279px) {
    .akhbarThemak li {
        padding: 25px 12px;
        height: 110px
    }

        .akhbarThemak li .secName {
            bottom: 18px
        }
}

@media screen and (min-width:1024px) and (max-width:1151px) {
    .akhbarThemak li {
        padding: 9px 12px;
        height: 77px
    }

        .akhbarThemak li .secName {
            bottom: 2px
        }
}

@media screen and (min-width:1153px) and (max-width:1260px) {
    .featuredArea ul li:first-child .desc p {
        font-size: 22px;
        height: auto;
        padding-bottom: 12px;
        margin-bottom: 0;
        bottom: 0
    }

    .featuredArea ul li .desc p {
        height: 64px;
        padding-bottom: 0;
        margin-bottom: 18px;
        overflow: hidden;
        bottom: -12px
    }
}

@media screen and (min-width:1024px) and (max-width:1161px) {
    article .details iframe, article .details img {
        margin: 40px;
        width: 390px
    }

    article .details img {
        height: auto
    }

    article .details iframe {
        height: 293px
    }
}

@media screen and (min-width:1024px) and (max-width:1230px) {
    .weatherDiv .dayTempDtls .icon-high {
        font-size: 28px;
        margin-left: 16px
    }

        .weatherDiv .dayTempDtls .icon-high:before {
            font-size: 12px
        }

    .weatherDiv .dayTempDtls .icon-low {
        font-size: 20px
    }

        .weatherDiv .dayTempDtls .icon-low:before {
            font-size: 8px
        }
}

@media screen and (min-width:1024px) and (max-width:1260px) {
    .matchesSchedule .table .allMatches .tabs-nav li a {
        padding: 0 30px
    }

    .matchesSchedule .table .allMatches .item .time {
        line-height: 4
    }

        .matchesSchedule .table .allMatches .item .time span {
            margin-top: 28px
        }

            .matchesSchedule .table .allMatches .item .time span.now {
                margin: 22px auto 0 !important
            }

    .matchesSchedule .table .allMatches .item .teamA, .matchesSchedule .table .allMatches .item .teamB {
        text-align: center;
        width: calc((100% - 220px)/ 2);
        height: auto
    }

        .matchesSchedule .table .allMatches .item .teamA img {
            float: none;
            margin-right: 0
        }

        .matchesSchedule .table .allMatches .item .teamB img {
            float: none;
            margin-left: 0
        }

        .matchesSchedule .table .allMatches .item .teamA p, .matchesSchedule .table .allMatches .item .teamB p {
            float: none;
            text-align: center;
            line-height: 1.6;
            margin-top: 5px
        }

    .matchesSchedule .table .allMatches .item .match {
        height: auto
    }

    .matchesSchedule .table .allMatches .item .result {
        width: 100px;
        margin-top: 20px
    }

        .matchesSchedule .table .allMatches .item .result .matchResult {
            margin-top: 0
        }

    .matchesSchedule .table .allMatches .item .channel {
        font-size: 14px;
        line-height: 1.8;
        width: 70px;
        margin-top: 10px
    }

    .prayerTimes .main .location {
        margin-bottom: 24px
    }

    .prayerTimes .main .dropDownDiv {
        width: 100%;
        margin-bottom: 24px
    }

    .prayerTimes .main .cityDate {
        width: 100%;
        margin-left: 0
    }

    .prayerTimes .cntdwn {
        width: 100%;
        margin: 0 0 24px
    }

    .prayerTimes .mainTable .prayersTable {
        width: 100%
    }

    .prayerTimes .monthTable .prayersTable .title .name:first-child {
        width: 180px
    }

    .prayerTimes .monthTable .prayersTable .title .name {
        width: calc((100% - 180px)/ 6);
        font-size: 14px
    }

    .prayerTimes .monthTable .prayersTable .allTimes .time:first-child {
        width: 180px
    }

    .prayerTimes .monthTable .prayersTable .allTimes .time {
        width: calc((100% - 180px)/ 6);
        font-size: 14px
    }

        .prayerTimes .monthTable .prayersTable .allTimes .time span {
            display: none
        }
}

@media screen and (min-width:1024px) and (max-width:1365px) {
    .cd-tab-filter {
        width: 100%;
        margin: 0
    }

        .cd-tab-filter::after {
            display: inline-block
        }

        .cd-tab-filter ul {
            position: absolute;
            width: 100%
        }

        .cd-tab-filter li {
            display: none
        }

            .cd-tab-filter li.placeholder {
                display: block !important
            }

                .cd-tab-filter li.placeholder a:hover {
                    color: #aaa
                }

        .cd-tab-filter a {
            display: inline-block;
            width: 100%;
            padding-right: 12px
        }

            .cd-tab-filter a.selected {
                background: #f2f2f2;
                color: #1d1d1d;
                box-shadow: none;
                padding-right: 12px
            }

        .cd-tab-filter.is-open ul li {
            display: block
        }
}

@media screen and (min-width:1024px) and (max-width:1180px) {
    #cd-top-nav > ul {
        margin-left: 72px
    }

    #cd-top-nav ul li {
        width: 72px
    }

        #cd-top-nav ul li > a {
            width: 72px;
            font-size: 9px
        }

        #cd-top-nav ul li .weather.sunnyCloud {
            background: url(http://www.masrawy.com/Images/weather.png) 10px center no-repeat
        }

        #cd-top-nav ul li .weather > span {
            margin-right: 10px
        }

    #cd-top-nav > ul > li:last-child {
        display: none
    }
}

@media screen and (min-width:1024px) and (max-width:1152px) {
    .featuredArea .desc, .pattern02 .desc, .pattern02 ul li:nth-last-child(-n+3) .desc {
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

    .caricature li, .caricature li img {
        max-width: none
    }

    .morphSearchDiv, .morphsearch {
        width: 72px
    }

    .morphsearch-input {
        padding: 28px 24px 0;
        font-size: 9px
    }

    .featuredArea .desc p, .pattern02 .desc p {
        padding: 12px;
        bottom: 0;
        right: 0;
        color: #fff;
        font-family: DroidKufiLight,Arial;
        text-align: right
    }

    .featuredArea ul li {
        margin-left: 12px;
        margin-bottom: 12px;
        width: calc((100% - 12px)/ 2);
        position: relative;
        border: none;
        overflow: hidden
    }

        .featuredArea ul li:first-child .secName {
            font-size: 18px
        }

        .featuredArea ul li a img {
            width: 100%;
            height: auto;
            border: 1px solid #ddd;
            transition: all .2s ease-in-out 0;
            -webkit-transition: all .2s ease-in-out 0;
            -moz-transition: all .2s ease-in-out 0;
            -ms-transition: all .2s ease-in-out 0;
            -o-transition: all .2s ease-in-out 0
        }

        .featuredArea ul li:first-child, .featuredArea ul li:first-child a img {
            width: 100%
        }

        .featuredArea ul li:last-child {
            display: none
        }

        .featuredArea ul li:last-child, .featuredArea ul li:nth-child(2) {
            margin-left: 12px
        }

        .featuredArea ul li:nth-child(2n+1) {
            margin-left: 0
        }

        .featuredArea ul li:last-child, .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5) {
            margin-bottom: 0
        }

    .featuredArea .desc {
        width: 100%;
        height: 50%;
        overflow: hidden;
        cursor: pointer;
        position: absolute;
        bottom: 0;
        right: 0;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
    }

        .featuredArea .desc p {
            line-height: 1.6;
            font-size: 16px;
            position: absolute
        }

    .featuredArea ul li:first-child .desc p {
        font-size: 24px;
        line-height: 1.8
    }

    .pattern01 ul li .desc p {
        height: 77px;
        line-height: 1.6;
        font-size: 14px
    }

    .pattern02 ul li {
        float: right;
        margin-left: 24px;
        margin-bottom: 24px;
        width: calc((50% - 40px)/ 2);
        height: auto;
        position: relative;
        overflow: hidden
    }

        .caricature, .monsterDiv, .pattern02 ul li:nth-child(3), .pattern02 ul li:nth-child(5) {
            margin-left: 0
        }

        .pattern02 ul li a {
            display: block
        }

        .pattern02 ul li:first-child {
            width: calc(50% - 8px)
        }

        .pattern02 ul li:nth-child(2), .pattern02 ul li:nth-child(3) {
            width: calc((50% - 40px)/ 2)
        }

        .pattern02 ul li:first-child, .pattern02 ul li:last-child, .pattern02 ul li:nth-child(4), .pattern02 ul li:nth-child(5) {
            margin-bottom: 0
        }

        .pattern02 ul li:last-child {
            display: none
        }

    .pattern02 .desc {
        width: 100%;
        height: 65%;
        overflow: hidden;
        cursor: pointer;
        position: absolute;
        bottom: 0;
        right: 0;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
    }

        .pattern02 .desc p {
            line-height: 1.6;
            font-size: 16px;
            position: absolute
        }

    .pattern02 ul li:first-child .desc p {
        font-size: 24px;
        line-height: 1.8;
        height: auto
    }

    .pattern02 ul li .secName {
        padding: 0 5px;
        font-size: 14px;
        color: #fff;
        background: #aa120d
    }

    .pattern02 ul li:first-child .secName {
        font-size: 18px
    }

    .pattern02 ul li:nth-last-child(-n+3) .desc {
        position: absolute;
        background: linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
        background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
    }

    .pattern02 ul li:nth-last-child(-n+5) .desc p {
        position: absolute;
        color: #fff;
        font-size: 16px;
        line-height: 1.6;
        padding: 12px;
        height: 62px;
        overflow: hidden;
        margin-bottom: 5px
    }

    .pattern02 ul li:nth-last-child(-n+3) .secName {
        position: absolute;
        background: #aa120d !important;
        padding: 0 10px;
        color: #fff;
        top: 1px;
        bottom: auto;
        right: 1px;
        display: inline-block
    }

        .pattern02 ul li:nth-last-child(-n+3) .secName:after {
            display: none
        }

        .pattern02 ul li:nth-last-child(-n+3) .item:hover .desc p, .pattern02 ul li:nth-last-child(-n+3) .secName:hover {
            color: #fff
        }

    .pattern02 ul li:nth-last-child(-n+3).icon-image, .pattern02 ul li:nth-last-child(-n+3).icon-video {
        background: #1d1d1d
    }

    .pattern02 ul li.icon-image:before, .pattern02 ul li.icon-video:before {
        color: #fff;
        background: rgba(0,0,0,.7);
        position: absolute;
        top: 1px;
        left: 1px;
        pointer-events: none;
        z-index: 1
    }

    .pattern02 ul li:nth-last-child(-n+3).icon-image .desc p, .pattern02 ul li:nth-last-child(-n+3).icon-video .desc p {
        color: #fff;
        padding: 12px
    }

    .pattern02 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .pattern02 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
        color: #fff
    }

    .pattern02 ul li:nth-last-child(-n+3).icon-image .secName, .pattern02 ul li:nth-last-child(-n+3).icon-video .secName {
        margin-right: 0;
        color: #fff
    }

        .pattern02 ul li:nth-last-child(-n+3).icon-image .secName:hover, .pattern02 ul li:nth-last-child(-n+3).icon-video .secName:hover {
            color: #fff
        }

    .pattern02 ul li.icon-video:before {
        content: "s";
        font-size: 30px;
        width: 41px;
        height: 40px;
        line-height: 1.35
    }

    .pattern02 ul li:first-child.icon-video:before {
        font-size: 56px;
        width: 70px;
        height: 70px;
        line-height: 1.25
    }

    .pattern02 ul li.icon-image:before {
        content: "t";
        font-size: 30px;
        width: 41px;
        height: 40px;
        line-height: 1.35
    }

    .pattern02 ul li:first-child.icon-image:before {
        font-size: 56px;
        width: 70px;
        height: 70px;
        line-height: 1.25
    }

    .opinions {
        width: 100%
    }

    .mobawaba, .mostRead {
        width: calc(100% - 348px)
    }

    .specialFiles {
        margin-left: 48px
    }

    .mobawaba {
        height: 225px
    }

        .mobawaba .border {
            height: 201px
        }

        .mobawaba .allItems {
            border-bottom: none;
            height: 225px
        }

        .mobawaba ul li {
            display: inline-block
        }

    .cd-gallery li.gap, .cd-gallery li:last-child:after, article .pattern01 ul li:last-child:after {
        display: none
    }

    .mobawaba ul li a img {
        width: 178px;
        height: auto;
        float: right;
        margin-left: 12px
    }

    .mobawaba .desc, .mobawaba .footer {
        width: calc(100% - 190px);
        float: right
    }

    .mobawaba .desc {
        height: auto;
        overflow: hidden;
        cursor: pointer;
        position: relative;
        bottom: auto;
        top: 0;
        right: 0;
        background: 0 0
    }

        .mobawaba .desc p {
            text-align: right;
            padding: 0;
            position: relative
        }

    .mobawaba .footer {
        height: 65px;
        background: #01313d;
        padding: 8px;
        right: 190px;
        bottom: 0
    }

    .allMatches .item .tourName {
        margin-bottom: 24px
    }

    .allMatches .item .teamA {
        width: 80px;
        height: 70px
    }

        .allMatches .item .teamA img, .allMatches .item .teamB img {
            height: 42px
        }

        .allMatches .item .teamA p, .allMatches .item .teamB p {
            padding-top: 10px;
            font-size: 12px
        }

    .allMatches .item .result {
        width: calc(100% - 160px);
        font-size: 32px
    }

        .allMatches .item .result.yesterday {
            padding-top: 12px
        }

    .allMatches .item .teamB {
        float: right;
        width: 80px;
        height: 70px
    }

    .allMatches .item .result span {
        font-size: 14px !important
    }

    .allMatches .item .status a {
        font-size: 12px
    }

    .allMatches .status span {
        margin-top: 26px
    }

    .allMatches .matchResult {
        font-size: 32px;
        margin-top: 0
    }

    .media .desc p {
        line-height: 1.5;
        padding: 12px;
        font-size: 16px;
        height: 62px;
        overflow: hidden;
        margin-bottom: 5px
    }

    .media ul li:first-child .desc p, .media ul li:nth-child(4) .desc p {
        height: auto;
        margin-bottom: 0
    }

    .media ul li .secName {
        padding: 0 5px;
        font-size: 14px
    }

    .media ul li.icon-image:before, .media ul li.icon-video:before {
        color: #fff;
        font-size: 30px;
        background: rgba(0,0,0,.7);
        position: absolute;
        top: 0;
        left: 0;
        width: 41px;
        height: 40px;
        line-height: 1.35;
        pointer-events: none;
        z-index: 1
    }

    .media ul li.icon-video:before {
        content: "s"
    }

    .media ul li.icon-image:before {
        content: "t"
    }

    .cd-gallery li .secName:after, .cd-gallery li:after, article .pattern01 ul li .secName:after, article .pattern01 ul li:after {
        content: ""
    }

    .caricature {
        width: 100%;
        height: auto
    }

        .caricature li {
            margin-left: 24px
        }

    .poll {
        width: 100%
    }

    .entrypoints {
        margin-right: calc((100% - 648px)/ 2)
    }

    .cd-gallery li.icon-image .secName, .cd-gallery li.icon-video .secName, article .pattern01 ul li.icon-image .secName, article .pattern01 ul li.icon-video .secName {
        margin-right: 0
    }

    .secondSC {
        margin-left: calc((100% - 648px)/ 2)
    }

    .pattern01 {
        padding: 10px
    }

    article .pattern01 .allItems {
        padding: 10px 0 0
    }

    article .pattern01 ul li {
        margin-left: 0;
        margin-bottom: 20px;
        padding-bottom: 0;
        width: 100%;
        height: auto;
        border-bottom: none;
        position: relative;
        overflow: visible
    }

        article .pattern01 ul li:after {
            width: 100%;
            height: 1px;
            background: #ddd;
            position: absolute;
            bottom: -10px;
            right: 0
        }

        article .pattern01 ul li:last-child {
            border-bottom: none;
            padding-bottom: 0;
            margin-bottom: 0
        }

        article .pattern01 ul li .item .imageCntnr {
            width: 132px;
            padding-bottom: calc((132px * 75)/ 100);
            margin-left: 10px;
            float: right
        }

        article .pattern01 ul li .item img {
            width: 100%;
            height: 100%;
            float: right;
            border: 1px solid #ddd
        }

        article .pattern01 ul li:nth-last-child(-n+5) {
            margin-bottom: 20px
        }

        article .pattern01 ul li .desc {
            width: calc(100% - 142px);
            overflow: hidden;
            cursor: pointer
        }

            article .pattern01 ul li .desc p {
                color: #1d1d1d;
                width: 100%;
                height: 62px;
                overflow: hidden;
                text-align: right;
                line-height: 1.4;
                padding: 5px 0;
                font-size: 14px;
                font-family: DroidKufiLight,Arial;
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0
            }

        article .pattern01 ul li .item:hover .desc p {
            color: #888
        }

        article .pattern01 ul li .secName {
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #888;
            position: absolute;
            bottom: 0;
            right: 142px
        }

            article .pattern01 ul li .secName:after {
                width: 4px;
                height: 14px;
                background: #aa120d;
                float: right;
                margin-left: 5px;
                margin-top: 4px
            }

            article .pattern01 ul li .secName:hover {
                color: #1d1d1d
            }

        article .pattern01 ul li.icon-image .desc p, article .pattern01 ul li.icon-video .desc p {
            padding: 5px 0 5px 10px
        }

        article .pattern01 ul li.icon-image:before, article .pattern01 ul li.icon-video:before {
            right: 1px
        }

    article .imgDiv {
        width: 100%
    }

    .catPattern01 ul li:first-child .desc p, .catPattern01 ul li:nth-child(2) .desc p, .catPattern01 ul li:nth-child(3) .desc p {
        line-height: 1.5;
        font-size: 16px;
        height: 59px;
        margin-bottom: 5px
    }

    .catPattern01 ul li:first-child.icon-video:before, .catPattern01 ul li:nth-child(2).icon-video:before, .catPattern01 ul li:nth-child(3).icon-video:before {
        font-size: 38px;
        width: 50px;
        height: 50px;
        line-height: 1.35
    }

    .catPattern02 ul li:first-child .desc p, .catPattern02 ul li:nth-child(2) .desc p {
        line-height: 1.5;
        font-size: 16px;
        height: 59px;
        margin-bottom: 5px
    }

    .catPattern02 ul li:first-child.icon-video:before, .catPattern02 ul li:nth-child(2).icon-video:before, .catPattern02 ul li:nth-child(3).icon-video:before, .catPattern03 ul li:first-child.icon-video:before {
        font-size: 38px;
        width: 50px;
        height: 50px;
        line-height: 1.35
    }

    .cd-gallery li .desc p, .cd-gallery li .secName {
        font-family: DroidKufiLight,Arial;
        font-size: 14px
    }

    .catPattern03 .desc p {
        height: 60px;
        line-height: 1.3;
        overflow: hidden;
        padding: 5px
    }

    .catPattern03 ul li:first-child .desc p {
        height: auto
    }

    .catPattern03 ul li:nth-last-child(-n+3).icon-image .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-video .desc p {
        height: 60px;
        line-height: 1.3;
        overflow: hidden
    }

    .cd-gallery .allItems {
        padding: 10px 0 0
    }

    .cd-gallery li {
        margin-left: 0;
        margin-bottom: 20px;
        padding-bottom: 0;
        width: 100%;
        height: auto;
        border-bottom: none;
        position: relative;
        overflow: visible
    }

        .cd-gallery li:after {
            width: 100%;
            height: 1px;
            background: #ddd;
            position: absolute;
            bottom: -10px;
            right: 0
        }

        .cd-gallery li:last-child {
            border-bottom: none;
            padding-bottom: 0;
            margin-bottom: 0
        }

        .cd-gallery li .item .imageCntnr {
            width: 132px;
            padding-bottom: calc((132px * 75)/ 100);
            margin-left: 10px;
            float: right
        }

        .cd-gallery li .item img {
            width: 100%;
            height: 100%;
            float: right;
            border: 1px solid #ddd
        }

        .cd-gallery li:nth-last-child(-n+5) {
            margin-bottom: 20px
        }

        .cd-gallery li .desc {
            width: calc(100% - 142px);
            overflow: hidden;
            cursor: pointer
        }

            .cd-gallery li .desc p {
                color: #1d1d1d;
                width: 100%;
                height: 62px;
                overflow: hidden;
                text-align: right;
                line-height: 1.4;
                padding: 5px 0;
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0
            }

        .cd-gallery li .item:hover .desc p {
            color: #888
        }

        .cd-gallery li .secName {
            color: #888;
            position: absolute;
            right: 142px;
            bottom: 0;
            margin-bottom: 0
        }

            .cd-gallery li .secName:after {
                width: 4px;
                height: 14px;
                background: #aa120d;
                float: right;
                margin-left: 5px;
                margin-top: 4px
            }

            .cd-gallery li .secName:hover {
                color: #1d1d1d
            }

        .cd-gallery li .time {
            width: auto;
            float: left;
            margin-left: 10px;
            margin-top: 5px
        }

        .cd-gallery li.icon-image .desc p, .cd-gallery li.icon-video .desc p {
            padding: 5px 0 5px 10px
        }

        .cd-gallery li.icon-image:before, .cd-gallery li.icon-video:before {
            right: 1px
        }

    .weatherDiv .main .dropDownDiv {
        width: 100%;
        margin-bottom: 24px
    }

    .weatherDiv .main .cityDate {
        width: 100%
    }
}

@media only screen and (max-width:1023px) {
    #cd-top-nav ul li, .sponsor .left, .sponsor .right, .sponsor .sponsorLogoBtn {
        display: none
    }

    .featuredArea .desc p, .featuredArea ul li .secName {
        color: #fff;
        right: 0;
        font-family: DroidKufiLight,Arial
    }

    .caricature li, .caricature li img {
        max-width: none
    }

    .catPattern01 ul li:nth-last-child(-n+5) .desc, .catPattern02 ul li:nth-last-child(-n+3) .desc, .catPattern03 .desc, .featuredArea .desc, .pattern02 ul li:nth-last-child(-n+3) .desc {
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
    }

    .show-sponsor .container, .sponsorHome .container {
        margin-right: 0
    }

    .show-sponsor .sponsor, .sponsorHome .sponsor {
        margin-right: 0;
        width: 100%
    }

    .show-sponsor.takeover .content-wrap, .sponsorHome.takeover .content-wrap, .takeover .content-wrap {
        margin: 60px 0 0;
        width: 100%
    }

    .sponsor .middle {
        width: 100%
    }

    .takeover .content-wrap {
        padding: 10px 10px 40px
    }

    .content-wrap {
        margin: 0;
        width: 100%
    }

    #cd-lateral-nav .linksMenu {
        display: inline-block
    }

    .no-touch #cd-vertical-nav, footer {
        display: none
    }

    body.openSearch .content-wrap {
        width: 100%;
        margin: 60px 0 0
    }

    .featuredArea {
        padding: 12px;
        margin-left: 12px;
        width: 100%;
        float: right
    }

        .featuredArea ul li, .featuredArea ul li:first-child {
            width: calc((100% - 12px)/ 2);
            margin-left: 12px
        }

        .featuredArea ul li {
            margin-bottom: 12px;
            position: relative;
            border: none;
            overflow: hidden
        }

            .featuredArea ul li .secName {
                padding: 0 10px;
                font-size: 14px;
                background: #aa120d;
                position: absolute;
                top: 0;
                z-index: 1
            }

            .featuredArea ul li:first-child .secName {
                font-size: 14px
            }

            .featuredArea .desc p, .featuredArea ul li:first-child .desc p {
                font-size: 16px;
                line-height: 1.6
            }

            .featuredArea ul li:first-child a .imageCntnr {
                padding-bottom: 75%
            }

            .featuredArea ul li:first-child a img {
                width: 100%
            }

            .featuredArea ul li:last-child {
                display: block
            }

            .featuredArea ul li:last-child, .featuredArea ul li:nth-child(2), .featuredArea ul li:nth-child(4) {
                margin-left: 0
            }

            .featuredArea ul li:nth-child(3), .featuredArea ul li:nth-child(5) {
                margin-left: 12px
            }

            .featuredArea ul li:last-child, .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5) {
                margin-bottom: 0
            }

        .featuredArea .desc {
            width: 100%;
            height: 50%;
            overflow: hidden;
            cursor: pointer;
            position: absolute;
            bottom: 0;
            right: 0;
            background: linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
        }

            .featuredArea .desc p {
                text-align: right;
                padding: 12px;
                position: absolute;
                bottom: 0
            }

    .akhbarThemak.fixed, .pattern01 ul li {
        position: relative
    }

    .showcaseDiv {
        margin: 0
    }

    .akhbarThemak {
        width: 100%;
        top: 0 !important
    }

        .akhbarThemak .cd-popup-container {
            width: calc(100% - 48px);
            height: 400px;
            margin: 120px 24px;
            overflow-y: scroll
        }

            .akhbarThemak .cd-popup-container h2 {
                float: none
            }

            .akhbarThemak .cd-popup-container .sec {
                width: 100%;
                margin-left: 0;
                margin-bottom: 24px;
                float: none
            }

                .akhbarThemak .cd-popup-container .sec:nth-child(6n+1) {
                    margin-left: 0
                }

        .akhbarThemak input[type=checkbox] + label {
            margin: 0 12px;
            width: auto
        }

    .pattern01 {
        padding: 10px
    }

        .pattern01 .allItems {
            padding: 10px 0 0
        }

        .pattern01 ul li {
            margin-left: 0;
            margin-bottom: 20px;
            padding-bottom: 0;
            width: 100%;
            height: auto;
            border-bottom: none;
            overflow: visible
        }

            .pattern01 ul li:after {
                content: "";
                width: 100%;
                height: 1px;
                background: #ddd;
                position: absolute;
                bottom: -10px;
                right: 0
            }

            .pattern01 ul li:last-child:after {
                display: none
            }

            .pattern01 ul li:last-child {
                border-bottom: none;
                padding-bottom: 0;
                margin-bottom: 0
            }

            .pattern01 ul li .item .imageCntnr {
                width: 132px;
                padding-bottom: calc((132px * 75)/ 100);
                margin-left: 10px;
                float: right
            }

            .pattern01 ul li .item img {
                width: 100%;
                height: 100%;
                float: right;
                border: 1px solid #ddd
            }

            .pattern01 ul li:nth-last-child(-n+5) {
                margin-bottom: 20px
            }

            .pattern01 ul li .desc {
                width: calc(100% - 142px);
                overflow: hidden;
                cursor: pointer
            }

                .pattern01 ul li .desc p {
                    color: #1d1d1d;
                    width: 100%;
                    height: 62px;
                    overflow: hidden;
                    text-align: right;
                    line-height: 1.4;
                    padding: 5px 0;
                    font-size: 14px;
                    font-family: DroidKufiLight,Arial;
                    transition: all .2s ease-in-out 0;
                    -webkit-transition: all .2s ease-in-out 0;
                    -moz-transition: all .2s ease-in-out 0;
                    -o-transition: all .2s ease-in-out 0;
                    -ms-transition: all .2s ease-in-out 0
                }

            .pattern01 ul li .item:hover .desc p {
                color: #888
            }

            .pattern01 ul li .secName {
                font-family: DroidKufiLight,Arial;
                font-size: 14px;
                color: #888;
                position: absolute;
                bottom: 0;
                right: 142px
            }

                .pattern01 ul li .secName:after {
                    content: "";
                    width: 4px;
                    height: 14px;
                    background: #aa120d;
                    float: right;
                    margin-left: 5px;
                    margin-top: 4px
                }

    .pattern02 ul li, .pattern02 ul li:first-child, .pattern02 ul li:nth-child(2), .pattern02 ul li:nth-child(3) {
        width: calc((100% - 12px)/ 2)
    }

    .pattern01 ul li .secName:hover {
        color: #1d1d1d
    }

    .pattern01 ul li.icon-image .desc p, .pattern01 ul li.icon-video .desc p {
        padding: 5px 0 5px 10px
    }

    .pattern01 ul li.icon-image .secName, .pattern01 ul li.icon-video .secName {
        margin-right: 0
    }

    .pattern01 ul li.icon-image:before, .pattern01 ul li.icon-video:before {
        right: 1px
    }

    .pattern02 ul li {
        margin-left: 12px;
        margin-bottom: 12px
    }

        .pattern02 ul li a .imageCntnr {
            position: relative;
            overflow: hidden;
            padding-bottom: 75%
        }

        .pattern02 ul li:last-child, .pattern02 ul li:nth-child(2), .pattern02 ul li:nth-child(3), .pattern02 ul li:nth-child(4), .pattern02 ul li:nth-child(5) {
            margin-left: 0
        }

        .pattern02 ul li:first-child, .pattern02 ul li:nth-child(3), .pattern02 ul li:nth-child(5) {
            margin-left: 12px
        }

        .pattern02 ul li:nth-child(4), .pattern02 ul li:nth-child(5) {
            margin-bottom: 0
        }

        .pattern02 ul li:last-child {
            display: block
        }

        .monsterDiv, .pattern02 ul li:nth-last-child(-n+3) .secName:after {
            display: none
        }

        .pattern02 ul li:first-child .item .imageCntnr {
            padding-bottom: 75%
        }

        .pattern02 ul li:first-child .desc p {
            font-size: 16px;
            line-height: 1.6
        }

        .pattern02 ul li:first-child .secName {
            font-size: 14px
        }

        .pattern02 ul li:nth-last-child(-n+3) .desc {
            width: 100%;
            height: 50%;
            overflow: hidden;
            cursor: pointer;
            position: absolute;
            bottom: 0;
            right: 0;
            background: linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
        }

            .pattern02 ul li:nth-last-child(-n+3) .desc p {
                color: #fff;
                text-align: right;
                line-height: 1.6;
                height: auto;
                padding: 12px;
                font-size: 16px;
                font-family: DroidKufiLight,Arial;
                position: absolute;
                bottom: 0;
                right: 0
            }

        .pattern02 ul li:nth-last-child(-n+3) .secName {
            padding: 0 10px;
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #fff;
            background: #aa120d;
            position: absolute;
            top: 1px;
            bottom: auto;
            right: 1px;
            z-index: 1
        }

            .pattern02 ul li:nth-last-child(-n+3) .item:hover .desc p, .pattern02 ul li:nth-last-child(-n+3) .secName:hover {
                color: #fff
            }

        .pattern02 ul li:nth-last-child(-n+3).icon-image, .pattern02 ul li:nth-last-child(-n+3).icon-video {
            background: #1d1d1d
        }

        .pattern02 ul li.icon-image:before, .pattern02 ul li.icon-video:before {
            background: rgba(0,0,0,.7);
            position: absolute;
            top: 1px;
            left: 1px;
            pointer-events: none;
            z-index: 1;
            color: #fff
        }

        .pattern02 ul li:nth-last-child(-n+3).icon-image .desc p, .pattern02 ul li:nth-last-child(-n+3).icon-video .desc p {
            color: #fff;
            padding: 12px
        }

        .pattern02 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .pattern02 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
            color: #fff
        }

        .pattern02 ul li:nth-last-child(-n+3).icon-image .secName, .pattern02 ul li:nth-last-child(-n+3).icon-video .secName {
            margin-right: 0;
            color: #fff
        }

            .pattern02 ul li:nth-last-child(-n+3).icon-image .secName:hover, .pattern02 ul li:nth-last-child(-n+3).icon-video .secName:hover {
                color: #fff
            }

        .pattern02 ul li.icon-video:before {
            content: "s";
            font-size: 30px;
            width: 41px;
            height: 40px;
            line-height: 1.35
        }

        .pattern02 ul li:first-child.icon-video:before {
            font-size: 56px;
            width: 70px;
            height: 70px;
            line-height: 1.25
        }

        .pattern02 ul li.icon-image:before {
            content: "t";
            font-size: 30px;
            width: 41px;
            height: 40px;
            line-height: 1.35
        }

        .pattern02 ul li:first-child.icon-image:before {
            font-size: 56px;
            width: 70px;
            height: 70px;
            line-height: 1.25
        }

    .media .desc p, .media ul li:first-child .desc p, .media ul li:nth-child(4) .desc p {
        font-size: 18px;
        line-height: 1.6
    }

    .mostRead, .opinions {
        width: 100%
    }

    .media ul li {
        width: calc((100% - 24px)/ 2)
    }

        .media ul li:nth-child(2n) {
            margin-left: 0
        }

        .media ul li:nth-child(4) {
            float: right
        }

        .media ul li:nth-child(3) {
            margin-left: 24px
        }

        .media ul li .secName {
            font-size: 18px
        }

        .media ul li.icon-image:before, .media ul li.icon-video:before, .media ul li:first-child.icon-image:before, .media ul li:first-child.icon-video:before, .media ul li:nth-child(4).icon-image:before, .media ul li:nth-child(4).icon-video:before {
            font-size: 40px;
            width: 50px;
            height: 50px;
            line-height: 1.25
        }

    .specialFiles {
        margin-bottom: 40px;
        margin-left: 48px
    }

    .mobawaba {
        width: calc(100% - 348px);
        height: 225px
    }

        .mobawaba .border {
            height: 201px
        }

        .mobawaba .allItems {
            border-bottom: none
        }

        .mobawaba ul li {
            display: inline-block;
            width: 100%
        }

    .articleDiv .cd-read-more, article .pattern01 ul li:after {
        display: none
    }

    .mobawaba ul li a img {
        width: 120px;
        height: auto;
        float: right;
        margin-left: 12px
    }

    .mobawaba .desc {
        width: calc(100% - 132px);
        height: auto;
        overflow: hidden;
        cursor: pointer;
        position: relative;
        bottom: auto;
        top: 0;
        right: 0;
        float: right;
        background: 0 0
    }

        .mobawaba .desc p {
            text-align: right;
            padding: 0;
            position: relative
        }

    .mobawaba .footer {
        width: 100%;
        height: 40px;
        background: #01313d;
        padding: 8px;
        float: right;
        right: 0;
        bottom: -46px
    }

        .mobawaba .footer .price {
            float: right;
            font-family: Arial;
            font-weight: 700;
            font-size: 20px;
            color: #fff;
            line-height: 1.2
        }

            .mobawaba .footer .price span {
                margin-right: 5px;
                font-family: DroidKufiLight,Arial;
                font-size: 14px;
                font-weight: 400
            }

        .mobawaba .footer .add {
            float: left;
            height: 24px;
            padding: 0 8px;
            font-family: DroidKufiLight,Arial;
            font-size: 15px;
            color: #fff;
            background: #0683a4;
            line-height: 1.8
        }

            .mobawaba .footer .add:hover {
                background: #08708a
            }

    .sportsContainer .allMatches .slide {
        width: 140%
    }

    .sportsContainer .allMatches .item {
        width: calc(100% / 3);
        min-width: 290px
    }

    .masrawyServices ul {
        width: 100%
    }

    .caricature {
        width: 100%;
        margin-left: 0;
        height: auto
    }

        .caricature li {
            width: calc((100% - 72px)/ 4);
            margin-left: 24px
        }

    .article, .poll, .sponsorBanner {
        width: 100%
    }

    .caricature li:nth-child(4) {
        margin-left: 0
    }

    .caricature li:last-child {
        margin-left: 0;
        display: none
    }

    .entrypoints {
        margin-right: calc((100% - 648px)/ 2)
    }

    .secondSC {
        margin-left: calc((100% - 648px)/ 2);
        margin-right: 0
    }

    .sponsorBanner {
        margin: 0
    }

    .show-sponsor .sponsorBanner, .sponsorHome .sponsorBanner {
        width: 100%;
        margin-right: 0
    }

    .sponsorBtnText {
        left: 10px
    }

    article .pattern01 .allItems {
        padding: 24px 0 0
    }

    article .pattern01 ul li {
        margin-left: 24px
    }

        article .pattern01 ul li .item .imageCntnr {
            width: auto;
            padding-bottom: 75%;
            margin-left: 0;
            float: none
        }

        article .pattern01 ul li .desc {
            width: 100%
        }

            article .pattern01 ul li .desc p {
                color: #1d1d1d;
                height: 84px;
                margin-bottom: 5px;
                overflow: hidden;
                text-align: right;
                line-height: 1.6;
                padding: 10px 0;
                font-size: 15px;
                font-family: DroidKufiLight,Arial;
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0
            }

        article .pattern01 ul li .secName {
            position: relative;
            right: 0
        }

    .articleSocialMedia {
        position: fixed;
        margin-right: 0;
        right: 0;
        top: auto;
        bottom: 0;
        left: 0;
        z-index: 10;
        background: 0 0;
        padding: 0;
        width: 100%;
        height: 40px
    }

    .hideSocialBtns .articleSocialMedia {
        bottom: -40px
    }

    .articleSocialMedia a {
        display: inline-block;
        width: calc(100% / 5);
        height: 40px;
        border-radius: 0;
        margin-bottom: 0;
        float: right
    }

    .catPattern01 ul li, .catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(2), .catPattern01 ul li:nth-child(3) {
        width: calc((100% - 12px)/ 2)
    }

    .articleSocialMedia .icon-fb {
        background: rgba(58,87,153,.95)
    }

    .articleSocialMedia .icon-tw {
        background: rgba(31,162,240,.95)
    }

    .articleSocialMedia .icon-ggl {
        background: rgba(213,81,66,.95)
    }

    .articleSocialMedia .icon-wapp {
        background: rgba(24,157,14,.95);
        display: block
    }

    .articleSocialMedia .icon-mail, .articleSocialMedia .icon-print, .catPattern02 ul li:last-child, .catPattern03 ul li:after {
        display: none
    }

    .articleSocialMedia .icon-msngr {
        background: rgba(0,132,255,.95)
    }

    .articleSocialMedia .icon-fb:before, .articleSocialMedia .icon-ggl:before, .articleSocialMedia .icon-tw:before {
        line-height: 2
    }

    .articleSocialMedia .icon-wapp:before {
        line-height: 1.9
    }

    .articleSocialMedia .icon-msngr:before {
        line-height: 2
    }

    .catPattern01 .desc p, .catPattern01 ul li:first-child .desc p, .catPattern01 ul li:nth-child(2) .desc p, .catPattern01 ul li:nth-child(3) .desc p {
        font-size: 16px;
        line-height: 1.6
    }

    .catPattern01 ul li {
        margin-left: 12px;
        margin-bottom: 12px
    }

        .catPattern01 ul li:nth-child(3) {
            margin-left: 12px
        }

        .catPattern01 ul li:nth-child(2n), .catPattern02 {
            margin-left: 0
        }

        .catPattern01 ul li:nth-last-child(-n+5) {
            margin-bottom: 12px
        }

            .catPattern01 ul li:nth-last-child(-n+5) .desc {
                position: absolute;
                background: linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
            }

                .catPattern01 ul li:nth-last-child(-n+5) .desc p {
                    position: absolute;
                    color: #fff;
                    font-size: 16px;
                    line-height: 1.6;
                    padding: 12px;
                    height: auto;
                    margin-bottom: 0
                }

            .catPattern01 ul li:nth-last-child(-n+5) .item:hover .desc p {
                color: #fff
            }

        .catPattern01 ul li:first-child.icon-image:before, .catPattern01 ul li:first-child.icon-video:before, .catPattern01 ul li:nth-child(2).icon-image:before, .catPattern01 ul li:nth-child(2).icon-video:before, .catPattern01 ul li:nth-child(3).icon-image:before, .catPattern01 ul li:nth-child(3).icon-video:before {
            font-size: 40px;
            width: 50px;
            height: 50px;
            line-height: 1.2
        }

        .catPattern01 ul li:nth-child(2) .desc p, .catPattern02 .desc p, .catPattern02 ul li:first-child .desc p {
            font-size: 16px;
            line-height: 1.6
        }

        .catPattern01 ul li:nth-last-child(-n+5).icon-image, .catPattern01 ul li:nth-last-child(-n+5).icon-video {
            background: 0 0
        }

            .catPattern01 ul li:nth-last-child(-n+5).icon-image .desc p, .catPattern01 ul li:nth-last-child(-n+5).icon-video .desc p {
                color: #fff;
                padding: 12px
            }

            .catPattern01 ul li:nth-last-child(-n+5).icon-image .item:hover .desc p, .catPattern01 ul li:nth-last-child(-n+5).icon-video .item:hover .desc p {
                color: #fff
            }

    .catPattern02 {
        width: 100%
    }

        .catPattern02 ul li, .catPattern02 ul li:first-child, .catPattern02 ul li:nth-child(2) {
            width: calc((100% - 12px)/ 2)
        }

        .catPattern02 ul li {
            margin-left: 12px;
            margin-bottom: 12px
        }

            .catPattern02 ul li:nth-child(2n), .catPattern03 {
                margin-left: 0
            }

            .catPattern02 ul li:nth-last-child(-n+3) .desc {
                position: absolute;
                background: linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
                background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
            }

                .catPattern02 ul li:nth-last-child(-n+3) .desc p {
                    position: absolute;
                    color: #fff;
                    font-size: 16px;
                    line-height: 1.6;
                    padding: 12px;
                    height: auto;
                    margin-bottom: 0
                }

            .catPattern02 ul li:nth-last-child(-n+3) .item:hover .desc p {
                color: #fff
            }

            .catPattern02 ul li:first-child.icon-image:before, .catPattern02 ul li:first-child.icon-video:before, .catPattern02 ul li:nth-child(2).icon-image:before, .catPattern02 ul li:nth-child(2).icon-video:before {
                font-size: 40px;
                width: 50px;
                height: 50px;
                line-height: 1.2
            }

            .catPattern02 ul li:nth-last-child(-n+3).icon-image, .catPattern02 ul li:nth-last-child(-n+3).icon-video {
                background: 0 0
            }

                .catPattern02 ul li:nth-last-child(-n+3).icon-image .desc p, .catPattern02 ul li:nth-last-child(-n+3).icon-video .desc p {
                    color: #fff;
                    padding: 12px
                }

                .catPattern02 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .catPattern02 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
                    color: #fff
                }

    .catPattern03 {
        width: 100%;
        height: auto
    }

        .catPattern03 ul li {
            margin-left: 12px;
            margin-bottom: 12px;
            width: calc((100% - 12px)/ 2)
        }

            .catPattern03 ul li a .imageCntnr {
                position: relative;
                overflow: hidden;
                padding-bottom: 75%;
                float: none;
                width: auto;
                margin-left: 0
            }

            .catPattern03 .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-image .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-video .desc p {
                padding: 12px;
                color: #fff
            }

            .catPattern03 ul li:nth-child(2n) {
                margin-left: 0
            }

        .catPattern03 .desc {
            position: absolute;
            bottom: 0;
            right: 0;
            float: none;
            width: 100%;
            background: linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000)
        }

            .catPattern03 .desc p {
                line-height: 1.6;
                margin-bottom: 0;
                position: absolute;
                bottom: 0;
                right: 0;
                font-size: 16px
            }

        .catPattern03 ul li:nth-last-child(-n+3) .item:hover .desc p {
            color: #fff
        }

        .catPattern03 ul li:first-child.icon-image:before, .catPattern03 ul li:first-child.icon-video:before, .catPattern03 ul li:nth-child(2).icon-image:before, .catPattern03 ul li:nth-child(2).icon-video:before {
            font-size: 30px;
            width: 41px;
            height: 40px;
            line-height: 1.35
        }

    .contactUsDiv .contactUsCnts, .currGoldDiv .currencyDiv, .currGoldDiv .goldDiv, .listing, .masrawyServicesDiv .services, .matchesSchedule .schedule, .newsPointerDiv .newsPointer, .policyDiv .policy, .pollListingDiv .pollListing, .prayerTimes .prayerTimesTable, .searchResult, .weatherDiv .weatherCnts, .zakahDiv .zakahCnts {
        width: 100%;
        margin-left: 0
    }

    .catPattern03 ul li.icon-image:before, .catPattern03 ul li.icon-video:before {
        left: 1px;
        right: auto
    }

    .catPattern03 ul li:nth-last-child(-n+3).icon-image, .catPattern03 ul li:nth-last-child(-n+3).icon-video {
        background: 0 0
    }

        .catPattern03 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
            color: #fff
        }

    .innerListing .akhbarThemak {
        position: relative;
        top: 0 !important
    }

    .currGoldDiv .main {
        padding: 10px
    }

    .masrawyServicesDiv .services .servicesCnts .item p {
        height: 108px
    }

    .oneStickyDiv {
        height: 40px
    }

        .oneStickyDiv .cnts {
            width: calc(100% - 10px);
            margin: 0 10px
        }

        .oneStickyDiv .bx-viewport {
            height: 40px !important
        }

        .oneStickyDiv .onSlider {
            margin-right: 60px;
            height: 40px
        }

            .oneStickyDiv .onSlider li h3 {
                margin-left: 12px;
                font-size: 18px;
                line-height: 2.5;
                width: 70px
            }

            .oneStickyDiv .onSlider li p {
                font-size: 16px;
                line-height: 2.6
            }

        .oneStickyDiv .onLogo {
            width: 50px;
            height: 50px
        }

            .oneStickyDiv .onLogo img {
                width: 100%;
                height: 100%
            }

    .billboardDiv, .leaderboardDiv {
        min-width: 300px
    }

    .featuredSC .showcaseDiv {
        display: inline-block
    }

    .surveyDiv .questionsDiv, .surveyDiv .resultDiv {
        width: 100%;
        margin-left: 0
    }

        .surveyDiv .resultDiv .grid li {
            width: calc((100% - 24px)/ 2)
        }

            .surveyDiv .resultDiv .grid li:nth-child(3n) {
                margin-left: 24px
            }

            .surveyDiv .resultDiv .grid li:nth-child(2n) {
                margin-left: 0
            }

    .articleSocialMedia::before {
        display: none
    }

    .rssDiv .rssCnts {
        width: 100%;
        margin-left: 0
    }
}

@media screen and (min-width:768px) and (max-width:882px) {
    .masrawyServicesDiv .services .servicesCnts .item p {
        height: 135px
    }
}

@media screen and (min-width:320px) and (max-width:872px) {
    .cd-tab-filter {
        width: 100%;
        margin: 0
    }

        .cd-tab-filter::after {
            display: inline-block
        }

        .cd-tab-filter ul {
            position: absolute;
            width: 100%
        }

        .cd-tab-filter li {
            display: none
        }

            .cd-tab-filter li.placeholder {
                display: block !important
            }

                .cd-tab-filter li.placeholder a:hover {
                    color: #aaa
                }

        .cd-tab-filter a {
            display: inline-block;
            width: 100%;
            padding-right: 12px
        }

            .cd-tab-filter a.selected {
                background: #f2f2f2;
                color: #1d1d1d;
                box-shadow: none;
                padding-right: 12px
            }

        .cd-tab-filter.is-open ul li {
            display: block
        }
}

@media screen and (min-width:320px) and (max-width:767px) {
    .cd-main-content, .content-wrap {
        top: 0;
        height: 100%;
        left: 0;
        right: 0
    }

    #cd-top-nav > ul > li:hover, .morphsearch {
        background: 0 0
    }

    #cd-top-nav .rightDiv date, .overflow-hidden #cd-top-nav, .show-sponsor .sponsor .left, .show-sponsor .sponsor .right, .show-sponsor .sponsorLogoBtn, .sponsorBtnText:after, .sponsorHome .sponsor .left, .sponsorHome .sponsor .right, .sponsorHome .sponsorLogoBtn {
        display: none
    }

    .mobawaba .desc p, .ttl h2 {
        font-family: DroidKufiLight,Arial
    }

    .cd-main-content {
        position: absolute;
        bottom: 0;
        width: 100%
    }

    .content-wrap, .overflow-hidden .cd-main-content {
        position: relative
    }

    .content-wrap {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0
    }

    .sponsorHome.takeover .content-wrap {
        padding: 0;
        position: relative;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        height: 100%;
        left: 0;
        right: 0
    }

    .show-sponsor .sponsorBanner, .show-sponsor.takeover .content-wrap, .sponsorHome .sponsorBanner, .sponsorHome.takeover .content-wrap {
        width: 100%;
        margin: 60px 0 0
    }

    .show-sponsor .container, .sponsorHome .container {
        margin-right: 0
    }

    .sponsor .middle {
        width: 100%
    }

        .sponsor .middle .sponsorContent img {
            height: auto;
            width: calc(100% - 20px)
        }

    .sponsorBanner p {
        font-size: 14px;
        text-align: right;
        padding: 8px 12px 0 0;
        line-height: 3.5
    }

    .sponsorBtnText {
        width: 40px
    }

    .icon-spnsrBottom:before {
        margin: 0 10px
    }

    #cd-top-nav {
        margin-right: 0;
        width: calc(100% - 60px)
    }

        #cd-top-nav ul li:last-child, #cd-top-nav > ul {
            width: 60px
        }

    .morphSearchDiv {
        width: 60px;
        transition: 0
    }

    .morphsearch {
        width: 60px;
        transition: background .1s ease-in-out 0
    }

    .morphsearch-input {
        padding: 28px 18px 0;
        transition: 0
    }

    .morphsearch-form, .morphsearch-form.icon-search:before, .morphsearch-submit.icon-search {
        transition: 0
    }

    .openSearch .morphsearch.open .morphsearch-submit.icon-search:before {
        width: 54px;
        height: 54px;
        font-size: 42px;
        left: 24px;
        line-height: 1.2;
        transition: 0
    }

    .ttl h2, .ttl h2 a {
        font-size: 20px
    }

    .openSearch .morphsearch.open .morphsearch-content {
        padding: 0 5%;
        height: 390px;
        overflow: hidden;
        transition: 0;
        margin-top: 0;
        top: 180px
    }

    #cd-top-nav .rightDiv {
        width: calc(100% - 60px)
    }

    #cd-top-nav .masLogo {
        margin: 5px
    }

    .overflow-hidden {
        margin-right: 0;
        width: 100%
    }

    footer .top {
        height: auto
    }

        footer .top .cnts {
            width: calc(100% - 24px);
            margin: 0 12px;
            padding: 10px 0 15px
        }

            footer .top .cnts h2 {
                float: right;
                margin-left: 0;
                display: inline-block;
                width: 100%
            }

            footer .top .cnts .subTxt {
                width: 300px;
                float: right;
                height: 40px;
                display: inline-block
            }

    footer .middle .navMenu {
        width: 100%;
        padding: 10px 0;
        margin: 0
    }

        footer .middle .navMenu ul .has-children {
            float: right;
            width: 100%;
            height: 40px;
            margin-left: 0;
            margin-bottom: 12px
        }

            footer .middle .navMenu ul .has-children a {
                display: block;
                width: calc(100% - 24px);
                height: 40px;
                padding-right: 12px;
                margin: 0 12px;
                line-height: 3;
                background: #1a1a1a
            }

        .featuredArea ul li:first-child:after, .featuredArea ul li:last-child:after, .mainKeywords, footer .middle .navMenu ul .is-hidden {
            display: none
        }

        footer .middle .navMenu ul .has-children:last-child {
            width: 100%;
            margin-bottom: 0
        }

    .ttl h2 {
        line-height: 1.8
    }

    .ttl .more {
        font-size: 16px;
        line-height: 2.2
    }

    .ttl .icon-more:before {
        font-size: 16px;
        line-height: 2.3
    }

    .featuredArea {
        padding: 10px
    }

        .featuredArea .allItems {
            padding: 10px 0
        }

        .featuredArea ul li {
            margin-left: 0;
            width: 100%;
            margin-bottom: 20px;
            overflow: visible
        }

            .featuredArea ul li:after {
                content: "";
                width: 100%;
                height: 1px;
                background: #ddd;
                position: absolute;
                bottom: -10px;
                right: 0
            }

            .featuredArea ul li a .imageCntnr {
                position: relative;
                width: 132px;
                overflow: hidden;
                padding-bottom: calc((132px * 75)/ 100);
                float: right;
                margin-left: 10px
            }

            .featuredArea ul li:first-child a .imageCntnr {
                width: 100%;
                padding-bottom: 75%
            }

            .featuredArea ul li:first-child, .featuredArea ul li:nth-child(2), .featuredArea ul li:nth-child(3) {
                width: 100%
            }

            .featuredArea ul li:last-child, .featuredArea ul li:nth-child(3), .featuredArea ul li:nth-child(5) {
                margin-left: 0
            }

            .featuredArea ul li:first-child, .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5) {
                margin-bottom: 20px
            }

            .featuredArea ul li:last-child {
                display: block
            }

            .featuredArea ul li:nth-last-child(-n+5) .desc {
                width: calc(100% - 142px);
                height: auto;
                overflow: hidden;
                cursor: pointer;
                position: relative;
                bottom: 0;
                right: 0;
                background: 0 0
            }

                .featuredArea ul li:nth-last-child(-n+5) .desc p {
                    color: #1d1d1d;
                    text-align: right;
                    line-height: 1.6;
                    height: 72px;
                    overflow: hidden;
                    padding: 5px 0;
                    font-size: 14px;
                    font-family: DroidKufiLight,Arial;
                    position: relative;
                    bottom: 0;
                    right: 0
                }

            .featuredArea ul li:nth-last-child(-n+5) .secName {
                padding: 0;
                position: absolute;
                top: auto;
                bottom: -7px;
                right: 142px;
                background: 0 0 !important;
                color: #888;
                font-size: 14px
            }

                .featuredArea ul li:nth-last-child(-n+5) .secName:after {
                    content: "";
                    width: 4px;
                    height: 14px;
                    background: #aa120d;
                    float: right;
                    margin-left: 5px;
                    margin-top: 6px;
                    display: block
                }

    .mobawaba .ttl h2 a:after, .opinions .allItems li .date {
        display: none
    }

    .featuredArea ul li:nth-last-child(-n+5) .item:hover .desc p {
        color: #888
    }

    .featuredArea ul li:nth-last-child(-n+5) .secName:hover {
        color: #1d1d1d
    }

    .akhbarThemak .cd-popup-container {
        width: calc(100% - 20px);
        height: 400px;
        margin: 120px 10px;
        overflow-y: scroll;
        padding: 24px 12px
    }

    .mostRead, .opinions {
        padding: 10px
    }

    .akhbarThemak .cd-popup-container h2 {
        font-size: 20px
    }

    .media .desc p, .media ul li .secName {
        font-size: 16px
    }

    .akhbarThemak .cd-popup-container .sec {
        width: 100%;
        margin-left: 0;
        margin-bottom: 24px
    }

        .akhbarThemak .cd-popup-container .sec:nth-child(6n+1) {
            margin-left: 0;
            margin-bottom: 0
        }

    .akhbarThemak input[type=checkbox] + label {
        margin: 0 5px 12px;
        width: 100%
    }

    .akhbarThemak .cd-popup-container.notify {
        width: calc(100% - 20px);
        height: 200px;
        margin: 120px 10px;
        overflow-y: hidden
    }

    .media ul li, .media ul li:first-child, .media ul li:nth-child(4), .mostRead, .opinions {
        width: 100%
    }

    .pattern01 ul li .desc p {
        line-height: 1.6;
        height: 72px;
        overflow: hidden
    }

    .pattern01 ul li .secName {
        bottom: -7px
    }

    .pattern01 ul li.icon-image .secName, .pattern01 ul li.icon-video .secName {
        bottom: -2px
    }

    .media ul li:nth-child(2n) {
        margin-left: 0
    }

    .media ul li:nth-child(4) {
        float: right
    }

    .media ul li:nth-child(3) {
        margin-left: 24px
    }

    .media ul li:nth-last-child(-n+3) {
        margin-bottom: 24px
    }

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

    .media .desc p {
        line-height: 1.6
    }

    .media ul li:first-child .desc p, .media ul li:nth-child(4) .desc p {
        font-size: 16px;
        line-height: 1.6
    }

    .media ul li.icon-image:before, .media ul li.icon-video:before, .media ul li:first-child.icon-image:before, .media ul li:first-child.icon-video:before, .media ul li:nth-child(4).icon-image:before, .media ul li:nth-child(4).icon-video:before {
        font-size: 40px;
        width: 50px;
        height: 50px;
        line-height: 1.2
    }

    .mobawaba, .specialFiles {
        width: 300px;
        margin: 0
    }

    .mobawaba {
        padding: 12px;
        background: #0683a4;
        height: 367px
    }

        .mobawaba .border {
            border: 1px solid #5daebf;
            height: 343px
        }

        .mobawaba .ttl {
            height: 49px;
            border-bottom: 1px solid #5daebf
        }

        .mobawaba .allItems {
            padding: 8px;
            border-bottom: 1px solid #5daebf
        }

        .mobawaba ul li {
            position: relative
        }

        .mobawaba .desc, .mobawaba .desc p, .mobawaba .footer, .pattern02 ul li:after {
            position: absolute;
            right: 0
        }

        .mobawaba ul li a {
            display: block
        }

            .mobawaba ul li a img {
                width: 100%;
                height: auto;
                margin-left: 0;
                border: none;
                filter: brightness(100%) contrast(100%);
                -webkit-filter: brightness(100%) contrast(100%);
                -moz-filter: brightness(100%) contrast(100%);
                -o-filter: brightness(100%) contrast(100%);
                -ms-filter: brightness(100%) contrast(100%);
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0
            }

        .mobawaba ul li:hover img {
            filter: brightness(108%) contrast(108%);
            -webkit-filter: brightness(108%) contrast(108%);
            -moz-filter: brightness(108%) contrast(108%);
            -o-filter: brightness(108%) contrast(108%);
            -ms-filter: brightness(108%) contrast(108%)
        }

        .mobawaba .desc {
            width: 100%;
            height: 50%;
            overflow: hidden;
            cursor: pointer;
            bottom: 0;
            top: auto;
            background: linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
            background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
            filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0)
        }

            .mobawaba .desc p {
                color: #fff;
                text-align: center;
                line-height: 1.6;
                padding: 12px;
                font-size: 18px;
                bottom: 0;
                height: 80px;
                overflow: hidden
            }

        .mobawaba .footer {
            width: 100%;
            height: 65px;
            background: #01313d;
            padding: 8px;
            bottom: -84px;
            cursor: default
        }

            .mobawaba .footer .price {
                float: right;
                font-family: Arial;
                font-weight: 700;
                font-size: 22px;
                color: #fff;
                line-height: 2.2;
                cursor: default
            }

                .mobawaba .footer .price span {
                    margin-right: 5px;
                    font-family: DroidKufiLight,Arial;
                    font-size: 14px;
                    font-weight: 400
                }

            .mobawaba .footer .add {
                float: left;
                height: 49px;
                padding: 0 8px;
                font-family: DroidKufiLight,Arial;
                font-size: 15px;
                color: #fff;
                background: #0683a4;
                line-height: 3.4
            }

                .mobawaba .footer .add:hover {
                    background: #08708a
                }

    .poll {
        padding: 10px;
        width: 100%;
        height: auto
    }

        .poll .allItems {
            margin-bottom: 24px
        }

    .entrypoints, .secondSC {
        margin: 0
    }

    body.openSearch .content-wrap {
        width: 100%;
        margin: 0
    }

    .pattern02 ul li, .pattern02 ul li:first-child, .pattern02 ul li:nth-child(4), .pattern02 ul li:nth-child(5) {
        margin-bottom: 20px
    }

    .openSearch .morphsearch.open .morphsearch-form {
        height: 100px;
        width: 90%
    }

    .morphsearch-content h2 {
        font-size: 20px
    }

    .morphsearch-content .keywordsDiv .item {
        font-size: 13px;
        padding: 4px 10px
    }

    .pattern02 {
        padding: 10px
    }

        .pattern02 .allItems {
            padding: 10px 0
        }

        .pattern02 ul li {
            margin-left: 0;
            width: 100%;
            overflow: visible
        }

            .pattern02 ul li:after {
                content: "";
                width: 100%;
                height: 1px;
                background: #ddd;
                bottom: -10px
            }

            .pattern02 ul li:first-child:after, .pattern02 ul li:last-child:after {
                display: none
            }

            .pattern02 ul li a .imageCntnr {
                position: relative;
                width: 132px;
                overflow: hidden;
                padding-bottom: calc((132px * 75)/ 100);
                float: right;
                margin-left: 10px
            }

            .pattern02 ul li:first-child a .imageCntnr {
                width: 100%;
                padding-bottom: 75%
            }

            .pattern02 ul li:first-child, .pattern02 ul li:nth-child(2), .pattern02 ul li:nth-child(3) {
                width: 100%
            }

            .pattern02 ul li:last-child, .pattern02 ul li:nth-child(3), .pattern02 ul li:nth-child(5) {
                margin-left: 0
            }

            .pattern02 ul li:last-child {
                display: block
            }

            .pattern02 ul li:nth-last-child(-n+5) .desc {
                width: calc(100% - 142px);
                height: auto;
                overflow: hidden;
                cursor: pointer;
                position: relative;
                bottom: 0;
                right: 0;
                background: 0 0
            }

                .pattern02 ul li:nth-last-child(-n+5) .desc p {
                    color: #1d1d1d;
                    text-align: right;
                    line-height: 1.6;
                    height: 72px;
                    overflow: hidden;
                    padding: 5px 0;
                    font-size: 14px;
                    font-family: DroidKufiLight,Arial;
                    position: relative;
                    bottom: 0;
                    right: 0
                }

            .pattern02 ul li:nth-last-child(-n+5) .secName {
                padding: 0;
                position: absolute;
                top: auto;
                bottom: -7px;
                right: 142px;
                background: 0 0 !important;
                color: #888;
                font-size: 14px
            }

                .pattern02 ul li:nth-last-child(-n+5) .secName:after {
                    content: "";
                    width: 4px;
                    height: 14px;
                    background: #aa120d;
                    float: right;
                    margin-left: 5px;
                    margin-top: 6px;
                    display: block
                }

            .pattern02 ul li:nth-last-child(-n+5) .item:hover .desc p {
                color: #888
            }

            .pattern02 ul li:nth-last-child(-n+5) .secName:hover {
                color: #1d1d1d
            }

            .pattern02 ul li:nth-last-child(-n+5).icon-image, .pattern02 ul li:nth-last-child(-n+5).icon-video {
                background: #1d1d1d
            }

            .pattern02 ul li.icon-image:before, .pattern02 ul li.icon-video:before {
                background: rgba(0,0,0,.7);
                position: absolute;
                top: 1px;
                pointer-events: none;
                z-index: 1
            }

            .pattern02 ul li:nth-last-child(-n+5).icon-image .desc p, .pattern02 ul li:nth-last-child(-n+5).icon-video .desc p {
                color: #fff;
                padding: 5px 0 5px 10px
            }

            .pattern02 ul li:nth-last-child(-n+5).icon-image .item:hover .desc p, .pattern02 ul li:nth-last-child(-n+5).icon-video .item:hover .desc p {
                color: #fff
            }

            .pattern02 ul li:nth-last-child(-n+5).icon-image .secName, .pattern02 ul li:nth-last-child(-n+5).icon-video .secName {
                margin-right: 0;
                color: #bbb;
                bottom: -2px
            }

                .pattern02 ul li:nth-last-child(-n+5).icon-image .secName:hover, .pattern02 ul li:nth-last-child(-n+5).icon-video .secName:hover {
                    color: #fff
                }

            .pattern02 ul li.icon-video:before {
                content: "s";
                color: #fff;
                font-size: 30px;
                left: auto;
                right: 1px;
                width: 41px;
                height: 40px;
                line-height: 1.35
            }

            .pattern02 ul li:first-child.icon-video:before {
                font-size: 40px;
                width: 50px;
                height: 50px;
                line-height: 1.25;
                right: auto;
                left: 1px
            }

            .pattern02 ul li.icon-image:before {
                content: "t";
                color: #fff;
                font-size: 30px;
                left: auto;
                right: 1px;
                width: 41px;
                height: 40px;
                line-height: 1.35
            }

    .catPattern01 ul li:after, .catPattern01 ul li:nth-last-child(-n+7) .secName:after, .catPattern02 ul li:after, .catPattern03 ul li:after, .catPattern03 ul li:nth-last-child(-n+3) .secName:after, .cd-gallery li .secName:after, .cd-gallery li:after, .cd-gallery ul:after, article .pattern01 ul li .secName:after, article .pattern01 ul li:after {
        content: ""
    }

    .pattern02 ul li:first-child.icon-image:before {
        font-size: 40px;
        width: 50px;
        height: 50px;
        line-height: 1.25;
        right: auto;
        left: 1px
    }

    .listing {
        padding: 15px 10px
    }

    .article {
        padding: 10px
    }

    .breadcrumb {
        padding: 5px 12px
    }

        .breadcrumb li a {
            font-size: 14px
        }

            .breadcrumb li a:after {
                margin: 0 10px;
                font-size: 16px
            }

    article .imgDiv {
        width: 100%
    }

    article .articleHeader h2 {
        font-size: 24px
    }

    article .articleHeader .time {
        font-size: 14px
    }

    article .articleHeader .icon-time:before {
        font-size: 18px
    }

    article .articleHeader .time span:after {
        top: 6px;
        height: 14px
    }

    article .pattern01 .allItems {
        padding: 10px 0
    }

    article .pattern01 ul li {
        margin-left: 0;
        margin-bottom: 20px;
        padding-bottom: 0;
        width: 100%;
        height: auto;
        border-bottom: none;
        position: relative;
        overflow: visible
    }

        article .pattern01 ul li:after {
            width: 100%;
            height: 1px;
            background: #ddd;
            position: absolute;
            bottom: -10px;
            right: 0;
            display: block
        }

        .catPattern01 ul li:first-child:after, .catPattern01 ul li:last-child:after, article .nextLink a:after, article .pattern01 ul li:last-child:after {
            display: none
        }

        article .pattern01 ul li:last-child {
            border-bottom: none;
            padding-bottom: 0;
            margin-bottom: 0
        }

        article .pattern01 ul li .item .imageCntnr {
            width: 132px;
            padding-bottom: calc((132px * 75)/ 100);
            margin-left: 10px;
            float: right
        }

        article .pattern01 ul li .item img {
            width: 100%;
            height: 100%;
            float: right;
            border: 1px solid #ddd
        }

        article .pattern01 ul li:nth-last-child(-n+5) {
            margin-bottom: 20px
        }

        article .pattern01 ul li .desc {
            width: calc(100% - 142px);
            overflow: hidden;
            cursor: pointer;
            float: right
        }

            article .pattern01 ul li .desc p {
                color: #1d1d1d;
                width: 100%;
                height: 62px;
                overflow: hidden;
                text-align: right;
                line-height: 1.4;
                padding: 5px 0;
                font-size: 14px;
                font-family: DroidKufiLight,Arial;
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0
            }

        article .pattern01 ul li .item:hover .desc p {
            color: #888
        }

        article .pattern01 ul li .secName {
            font-family: DroidKufiLight,Arial;
            font-size: 14px;
            color: #888;
            position: absolute;
            bottom: 0;
            right: 142px
        }

            article .pattern01 ul li .secName:after {
                width: 4px;
                height: 14px;
                background: #aa120d;
                float: right;
                margin-left: 5px;
                margin-top: 4px
            }

            article .pattern01 ul li .secName:hover {
                color: #1d1d1d
            }

        article .pattern01 ul li.icon-image .desc p, article .pattern01 ul li.icon-video .desc p {
            padding: 5px 0 5px 10px
        }

        article .pattern01 ul li.icon-image .secName, article .pattern01 ul li.icon-video .secName {
            margin-right: 0
        }

    article .details iframe, article .details img {
        margin: 40px;
        width: 300px
    }

    article .pattern01 ul li.icon-image:before, article .pattern01 ul li.icon-video:before {
        right: 1px
    }

    article .pagination ul {
        width: 46px
    }

        article .pagination ul li {
            width: 100%
        }

        article .pagination ul:nth-child(2) {
            width: calc(100% - 100px)
        }

            article .pagination ul:nth-child(2) li {
                width: calc(100% / 5)
            }

        article .pagination ul li .dots, article .pagination ul li a, article .pagination ul li.nextPrev a {
            width: 100%
        }

    article .details img {
        height: auto
    }

    article .details iframe {
        height: 225px
    }

    .repeatDiv {
        width: 300px;
        margin-left: -150px;
        padding: 45px 0
    }

        .repeatDiv .nextAlbum h3 {
            font-size: 14px;
            margin-bottom: 0
        }

    .catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(4), .catPattern01 ul li:nth-child(5), .catPattern01 ul li:nth-last-child(-n+7) {
        margin-bottom: 20px
    }

    .catPattern01 {
        padding: 10px
    }

        .catPattern01 .allItems {
            padding: 10px 0
        }

        .catPattern01 ul li {
            margin-left: 0;
            width: 100%;
            margin-bottom: 20px;
            overflow: visible
        }

            .catPattern01 ul li:after {
                width: 100%;
                height: 1px;
                background: #ddd;
                position: absolute;
                bottom: -10px;
                right: 0
            }

            .catPattern01 ul li a .imageCntnr {
                position: relative;
                width: 132px;
                overflow: hidden;
                padding-bottom: calc((132px * 75)/ 100);
                float: right;
                margin-left: 10px
            }

            .catPattern01 ul li:first-child a .imageCntnr {
                width: 100%;
                padding-bottom: 75%
            }

            .catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(2), .catPattern01 ul li:nth-child(3) {
                width: 100%
            }

            .catPattern01 ul li:last-child, .catPattern01 ul li:nth-child(3), .catPattern01 ul li:nth-child(5) {
                margin-left: 0
            }

            .catPattern01 ul li:last-child {
                display: block;
                margin-bottom: 0
            }

    .catPattern02 ul li:first-child, .catPattern02 ul li:nth-child(4), .catPattern02 ul li:nth-child(5), .catPattern02 ul li:nth-last-child(-n+4) {
        margin-bottom: 20px
    }

    .catPattern01 ul li:nth-last-child(-n+7) .desc {
        width: calc(100% - 142px);
        height: auto;
        overflow: hidden;
        cursor: pointer;
        position: relative;
        bottom: 0;
        right: 0;
        background: 0 0
    }

        .catPattern01 ul li:nth-last-child(-n+7) .desc p {
            color: #1d1d1d;
            text-align: right;
            line-height: 1.6;
            height: 72px;
            padding: 5px 0;
            font-size: 14px;
            font-family: DroidKufiLight,Arial;
            position: relative;
            bottom: 0;
            right: 0
        }

    .catPattern01 ul li:nth-last-child(-n+7) .secName {
        padding: 0;
        position: absolute;
        top: auto;
        bottom: 5px;
        right: 142px;
        background: 0 0 !important;
        color: #888;
        font-size: 14px
    }

        .catPattern01 ul li:nth-last-child(-n+7) .secName:after {
            width: 4px;
            height: 14px;
            background: #aa120d;
            float: right;
            margin-left: 5px;
            margin-top: 6px;
            display: block
        }

    .catPattern01 ul li:nth-last-child(-n+7) .item:hover .desc p {
        color: #888
    }

    .catPattern01 ul li:nth-last-child(-n+7) .secName:hover {
        color: #1d1d1d
    }

    .catPattern01 ul li:nth-last-child(-n+7).icon-image, .catPattern01 ul li:nth-last-child(-n+7).icon-video {
        background: #1d1d1d
    }

        .catPattern01 ul li:nth-last-child(-n+7).icon-image:before, .catPattern01 ul li:nth-last-child(-n+7).icon-video:before {
            right: 1px;
            width: 40px;
            height: 40px;
            font-size: 30px
        }

        .catPattern01 ul li:nth-last-child(-n+7).icon-image .desc p, .catPattern01 ul li:nth-last-child(-n+7).icon-video .desc p {
            color: #fff;
            padding: 5px 0 5px 10px
        }

        .catPattern01 ul li:nth-last-child(-n+7).icon-image .item:hover .desc p, .catPattern01 ul li:nth-last-child(-n+7).icon-video .item:hover .desc p {
            color: #fff
        }

        .catPattern01 ul li:nth-last-child(-n+7).icon-image .secName, .catPattern01 ul li:nth-last-child(-n+7).icon-video .secName {
            margin-right: 0;
            color: #fff
        }

            .catPattern01 ul li:nth-last-child(-n+7).icon-image .secName:hover, .catPattern01 ul li:nth-last-child(-n+7).icon-video .secName:hover {
                color: #fff
            }

    .catPattern02 {
        padding: 10px
    }

        .catPattern02 .allItems {
            padding: 10px 0
        }

        .catPattern02 ul li {
            margin-left: 0;
            width: 100%;
            margin-bottom: 20px;
            overflow: visible
        }

            .catPattern02 ul li:after {
                width: 100%;
                height: 1px;
                background: #ddd;
                position: absolute;
                bottom: -10px;
                right: 0
            }

            .catPattern02 ul li:first-child:after, .catPattern02 ul li:last-child:after {
                display: none
            }

            .catPattern02 ul li a .imageCntnr {
                position: relative;
                width: 132px;
                overflow: hidden;
                padding-bottom: calc((132px * 75)/ 100);
                float: right;
                margin-left: 10px
            }

            .catPattern02 ul li:first-child a .imageCntnr {
                width: 100%;
                padding-bottom: 75%
            }

            .catPattern02 ul li:first-child, .catPattern02 ul li:nth-child(2), .catPattern02 ul li:nth-child(3) {
                width: 100%
            }

            .catPattern02 ul li:last-child, .catPattern02 ul li:nth-child(3), .catPattern02 ul li:nth-child(5) {
                margin-left: 0
            }

            .catPattern02 ul li:last-child {
                display: block;
                margin-bottom: 0
            }

    .catPattern03 ul li:first-child, .catPattern03 ul li:nth-child(4), .catPattern03 ul li:nth-child(5), .catPattern03 ul li:nth-last-child(-n+3) {
        margin-bottom: 20px
    }

    .catPattern02 ul li:nth-last-child(-n+4) .desc {
        width: calc(100% - 142px);
        height: auto;
        overflow: hidden;
        cursor: pointer;
        position: relative;
        bottom: 0;
        right: 0;
        background: 0 0
    }

        .catPattern02 ul li:nth-last-child(-n+4) .desc p {
            color: #1d1d1d;
            text-align: right;
            line-height: 1.6;
            height: 72px;
            padding: 5px 0;
            font-size: 14px;
            font-family: DroidKufiLight,Arial;
            position: relative;
            bottom: 0;
            right: 0
        }

    .catPattern02 ul li:nth-last-child(-n+4) .secName {
        padding: 0;
        position: absolute;
        top: auto;
        bottom: 5px;
        right: 142px;
        background: 0 0 !important;
        color: #888;
        font-size: 14px
    }

        .catPattern02 ul li:nth-last-child(-n+4) .secName:after {
            content: "";
            width: 4px;
            height: 14px;
            background: #aa120d;
            float: right;
            margin-left: 5px;
            margin-top: 6px;
            display: block
        }

    .catPattern02 ul li:nth-last-child(-n+4) .item:hover .desc p {
        color: #888
    }

    .catPattern02 ul li:nth-last-child(-n+4) .secName:hover {
        color: #1d1d1d
    }

    .catPattern02 ul li:nth-last-child(-n+4).icon-image, .catPattern02 ul li:nth-last-child(-n+4).icon-video {
        background: #1d1d1d
    }

        .catPattern02 ul li:nth-last-child(-n+4).icon-image:before, .catPattern02 ul li:nth-last-child(-n+4).icon-video:before {
            right: 1px;
            width: 40px;
            height: 40px;
            font-size: 30px
        }

        .catPattern02 ul li:nth-last-child(-n+4).icon-image .desc p, .catPattern02 ul li:nth-last-child(-n+4).icon-video .desc p {
            color: #fff;
            padding: 5px 0 5px 10px
        }

        .catPattern02 ul li:nth-last-child(-n+4).icon-image .item:hover .desc p, .catPattern02 ul li:nth-last-child(-n+4).icon-video .item:hover .desc p {
            color: #fff
        }

        .catPattern02 ul li:nth-last-child(-n+4).icon-image .secName, .catPattern02 ul li:nth-last-child(-n+4).icon-video .secName {
            margin-right: 0;
            color: #fff
        }

            .catPattern02 ul li:nth-last-child(-n+4).icon-image .secName:hover, .catPattern02 ul li:nth-last-child(-n+4).icon-video .secName:hover {
                color: #fff
            }

    .catPattern03 {
        padding: 10px
    }

        .catPattern03 .allItems {
            padding: 10px 0
        }

        .catPattern03 ul li {
            margin-left: 0;
            width: 100%;
            margin-bottom: 20px;
            overflow: visible
        }

            .catPattern03 ul li:after {
                width: 100%;
                height: 1px;
                background: #ddd;
                position: absolute;
                bottom: -10px;
                right: 0;
                display: block
            }

            .catPattern03 ul li:first-child:after, .catPattern03 ul li:last-child:after {
                display: none
            }

            .catPattern03 ul li a .imageCntnr {
                position: relative;
                width: 132px;
                overflow: hidden;
                padding-bottom: calc((132px * 75)/ 100);
                float: right;
                margin-left: 10px
            }

            .catPattern03 ul li:first-child a .imageCntnr {
                width: 100%;
                padding-bottom: 75%
            }

            .catPattern03 ul li:first-child, .catPattern03 ul li:nth-child(2), .catPattern03 ul li:nth-child(3) {
                width: 100%
            }

            .catPattern03 ul li:last-child, .catPattern03 ul li:nth-child(3), .catPattern03 ul li:nth-child(5) {
                margin-left: 0
            }

            .catPattern03 ul li:last-child {
                display: block;
                margin-bottom: 0
            }

            .catPattern03 ul li:nth-last-child(-n+3) .desc {
                width: calc(100% - 142px);
                height: auto;
                overflow: hidden;
                cursor: pointer;
                position: relative;
                bottom: 0;
                right: 0;
                background: 0 0
            }

                .catPattern03 ul li:nth-last-child(-n+3) .desc p {
                    color: #1d1d1d;
                    text-align: right;
                    line-height: 1.6;
                    height: 72px;
                    padding: 5px 0;
                    font-size: 14px;
                    font-family: DroidKufiLight,Arial;
                    position: relative;
                    bottom: 0;
                    right: 0
                }

            .catPattern03 ul li:nth-last-child(-n+3) .secName {
                padding: 0;
                position: absolute;
                top: auto;
                bottom: 5px;
                right: 142px;
                background: 0 0 !important;
                color: #888;
                font-size: 14px
            }

                .catPattern03 ul li:nth-last-child(-n+3) .secName:after {
                    width: 4px;
                    height: 14px;
                    background: #aa120d;
                    float: right;
                    margin-left: 5px;
                    margin-top: 6px;
                    display: block
                }

            .catPattern03 ul li:nth-last-child(-n+3) .item:hover .desc p {
                color: #888
            }

            .catPattern03 ul li:nth-last-child(-n+3) .secName:hover {
                color: #1d1d1d
            }

            .catPattern03 ul li:nth-last-child(-n+3).icon-image, .catPattern03 ul li:nth-last-child(-n+3).icon-video {
                background: #1d1d1d
            }

                .catPattern03 ul li:nth-last-child(-n+3).icon-image:before, .catPattern03 ul li:nth-last-child(-n+3).icon-video:before {
                    right: 1px
                }

                .catPattern03 ul li:nth-last-child(-n+3).icon-image .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-video .desc p {
                    color: #fff;
                    padding: 5px 0 5px 10px
                }

                .catPattern03 ul li:nth-last-child(-n+3).icon-image .item:hover .desc p, .catPattern03 ul li:nth-last-child(-n+3).icon-video .item:hover .desc p {
                    color: #fff
                }

                .catPattern03 ul li:nth-last-child(-n+3).icon-image .secName, .catPattern03 ul li:nth-last-child(-n+3).icon-video .secName {
                    margin-right: 0;
                    color: #fff
                }

                    .catPattern03 ul li:nth-last-child(-n+3).icon-image .secName:hover, .catPattern03 ul li:nth-last-child(-n+3).icon-video .secName:hover {
                        color: #fff
                    }

    .searchResult {
        padding: 15px 10px
    }

    .filterMainContent.is-fixed .cd-gallery {
        padding-top: 76px
    }

    .cd-gallery ul:after {
        display: table;
        clear: both
    }

    .cd-gallery .allItems {
        padding: 10px 0 0
    }

    .cd-gallery li {
        margin-left: 0;
        margin-bottom: 20px;
        padding-bottom: 0;
        width: 100%;
        height: auto;
        border-bottom: none;
        position: relative;
        overflow: visible;
        display: inline-block
    }

        .cd-gallery li.gap, .cd-gallery li:nth-last-child(-n+4):after {
            display: none
        }

        .cd-gallery li:after {
            width: 100%;
            height: 1px;
            background: #ddd;
            position: absolute;
            bottom: -10px;
            right: 0
        }

        .cd-gallery li:nth-last-child(-n+4) {
            border-bottom: none;
            padding-bottom: 0;
            margin-bottom: 0
        }

        .cd-gallery li .item .imageCntnr {
            width: 132px;
            padding-bottom: calc((132px * 75)/ 100);
            margin-left: 10px;
            float: right
        }

        .cd-gallery li .item img {
            width: 100%;
            height: 100%;
            float: right;
            border: 1px solid #ddd
        }

        .cd-gallery li:last-child {
            margin-bottom: 0
        }

        .cd-gallery li .desc {
            width: calc(100% - 142px);
            overflow: hidden;
            cursor: pointer
        }

            .cd-gallery li .desc p {
                color: #1d1d1d;
                width: 100%;
                height: 46px;
                overflow: hidden;
                text-align: right;
                line-height: 1.6;
                padding: 5px 0;
                font-size: 14px;
                font-family: DroidKufiLight,Arial;
                transition: all .2s ease-in-out 0;
                -webkit-transition: all .2s ease-in-out 0;
                -moz-transition: all .2s ease-in-out 0;
                -o-transition: all .2s ease-in-out 0;
                -ms-transition: all .2s ease-in-out 0
            }

        .cd-gallery li .item:hover .desc p {
            color: #888
        }

        .cd-gallery li .secName {
            font-family: DroidKufiLight,Arial;
            font-size: 12px;
            color: #888;
            position: relative;
            margin-top: 4px
        }

            .cd-gallery li .secName:after {
                width: 4px;
                height: 10px;
                background: #aa120d;
                float: right;
                margin-left: 5px;
                margin-top: 5px
            }

            .cd-gallery li .secName:hover {
                color: #1d1d1d
            }

        .cd-gallery li .time {
            width: auto;
            float: right;
            margin: 0;
            font-size: 12px;
            position: absolute;
            right: 142px;
            bottom: 0
        }

    .surveyDiv .allQues .chooseAnswer .ok, .surveyDiv .resultDiv .surveyCompleted .ok {
        bottom: 12px
    }

    .cd-gallery li .icon-time:before {
        font-size: 14px
    }

    .cd-gallery li.icon-image .desc p, .cd-gallery li.icon-video .desc p {
        padding: 5px 0 5px 10px
    }

    .cd-gallery li.icon-image .secName, .cd-gallery li.icon-video .secName {
        margin-right: 0
    }

    .cd-gallery li.icon-image .time, .cd-gallery li.icon-video .time {
        margin: 0
    }

    .cd-gallery li.icon-image:before, .cd-gallery li.icon-video:before {
        right: 1px
    }

    .author .cd-gallery li, .authorsListing .cd-gallery li {
        width: 100%
    }

    .searchResult h2 {
        font-size: 20px;
        margin-bottom: 15px
    }

    .searchResult form {
        padding: 12px
    }

        .datepicker-form .icon-date, .searchResult form .morphsearch-submit {
            top: 24px;
            left: 24px
        }

    .filterMainContent h3 {
        width: 100px
    }

    .cd-tab-filter-wrapper {
        width: calc(100% - 100px)
    }

    .sportsContainer .allMatches .slide {
        width: 160%
    }

    .sportsContainer .allMatches .item {
        width: calc(100% / 3)
    }

        .sportsContainer .allMatches .item .tourName {
            margin-bottom: 24px
        }

        .sportsContainer .allMatches .item .teamA {
            width: 80px;
            height: 70px
        }

            .sportsContainer .allMatches .item .teamA img, .sportsContainer .allMatches .item .teamB img {
                height: 42px
            }

            .sportsContainer .allMatches .item .teamA p, .sportsContainer .allMatches .item .teamB p {
                padding-top: 10px;
                font-size: 12px
            }

        .sportsContainer .allMatches .item .result {
            width: calc(100% - 160px);
            font-size: 32px
        }

            .sportsContainer .allMatches .item .result.yesterday {
                padding-top: 12px
            }

        .sportsContainer .allMatches .item .teamB {
            float: right;
            width: 80px;
            height: 70px
        }

        .sportsContainer .allMatches .item .result span {
            font-size: 16px !important
        }

            .sportsContainer .allMatches .item .result span.now {
                font-size: 14px !important;
                line-height: 1.6
            }

        .sportsContainer .allMatches .item .status a {
            font-size: 12px
        }

    .sportsContainer .allMatches .status span {
        margin-top: 26px
    }

    .sportsContainer .allMatches .matchResult {
        font-size: 32px;
        margin-top: 0
    }

    .matchesSchedule .allMatches h2 {
        font-size: 18px
    }

    .matchesSchedule .allMatches .dropDownDiv {
        padding: 12px
    }

    .matchesSchedule .table {
        padding: 15px 10px
    }

        .matchesSchedule .table .allMatches .tabs-nav li > a {
            padding: 0 16px;
            font-size: 14px
        }

        .matchesSchedule .table .allMatches .item .time {
            line-height: 4;
            width: 60px;
            font-size: 16px;
            text-align: right;
            position: relative;
            display: inline-block;
            height: 70px
        }

        .matchesSchedule .table .allMatches .item .channel, .overflow-hidden .morphSearchDiv, .prayerTimes .monthTable .prayersTable .allTimes .time span, .surveyDiv .timeLineDiv ul {
            display: none
        }

        .matchesSchedule .table .allMatches .item .time span {
            margin-top: -8px;
            position: absolute;
            top: 50%;
            right: 0
        }

            .matchesSchedule .table .allMatches .item .time span.now {
                margin: -13px 0 0 !important;
                position: absolute;
                top: 50%;
                right: 0
            }

        .matchesSchedule .table .allMatches .item .teamA, .matchesSchedule .table .allMatches .item .teamB {
            text-align: center;
            width: calc((100% - 150px)/ 2);
            height: auto
        }

            .matchesSchedule .table .allMatches .item .teamA img {
                float: none;
                margin-right: 0
            }

            .matchesSchedule .table .allMatches .item .teamB img {
                float: none;
                margin-left: 0
            }

            .matchesSchedule .table .allMatches .item .teamA p, .matchesSchedule .table .allMatches .item .teamB p {
                float: none;
                text-align: center;
                line-height: 1.6;
                margin-top: 5px;
                height: auto;
                overflow: hidden
            }

        .matchesSchedule .table .allMatches .item .match {
            height: auto
        }

        .matchesSchedule .table .allMatches .item .result {
            width: 90px;
            margin-top: 20px
        }

            .matchesSchedule .table .allMatches .item .result .matchResult {
                margin-top: 0;
                font-size: 32px
            }

    .matchesSchedule .listing {
        padding: 24px 10px
    }

    .prayerTimes .main {
        padding: 10px
    }

        .prayerTimes .main .location, .prayerTimes .main .ttl {
            margin-bottom: 12px
        }

        .prayerTimes .main .cityDate .cityName, .prayerTimes .main .cityDate .cityName:after, .prayerTimes .main .cityDate .countryName {
            font-size: 24px
        }

        .prayerTimes .main .dropDownDiv {
            width: 100%;
            margin-bottom: 24px
        }

        .prayerTimes .main .cityDate {
            width: 100%;
            margin-left: 0
        }

    .prayerTimes .cntdwn {
        width: 100%;
        margin: 0 0 24px
    }

    .prayerTimes .mainTable .prayersTable {
        width: 100%
    }

        .prayerTimes .mainTable .prayersTable .title .name {
            font-size: 12px
        }

        .prayerTimes .mainTable .prayersTable .allTimes .time {
            font-size: 16px
        }

            .prayerTimes .mainTable .prayersTable .allTimes .time span {
                font-size: 14px
            }

    .prayerTimes .monthTable .prayersTable .title .name:first-child {
        width: 110px
    }

    .prayerTimes .monthTable .prayersTable .title .name {
        width: calc((100% - 110px)/ 6);
        font-size: 10px
    }

    .prayerTimes .monthTable .prayersTable .allTimes .time:first-child {
        width: 110px
    }

    .prayerTimes .monthTable .prayersTable .allTimes .time {
        width: calc((100% - 110px)/ 6);
        font-size: 11px
    }

    .weatherDiv .main {
        padding: 24px 10px
    }

        .weatherDiv .main .location, .weatherDiv .main .ttl {
            margin-bottom: 12px
        }

        .weatherDiv .main .cityDate .cityName, .weatherDiv .main .cityDate .cityName:after, .weatherDiv .main .cityDate .countryName {
            font-size: 24px
        }

        .weatherDiv .main .dropDownDiv {
            width: 100%;
            margin-bottom: 24px
        }

        .weatherDiv .main .cityDate {
            width: 100%;
            margin-left: 0
        }

    .weatherDiv .cntdwn {
        width: 100%;
        margin: 0 0 24px
    }

    .weatherDiv .mainTable .weatherTable {
        width: 100%
    }

        .weatherDiv .mainTable .weatherTable .title .name {
            font-size: 12px
        }

        .weatherDiv .mainTable .weatherTable .allTimes .time {
            font-size: 16px
        }

            .weatherDiv .mainTable .weatherTable .allTimes .time span {
                font-size: 14px
            }

    .weatherDiv .main .weatherIconCnts {
        margin-left: 30px
    }

    .weatherDiv .temp .icon-high {
        font-size: 48px;
        margin-left: 24px;
        margin-top: 30px
    }

    .weatherDiv .temp .icon-low {
        font-size: 36px;
        margin-top: 40px
    }

    .currGoldDiv .main h3 {
        font-size: 16px;
        margin: 12px 0
    }

    .currGoldDiv .goldDiv .goldProvider {
        margin: 12px
    }

    .contactUsDiv .contactUsCnts, .masrawyServicesDiv .services, .newsPointerDiv .newsPointer, .zakahDiv .zakahCnts {
        padding: 15px 10px
    }

        .masrawyServicesDiv .services h3 {
            padding: 12px;
            font-size: 16px
        }

    .surveyDiv .questionsDiv .ttl h2, .surveyDiv .resultDiv .ttl h2 {
        font-size: 18px
    }

    .masrawyServicesDiv .services .servicesCnts .item {
        min-width: 300px;
        width: 100%;
        margin: 0 0 24px
    }

        .masrawyServicesDiv .services .servicesCnts .item p {
            height: auto
        }

    .innerListingContainer, .policyDiv .policy, .pollListingDiv .pollListing {
        padding: 15px 10px
    }

    .author .cd-tab-filter-wrapper, .authorsListing .cd-tab-filter-wrapper {
        padding: 12px
    }

    .author .authorData img {
        margin: 0
    }

    .author .authorData .data {
        width: 100%;
        margin-right: 0;
        margin-top: 24px
    }

    .author .cd-gallery li .desc {
        width: 100%
    }

    .author .cd-gallery li.icon-image .desc p, .author .cd-gallery li.icon-video .desc p {
        padding: 5px 0 5px 30px
    }

    .surveyDiv .questionsDiv, .surveyDiv .resultDiv {
        padding: 15px 10px
    }

    .AuthorsListing .cd-tab-filter-wrapper {
        margin: 0
    }

    article .authorDtls {
        margin-bottom: 0
    }

        article .authorDtls .imageCntnr {
            margin: 0
        }

        article .authorDtls .articleHeader {
            width: 100%;
            margin-right: 0;
            margin-top: 24px
        }

            article .authorDtls .articleHeader .time {
                width: 100%;
                right: 0;
                position: relative;
                margin-top: 12px
            }

    .author .authorData .data .name {
        margin-bottom: 12px
    }

    article .details .leaderboardDiv {
        width: 300px;
        height: 266px;
        margin: 24px
    }

        article .details .leaderboardDiv .adTtl {
            text-align: center !important;
            margin: 0;
            width: 300px;
            height: 16px
        }

    .mobile.seatNumber .errorMsg, .mobile.seatNumber .labelDiv label {
        direction: rtl;
        text-align: right;
        font-family: DroidKufiLight,Arial;
        float: right
    }

    article .details .leaderboardDiv .leaderboard {
        width: 300px;
        height: 250px
    }

    article .details .leaderboardDiv iframe {
        margin: 0;
        height: 250px;
        width: 300px
    }

    .articleDiv .topLBArticle .leaderboardDiv {
        margin: 24px auto
    }

    #cd-lateral-nav .scroll {
        mix-blend-mode: normal;
        background: 0 0;
        width: 100%
    }

    .scrollContainer {
        background: 0 0
    }

    .surveyDiv .allQues h4 {
        margin: 24px 0;
        font-size: 18px
    }

    .surveyDiv .allQues .answersDiv .answerItem, .surveyDiv .resultDiv .grid li {
        width: 100%;
        margin-left: 0
    }

    .surveyDiv .resultDiv .slideshow, .surveyDiv .resultDiv .slideshow figure {
        overflow: auto
    }

    .surveyDiv .questionsDiv .cd-popup-container {
        width: 300px;
        padding: 12px;
        height: 150px;
        margin: -75px auto
    }

        .surveyDiv .questionsDiv .cd-popup-container p {
            margin-top: 20px;
            font-size: 16px
        }

        .surveyDiv .questionsDiv .cd-popup-container .cd-popup-close {
            width: 24px;
            height: 24px
        }

    .surveyDiv .resultDiv .cd-popup-container {
        width: 300px;
        padding: 12px;
        height: 150px;
        margin: -75px auto
    }

    .surveyDiv .resultDiv .surveyCompleted p {
        margin-top: 20px;
        font-size: 16px
    }

    .surveyDiv .resultDiv .cd-popup-container .cd-popup-close {
        width: 24px;
        height: 24px
    }

    .mobile.seatNumber {
        display: inline-block;
        width: 300px;
        margin: 0;
        background: #1d1d1d;
        padding: 10px;
        position: relative;
        height: 300px
    }

        .mobile.seatNumber .ttl {
            border-bottom: 1px solid #fff
        }

            .mobile.seatNumber .ttl h2 {
                color: #fff
            }

                .mobile.seatNumber .ttl h2:after {
                    background: #fff
                }

        .mobile.seatNumber .labelDiv {
            float: right;
            width: 100%;
            margin-top: 12px
        }

            .mobile.seatNumber .labelDiv label {
                font-size: 16px;
                color: #fff;
                margin-bottom: 5px
            }

            .mobile.seatNumber .labelDiv span {
                color: #e63b34;
                float: right;
                margin-right: 2px;
                line-height: 1.5
            }

        .mobile.seatNumber input {
            width: 100%;
            height: 40px !important;
            border: 1px solid #ddd;
            float: right;
            outline: 0;
            padding: 12px;
            font-family: DroidKufiLight,Arial;
            color: #888;
            font-size: 14px
        }

        .mobile.seatNumber .errorMsg {
            position: relative;
            right: 0;
            display: inline-block;
            font-size: 12px;
            color: #aaa;
            visibility: hidden;
            margin-top: 5px
        }

        .mobile.seatNumber a {
            display: inline-block;
            width: 132px;
            font-family: DroidKufiLight,Arial;
            background: #e63b34;
            color: #fff;
            font-size: 16px;
            text-align: center;
            padding: 5px 0;
            margin: 5px
        }

            .mobile.seatNumber a:hover {
                background: #aa120d
            }

        .mobile.seatNumber .thanawyaSponsor {
            display: inline-block;
            width: 100%;
            background: #000;
            position: absolute;
            left: 0;
            bottom: 0;
            z-index: 1
        }

            .mobile.seatNumber .thanawyaSponsor .cnts {
                display: inline-block;
                width: 166px;
                margin: 0;
                float: right;
                padding: 8px 0
            }

                .mobile.seatNumber .thanawyaSponsor .cnts .spnsr {
                    float: right;
                    margin-left: 24px;
                    margin-top: 4px;
                    font-family: DroidKufiLight,Arial;
                    color: #fff;
                    font-size: 14px
                }

                .mobile.seatNumber .thanawyaSponsor .cnts a {
                    float: right;
                    width: auto;
                    background: 0 0;
                    color: none;
                    padding: 0;
                    margin: 0
                }

                .mobile.seatNumber .thanawyaSponsor .cnts img {
                    width: auto;
                    height: 27px;
                    border: none;
                    margin: 0
                }

    .rssDiv .rssCnts {
        padding: 15px 10px
    }
}

.news .ttl, .pattern02.news .ttl, article.news .ttl {
    border-bottom: 1px solid #aa120d
}

@media screen and (max-width:767px) and (orientation:landscape) {
    .sportsContainer .allMatches .slide {
        width: 160%
    }

        .sportsContainer .allMatches .slide .noMatches {
            width: calc((100% / 2) + 108px)
        }

    .masrawyServices ul {
        width: 100%
    }

    .cd-gallery li .secName {
        font-family: DroidKufiLight,Arial;
        font-size: 12px;
        color: #888;
        position: absolute;
        bottom: 0;
        right: 142px
    }

        .cd-gallery li .secName:after {
            content: "";
            width: 4px;
            height: 10px;
            background: #aa120d;
            float: right;
            margin-left: 5px;
            margin-top: 5px
        }

        .cd-gallery li .secName:hover {
            color: #1d1d1d
        }

    .cd-gallery li .time {
        width: auto;
        float: left;
        margin: 0;
        font-size: 12px;
        position: absolute;
        right: auto;
        left: 10px;
        bottom: 5px
    }

    .cd-gallery li .icon-time:before {
        font-size: 14px
    }

    .openSearch .morphsearch.open .morphsearch-content {
        height: 160px
    }
}

.news .breadcrumb li.active a, article.news .details p a, article.news .nextLink a {
    color: #aa120d
}

@media screen and (max-width:767px) and (orientation:portrait) {
    .currGoldDiv .currencyDiv .currGoldTable .currGoldDtls .item:nth-child(2), .currGoldDiv .currencyDiv .currGoldTable .title .name:nth-child(2) {
        display: none
    }

    .contactUsDiv .contactForms .forms .item .errorMsg, .zakahDiv .zakahForms .forms .item .errorMsg {
        right: auto;
        left: 0;
        top: 0
    }

    .sportsContainer .allMatches .slide {
        width: 272%
    }

        .sportsContainer .allMatches .slide .noMatches {
            width: calc((100% / 3) + 36px)
        }

    .matchesSchedule .allMatches .item {
        width: 100%
    }

        .matchesSchedule .allMatches .item .tourName {
            margin-bottom: 24px
        }

        .matchesSchedule .allMatches .item .teamA {
            width: 80px;
            height: 70px
        }

            .matchesSchedule .allMatches .item .teamA img, .matchesSchedule .allMatches .item .teamB img {
                height: 42px
            }

            .matchesSchedule .allMatches .item .teamA p, .matchesSchedule .allMatches .item .teamB p {
                padding-top: 10px;
                font-size: 12px
            }

        .matchesSchedule .allMatches .item .result {
            width: calc(100% - 160px);
            font-size: 32px
        }

            .matchesSchedule .allMatches .item .result.yesterday {
                padding-top: 12px
            }

        .matchesSchedule .allMatches .item .teamB {
            float: right;
            width: 80px;
            height: 70px
        }

        .matchesSchedule .allMatches .item .result span {
            font-size: 14px !important
        }

        .matchesSchedule .allMatches .item .status a {
            font-size: 12px
        }

    .matchesSchedule .allMatches .status span {
        margin-top: 26px
    }

    .matchesSchedule .allMatches .matchResult {
        font-size: 32px;
        margin-top: 0
    }

    .caricature li {
        width: calc((100% - 24px)/ 2);
        max-width: none;
        margin-left: 24px;
        margin-bottom: 12px
    }

        .caricature li:nth-child(2n) {
            margin-left: 0
        }

        .caricature li:nth-last-child(-n+2) {
            margin-bottom: 0
        }

    .contactUsDiv .contactForms .forms .item, .zakahDiv .zakahForms .forms .item {
        margin-bottom: 24px
    }

    .poll {
        padding: 10px;
        width: 100%;
        height: auto
    }

    .masrawyServices ul {
        width: 200%
    }

    .table .allMatches .tabs-nav li > a {
        padding: 0 16px
    }

    .contactUsDiv .contactAds h3, .contactUsDiv .contactForms h3, .zakahDiv .zakahForms h3, .zakahDiv .zakahForms h4 {
        padding: 12px
    }

    .weatherDiv .weatherTable .allTimes .dayTemp, .weatherDiv .weatherTable .title .name {
        width: calc(100% / 3)
    }

    .weatherDiv .dayTempDtls .icon-high {
        font-size: 28px;
        margin-left: 16px
    }

        .weatherDiv .dayTempDtls .icon-high:before {
            font-size: 12px
        }

    .weatherDiv .dayTempDtls .icon-low {
        font-size: 20px
    }

        .weatherDiv .dayTempDtls .icon-low:before {
            font-size: 8px
        }

    .currGoldDiv .currencyDiv .currGoldTable .title .name {
        font-size: 14px;
        width: calc((100% - 150px)/ 2)
    }

        .currGoldDiv .currencyDiv .currGoldTable .title .name:first-child {
            width: 150px
        }

    .currGoldDiv .currencyDiv .currGoldTable .currGoldDtls .item {
        font-size: 14px;
        width: calc((100% - 150px)/ 2)
    }

        .currGoldDiv .currencyDiv .currGoldTable .currGoldDtls .item:first-child {
            width: 150px
        }

    .currGoldDiv .goldDiv .currGoldTable .currGoldDtls .item:nth-child(2), .currGoldDiv .goldDiv .currGoldTable .title .name:nth-child(2) {
        display: block
    }

    .contactUsDiv .contactForms .forms .item .labelDiv {
        width: 100%
    }

    .contactUsDiv .contactForms .forms .item input, .contactUsDiv .contactForms .forms .item textarea, .contactUsDiv .contactForms .forms .wrapper-demo {
        width: 100% !important
    }

    .contactUsDiv .contactAds .ads .item {
        width: 100%;
        margin-left: 0
    }

    .zakahDiv .zakahForms .forms .item .labelDiv {
        width: 100%
    }

    .zakahDiv .zakahForms .forms .item input, .zakahDiv .zakahForms .forms .item textarea, .zakahDiv .zakahForms .forms .wrapper-demo {
        width: 100% !important
    }

    header.lateral-menu-is-open #cd-menu-trigger {
        -webkit-transform: translateX(-260px);
        -moz-transform: translateX(-260px);
        -ms-transform: translateX(-260px);
        -o-transform: translateX(-260px);
        transform: translateX(-260px)
    }

    #cd-lateral-nav {
        width: 260px;
        -webkit-transform: translateX(260px);
        -moz-transform: translateX(260px);
        -ms-transform: translateX(260px);
        -o-transform: translateX(260px);
        transform: translateX(260px)
    }

    .scrollContainer {
        width: 260px
    }

        .scrollContainer .scroll {
            width: 250px;
            margin: 0
        }

    #cd-lateral-nav .socialDiv {
        width: 248px;
        margin: 0
    }

        #cd-lateral-nav .socialDiv a {
            margin-left: 10px
        }

    .surveyDiv .resultDiv .slideshow li .answersDiv .answerItem {
        width: 100%
    }
}

.featuredArea ul li .secName.news {
    background: #aa120d
}

.featuredArea ul li:first-child .secName.news {
    background: #aa120d !important
}

.akhbarThemak li .secName.news:before, .featuredArea ul li .secName.news:before, .media ul li .secName.news, .mostRead .allItems li .secName.news:after, .news .mostRead .allItems li .number, .news .ttl h2:after, .pattern01 ul li .secName.news:after, .pattern02.news .ttl h2:after, .pattern02.news ul li .secName, .pattern02.news ul li:nth-last-child(-n+3) .secName:after, article.news .details p a:before, article.news .nextLink a:after, article.news .ttl h2:after {
    background: #aa120d
}

.pattern02.sports .ttl, .sports .ttl, article.sports .ttl {
    border-bottom: 1px solid #006829
}

.sports .breadcrumb li.active a, article.sports .details p a, article.sports .nextLink a {
    color: #006829
}

@media screen and (min-width:769px) and (max-width:1152px) {
    .pattern02.news ul li:nth-last-child(-n+3) .secName {
        background: #aa120d !important
    }
}

@media screen and (min-width:320px) and (max-width:767px) {
    .featuredArea ul li:nth-last-child(-n+5) .secName.news:after, .pattern02.news ul li:nth-last-child(-n+5) .secName:after {
        background: #aa120d
    }
}

.cd-gallery li.news .secName:after {
    background: #aa120d
}

.featuredArea ul li .secName.sports {
    background: #006829
}

.featuredArea ul li:first-child .secName.sports {
    background: #006829 !important
}

.akhbarThemak li .secName.sports:before, .featuredArea ul li .secName.sports:before, .media ul li .secName.sports, .mostRead .allItems li .secName.sports:after, .pattern01 ul li .secName.sports:after, .pattern02.sports .ttl h2:after, .pattern02.sports ul li .secName, .pattern02.sports ul li:nth-last-child(-n+3) .secName:after, .sports .mostRead .allItems li .number, .sports .ttl h2:after, article.sports .details p a:before, article.sports .nextLink a:after, article.sports .ttl h2:after {
    background: #006829
}

.arts .ttl, .pattern02.arts .ttl, .pattern02.ramadan .ttl, article.arts .ttl {
    border-bottom: 1px solid #c15709
}

.arts .breadcrumb li.active a, article.arts .details p a, article.arts .nextLink a {
    color: #c15709
}

@media screen and (min-width:769px) and (max-width:1152px) {
    .pattern02.sports ul li:nth-last-child(-n+3) .secName {
        background: #006829 !important
    }
}

@media screen and (min-width:320px) and (max-width:767px) {
    .featuredArea ul li:nth-last-child(-n+5) .secName.sports:after, .pattern02.sports ul li:nth-last-child(-n+5) .secName:after {
        background: #006829
    }
}

.cd-gallery li.sports .secName:after {
    background: #006829
}

.featuredArea ul li .secName.arts {
    background: #c15709
}

.featuredArea ul li:first-child .secName.arts {
    background: #c15709 !important
}

.akhbarThemak li .secName.arts:before, .arts .mostRead .allItems li .number, .arts .ttl h2:after, .featuredArea ul li .secName.arts:before, .media ul li .secName.arts, .mostRead .allItems li .secName.arts:after, .pattern01 ul li .secName.arts:after, .pattern02.arts .ttl h2:after, .pattern02.arts ul li .secName, .pattern02.arts ul li:nth-last-child(-n+3) .secName:after, .pattern02.ramadan .ttl h2:after, .pattern02.ramadan ul li .secName, .pattern02.ramadan ul li:nth-last-child(-n+3) .secName:after, article.arts .details p a:before, article.arts .nextLink a:after, article.arts .ttl h2:after {
    background: #c15709
}

.howa_w_hya .ttl, .pattern02.howa_w_hya .ttl, article.howa_w_hya .ttl {
    border-bottom: 1px solid #9224a5
}

.howa_w_hya .breadcrumb li.active a, article.howa_w_hya .details p a, article.howa_w_hya .nextLink a {
    color: #9224a5
}

@media screen and (min-width:769px) and (max-width:1152px) {
    .pattern02.arts ul li:nth-last-child(-n+3) .secName, .pattern02.ramadan ul li:nth-last-child(-n+3) .secName {
        background: #c15709 !important
    }
}

@media screen and (min-width:320px) and (max-width:767px) {
    .featuredArea ul li:nth-last-child(-n+5) .secName.arts:after, .pattern02.arts ul li:nth-last-child(-n+5) .secName:after, .pattern02.ramadan ul li:nth-last-child(-n+5) .secName:after {
        background: #c15709
    }
}

.cd-gallery li.arts .secName:after {
    background: #c15709
}

.featuredArea ul li .secName.howa_w_hya {
    background: #9224a5
}

.featuredArea ul li:first-child .secName.howa_w_hya {
    background: #9224a5 !important
}

.akhbarThemak li .secName.howa_w_hya:before, .featuredArea ul li .secName.howa_w_hya:before, .howa_w_hya .mostRead .allItems li .number, .howa_w_hya .ttl h2:after, .media ul li .secName.howa_w_hya, .mostRead .allItems li .secName.howa_w_hya:after, .pattern01 ul li .secName.howa_w_hya:after, .pattern02.howa_w_hya .ttl h2:after, .pattern02.howa_w_hya ul li .secName, .pattern02.howa_w_hya ul li:nth-last-child(-n+3) .secName:after, article.howa_w_hya .details p a:before, article.howa_w_hya .nextLink a:after, article.howa_w_hya .ttl h2:after {
    background: #9224a5
}

.autos .ttl, .pattern02.autos .ttl, article.autos .ttl {
    border-bottom: 1px solid #1877b6
}

.autos .breadcrumb li.active a, article.autos .details p a, article.autos .nextLink a {
    color: #1877b6
}

@media screen and (min-width:769px) and (max-width:1152px) {
    .pattern02.howa_w_hya ul li:nth-last-child(-n+3) .secName {
        background: #9224a5 !important
    }
}

@media screen and (min-width:320px) and (max-width:767px) {
    .featuredArea ul li:nth-last-child(-n+5) .secName.howa_w_hya:after, .pattern02.howa_w_hya ul li:nth-last-child(-n+5) .secName:after {
        background: #9224a5
    }
}

.cd-gallery li.howa_w_hya .secName:after {
    background: #9224a5
}

.featuredArea ul li .secName.autos {
    background: #1877b6
}

.featuredArea ul li:first-child .secName.autos {
    background: #1877b6 !important
}

.akhbarThemak li .secName.autos:before, .autos .mostRead .allItems li .number, .autos .ttl h2:after, .featuredArea ul li .secName.autos:before, .media ul li .secName.autos, .mostRead .allItems li .secName.autos:after, .pattern01 ul li .secName.autos:after, .pattern02.autos .ttl h2:after, .pattern02.autos ul li .secName, .pattern02.autos ul li:nth-last-child(-n+3) .secName:after, article.autos .details p a:before, article.autos .nextLink a:after, article.autos .ttl h2:after {
    background: #1877b6
}

.islameyat .ttl, .pattern02.islameyat .ttl, article.islameyat .ttl {
    border-bottom: 1px solid #119e9e
}

.islameyat .breadcrumb li.active a, article.islameyat .details p a, article.islameyat .nextLink a {
    color: #119e9e
}

@media screen and (min-width:769px) and (max-width:1152px) {
    .pattern02.autos ul li:nth-last-child(-n+3) .secName {
        background: #1877b6 !important
    }
}

@media screen and (min-width:320px) and (max-width:767px) {
    .featuredArea ul li:nth-last-child(-n+5) .secName.autos:after, .pattern02.autos ul li:nth-last-child(-n+5) .secName:after {
        background: #1877b6
    }
}

.cd-gallery li.autos .secName:after {
    background: #1877b6
}

.featuredArea ul li .secName.islameyat {
    background: #119e9e
}

.featuredArea ul li:first-child .secName.islameyat {
    background: #119e9e !important
}

.akhbarThemak li .secName.islameyat:before, .featuredArea ul li .secName.islameyat:before, .islameyat .mostRead .allItems li .number, .islameyat .ttl h2:after, .media ul li .secName.islameyat, .mostRead .allItems li .secName.islameyat:after, .pattern01 ul li .secName.islameyat:after, .pattern02.islameyat .ttl h2:after, .pattern02.islameyat ul li .secName, .pattern02.islameyat ul li:nth-last-child(-n+3) .secName:after, article.islameyat .details p a:before, article.islameyat .nextLink a:after, article.islameyat .ttl h2:after {
    background: #119e9e
}

@media screen and (min-width:769px) and (max-width:1152px) {
    .pattern02.islameyat ul li:nth-last-child(-n+3) .secName {
        background: #119e9e !important
    }
}

@media screen and (min-width:320px) and (max-width:767px) {
    .featuredArea ul li:nth-last-child(-n+5) .secName.islameyat:after, .pattern02.islameyat ul li:nth-last-child(-n+5) .secName:after {
        background: #119e9e
    }
}

.cd-gallery li.islameyat .secName:after {
    background: #119e9e
}

#cd-lateral-nav {
    z-index: 999999
}

.is-hidden {
    text-align: right
}
.leaderboard {
    display: block;
    height: 90px;
    width: 728px;
    margin: 0 calc((100% - 728px) / 2)
}

.showcase {
    display: none;
    height: 250px;
    width: 300px;
    margin: 0 calc((100% - 300px) / 2)
}

@media screen and (min-width:320px) and (max-width:767px) {
    .leaderboard {
        display: none
    }

    .showcase {
        display: block
    }
}