@charset "utf-8";
/* CSS Document */

html,body{overflow-x: hidden;}

@media only screen and (min-width:1900px) and (max-width:2000px) {
#teaser {
    background-color: #eeeeee;
    background-image: url("../img/Umrah-banner.jpg");
    background-position: 0px 0;
    background-repeat: no-repeat;
    height: 401px;
    padding: 60px 0;
}

}

@media only screen and (min-width:2001px) and (max-width:2700px) {
#teaser {
    background-color: #eeeeee;
    background-image: url("../img/Umrah-banner.jpg");
    background-position: 280px 0;
    background-repeat: no-repeat;
    height: 401px;
    padding: 60px 0;
}

}


/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
  
  //CSS
  
}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {
  
  //CSS
  
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
  
  //CSS
  
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/




@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
.januarypackwrap {
    text-align: left;
    width: 100%;    position: relative;
    z-index: 99;
}

.januaryspecialpackage{background-size: cover;position: relative;}
  .januaryspecialpackage::after {
    position: absolute;
    content: '';
    background: #0f243a;
    width: 100%;
    height: 100%;
    opacity: .9;
    left: 0;
    top: 0;
}
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
.januarypackwrap {
    text-align: left;
    width: 100%;    position: relative;
    z-index: 99;
}

.januaryspecialpackage{background-size: cover;position: relative;}
  .januaryspecialpackage::after {
    position: absolute;
    content: '';
    background: #0f243a;
    width: 100%;
    height: 100%;
    opacity: .9;
    left: 0;
    top: 0;
}

/*16-01-2020*/
.logo {
    width: 150px;
}
.background-banner{    padding-bottom:115px;
    background-size: cover;}
.mainheading1{    font-size: 1.5rem;}
.reviewsectionbg{background-size: cover;}
.bedheading::after{    left: 75px;}
.callnumber a{    font-size: 2rem;}
.oroption{display: none;}
.callnow,.callback{width: 48%;margin-right: 1%}
.Allahmessages .mainheading1 {
    font-size: 21px;
}
.Allahmessages .callnumber a{    font-size: 16px;}
.hotelpictures{    width: 63%;     margin-right: 2%}
.slideshow{    height: 23vh;
    width: 100%;}

}


@media (min-width:768px) and (max-width: 900px){
.logo {
    width: 150px;
}
.background-banner{    padding-bottom: 46px;
    background-size: contain;}
.mainheading1{    font-size: 1.5rem;}
.reviewsectionbg{background-size: cover;}
.bedheading::after{    left: 75px;}
.callnumber a{    font-size: 2rem;}
.oroption{display: none;}
.callnow,.callback{width: 48%;margin-right: 1%}
.Allahmessages .mainheading1 {
    font-size: 21px;
}
.Allahmessages .callnumber a{    font-size: 16px;}
.hotelpictures{    width: 63%;     margin-right: 2%}
.slideshow{    height: 70vh;
    width: 100%;}
    .footerlinks{flex-wrap: wrap;}

}


/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
.boardingtime ul li {width: 33%;} 
.contactus{    font-size: 1.3rem;}
  .januarypackwrap {
    text-align: left;
    width: 100%;position: relative;z-index: 99;
}
.januaryspecialpackage {
    margin-top: 30px;
   position: relative;
     margin: 0px; 
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    justify-content: start;
    padding: 20px 25px;
}
.boardingtime ul li .dates{font-size: 1.5rem}
.departureline::after{right:7px;}
.packagepricetabele ul {
    padding-left: 0px;
    list-style: none;
     background: none; 
    padding: 0px;
}

.packagepricetabele ul li{justify-content: space-evenly;
    padding-top: 17px;
    flex-wrap: wrap;}

.packagepricetabele ul li:last-child {
    border-bottom: none;
}
.noblock {
    display: none !important;
}
.packagepricetabele ul li span {
    width: 24%;
    color: #fff;
    padding: 8px 1px;
    display: block;position: relative;
    margin-bottom: 14px;
}
.packagepricetabele ul li span::after {
    position: absolute;
    content: attr(data-value);
    display: block;
    float: none;
    font-weight: bold;
    text-transform: uppercase;
    width: 100%;
        bottom: 25px;
}
.shareheaingmobile{
    width: 100%;
    margin-bottom: 20px;
    text-align: center;
    color: #fff;
        font-size: 14px;
    text-transform: uppercase;display: block !important; }

