@font-face {
    font-family: 'CardoBold';
    src: url('fonts/CardoBold.eot');
    src: url('fonts/CardoBold.eot') format('embedded-opentype'),
         url('fonts/CardoBold.woff2') format('woff2'),
         url('fonts/CardoBold.woff') format('woff'),
         url('fonts/CardoBold.ttf') format('truetype'),
         url('fonts/CardoBold.svg#CardoBold') format('svg');
}

@font-face {
    font-family: 'SourceSansProRegular';
    src: url('fonts/SourceSansProRegular.eot');
    src: url('fonts/SourceSansProRegular.eot') format('embedded-opentype'),
         url('fonts/SourceSansProRegular.woff2') format('woff2'),
         url('fonts/SourceSansProRegular.woff') format('woff'),
         url('fonts/SourceSansProRegular.ttf') format('truetype'),
         url('fonts/SourceSansProRegular.svg#SourceSansProRegular') format('svg');
}

@font-face {
    font-family: 'SourceSansProSemiBold';
    src: url('fonts/SourceSansProSemiBold.eot');
    src: url('fonts/SourceSansProSemiBold.eot') format('embedded-opentype'),
         url('fonts/SourceSansProSemiBold.woff2') format('woff2'),
         url('fonts/SourceSansProSemiBold.woff') format('woff'),
         url('fonts/SourceSansProSemiBold.ttf') format('truetype'),
         url('fonts/SourceSansProSemiBold.svg#SourceSansProSemiBold') format('svg');
}



