@charset "utf-8";
/*Variables*/
:root {
	/*New site colors start*/
  --primaryCol:#284942;
  --primarySecCol:#1c413a;
  --primarySecBorCol:#4BA390;
  --secondaryCol:#BBED55;
  --secondHeadCol:#1F2937;
  --fontCol:#4E4B66;
  --fontColLgt:#bdc2cf;
  --fontColOth:#a7adbb;
  --SecFontCol:#9FB9B3;
  --white:#fff;
  --deepBorder:#6b687a;
  --orangeCol:#f76f20;
  --grayLine:#E5E5E5;
  --midBorder:#d1cfcf;
  --line:#5F847C;
  /*New site colors end*/
  
  
  
    
  
  /*New site font start*/
  --font-f100B:400 100px/110px "DM Sans", serif;
  
  --font-f60B:500 60px/65px "DM Sans", serif;
  
  --font-f45R:400 45px/50px "DM Sans", serif;
  --font-f45M:500 45px/50px "DM Sans", serif;
  --font-f45B:700 45px/50px "DM Sans", serif;
  
  --font-f40R:400 40px/45px "DM Sans", serif;
  --font-f40M:500 40px/45px "DM Sans", serif;
  --font-f40B:700 40px/45px "DM Sans", serif;
  
  --font-f35R:400 35px/40px "DM Sans", serif;
  --font-f35M:500 35px/40px "DM Sans", serif;
  --font-f35B:700 35px/40px "DM Sans", serif;
  
  --font-f30R:400 30px/35px "DM Sans", serif;
  --font-f30M:500 30px/35px "DM Sans", serif;
  --font-f30B:700 30px/35px "DM Sans", serif;
  
  --font-f25R:400 25px/30px "DM Sans", serif;
  --font-f25M:500 25px/30px "DM Sans", serif;
  --font-f25B:700 25px/30px "DM Sans", serif;
  
  --font-f20R:400 20px/26px "DM Sans", serif;
  --font-f20M:500 20px/26px "DM Sans", serif;
  --font-f20B:700 20px/26px "DM Sans", serif;
  
  
  --font-f18R:400 18px/25px "DM Sans", serif;
  --font-f18M:500 18px/25px "DM Sans", serif;
  --font-f18B:700 18px/25px "DM Sans", serif;
  
  --font-f16R:400 16px/22px "DM Sans", serif;
  --font-f16M:500 16px/22px "DM Sans", serif;
  --font-f16B:700 16px/22px "DM Sans", serif;
  
  --font-f14R:400 14px/20px "DM Sans", serif;
  --font-f14M:500 14px/20px "DM Sans", serif;
  --font-f14B:700 14px/20px "DM Sans", serif;
  
  --font-f12R:400 12px/16px "DM Sans", serif;
  --font-f12M:500 12px/16px "DM Sans", serif;
  --font-f12B:700 12px/16px "DM Sans", serif;
  
  --font-f10R:400 10px/16px "DM Sans", serif;
  --font-f10M:500 10px/16px "DM Sans", serif;
  --font-f10B:700 10px/16px "DM Sans", serif;
  /*New site font end*/
  
  
}