.packagepricetabele ul li:first-child{display: none !important;}

.boardingtime {
    border-bottom: 2px solid #fff;
    padding-bottom: 12px;
}
.contactus.desktop{display: none;}
.contactus.mobile {
    display: block;
    text-align: center;
}

.januaryspecialpackage::after {
    position: absolute;
    content: '';
    background: #0f243a;
    width: 100%;
    height: 100%;
    opacity: .9;
    left: 0;
    top: 0;
}

/*16-01-2020*/

.messagefield {
    padding-left: 15px !important;
}
.callnumber a{font-size: 2.3rem
}
.customecontainer {
    max-width: 100% !important;
}
.footerlinks{flex-wrap: wrap;}
.reviewsectionbg,.background-banner{    background-size: cover;}
.background-banner {
    margin-top: 0px;
    background-position: -630px 0px;
}
.logo {
    width: 150px;
}
.calltoaction a{font-size: 13px;}
.callingitem{margin-top: 0px;}
.social-links {
    display: flex;
}
.boardingtime ul li .dates {
    font-size: 15px;
}
.contactus{font-size: 14px; }
.januaryspecialpackage{padding:15px;}

.packagepricetabele ul li span{    margin-bottom: 3px;
    font-size: 13px;}
.sidebar__title h2{    font-size: 19px;}
.whytravelwrapper{margin-bottom: 20px;}
.bedpriceinfo.rupe{font-size: 20px;}
.bedprice li{    margin: 10px auto;
    width: 30%;}