/*COMMON CSS==================================================*/
*, *:before, *:after{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
html{font-size:10px; width:100%; height:100%;}
body{ height:100%; width:100%; font-family: 'SourceSansProRegular';  font-weight:400; color:#000000; font-size:1.6rem; background-repeat:no-repeat; background-position:left top; background-size:cover; background-color:#ffffff;}
body,html,div,p,span,ul,li,ol,a,img,label,form,iframe,i,h1,h2,h3,h4,h5,h6{margin:0px; padding:0px; outline:0px; border:0px; text-decoration:none; list-style-type:none;}
/*--------------------*/
a{color:#000000;}
a:hover{color:#000000;}
h1,h2,h3,h4,h5,h6{display:inline-block; width:100%; font-weight:100;}
h1{font-size:2.6rem;}
h2{font-size:2.4rem;}
h3{font-size:2.2rem;}
h4{font-size:2.0rem;}
h5{font-size:1.8rem;}
h6{font-size:1.6rem;}
tr{ border-bottom:1px solid #A0A0A0;}
td{position:relative;}
em{ color:#000000;}

.go-top {
    position: fixed;
    cursor: pointer;
    bottom: 30px;
    right: 20px;
    font-size: 25px;
    color: #ffffff;
    background-image: url(../images/right.png);
    background-repeat: no-repeat;
    background-size: 10px;
    background-position:center;
    transform: rotate(-90deg);
    background-color: #000000;
    z-index: 1;
    display: none;
    width: 40px;
    text-align: center;
    height: 40px;
    line-height: 39px;
    border-radius: 50%;
    -webkit-transition: .4s;
    transition: .4s;
    box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.6);  -webkit-box-shadow: 0px 0px 10px 5px rgba(126, 71, 71, 0.6);  -moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.6);
}
.open-service-popup i{
    display: none;
}
.open-service-popup {
    position: fixed;
    cursor: pointer;
    bottom: 100px;
    right: 20px;
    font-size: 25px;
    color: #ffffff;
    background-image: url(../images/contact-mail.png);
    background-repeat: no-repeat;
    background-size: 26px;
    background-position:center;
    /* transform: rotate(-90deg); */
    background-color: #000000;
    z-index: 1;
    width: 40px;
    text-align: center;
    height: 40px;
    line-height: 39px;
    border-radius: 50%;
    -webkit-transition: .4s;
    transition: .4s;
    box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.6);  -webkit-box-shadow: 0px 0px 10px 5px rgba(126, 71, 71, 0.6);  -moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.6);
    }
    

.desk-only{ display: block !important;}
.mob-only{ display: none !important;}
/*--------------------*/
/*FORM ELEMENTS============================================================*/
input,textarea,select,form,label,button,div.select-box, div.select-box select,i.chk,i.rdo{margin:0px; padding:0px; outline:none; font-size:1.3rem; font-weight:400; }
/*----------*/
input[type=text], input[type=password], input[type=number], textarea{float:left; width:100%; font-size: 1.3rem; padding:10px; margin-top:5px; resize:none; -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s;border:0;border: 1px solid #e0e4e5; background-color: #f5f5f5; border-radius:5px; -webkit-border-radius:5px; -moz-appearance: none; -webkit-appearance: none;  appearance: none;}
button{outline:0;}
a img{border:0px;}
input:-webkit-autofill{-webkit-box-shadow: 0 0 0 1000px white inset !important; box-shadow: 0 0 0 1000px white inset !important; -webkit-text-fill-color: #333333;}
textarea{ border:0; background-color: #e0e4e5; padding:10px; height:100px;}
/*--------------------*/
th{font-weight:500; min-height:42px;}
/*ERROR MESSAGE==================================================*/
p.e{float:left; width:100%; margin:5px 0 0; padding:0; font-size: 1.2rem; line-height:1.6rem; color:red; font-weight:normal;}
/* .err input[type=text], .err input[type=password], .err textarea, .err .mx-list{ border:1px solid red;} */
/*--------------------*/
label{float:left; width:100%; margin-bottom:0; font-weight:500; /* text-transform:uppercase; */ color:#626262;font-size:1.4rem;}
p{float:left; width:100%; margin-bottom:20px; font-size:1.6rem; line-height:2.4rem; color:#454545;}

/*BUTTON CSS==================================================*/
a.button,
input.button,.mx-btn .btn
{display:inline-flex; justify-content: center; align-items:center; background-color:#000000; padding:10px 24px; color:#ffffff; border:1px solid transparent; cursor:pointer; text-transform:uppercase; transition:all ease-in-out 0.3s; min-width:80px; text-align:center; border-radius:5px; -webkit-border-radius:5px;}
a.button i,input.button.fa{font-size:1.4rem;}
a.button:hover,input.button:hover,.mx-btn .btn:hover{color:#000000; border:1px solid #000000; background-color: #ffffff;}
a.button:before,input.button:before{font-family:'FontAwesome';}
.button.fa-save:before{ display: none;}
/*BTN CSS==================================================*/
a.btn,input.btn{display:inline-block; margin-left:5px; height:28px; line-height:1; background:none; border:1px solid #bebebe; padding:7px 10px; color:#000000; cursor:pointer; text-transform:uppercase; font-weight:400; transition:all ease-in-out 0.3s; min-width:80px; text-align:center; vertical-align:top;}
a.btn:hover,input.btn:hover{color:#000000; border:1px solid #000000;}
a.btn:before,input.btn:before{font-family:'FontAwesome';}

/*DEL BUTTON CSS==================================================*/
a.del{display:inline-block; width:25px; height:26px; border:1px solid #ffffff; position:relative;}
a.del:before, a.del:after{ content:""; width:1px; height:14px; background:#ffffff; position:absolute; left:50%; top:50%; margin-left:-0.5px; margin-top:-7px; transition:all ease-in-out 0.3s;}
a.del:before{ transform:rotate(45deg)}
a.del:after{ transform:rotate(-45deg)}
a.del:hover{background:#000000; border:1px solid #000000 }
a.del:hover:before, a.del:hover:after{background:#000000;}
a.del:hover:before{ transform:rotate(-45deg); background:#fff; }
a.del:hover:after{ transform:rotate(45deg); background:#fff; }

/*ADD BUTTON CSS==================================================*/
a.add{display:inline-block; width:26px; height:27px; border:1px solid #a0a0a0; position:relative;}
a.add:after,a.add:before{content:""; width:1px; height:13px; background:#a0a0a0; position:absolute; left:50%; top:50%; margin-left:-0.5px; margin-top:-7px; transition:all ease-in-out 0.3s;}
a.add:after{width:1px; height:13px; margin-top:-7px; margin-left:0px; }
a.add:before{width:13px; height:1px; margin-top:-1px; margin-left:-6px; }
a.add:hover{background:#000000; border:1px solid #000000;}
a.add:hover:after, a.add:hover:before{ background:#fff;}
a.add:hover:after, a.add:hover:before{ transform:rotate(180deg);}

/*POPUP ----------------*/
.popup{position: fixed; width: 420px; height: 100%; overflow: auto; overflow-y: auto; scrollbar-width: thin; right: 0; top: 0; display: flex; justify-content: center; align-items: center; z-index: 10011; background: rgba(0,0,0,0.6);}
.popup  .body { display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: flex-start; position: relative;  min-width: 360px;  max-width: 60%;background-color: #ffffff;padding: 30px 20px;  border-radius: 15px;}
.popup a.del {right: 10px; top: 10px; position: absolute; border-radius: 100%; background-color: #000000; color: #ffffff; border:0;}
.popup .content { float: left; width: 100%; margin: 0px; padding: 0;  max-height: 75vh;  overflow: auto;  overflow-y: auto; scrollbar-width: thin;  font-size: 1.4rem; line-height: 1.8rem;}
.popup a.del:hover{ border: 0;}
.cta-wrap{ width: 100%; float: left; margin:0; padding:0; text-align: center;}
.popup h6{ margin-bottom: 20px;font-family: 'SourceSansProSemiBold'; font-size: 1.8rem;}

.popup.contact-popup{width:100%;}
.popup.contact-popup .body{width:90%; max-width:320px;}
.popup.contact-popup h3{margin-bottom: 30px;}



.popup.service-popup{width: 100%;}
.popup.service-popup .body{width: 20%;}
.popup.service-popup h3{width: 100%;
    float: left;
    line-height: 30px;
    margin-bottom: 15px;
    font-size: 24px;}
/*MX DIALOGUE==================================================*/
div.mxdialog,div#mxloader{ display: none; position:fixed; width:100%; height:100%; overflow:auto; overflow-y:auto;scrollbar-color:rgba(130,130,130,0.3) rgba(130,130,130,0.5);scrollbar-width:thin;left:0; top:0; display:flex; justify-content:center; align-items:center; background: rgba(0,0,0,0.6); z-index: 5;}
div.mxdialog h2.title{ float:left; width:100%; margin:0px; padding:0px;}
div.mxdialog div.body{ display:flex;  background:#fff; border:0px solid #A0A0A0; padding:20px 12px 20px 24px; flex-flow:row wrap; position:relative; max-width:400px; box-shadow:0px 0px 20px rgba(0,0,0,0.05);border-radius: 15px;}
div.mxdialog div.content{ float:left; width:100%; margin:0px; padding:0px 0px 0px 0px; max-height:75vh; overflow:auto; overflow-y:auto;scrollbar-color:rgba(130,130,130,0.3) rgba(130,130,130,0.5);scrollbar-width:thin; font-size: 1.4rem;}
div.mxdialog div.mx-btn{ float:none; display:inline-block; width: 100%; text-align:center; padding-top: 20px;}
div.mxdialog div.mx-btn a.button{ margin: 0px 5px;}
div.mxdialog h2{ float:left; width:100%; margin:0px 0px 20px 0px; padding:0px; font-size:1.8rem; font-weight:500; color:#000000; text-transform:uppercase; font-family: 'SourceSansProSemiBold';}
div.mxdialog textarea, div.mxdialog div.select-box select,
div.mxdialog input[type=text], div.mxdialog input[type=password],
div.mxdialog div.select-box:after{border:1px solid #dcdcdc;}
div.mxdialog h1,
div.mxdialog h3,
div.mxdialog h4,
div.mxdialog h5,
div.mxdialog h6{ float:left; width:100%; margin:0px 0px 20px 0px; padding:0px; font-size:1.6rem; font-weight:500; color:#000000; text-transform:uppercase;}
div.mxdialog ul{ margin:0; padding:0; position:relative; display:flex; flex-flow:row wrap;}
div.mxdialog ul li{ width:100%; margin-bottom:15px;}
div.mxdialog ul li.cta{ text-align:center;}
div.mxdialog ul li.cta input[type="button"], div.mxdialog ul li.cta .button{float:none; display:inline-block;}
div.mxdialog ul li:last-child{margin-bottom:0;}
div.mxdialog ul li.half{width:calc(50% - 10px); margin:5px 5px 15px;}
div.mxdialog ul li.one-third{width:calc(33.3333% - 10px); margin:5px 5px 15px;}
div.mxdialog ul li.one-fourth{width:calc(25% - 10px); margin:5px 5px 15px;}
div.mxdialog a.del{ position:absolute; width:27px; right:10px; top:10px; background:#000000; border-radius:100%; -webkit-border-radius:100%; border:0}
div.mxdialog a.del:before, div.mxdialog a.del:after{background:#fff;}
div.mxdialog input[type=text], div.mxdialog input[type=password], div.mxdialog textarea{background:#fafafa}




/*SELECT BOX CSS==================================================*/
div.select-box{ float:left; width:100%; height:38px; position:relative; border-bottom: 1px solid #e0e4e5; background:#ffffff; overflow:hidden; -webkit-transition:all ease-in-out 0.3s; -o-transition:all ease-in-out 0.3s; transition:all ease-in-out 0.3s; }
div.select-box select{float:left; width:100%; height:36px; padding:0px; outline:none;border:0; background:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:pointer; -webkit-transition:all ease-in-out 0.3s; -o-transition:all ease-in-out 0.3s; transition:all ease-in-out 0.3s;font-size: 1.3rem;}
div.select-box select option{background:#ffffff; color:#828282; padding:5px 20px; border:0px; cursor:pointer; border-bottom:1px solid #A0A0A0;}
div.select-box select option:hover{background:#ffffff;}
div.select-box:after{color:#000000; right:13px; top:5px; padding:0px; position:absolute; pointer-events:none;}
div.select-box:after{content:'\f0d7'; right:0px; top:0px; width:38px; height:36px; font-family:'FontAwesome'; position:absolute; pointer-events:none; display:block; border-left:1px solid #fafafa; background-color:#fff; text-align:center; line-height:38px; font-size:1.6rem; color:#a0a0a0; -webkit-transition:all ease-in-out 0.3s; -o-transition:all ease-in-out 0.3s; transition:all ease-in-out 0.3s;}
div.select-box:hover:after{color:#000000;}

/*MX-LIST CSS==================================================*/
.mx-list{ float:left; width:100%;  padding:0;}
.mx-list li ul{ margin-left:20px;}
.mx-list li{ padding:12px 7px 0px 0px !important; width:100%; float:left;}
.mx-list.linear li,
.linear li{width:auto; margin-right:10px;}

/*FILE UPLOAD==================================================*/
div.mx-file-upload {clear: both;float: left;width: 100%;padding: 5px;margin-top: 5px; }
div.mx-file-upload div.drop {float: right;width: 70px;height: 70px;background:#bebebe;text-align: center;vertical-align: middle; transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; -moz-transition: all ease-in-out 0.3s;}
table td div.mx-file-upload div.drop{ width:40px; height:40px;}
div.mx-file-upload div.drop:hover{ background:#000000;}
div.mx-file-upload div.drop a {display: block;/* background: #170F0F; */float: left;width: 100%;height: 100%;color: transparent;line-height: 14px;padding: 5px;cursor: pointer;background-image:url(../images/ico-upload-file.png); background-repeat:no-repeat; background-size:26px; background-position:center center; }
table td div.mx-file-upload div.drop a{ background-size:20px;}
div.mx-file-upload div.drop input {display: none;}
div.mx-file-upload ul{float: left;margin: 0px;padding: 0px;height: 100%;width: calc(100% - 80px);}
div.mx-file-upload ul li {position: relative;width:65px;height:66px;margin: 2px;float:left;background-color:rgba(220,220,220,0.7);background-size:50px; background-repeat:no-repeat; background-position:center; padding:0; border:1px solid #a0a0a0;}
div.mx-file-upload ul li a{float:left; width:100%; height:64px; text-align:center; background-repeat:no-repeat; background-position:center; background-size:70%;}
div.mx-file-upload ul li img{ max-width:100%; max-height:96%; }
div.mx-file-upload ul li a.del{font-size: 1.0rem;line-height: 15px;display: inline-block;position: absolute;width: 15px;height: 15px;right: -8px;top: -8px;background-color: #000000;color:white; border-radius: 50%;text-align: center; display:none; border:0; z-index:1}
div.mx-file-upload ul li:hover a.del{display:block;}
div.mx-file-upload a.del:before, div.mx-file-upload a.del:after{height:9px; margin-top:-4.5px; border:0; background:#fff;}
div.mx-file-upload ul li a.no-img{float:left; width:100%; height:100%; background-color:#A0A0A0; background-repeat:no-repeat; background-position:center; background-image:url(../images/no-file.png); background-size:cover; line-height:200px; overflow:hidden;}

a[ext="xlsx"]{ background-image:url(../images/ico-excel.png);}
a[ext="docx"]{ background-image:url(../images/ico-doc.png);}
a[ext="pdf"]{ background-image:url(../images/ico-pdf.png);}
a[ext="pptx"]{ background-image:url(../images/ico-ppt.png);}
a[ext="csv"]{ background-image:url(../images/ico-csv.png);}
a[ext="zip"]{ background-image:url(../images/ico-zip.png);}

a[ext="xlsx"] img,
a[ext="docx"] img,
a[ext="pdf"] img,
a[ext="pptx"] img,
a[ext="csv"] img,
a[ext="zip"] img{ display:none;}

/*SCROLL BAR CSS===================================*/
::-webkit-scrollbar{width:6px;height:4px;}
::-webkit-scrollbar-track{background:rgba(130,130,130,0.3);}
::-webkit-scrollbar-thumb{background:#000000;padding:0px 0px;}

/*PLACEHOLDER CSS====================================*/
::-webkit-input-placeholder { color:#999999}
::-moz-placeholder {color:#999999}
:-ms-input-placeholder {color:#999999}
:-moz-placeholder {color:#999999;}

/*PROGRESS BAR==================================================*/
div#mxloader{display: block; z-index:6;}
div#mxmsg{display: none; min-height: 30px; min-width: 100%; padding: 10px; text-align: center; vertical-align: middle; font-size: 2.0rem; color: #000000; background-color: #FFF;}
div.progress{display:block; width:100%; height:1px; margin:0; padding:0; position:absolute; top: 50%; background:#828282; display: none;}
.spinner { width: 100%; height: 100%; background-image: url(../images/loader.svg); background-repeat: no-repeat; background-position: center; font-size: 1.8rem; line-height: 1.8rem; text-align: right; vertical-align: top; color: #dc0000; padding: 3px;}
.spinner div{display:none;}

fieldset { float:left; width:calc(100% - 30px); margin-left:15px; border:2px solid #dcdcdc; padding:15px;}
fieldset legend{ font-size:1.8rem;}
fieldset legend h3{ font-size:100%}
img{ max-width:100%;}

/*CUSTOM CHECKBOX CSS==================================================*/
i.chk{display: inline-block; vertical-align:top; width:auto; min-width:20px; min-height:20px; position:relative; padding-left:20px; margin-bottom:0px; font-style: normal; position: relative; z-index: 1; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; user-select: none; text-transform:none !important; line-height:1.4rem}
i.chk input{position:absolute; opacity:0; cursor:pointer; height:100%; width:100%;top: 0;left: 0; z-index: 2;}
i.chk em{position:absolute; top:0px; left:0; height:20px; width:20px;/*  background-color:#d9dee0; */border: 1px solid #000000; z-index: 0; font-style: normal}
/* i.chk:hover input ~ em{background-color:#d9dee0;} */
i.chk input:checked ~ em{background-color:#000000;}
i.chk em:after{content:""; position:absolute; display:none;}
i.chk input:checked ~ em:after{display: block;}
i.chk em:after{left: 7px; top: 2px; width: 5px; height: 11px; border:solid white;border-width:0 2px 2px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);}

/*CUSTOM RADIO CSS==================================================*/
i.rdo{display: inline-block; width:auto; min-width:14px; min-height:14px; position:relative; padding-left:20px; margin-bottom:0px;  font-style: normal; position: relative; z-index:1; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; user-select: none; text-transform:none !important;margin-right: 20px;font-size: 1.6rem; }
i.rdo input{position:absolute; opacity:0; cursor:pointer; height:100%; width:100%;top: 0;left: 0; z-index: 2;}
i.rdo em{position:absolute; top:2px; left:0; height:14px; width:14px; background-color:#d9dee0; z-index: 0;  font-style: normal}
i.rdo:hover input ~ em{background-color:#d9dee0;}
i.rdo input:checked ~ em{background-color:#d9dee0;}
i.rdo em:after{content:""; position:absolute; display:none;}
i.rdo input:checked ~ em:after{display: block;}
i.rdo em:after{left:5px;top:2px; width:4px; height:8px; border:solid 2b5d85;border-width:0 2px 2px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);}
i.rdo input[type=radio] ~ em{ border-radius:100%;}
i.rdo input[type=radio] ~ em:after{ top: 3px; left: 3px;  width: 8px; height: 8px;border-radius: 50%;background: #000000;}
/*COMMON CSS ENDS====================================*/

.container{float:left; width:100%; padding-top:120px}
.crz-ecom{overflow: hidden;}
section{float:left; width:100%; margin:0; padding: 0; position: relative;/* height: 100%; */}
.wrap980{max-width:980px; width:100%; margin: 0 auto;}
.wrap720{max-width:720px; width:100%; margin: 0 auto;}
.wrapper{max-width:1200px; width:100%; margin: 0 auto;}
.wrap414{max-width:414px; width:100%; margin: 0 auto;}
.flx{display: flex; justify-content: center; align-items:center;}
.pLR15{ padding-left: 15px; padding-right: 15px;}
.pL15{ padding-left: 15px; }
.pTB50{ padding-top: 50px; padding-bottom: 50px;}
.pTB60{ padding-top: 60px; padding-bottom: 60px;}
.pB15{padding-bottom: 15px;}
.pad-0{ padding: 0;}
.mar-0{ margin: 0 !important;}
.marBT-10{ margin-bottom:10px}
.txt-right{text-align: right;}
.txt-center{text-align: center;}
.txt-left{text-align: left;}
.sdbr-content{ width: 100%; float: left; margin: 0; padding: 0;}
.col-5{ width: 5%; float: left;}
.col-10{ width: 10%; float: left;}
.col-15{ width: 15%; float: left;}
.col-20{ width: 20%; float: left;}
.col-25{ width: 25%; float: left;}
.col-30{ width: 30%; float: left;}
.col-40{ width: 40%; float: left;}
.col-45{ width: 45%; float: left;}
.col-50{ width: 50%; float: left;}
.col-55{ width: 55%; float: left;}
.col-60{ width: 60%; float: left;}
.col-65{ width: 65%; float: left;}
.col-70{ width: 70%; float: left;}
.col-75{ width: 75%; float: left;}
.col-80{ width: 80%; float: left;}
.col-85{ width: 85%; float: left;}
.col-90{ width: 90%; float: left;}
.col-100{ width: 100%; float: left;}
.row{ width: 100%; display: flex; align-items: center; flex-flow: row wrap; border-bottom:1px solid #e0e4e5; margin-bottom: 20px; padding-bottom: 20px;}
.col-wrap{ width: 100%; display: flex; align-items: center; flex-flow: row wrap;}
.row .checkbox-disabled *:not(input){opacity:0.7;pointer-events: none;}

.addOn-row .col-wrap .col-65{padding-left:10px; padding-top:3px;}
.addOn-row .col-wrap .col-30{text-align:right;}

.row p.min-addon-limit{font-size:1.2rem}

.row h6{ font-size: 1.4rem;font-family: 'SourceSansProSemiBold'; margin: 0;}
.row h4{ font-size: 1.8rem;font-family: 'SourceSansProSemiBold'; margin: 0 0 10px;}
.row ul{ width: 100%; float:left; margin: 0; padding: 0; list-style-type: none;}
.row ul li{ width: 100%;  display: flex; align-items: center; flex-flow: row wrap; margin: 0; padding: 0; list-style-type: none;}
.row p{ margin: 0;}
.vtop{align-items:flex-start;}
.hide-header{ padding: 0;}
.hide-header header{display:none}
.disable{opacity:0.5;}
.link-btn{color:#000000;font-weight:600;}
/*switch button======================*/
label.switch { position: relative; display: inline-block; width: 50px; height: 20px; vertical-align: middle; margin-left: 0;  margin-bottom: 0;float: none;}
.switch input { display: none;}
.round { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #d6d9dc; -webkit-transition: .4s; transition: .4s; border-radius: 34px;}
input:checked+.round { background-color: #000000;}
.round:before { position: absolute; content: "";  height: 24px;  width: 24px; left: -2px;  bottom: -2px; background-color: #ffffff; -webkit-transition: .4s; transition: .4s;  border-radius: 50%; box-shadow: 0 0 10px rgba(0,0,0,0.5);}
input:checked+.round:before {-webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px);}
/*switch button end======================*/
/* .feature .slick-prev, 
.feature .slick-next {position:absolute;width: 50px; height: 50px; top: 50%; background-color: #000000;opacity: 0.8;background-repeat: no-repeat;background-position: center;background-size: 10px;overflow: hidden; text-indent: -100px;z-index: 1;border:0; cursor: pointer;}
.feature .slick-prev:hover, 
.feature .slick-next:hover{opacity:1;}
.feature .slick-prev{background-image:url(../images/left.png);left:0;}
.feature .slick-next{background-image:url(../images/right.png);right:0} */


.slick-prev, 
.slick-next {position:absolute;width: 50px; height: 50px; top: 50%; background-color: #000000;opacity: 0.6;background-repeat: no-repeat;background-position: center;background-size: 10px;overflow: hidden; text-indent: -100px;z-index: 1;border:0; cursor: pointer;}
.slick-prev:hover, 
.slick-next:hover{opacity:1;}
.slick-prev{background-image:url(../images/left.png);left:0;}
.slick-next{background-image:url(../images/right.png);right:0}

/* .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { background-image: url(../images/left.png); left: 0;} */


.coupon-list ul.slick-dots{float:left; width:100%; margin:0px; padding:0px; position:absolute;text-align:center; left:0; bottom:0; z-index:1; }
.coupon-list ul.slick-dots li{ display:inline-block !important; float:none !important; opacity: 1 !important; background:none; width:auto !important; height:auto; outline:none; margin:0px 5px !important; opacity:1; padding: 0;}
.coupon-list ul.slick-dots li button{ background:transparent; border:1px solid #000000; width:12px; height:12px; padding:0; border-radius:100%; -moz-border-radius:100%; -webkit-border-radius:100%; line-height:50px; overflow:hidden}
/* .coupon-list ul.slick-dots li button:before{ background:none; color:#fff} */
.coupon-list ul.slick-dots li.slick-active button{ background:#000000;}
.coupon-list ul.slick-dots li.slick-active button:before{color:#000000;}
.coupon-list .slick-track{ padding-right: 100px;}


ul.slick-dots{float:left; width:100%; margin:0px; padding:0px; position:absolute;text-align:center; left:0; bottom:-20px; z-index:1; }
ul.slick-dots li{ display:inline-block !important; float:none !important; opacity: 1 !important; background:none; width:auto !important; height:auto; outline:none; margin:0px 5px !important; opacity:1; padding: 0;}
ul.slick-dots li button{ background:transparent; border:1px solid #000000; width:12px; height:12px; padding:0; border-radius:100%; -moz-border-radius:100%; -webkit-border-radius:100%; line-height:50px; overflow:hidden}
/* ul.slick-dots li button:before{ background:none; color:#fff} */
ul.slick-dots li.slick-active button{ background:#000000;}
ul.slick-dots li.slick-active button:before{color:#000000;}


/* .title { width:100%; margin: 0 0 30px; padding: 30px 0 0; color: #000000; font-size: 4.5rem;position: relative; text-align: center;font-family: 'CardoBold';} */
/* .title:before{content:"";display: inline-block; position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: url(../images/title-img.png) no-repeat; background-size: 100%; width:140px; height: 32px;} */

.title { width:100%; margin: 0 0 30px; padding: 0px 0 20px; color: #000000; font-size: 4.5rem;position: relative; text-align: center;font-family: 'CardoBold';;}
/* .title:after{content:"";display: inline-block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width:140px; height: 10px; border-top:1px solid #666666; border-bottom:1px solid #666666;} */

.button.slvr{border:1px solid #e8ecef; background-color: #e8ecef; color:#222222;}
.button.slvr:hover,
.button.slvr.active{border:1px solid #e8ecef;}

/*HEADER CSS START====================================*/
header{display: flex; justify-content: center; align-items: center; width:100%; height:120px; margin:0; padding:0; position:fixed; left:0; top:0; background-color: #ffffff; z-index: 2; box-shadow: 0px 0px 25px rgba(0,0,0,0.2);}
header .wrap980{display:flex; justify-content: space-between; align-items: center; max-width:1100px}
.logo{float:left; height: 120px; }
.logo img{width: auto; max-width: inherit; height: 100%;padding: 5px 0;}
.menu-wrap{display: flex; justify-content:center; align-items:center; width:100%;}
.menu-wrap ul{display: flex; justify-content:center; align-items:center;flex:1;flex-flow: row wrap;}
.menu-wrap ul li{margin:0px 10px;}
.menu-wrap ul li a{display:inline-block; font-size:1.6rem; font-family: 'SourceSansProRegular'; border:1px solid transparent; padding:10px; transition: all ease-in-out 0.3s;}

.social{display: inline-flex; justify-content:center; align-items:center;}
.social ul{display: flex; justify-content:center; align-items:center;}
.social ul li{  padding: 0px;margin:0px; position: relative;}
.social ul li .fa{ font-size: 22px;}
header .wrapper{display:flex;}
.social ul li img{ width:20px;}
.social ul li.cart span{width: 15px; height: 15px; background: #000000; border-radius: 100%; position: absolute; font-size: 10px; text-align: center; line-height: 15px; color: #ffffff; right: 0; top: 3px;}
#nav-icon { position: relative; width: 30px; height: 20px; cursor: pointer; z-index: 98; display: none; }
#nav-icon span { display: block; position: absolute; height: 2px; width: 50%; background: #262626; opacity: 1; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transition: all .35s ease-in-out; -o-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
#nav-icon span:nth-child(even) { left: 50%; }
#nav-icon span:nth-child(odd) { left: 0; }
#nav-icon span:nth-child(1), #nav-icon span:nth-child(2) { top: 0; }
#nav-icon span:nth-child(3), #nav-icon span:nth-child(4) { top: 8px; }
#nav-icon span:nth-child(5), #nav-icon span:nth-child(6) { top: 16px; }
#nav-icon.open span { background: #262626; }
#nav-icon.open span:nth-child(1), #nav-icon.open span:nth-child(6) { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
#nav-icon.open span:nth-child(2), #nav-icon.open span:nth-child(5) { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
#nav-icon.open span:nth-child(1) { left: 4px; top: 5px; }
#nav-icon.open span:nth-child(2) { left: calc(50% - 4px); top: 5px; }
#nav-icon.open span:nth-child(3) { left: -50%; opacity: 0; }
#nav-icon.open span:nth-child(4) { left: 100%; opacity: 0; }
#nav-icon.open span:nth-child(5) { left: 4px; top: 12px; }
#nav-icon.open span:nth-child(6) { left: calc(50% - 4px); top: 12px; }
/*HEADER CSS END====================================*/

/*FOOTER CSS START====================================*/
footer{width: 100%; float: left; margin: 0; padding: 0;}
.top-footer{width: 100%; float: left; margin: 0; padding: 30px 0;}
.footer-info{ width: 100%;  display: flex; justify-content: center; align-items: center; flex-flow: row wrap; margin: 0; }
.footer-info .left{ width:75%; display: flex;  align-items: center; margin: 0; padding: 0;flex-flow: row wrap;}
.footer-info .right{ width:25%; float: left; margin: 0; padding: 0;}
.footer-info .left ul{width: 75%; float: left; margin: 0; padding: 0 0 0 20px;}
.footer-info .left ul li{width: 100%; display: flex;  margin: 0 0 15px; padding: 0; position: relative;}
.footer-info .left ul li span{ width: 25px; margin-right: 10px; display: inline-block; text-align: center;}
.footer-info .left ul li p{ margin:0; font-size: 1.6rem;}
.footer-info .left ul li p a{ display: inline-block; color: #000000;}
.footer-info .left ul li .fa{ color:#cfc8c3; font-size: 2.2rem;}
.foot-stripe{width:100%; float:left; margin:0;background-color: #e8e8e8; padding: 10px 0;}
.foot-stripe p{ font-size: 1.2rem; margin: 0; color: #808080;}
.foot-stripe p a{ color: #808080;}
.foot-stripe p a:hover{ color: #808080;}
.foot-stripe .left,.foot-stripe .right{width:50%; float: left;}
footer .title{ margin: 0;}
.foot-stripe .social a{display: inline-block; font-size: 1.6rem; font-family: 'SourceSansProRegular'; border: 1px solid transparent;
    padding: 0 10px; transition: all ease-in-out 0.3s;}
/*FOOTER CSS END====================================*/

/*HOME SLIDER===========*/
.hm-sldr {float:left; width:100%;}
.hm-sldr ul{float:left; width:100%; margin:0; padding:0; position: relative; list-style-type:none;}
.hm-sldr ul li{float:left; width:100%; margin:0; padding: 0; position: relative;}
.hm-sldr ul li a{float:left;  position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);}
.hm-sldr ul li img{width:100%;}
/*HOME SLIDER END===========*/

/*OUR STORY===========*/
p:empty{margin:0;}
.our-story{ display: flex; justify-content: center; align-items: center;}
.our-story.pTB60{padding-bottom: 0;}
.our-story .wrap720{display:flex; text-align:center; margin-top:-12%; flex-flow:row wrap; background-color: #fff; padding:40px 0; border-radius: 10px; -webkit-border-radius: 10px;}
.our-story .data p {
text-align: justify !important;
}
/*OUR STORY END===========*/

/*PROMO SECTION===========*/
.promo-sec{ background-color: #000000;}
.promo-sec .flx{flex-flow:row-reverse; align-items: stretch;}
.promo-sec .img-box{ width: 40%; height:100%;}
.promo-sec .data{ width: 60%; height: 100%; align-self: center;}
/* .promo-sec img{max-width:100%; float:right; height:100%; object-fit: cover;} */
.promo-sec img{max-width:100%; float:right; width:100%;}
.promo-sec .data{padding: 0px 100px ;}
.promo-sec .title{text-align: left; color: #ffffff; margin-top:15px;}
.promo-sec .button.slvr{margin-bottom:15px;}
.promo-sec .title:before{left:0; transform: translateX(0);}
.promo-sec .title:after{left:0; transform:translate(0); border-top:1px solid #fff; border-bottom:1px solid #fff;}
.promo-sec p{ color: #ffffff;}
.promo-sec .promo-sldr,
.promo-sec .promo-sldr li,
.promo-sec .slick-list,
.promo-sec .slick-track{height:100%;}

/*PROMO SECTION END===========*/

.container section.feature{align-items: flex-start;}
.thumbsldr{ width: 100%; float: left; margin: 0; padding: 0; list-style-type: none;}
.thumbsldr.slick-dotted.slick-slider{margin: 0;}
.thumbsldr li{ width: 25%; float: left; margin: 0; padding: 0; list-style-type: none;}
.thumbsldr li img{ max-width: 100%;}

/*HUNGRY SECTION===========*/
.hugry{ text-align: center;}
/*HUNGRY SECTION END===========*/

/*MAP SECTION===========*/
.map{height: 640px; overflow: hidden;}
.map img{ width:100%; height: 100%; object-fit: cover; object-position: center;}
.map iframe{ width: 100%;height: 100%;}
/*MAP SECTION END===========*/

/*404 page ===============================================================*/
.page-404{width: 100%;float: left; display: flex; justify-content: center;  height: 100vh; flex-flow: row wrap;margin-top:-120px;}
.page-404 .content{width: 100%;height: 100%;display: flex; justify-content: center;  align-items: center; flex-flow: row wrap; text-align: center;}
.page-404 .content .img-box{width: 100%;height: 100%; float: left; margin: 0; padding: 0;}
.page-404 .content .img-box img{width: 100%;height: 100%;object-fit: cover;object-position: center;}
.page-404 .content .data{position: absolute; width: 100%; float: left; margin: 0; padding: 0;max-width: 600px;}
.page-404 h1{font-family: 'Titillium Web', sans-serif;font-size:24rem; line-height: 1;letter-spacing: 2px;margin-bottom:15px;color:#000000;}
.page-404 h3{font-size:3.6rem;text-transform: uppercase;font-family: 'SourceSansProSemiBold';margin-bottom: 10px;}
.page-404 p{font-size: 1.8rem;}
.page-404 a.button{margin-top:15px;}
/*SIDEBAR===============================================================*/

/*DELIVERY----------------*/
.delivery{height: 100%; display: flex; align-items: center;}
.img-box{ width:100%; float: left; margin:0; padding: 0;}
/* .img-box img{ max-width: 100%;} */
.data{ width:100%; float: left; margin:0; padding: 0 30px;}
.delivery .logo{ float: none; margin:0 auto; padding: 25px 0; width: 150px;height: auto; }
.delivery .logo img{ width: 100%; }
.delivery .button{ display: flex; margin-bottom: 20px;}
.delivery .data{display: flex; flex-direction: column; flex-wrap: wrap;}
.delivery .img-box{ height: 200px; display: flex; flex-direction: column; flex-wrap: wrap;}
.delivery .img-box img{width: 100%; height: 100%; object-fit: cover; object-position: center;}
.popup.order-now .mx-list li{width: auto;}
.popup.order-now .form-list li{ margin-bottom:10px;}
.popup.order-now label{ display:none;}

.pin-input{ width:100%; float: left; margin: 0; padding: 0;}
.pin-input ul { width: 100%; display: flex; justify-content: center;}
.pin-input ul  li{ width: 25%; padding: 0 12px;}
.pin-input li input { padding: 0 10px; line-height: 50px; text-align: center; background: #f2f3f7; }

/*LOCATION----------------*/
.Current-Location{background-color: #e0e4e5;}
.search-box{ width:100%; float: left; margin: 0; padding:15px 0; position: relative;}
.search-box label{ display:none}
.location .search-box ul li { padding:0;}
.search-box input{  padding: 10px 35px 10px 15px; background-color: #e0e4e5; border:0;}
.search-box a { display: flex; align-items: center; justify-content: center; position: absolute; right: 0; top: 50%; transform: translateY(-50%); padding: 0; background: none; color: #000000; width: 35px; height: 35px; }
.search-box a.button:hover{color: #000000; border:none;  background-color: transparent;}
.search-box  a .fa{font-size: 2.0rem;}
.location ul { width: 100%; float: left; margin: 0; padding: 0;}
.location ul li{ width: 100%; display: flex; align-items: center; margin: 0; padding:7px 15px; border-bottom: 1px solid #e0e4e5;}
.location ul li a{width: 100%; display: flex; align-items: center;}
.loc-data{flex:1;}
.loc-data p{ margin: 0;}
.loc-ico{ width: 25px; height: 25px;display: flex; justify-content: center; align-items: center; background-color: #ffffff; border-radius: 100%;-webkit-border-radius: 100%;}

/*ADDRESS----------------*/
.address i.rdo em{ top:5px}
.sdbr-hdr{ width: 100%; float: left; padding: 0; display: flex;  align-items: center; flex-flow: row wrap;padding: 20px 0px;}
.sdbr-hdr a{width:auto;  /* color: #454545; */}
.sdbr-hdr .gps-ico{ width:25px;display: inline-block;}
.sdbr-hdr .user-mob{ width:100%; float: left;; padding:0;font-size: 1.4rem; font-family: 'SourceSansProSemiBold';color: #000000;}

.ico{ width: 25px; float: left; margin: 0 12px 0 0; padding: 0;}
.sdbr-hdr h5{flex: 1; color: #454545;}
.form-list{ width: 100%; float: left; margin: 0; padding: 0; list-style-type: none;}
.form-list li{ width: 100%; float: left; margin: 0 0 20px; padding: 0 ; list-style-type: none;}
.form-list li:first-child{border:0;}
.form-list li:first-child .form-field{padding: 10px 0;}
.form-list li input{  padding: 10px;}
.form-list li:last-child{ border:0;}
.form-list li:last-child label{ margin-bottom: 10px;}
.form-field{ width: 100%; float: left; margin: 0; padding: 0;}
.address .mx-list li{ width:auto}
.address .mx-list{ padding: 0;}

.form-list li.pin { width: 30%; margin-bottom: 5px; }
.form-list li.mobile { width: 70%; padding-left: 15px; margin-bottom: 5px; }
.form-list li.mobile.full {width: 100%; padding-left: 0px; margin-bottom: 20px; }
.form-list li.pin.info, .form-list li.mobile.info { margin-bottom: 20px; }
.form-list li.pin.info label, .form-list li.mobile.info label { color: #999; font-style: italic; font-size: 1.2rem; }

/*LOGIN----------------*/
.form-list.login-frm li:first-child .form-field{padding: 0;}
ul.form-list.login-frm { display: flex; flex-wrap: wrap; }

/*MY PROFILE----------------*/
.profile .form-list li:first-child .form-field { padding:0;}
.profile-info{ width:100%; float: left; margin: 0; padding: 0;}
.profile-info h4{ margin-bottom:0;}
.profile-info .col-85{ padding-left: 20px;}
.profile-info .col-15{ position: relative;}
.profile-info .col-15 span{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; display: inline-block; font-size: 2.4rem;font-family: 'OpenSansBold'; color:#ffffff; margin: 0;}
.profile .form-list li .col-75 {border-left: 1px solid #e0e4e5; padding-left: 10px;}
.country-flag .col-10 input {text-align: center;}
.country-flag  input {border:0}
/*PRODUCT LIST----------------*/
.product-wrap{ width: 100%; float:left; margin: 0; height: 100%; }
.product-wrap .pLR15{  display: table;}
.product-wrap .sdbr-hdr{padding: 0px 0px 15px;}
.product-wrap .sdbr-content { display: flex; flex-flow: column wrap; height: 100%; }
.search-prod-wrap { display: flex; flex-flow: row wrap; padding: 15px; width:100% }

.marchant-info{ width: 100%;float: left; margin: 0; padding: 0;}
.marchant-info .col-100 p{ margin: 10px 0;}
.marchant-info .icon p{ width: auto; display: inline-block; position: relative; padding-left: 10px;}
.marchant-info .icon  span{ width: 20px; display: inline-block; float: left;}
/* .marchant-info .icon p.time:before{content:""; display: inline-block; position: absolute; left: 0; top: 4px; background: url(../images/icons/ico-10.svg) no-repeat; background-size: 100%; width: 15px; height: 15px;}
.marchant-info .icon p.cart:before{content:""; display: inline-block; position: absolute; left: 0; top: 4px; background: url(../images/icons/ico-9.svg) no-repeat; background-size: 100%; width: 15px; height: 15px;} */

.coupon-list{ width: 100%; display: flex; align-items: center; flex-direction: row; overflow-x: auto; padding:15px 15px 45px; background-color: #f5f5f5; z-index: 1; scrollbar-width: thin;
scrollbar-color: #2b5d85 #999999; justify-content: center; margin: 0 !important;}
.coupon-list .slick-list { padding-right: 60px; }
.coupon-list li { width: 100%; margin: 0; margin-right: 15px; padding: 15px;background: #ffffff; border-radius: 20px; position: relative;}
.coupon-list li .row{ margin: 0; padding: 0;}
.coupon-list li h3{ font-size: 1.6rem; color: #000000; padding: 0 0 5px; text-transform: uppercase; font-weight: bold;}
.coupon-list li p{ color: #ababab; padding: 0 0 5px; }
.coupon-list li span.check{ display: inline-block;  width: 20px;  position: absolute; top: 10px; right: 10px;}
.coupon-list li span.label{ display: inline-block;  width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; border-radius: 100%; -webkit-border-radius: 100%; background: #f5f5f5;  }
.coupon-list li span.label .svg { width: 20px; }

.tab-list{ width: 100%; display: flex;  align-items: center;  flex-direction: row; overflow-x: auto; padding: 0 0 10px 0; position: sticky;/*  top: 0; */ background-color: #ffffff; z-index: 1;scrollbar-width:thin;scrollbar-color:#000000 #999999;}
.tab-list li{ width: auto;  margin: 0; padding: 0 8px 0 0;}
.tab-list li:last-child{ padding: 0;}
.tab-list li .button{ display: flex; padding: 6px; white-space: nowrap; font-size:12px;}
.tab-list li.active .button{color: #000000; border: 1px solid #000000; background-color: #ffffff;}

.prod-list-wrap { display: flex; width: 100%; flex-flow: row wrap; flex: 1; overflow: auto; align-content: flex-start; }
/* .prod-list-wrap .search-box { padding: 15px; } */
.prod-list-wrap .search-box a { right: 15px; }
.prod-list-wrap .marchant-info { padding: 0 15px; }
/* .prod-list-wrap .search-box { position: sticky; top: 0; z-index: 9; background: #fff; } */
/* .prod-list-wrap .prod-list-sticky {    width: 100%; position: sticky; top: 0; z-index: 9; background: #fff;  padding: 0 15px;} */

.prod-list-wrap .prod-list-sticky {    width: 100%; z-index: 9; background: #fff;  padding: 0 15px;}

.prod-sticky {position: sticky;  top: 0;}
.prod-sticky-safari {position: absolute;top:80px;}
.prod-list{width: 100%; float: left; padding: 0 15px; }
.prod-list h3{font-size:16px; margin-bottom: 15px;}
.prod-list li{width: 100%; display: flex;  align-items: flex-start; flex-flow: row wrap; margin: 0 0 15px; padding: 0 0 15px; border-bottom: 1px solid #e0e4e5; }
.prod-list li .img-box{ width: 80px; height: 80px; border-radius: 6px; -webkit-border-radius: 6px; overflow: hidden; position: relative;}
.prod-list li .img-box img{width: 100%; height: 100%; object-fit: cover; object-position: center;}

.prod-info {flex: 1; padding:0 15px;}
.prod-info h6 { font-size:1.4rem;   font-family: 'SourceSansProSemiBold';}
.prod-info p { margin: 0; text-align: left; color: #707070;}
.prod-info strong {color: #000000; }
.prod-info strong span {color: #a7a9aa; display: inline-block; text-decoration: line-through;}
.prod-info .special-off{color: #000000;float: left; position: relative; margin: 0; padding: 0 0 0 18px;}
.prod-info .special-off:before{content:""; position: absolute; left: 0; top: 0; color:#000000 ; background:url(../images/star.png) no-repeat; background-position: center; width: 15px; height: 15px; background-size: 100%;}

.count-btn{ width: 80px; height: 40px;display: flex; align-items: center; justify-content: center; border:1px solid #000000; border-radius: 6px;}
.count-btn input{ border:0; padding: 0; text-align: center; width:25px; background:transparent;margin: 0;}
.count-btn button{background: none; border: 0; font-size: 1.4rem; color:#000000 ; height: 100%; padding:0 10px; line-height: 38px; cursor: pointer;font-weight: 600;}
.count-btn button.add-btn{ font-size: 1.4rem;}

.count-wrap{display: flex; flex-flow: row wrap; justify-content: flex-end; width: 100px; }
.count-wrap p{ color:#000000;font-family: 'SourceSansProSemiBold'; text-align: right; margin: 5px 0 0; font-size:12px;}

.sticky-btn{ width: 420px; float: left; position: fixed; right: 0; bottom: 0; background-color: #ffffff; padding: 15px; display: flex; align-items: center; flex-flow: row wrap; justify-content: center;z-index: 2;box-shadow :0px 0px 30px rgba(0,0,0,0.3);}
.sticky-wrap{ width: 100%;display: flex; align-items: center; flex-flow: row wrap; justify-content: center;background: #d9dee0;border-radius: 5px;}
.sticky-btn .button{display: flex; min-width: 100%;}
.product-wrap .sticky-btn { position: static; width: 100%; }
.product-wrap .sticky-btn .button{ min-width: 60%;}
.sticky-btn span{display: inline-block; background: #d9dee0; padding: 10px 15px;  width: 40%; border-radius: 5px; text-align: center;flex:1;}

.category-product h3{ font-size:2.0rem; font-weight: 800;margin:15px 0 30px; }

.discount-msg{ text-align: center; position: relative;color:#000000 ; display: inline-block;float: none; width: auto;}
.discount-msg:after { content: ""; display: inline-block; background-color:#000000 ;; width: 100%; height: 6px;  position: absolute;  left: 0;  bottom: -10px;  border-radius: 40px; overflow: hidden;}

.row.loyalty{align-items: flex-start;}
.row.loyalty .col-95{width: 95%; padding-left: 11px;}
.row.loyalty .ico-wrap{padding-top: 5px;}


/*PRODUCT DETAIL----------------*/
.prod-detail{ height: 100%;}
.prod-detail .img-box{ height: 240px;}
.prod-detail .img-box img{width: 100%; height: 100%; object-fit: cover; object-position: center;}
.description{ width: 100%; float: left; margin: 0; padding: 50px 15px 70px;}
.description .col-60{width: 60%;}
.description .col-40{width: 40%;}

.description h4{font-family: 'SourceSansProSemiBold'; font-size: 1.8rem; margin-bottom: 15px;}
.description .count-btn{ float:right;}
.description i.chk{padding-right: 30px;float: right;}
.description i.chk em{right: 0; left:auto}
.prod-detail .sticky-btn .button{display: flex; min-width: 100%;}
.prod-detail .sdbr-hdr{position: absolute; top: 0;left: 15px;}
.prod-detail .row h6.marBT-10{margin-bottom: 10px;}
.addon-req{ padding: 0 !important;}
/*checkout-----------------------------*/
.checkout{ padding-bottom: 70px;overflow-x: hidden;}
.checkout .sdbr-hdr .ico{width: 25px;text-align: left;} 
.checkout .ico{ width:35px; float: left; text-align: center;}
.checkout .row{margin-bottom: 15px; padding-bottom: 10px; align-items: flex-start; }
.checkout .col-20 {text-align: right;}
.checkout .row ul li{ margin-bottom: 15px;}
.checkout .row ul li .col-25 p{text-align: right;}
.checkout .row ul li.grand-total{justify-content: space-between;}
.checkout .row ul li.grand-total .col-50{width: auto;}
.checkout .count-btn{width: 100%; height: 30px;opacity:0;visibility: hidden;}
.checkout .count-btn button{line-height: 28px;}
.checkout .count-btn input{width: 30px;}
.counter-wrap{width:auto;position:relative;}
.add-btn{right: 0;font-size: 1.6rem;display: inline-block;color: #000000;font-weight: 600;position: absolute;top: 50%;transform: translateY(-50%); border-radius: 2px;border: 1px solid #000000;padding: 6px 8px;line-height: 1.4rem;}
.bor-0{ border:0;}
.counter-wrap.active .count-btn{opacity:1;visibility: visible;}
.counter-wrap.active .add-btn{opacity:0;visibility: hidden;}
.checkout .col-100 h6{text-align: center;font-family: 'SourceSansProSemiBold'; margin-bottom: 25px; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; }
.checkout .col-100 h6 img{vertical-align: middle; margin-right: 10px;}
.checkout .col-100h6 span{display: inline-block; vertical-align: middle;}
.checkout .sticky-btn .button { display: flex; min-width: 100%;}
.checkout .popup .content{text-align: left; padding: 0;}
.checkout .popup .content.order-msg{text-align: center;}
.checkout .popup .img-box{margin-bottom: 20px;}
.checkout .popup .img-box img{width: 90px;}
.checkout .popup h4{color:#000000;margin-bottom: 20px;font-family: 'OpenSansBold';text-decoration: underline;}
.checkout .popup a{ text-decoration: underline;font-family: 'SourceSansProSemiBold';}
.checkout .popup p{font-family: 'SourceSansProSemiBold';}
.checkout .popup .cta-wrap a{ text-decoration: none;}
.ico-wrap{ width:35px; display: inline-block; padding-right: 10px;}
/*Basket-----------------------------*/
.Basket{ padding-bottom: 70px;}
.Basket .col-20{ text-align: right;}
.Basket .row ul li{justify-content: space-between; padding-bottom: 5px; align-items: flex-start;}
/* .Basket .cart-data .row ul li{ align-items: flex-start;} */
/* .Basket .row ul li .col-50{width: auto;} */
.pad-0{ padding: 0;}
.Basket .row ul li.total{padding-top:10px; margin-top:10px;border-top:1px solid #e0e4e5;}
.Basket .row ul li.total .col-50{ width:auto}
.Basket span{ display: inline-block; line-height: normal; color: #000000;}
.Basket i.rdo{  margin-bottom: 15px;}
.Basket .promo-appy .content{text-align: center; }
.Basket .promo-appy h6{font-family: 'SourceSansProSemiBold';  margin-bottom: 5px; }
.Basket .promo-appy span{font-family: 'SourceSansProSemiBold';  font-size: 1.6rem;float: left;  width: 100%; text-align: center; }
.popup.promo-enter ul li{border-bottom: 1px solid #e0e4e5;}
.popup.promo-enter ul li label{margin-bottom: 5px;}
.popup.promo-enter .form-list li .form-field{padding: 0;}
.popup.promo-enter .content .row:first-child {margin-top:25px}

.Basket .cart-data .col-50{ width: 45%;}
.Basket .cart-data .col-25{ width: 30%;}


.promo-offer .col-60{ width: 60%;}
.promo-offer .col-40{ width: 40%;}

.Basket .promo-appy  span.ico-wrap{display: inline-block; width: 65px; float: none; padding: 0;}
.Basket .popup.promo-enter h6{font-family: 'SourceSansProSemiBold';  margin-bottom: 10px; }
.Basket .popup.promo-enter a{font-family: 'SourceSansProSemiBold'; color:#000000;}
.Basket ::-webkit-input-placeholder { color:#c1c1c1;}
.Basket ::-moz-placeholder {color:#c1c1c1;}
.Basket :-ms-input-placeholder {color:#c1c1c1;}
.Basket :-moz-placeholder {color:#c1c1c1;}
.previous .logo{float: none;margin: 0 auto;padding: 25px 0;width: 140px;height: auto;}
.previous .logo img{width: 100%;}

/*OVERLAY-WITH-SIDEBAR----------------*/
.overlay{position: fixed; width:100%; height:100%; left:0; top:0; background-color: rgba(0,0,0,0.7); z-index: 2; transition:all ease-in-out 0.4s; -webkit-transition:all ease-in-out 0.4s; opacity: 0; visibility: hidden;}
.overlay-close{position: fixed;  width: 40px; height: 40px; left: 0; top: 0; font-size: 2.0rem; color: #ffffff; padding: 10px; cursor: pointer; background: #000000; z-index: 4; display: flex;  justify-content: center;
align-items: center;}
.overlay.active{opacity: 1; visibility: visible;}
.sidebar{position:fixed; right:-100%; top:0; width:420px; height:100%; background-color: #ffffff; z-index: 3; overflow: auto; transition:all ease-in-out 0.4s; -webkit-transition:all ease-in-out 0.4s;}
.sidebar.active{right:0;}
/*SIDEBAR END=============================================================*/

/*MENU PAGE CSS START=============================================================*/
.res-menu{ padding: 50px 0;background: #f1f5f8;}

.res-menu .thumbsldr li a{float:left;width:100%;display:inline-block;padding:8px;}
.res-menu .thumbsldr li a img{float:left;width:100%;display:inline-block;}
.tblmenu-list{float:left; width:100%; margin:0; padding: 0; position: relative; box-shadow: 0px 0px 15px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.2);background: #ffffff;}
.tblmenu-list li{float:left; width:100%; margin:0; padding: 0;}

.tblmenu{border-collapse: collapse;background-color: transparent; background-position: center; background-size: 250px; background-repeat: no-repeat; background-image: url(../images/city-rewardz-logo.png);}
/* .tblmenu tbody{background-color: transparent; background-position: center; background-size: 300px; background-repeat: no-repeat; background-image: url(../images/logo-trans.png);} */
.tblmenu th{background-color: #000000; color:#ffffff; padding: 10px 15px; font-family: 'CardoBold';; font-weight: normal;}
.tblmenu h3{font-size:2.0rem; font-weight: normal; }
.tblmenu h4{font-size:1.8rem; font-family: 'CardoBold';; font-weight: normal; color:#000000; margin-bottom: 5px;}
.tblmenu tr{border-bottom: 1px dashed #cccccc;}
.tblmenu tr:last-child{border-bottom:1px solid transparent}
.tblmenu td{padding: 15px;}
.tblmenu td:not(.c-detail){font-weight: normal; font-family: 'CardoBold';;}
.tblmenu td, .tblmenu p{font-size:1.4rem; line-height:1.8rem; margin:0;}
.tblmenu td div p { float: none; }
/*MENU PAGE CSS END=============================================================*/
/* PREVIOUS ORDER BOOKING CSS START=================================== */
.order-list{float:left;width:100%;}

.order-list ul li{float:left;width:100%;padding:0px 15px;margin:0 0 12px;border-radius:8px;box-shadow:0 0 8px rgba(0,0,0,0.2);}
.order-list .row{padding:12px 0;margin:0;}
.order-list a{font-weight:600;color:#000000;}
.order-list .row .data{padding:0 0 0 15px;}
.order-list .row .data h6{margin:0 0 0px;}
.order-list .row  p{display: inline-block;font-size: 1.2rem; margin:2px 0 0; width: auto;float: none;font-family: 'SourceSansProSemiBold';}
.order-list .row h6 p{margin:0;}
.order-list .status-wrap span{display: inline-block;width:100%;font-size:1.3rem;}
.order-list .status-wrap span.hightlight{color:#000000;}
.order-list .col-50:nth-child(1) .status-wrap{border-right:1px solid #e0e4e5;}

/*--------------------------------------------------------------------------------------------------------------------------------------------*/
.rewardz .order-list h1{font-family: 'SourceSansProSemiBold';}
.rewardz .order-list .img-box{ text-align: center; padding: 20px 0; width: 120px;margin: 0 auto;  float: none;}
.rewardz .order-list .img-box svg{ width: 100%;}
.rewardz .order-list ul li .loyalty-list li{ border-radius: 0; box-shadow: none; margin: 0 0 5px; padding: 0;}
.rewardz .order-list .row.pad-0{ padding: 0;}
.rewardz .order-list span{ width:auto;font-family: 'SourceSansProSemiBold'; color:#000000; position: relative;margin-bottom: 15px; float: left;}
.order-list span:after{content: ""; display: inline-block; background-color: #000000; width: 100%;   height: 6px; position: absolute; left: 0; bottom: -10px; border-radius: 40px; overflow: hidden;}
.loyalty-list li .ico{width: 20px;display: flex;  align-items: center;padding: 4px 0 0; }
.rewardz .order-list .row p{font-size: 1.4rem;color: #000000;}
.rewardz .order-list ul li .loyalty-list li P{color: #454545;}
.rewardz .order-list ul li h6{margin-bottom: 15px;}
.rewardz .loyalty-list li .row {align-items: flex-start;}
.rewardz .loyalty-list li .row {align-items: flex-start;}

/* PREVIOUS ORDER BOOKING CSS END=================================== */

/*ORDER DETAILS CSS START=================================== */
.order-derail .row{ text-align: center;}
.order-derail .row h4{ color:#b2acac; text-transform: uppercase;}
.order-derail .row h5{ color: #454545;}
/* .order-derail .row ul li { justify-content: space-between; padding-bottom: 5px;} */
/* .order-derail .row ul li .col-50 {width: auto;} */
.order-derail .row ul li.total { padding-top: 10px; margin-top: 10px; border-top: 1px solid #e0e4e5;}
.order-derail span { display: inline-block; line-height: normal; color: #000000;}
.order-derail span.order-item{width:100%; color: #454545;}
.order-derail .row{ padding-bottom: 10px;}
.order-derail .sdbr-hdr a{font-size: 1.2rem; padding: 5px 10px;}

/* ORDER DETAILS CSS END=================================== */

/*BOOKING DETAILS CSS START=================================== */
.booking-detail .description{ padding: 0;}
.booking-detail .mark{ width: 24px;filter: grayscale(100%);}
.booking-detail .mark.active{ width: 24px;filter: grayscale(0%);}
.bookreq{padding-bottom: 40px; position: relative;}
.bookreq:after{ content:"";display: inline-block; position: absolute; top: 20px; left: 12px; width: 1px; height: 100%; background-color:#454545; }
.location-call{ justify-content: center;}
.location-call .col-30{ width:auto; padding: 0 20px;}
/*BOOKING DETAILS CSS END=================================== */

/*MY ACCOUNT=============================================================*/

.my-account{background: #000000; padding-bottom: 70px; height: 100%; }
.my-account .row p{ color: #ffffff; text-transform: capitalize;}
.my-account .row h4{ color: #ffffff; }
.my-account .sdbr-hdr .ico .fa,.my-account .sdbr-hdr h5{ color:#ffffff;}
.my-account .row ul li a{width: 100%; display: flex; justify-content: center; align-items: center;padding: 0 5px;}
.my-account .row ul li a h6{ padding: 10px; color:#ffffff;}
.my-account .row ul li .col-100{ padding: 10px;}
/*MY ACCOUNT END=============================================================*/

/*BOOK A TABLE CSS START=================================== */
.table-book .description{ padding:0;}
.table-book  label{ display: none;}
/* #ui-datepicker-div{ width:420px !important;} */
/*BOOK A TABLE CSS END=================================== */

/*FEED BACK CSS START=================================== */
.popup.feedback .content{text-align: center;}
.popup.feedback  .cta-wrap{margin: 20px 0 0;}
/*FEED BACK CSS END=================================== */

/*ADDRESS BOOK CSS START=================================== */
.address-book .row h4{font-size: 1.4rem;}
/*ADDRESS BOOK CSS END=================================== */

/*ACTIVITY HISTORY CSS START=================================== */
.activity-history  .img-box {width: 50px; height: 50px; border-radius: 6px; -webkit-border-radius: 6px; overflow: hidden;  position: relative;}
.activity-history  .img-box  img{width: 100%; height: 100%; object-fit: cover; object-position: center;}
.activity-history .row{  align-items: flex-start;}
/*ACTIVITY HISTORY CSS END=================================== */

/* Acitvarte Email=============================================== */
.activate-eml {float:left;width:100%;padding:20px 40px;border-right: 1px solid #ddd;border-left: 1px solid #ddd;border-bottom: 1px solid #ddd; height: 100%;}
.activate-eml label{display:none;}
.activate-eml .logo{display:flex;width:100%;justify-content: center;margin:40px 0;width:100%; height:auto;}
.activate-eml .logo img{max-width: 150px;height:auto;width:100%;}
.date-format{font-size:1.2rem;padding-left: 15px;margin: 5px 0;color: #979797;}
.activate-eml input[type=text], .activate-eml input[type=password],.activate-eml  input[type=number], .activate-eml textarea,.activate-eml div.select-box{background: #f2f3f7;border-radius: 5px;-webkit-border-radius: 5px;border: 1px solid #d28748;padding: 10px;height:50px;}
.activate-eml div.select-box select{height:100%;}
.activate-eml div.select-box:after{display: flex;justify-content: center;align-items: center;color: #aaaaaa;background-color: transparent;width: 35px;height: 100%;border:0;line-height: 1;}
.activate-eml  a.button{ width:100%;text-align:center; background: #686868;font-size:1.6rem;}
.activate-eml  a.button:hover{color:#ffffff;}


/* PAYMENT FAIL=============================================== */
.pay-fail{  height: 100%; }
.pay-fail .sdbr-content{height: calc( 100% - 64px);}
.pay-fail-wrap{width: 100%; display: flex; justify-content: center; align-items: center; height: 100%; flex-flow: row wrap; align-content: center;}
.pay-fail-wrap h4{ text-align: center; text-transform: uppercase;}
.pay-fail-wrap .img-box{text-align: center; padding: 0 0 20px;}

/* GALLERY PAGE=============================================== */
.gallery{margin:50px 0}
.gallery-list{width:100%; max-width: 1320px; display: block; margin: 0 auto; padding:0 0 3px;}
.gall-row{float:left; width:100%; margin:0; padding: 0px 3px; position: relative; display: flex; justify-content: flex-start; align-items:stretch; flex-flow:row wrap;}
.gall-row .col-60,
.gall-row .col-40{display: flex; justify-content: flex-start; align-items:stretch; flex-flow:row wrap;}
.gall-row img{width:100%; height:100%; object-fit: cover; transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s;}
.gall-row .img-box:hover img{transform: scale(1.1); -webkit-transform: scale(1.1);}
.gall-row .col-60{width:60%}
.gall-row .col-40{width:40%}
.gall-row .col-60 .img-box{width:50%;}
.gall-row .col-40 .img-box{width:100%;}
.gall-row .img-box{border:3px solid #fff; overflow: hidden;}
.gall-row:nth-child(2n+2){flex-flow: row-reverse;}




/*THANK-YOU*/
.container.thank-you{ padding: 0;}
.thank-you-wrap{width: 100%; display: flex; justify-content: center; align-items: center; text-align: center; height: 100vh;
background-color: #eeeeee; flex-flow: row wrap;align-content: center;}
.thank-you-wrap h4{ width: 100%; float: left; text-align: center;font-size: 40px; text-transform: uppercase;font-weight: bold; color:#000000;
 margin-bottom: 25px;}
.thank-you-wrap .ico{width: 70px; margin: 0; margin-bottom: 25px;}
.thank-you-wrap .ico img{ width:100%; }




/*blog-list*/
.blog-list{ padding: 30px 0; height:}
.blog-list.food-story{ height: calc(100vh - 164px ); overflow: auto;}
.blog-list.food-story{ height: calc(100vh - 164px );}
.blog-list h3{ margin-bottom: 10px;}
.blog-list p{ margin: 0; margin-bottom: 20px;}
.blog-list .data{ text-align: justify;}
.blog-list .data em,.read-more-content em{ color: #454545;}


/*================================templeat 2=================================================================*/
.op-2 .hm-sldr ul li .button{padding: 15px 35px; font-size: 2.4rem;}
.op-2 .social{ display: none;} 
.op-2 .menu-wrap ul {justify-content: flex-end;}
.op-2 .our-story .wrap720{ margin: 0; padding: 0;}
.op-2 .hm-sldr ul li a{top: auto; bottom: 50px; transform: translate(-50%,0);}
.op-2 ul.slick-dots{bottom: 30px;}


.op-2 .our-story.pTB60,.our-baklwa.pTB60{ padding: 30px 0;}

.our-prod{background-color:#EEEEEE; padding: 70px 70px 50px;}
.our-prod .cta-wrap{ padding-top: 30px;}
.product-list{width: 100%; display: flex; margin: 0; padding: 0; flex-flow: row wrap;}
.product-list li{width: calc(50% - 20px); display: flex; margin: 0 10px 20px; padding: 0px;}
.product-list li .content-box{width: 100%; display: flex; margin: 0; padding: 20px;background-color:#ffffff;border-radius: 5px; -webkit-border-radius: 5px;align-items: center;box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.6);  -webkit-box-shadow: 0px 0px 10px 0px rgba(126, 71, 71, 0.6);  -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.6);}
.product-list li .img-box{width:255px; height: 210px;  border-radius: 5px; -webkit-border-radius: 5px;overflow: hidden;}
.product-list li .img-box img{ width: 100%; height: 100%; object-fit: cover;  border-radius: 5px; -webkit-border-radius: 5px;overflow: hidden;}
.product-list li .data{flex: 1;padding: 0 50px 0 20px;}
.product-list li .data h3{ margin-bottom: 20px; font-weight: bold;font-size: 1.8rem;}
.product-list li .data p{font-size: 1.2rem; line-height: 1.6rem; color: #000000; margin-bottom: 20px;}
.product-list li .data span{ width: 100%; float: left; margin-bottom: 20px; font-weight: bold;}


.our-baklwa .inside-wrap{ width: 100%; display: flex; margin: 0; padding:30px 70px 50px;position: relative;  z-index: 1; }
.our-baklwa .inside-wrap .img-box{width: 45%; padding: 80px 0px 60px 30px; margin-right: -150px; position: relative; z-index: 3;}
.our-baklwa .inside-wrap .img-box img{position: relative; z-index: 3;}
.our-baklwa .inside-wrap .img-box:before{ content: ""; display: inline-block; width: calc(100% - 150px); height: calc(100% - 170px); position: absolute; left: 0; top: 50px; z-index: -1; background-color: #000000; }
.our-baklwa .inside-wrap .img-box img{ width: 100%; height: 100%; object-fit: cover;}
.our-baklwa .inside-wrap .data{ display: flex; flex: 1; flex-flow: row wrap; align-content: center; width: 60%; padding: 0 30px 0 200px; box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 60%); -webkit-box-shadow: 0px 0px 10px 0px rgb(126 71 71 / 60%); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.6); border-radius: 5px; -webkit-border-radius: 5px; position: relative; z-index: 2;}

.our-baklwa .inside-wrap .data h2{ font-size: 4.7rem; margin-bottom: 20px; font-weight: bold;}
.our-baklwa .inside-wrap .data p{  margin-bottom: 30px;}


.contact-data{width: 100%; display: flex; margin: 0; padding:0;position: relative;   }
.contact-data .img-box{ width: 38%; float: none;}
.contact-data .img-box a{width: 30px; display: inline-block;}
.contact-data .img-box img{ width: 100%;}
.contact-data .data{ width: 24%; text-align: center;}

.contact-data .data .button{ margin-bottom: 20px; }
.contact-data ul{ width: 100%; display: flex; justify-content: center; flex-flow: row wrap; padding: 0; margin: 0;}
.contact-data ul li{ width: 100%; display: flex; justify-content: center; flex-flow: row wrap;padding: 0; margin: 0 0 40px;}
.contact-data ul li.ico{width: auto; margin: 0 15px;}
.contact-data ul li h4{ font-size: 2.6rem; font-weight: bold; color: #000000;}
.contact-data ul li p{ font-size: 2.0rem;  line-height: normal; margin-bottom: 0; color: #000000;}
.contact-data ul li .img-box img{ width: auto;}



.foot-stripe.op2-footer{ background-color: #000000;}
.foot-stripe.op2-footer .left{ display: none;}
.foot-stripe.op2-footer .right{ width: 100%;}
.foot-stripe.op2-footer p{ font-size: 1.8rem; color: #ffffff; text-align: center;}
.foot-stripe.op2-footer p a{  color: #ffffff; }
.foot-stripe.op2-footer p a:hover{  color: #ffffff; }



/*================================templeat 2 end=================================================================*/





/*================================details page templeat 2 =================================================================*/
.detail-page{ padding: 30px 0;}
.detail-wrap{ width: 100%; display: flex; flex-flow: row wrap; margin: 0; padding: 0;}
.detail-wrap .cta-wrap{ display: flex; justify-content: space-between; align-items: center;}
.detail-wrap .data{ padding: 20px; background-color: #ffffff;box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.6);  -webkit-box-shadow: 0px 6px 10px 0px rgba(126, 71, 71, 0.6);  -moz-box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.6);}
.detail-wrap h3 {margin-bottom: 20px;font-weight: bold; font-size: 1.8rem;}
.detail-wrap span {  font-weight: bold; float: left; font-weight: bold;}
.detail-wrap .img-box{height: 400px; overflow: hidden;}
.detail-wrap .img-box img{width: 100%; height: 100%; object-fit: cover; object-position: center;}


/* chhaya 08/02/2022 */
.col-20.promo-input a{display: inline-block; padding: 10px 0;}
.prod-list-wrap.cont-less .prod-sticky-safari {top: 53px;}
/* chhaya end */


/* Chandrakant 02/08/2022 */
.crz-form .thankyou{
    margin-top: 40px;
}
.crz-form .merchant.thankyou .mer-logo .img-box{
    width: 100%;
    margin: auto;
}
.crz-form .merchant.thankyou .mer-logo .img-box img{
    width: 100%;
    margin: auto;
}
/* Chandrakant end */






































@media screen and (max-width:1440px) {
    /*templeat 2*/
    .contact-data ul li h4 { font-size: 2.0rem;}
    .contact-data ul li p { font-size: 1.6rem;}
    .contact-data ul li { margin: 0 0 30px; }
    .page-404 .content .data{max-width: 450px;}
    .page-404 h1{font-size: 17rem; margin-bottom: 0;}
    .page-404 h3 {font-size: 2.8rem;}
    .page-404 p {font-size: 1.6rem;}
}



@media screen and (max-width:1024px) {
    .wrapper{ max-width: 100%; padding: 0 20px;}


}

@media screen and (min-width:1024px) {
.menu-wrap ul.menu-list li a:hover,
.menu-wrap ul.menu-list li a.active{/*border:1px solid #000000;*/ color:#000000}

}
@media screen and (max-width:1023px) {

/*COMMON CSS START====================================*/
.desk-only{ display: none !important;}
.mob-only{ display: block !important;}
section{overflow-y: auto;}
.wrapper,.wrap980{ max-width: 100%;padding: 0 15px;}
.pTB60 { padding-top: 40px;  padding-bottom: 40px; }
.container{padding-top: 60px;}
/*HEADER====================================*/
header { height: 60px; } 
.logo { height: 60px;  }
header .logo { width:100%;  }
.menu-wrap { width: 100%; height: calc(100vh - 60px); top: 60px; background-color: #fafdfc; position: fixed; padding: 40px 15px 0; margin: 0; right: -100%; -webkit-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;align-items: flex-start; flex-flow: row wrap;align-content: flex-start;}
.menu-wrap.active { right: 0; }
.menu-list li { width: 100%; margin: 0; text-align: left; }
#nav-icon { display: block;  }
.menu-wrap ul li a{display: inline-block; width: 100%; border:0}
.social{ width: 100%; flex-flow: row wrap;}   
.social ul{ justify-content: flex-start;} 
.menu-wrap ul li a:hover, .menu-wrap ul li a.active{ border: 0;}    

/*HOME-PAGE=============================================================*/   

/*PROMOTION SECTION----------------*/
.promo-sec .flx{ flex-flow: row wrap;}
.promo-sec .img-box, .promo-sec .data{ width: 100%;}
.promo-sec .data{ padding: 30px;}
.title{margin: 0 0 15px;font-size: 3.6rem;}

/*THUMB SECTION----------------*/
.slick-prev, .slick-next{width: 40px; height: 40px;}

/*MAP SECTION----------------*/
.map{  height: 360px;}
.activate-eml{padding:20px 30px;}
.activate-eml .logo{ margin: 30px 0}
/* Menu css========================================= */
.res-menu .thumbsldr li{width:50%;}
.res-menu .thumbsldr li a{padding:10px;}

 /*templeat 2 */
 .product-list li{ width: 100%; flex-flow: row wrap; margin: 0  0px 20px; }
 .our-baklwa .inside-wrap,.product-list li .content-box{ flex-flow: row wrap;}
 .our-baklwa .inside-wrap .img-box{ width: 100%; margin: 0; padding: 30px 30px 0; margin-bottom: -50px;}
 .our-baklwa .inside-wrap .data{width: 100%; padding: 80px 30px 30px; margin-top: 0px;}
 .our-baklwa .inside-wrap .img-box:before { width: calc(100% - 60px); height: calc(100% - 50px); top: 0; left: 0;}

 .our-baklwa .inside-wrap{ padding: 20px 40px;}
 .contact-data{ flex-flow: row wrap;}
 .contact-data .img-box,.contact-data .data{ width: 100%;}
 .contact-data .data{ padding: 30px 0;}
 .contact-data ul li:last-child{margin: 0;}

 .op-2 .slick-dotted.slick-slider { margin-bottom: 0px;}
 .our-prod { padding: 20px;}
 .product-list li .img-box{ width:100%;}
 .product-list li .data { padding: 20px 0 0;}
 .product-list li:last-child{ margin: 0;}

 /* 404 page */
 .page-404{margin-top:-60px;}
}

.cl-thankyou h3{margin-bottom: 10px;color:#000000}
.cl-thankyou p{padding:0 30px;    line-height: normal;}

/* 09-05-2022 window fit banner edit by khem  */
.which-page section.our-story{display: none;}
.which-page .hm-sldr ul li{height: calc(100vh - 120px);}
.which-page .hm-sldr ul li img{height: 100%;object-fit: cover;}
@media screen and (max-width:767px) {

/*COMMON CSS START====================================*/  
a.button, input.button, .mx-btn .btn{padding:5px 12px;} 
.op-2 .hm-sldr ul li .button{padding:15px 20px;font-size: 2.0rem;} 
.pTB60 { padding-top: 20px;  padding-bottom:20px; }
.our-story.pTB60{padding-bottom: 20px;}
/* .container{padding-top: 0px;}  */
.overlay{ background-color: #ffffff;}
.crz-ecom.active{background: transparent;}
.crz-ecom.active .container{ opacity: 0;} 

.hm-sldr ul li a{top:auto; bottom: 0;}

/*PROMOTION SECTION----------------*/
.title{font-size: 2.6rem;}
.title:before{width: 115px; height: 30px;}

/*SIDEBAR SECTION----------------*/   
.overlay-close{display: none;}
.sidebar, .sticky-btn{ width:calc(100% - 0px);}

.popup .body{min-width: 315px;}
.popup{ width: 100%; }

.feature .slick-prev, .feature .slick-next{ width:40px;height: 40px;}
/*FOOTER SECTION----------------*/
.footer-info .left,.footer-info .right,.footer-info .left ul{ width:100%} 
footer .logo{ margin: 0 0 15px;}
.footer-info .left ul{ padding: 0 0px 30px;}
.footer-info .left{flex-direction: column;}
.footer-info .left ul li p br{ display: none;}
.foot-stripe .right p{ text-align: right;}
.foot-stripe.op2-footer p{ text-align: center;font-size: 1.2rem;}
.promo-sec .promo-sldr, .promo-sec .promo-sldr li, .promo-sec .slick-list, .promo-sec .slick-track, .promo-sec img{height:auto;}

/*MENU PAGE SECTION----------------*/

.tblmenu th{ display: none;}
.tblmenu td {display: block; float: left;  width: 100%;  text-align: left;  position: relative;  white-space: unset; font-weight: normal;
font-family: 'CardoBold';;font-size: 1.2rem; line-height: 1.4rem; padding:10px 15px}
.tblmenu td:before { content: attr(title); float: left; width: 25%; font-weight: 400;  white-space: pre-wrap; font-weight: normal;
font-family: 'CardoBold';;}
.tblmenu h4{ font-size: 1.6rem;}
.tblmenu td div { display: inline-block; }
.tblmenu td div { float: left; display: inline-block; width: 75%;padding-left: 15px; }
.tblmenu td:last-child{padding-bottom: 20px;}
.tblmenu td:first-child{padding-top: 20px;}
.res-menu{ padding: 15px 0;}

.form-list li.pin { width: 40%; }
.form-list li.mobile { width: 60%; }
/* Menu css========================================= */
.res-menu .thumbsldr li{width:100%;}
.res-menu .thumbsldr li a{padding:0 0 15px;}
.footer-info .left ul li p{ padding-left: 25px;}
.footer-info .left ul li span{ position: absolute; top: 0; left: 0;}
.footer-info .left ul li a{ 
    /* padding-left: 25px; */
    }
.footer-info .left ul li a.contactNumber{ padding-left: 27px;}
.about-content h3{ font-size: 1.6rem;}

.gall-row:nth-child(2n+2){flex-flow: row wrap;}
.gall-row .col-60,
.gall-row .col-40,.col-60,.col-40{width:100%}

.our-story .wrap720{margin:0; padding: 0;}
/*thankyou*/
.thank-you-wrap h4{ font-size:30px;}
.blog-list .data{ padding: 10px 0 0;}

.promo-offer .col-40{ width: 40%;}
.promo-offer .col-60{ width: 60%;}

.prod-info{width:calc(100% - 160px);}
.count-wrap{width:80px;}
.count-btn{ width: 100%;height: 30px;}
.count-btn button{font-size: 1.4rem;padding: 0 5px; line-height: 30px;}
.count-btn input{font-size: 1.2rem;margin: 4px 0 0;width: 16px;}
.count-btn a{font-size:1.2rem ;}
.count-btn button.cart-btn{ font-size: 1.2rem;}
.ico-wrap {width: 30px;}


.our-baklwa .inside-wrap .data h2{ font-size: 2.8rem;}
.op-2 .our-story.pTB60, .our-baklwa.pTB60{ padding-top: 0;}

/* 404 page */
.page-404 h1 {font-size: 12rem;}
.page-404 h3 {font-size: 2.4rem;}

/* chhaya 08/02/2022 */
.col-20.promo-input a{display: inline-block; padding: 10px 0;}
.prod-list-wrap.cont-less .prod-sticky-safari {top: 48px;}
/* chhaya end */
/* 09-05-2022 window fit banner edit by khem  */

.which-page .hm-sldr ul li{height: auto;}

/* Qa change */
.prod-list li .img-box{ width: 50px; height: 50px;}
.product-wrap .sticky-btn .button{min-width: 45%;padding: 9px 5px;}
.sticky-btn span{width: 50%;padding: 10px;}

/* chandrakant-26-7-2022 */

.Basket .cart-data li p{font-size: 1.5rem;}

/* Qa change */

}

/*---- CRZ EMAIL VERIFICATION ONLY==========*/
.crz-form {padding:0; justify-content:center;}
.crz-form .activate-eml {padding:0 40px; }
.crz-form .block-title{font-size:24px;font-weight:600;color:#ffffff;text-align:center;width:100%;margin-bottom:20px;}
.crz-form .mer-logo{width:100%; position:relative; left:0; top:0; display:flex; justify-content:center; align-items:center; height:40%;}
.crz-form .mer-logo .img-box{max-width:170px;}

.crz-form .mer-logo .img-box img{width:90%; margin-left:5%;}
.crz-form .login .pin-input ul{width:100%;display:flex;justify-content:center;}
.crz-form .login .pin-input li{width:25%;padding:0 12px;}
.crz-form .login .pin-input li input{width:100%;padding:0 10px;line-height:50px;text-align:center;background:#f2f3f7;border-bottom:2px solid #dddddd;font-size:20px;font-weight:600;color:#000;border-radius:0;}

.crz-form .wht-over{width:100%;padding:60px;border-top-left-radius:20px;border-top-right-radius:20px; position:relative; left:0; bottom:0; min-height:60%; display:flex; justify-content:center; align-items:center;  flex-flow:row wrap; background-color:#ffffff; background-image:url(../images/tran-bg.png); background-repeat:no-repeat; background-position:center top; background-size:cover;}
.crz-form .wht-over h3 { font-weight: bold; }
.crz-form .wht-over ul{width:100%;}

/*------------*/
.crz-form .mobile-input{width:100%;float:left;padding:0;}
.crz-form .mobile-input ul{display:flex;flex-flow:row wrap;}
.crz-form .mobile-input ul li{display:inline-block;}
.crz-form .mobile-input ul li label{display:none;}
.crz-form .mobile-input ul li.pin{width:35%;padding-right:15px;}
.crz-form .mobile-input ul li.mobile{width:65%;}
/*------------*/
.crz-form ul li{display:inline-block;width:100%;}
.crz-form ul li.country-code{width:30%;padding-right:15px;}
.crz-form ul li.mob-num{width:70%;}
.crz-form ul li.cashback-balance span{font-size:12px;line-height:18px;font-style:italic; color:#1c8db9;}
.crz-form .head-foot{height:calc(100% - 50px);padding-top:49px; position:relative; z-index:2;}
.crz-form .head-foot.stamp-redeem{height:calc(100% - 0px);}
.crz-form .stamp-input{padding:0 30px;width:100%;}
.crz-form .stamp-input.padd0{padding:0;}

.crz-form .cta-flex{display:flex; justify-content:flex-start; align-items:stretch; flex-flow:row wrap;}
.crz-form .cta-flex li{width:calc(50% - 10px); min-height:60px; margin:5px; display:flex; justify-content:center; align-items:center;}
.crz-form .cta-flex li .btn{height:auto; line-height:normal; padding:14px; width:100%; height:100%; display:flex; justify-content:center; align-items:center;}

/*------------*/
.crz-form .stamp-input .input-list li{margin-bottom:20px;}
.crz-form .reports{padding-top:49px;}
.crz-form .reports-input{padding:0 30px;}
.crz-form .reports-input .input-list li{margin-bottom:20px;}

.form-wrap.merchant .mer-logo .img-box{margin:20px auto 20px auto;}

.crz-form .body-container{background:#ffffff;}
.crz-form .body-container::-webkit-scrollbar { display: none; }
.crz-form .body-container{width:414px;height:100vh; max-height:660px; margin:auto;border-right:1px solid #ddd;border-left:1px solid #ddd;border-bottom:1px solid #ddd; position:relative; overflow: auto; }
.crz-form .merchant .mer-logo .img-box{ max-width:170px; width:90%; margin-left:5%; }

.crz-form .mer-logo{background-repeat: no-repeat; height:20%; margin-top:40px; background-position: left top; background-size: cover; background-image:none; position: relative;}
.crz-form .merchant.head-foot{padding-top:0;}
.crz-form .wht-over{border-radius:0; -webkit-border-radius:0; background:#ffffff; padding:40px;}
.crz-form .wht-over p { width: auto; }
.crz-form .merchant ul li{margin-bottom:24px; position:relative;}
.crz-form .merchant div.select-box,
.crz-form .merchant ul li input{height:50px; border-radius:5px; -webkit-border-radius:5px; border:1px solid #d28748; position:relative; width:calc(100% - 1px);}
.crz-form .merchant div.select-box select{height:100%;}
.crz-form .merchant ul li input {padding:10px;}
.crz-form .merchant ul li label{font-size:14px;}
.crz-form .merchant ul li label{display:none;}
.crz-form .footer a{background:#e98962}

.crz-form a.button{text-transform:none; width:100%; display:flex;align-items:center;justify-content:center; height:50px; padding:10px; font-size:16px; font-weight:400;color:#fff;background:#686868; border-radius:5px; -webkit-border-radius:5px;}


.crz-form .thankyou { justify-content: center; align-content: center; display: flex; flex-flow: row wrap; height: calc(100% - 50px); }
.crz-form .thankyou h4,
.crz-form .thankyou h5,
.crz-form .thankyou p,
.crz-form .thankyou a{float:left; width:100%; margin:0; padding:0; text-align:center; color:#686868;}

.crz-form .thankyou h4{color:#e98961; font-size:20px; margin-bottom:10px;}
.crz-form .thankyou h5{font-size:16px; margin-top:40px;}
.crz-form .thankyou a{color:#e98961; font-size:20px;}
.crz-form .thankyou .mer-logo{margin:0;}
.crz-form .thankyou{justify-content:center; align-content:center; display:flex; flex-flow:row wrap;}
.crz-form .thankyou .wht-over{align-content:center; min-height:1px;}
.crz-form .thankyou .downloads{float:left; width:100%; margin:30px 0 0; padding:0 30px; position:relative; text-align:center;}
.crz-form .thankyou .downloads a{display:inline-block; vertical-align:top; width:45%;}
.crz-form .thankyou .downloads img{max-width:100%; max-height:36px;}

/*------------*/
.svg, .st0{fill: #000000 !important;}
.checkout .ico .svg { width: 80%; height: 100%; }

.previous.emty.empty-cart .description {
    width: 100%;
    float: left;
    margin: 0;
    padding: 50px 15px 70px;
    text-align: center;
}


@media screen and (max-width:576px){
div.mxdialog div.body{max-width:315px; width:90%;}
h5{font-size:1.4rem}
h6{font-size:1.4rem}
.sidebar.active { right: 0; border-top: 1px solid #ccc;}

/* chandrakant-26-7-2022 */
.Basket .cart-data .col-50{width: 40%;}
.Basket .cart-data .col-25{width: 35%;}
/* chandrakant-26-7-2022 */
}
.qty-checkbox-disabled{pointer-events: none;}

@media screen and (max-width:576px){
    .crz-form .body-container{ width: 100%;}
    }

/* 4-2-2022 Tabish */

/* side-bar css */

.product-wrap .sdbr-hdr {padding:0px;}
.marchant-info .row.bor-0.mar-0.pad-0 .col-30 .img-box{text-align: right;}
.marchant-info .row.bor-0.mar-0.pad-0 .col-30 .img-box img{width: 85px;}
.marchant-info .row.bor-0.mar-0.pad-0{padding-bottom: 15px;}
.my-basket-radio{width: auto;float: left;display: flex;align-items: center;padding-bottom: 10px;}
.my-basket-radio.vehicle-no{padding-left: 20px;}
.my-basket-radio label{padding-left:8px;}
#userBookingInfo.user-booking-text{height: 60px;}
/* .prod-sticky-safari{top:53px;} */
.cont-less .odr-time {display: flex;align-items: center;margin-bottom: 15px;}
.cont-less .marchant-info .col-100.odr-time p{margin: 0px;}
.coupon-list{padding: 15px;}
 .prod-list-wrap .prod-list-sticky {padding: 15px 15px 0px 15px;}
.promo-enter.cont-less-promo ul li{display: flex;}

/* chhaya 08/02/2022 */
.col-20.promo-input a{display: inline-block; padding: 10px 0;}

.prod-list-wrap.cont-less .prod-sticky-safari {
    /* top: 52px; */
    top: 52px;
}
/* chhaya end */

@media screen and (max-width: 576px){
   /*  .prod-sticky-safari{top:48px;} */
}

div.select-box.lang {
    height: 30px;
    padding: 5px;
    border: 1px solid #e0e4e5;
    min-width: 80px;
    border-radius: 3px;
 }

 div.select-box.lang select {
    height: 100%;
    padding: 0 5px
 }

 div.select-box.lang:after {
    height: 20px;
    line-height: 30px;
 }

 @media screen and (max-width: 767px) {
    div.select-box.lang {
       height: 25px;
    }

    div.select-box.lang:after {
       height: 15px;
       line-height: 25px;
    }
 }

 /*CSS for MENU QR*/

 .wap_body{
    width: 414px;
    height: 660px;
    margin: auto;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
    background-color: #ffffff;
    /* background-image: url(../images/body-bg.png); */
    position: relative;
    overflow-y: auto;
}
.wap_body header{
    position:fixed;
    padding-left: 20px;
}
.wap_body_content{width: 100%;padding:50px 0 0;position: relative;left: 0;bottom: 0;min-height: 100%;display: flex;justify-content: flex-start;align-items: flex-start;align-content: flex-start;flex-flow: row wrap;background-color: #ffffff;background-image: url(../images/tran-bg.png);background-repeat: no-repeat;background-position: center top;background-size: cover;}

.menu-dtl{ position: absolute;top:50%; left:50%; transform: translate(-50%,-50%); max-width: 800px; padding:20px 30px; height: auto;background-color: #ffffff; z-index: 2; box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.6);}
.wap_body_content ul{width: 100%;}
.wap_body_content ul li{width:100%;}
.wap_body_content ul li a{ color:#000; border-bottom:1px solid #000;padding:20px;display: inline-flex;width: 100%;justify-content: space-between;transition:all 0.3s ease-in;}
.wap_body_content ul li span{font-size: 20px; transition:all 0.3s ease-in;}
#pdfContainer{width:100%;}
.menuqr .icoBox{height: auto; width: 100%;}
#menu-title {
    flex: 1;
    color: #fff;
    text-transform: capitalize;
    font-size: 16px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
.ico-wrap-hdr{ width: 100%; display: flex;align-items: center;}
/* CSS for the pdf loader */
.pdf-loader {
    border: 16px solid #f3f3f3;
    border-top: 16px solid #3498db;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -60px;
    margin-left: -60px;
    z-index: 9999;
  }
  #canvases canvas{ width: 100%;height: auto;}
  #pdf-controlls{width: 100%;}
  .sticky-dwnl {position:fixed;position: fixed;top:47px; padding:8px;background-color: #f2f2f2;cursor:pointer;}
  .sticky-dwnl button{width:20px;background: transparent;cursor:pointer;}
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
@media screen and (max-width: 992px) {
    .wap_body {
        max-height: none;
    }
}
@media screen and (max-width: 768px) {
    .wap_body {
        min-height: calc(100vh - 56px);
        height: calc(100vh - 56px);
    }
}
@media screen and (max-width: 480px) {
    .wap_body {
        width: 100%;
        /* height: 100vh; */
    }
}

/*END */