﻿/*feeling ramadan*/
.ramadan p.text{display:inline-block;float:right;text-align:right;color:#000;font-size:18px;margin:30px 0 5px 0 }

.boxListing{  padding: 0;margin: 0;list-style: none;-ms-box-orient: horizontal;display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -moz-flex;display: -webkit-flex;display: flex;flex-wrap:wrap;}
.boxListing .ItemListing{ -webkit-flex-wrap: wrap;flex-wrap: wrap;padding: 0;width: 217px;height: 64px;margin: 0 0 20px 20px;position:relative;cursor:pointer;overflow:hidden;transition: all .2s ease-in-out; }

.boxListing .ItemListing:before{content:'';position:absolute;width:100%;height:100%;background:rgba(0,0,0,.45);top:0;right:0;z-index:1}
.boxListing .ItemListing:last-child{margin:0}
.boxListing .ItemListing:nth-child(4n){margin:0 0 20px 0}
.boxListing .ItemListing a{position:absolute;width:100%;height:100%;top:0;right:0}
.boxListing .ItemListing img{position: absolute;width: 100%;height: auto;background: #330D46;top: 50%;left: 0;transform: translateY(-50%);right: 0;}
.boxListing .ItemListing p{position:absolute;font-family:DroidKufiLight, Arial;font-size:18px;width:100%;height:100%;color:#fff;text-align:center;z-index:2;left:0;top:0;line-height:114px}
.boxListing .ItemListing:hover{transform: scale(1.1); }
.sofra .innerListingContainer{margin-top:40px}

.feeling p.text{font-family:DroidKufiBold, Arial;font-size:24px;text-align:center;float:none;margin:20px 0 10px 0}
.feeling .ItemListing p{color:#000}
.feeling .ItemListing:before{display:none}
.feeling  .ItemListing a{display:inline-block;position:relative;width:100%;height:100%;transition: all .2s ease-in-out;}
.feeling  .ItemListing{transition:none;overflow:visible}
.feeling .ItemListing:hover{transform: none; }
.feeling .ItemListing a:hover{transform: scale(1.1); }
.feeling .ItemListing p{height:auto;top:50%;left:50%;transform:translate(-50%, -50%);line-height:unset!important}
.feeling .artclEnd{margin-bottom:40px}

.feeling .ItemListing:first-child a{background-color:#BFCF94}
.feeling .ItemListing:nth-of-type(2) a{background-color:#EBB1B4;}
.feeling .ItemListing:nth-of-type(3) a{background-color:#D9B6ED;}
.feeling .ItemListing:nth-of-type(4) a{background-color:#e4e4e4}
.feeling .ItemListing:nth-of-type(5) a{background-color:#C6C6C6;}

.feeling .ItemListing:nth-of-type(6) a{background-color:#BFCF94}
.feeling .ItemListing:nth-of-type(7) a{background-color:#EBB1B4;}
.feeling .ItemListing:nth-of-type(8) a{background-color:#D9B6ED;}
.feeling .ItemListing:nth-of-type(9) a{background-color:#e4e4e4}
.feeling .ItemListing:nth-of-type(10) a{background-color:#C6C6C6;}

.feeling .ItemListing:nth-of-type(11) a{background-color:#BFCF94}
.feeling .ItemListing:nth-of-type(12) a{background-color:#EBB1B4;}
.feeling .ItemListing:nth-of-type(13) a{background-color:#D9B6ED;}
.feeling .ItemListing:nth-of-type(14) a{background-color:#e4e4e4}
.feeling .ItemListing:nth-of-type(15) a{background-color:#C6C6C6;}

.feeling .ItemListing:nth-of-type(16) a{background-color:#BFCF94}
.feeling .ItemListing:nth-of-type(17) a{background-color:#EBB1B4;}
.feeling .ItemListing:nth-of-type(18) a{background-color:#D9B6ED;}
.feeling .ItemListing:nth-of-type(19) a{background-color:#e4e4e4}
.feeling .ItemListing:nth-of-type(20) a{background-color:#C6C6C6;}

.feeling .ItemListing:nth-of-type(21) a{background-color:#BFCF94}
.feeling .ItemListing:nth-of-type(22) a{background-color:#EBB1B4;}
.feeling .ItemListing:nth-of-type(23) a{background-color:#D9B6ED;}
.feeling .ItemListing:nth-of-type(24) a{background-color:#e4e4e4}
.feeling .ItemListing:nth-of-type(25) a{background-color:#C6C6C6;}

.feeling .ItemListing:nth-of-type(26) a{background-color:#BFCF94}
.feeling .ItemListing:nth-of-type(27) a{background-color:#EBB1B4;}
.feeling .ItemListing:nth-of-type(28) a{background-color:#D9B6ED;}
.feeling .ItemListing:nth-of-type(29) a{background-color:#e4e4e4}
.feeling .ItemListing:nth-of-type(30) a{background-color:#C6C6C6;}
.ramadan .filterMainContent h3{width:170px}

.openDoaaPopup .doaaPopup{visibility:visible;opacity:1}
.openDoaaPopup.ItemListing:hover{transform:none}
.doaaPopup{position:fixed;display:inline-block;width:100%;height:100%;top: 0;right: 0;bottom: 0;left: 0;z-index:3;opacity: 0;visibility: hidden}
.doaaPopup:before{position: absolute;top: 0;left: 0;z-index: 3;width: 100%;height: 100%;background: rgba(0,0,0,0.8);content: '';
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0s 0.3s;
    transition: opacity 0.3s, transform 0s 0.3s;}
.doaaPopup .doaaBox{display:inline-block;position:absolute;width:900px;height:auto;background-color:#F4E0CE;left:50%;transform:translate(-50% , -50%);top:50%;padding: 20px 60px 40px; max-height: 440px;overflow-y:auto;z-index:4}
.doaaPopup .doaaBox:before{content:'';position:absolute;background:url(../Images/ramdan24/objectRight.png) right bottom no-repeat;bottom:0;right:0;width:50%;height:100%;background-size:100% auto;pointer-events:none}
.doaaPopup .doaaBox:after{content:'';position:absolute;background:url(../Images/ramdan24/objectRight.png) left top no-repeat;top:0;left:0;width:50%;height:100%;background-size:100% auto;transform:rotateX(3.142rad) rotateY(180deg);pointer-events:none}
.doaaPopup .doaaBox .closeDoaa{display:inline-block;position:absolute;top:20px;left:15px;width:15px;height:20px;z-index:2;right:auto;background-color:unset!important}
.doaaPopup .doaaBox .closeDoaa:before{content:'O';position:absolute;top:0;left:0;font-size:19px;color:#000;font-weight:bold;line-height:1}
.doaaPopup .doaaBox .title{display:inline-block;float:left;width:100%;}
.doaaPopup .doaaBox span{display:inline-block;color:#330D46;font-size:24px;text-align:center;font-family:DroidKufiBold, Arial ;margin:25px 0 15px }
.doaaPopup .doaaBox ul{display:inline-block;float:right;width:100%;margin-top:15px;}
.doaaPopup .doaaBox ul li{display:list-item;float:right;width:100%;background-color:transparent;font-family:DroidKufiLight, Arial;font-size:18px;color:#000;border:0;margin-bottom:10px; list-style-type: disc;list-style-position:inside;overflow:visible}
.doaaPopup .doaaBox ul li::marker{font-size:15px}
  .sharebtnfb{   display:inline-block; float: left!important;
    width: 118px!important;
    height: 40px!important;
    top: auto!important;
    right: auto!important;
    background-color: #4267B2!important;
    color: #fff!important;
    z-index: 1;
    line-height: 40px!important;text-align:left;margin-top:15px}
.sharebtnfb:before{content:'u';float:left;margin:5px 6px 0 10px}


@media screen and (min-width:1680px) and (max-width:1919px) {
    
    .boxListing .ItemListing{width:236px;height:123px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n){margin:0 0 20px 0}    
    .boxListing .ItemListing p{line-height:123px}

    .feeling .ItemListing{width:calc((100% - 60px) /4);height:95px}
    .feeling .ItemListing:nth-child(3n){margin:0 0 20px 20px}
    .feeling .ItemListing:nth-child(4n){margin:0 0 20px 0}
    .feeling .ItemListing p{font-size:19px}

}

@media screen and (min-width:1600px) and (max-width:1679px) {
    
     .boxListing .ItemListing{width:236px;height:123px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n){margin:0 0 20px 0}
     .boxListing .ItemListing p{line-height:123px}

     .feeling .ItemListing{width:calc((100% - 60px) /4);height:95px}
    .feeling .ItemListing:nth-child(3n){margin:0 0 20px 20px}
    .feeling .ItemListing:nth-child(4n){margin:0 0 20px 0}
    .feeling .ItemListing p{font-size:19px}

}

@media screen and (min-width:1536px) and (max-width:1599px) {

     .boxListing .ItemListing{width:236px;height:123px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n){margin:0 0 20px 0}
        .boxListing .ItemListing p{line-height:123px}

     .feeling .ItemListing{width:calc((100% - 60px) /4);height:95px}
    .feeling .ItemListing:nth-child(3n){margin:0 0 20px 20px}
    .feeling .ItemListing:nth-child(4n){margin:0 0 20px 0}
    .feeling .ItemListing p{font-size:19px}

}

@media screen and (min-width:1440px) and (max-width:1535px) {

    .boxListing .ItemListing{width:236px;height:123px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n){margin:0 0 20px 0}
    .boxListing .ItemListing p{line-height:123px}

     .feeling .ItemListing{width:calc((100% - 60px) /4);height:95px}
    .feeling .ItemListing:nth-child(3n){margin:0 0 20px 20px}
    .feeling .ItemListing:nth-child(4n){margin:0 0 20px 0}
    .feeling .ItemListing p{font-size:19px}
}


@media screen and (min-width:1360px) and (max-width:1439px) {
    .boxListing .ItemListing{width:236px;height:123px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n){margin:0 0 20px 0}
    .boxListing .ItemListing p{line-height:123px}

     .feeling .ItemListing{width:calc((100% - 60px) /4);height:95px}
    .feeling .ItemListing:nth-child(3n){margin:0 0 20px 20px}
    .feeling .ItemListing:nth-child(4n){margin:0 0 20px 0}
    .feeling .ItemListing p{font-size:19px}
}

@media screen and (min-width:1280px) and (max-width:1359px) {
     .boxListing .ItemListing{width:202px;height:106px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n){margin:0 0 20px 0}
    .boxListing .ItemListing p{font-size:20px}
        .boxListing .ItemListing p{line-height:106px}

    .feeling .ItemListing p{font-size:19px}
}

@media screen and (min-width:1152px) and (max-width:1279px) {
    .boxListing .ItemListing{width:214px;height:112px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(2n){margin:0 0 20px 0}
    .boxListing .ItemListing p{font-size:20px}

    .feeling .ItemListing p{font-size:19px}

}

@media screen and (min-width:1024px) and (max-width:1151px) {

         .boxListing .ItemListing{width:214px;height:112px}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(2n){margin:0 0 20px 0}
    .boxListing .ItemListing p{font-size:20px}

    .feeling .ItemListing p{font-size:19px}
    .doaaPopup .doaaBox{width:840px}

}


@media only screen and (max-width: 1023px) {
     .boxListing .ItemListing{width:calc((100% - 40px) /3);height:auto;padding:0}
    .boxListing .ItemListing a{display:inline-block;position:relative;width:100%;height:auto;padding-bottom:53%;float:right}
    .boxListing .ItemListing:nth-child(4n){margin:0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n){margin:0 0 20px 0}

    .sharebtnfb{padding-bottom:0!important;height: 35px !important;line-height:35px!important;margin-top:6px}
    .sharebtnfb:before{font-size:14px}
    .feeling .ItemListing p{font-size:19px}
    .doaaPopup .doaaBox, .rulesPopup .ruleBox, .rulesPopupHint .ruleBox{width:calc(100% - 100px);padding: 20px 15px 40px;max-height: 300px;}
    .doaaPopup .doaaBox .closeDoaa, .rulesPopup .ruleBox .closeRules, .rulesPopupHint .ruleBox .closeRulesHint{padding-bottom:0}
    .doaaPopup .doaaBox span, .rulesPopup .ruleBox span, .rulesPopupHint .ruleBox span{margin: 15px 0 0;font-size:22px}
    .doaaPopup .doaaBox ul li, .rulesPopup .ruleBox ul li, .rulesPopupHint .ruleBox ul li{font-size:15px}
     .rulesPopup .ruleBox, .rulesPopupHint .ruleBox{margin:10px 0 0;height:calc(100% - 190px)}

         .boxListing .ItemListing p{height:auto;left:50%;top:50%;transform:translate(-50% , -50%)}

}


@media screen and (min-width: 320px) and (max-width: 767px) {
     .boxListing .ItemListing{width:calc((100% - 20px) /2)}
    .boxListing .ItemListing:nth-child(4n) { margin: 0 0 20px 20px}
    .boxListing .ItemListing:nth-child(3n) { margin: 0 0 20px 20px}
    .boxListing .ItemListing:nth-child(2n) { margin: 0 0 20px 0}
    .boxListing .ItemListing p{font-size:19px}
    .ramadan  p.text{font-size:16px}
    .boxListing .ItemListing:hover {transform: none;}

    .feeling .ItemListing p{font-size:15px}
    .feeling .ItemListing{width: calc((100% - 20px) /3);height: 85px;margin:0 0 10px 10px}
    .feeling .ItemListing:nth-child(2n){margin:0 0 10px 10px}
    .feeling .ItemListing:nth-child(3n){margin:0 0 10px 0}
    .feeling .ItemListing a{height:100%}
    .feeling .filterMainContent h3{font-size:14px}

    .doaaPopup .doaaBox, .rulesPopup .ruleBox, .rulesPopupHint .ruleBox{width: calc(100% - 20px); padding: 20px 15px;height:calc(100% - 250px);  max-height: unset; top: 150px;transform: translateX(-50%);}
    .doaaPopup .doaaBox span, .rulesPopup .ruleBox span, .rulesPopupHint .ruleBox span{font-size:20px}
    .doaaPopup .doaaBox ul li, .rulesPopup .ruleBox ul li, .rulesPopupHint .ruleBox ul li{margin-bottom:15px}
    .rulesPopup .ruleBox, .rulesPopupHint .ruleBox{margin:10px 0 0;height:calc(100% - 190px)}
    .doaaPopup .doaaBox:after{height:172px}
}