@media (max-width: 1199px){
    
   
    
    
    .menuArea li { margin-left: 18px; }

    
    .bannerBox h1 { font-size: 58px; line-height: 78px; }
    
    .hajjBox .image .round { width: 340px; height: 340px; }
    
    .hajjBox .text .info { padding-top: 5px; }
    
    .hajjBox .text .cntct_btn { padding: 14px 24px; font-size: 18px; }
    .hajjBox .text .email_lable { margin: 0 12px; font-size: 13px; }
    .hajjBox .text .email { font-size: 20px; }
    .packagesBox .item .sub { padding: 45px 30px 35px 30px; }
    
   
}


@media (max-width: 991px){
    
    #headerCntr { padding: 20px 0; }
    
    #headerCntr.sticky { padding: 20px 0; }
    
    .menuTogggle { margin: 8px 0 0 0; display: block; float: right; font-size: 16px; color: #fff !important; text-decoration: none !important; text-transform: uppercase; }
    .menuTogggle i { margin-right: 2px; font-size: 30px; vertical-align: text-top; }
    
    .closemenu { display: none; direction: none; position: fixed; top: 15px; right: 15px; z-index: 99; font-size: 0px; }
    .closemenu.open { display: block; }
    .closemenu i { font-size: 20px; color: #fff !important; text-decoration: none !important; }
    
    .logoArea, #headerCntr.sticky .logoArea { position: static; margin: 0px; float: left; width: 203px; }
    .logoArea:after { display: none; }
    
    
    .menuArea, #headerCntr.sticky .menuArea { display: none; }
    .menuArea { padding-top: 65px; width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; overflow-x: auto; z-index: 99; background-color: rgba(0,0,0, 0.9); }
    .menuArea li { margin: 10px 0; width: 100%; text-align: center; }
    .menuArea li a { padding: 0 6px 3px 6px; display: inline-block; color: #fff; }
    
    #bannerCntr { margin-top: 92px; }
    
    .hajjBox .text { padding-bottom: 50px; }
    .hajjBox .text p { padding-right: 0px; }
    
    
    .packagesBox { padding: 65px 0 80px 0; }
    .packagesBox .item .sub .detail_btn { font-size: 18px; }
    .packagesBox .item .sub .reg_btn { font-size: 18px; }
    
    .packagesBox .item .sub .wait_btn { font-size: 18px; }
    .packagesBox .item .sub .sold_btn { font-size: 18px; }
    
    .packagesBox .item .sub { padding: 45px 20px 35px 20px; }
    
    
    .packageDetailsBox { margin-top: -50px; }
    
    .detail_item .timeline { padding: 40px 20px 45px 30px; }
    .detail_item .reg_btn a { font-size: 20px; }
    
    .faqBox { padding: 65px 0 75px 0; }
    
    
    
    .mapBox { min-height: 440px; }
     
}

@media (max-width: 767px){
    
    .bannerBox { padding: 100px 0; }
    .bannerBox h1 { font-size: 36px; line-height: 46px; }
    
    .bannerBox:after { height: 20px; }
    
    .hajjBox { padding: 35px 0 55px 0; }
    .hajjBox .text h2 { font-size: 30px; }
    .hajjBox .text p { font-size: 16px; line-height: 24px; }
    
    .hajjBox .text .email_lable { display: block; margin: 10px 0 0 0; }
    .hajjBox .text .email_lable br { display: none; }
    
    .hajjBox .image .round { width: 280px; height: 280px; }
    
    .packagesBox { padding: 45px 0; }
    .packagesBox h2 { font-size: 30px; margin-bottom: 30px; }
    .packagesBox .item { margin: 15px 0; }
    .packagesBox .item .sub { padding: 45px 15px 35px 15px; }
    .packagesBox .item .sub h3 { font-size: 28px; }
    .packagesBox .item .sub h4 { font-size: 20px; }
    
    .packagesBox .item .sub p { font-size: 13px; line-height: 20px; }
    
    .packagesBox .item .sub .detail_btn { padding: 8px 18px; font-size: 16px; margin: 3px; }
    .packagesBox .item .sub .reg_btn { font-size: 16px; padding: 6px 11px; margin: 3px; }
    
    .packagesBox .item .sub .wait_btn { padding: 8px 18px; font-size: 16px; margin: 3px; }
    .packagesBox .item .sub .sold_btn { font-size: 16px; padding: 6px 11px; margin: 3px; }
    
    .packageDetailsBox { margin: 0px; display: none; }
    .detail_item { margin: 45px 0 0 0; padding: 20px 15px 40px 15px; }
    .detail_item:after { display: none; }
    .detail_item .left li { font-size: 14px; }
    .detail_item .right .image { margin-bottom: 25px; }
    .detail_item .right .image .price { font-size: 16px; }
    .detail_item .right .image .price strong { font-size: 20px; }
    .detail_item .right .image .price:after { border-width: 22px 20px 23px 0; }
    .detail_item .right .price_intro { margin-bottom: 30px; font-size: 14px; }
    .detail_item .right .price_btn { font-size: 14px; }
    
    .detail_item .timeline { padding: 0px; background: none; }
    .detail_item .timeline .stage .stext { padding: 6px 10px; font-size: 9px; margin-top: 8px; }
    
    .detail_item .timeline .stage .timeacordian { width: calc(100% - 75px); }
    .detail_item .timeline .stage .timeacordian .ans { padding: 20px 10px; }
    .detail_item .timeline .stage .timeacordian p { font-size: 12px; line-height: 16px; }
    .detail_item .timeline .stage .timeacordian .ques { padding: 12px 20px 12px 10px; font-size: 11px; }
    .detail_item .timeline .stage .timeacordian .ques .plus:before { right: 9px; }
    .detail_item .timeline .stage .timeacordian .ques .plus:after { right: 3px; }
    .detail_item .timeline .stage .timeacordian .ques .tag { margin-right: 3px; padding: 4px 7px; font-size: 8px; }
    .detail_item .timeline .stage .timeacordian .ques:after { width: 42px; left: -42px; }
    .detail_item .timeline .stage .timeacordian .ques:before { left: -47px; }
    .detail_item .timeline .stage .timeacordian:after { height: calc(100% - 55px); left: -41px; top: 33px; }
    .detail_item .timeline .stage .timeacordian li:last-child .ans:after { top: -15px; left: -46px; background: #ececec; }
    
    
    .packagesBox #dpackage, .packagesBox #spackage { display: none !important; }
    .packagesBox #dpackage-mobile { display: inline-block; }
    .packagesBox #spackage-mobile { display: inline-block; }
    .packagesBox .detail_item { margin: -15px 0 0 15px; width: calc(100% - 30px); text-align: left; }
    
    .packagesBox .item .sub .detail_btn[style="display: none;"] + #dpackage-topscrool, .packagesBox .item .sub .detail_btn[style="display: none;"] + #spackage-topscrool { display: none !important; }

    
    .experienceBox { padding: 50px 0; }
    .experienceBox h2 {font-size: 30px; margin-bottom: 30px; }
    
    .experienceBox #slider .title { font-size: 12px; bottom: 10px; padding: 10px; }
    .experienceBox #carousel .title .cntr { font-size: 13px; }
    
    .faqBox { padding: 50px 0; }
    .faqBox h2 { font-size: 30px; margin-bottom: 30px; }
    
    .mapBox { padding: 40px 0 0 0; background-size: contain; min-height: 256px; }
    .mapBox h2 { font-size: 20px; }
    .mapBox .email i { width: 50px; height: 50px; margin-right: 6px; line-height: 48px; font-size: 20px; }
    .mapBox .email { font-size: 18px; }
    
    .contactBox { padding: 45px 0 30px 0; }
    .contactBox h2 { font-size: 30px; margin-bottom: 30px; }
    .contactBox .fgroup { padding-bottom: 15px; }
    .contactBox .input_style { padding: 0 12px; font-size: 16px; height: 46px; }
    .contactBox textarea.input_style { padding: 8px 12px; }
    .contactBox .send_btn { width: 100%; height: 46px; font-size: 18px; }
    
    #footerCntr { padding: 30px 0; }
    #footerCntr li a { font-size: 14px; }
    #footerCntr li { margin: 4px 9px; }
    
    #footerCntr p { font-size: 13px; line-height: 20px; padding-top: 16px; }
    
    
}

@media (max-width: 480px){

    
}