.clear{clear:both}
/*Header start*/
.fullHeaderSec{ position:fixed; top:0; width:100%; z-index:999;}
.logoHeaderFull{ width:100%; background-color:var(--blue); padding:15px 0; position:relative; z-index:2}
.logoHeaderFull .logoHeader{ width:1200px; margin:0 auto}
.logoHeaderFull .logoHeader .logoSec{ width:220px; float:left}
.logoHeaderFull .logoHeader .logoSec img{ width:100%}
.logoHeaderFull .logoHeader .callSec{ float:right; margin-top:12px}
.logoHeaderFull .logoHeader .callSec h2{ text-align:right; margin-bottom:0}
.logoHeaderFull .logoHeader .callSec h2 a{font:var(--font-f20B); color:#ffde00; margin-bottom:0}
.logoHeaderFull .logoHeader .callSec p{text-align:right; font:var(--font-f13R) !important; color:#fff}
.logoHeaderFull .logoHeader .callSec p a{font:var(--font-f13R) !important; color:#fff}
.logoHeaderFull .logoHeader .callSec a.mobCall{ background-color:#ffde00; padding:10px 20px; float:left; margin-left:10px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; display:none; color:var(--blue); font:var(--font-f14B)}
.logoHeaderFull .logoHeader .callSec a.mobCall.mobRegHead{ border-color:var(--dualColor); color:var(--dualColor); background-image:url(../images/bluePhone-new.png) 20px center no-repeat; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; padding:10px 20px 10px 50px;}


.menu-container .logoSec{ width:220px; float:left}
.menu-container .logoSec img{ width:40%}
.headSec .header .headRegSec{ float:right; margin-top:5px}
.menu-container .callSec{float:right; margin-top:7px}
.menu-container .callSec a{ margin:0 0 0 10px; display:inline-block; color:var(--secondaryCol); text-decoration:none; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; font:var(--font-f14R);}
.menu-container .callSec a.headReg{ padding:10px 20px; background-color:var(--secondaryCol); color:var(--primaryCol); }
.menu-container .callSec a.headCall{ padding:10px 20px; border:1px solid var(--secondaryCol); color:var(--secondaryCol);}



/*Menu start*/
.menu-container {
    width: 100%;
    margin: 0 auto;
    position:relative; padding:10px 0; border-bottom:1px solid var(--deepBorder)
}
.menu-container .menu{ width:1200px; margin:0 auto}

.menu-mobile {
    display: none;
    padding: 20px;
}

.menu-mobile:after {
    content: "\f394";
    font-family: "Ionicons";
    font-size: 2.1rem;
    padding: 0;
    float: right;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-25%);
    -ms-transform: translateY(-25%);
    transform: translateY(-25%);
}

.menu > ul {

    list-style: none;
    padding: 0;
    box-sizing: border-box;
}

.menu > ul:before,
.menu > ul:after {
    content: "";
    display: table;
}

.menu > ul:after {
    clear: both;
}

.menu > ul > li {
    float: left;
    padding: 0;
    margin: 0;
}

.menu > ul > li a {
    text-decoration: none;
    padding: 18px 20px; color:var(--white);
    display: block; font:var(--font-f14R);
}
.menu>ul>li:hover a{ color:var(--fontCol)}

.menu > ul > li:hover {
    background: var(--white);
	color:var(--blue)
}
/*.menu > ul > li:hover a{ color:#333}*/

.menu > ul > li > ul {
    display: none;
    width: 100%;
    background: var(--white);
    padding: 40px 0;
    position: absolute;
    z-index: 99;
    left: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
	border-bottom:2px solid var(--midBorder)
}

.menu > ul > li > ul:before,
.menu > ul > li > ul:after {
    content: "";
    display: table;
}

.menu > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li {
    margin: 0;
    padding-bottom: 0;
    list-style: none;
    width: 100%;
    background: none;
    float: left;
}

.menu > ul > li > ul > li a {
    color:var(--white);
    padding:1px 0;
    width: 95%;
    display: block;
}

.menu > ul > li > ul > li > ul {
    display: block;
    padding: 0;
    margin: 10px 0 0;
    list-style: none;
    box-sizing: border-box;
}

.menu > ul > li > ul > li > ul:before,
.menu > ul > li > ul > li > ul:after {
    content: "";
    display: table;
}

.menu > ul > li > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li > ul > li {
    float: left;
    width: 100%;
    padding: 10px 0;
    margin: 0;
    font-size: .8em;
}

.menu > ul > li > ul > li > ul > li a {
    border: 0;
}

.menu > ul > li > ul.normal-sub {
    width: 300px;
    left: auto;
    padding: 10px 20px;
}

.menu > ul > li > ul.normal-sub > li {
    width: 100%;
}

.menu > ul > li > ul.normal-sub > li a {
    border: 0;
    padding: 1em 0;
}













.mobLog{ display:none}
.baseDd{ width:1200px; margin:0 auto; position:relative; float:none}
.baseDd .eachBase{ width:30%; float:left; margin-right:3%}
.baseDd .eachBase h2{font:var(--font-f16B); padding-bottom:3px; margin-bottom:10px; float:left; color:var(--primaryCol)}
.baseDd .eachBase ul li{ list-style:none; margin-bottom:3px}
.baseDd .eachBase a{ width:95%; padding:3px 0 3px 12px; background:url(../images/submenuArrow.png) no-repeat left 9px; float:left; border:none; }
.baseDd .eachBase h2.downSec{ margin-top:30px}
.menu-container .menu .menuSec{ float:left; position:static}
.clientLogin{ float:right}
.clientLogin .menuReview{ float:left; padding-right:20px; margin:12px 20px 0 0; border-right:1px solid #777}
.clientLogin .menuReview a{ background-image:none; margin:0}
.clientLogin a{ color: #fff; background: url(../images/lock.png) left top no-repeat; padding-left: 15px; text-decoration: none; margin-top: 20px; float: left;}
.baseDd .eachBase ul li a.compPack{  background:none; padding:10px 20px; border:1px solid var(--primaryCol); float:left; width:auto; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; margin-top:10px;}
.menu-mobile{ color:#fff; float:left}
.abtMenImg, .abtMenLnk{ float:left; margin-right:20px; width:30%; margin-right:5%}
.abtMenLnk li{ list-style:none}
.abtMenLnk li a{width: 95%;
    padding: 3px 0 3px 12px !important;
    background: url(../images/submenuArrow.png) no-repeat left 9px;
    float: left;
    border: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000;
    font-weight: normal;
}
.abtMenLnk h2, .abtMenImg h2{ font:var(--font-f16B); margin-bottom:5px}
.abtMenImg p{ font:var(--font-f14R); margin-bottom:10px; color:var(--fontCol)}
.abtMenImg a{font:var(--font-f14R); color:var(--fontCol); text-decoration:underline !important}
.abtMenImg img{ margin-bottom:15px}




.mFooter{ position:relative; z-index:95; background-color:var(--white)}
.mFooter .fooLogoFull{ width:100%; background-color:var(--primaryCol); padding:30px 0}
.mFooter .fooLogoFull .fooLogoSec{ width:1200px; margin:0 auto}
.mFooter .fooSec{  margin:40px auto; width:1200px}
.mFooter .fooSec .fooCatg{ width:22%; padding-right:3%; float:left}
.mFooter .fooSec .fooCatg h2{font:var(--font-f16B); color:var(--primaryCol); margin:40px 0 10px}
.mFooter .fooSec .fooCatg ul li{ margin-bottom:0; list-style:none; background:url(../images/submenuArrow.png) no-repeat left 10px; padding:3px 0 3px 12px}
.mFooter .fooSec .fooCatg ul li a{font:var(--font-f14R); color:var(--fontCol); text-decoration:none;}
.mFooter .fooSec .fooCatg ul li a:hover{color:var(--primaryCol); text-decoration:underline}
.mFooter .fooLogoFull .fooLogoSec .copyRight{ display:flex}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach{ width:33%}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach.social{ text-align:center}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach.terms{ text-align:right}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach ul li{ display:inline-block; padding:0 10px}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach ul li a{font:var(--font-f14R); color:var(--white); text-decoration:none}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach ul li a:hover{color:var(--secondaryCol); text-decoration:underline}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach p{font:var(--font-f14R); color:var(--white);}






/*.footerSec{ width:1040px; margin:0 auto; padding:80px 0; background-color:var(--white); position:relative;}
.footerSec .eachFoo{ width:22%; float:left; padding-right:3%; margin-bottom:50px}
.footerSec .eachFoo h3{font:var(--font-f16B); color:var(--blue); padding:0 0 5px; border-bottom:1px solid var(--blueGrayLight); margin-bottom:20px}
.footerSec .eachFoo ul li a{ font:var(--font-f14R); margin-bottom:10px; float:left; width:100%; color:var(--font-color)}
.footerSec .eachFoo ul li a:hover{ text-decoration:underline}
.copyRightFoo{ width:1040px; margin:0 auto; border-top:1px solid var(--blueGrayLight); padding-top:60px;}
.copyRightFoo p, .copyRightFoo p span{ font:var(--font-f14R); margin-bottom:5px; color:var(--font-color)}
.copyRightFoo a{ font:var(--font-f14R); color:var(--font-color); text-decoration:none}
.copyRightFoo .extFooSpc{ margin-top:20px}
.copyRightFoo .regComp{ border-right:1px solid var(--midBlue); padding-right:10px; margin-right:10px}
.copyRightFoo .leftFooCr{ float:left}
.copyRightFoo .rightFooCr{ float:right}*/
/*Footer end*/

/*Foo Order By Phone*/
.helpingSec{ background-color:var(--primaryCol); padding:80px 0; position:relative; z-index:90}
.helpingSec .helping{ width:1040px; margin:0 auto; text-align:center}
.helpingSec .helping h2{font:var(--font-f45B); color:var(--white); margin-bottom:20px}
.helpingSec .helping p{font:var(--font-f18R); color:var(--white); width:60%; margin:0 auto 60px}
.helpingSec .helping p.orMailUs{font:var(--font-f14R); color:var(--secondaryCol); width:60%; margin:25px auto 0}
.helpingSec .helping p.orMailUs a{font:var(--font-f14R); color:var(--secondaryCol);}
.helpingSec .helping span a{font:var(--font-f20B); color:var(--primaryCol); background:url(../images/nxNhIcon-new.png) no-repeat left center var(--secondaryCol); padding:19px 50px 18px 120px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}
.helpingSec .helping .hdUnLine { width:150px; margin:0 auto 30px; background-color:var(--secondaryCol)}


/*Notification Bar*/
.showNot{ display:block}
.hideNot{ display:none}
.notFicSec{ background-color:#FFDE00; position:relative}
.notFicSec .notFicCont{ width:1040px; margin:0 auto; padding:10px 0;}
.notFicSec .notFicCont p{color:var(--blue); font:var(--font-f16B); text-align:center; padding-right:20px}
.notFicSec .notFicCont span{ float:right; color:var(--blue); font:var(--font-f18R); cursor:pointer; position:absolute; right:20px; top:10px; -webkit-transition: color 1s; -moz-transition: color 1s; transition: color 1s;}
.notFicSec .notFicCont span:hover{ color:var(--orange)}



.copyRightFoo p strong.wHr{font:var(--font-f14B); margin-right:10px}





/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Mobile style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media only screen and (max-width: 1050px) {
	.logoHeaderFull .logoHeader, .menuContainer, .notFicSec .notFicCont{ width:980px}
	.mFooter .fooSec, .mFooter .fooLogoFull .fooLogoSec{ width:980px}
}

@media only screen and (max-width: 980px) {
	.notFicSec .notFicCont{ width:768px}
    .menu-container {
        width: 100%;
    }
    .menu-mobile {
        display: block;
    }
    .menu-dropdown-icon:before {
        display: block;
    }
    .menu > ul {
        display: none;
    }
    .menu > ul > li {
        width: 100%;
        float: none;
        display: block;
    }
    .menu > ul > li a {
        padding: 1.5em;
        width: 100%;
        display: block;
    }
    .menu > ul > li > ul {
        position: relative;
    }
    .menu > ul > li > ul.normal-sub {
        width: 100%;
    }
    .menu > ul > li > ul > li {
        float: none;
        width: 100%;
        margin-top: 20px;
    }
    .menu > ul > li > ul > li:first-child {
        margin: 0;
    }
    .menu > ul > li > ul > li > ul {
        position: relative;
    }
    .menu > ul > li > ul > li > ul > li {
        float: none;
    }
    .menu .show-on-mobile {
        display: block;
    }

.menu-container .menu{ width:768px; position:relative; padding:10px 0}
.menu-container .menu .menuSec{ position:absolute !important; top:50px; width:100%; background-color:var(--primaryCol); z-index:100}
.menu > ul > li a{ padding:10px 0 10px 20px}
.clientLogin{ position:absolute; right:0}
.menu > ul > li > ul{ background-color:#efefef; padding:30px 20px}
.baseDd{ width:100%}
.baseDd{ overflow-Y:scroll; height:200px}
.footerSec, .copyRightFoo, .helpingSec .helping{ width:768px}
.menu-mobile{ margin:23px 0 0; padding:0}
.clientLogin{ top:0}
.logoHeaderFull .logoHeader, .menuContainer{ width:768px}
.menu-container .menu{ padding:10px 0 0}
.menu-container .logoSec{ width:140px}
.menu-container .logoSec img{ width:60%}
.mFooter .fooSec, .mFooter .fooLogoFull .fooLogoSec{ width:768px}
}

@media only screen and (max-width: 768px) {
.notFicSec .notFicCont{ width:600px}
.baseDd .eachBase{ width:100%}
.menu-container .menu{ width:600px}
.baseDd .eachBase{ margin-bottom:30px}
.footerSec, .copyRightFoo, .helpingSec .helping{ width:600px}
.footerSec .eachFoo{ width:45%;}
.helpingSec .helping h2{ font:var(--font-f40B)}
.logoHeaderFull .logoHeader, .menuContainer{ width:600px}
.baseDd .eachBase.menuImgSec{ display:none}
.menu > ul > li > ul{ background-color:#efefef; padding:0px 20px}
.mFooter .fooSec, .mFooter .fooLogoFull .fooLogoSec{ width:600px}
.mFooter .fooSec .fooCatg{ width:40%; padding-right:5%}
.mFooter .fooLogoFull .fooLogoSec .copyRight{ display:block}
}

@media only screen and (max-width: 600px) {
.menu-container .menu, .logoHeaderFull .logoHeader, .menuContainer, .notFicSec .notFicCont{ width:90%}
.logoHeaderFull .logoHeader .callSec p{ display:none}
.logoHeaderFull .logoHeader .callSec h2 a{ font:var(--font-f18B)}
.logoHeaderFull .logoHeader .callSec h2 a.headCall{ border:1px solid var(--dualColor); color:var(--dualColor); background-color:transparent; background:url(../images/bluePhoneMob-new.png) 20px center no-repeat; float:right}
.logoHeaderFull .logoHeader, .menuContainer{ width:90% !important}
.footerSec{ width:90%; margin:0 auto}
.copyRightFoo{ width:100%}
.footerSec .eachFoo, .helpingSec .helping{ width:90%;}
.helpingSec{ padding:40px 0 80px}
.logoHeaderFull .logoHeader .callSec{ margin-top:13px}
/*.fullHeaderSec{ position:static}*/
.copyRightFoo p strong.wHr{font:var(--font-f14B); margin-right:10px}
.copyRightFoo p, .copyRightFoo p span{margin-bottom:25px}
.helpingSec .helping h2{ font:var(--font-f30B)}
.helpingSec .helping p{ width:100%}
.logoHeaderFull .logoHeader .callSec a.mobCall{ display:block;}
.logoHeaderFull .logoHeader .callSec h2 .headReg{ display:none}
.logoHeaderFull .logoHeader .callSec{ margin-top:4px !important}
.logoHeaderFull .logoHeader .callSec{ width:auto !important; float:right !important; background-color:transparent !important; padding:0 !important;}

.clientLogin .mobCall{ display:block; margin-top:7px; background-color:var(--orange); color:var(--white)}
.mainLogin{ display:none}
.logoHeaderFull .logoHeader .callSec h2 a.mobLog{ display:block}
.mobLog{ display:block; color:var(--white); margin-top:10px}
.clientLogin a{ background-image:none}
.forMobLog{ display:block}
.abtBanFull{ padding:30px 0; margin:115px auto 0}
.menu-container .logoSec{ width:100px}
.menu-container .logoSec img{ width:80%}
.menu-container{ padding:0}
.menu-container .callSec a.headCall, .menu-container .callSec a.headReg{ padding:5px 10px;}
.menu-container .callSec{margin-top:13px}
.mFooter .fooSec{ width:90%; padding:5%}
.mFooter .fooLogoFull .fooLogoSec{ width:90%;}
.mFooter .fooSec .fooCatg{ width:100%; padding:0; margin-bottom:20px}
.mFooter .fooSec{margin:0 auto}
.mFooter .fooLogoFull .fooLogoSec .copyRight, .mFooter .fooLogoFull .fooLogoSec .copyRight .crEach{ width:100%}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach{ width:100%; float:left; text-align:left !important; margin-bottom:20px}
.mFooter .fooLogoFull .fooLogoSec .copyRight .crEach{ margin:10px 0 0px}

}
@media only screen and (max-width: 480px) {
.logoHeaderFull .logoHeader .callSec{ width:auto !important; float:right !important; background-color:transparent !important; padding:0 !important;}
}



.whatsapp{ background-color:var(--green); padding:5px 10px; position:fixed; top:200px; right:-145px}
.whatsapp a{ float:left}
.whatsapp a img.img-fluid.lazyloaded{ margin:5px 15px 0 5px}
.whatsapp p{ float:left;}
.whatsapp p a{ color:var(--white); font:var(--font-f16R); line-height:20px}
.helpingSec .helping span a{ background-image:none !important; padding:18px 40px !important}