.callnumber a{    font-size: 1.2rem;}
.oroption{display: none;}
.hotelwrapper{flex-wrap: wrap;}
.hotelpictures, .hotelinfo {
    width: 48%;
    margin-right: 2%;
}
.slideshow{    width: auto;    height: 55vh;}
.hotelmainpicture{display: none;}
.maindeparr span:first-child::after{display: none;}
.seasonwrapper .shareheaingmobile{    color: #301d00;}
.officewrap::after{width: 60px;}
.allahmsgbg::before {
    position: absolute;
    content: '';
    background: url(../images/allahmsgbg.jpg);
    width: 220px;
    height: 250px;
    background-size: 100px;
    background-repeat: no-repeat;
     left: 0px; 
    top: 0;
    z-index: -9;
    opacity: 0.4;
}
.allahmsgbg {padding: 0px 20px !important;margin: 20px 0px !important ;z-index: 9;}
.Allahmessages .mainheading1 {
    font-size: 23px;
}
.Allahmessages .callnumber a{    font-size: 15px;}
.bedprice{    display: flex;
    justify-content: space-around;}
.bedheading::after{    left: 64px;}
.newprice{    font-size: 2.5rem;}
.groupimg{display: none;
}
  
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {
 .boardingtime ul li {width: 33%;} 
.contactus{    font-size: 1.3rem;}
  .januarypackwrap {
    text-align: left;
    width: 100%;position: relative;z-index: 99;
}
.januaryspecialpackage {
    margin-top: 30px;
   position: relative;
     margin: 0px; 
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    justify-content: start;
    padding: 20px 25px;
}
.boardingtime ul li .dates{font-size: 1.5rem}
.departureline::after{right:7px;}
.packagepricetabele ul {
    padding-left: 0px;
    list-style: none;
     background: none; 
    padding: 0px;
}

.packagepricetabele ul li{justify-content: space-evenly;
    padding-top: 17px;
    flex-wrap: wrap;}

.packagepricetabele ul li:last-child {
    border-bottom: none;
}
.noblock {
    display: none !important;
}
.packagepricetabele ul li span {
    width: 24%;
    color: #fff;
    padding: 8px 1px;
    display: block;position: relative;
    margin-bottom: 14px;
}
.packagepricetabele ul li span::after {
    position: absolute;
    content: attr(data-value);
    display: block;
    float: none;
    font-weight: bold;
    text-transform: uppercase;
    width: 100%;
        bottom: 25px;
}
.shareheaingmobile{
    width: 100%;
    margin-bottom: 20px;
    text-align: center;
    color: #fff;
        font-size: 14px;
    text-transform: uppercase;display: block !important; }

.packagepricetabele ul li:first-child{display: none !important;}

.boardingtime {
    border-bottom: 2px solid #fff;
    padding-bottom: 12px;
}
.contactus.desktop{display: none;}
.contactus.mobile {display: block;}

.januaryspecialpackage::after {
    position: absolute;
    content: '';
    background: #0f243a;
    width: 100%;
    height: 100%;
    opacity: .9;
    left: 0;
    top: 0;
}

/*16-Jan-2020*/

.customecontainer {
    max-width: 100% !important;
}
.footerlinks{flex-wrap: wrap;}
.reviewsectionbg,.background-banner{    background-size: cover;}
.background-banner {
    margin-top: 0px;
    background-image: url(../images/mobilebanner-01.jpg);
    background-repeat: no-repeat;
    background-size: cover;
   padding: 337px 41px;
   position: relative;
}
section.background-banner .jancontactbutton{position: absolute;
    bottom: 154px;}
section.background-banner .jancontactbutton a.contactus{font-size: 20px}
.logo{margin: 0 auto;}
.calltoaction a{font-size: 13px;}
.callingitem{margin-top: 0px;}
.social-links {
    display: flex;
}
.mainheading1{    font-size: 1.5rem;}
.boardingtime ul li .dates {
    font-size: 15px;
}
.contactus{font-size: 14px; }
.januaryspecialpackage{padding:15px;}

.packagepricetabele ul li span{    margin-bottom: 3px;
    font-size: 13px;}
.sidebar__title h2{    font-size: 19px;}
.whytravelwrapper{margin-bottom: 20px;}
.bedpriceinfo.rupe{font-size: 20px;}
.bedprice li{    margin: 10px auto;}
.callnumber a{    font-size: 1.2rem;}
.oroption{display: none;}
.hotelwrapper{flex-wrap: wrap;}
.hotelpictures,.hotelinfo {
    width: 100%;
    margin-right: 0%;
}
.slideshow{    width: auto;}
.hotelmainpicture{display: none;}
.maindeparr span:first-child::after{right: -9px;}
.seasonwrapper .shareheaingmobile{    color: #301d00;}
.officewrap::after{display: none;}
.officewrap{width: 100%}
.allahmsgbg {padding: 0px 20px !important;margin: 20px 0px !important }
.Allahmessages .callnow,.Allahmessages .callback{text-align: center;
    margin: 8px 25px;}
.Allahmessages .mainheading1 {
    font-size: 23px;
}
.Allahmessages .callnumber a{    font-size: 15px;}
}

@media (max-width:320px) {
    .contactus {    padding: 6px;
    text-align: center;
    font-size: 1.2rem;
}
.packagepricetabele ul li span{    width: 35%;}
}


/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and
 (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */

.calltoaction a {
    font-size: 11px;
}
.logo {
    width: 100px;
}
.callnow {
    width: 48%;
}
.Allahmessages .mainheading1 {
    font-size: 20px;
}
.callnow p, .callback p{    font-size: 14px;}

}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and 
(orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */

.calltoaction{width: 100%;}
.callingitem{
    flex-wrap: wrap;
    justify-content: flex-start;
}
.calltoaction a {
    font-size: 15px;
}
.boardingtime ul{flex-wrap: wrap;}
.boardingtime ul li {
    width: 40%;margin-bottom: 10px;
}
.contactus{font-size: 15px;}
.bedheading::after{    left: 70px;}

.upcoingpackagedate {flex-wrap: wrap;}
.maindeparr span:first-child::after {
   display: none;
}
.upcoingpackagedate ul{width: 100%}
.Allahmessages .mainheading1 {
    font-size: 17px;
}
.callnow p, .callback p {
    font-size: 15px;
}

}
