:root {
  --body-bg:#f5f5f5;
  --primary-theme-background: #ffffff;
  --primary-theme-text: #212121;
  --primary-card-background: #f5f5f5;
  --primary-card-text: #212121;
  --primary-button-background: #212121;
  --primary-button-text: #ffffff;
  --primary-button-hbackground: #f5f5f5;
  --primary-button-htext: #212121;
  --primary-menu-bg: #ffffff;
  --bill-foot:#ffffff;
  --head-theme-bg:#f5f5f5;
  --head-theme-text:#212121;
  --dot-bg:#f5f5f5;
  --chkbox-bg:#f5f5f5;
  --chkbox-border:#f5f5f5;
  --chkbox-dot:#999999;
  --chkbox-checked-bg:#f5f5f5;
  --chkbox-checked-border:#f5f5f5;
  --chkbox-checked-dot:#212121;
  --chkbox-checked-label:#212121;


  --webfont:#212121;
  --webfont-dark:#212121;
  --purple:#5B32BC;
  --yellow:#FFBB00;
  --green:#55D292;
  --white:#fff;
  --red:#FF0044;
  --blue:#336fff;
  --lblue:#DFE8FF;
  --black: #212121;
  --lpurple:#E5DEF4;
  --lyellow:#FEF0CE;
  --tgreen:#55D292;
  --ltgreen:#D9F5E7;
  --lred:#FFD7E1;
  --head-band:#ffffff;
  --hover-bg:#f5f5f5;
  --tgray:#999999;
  --pink:#EC366B;
  --lpink:#FCDFE7;
  --border-color:rgba(153, 153, 153, 0.2);
}


body,
html {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0; 
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: 'Jost', sans-serif!important;
  color: var(--webfont-dark);
  font-weight: 400;
  font-size: 14px!important;
  /* letter-spacing: 0.008rem !important; */
  /* background-color: var(--body-bg); */
}

html {
  height: 100%;
}
body {
  height: calc(100vh - 160px) !important;
  overflow-y: scroll;
  overflow-x: hidden;
}
body::-webkit-scrollbar {
  width: 0;
}
body::-webkit-scrollbar-track {
  -webkit-box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1);
}
body::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.3);
}

h1,h2,h3,h4,h5,h6 {font-weight: 500;}
li,ol,ul {margin: 0;padding: 0;}
p {margin: 0;padding: 0;}
a,a:active,a:focus,a:hover,a:visited {text-decoration: none;}
a {outline: 0;border: none;}
a:active,a:focus,div {outline: 0;border: none;}
button:focus {outline: 0 !important;}
#social a {color: var(--black);}
a,button,input,select {outline: 0;border: none;}

/*Navbar*/
nav {
  background-color: var(--white);
  line-height: 0 !important;
  border-bottom: 1px solid #eee!important;
}
.nav-height {
  height: 60px;
  box-shadow: none!important;
}

.navbar {
  min-height: auto !important;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  /* -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  -ms-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); */
  border: none;
  position: fixed;
  top: 0;
  left: 0;
  /* z-index: 12; */
  z-index:100;
  width: 100%;
  background-color: var(--black);
  color: var(--white);
}
.navbar.navbar-brand {
  white-space: nowrap;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
}
.navbar .navbar-custom-right-menu {
  float: right;
}
.navbar .navbar-toggle {
  text-decoration: none;
  color: rgba(0, 0, 0, 0.64);
  width: 20px;
  height: 20px;
  margin-top: -4px;
  margin-right: 17px;
}
.navbar .navbar-toggle:before {
  content: "\E8D5";
  font-family: "Material Icons";
  font-size: 26px;
}
.navbar .navbar-collapse.in {
  overflow: visible;
}
.navbar {margin-bottom: 0 !important;}
.nav-fade {opacity: 0.6;overflow: hidden;pointer-events: none;}
.searchAll-fade {
  background-color: rgba(0, 0, 0, 0.45) !important;
  overflow: hidden;
}
.ls-closed .sidebar {
  margin-left: -300px;
}
.ls-closed section.content {
  margin-left: 15px;
}
.ls-closed .bars:after,
.ls-closed .bars:before {
  font-family: "Material Icons";
  font-size: 24px;
  position: absolute;
  top: 18px;
  left: 20px;
  margin-right: 10px;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.ls-closed .bars:before {
  content: "\E5D2";
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
}
.ls-closed .bars:after {
  content: "\E5C4";
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  -webkit-transform: scale(0);
  transform: scale(0);
}
.ls-closed .navbar-brand {
  margin-left: 30px;
}
.overlay-open .bars:before {
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  -webkit-transform: scale(0);
  transform: scale(0);
}
.overlay-open .bars:after {
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
}

.head-bg-black h3,
.head-bg-purple h3 {
  font-size: 18px;
  letter-spacing: 0.05rem;
}
.head-bg-black {
  background-color: var(--primary-theme-background) !important;
}

.head-bg-theme{
  background-color: var(--head-theme-bg);
  color:var(--head-theme-text);
}


.body-bg {
  background-image: url(../images/scanner-bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.scanner-bottom1 {
  border-radius: 50px;
  background-color: var(--tgray);
  opacity: 0.3;
  width: 50%;
  height: 8px;
}
.scanner-bottom-text {
  position: fixed;
  width: 100%;
  bottom: 0;
  display: inline-grid;
}
.splash-bg {
  background-image: linear-gradient(90deg, #4ad192, #4fa98d);
  background-image: -webkit-linear-gradient(90deg, #4ad192, #4fa98d);
  background-image: -o-linear-gradient(90deg, #4ad192, #4fa98d);
  background-image: -moz-linear-gradient(90deg, #4ad192, #4fa98d);
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.splash-bg2 {
  position: fixed;
  bottom: 0;
  background-image: url(../images/splash-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.splash-bg2-webp {
  position: fixed;
  bottom: 0;
  background-image: url(../images/splash-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.splash-logo {
  border-radius: 50%;
  background-color: #fff;
  padding: 20px;
  width: 130px;
  height: 130px;
  -webkit-box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1);
}
.splash-logo-img {
  position: relative;
  background-image: url(../images/Dinamic_Logo.png);
  background-repeat: no-repeat;
  background-position: center;
  width: 100px;
  height: 100px;
  margin-left: -5px;
  margin-top: -5px;
}


#screenbg {
  background: var(--primary-card-background);
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  max-height: 50%;
  background-position: center top;
  background-size: 100% 100%;
}
.screenbg {
  background: var(--primary-card-background) no-repeat center center;
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  max-height: 50%;
  background-position: center top;
  background-size: 100% 100%;
}
.screenbg-webp {
  background: var(--primary-card-background) no-repeat center center;
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  max-height: 50%;
  background-position: center top;
  background-size: 100% 100%;
}

#scanbg {
  background: url(../images/scan-bg.png) no-repeat center center;
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  max-height: 100%;
  background-position: center top;
  background-size: 100% 100%;
}
.scanbg {
  background: url(../images/scan-bg.png) no-repeat center center;
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  max-height: 100%;
  background-position: center top;
  background-size: 100% 100%;
}

.scanbg-webp {
  background: url(../images/scan-bg.webp) no-repeat center center;
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  max-height: 100%;
  background-position: center top;
  background-size: 100% 100%;
}


/*Font & Text properties*/
.font-6 {font-size: 6px;}.font-7 {font-size: 7px;}.font-8 {font-size: 8px;}.font-9 {font-size: 9px;}
.font-10 {font-size: 10px;}.font-11 {font-size: 11px;}.font-12 {font-size: 12px!important;}.font-13 {font-size: 13px;}
.font-14 {font-size: 14px !important;}.font-15 {font-size: 15px;}.font-16 {font-size: 16px !important;}
.font-17 {font-size: 17px;}.font-18 {font-size: 18px !important;}.font-19 {font-size: 19px;}.font-20 {font-size: 20px;}
.font-21 {font-size: 21px;}.font-22 {font-size: 22px;}.font-23 {font-size: 23px;}.font-24 {font-size: 24px;}
.font-25 {font-size: 25px;}.font-26 {font-size: 26px;}.font-27 {font-size: 27px;}.font-28 {font-size: 28px;}
.font-29 {font-size: 29px;}.font-30 {font-size: 30px;}.font-31 {font-size: 31px;}.font-32 {font-size: 32px;}
.font-33 {font-size: 33px;}.font-34 {font-size: 34px;}.font-35 {font-size: 35px;}.font-36 {font-size: 36px;}
.font-37 {font-size: 37px;}.font-38 {font-size: 38px;}.font-39 {font-size: 39px;}.font-40 {font-size: 40px;}
.font-41 {font-size: 41px;}.font-42 {font-size: 42px;}.font-43 {font-size: 43px;}.font-44 {font-size: 44px;}
.font-45 {font-size: 45px;}.font-46 {font-size: 46px;}.font-47 {font-size: 47px;}.font-48 {font-size: 48px;}
.font-49 {font-size: 49px;}.font-50 {font-size: 50px;}

.align-left {text-align: left;}.align-center {text-align: center;}
.align-right {text-align: right;}.align-justify {text-align: justify;}
.no-resize {resize: none;}
.font-bold {font-weight: 500!important;}
.font-bold500 {font-weight: 500;}
.font-weight-bold {font-weight: 500 !important;}
.font-italic {font-style: italic;}
.font-underline {text-decoration: underline;}
.font-line-through {text-decoration: line-through;}
.font-overline {text-decoration: overline;}
.text-bold {font-weight: 500;}
.text-upper {text-transform: uppercase;}

.valign-center {display: inline-flex !important;vertical-align: middle !important;align-items: center !important;}
.txt-style {text-transform: uppercase;}
#chkout > .align-center {text-align: center;}

.lt-sp-1 {letter-spacing: 1px;}
.lt-sp-1_5 {letter-spacing: 1.5px;}
.w-sp-4 {word-spacing: 4px;}
.l-sp-1 {letter-spacing: 1px;word-spacing: 2px;}

.text-limit {width: 150px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.item-limit {width: 200px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.text-right {text-align: right;}
.text-white {color: var(--black) !important;}
.text-purple {color: var(--primary-button-background) !important;}
.text-upper {text-transform: uppercase;letter-spacing: 0.05rem;}
.col-hgrey {color: var(--tgray);font-weight: 500;}
.col-grey {color: var(--tgray) !important;}
.col-lgrey {color: var(--hover-bg) !important;}
.col-black {color: var(--primary-theme-text) !important;}
.col-white {color: var(--white) !important;}
.col-black64 {color: rgba(33, 33, 33, 0.84);}


.text-purple {color: var(--purple) !important;}
.text-green {color: var(--tgreen) !important;}
.text-tgray{color:var(--tgray)!important;}
.text-red{color:var(--red);}
.text-yellow{color:var(--yellow);}
.valign-top{vertical-align: top;}
.valign-middle{vertical-align: middle;}

.bg-purple {background-color: var(--purple) !important;color: var(--white);}
.bg-purple .content .number,.bg-purple .content .text {color: var(--white) !important;}

.text-ellipsis {text-overflow: ellipsis;width: 300px;white-space: nowrap;overflow: hidden;}

.w-100 {width: 100%;}
.w-90 {width: 90%;}
.h-100 {height: 100%;}
.h-50-px {height: 50px;}
.h-100vh {height: 100vh !important;}

.pos-relative {position: relative;}
.pos-absolute {position: absolute;}

/*opacity & Radius*/
.opacity4 {opacity: 0.4;}
.opacity5 {opacity: 0.5;}
.opacity6 {opacity: 0.6;}
.opacity7 {opacity: 0.7;}
.opacity8 {opacity: 0.8;}
.opacity1 {opacity: 1;}

.radius2 {border-radius: 2px !important;}
.radius4 {border-radius: 4px !important;}
.radius6 {border-radius: 6px !important;}
.radius10 {border-radius: 10px 10px 0 0 !important;}

.bor-bottom0{border-bottom:0!important}

/*Padding & Margin*/
.no-pad {padding-left: 0 !important;padding-right: 0 !important;}
.no-leftpad {padding-left: 0 !important;padding-right: 10px !important;}
.no-rightpad {padding-left: 10px !important;padding-right: 0 !important;}
.pad-bot-20 {padding-bottom: 20px !important;}
.pad-bot-40 {padding-bottom: 40px !important;}
.pad-bot-60 {padding-bottom: 60px !important;}
.pad-bot-80 {padding-bottom: 80px !important;}
.pad-bot-100 {padding-bottom: 100px !important;}
.pad-bot-120 {padding-bottom: 120px !important;}
.pad-top-60 {padding-top: 60px !important;}
.pad-top-100 {padding-top: 100px !important;}
.pad-top-120 {padding-bottom: 120px !important;}
.pad-top-150 {padding-top: 150px !important;}
.pad {padding-left: 7px;padding-right: 7px;}.p-y-10 {padding-top: 10px;padding-bottom: 10px;}
.p-y-5 {padding-top: 5px; padding-bottom: 5px;}
.p-b-10 {padding-bottom: 10px;}.p-l-45 {padding-left: 45px !important;}
.p-l-55 {padding-left: 55px !important;}.p-t-28 {padding-top: 28px !important;}
.pad-left20 {padding-left: 20px;}
.pad5 {padding: 5px;}.pad10 {padding: 10px;}.pad15 {padding: 15px;}
.pad20 {padding: 20px !important;}.pad50 {padding: 50px;}
.pad-2 {padding: 2px !important;}
.p-5 {padding: 5px;}.p-10 {padding: 10px;}.p-11 {padding: 11px;}
.p-20{padding: 20px;}
.p-3{padding:16px!important}
.p_tb25_lr20 {padding: 25px 20px !important;}
.pad10 {padding-top: 1px;}
.p-t-2 {padding-top: 2px;}
.p-t-3 {padding-top: 3px;}
.px-0 {padding-left: 0 !important;padding-right: 0 !important;}
.px-3 {padding-left: 16px!important;padding-right: 16px !important;}
.no-pad-right {padding-right: 0 !important;}
.p-y-20 {padding-top: 20px;padding-bottom: 20px;}
.p-l-7 {padding-left: 7px;}
.l-p-0 {padding-left: 0;}
.p-confirm-0 {padding: 3px !important;}
.p-0 {padding: 0px !important;}

.p-l-0 {padding-left: 0;}.p-t-0 {padding-top: 0;}.p-r-0 {padding-right: 0;}.p-b-0 {padding-bottom: 0;}
.p-l-5 {padding-left: 5px;}.p-r-5 {padding-right: 5px;}.p-l-6 {padding-left: 6px;}.p-r-6 {padding-right: 6px;}
.p-t-12 {padding-top: 12px;}.p-t-13 {padding-top: 13px;}.p-t-5 {padding-top: 5px;}.p-b-5 {padding-bottom: 5px;}
.p-t-7 {padding-top: 7px;}
.p-l-10 {padding-left: 10px;}.p-t-10 {padding-top: 10px;}.p-r-10 {padding-right: 10px;}.p-b-10 {padding-bottom: 10px;}
.p-l-15 {padding-left: 15px;}.p-t-15 {padding-top: 15px;}.p-r-15 {padding-right: 15px;}.p-b-15 {padding-bottom: 15px;}
.p-l-20 {padding-left: 20px;}.p-t-20 {padding-top: 20px;}.p-r-20 {padding-right: 20px!important;}.p-b-20 {padding-bottom: 20px!important;}
.p-l-25 {padding-left: 25px;}.p-t-25 {padding-top: 25px;}.p-r-25 {padding-right: 25px;}.p-b-25 {padding-bottom: 25px;}
.p-l-30 {padding-left: 30px;}.p-t-30 {padding-top: 30px;}.p-r-30 {padding-right: 30px;}.p-b-30 {padding-bottom: 30px;}
.p-l-35 {padding-left: 35px;}.p-t-35 {padding-top: 35px;}.p-r-35 {padding-right: 35px;}.p-b-35 {padding-bottom: 35px;}
.p-l-40 {padding-left: 40px;}.p-t-40 {padding-top: 40px;}.p-r-40 {padding-right: 40px;}.p-b-40 {padding-bottom: 40px;}
.p-l-45 {padding-left: 45px;}.p-t-45 {padding-top: 45px;}.p-r-45 {padding-right: 45px;}.p-b-45 {padding-bottom: 45px;}
.p-l-50 {padding-left: 50px;}.p-t-50 {padding-top: 50px;}.p-r-50 {padding-right: 50px;}.p-b-50 {padding-bottom: 50px;}
.p-l-55 {padding-left: 55px;}.p-t-55 {padding-top: 55px;}.p-r-55 {padding-right: 55px;}.p-b-55 {padding-bottom: 55px;}
.p-l-60 {padding-left: 60px;}.p-t-60 {padding-top: 60px;}.p-r-60 {padding-right: 60px;}.p-b-60 {padding-bottom: 60px;}
.p-l-65 {padding-left: 65px;}.p-t-65 {padding-top: 65px;}.p-r-65 {padding-right: 65px;}.p-b-65 {padding-bottom: 65px;}
.p-l-70 {padding-left: 70px;}.p-t-70 {padding-top: 70px;}.p-r-70 {padding-right: 70px;}.p-b-70 {padding-bottom: 70px;}
.p-l-75 {padding-left: 75px;}.p-t-75 {padding-top: 75px;}.p-r-75 {padding-right: 75px;}.p-b-75 {padding-bottom: 75px;}
.p-l-80 {padding-left: 80px;}.p-t-80 {padding-top: 80px;}.p-r-80 {padding-right: 80px;}.p-b-80 {padding-bottom: 80px;}
.p-l-85 {padding-left: 85px;}.p-t-85 {padding-top: 85px;}.p-r-85 {padding-right: 85px;}.p-b-85 {padding-bottom: 85px;}
.p-l-90 {padding-left: 90px;}.p-t-90 {padding-top: 90px;}.p-r-90 {padding-right: 90px;}.p-b-90 {padding-bottom: 90px;}
.p-l-95 {padding-left: 95px;}.p-t-95 {padding-top: 95px;}.p-r-95 {padding-right: 95px;}.p-b-95 {padding-bottom: 95px;}
.p-l-100 {padding-left: 100px;}.p-t-100 {padding-top: 100px;}.p-r-100 {padding-right: 100px;}.p-b-100 {padding-bottom: 100px;}
.p-l-105 {padding-left: 105px;}.p-t-105 {padding-top: 105px;}.p-r-105 {padding-right: 105px;}.p-b-105 {padding-bottom: 105px;}
.p-l-110 {padding-left: 110px;}.p-t-110 {padding-top: 110px;}.p-r-110 {padding-right: 110px;}.p-b-110 {padding-bottom: 110px;}
.p-l-115 {padding-left: 115px;}.p-t-115 {padding-top: 115px;}.p-r-115 {padding-right: 115px;}.p-b-115 {padding-bottom: 115px;}
.p-l-120 {padding-left: 120px;}.p-t-120 {padding-top: 120px;}.p-r-120 {padding-right: 120px;}.p-b-120 {padding-bottom: 120px;}
.p-l-125 {padding-left: 125px;}.p-t-125 {padding-top: 125px;}.p-r-125 {padding-right: 125px;}.p-b-125 {padding-bottom: 125px;}
.padding-0 {padding: 0;}

.m-t-140 {margin-top: 140px;}
.m-t-145 {margin-top: 145px;}
.m-t-150 {margin-top: 150px;}
.m-t-155 {margin-top: 155px;}
.m-t-160 {margin-top: 160px;}
.m-t-165 {margin-top: 165px;}
.h3-style {margin: 0 !important;}
.no-margin {margin-left: 0 !important;margin-right: 0 !important;line-height: 1.5 !important;}
.mar-bottom {margin: 0;}
.mar-bot-10 {margin-bottom: 10px !important;}
.m-t-180 {margin-top: 180px;}
.m-b-18 {margin-bottom: 18px !important;}
.m-t-18 {margin-top: 18px !important;}
.mb-0{margin-bottom: 0!important;}
.mb-2{margin-bottom: .5rem!important;}
.mb-3{margin-bottom: 1.5rem!important;}
.my-3{margin-top: 1.5rem!important;margin-bottom: 1.5rem!important;}
.matcard-mb65 {margin-bottom: 65px !important;}
.matcard-mb70 {margin-bottom: 70px !important;}
.matcard-mb80 {margin-bottom: 80px !important;}
.matcard-mb120 {margin-bottom: 120px !important;}
.matcard-mb15 {margin-bottom: 15px !important;}
.matcard-mb20 {margin-bottom: 20px !important;}
.matcard-mb40 {margin-bottom: 40px !important;}
.m-t-55 {margin-top: 55px;}
.m-0 {margin: 0 !important;}


/*Button*/

.btn_ripple{
  position: relative;
  overflow: hidden; 
}

.btn_ripple:before {
  border-radius: 50%;
  background-color: rgba(255,255,255,0.6);
  content:'';
  position: absolute;
  top: 50%; left: 50%;
  width:0; height:0;
}

.btn_ripple:focus:before {
  transition: all 0.5s ease-out;
  opacity:0;
  width:160px;
  height:160px;
  margin-top:-80px;
  margin-left:-80px;
}

/* .btn_ripple {transition: 0.8s background;}
.btn_ripple:hover {background: #eee radial-gradient(circle, transparent 1%, #fff 1%) center/15000%;}
.btn_ripple:active {background-color: #fff;background-size: 100%;transition: background 0s;} */


.btn {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  color: #fff;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  text-align: center;
  text-transform: uppercase;
  min-width: auto;
  padding: .55rem .75rem;
  font-size: 15px;
  font-weight:500;
  border-radius:14px;
}

/* .btn:hover {
  color: var(--white);
  box-shadow: none;
  border-radius:14px;  
} */


.btn:focus,.btn:active {
  /* color: var(--white); */
  box-shadow: none;
  /* border-radius:14px;   */
}


.btn-primary-theme {
  color: var(--primary-button-text);
  background-color: var(--primary-button-background);
  border:2px solid var(--primary-button-background);
}
.btn-primary-theme:hover 
{
  /* color:var(--primary-button-htext)!important;
  background-color:var(--primary-button-hbackground)!important; 
  border-color: var(--primary-button-text); */
  color: var(--primary-button-text);
  background-color: var(--primary-button-background);
  border:2px solid var(--primary-button-background);
}

.btn-primary-theme .material-icons{font-size:20px!important;font-weight:500}

.btn-primary-outline { 
  background-color: var(--primary-theme-background);
  color: var(--primary-theme-text);
  border:2px solid var(--primary-theme-text);  
}  
.btn-primary-outline:hover {
  color:var(--primary-button-text)!important;  
  border-radius:14px;
  border:2px solid var(--primary-button-text)!important; 
  background-color: var(--primary-button-background);
}


.btn-purple {
  background: var(--lpurple);
  color: var(--purple); 
}
.btn-purple:hover
 {
  background-color:var(--purple)!important;         
  color:var(--white)!important;  
}


.btn-purple-outline { 
  color: var(--purple);
  border:2px solid var(--purple);   
}  
.btn-purple-outline:hover {
  color: var(--white)!important; 
  border-radius:14px;
  border:2px solid var(--purple)!important; 
  background-color: var(--purple);
}

.btn-purple-text {
  background: transparent;
  color: var(--purple); 
}
.btn-purple-text:hover{
  background-color:transparent;         
  color: var(--purple)!important;    
}
  


.btn-yellow { 
  background: var(--lyellow);
  color: var(--yellow);
}
.btn-yellow:hover {
  background-color:var(--yellow)!important;         
  color: var(--white)!important;    
}


.btn-red {
  background: var(--lred);
  color: var(--red); 
}
.btn-red:hover {
  background-color:var(--red)!important;         
  color:var(--white)!important;    
}

.btn-red-text {
  background: transparent;
  color: var(--red);
} 
.btn-red-text:hover {
  background-color:transparent;         
  color: var(--red);
}


.btn-gray-text {
  background: transparent;
  color: var(--tgray); 
}
.btn-gray-text:hover
 {
  background-color:transparent;         
  color: var(--tgray)!important;    
}


.btn-green { 
  background-color: var(--ltgreen);
  color:var(--tgreen);
}
.btn-green:hover
{
  background-color:var(--tgreen)!important;         
  color:var(--white)!important;    
}



.back-circle
{
  color: var(--tgreen)!important;
  background-color:var(--ltgreen);
  border-radius: 100%;
  padding:8px!important;
}

.back-circle a{color:var(--tgreen)}

.back-circle:hover
 {
  background-color:var(--tgreen)!important;         
  color:var(--white)!important;
  border-radius: 50%;  
}

.back-circle:hover a{color:var(--white)}


.btn-pink {
  color: var(--pink);
  background-color: var(--lpink);
}
.btn-pink:hover {
  background-color:var(--pink)!important;         
  color:var(--white)!important;    
}

.btn-black {
  color: var(--black);
  background-color: var(--hover-bg);
}
.btn-black :hover
 {
  background-color:var(--black)!important;         
  color:var(--white)!important;  
}



.btn-text-black {
  color: var(--black);
  background-color: transparent;
}
.btn-text-black:hover
 {                
  color:var(--tgray)!important;
}

.btn-white {
  color: var(--black);
  background-color: var(--white);
}
.btn-white:hover {
  background-color:var(--black)!important;         
  color:var(--white)!important;  
}



.btn-gray {
  color: var(--tgray);
  background-color: var(--hover-bg);
}
.btn-gray:hover{
  background-color:var(--hover-bg)!important;         
  color:var(--tgray)!important;     
}

.btn-login {color: rgba(0, 0, 0, 0.45);}
.btn-link {cursor: pointer;color: #212121 !important;}
.log-btn {
  -webkit-box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1);
  width: 40%;
  background-color: #fff;
  font-size: 14px;
  color: #512da8;
}

.btn-pay {
  margin: 0;
  width: 100%;
  font-size: 14px;
  background: #ccc;
  color: #fff;
  letter-spacing: 0.05rem; 
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  /* width: 113px; */
  /* height: 50px; */
}

/*Card*/
.card { 
  position: relative;  
  background: var(--white);
  border-radius: 14px;
  /* -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);*/
  -webkit-box-shadow: 0rem 0.3125rem 0.3125rem 0rem rgba(82, 63, 105, 0.05);
  box-shadow: 0rem 0.3125rem 0.3125rem 0rem rgba(82, 63, 105, 0.05);       
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;   
  margin-bottom: 15px; 
}

.card:hover
{   
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);  
  z-index:99;
}

.card .header {color: var(--tgray);padding: 15px;position: relative;border-bottom: 0 solid rgba(204, 204, 204, 0.65);}
.card .card-inside-title {margin-top: 25px;margin-bottom: 15px;display: block;font-size: 15px;color: var(--black);}
.card .card-inside-title small {color: var(--tgray);display: block;font-size: 11px;margin-top: 5px;}
.card .card-inside-title small a {color: var(--tgray);font-weight: 500;}
.card .card-inside-title:first-child {margin-top: 0;}
.card .header .header-dropdown {position: absolute;top: 20px;right: 20px;list-style: none;}
.card .header .header-dropdown .dropdown-menu li {display: block !important;}
.card .header .header-dropdown li {display: inline-block;}
.card .header .header-dropdown i {font-size: 20px;color: var(--tgray);-moz-transition: all 0.5s;-o-transition: all 0.5s;
  -webkit-transition: all 0.5s;transition: all 0.5s;}
.card .header .header-dropdown i:hover {color: var(--black);}
.card .header h2 {margin: 0;font-size: 20px;font-weight: 500;}
.card .header h2 small {display: block;font-size: 12px;margin-top: 5px;color: var(--tgray);line-height: 15px;}
.card .header h2 small a {color: var(--tgray);font-weight: 500;}
.card .header .col-xs-12 h2 {margin-top: 5px;}
.card .body {font-size: 14px;color: var(--tgray);padding: 20px;}

.spin-center {position: absolute;top: 45%;bottom: 0;left: 0;right: 0;}
.camera-center {position: absolute;top: 20%;bottom: 0;left: 0;right: 0;width: 80%;margin: 0 auto;}

/*Welcome Content*/
.welcome-content-link a {color: var(--purple);font-size: 13px;}
.welcome-content-link a:hover {text-decoration: none;}
#welcome-content h1,#welcome-content h1 a {font-size: 20px;color: var(--black);}
#welcome-content h1 a:hover {text-decoration: none;}
#welcome-content h2 {font-size: 18px;color: var(--primary-card-text);}
.p1 {padding: 6px 12px 12px 0;font-size: 14px;color: var(--tgray);}
.p2 {font-size: 14px;color: var(--tgray);}
.widget-cardborder {border-bottom: 1px solid rgba(153, 153, 153, 0.2);}
.widget-cardborder1 {border-top: 1px solid rgba(153, 153, 153, 0.2);}
.p2 a {font-size: 14px;color: rgba(0, 0, 0, 0.64);}
.p2 a:hover {text-decoration: none;}
.login-logo {width: 40%;}
#login p {color: var(--tgray);}


/*Toast message*/
.tinfo-toast-box {background-color: #1a1a1a;color: #fff;font-size: 15px;margin: 0;padding: 15px;
position: fixed;bottom: 0;left: 0;z-index: 12000;width: 100%;}
.tinfo-toast-box .toast-text {float: left;padding-left: 10px;text-align: left;width: auto;word-break: break-all;}
.tinfo-toast-box .toast-icon {width: 32px;float: left;background-repeat: no-repeat;background-position: center center;}
#toast_info a {text-transform: uppercase;color: var(--yellow);text-align: right;}
.tfoot-toast-box {background-image: linear-gradient(45deg, #568e91, #f3e7c8);background-image: -webkit-linear-gradient(45deg, #568e91, #f3e7c8);
background-image: -o-linear-gradient(45deg, #568e91, #f3e7c8);background-image: -moz-linear-gradient(45deg, #568e91, #f3e7c8);
color: #fff;font-size: 14px;margin: 0;padding: 15px;position: fixed;bottom: 0;left: 0;z-index: 12000;width: 100%;}
.tfoot-toast-box .toast-text {float: left;padding-left: 10px;text-align: left;width: auto;word-break: break-all;}
.tfoot-toast-box .toast-icon {width: 32px;float: left;background-repeat: no-repeat;background-position: center center;}
.tfoot-toast-box .toast-text {float: left;padding-left: 10px;text-align: left;width: auto;word-break: break-all;}
.tfoot-toast-box .toast-icon {width: 32px;float: left;background-repeat: no-repeat;background-position: center center;position: absolute;
width: 100%;padding: 20px;color: #fff;bottom: 0;}

.error-msg {font-size: 12px;color: var(--red);}
.success-msg {font-size: 12px;color: var(--green);}

.veg-size {font-size: 12px;letter-spacing: 0.05rem;}

/*Menu List*/
.menu-list {width: 100%;z-index: 1030;margin: 0 auto;}
.menu-list ul {list-style-type: none;padding: 0;display: flex;justify-content: space-between;width: 100%;table-layout: fixed;overflow-x: scroll;}
.menu-list ul li:nth-child(1) {border: none;padding-left: 10px;}
.menu-list ul li:last-child {padding-right: 10px;}
.menu-list ul li {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;width: auto;
text-align: center;list-style-type: none;z-index: 9999;padding: 5px 10px 0;}
.menu-list ul li a {color: var(--black);letter-spacing: 0.02rem;}
.menu-list ul li a:hover {text-decoration: none;}
.menu-list ul li a span {border-radius: 50%;padding: 8px;  width: 55px;height: 55px;
background-color: var(--primary-menu-bg);
outline: 0;border: none;display: inline-flex;justify-content: center;
align-items: center;
/* -webkit-box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);
box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1); */
-webkit-box-shadow: 0rem 0.3125rem 0.3125rem 0rem rgba(82, 63, 105, 0.05);
  box-shadow: 0rem 0.3125rem 0.3125rem 0rem rgba(82, 63, 105, 0.05); 
}
.menu-list ul li a p {font-size: 12px;padding-top: 10px;overflow: hidden;text-overflow: ellipsis;text-transform: uppercase;font-weight:500}
.menuicon-width {width: 45px;height: auto;}
#item a {color: var(--primary-card-text);}

.badge1[data-badge]:after {
  content: attr(data-badge);
  position: absolute;
  margin-top: -88px;
  margin-left: 10px;
  background: var(--red);
  width: 15px;
  height: 15px;
  line-height: 18px;
  border-radius: 50%;
}

.item-count {
  border-radius: 14px;
  color: var(--white);
  padding: 7.5px 18px 7.5px 18px;
  font-size: 16px;
  text-align: center;
  min-width: 40px;
}
.item-count2 {
  border-radius:14px; 
  padding: 2px 16px 2px 16px;
  font-size: 16px;
  text-align: center;
  color: var(--black) !important;
  font-weight: 500;
}
.item-btnbg {
  background: var(--primary-button-background) !important;
  color: var(--primary-button-text) !important;
}
.add-btn {
  border-radius: 10px;
  border: 0;
}
.itemhead-radius {
  border-radius: 4px 4px 0 0;
}


/*bottom footer card*/
.note-foot {position: absolute;width: 100%;background-color: var(--yellow);padding: 20px;color: #fff;bottom: 0;}
.bottom-foot {position: absolute;width: 100%;background-color: var(--yellow);padding: 20px;color: #fff;}
.note-foot a,.vieworder-foot a,.vieworder-foot-btn a {  color: var(--black) !important;}
.note-foot a:hover {text-decoration: none;}
.addnote-top {margin-left: -15px;margin-right: -15px;}
.link a,.note-foot a:hover,.vieworder-foot a:hover,.vieworder-foot-btn a:hover {color: var(--primary-theme-text) !important;}
.vieworder-foot-btn a:active {background-color: #f3e7c8;}
.link a:hover {text-decoration: none;}
.md-headline {font-size: 14px;text-transform: uppercase;letter-spacing: 0.05rem;}
.item-btnbggrey {background-color: var(--hover-bg);color: var(--black);}

.vieworder-foot {
  background: #a8786d;
  background: -moz-linear-gradient(45deg, #a8786d 0, #a8786d 30%, #ffc333 70%, #ffc333 100%);
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0, #a8786d), color-stop(30%, #a8786d), color-stop(70%, #ffc333), color-stop(100%, #ffc333));
  background: -webkit-linear-gradient(45deg, #a8786d 0, #a8786d 30%, #ffc333 70%, #ffc333 100%);
  background: -o-linear-gradient(45deg, #a8786d 0, #a8786d 30%, #ffc333 70%, #ffc333 100%);
  background: -ms-linear-gradient(45deg, #a8786d 0, #a8786d 30%, #ffc333 70%, #ffc333 100%);
  background: linear-gradient(45deg, #a8786d 0, #a8786d 30%, #ffc333 70%, #ffc333 100%);
  color: #fff;font-size: 14px;margin: 0;padding: 15px;position: fixed;bottom: 0;
  left: 0;z-index: 12000;width: 100%;
}
.vieworder-foot-btn { background-color: var(--primary-button-background);color: var(--primary-button-text) !important;
  font-size: 15px;margin: 0;padding: 15px;z-index: 12000;border-radius: 14px;width: 100%;}
.vieworder-foot-btn1 {background-color: var(--purple);color: #fff !important;font-size: 16px;
  margin: 0;padding: 15px;z-index: 12000;border-radius: 4px;width: 100%;}
.vieworder-foot-white {background-color: #fff;color: #212121;font-size: 14px;padding-bottom: 15px;margin: 0;
  position: fixed;bottom: 0;left: 0;z-index: 12000;width: 100%; -webkit-box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);}
.vieworder-foot-white a {color: #212121;}
.vieworder-foot-white a .material-icons{color:var(--tgray); font-size: 20px!important;}

.stage {display: flex;justify-content: center;align-items: center;overflow: hidden;}
.filter-contrast {filter: contrast(5);background-color: #fff;}


.dot-flashing,.dot-flashing::after,.dot-flashing::before {width: 8px;height: 8px;border-radius: 5px;background-color: var(--dot-bg);color: var(--dot-bg);}
.dot-flashing {position: relative;animation: dotFlashing 1s infinite linear alternate;animation-delay: 0.5s;}
.dot-flashing::after,.dot-flashing::before {content: "";display: inline-block;position: absolute;top: 0;}
.dot-flashing::before {left: -18px;animation: dotFlashing 1s infinite alternate;animation-delay: 0s;}
.dot-flashing::after {left: 18px;animation: dotFlashing 1s infinite alternate; animation-delay: 1s;}
@keyframes dotFlashing {
  0% {
      background-color: var(--primary-theme-text);
  }
  100%,
  50% {
      background-color: var(--dot-bg);
  }
}

.bill-foot {
  margin: 0;padding: 15px 5px;position: fixed !important;
  bottom: 0;left: 0;right: 0;z-index: 999;width: 100%;
  font-size: 15px;background: var(--bill-foot);color: var(--primary-theme-text);
  /* letter-spacing: 0.1rem; */
  /* -webkit-box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 45px 5px rgba(0, 0, 0, 0.1); */
  -webkit-box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);      
}
.bill-foot .material-icons{font-size:22px!important}

.bill-foot2 {
  background-color: var(--bill-foot);color: var(--primary-theme-text);
  font-size: 15px;margin: 0;
  padding: 8px 5px 8px 0;
  /* padding: 15px 5px; */
  position: fixed;
  bottom: 53px;left: 0;z-index: 999;width: 100%;
  /* -webkit-box-shadow: 5px -7px 20px 7px rgba(0, 0, 0, 0.22);
  box-shadow: 5px -7px 20px 7px rgba(0, 0, 0, 0.22); */
  -webkit-box-shadow: 0 -10px 20px rgba(0, 0, 0, 0.1);
  box-shadow: 0 -10px 20px rgba(0, 0, 0, 0.1);   
}

.bill-foot2 .material-icons{font-size:22px!important;color:var(--tgray)}


.subhead {color: var(--tgray);font-size: 20px;}

.center-div100 {width: 100%; margin: 0 auto;position: relative;text-align: center;}
.center-div80 {width: 80%;margin: 0 auto;position: relative;text-align: center;}
.center-div50 {width: 50%;margin: 0 auto;}
.center-div15 {width: 15%;margin: 0 auto;}


.hr-border {margin-top: 10px;border: 0;border-top: 1px solid rgba(153, 153, 153, 0.2);}
.hr-border2 {margin-bottom: 20px;margin-top: 10px;border: 0;border-bottom: 1px solid rgba(153, 153, 153, 0.2);}
.hr-border-bill {margin-bottom: 10px;margin-top: 10px;border: 0;border-bottom: 1px solid rgba(153, 153, 153, 0.2);}
.hr-border3 {margin-bottom: 10px;border: 0;border-bottom: 2px solid rgba(153, 153, 153, 0.2);}
.hr-line,.hr-line1 {width: 100%;position: relative;}
.addons-subhead,.hr-icon,.hr-line,.hr-line1 {position: relative;}
.hr-theme-slash-2 {display: -ms-flexbox;display: -webkit-flex;display: flex;-ms-flex-align: center;-webkit-align-items: center;
-webkit-box-align: center;align-items: center;}
.hr-line {border-bottom: 1px solid var(--border-color);}
.hr-icon {text-align: center;white-space: nowrap;}
.hr-icon::selection {color: var(--green);}
.hr-or {overflow: visible;padding: 0;border: none;border-top: 1px solid rgba(153, 153, 153, 0.2);text-align: center;}
hr {border-top: 1px solid rgba(153, 153, 153, 0.2) !important;}



.finaldiv {color: #fff;font-size: 14px;margin: 0;border-radius: 4px;
  -webkit-box-shadow: 0 1px 4px rgb(0 0 0 / 20%);box-shadow: 0 1px 4px rgb(0 0 0 / 20%);}
.finalbg {background: #fff;border-radius: 4px 4px 0 0;}
.finalbg-text {
  color:var(--primary-card-text)
/* background: -moz-linear-gradient(90deg, #4750de 0, #4750de 10%, #5b32bc 90%, #5b32bc 100%);
background: -webkit-gradient(linear, left bottom, right top, color-stop(0, #4750de), color-stop(10%, #4750de), color-stop(90%, #5b32bc), color-stop(100%, #5b32bc));
background: -webkit-linear-gradient(90deg, #4750de 0, #4750de 10%, #5b32bc 90%, #5b32bc 100%);
background: -o-linear-gradient(90deg, #4750de 0, #4750de 10%, #5b32bc 90%, #5b32bc 100%);
background: -ms-linear-gradient(90deg, #4750de 0, #4750de 10%, #5b32bc 90%, #5b32bc 100%);
background: linear-gradient(90deg, #4750de 0, #4750de 10%, #5b32bc 90%, #5b32bc 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent; */
}
.finalbg2 {background: #fff;border-radius: 0 0 4px 4px;color: var(--black);}
#fback p {padding-right: 100px;}

.width-38px {font-size: 12px;}
.width-60px {width: 60px;font-size: 13px;}
.width-80px {width: 80px;font-size: 13px;}





.ps-timeline-sec {
  position: relative;
  background: var(--white);
}
.ps-timeline-sec .container {
  position: relative;
  width: 100%;
}
.ps-timeline-sec .timeline-content {
  position: relative;
}
.ps-timeline-sec .timeline-content ol.ps-timeline {
  margin: 50px 0;
  padding: 0;
  border-top: 2px solid rgba(153, 153, 153, 0.2);
  list-style: none;
}
.ps-timeline-sec .timeline-content ol.ps-timeline li {
  float: left;
  width: 33.33%;
  padding-top: 20px;
  position: relative;
}
.ps-timeline-sec .timeline-content ol.ps-timeline li span {
  width: 50px;
  height: 50px;
  margin-left: -25px;
  text-align: center;
  line-height: 50px -10;
  color: var(--yellow);
  font-size: 2em;
  font-style: normal;
  position: absolute;
  top: -26px;
  left: 50%;
}
.ps-timeline .text1 {
  font-style: italic;
  font-size: 13px;
  color: var(--tgray);
}
.ps-timeline .text2 {
  font-style: italic;
  font-size: 16px;
  color: var(--purple); 
}
.ps-timeline-sec .timeline-content ol.ps-timeline li:nth-child(1) {
  margin-left: -50px;
}
.ps-timeline-sec .timeline-content ol.ps-timeline li:nth-child(2) {
  margin-left: 45px;
}
.ps-timeline-sec .timeline-content ol.ps-timeline li:nth-child(3) {
  padding-left: 80px;
}
.ps-timeline-sec .timeline-content ol.ps-timeline li:nth-child(3) span {
  padding-left: 50px;
}
.ffps-timeline-sec {
  position: relative;
  background: #fff;
}
.ffps-timeline-sec .container {
  position: relative;
}
.ffps-timeline-sec .container ol.ffps-timeline {
  margin: 20px 0;
  padding: 0;
  border-top: 2px solid #c5c5c5;
  list-style: none;
}
.ffps-timeline-sec .container ol.ffps-timeline li {
  float: left;
  width: 20%;
  padding-top: 30px;
  position: relative;
}
.ffps-timeline-sec .container ol.ffps-timeline li span {
  width: 50px;
  height: 50px;
  margin-left: -25px;
  border-radius: 50%;
  box-shadow: 0 0 0 0 #fff;
  text-align: center;
  line-height: 50px -10;
  color: #df8625;
  font-size: 2em;
  font-style: normal;
  position: absolute;
  top: -18px;
  left: 50%;
}
.ffps-timeline-sec .container ol.ffps-timeline li .img-handler-top {
  position: absolute;
  bottom: 0;
  margin-bottom: 130px;
  width: 100%;
}
.ffps-timeline-sec .container ol.ffps-timeline li .img-handler-top img {
  display: table;
  margin: 0 auto;
}
.ffps-timeline-sec .container ol.ffps-timeline li .img-handler-bot {
  position: absolute;
  margin-top: 60px;
  width: 100%;
}
.ffps-timeline-sec .container ol.ffps-timeline li .img-handler-bot img {
  display: table;
  margin: 0 auto;
}
.ffps-timeline-sec .container ol.ffps-timeline li p {
  text-align: center;
  width: 80%;
  margin: 0 auto;
}
.ffps-timeline-sec .container ol.ffps-timeline li .ps-top {
  position: absolute;
  bottom: 0;
  margin-bottom: 100px;
}
.ffps-timeline-sec .container ol.ffps-timeline li .ps-bot {
  position: absolute;
  margin-top: 35px;
}
.mmps-timeline-sec {
  position: relative;
  background: #fff;
}
.mmps-timeline-sec .container {
  position: relative;
  width: 100%;
}
.mmps-timeline-sec .container ol.mmps-timeline {
  margin: 50px 0;
  padding: 0;
  border-top: 2px solid #c5c5c5;
  list-style: none;
}
.mmps-timeline-sec .container ol.mmps-timeline li {
  float: left;
  width: 33.33%;
  padding-top: 30px;
  position: relative;
}
.mmps-timeline-sec .container ol.mmps-timeline li span {
  width: 50px;
  height: 50px;
  margin-left: -25px;
  border-radius: 50%;
  box-shadow: 0 0 0 0 #fff;
  text-align: center;
  line-height: 50px -10;
  color: #df8625;
  font-size: 2em;
  font-style: normal;
  position: absolute;
  top: -25px;
  left: 50%;
}
.mmps-timeline-sec .container ol.mmps-timeline li .img-handler-top {
  position: absolute;
  bottom: 0;
  margin-bottom: 130px;
  width: 100%;
}
.mmps-timeline-sec .container ol.mmps-timeline li .img-handler-top img {
  display: table;
  margin: 0 auto;
}
.mmps-timeline-sec .container ol.mmps-timeline li .img-handler-bot {
  position: absolute;
  margin-top: 60px;
  width: 100%;
}
.mmps-timeline-sec .container ol.mmps-timeline li .img-handler-bot img {
  display: table;
  margin: 0 auto;
}
.mmps-timeline-sec .container ol.mmps-timeline li p {
  text-align: center;
  width: 80%;
  margin: 0 auto;
}
.mmps-timeline-sec .container ol.mmps-timeline li .ps-top {
  position: absolute;
  bottom: 0;
  margin-bottom: 100px;
}
.mmps-timeline-sec .container ol.mmps-timeline li .ps-bot {
  position: absolute;
  margin-top: 35px;
}
.mmps-timeline .text1 {
  font-style: italic;
  font-size: 13px;
  color: var(--tgray);
}
.mmps-timeline .text2 {
  font-style: italic;
  font-size: 16px;
  color: var(--purple);
}



#custom > .md-radio {
  margin: 5px 0;
}
#custom > .md-radio.md-radio-inline {
  display: inline-block;
}
#custom > .md-radio input[type="radio"] {
  display: none;
}
#custom > .md-radio input[type="radio"]:checked + label:before {
  border-color: #212121 !important;
  animation: ripple 0.2s linear forwards;
}
#custom > .md-radio input[type="radio"]:checked + label:after {
  transform: scale(1);
}
#custom > .md-radio label {
  display: inline-block;
  height: 30px;
  position: relative;
  padding: 0 30px;
  margin-bottom: 0;
  cursor: pointer;
  vertical-align: bottom;
  color: #8d8d8d;
  font-size: 1.5rem;
}
#custom > .md-radio label:after,
#custom > .md-radio label:before {
  position: absolute;
  content: "";
  border-radius: 50%;
  transition: all 0.3s ease;
  transition-property: transform, border-color;
}
#custom > .md-radio label:before {
  left: 0;
  width: 18px;
  height: 18px;
  border: 2px solid #8d8d8d;
}
#custom > .md-radio label:after {
  top: 5px;
  left: 5px;
  width: 8px;
  height: 8px;
  transform: scale(0);
  background: #512da8;
}
#custom > .md-radio input[type="radio"]:checked + label {
  color: var(--purple); 
}
.modal-position1 {
  position: fixed;
  left: 0;
  right: 0;
  top: 20%;
  z-index: 99999;
}
.modal-lg p {
  font-size: 14px;
  width: 80%;
}
.modal-position2 {
  position: fixed;
  left: 0;
  right: 0;
  top: 5%;
}
.modal-headpad {
  padding: 25px 10px 5px 10px;
  border: none;
}
.mod-close {
  padding: 0 15px 0 0;
  color: var(--tgray);
}
.modal-headpad1 {
  padding: 20px 10px 20px 10px;
  border-bottom: 1px solid var(--border-color);
}
.modal-headpad2 {
  padding: 20px 10px 10px 10px;
  border-bottom: 0 solid var(--border-color);
  height: 130px;
}
.btn-cancel,
.btn-cancel:active,
.btn-cancel:focus,
.btn-cancel:hover {
  color: rgba(0, 0, 0, 0.25) !important;
}

.modal-overflow {
  scrollbar-color: #212121 #ffffff;
  scrollbar-width: none !important;
}
.modal-overflow::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  border-radius: 20px;
  background-color: transparent;
}
.modal-overflow::-webkit-scrollbar-thumb{
  background: #212121;
  border-radius: 20px;
}


.modal-overflow {
  height: 400px;
  overflow-y: scroll;
}
.cart-overflow {
  overflow-y: scroll;
  overflow-x: hidden;
}
.body ul li a {
  color: var(--purple);
}
.body ul li a:hover {
  text-decoration: none;
}
.body ul li {
  list-style: none;
}
.body ul {
  padding-top: 20px;
}
.pad-top30 {
  padding-top: 30px;
}
.body h3 {
  color: var(--black);
  font-size: 18px;
  padding-bottom: 5px;
}
.body p {
  color: var(--tgray);
  padding-bottom: 15px;
}
.edit-link a {
  color: var(--purple);
  font-size: 13px;
}
.edit-link a:hover {
  text-decoration: none;
}
.securelogo-size {
  width: 90%;
}
.secure-centerdiv {
  width: 80%;
  margin: 0 auto;
}
.secure-centerdiv h3 {
  color: var(--black);
  font-size: 20px;  
  padding-top: 10px;
  padding-bottom: 10px;
}
.secure-centerdiv a {
  color: var(--blue);
  font-size: 13px;
}
.secure-centerdiv a:hover {
  text-decoration: none;
}




@keyframes ripple {
  0% {
      box-shadow: 0 0 0 1px transparent;
  }
  50% {
      box-shadow: 0 0 0 15px rgba(0, 0, 0, 0.1);
  }
  100% {
      box-shadow: 0 0 0 15px transparent;
  }
}
.md-radio {
  margin: 5px 0;
}
.md-radio.md-radio-inline {
  display: inline-block;
}
.md-radio input[type="radio"] {
  display: none;
}
.md-radio input[type="radio"]:checked + label:before {
  border-color: var(--primary-button-background);
  animation: ripple 0.2s linear forwards;
}
.md-radio input[type="radio"]:checked + label:after {
  transform: scale(1);
}
.md-radio label {
  display: inline-block;
  height: 30px;
  position: relative;
  padding: 0 30px;
  margin-bottom: 0;
  cursor: pointer;
  vertical-align: bottom;
  color: var(--black);
  font-size: 15px;
}
.md-radio label:after,
.md-radio label:before {
  position: absolute;
  content: "";
  border-radius: 50%;
  transition: all 0.3s ease;
  transition-property: transform, border-color;
}
.md-radio label:before {
  left: 0;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(0, 0, 0, 0.54);
}
.md-radio label:after {
  top: 5px;
  left: 5px;
  width: 8px;
  height: 8px;
  transform: scale(0);
  background: var(--primary-button-background);
}
.md-radio input:checked ~ span,
.md-radio input[type="radio"]:checked + label {
  color: var(--black);
}
.md-checkbox input ~ span,
.md-radio input ~ span {
  font-size: 15px;
}
.bottom-text {
  position: fixed;
  width: 100%;
  bottom: 0;
}


.m-l--125 {
  margin-left: -125px;
}
.m-t--125 {
  margin-top: -125px;
}
.m-r--125 {
  margin-right: -125px;
}
.m-b--125 {
  margin-bottom: -125px;
}
.m-l--120 {
  margin-left: -120px;
}
.m-t--120 {
  margin-top: -120px;
}
.m-r--120 {
  margin-right: -120px;
}
.m-b--120 {
  margin-bottom: -120px;
}
.m-l--115 {
  margin-left: -115px;
}
.m-t--115 {
  margin-top: -115px;
}
.m-r--115 {
  margin-right: -115px;
}
.m-b--115 {
  margin-bottom: -115px;
}
.m-l--110 {
  margin-left: -110px;
}
.m-t--110 {
  margin-top: -110px;
}
.m-r--110 {
  margin-right: -110px;
}
.m-b--110 {
  margin-bottom: -110px;
}
.m-l--105 {
  margin-left: -105px;
}
.m-t--105 {
  margin-top: -105px;
}
.m-r--105 {
  margin-right: -105px;
}
.m-b--105 {
  margin-bottom: -105px;
}
.m-l--100 {
  margin-left: -100px;
}
.m-t--100 {
  margin-top: -100px;
}
.m-r--100 {
  margin-right: -100px;
}
.m-b--100 {
  margin-bottom: -100px;
}
.m-l--95 {
  margin-left: -95px;
}
.m-t--95 {
  margin-top: -95px;
}
.m-r--95 {
  margin-right: -95px;
}
.m-b--95 {
  margin-bottom: -95px;
}
.m-l--90 {
  margin-left: -90px;
}
.m-t--90 {
  margin-top: -90px;
}
.m-r--90 {
  margin-right: -90px;
}
.m-b--90 {
  margin-bottom: -90px;
}
.m-l--85 {
  margin-left: -85px;
}
.m-t--85 {
  margin-top: -85px;
}
.m-r--85 {
  margin-right: -85px;
}
.m-b--85 {
  margin-bottom: -85px;
}
.m-l--80 {
  margin-left: -80px;
}
.m-t--80 {
  margin-top: -80px;
}
.m-r--80 {
  margin-right: -80px;
}
.m-b--80 {
  margin-bottom: -80px;
}
.m-l--75 {
  margin-left: -75px;
}
.m-t--75 {
  margin-top: -75px;
}
.m-r--75 {
  margin-right: -75px;
}
.m-b--75 {
  margin-bottom: -75px;
}
.m-l--70 {
  margin-left: -70px;
}
.m-t--70 {
  margin-top: -70px;
}
.m-r--70 {
  margin-right: -70px;
}
.m-b--70 {
  margin-bottom: -70px;
}
.m-l--65 {
  margin-left: -65px;
}
.m-t--65 {
  margin-top: -65px;
}
.m-r--65 {
  margin-right: -65px;
}
.m-b--65 {
  margin-bottom: -65px;
}
.m-l--60 {
  margin-left: -60px;
}
.m-t--60 {
  margin-top: -60px;
}
.m-r--60 {
  margin-right: -60px;
}
.m-b--60 {
  margin-bottom: -60px;
}
.m-l--55 {
  margin-left: -55px;
}
.m-t--55 {
  margin-top: -55px;
}
.m-r--55 {
  margin-right: -55px;
}
.m-b--55 {
  margin-bottom: -55px;
}
.m-l--50 {
  margin-left: -50px;
}
.m-t--50 {
  margin-top: -50px;
}
.m-r--50 {
  margin-right: -50px;
}
.m-b--50 {
  margin-bottom: -50px;
}
.m-l--45 {
  margin-left: -45px;
}
.m-t--45 {
  margin-top: -45px;
}
.m-r--45 {
  margin-right: -45px;
}
.m-b--45 {
  margin-bottom: -45px;
}
.m-l--40 {
  margin-left: -40px;
}
.m-t--40 {
  margin-top: -40px;
}
.m-r--40 {
  margin-right: -40px;
}
.m-b--40 {
  margin-bottom: -40px;
}
.m-l--35 {
  margin-left: -35px;
}
.m-t--35 {
  margin-top: -35px;
}
.m-r--35 {
  margin-right: -35px;
}
.m-b--35 {
  margin-bottom: -35px;
}
.m-l--30 {
  margin-left: -30px;
}
.m-t--30 {
  margin-top: -30px;
}
.m-r--30 {
  margin-right: -30px;
}
.m-b--30 {
  margin-bottom: -30px;
}
.m-l--25 {
  margin-left: -25px;
}
.m-t--25 {
  margin-top: -25px;
}
.m-r--25 {
  margin-right: -25px;
}
.m-b--25 {
  margin-bottom: -25px;
}
.m-l--20 {
  margin-left: -20px;
}
.m-t--20 {
  margin-top: -20px;
}
.m-r--20 {
  margin-right: -20px;
}
.m-b--20 {
  margin-bottom: -20px;
}
.m-l--15 {
  margin-left: -15px;
}
.m-t--15 {
  margin-top: -15px;
}
.m-r--15 {
  margin-right: -15px;
}
.m-b--15 {
  margin-bottom: -15px;
}
.m-l--10 {
  margin-left: -10px;
}
.m-t--10 {
  margin-top: -10px;
}
.m-r--10 {
  margin-right: -10px;
}
.m-b--10 {
  margin-bottom: -10px;
}
.m-l--5 {
  margin-left: -5px;
}
.m-t--5 {
  margin-top: -5px;
}
.m-r--5 {
  margin-right: -5px;
}
.m-b--5 {
  margin-bottom: -5px;
}
.m-l-0 {
  margin-left: 0;
}
.m-t-0 {
  margin-top: 0 !important;
}
.m-r-0 {
  margin-right: 0;
}
.m-b-0 {
  margin-bottom: 0;
}
.m-l-5 {
  margin-left: 5px;
}
.m-t-5 {
  margin-top: 5px;
}
.m-r-5 {
  margin-right: 5px;
}
.m-b-5 {
  margin-bottom: 5px;
}
.m-l-10 {
  margin-left: 10px;
}
.m-t-10 {
  margin-top: 10px;
}
.m-r-10 {
  margin-right: 10px;
}
.m-b-10 {
  margin-bottom: 10px;
}
.m-l-15 {
  margin-left: 15px;
}
.m-t-15 {
  margin-top: 15px;
}
.m-r-15 {
  margin-right: 15px;
}
.m-b-15 {
  margin-bottom: 15px;
}
.m-l-20 {
  margin-left: 20px;
}
.m-t-20 {
  margin-top: 20px;
}
.m-r-20 {
  margin-right: 20px;
}
.m-b-20 {
  margin-bottom: 20px;
}
.m-l-25 {
  margin-left: 25px;
}
.m-t-25 {
  margin-top: 25px;
}
.m-r-25 {
  margin-right: 25px;
}
.m-b-25 {
  margin-bottom: 25px;
}
.m-l-30 {
  margin-left: 30px;
}
.m-t-30 {
  margin-top: 30px;
}
.m-r-30 {
  margin-right: 30px;
}
.m-b-30 {
  margin-bottom: 30px;
}
.m-l-35 {
  margin-left: 35px;
}
.m-t-35 {
  margin-top: 35px;
}
.m-r-35 {
  margin-right: 35px;
}
.m-b-35 {
  margin-bottom: 35px;
}
.m-l-40 {
  margin-left: 40px;
}
.m-t-40 {
  margin-top: 40px;
}
.m-r-40 {
  margin-right: 40px;
}
.m-b-40 {
  margin-bottom: 40px;
}
.m-l-45 {
  margin-left: 45px;
}
.m-t-45 {
  margin-top: 45px;
}
.m-r-45 {
  margin-right: 45px;
}
.m-b-45 {
  margin-bottom: 45px;
}
.m-l-50 {
  margin-left: 50px;
}
.m-t-50 {
  margin-top: 50px;
}
.m-r-50 {
  margin-right: 50px;
}
.m-b-50 {
  margin-bottom: 50px;
}
.m-l-55 {
  margin-left: 55px;
}
.m-t-55 {
  margin-top: 55px;
}
.m-r-55 {
  margin-right: 55px;
}
.m-b-55 {
  margin-bottom: 55px;
}
.m-l-60 {
  margin-left: 60px;
}
.m-t-60 {
  margin-top: 60px;
}
.m-r-60 {
  margin-right: 60px;
}
.m-b-60 {
  margin-bottom: 60px;
}
.m-l-65 {
  margin-left: 65px;
}
.m-t-65 {
  margin-top: 65px;
}
.m-r-65 {
  margin-right: 65px;
}
.m-b-65 {
  margin-bottom: 65px;
}
.m-l-70 {
  margin-left: 70px;
}
.m-t-70 {
  margin-top: 70px;
}
.m-r-70 {
  margin-right: 70px;
}
.m-b-70 {
  margin-bottom: 70px;
}
.m-l-75 {
  margin-left: 75px;
}
.m-t-75 {
  margin-top: 75px;
}
.m-r-75 {
  margin-right: 75px;
}
.m-b-75 {
  margin-bottom: 75px;
}
.m-l-80 {
  margin-left: 80px;
}
.m-t-80 {
  margin-top: 80px;
}
.m-r-80 {
  margin-right: 80px;
}
.m-b-80 {
  margin-bottom: 80px;
}
.m-l-85 {
  margin-left: 85px;
}
.m-t-85 {
  margin-top: 85px;
}
.m-r-85 {
  margin-right: 85px;
}
.m-b-85 {
  margin-bottom: 85px;
}
.m-l-90 {
  margin-left: 90px;
}
.m-t-90 {
  margin-top: 90px;
}
.m-r-90 {
  margin-right: 90px;
}
.m-b-90 {
  margin-bottom: 90px;
}
.m-l-95 {
  margin-left: 95px;
}
.m-t-95 {
  margin-top: 95px;
}
.m-r-95 {
  margin-right: 95px;
}
.m-b-95 {
  margin-bottom: 95px;
}
.m-l-100 {
  margin-left: 100px;
}
.m-t-100 {
  margin-top: 100px;
}
.m-r-100 {
  margin-right: 100px;
}
.m-b-100 {
  margin-bottom: 100px;
}
.m-l-105 {
  margin-left: 105px;
}
.m-t-105 {
  margin-top: 105px;
}
.m-r-105 {
  margin-right: 105px;
}
.m-b-105 {
  margin-bottom: 105px;
}
.m-l-110 {
  margin-left: 110px;
}
.m-t-110 {
  margin-top: 110px;
}
.m-r-110 {
  margin-right: 110px;
}
.m-b-110 {
  margin-bottom: 110px;
}
.m-l-115 {
  margin-left: 115px;
}
.m-t-115 {
  margin-top: 115px;
}
.m-r-115 {
  margin-right: 115px;
}
.m-b-115 {
  margin-bottom: 115px;
}
.m-l-120 {
  margin-left: 120px;
}
.m-t-120 {
  margin-top: 120px;
}
.m-r-120 {
  margin-right: 120px;
}
.m-b-120 {
  margin-bottom: 120px;
}
.m-l-125 {
  margin-left: 125px;
}
.m-t-125 {
  margin-top: 125px;
}
.m-r-125 {
  margin-right: 125px;
}
.m-b-125 {
  margin-bottom: 125px;
}
.margin-0 {
  margin: 0 !important;
}

.block-header {
  margin-bottom: 15px;
  margin-top: 50px;
}
.block-header h2 {
  margin: 0 !important;
  color: rgba(0, 0, 0, 0.87) !important;
  font-size: 30px;
  padding-bottom: 20px;
}
.block-header h2 small {
  display: block;
  font-size: 12px;
  margin-top: 8px;
  color: var(--tgray);
}
.block-header h2 small a {
  color: var(--tgray);
}

.bg-light-blue {
  background-color: #03a9f4 !important;
  color: #fff;
}
.bg-light-blue .content .number,
.bg-light-blue .content .text {
  color: #fff !important;
}
.bg-cyan {
  background-color: #00bcd4 !important;
  color: #fff;
}
.bg-cyan .content .number,
.bg-cyan .content .text {
  color: #fff !important;
}
.bg-teal {
  background-color: #009688 !important;
  color: #fff;
}
.bg-teal .content .number,
.bg-teal .content .text {
  color: #fff !important;
}
.bg-green {
  background-color: #4caf50 !important;
  color: #fff;
}
.bg-green .content .number,
.bg-green .content .text {
  color: #fff !important;
}
.bg-light-green {
  background-color: #8bc34a !important;
  color: #fff;
}
.bg-light-green .content .number,
.bg-light-green .content .text {
  color: #fff !important;
}
.bg-lime {
  background-color: #cddc39 !important;
  color: #fff;
}
.bg-lime .content .number,
.bg-lime .content .text {
  color: #fff !important;
}
.bg-yellow {
  background-color: var(--primary-button-background) !important;
  color: var(--primary-button-text) !important;
  border: 0 !important;
}
.bg-yellow .content .number,
.bg-yellow .content .text {
  color: #fff !important;
}
.bg-amber {
  background-color: #ffc107 !important;
  color: #fff;
}
.bg-amber .content .number,
.bg-amber .content .text {
  color: #fff !important;
}
.bg-orange {
  background-color: #ff9800 !important;
  color: #fff;
}
.bg-orange .content .number,
.bg-orange .content .text {
  color: #fff !important;
}
.bg-deep-orange {
  background-color: #ff5722 !important;
  color: #fff;
}
.bg-deep-orange .content .number,
.bg-deep-orange .content .text {
  color: #fff !important;
}
.bg-brown {
  background-color: #795548 !important;
  color: #fff;
}
.bg-brown .content .number,
.bg-brown .content .text {
  color: #fff !important;
}
.bg-grey {
  background-color: #9e9e9e !important;
  color: #fff;
}
.bg-grey .content .number,
.bg-grey .content .text {
  color: #fff !important;
}
.bg-blue-grey {
  background-color: #607d8b !important;
  color: #fff;
}
.bg-blue-grey .content .number,
.bg-blue-grey .content .text {
  color: #fff !important;
}
.bg-black {
  background-color: #212121 !important;
  color: #fff;
}
.bg-black .content .number,
.bg-black .content .text {
  color: #fff !important;
}
.bg-white {
  background-color: #fff !important;
  color: #fff;
}
.bg-white .content .number,
.bg-white .content .text {
  color: #fff !important;
}


.form-group .form-line:after,
.input-group .form-line:after {
  content: "";
  width: 100%;
  left: 0;
}
.input-group {
  width: 100%;
  margin-bottom: 20px;
}
.input-group .form-line {
  display: inline-block;
  width: 100%;
  border-bottom: 1px solid #ddd;
  position: relative;
}
.input-group .form-line:after {
  position: absolute;
  bottom: -2px;
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -moz-transition: 0.25s ease-in;
  -o-transition: 0.25s ease-in;
  -webkit-transition: 0.25s ease-in;
  transition: 0.25s ease-in;
  border-bottom: 2px solid #1f91f3;
}
.input-group .form-line + .input-group-addon {
  padding-right: 0;
  padding-left: 10px;
}
.input-group .help-info {
  float: right;
  font-size: 12px;
  margin-top: 5px;
  color: #999;
}
.input-group label.error {
  font-size: 12px;
  display: block;
  margin-top: 5px;
  color: #f44336;
}
.input-group .form-line.error:after {
  border-bottom: 2px solid #f44336;
}
.input-group .form-line.success:after {
  border-bottom: 2px solid #4caf50;
}
.input-group .form-line.warning:after {
  border-bottom: 2px solid #ffc107;
}
.input-group .form-line.focused:after {
  -moz-transform: scaleX(1);
  -ms-transform: scaleX(1);
  -o-transform: scaleX(1);
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
.input-group .form-line.focused .form-label {
  bottom: 25px;
  left: 0;
  font-size: 12px;
}
.input-group .input-group-addon {border: none;background-color: transparent;padding-left: 0;}
.input-group .input-group-addon .material-icons {font-size: 18px;color: var(--tgray);}
.input-group .form-control,.input-group input[type="text"] {border: 1px solid var(--border-color);box-shadow: none;padding-left: 0;}
.input-group .form-control:focus {-webkit-box-shadow: none !important;-moz-box-shadow: none !important;-ms-box-shadow: none !important;box-shadow: none !important;}
.input-group.input-group-sm .input-group-addon i {font-size: 14px;}
.input-group.input-group-sm .form-control {font-size: 12px;}
.input-group.input-group-lg .input-group-addon i {font-size: 26px;}
.input-group.input-group-lg .form-control {font-size: 18px;}

.form-control-label {text-align: right;}
.form-control-label label {margin-top: 8px;}

.form-horizontal .form-group {margin-bottom: 0;}
.form-group {width: 100%;margin-bottom: 25px;}
.form-group .form-control {width: 100%;border: 1px solid var(--border-color);box-shadow: none;border-radius:14px;padding: 25px 15px;}

input::placeholder {color: var(--tgray) !important;font-style: normal;}
.input-rounded input::placeholder {color: var(--tgray) !important;font-style: normal;padding-left: 10px;}
.login-label {width: auto !important;background: var(--white);position: absolute;left: 15px;
top: -8px;padding-left: 10px;padding-right: 10px;text-indent: 0;font-size: 14px;color: var(--black);font-weight: 500;}

.form-group .help-info {float: right;font-size: 12px;margin-top: 5px;color: var(--purple);}
.form-group label.error {font-size: 12px;display: block;margin-top: 5px;color: var(--red);}
.form-group .form-line {width: 100%;position: relative;border-bottom: 1px solid var(--border-color);}
.form-group .form-line:after {
position: absolute;height: 0;bottom: -1px;-moz-transform: scaleX(0);-ms-transform: scaleX(0);-o-transform: scaleX(0);
-webkit-transform: scaleX(0);transform: scaleX(0);-moz-transition: 0.25s ease-in;-o-transition: 0.25s ease-in;
-webkit-transition: 0.25s ease-in;transition: 0.25s ease-in;border-bottom: 2px solid var(--purple);}
.form-group .form-line .form-label {color: var(--tgray);position: absolute;top: 10px;left: 0;cursor: text;-moz-transition: 0.2s;
  -o-transition: 0.2s;-webkit-transition: 0.2s;transition: 0.2s;}
.form-group .form-line.error:after {border-bottom: 2px solid var(--red);}
.form-group .form-line.success:after {border-bottom: 2px solid var(--green);}
.form-group .form-line.warning:after {border-bottom: 2px solid var(--yellow);}
.form-group .form-line.focused:after {-moz-transform: scaleX(1);-ms-transform: scaleX(1);-o-transform: scaleX(1);-webkit-transform: scaleX(1);transform: scaleX(1);}
.form-group .form-line.focused .form-label {top: -10px;left: 0;font-size: 12px;}
.form-group-sm .form-label {font-size: 12px;}
.form-group-sm .form-line.focused .form-label {bottom: 20px;font-size: 10px;}
.form-group-lg .form-label {font-size: 18px;}
.form-group-lg .form-line.focused .form-label {bottom: 35px;font-size: 12px;}
.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control {background-color: transparent;}




.no-animate {
  -o-transition-property: none !important;
  -moz-transition-property: none !important;
  -ms-transition-property: none !important;
  -webkit-transition-property: none !important;
  transition-property: none !important;
  -o-transform: none !important;
  -moz-transform: none !important;
  -ms-transform: none !important;
  -webkit-transform: none !important;
  transform: none !important;
  -webkit-animation: none !important;
  -moz-animation: none !important;
  -o-animation: none !important;
  -ms-animation: none !important;
  animation: none !important;
}
section.content {
  margin: 75px 15px 10px 15px;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
section.content-dynamic {
  margin: 65px 0 0;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  background-color: #fff;
  border: 5px solid #212121;
}


.alert {-webkit-border-radius: 0;-moz-border-radius: 0;-ms-border-radius: 0;border-radius: 0;-webkit-box-shadow: none;
-moz-box-shadow: none;-ms-box-shadow: none;box-shadow: none;border: none;color: var(--white) !important;}
.alert .alert-link {color: var(--white);text-decoration: underline;font-weight: 500;}
.alert-success {background-color: var(--tgreen);}
.alert-info {background-color: var(--blue);}
.alert-warning {background-color: var(--yellow) !important;}
.alert-danger {background-color: var(--red) !important;}
.alert-dismissible .close {color: var(--white);opacity: 1;border: none;text-shadow: none;}
.sweet-alert {-webkit-border-radius: 0 !important;-moz-border-radius: 0 !important;-ms-border-radius: 0 !important;border-radius: 0 !important;}
.sweet-alert p {font-size: 14px !important;}
.sweet-alert .sa-input-error {top: 23px !important;right: 13px !important;}
.sweet-alert h2 {font-size: 18px !important;margin: 0 0 5px !important;}
.sweet-alert button {font-size: 15px !important;-webkit-border-radius: 0 !important;-moz-border-radius: 0 !important;
-ms-border-radius: 0 !important;border-radius: 0 !important;padding: 5px 20px !important;}

/*Modal*/
.modal .modal-header {
  border: none;
  padding: 16px !important;
  border-radius: 14px 14px 0 0;
  /* box-shadow: 0px 0px 1px 0px var(--tgray); */
  /* border-bottom: 1px solid #eee; */
}
.modal .modal-header .modal-title { 
  font-size: 18px;
  /* letter-spacing: 0.07rem; */
  font-weight: 500;
  text-transform: capitalize;
}
.modal .modal-content {
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  -ms-border-radius: 14px;
  border-radius: 14px;
  border: none;
  -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);      
}
.modal .modal-footer {
  border: none;
}
.modal-notification {
  position: fixed;
  width: 100%;
  right: 50px;
  bottom: 0;
  z-index: 1050;
  display: none;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  outline: 0;
}
.confirm_prompt .modal-footer{border-top: 1px solid rgba(153, 153, 153, 0.2)!important;padding:16px!important;}
.confirm_prompt .modal-footer>*{margin:0!important;}

.btn-popup {
  margin: 0;
  font-size: 14px;
  background: var(--primary-button-background);
  color: var(--primary-button-text);
  letter-spacing: 0.05rem;
  border-radius: 10px;
}
.custom-modal-yellow-opac-30.in {
  z-index: 1071;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  place-items: center;
  background-color: rgba(33, 33, 33, 0.3) !important;
}

.modal-dialog {
  width: 100% !important;
  padding: 20px !important;
  margin: 0 !important;
}

.popup-btn-div {
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
  justify-content: center;
}

.toast-bg {
  background-color: #1a1a1a;
  color: #fff;
}
.label {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
}

.modal.custom-modal-yellow.in {
  z-index: 1071;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  place-items: center;
  background-color: var(--body-bg) !important;
}

.modal.custom-modal.in {
  z-index: 1071;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/*Progressbar*/
.progress {-webkit-border-radius: 10px;-moz-border-radius: 10px;-ms-border-radius: 10px;border-radius: 10px;height: 10px;}
.progress .progress-bar {line-height: 23px;background-color: var(--blue);border-radius: 10px;border: 2px solid var(--tgray);}
.progress .progress-bar-success {background-color: var(--green);}
.progress .progress-bar-info {background-color: var(--blue);}
.progress .progress-bar-warning {background-color: var(--yellow);}
.progress .progress-bar-danger {background-color: var(--red);}


/*Login*/
.login-page {background-color: var(--purple);padding: 15px;border-radius: 4px;}
.login-page .login-box .msg {color: var(--tgray);margin-bottom: 30px;text-align: center;}
.login-page .login-box a {font-size: 14px;text-decoration: none;color: #00bcd4;}
.login-page .login-box .logo {margin-bottom: 20px;}
.login-page .login-box .logo a {font-size: 36px;display: block;width: 100%;text-align: center;color: #fff;}
.login-page .login-box .logo small {display: block;width: 100%;text-align: center;color: #fff;margin-top: -5px;}

.login .modal-dialog {width: 350px;}
.login .modal-footer {border-top: 0;margin-top: 0;padding: 10px 20px 20px;}
.login .modal-header {border: 0 none;padding: 15px 15px 15px;}
.login .division {float: none;  margin: 0 auto 18px;overflow: hidden;position: relative;text-align: center;width: 100%;}
.login .division .line {border-top: 1px solid #dfdfdf;position: absolute;top: 10px;width: 34%;}
.login .division .line.l {left: 0;}
.login .division .line.r {right: 0;}
.login .division span {color: #424242;font-size: 17px;}
.login .box .social {float: none;margin: 0 auto 30px;text-align: center;}
.login .social .circle {background-color: #eee;color: #fff;border-radius: 100px;display: inline-block;margin: 0 17px;padding: 15px;}
.login .social .circle .fa {font-size: 16px;}
.login .social .facebook {background-color: #455ca8;color: #fff;}
.login .social .google {background-color: #f74933;}
.login .social .github {background-color: #403a3a;}
.login .facebook:hover {background-color: #6e83cd;}
.login .google:hover {background-color: #ff7566;}
.login .github:hover {background-color: #4d4d4d;}
.login .forgot {color: var(--tgray);margin-left: 0;overflow: hidden;text-align: center;width: 100%;}

.login .form-control {border-radius: 3px;background-color: rgba(0, 0, 0, 0.09);box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.09) inset;color: #fff;}
.login .form-control:hover {background-color: rgba(0, 0, 0, 0.16);}
.login .form-control:focus {box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.04) inset;background-color: rgba(0, 0, 0, 0.23);color: #fff;}
.login .box .form input[type="password"],.login .box .form input[type="text"] {
  border-radius: 3px;border: none;color: #333;font-size: 16px;height: 46px;margin-bottom: 5px;padding: 13px 12px;width: 100%;}

/*Top Searchbar*/
.search-bar {position: fixed;top: -100px;left: 0;z-index: 9999999;width: 100%;
  -moz-transition: 0.25s;-o-transition: 0.25s;-webkit-transition: 0.25s;transition: 0.25s;}
.search-bar.open {top: 0;z-index: 999;}
.search-bar .search-icon {position: absolute;top: 18px;left: 14px;}
.search-bar .search-icon .material-icons {font-size: 32px;color: var(--tgray);}
.search-bar .close-search {position: absolute;cursor: pointer;font-size: 20px;top: 18px;right: 18px;}
.search-bar .close-search .material-icons {color: var(--tgray);opacity: 1;-moz-transition: 0.5s;-o-transition: 0.5s;-webkit-transition: 0.5s;transition: 0.5s;}
.search-bar .close-search .material-icons:hover {opacity: 0.5;}
.search-bar input[type="text"] {width: 100%;font-size: 14px;padding: 20px 50px;border: none;
  /* -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
  -ms-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); */
  -webkit-box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);  
}
.search-icon-all svg {
  fill: var(--webfont) !important;
  fill-opacity: 1 !important;
  cursor: pointer;
}

/*Form fields*/
fieldset {margin: 0 0 3rem;padding: 0;border: none;}
.form-group,.form-radio {position: relative;margin-bottom: 2.25rem;}
.form-inline > .btn,.form-inline > .form-group {display: inline-block;margin-bottom: 0;}
.form-help {margin-top: 0.125rem;margin-left: 0.125rem;color: var(--tgray);font-size: 0.8rem;}
.checkbox .form-help,.form-group .form-help,.form-radio .form-help {position: absolute; width: 100%;}
.checkbox .form-help {position: relative;margin-bottom: 1rem;}
.form-radio .form-help {padding-top: 0.25rem;margin-top: -1rem;}
.form-group textarea {resize: none;}
.form-group select {width: 100%;font-size: 1rem;height: 1.6rem;padding: 0.125rem 0.125rem 0.0625rem;
  background: 0 0;border: none;line-height: 1.6;box-shadow: none;}
.form-group .control-label {position: absolute;top: -5px;pointer-events: none;z-index: 1;color: var(--black);
  font-size: 1.3rem;font-weight: 500;font-style: italic; -webkit-transition: all 0.28s ease;transition: all 0.28s ease;}
.form-group .bar {position: relative;border-bottom: 2px solid #512da8;display: block;}
.form-group .bar::before {content: "";height: 0.125rem;width: 0;left: 50%;position: absolute;
  background: var(--yellow);-webkit-transition: left 0.28s ease, width 0.28s ease;transition: left 0.28s ease, width 0.28s ease;z-index: 2;}
.form-group input,.form-group textarea {display: block;background: 0 0;font-size: 1.5rem;font-style: normal;color: #212121;border-width: 0;
  border-color: transparent;line-height: 1.9;width: 100%;color: transparent;-webkit-transition: all 0.28s ease;transition: all 0.28s ease;box-shadow: none;}
.form-group input[type="file"] {line-height: 1;}
.form-group input[type="file"] ~ .bar {display: none;}
.form-group input.form-file,.form-group input.has-value,.form-group input:focus,
.form-group input:valid,.form-group select,.form-group textarea.form-file,.form-group textarea.has-value,
.form-group textarea:focus,.form-group textarea:valid {color: var(--tgray);}
.form-group input.form-file ~ .control-label,.form-group input.has-value ~ .control-label,
.form-group input:focus ~ .control-label,.form-group input:valid ~ .control-label,
.form-group select ~ .control-label,.form-group textarea.form-file ~ .control-label,
.form-group textarea.has-value ~ .control-label,.form-group textarea:focus ~ .control-label,
.form-group textarea:valid ~ .control-label {font-size: 0.8rem;color: var(--tgray);top: -1rem;left: 0;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus {outline: 0;}
.form-group input:focus ~ .control-label,.form-group select:focus ~ .control-label,
.form-group textarea:focus ~ .control-label {color: #337ab7;}
.form-group input:focus ~ .bar::before,.form-group select:focus ~ .bar::before,.form-group textarea:focus ~ .bar::before {width: 100%;left: 0;}

.md-checkbox {position: relative;margin: 10px 10px 20px 20px;text-align: left;}
.md-checkbox.md-checkbox-inline {display: inline-block;}
.md-checkbox label {cursor: pointer;display: inline;font-size: 15px;color: var(--tgray);vertical-align: top;clear: both;
  padding-left: 30px !important;font-weight: 500;}
.md-checkbox label:not(:empty) {padding-left: 0.75em;}
.md-checkbox label:after,.md-checkbox label:before {content: "";position: absolute;left: 0;top: 0;}
.md-checkbox label:before {width: 18px;height: 18px;top: 1px;background: #fff;border: 2px solid var(--border-color);
  border-radius: 0.125em;cursor: pointer;transition: background 0.3s;}
.md-checkbox input[type="checkbox"] {outline: 0;visibility: hidden;width: 1em;margin: 0;display: block;float: left;font-size: inherit;}
.md-checkbox input[type="checkbox"]:checked + label:before {background: var(--primary-button-background);border: none;}
.md-checkbox input:checked ~ span,.md-checkbox input[type="checkbox"]:checked + label {color: var(--purple);}
.md-checkbox input[type="checkbox"]:checked + label:after {transform: translate(0.25em, 0.3365384615em) rotate(-45deg);
  width: 14px;height: 6px;left: -2px;top: 0;border: 0.125em solid var(--primary-button-text); border-top-style: none;border-right-style: none;}
.md-checkbox input[type="checkbox"]:disabled + label:before {border-color: rgba(0, 0, 0, 0.26);}
.md-checkbox input[type="checkbox"]:disabled:checked + label:before {background: rgba(0, 0, 0, 0.26);}

#veg.md-checkbox {position: relative;margin: 10px 10px 20px 20px;text-align: left;}
#veg.md-checkbox.md-checkbox-inline {display: inline-block;}
#veg.md-checkbox label {cursor: pointer;display: inline;font-size: 1.4rem;color: var(--tgray);vertical-align: top;clear: both;}
#veg.md-checkbox label:after,#veg.md-checkbox label:before {content: "";position: absolute;left: 0;top: 0;}
#veg.md-checkbox label:before {width: 18px;height: 18px;top: 0;background: #fff;
border: 1px solid var(--border-color);border-radius: 2px;cursor: pointer;transition: background 0.3s;}
#veg.md-checkbox input[type="checkbox"] {outline: 0;visibility: hidden;width: 1em;margin: 0;display: block;float: left;font-size: inherit;}
#veg.md-checkbox input[type="checkbox"]:checked + label:before {background: #fff;border: none;}
#veg.md-checkbox input[type="checkbox"]:checked + label:after {transform: translate(0.25em, 0.3365384615em) rotate(-45deg);
  width: 14px;height: 6px;left: -2px;top: -2px;border: 0.125em solid var(--green);border-top-style: none;border-right-style: none;}
#veg.md-checkbox input[type="checkbox"]:disabled + label:before {border-color: rgba(0, 0, 0, 0.26);}
#veg.md-checkbox input[type="checkbox"]:disabled:checked + label:before {background: rgba(0, 0, 0, 0.26);}


#cradio input[type="radio"] {
-webkit-appearance: none !important;width: 40px;height: 50px;border: none;cursor: pointer;
-webkit-filter: grayscale(90%) opacity(40%);filter: grayscale(90%) opacity(40%);-webkit-transition: all 0.5s ease;
transition: all 0.2s ease !important;margin: 0;}
#cradio [type="radio"]:checked {-webkit-filter: grayscale(0);filter: grayscale(0);width: 40px !important;
height: 50px !important;position: relative;opacity: 1 !important;left: 0;}
#cradioinput[type="radio"]:focus {outline: 0;outline-style: none !important;}
#cradio input[type="radio"].warm {background: url(../images/warm_water.svg) center;background-size: cover !important;outline-style: none;-moz-appearance: none;}
#cradio input[type="radio"].roomtemp {background: url(../images/room_temp.svg) center;background-size: cover !important;outline-style: none;-moz-appearance: none;}
#cradio input[type="radio"].cold {background: url(../images/cold_water.svg) center;background-size: cover;outline-style: none;-moz-appearance: none;}
#cradio input[type="radio"] + label {position: absolute;left: 0;top: 45px;font-size: 14px;color: var(--black);}
#cradio input[type="radio"]:checked + label {color: var(--chkbox-checked-label);font-size: 14px;top: 45px;width: auto;font-weight:500}


.input-label-e {
width: auto !important;background: #fff;position: absolute;left: 15px;top: -8px;padding-left: 10px;padding-right: 10px;
text-indent: 0;font-size: 13px;color: #512da8;font-weight: 500;color: #d93025;background-color: #fff;}
.input-label {position: absolute;top: -16px;left: 20px;color: #512da8;background-color: #fff;padding: 5px 7px;z-index: 9999;font-weight: 500 !important;}
.input-label1-e {position: absolute;padding: 15px 10px 10px 20px;top: 0;background-color: transparent;z-index: 9999;color: #d93025;}
.input-label1 {position: absolute;padding: 15px 10px 10px 20px;top: 0;background-color: transparent;z-index: 9999;}
.input-rounded {border-radius: 5px !important;padding: 12px 10px 10px 48px;background-color: transparent !important; border: 2px solid #512da8 !important;
margin-bottom: 5px !important;height: 48px;}
.input-rounded-e {border-radius: 5px !important;padding: 25px 15px;background-color: transparent !important;border: 2px solid #d93025 !important;
margin-bottom: 5px !important;height: 34px;}


/*New checkbox*/
.newchkbox [type=checkbox],
.newchkbox [type=radio] {
border: 0 !important;
clip: rect(1px, 1px, 1px, 1px) !important;
-webkit-clip-path: inset(50%) !important;
clip-path: inset(50%) !important;
height: 1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
width: 1px !important;
white-space: nowrap !important;
}

.newchkbox [type=checkbox]:active + label::before,
.newchkbox [type=radio]:active + label::before {
  transition-duration: 0!important;
}
.newchkbox [type=checkbox] + label,
.newchkbox [type=radio] + label {
  position: relative!important;
  padding: 20px 0 20px 35px!important;
    text-transform: capitalize;
    margin:0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
          color:var(--tgray);
}
.newchkbox [type=checkbox] + label::before,
.newchkbox [type=radio] + label::before {
  background-color: var(--chkbox-bg)!important;
  border: 2px solid var(--chkbox-border)!important;
  border-radius: 4px !important;
  box-sizing: content-box !important;
  content: "" !important; 
  margin-right: 10px !important;
  top: 22px !important;
  left: 0 !important;
  width: 16px !important;
  height: 16px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  transform: none !important;
}
.newchkbox [type=checkbox] + label::after
{
  box-sizing: content-box !important;
  content: "" !important;
  background-color: #fff !important;
  position: absolute !important;
  top: 50% !important;
  left: 12px !important;
  width: 14px !important;
  height: 14px !important;
  margin-top: -7px !important;
  transform: scale(0) !important;
  transform-origin: 50% !important;
  transition: transform 200ms ease-out !important;
}
.newchkbox [type=checkbox][disabled] + label::before,
.newchkbox [type=radio][disabled] + label::before {
  -webkit-animation: none !important;
  animation: none !important;
  box-shadow: none !important; 
}

.newchkbox [type=checkbox] + label::after {
  background-color: transparent !important;
  top: 13px !important;
  left: 4px !important;
  width: 10px !important;
  height: 4px !important;
  border-style: solid !important;
  border-color: var(--chkbox-checked-label) !important;
  border-width: 0 0 2px 2px !important;
  border-radius: 0 !important;
  -o-border-image: none !important;
  border-image: none !important;
  transform: rotate(-45deg) scale(0) !important;
  transition: none !important;
  z-index:999 !important;
}
.newchkbox [type=checkbox]:checked + label::after {
  content: "" !important;
  transform: rotate(-45deg) scale(1) !important;
  transition: transform 200ms ease-out !important;
}

.newchkbox [type=checkbox]:checked + label::before {
    background-color: var(--chkbox-checked-bg) !important;
  border-color: var(--chkbox-checked-border) !important;
}

.newchkbox [type=checkbox] + label::before{margin-top: -3px;}

/*New Radio*/
.newchkbox [type=radio]:active + label::before {transition-duration: 0!important;}

.newchkbox [type=radio] + label {
position: relative!important;
padding: 20px 0 20px 35px!important;
text-transform: capitalize;
margin:0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
font-weight: 500;
}

.newchkbox [type=radio] + label::before {
  background-color: var(--chkbox-bg)!important;
  border: 2px solid var(--chkbox-border)!important;
  border-radius: 3px !important;
  box-sizing: content-box !important;
  content: "" !important; 
  margin-right: 10px !important;
  top: 22px !important;
  left: 0 !important;
  width: 16px !important;
  height: 16px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  transform: none !important;
}

.newchkbox [type=radio][disabled] + label::before {
  -webkit-animation: none !important;
          animation: none !important;
  box-shadow: none !important;   
  border: 1px solid rgba(128, 128, 128, 0.5) !important;
}

.newchkbox [type=radio] + label::before, 
.newchkbox [type=radio] + label::after {
border-radius: 50%!important;
}
.newchkbox [type=radio]:checked:active + label::before, 
.newchkbox [type=radio]:checked:focus + label::before {
-webkit-animation: none!important;
animation: none!important;
filter: none!important;
transition: none!important;
}

.newchkbox [type=radio]:checked + label::before {
background-color: var(--chkbox-checked-bg)!important;
border-color: var(--chkbox-checked-border) !important;
animation: ripple 0.2s linear forwards;
}

.newchkbox [type=radio] + label::after {
    box-sizing: content-box !important;
    content: "" !important;    
    position: absolute !important;
    top: 50% !important;
    left: 5px !important;
    width: 10px !important;
    height: 10px !important;
    margin-top: -6px !important;
    background-color: var(--chkbox-dot);
    transform: none!important;         
  }


.newchkbox [type=radio]:checked + label::after {      
background-color: var(--chkbox-checked-dot) !important;       
}

.newchkbox [type=checkbox] + label,
.newchkbox [type=radio] + label { 
padding: 0px!important;
}


.newchkbox [type=radio] + label::before {  
top: 0px !important;
margin-top: -5px;
} 

.newchkbox [type=checkbox]:checked + label, 
.newchkbox [type=checkbox]:checked ~ span,
.newchkbox [type=radio]:checked + label, 
.newchkbox [type=radio]:checked ~ span {
color: var(--chkbox-checked-label);
}


/*Animation*/
.animated {
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated.hinges {
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  -o-animation-duration: 2s;
  animation-duration: 2s;
}
.animated.slow {
  -webkit-animation-duration: 3s;
  -moz-animation-duration: 3s;
  -o-animation-duration: 3s;
  animation-duration: 3s;
}
.animated.snail {
  -webkit-animation-duration: 4s;
  -moz-animation-duration: 4s;
  -o-animation-duration: 4s;
  animation-duration: 4s;
}
@-webkit-keyframes shake {
  0%,
  100% {
      -webkit-transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
      -webkit-transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
      -webkit-transform: translateX(10px);
  }
}
@-moz-keyframes shake {
  0%,
  100% {
      -moz-transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
      -moz-transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
      -moz-transform: translateX(10px);
  }
}
@-o-keyframes shake {
  0%,
  100% {
      -o-transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
      -o-transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
      -o-transform: translateX(10px);
  }
}
@keyframes shake {
  0%,
  100% {
      transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
      transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
      transform: translateX(10px);
  }
}
.shake {
  -webkit-animation-name: shake;
  -moz-animation-name: shake;
  -o-animation-name: shake;
  animation-name: shake;
}


.animate {-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
@-webkit-keyframes fadeInUp {
  from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
  }
  to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
@keyframes fadeInUp {
  from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
  }
  to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDown {
  0% {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
  }
  100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
@keyframes fadeInDown {
  0% {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
  }
  100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
@-webkit-keyframes fadeInLeft {
  from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
  }
  to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
@keyframes fadeInLeft {
  from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
  }
  to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInRight {
  from {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
  }
  to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
@keyframes fadeInRight {
  from {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
  }
  to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@-webkit-keyframes fadeIn {
  from {
      opacity: 0;
  }
  to {
      opacity: 1;
  }
}
@keyframes fadeIn {
  from {
      opacity: 0;
  }
  to {
      opacity: 1;
  }
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}


.slide-in-bottom {
  -webkit-animation: slide-in-bottom 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  animation: slide-in-bottom 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}
@-webkit-keyframes slide-in-bottom {
  0% {
      -webkit-transform: translateY(1000px);
      transform: translateY(1000px);
      opacity: 0;
  }
  100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
      -webkit-transform: translateY(1000px);
      transform: translateY(1000px);
      opacity: 0;
  }
  100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
}
.slide-out-bottom {
  -webkit-animation: slide-out-bottom 0.5s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;
  animation: slide-out-bottom 0.5s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;
}
@-webkit-keyframes slide-out-bottom {
  0% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
  100% {
      -webkit-transform: translateY(1000px);
      transform: translateY(1000px);
      opacity: 0;
  }
}
@keyframes slide-out-bottom {
  0% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
  100% {
      -webkit-transform: translateY(1000px);
      transform: translateY(1000px);
      opacity: 0;
  }
}


/*Mat form*/

.mat-form {min-width: 150px; width: 100%;}
mat-card {margin-top: 0 !important;}
.mat-full-width {width: 100%;}
#img-width img {width: 100%;height: 180px;}
mat-card-header {padding: 12px 0 12px 0 !important;margin-top: 0 !important;}
.mat-elevation-z2 {box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);}
.mat-elevation-z4 {box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.05) !important;}
.mat-card img {border-radius: 14px 14px 0 0 !important;}
.mat-card-cancel img {border-radius: 14px 14px 0 0 !important;}
.mat-card-title {font-size: 24px;font-weight:500!important}
.mat-card-content,.mat-card-header .mat-card-title,.mat-card-subtitle {font-size: 12px !important;}
.mat-form-field {font-size: inherit;line-height: 1.125;}
.mat-form-field-infix {padding: 0.5em 0;border-top: 0.84375em solid transparent;}
.mat-form-field-label {top: 1.34375em;}
.mat-form-field-underline {bottom: 1.34375em;}
input.mat-input-element {margin-top: -0.0625em;}
.mat-menu-item {font-size: 16px;}
.mat-paginator,.mat-paginator-page-size .mat-select-trigger {font-size: 12px;}
.mat-step-label {font-size: 14px;}
.mat-step-label-selected {font-size: 14px;}
.mat-theme-loaded-marker {display: none;}
.mat-card-cancel {background: #c7c7c76b !important;opacity: 0.7;}
.mat-card {background: #fff;color: var(--tgray);font-family: 'Jost', sans-serif!important;}
.mat-card-subtitle {color:var(--tgray);}
.mat-card-header-text {margin: 0 !important;}

.cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),
.cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),
.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
  background-color: rgba(0, 0, 0, 0.04);}

.mat-dialog-container {background: #fff;color: rgba(0, 0, 0, 0.87);}
.mat-divider {border-top-color: rgba(0, 0, 0, 0.12);}
.mat-divider-vertical {border-right-color: rgba(0, 0, 0, 0.12);}
.mat-action-row {border-top-color: rgba(0, 0, 0, 0.12);}


.mat-form-field-label {color: rgba(255, 255, 255, 0.6) !important;}
.mat-hint {color: rgba(255, 255, 255, 0.6) !important;}
.mat-form-field.mat-focused .mat-form-field-label {color: rgba(255, 255, 255, 0.6) !important;font-size: 18px !important;}
.mat-focused .mat-form-field-required-marker {color: #ff4081;}
.mat-form-field-ripple {background-color: rgba(170, 170, 170, 0.87);}
.mat-form-field.mat-focused .mat-form-field-ripple {background-color: rgba(170, 170, 170, 0.8) !important;}
.mat-form-field.mat-form-field-invalid .mat-form-field-label {color: #f44336;}
.mat-error {color: #f44336;}
.mat-input-element:disabled {color: rgba(255, 255, 255, 0.38) !important;}
.mat-input-element {caret-color: #aaa !important;color: #aaa !important;background: 0 0;}
.mat-input-element::-webkit-input-placeholder {color: rgba(255, 255, 255, 0.42) !important;}
.mat-input-element::-ms-input-placeholder {color: rgba(255, 255, 255, 0.42) !important;}
.mat-input-element::placeholder {color: rgba(255, 255, 255, 0.42) !important;}
.mat-input-element::-moz-placeholder {color: rgba(255, 255, 255, 0.42) !important;}
.mat-input-element::-webkit-input-placeholder {color: rgba(255, 255, 255, 0.42) !important;}
.mat-input-element:-ms-input-placeholder {color: rgba(255, 255, 255, 0.42);}
.mat-accent .mat-input-element {caret-color: #ff4081;}
.mat-form-field-invalid .mat-input-element,.mat-warn .mat-input-element {caret-color: #f44336;}
.mat-spinner circle {stroke: #512da8 !important;}

.col-center {margin: 0 auto;}

.Notif_Outer {
width: 100%;position: fixed;right: 0;padding: 10px 0;overflow: hidden;-webkit-user-select: none;-moz-user-select: none;
-o-user-select: none;-ms-user-select: none;-khtml-user-select: none;user-select: none;transition: top 0.8s ease-in-out;}
.Notif_Container {
height: 92px;background: #fff;-webkit-box-shadow: 0 1px 15px rgba(0, 0, 0, 0.25);box-shadow: 0 1px 15px rgba(0, 0, 0, 0.25);
border: 1px solid #ccc;transition: all 0.8s ease-in-out;border-radius: 10px;}
.Notif_img {float: left;width: 45px;height: 100%;line-height: 92px;padding-left: 10px;border: none;display: block;}
.Notif_Outer,.Notif_Outer * {box-sizing: content-box;}
.Notif_text {float: left;width: 200px;padding-top: 20px;padding-left: 10px;display: block;height: 100%;line-height: 92px;}
.Notif_image {width: 100%;vertical-align: middle;}
.Notif_Clickable {cursor: pointer;}
.Notif_title {display: block;padding: 5px;margin: 0;max-width: 100%;overflow: hidden;white-space: nowrap;text-shadow: none;
text-overflow: ellipsis;border: none;font-size: 18px !important;line-height: 16px;font-weight: 500;color: #4d4d4d;}
.Notif_subtitle {font-size: 14px !important;line-height: 16px;}
.Notif_buttons {float: right;width: 80px;border: none;border-left: 2px solid #d9d9d9;height: 100%;min-height: 100%;padding: 0;color: #717171;}
.Notif_button:first-of-type {border-top-right-radius: 10px;}
.Notif_button {display: block;cursor: pointer;text-align: center;padding: 10px 10px;margin: 0;text-decoration: none;line-height: 25px;
border: none;border-top: 1px solid transparent;background: 0 0;max-width: 100%;text-overflow: ellipsis; overflow: hidden;white-space: nowrap;
text-shadow: none;font-size: 16px;font-weight: 500;color: rgba(0, 0, 0, 0.64);transition: all 0.8s ease-in-out, background 0.1s, color 0.1s;}
.Notif_button + .Notif_button {border-top: 2px solid #d9d9d9;}
.Notif_button:last-of-type {border-bottom-right-radius: 10px;}

.home-righttext {position: absolute;right: 0;top: 35px;}

.add-btn.btn.active,.add-btn.btn:active {
background: #212121;outline: 0 !important;
box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12) !important;
-webkit-box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12) !important;
}
.acc-icon {position: absolute;top: 25px;right: 25px;border-radius: 50%;padding: 5px;background: var(--primary-theme-background);z-index: 10;}

.shine {background: #f6f7f8;background-image: linear-gradient(to right, #f6f7f8 0, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
background-repeat: no-repeat;background-size: 800px 104px;display: inline-block;position: relative;animation-duration: 1s;
animation-fill-mode: forwards;animation-iteration-count: infinite;animation-name: placeholderShimmer;animation-timing-function: linear;
}

.box {height: 104px;width: 100%;}
.shimmer-div {display: inline-flex;flex-direction: column;vertical-align: top;width: 100%;}
.lines {height: 10px;margin-top: 10px;width: 100%;}
.photo {display: block !important;height: 100px;margin-top: 15px;}


@keyframes placeholderShimmer {
  0% {
      background-position: -468px 0;
  }
  100% {
      background-position: 468px 0;
  }
}

@media screen and (orientation: landscape) {
  .box {
      width: 150px;
  }
  .lines {
      width: 350px;
  }
}


.shadow1 {-webkit-filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, 0.5));filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, 0.5));}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;-moz-appearance: none;appearance: none;margin: 0;}

.loadscreen {text-align: center;position: absolute;width: 100%;left: 0;right: 0;margin: auto;top: calc(50% - 100px);}
.loading {margin: 10px 0;font-size: 20px;color: #512da8;}
.loading:after {display: inline-block;animation: dotty steps(1, end) 1s infinite;content: "";color: #512da8;}

@keyframes dotty {
  0% {
      content: "";
  }
  25% {
      content: ".";
  }
  50% {
      content: "..";
  }
  75% {
      content: "...";
  }
  100% {
      content: "";
  }
}



.logo {display: inline-block !important;width: auto;height: 80px;}
.view-customlink {transition: background 0.8s;}
.view-customlink:hover {background: #eee radial-gradient(circle, transparent 1%, #fff 1%) center/15000%;border-radius: 2px;}
.view-customlink:active {background-color: #fff;background-size: 100%;transition: background 0s;}

.item-img {width: 100%;height: auto;border-radius: 6px !important;}
.items-card {width: 100%;}
.items-card figure {position: relative;width: 100%;height: 100%;float: left;margin: 0;transform-style: preserve-3d;
box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12) !important;
border-radius: 6px;
}
.items-card figure:hover .thumb {box-shadow: 4px 21px 44px -13px rgba(0, 0, 0, 0.75);}
.items-card figure:hover figcaption {text-shadow: 2px 10px 10px rgba(0, 0, 0, 0.35);}
.layer-overlay {
background: rgba(0, 0, 0, 0.8);position: absolute;height: 50%;width: 100%;left: 0;bottom: 0;right: 0;opacity: 1;
-webkit-transition: all 0.4s ease-in-out 0s;-moz-transition: all 0.4s ease-in-out 0s;transition: all 0.4s ease-in-out 0s;
border-radius: 0 0 6px 6px;
}
.items-card figure:hover figcaption .brand {opacity: 1;}
.items-card figure .thumb {width: 100%;}
.items-card figure figcaption {position: absolute;left: 0;bottom: -15px;width: 100%;text-align: center;}
.items-card figure figcaption .brand {height: 30px;margin-bottom: 40px;opacity: 0;}
.items-card figure figcaption h3,.items-card figure figcaption h4 {color: #fff;}
.items-card figure figcaption h4 {font-size: 1.2rem !important;}
.items-card figure figcaption small {font-size: 12px;color: #fff;display: block;margin-bottom: 20px;}


.close-trans {
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  -webkit-transform: translate(0, -25%);
  -ms-transform: translate(0, -25%);
  -o-transform: translate(0, -25%);
  transform: translate(0, -25%);
}


.switch {display:inline-block;width: 55px;height: 26px;}
.switch-input{display: none;}
.switch-slider{position:relative;display:block;height:inherit;cursor:pointer;background-color: var(--white);transition: 0.15s ease-out;border-radius: 0.25rem;}
.switch-slider::before{position: absolute;top: 4px;left: 4px;box-sizing: border-box;width: 16.5px;height: 16.5px;content: "";
background-color: var(--tgray);transition: 0.15s ease-out;border-radius: 0.125rem;}
.switch-input:checked ~ .switch-slider::before {-webkit-transform: translateX(14px);transform: translateX(14px);}
.switch-input:disabled ~ .switch-slider {cursor: not-allowed;opacity: 0.5;}
.switch-label {width: 48px;margin-bottom: 0;padding-top: 8px;}
.switch-label .switch-slider::before {z-index: 2;}
/* .switch-label .switch-slider::after {position: absolute;top: 50%;right: 1px;z-index: 1;width: 50%;margin-top: -0.5em;
font-size: 16px;line-height: 1;text-align: center;text-transform: uppercase;content: "|";transition: inherit;font-weight: 600;
height: 10px;color:var(--tgray)} */

.switch-label .switch-input:checked ~ .switch-slider::before {-webkit-transform: translateX(24px);transform: translateX(24px);background-color: var(--white);}
/* .switch-label .switch-input:checked ~ .switch-slider::after {left: 2px;color: var(--white);content: "\e5ca";font-family: "Material Icons";
  font-style: normal;font-weight: 600;text-decoration: inherit;font-size: 16px;margin-top: -0.5em;} */
.switch-primary .switch-input:checked + .switch-slider {background-color: var(--tgreen);border-color: var(--tgreen);}
.switch-outline-primary .switch-input:checked + .switch-slider {background-color: #fff;border-color: #38454f;}
.switch-outline-primary .switch-input:checked + .switch-slider::before {border-color: #38454f;}
.switch-outline-primary .switch-input:checked + .switch-slider::after {color: #38454f;}
.switch-outline-primary-alt .switch-input:checked + .switch-slider {background-color: #fff;border-color: #38454f;}
.switch-outline-primary-alt .switch-input:checked + .switch-slider::before {background-color: #38454f;border-color: #38454f;}
.switch-outline-primary-alt .switch-input:checked + .switch-slider::after {color: #38454f;}
.switch-pill .switch-slider {border-radius: 50em;}
.switch-pill .switch-slider::before {border-radius: 50em;top: 4.5px;}

.icon-width {width: 15px;height: 15px;border-radius: 0 !important;}
.word-brk {word-break: break-word;letter-spacing: normal;}


.center {width: 70px;height: 70px;}
.center img {height: 70px !important;width: 70px;}

@-webkit-keyframes white-shadow {
  0% {
      /* box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8); */
      box-shadow: 0 0 0 0 rgba(33, 33, 33, 0.1);
      -webkit-transition: box-shadow 0.3s ease-in-out;
  }
  100% {
      box-shadow: 0 0 0 50px transparent;
      -webkit-transform: translate3d(0, 0, 0);
      -webkit-transition: box-shadow 0.4s ease-in-out;
  }
}
@-moz-keyframes white-shadow {
  0% {
      /* box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8); */
      box-shadow: 0 0 0 0 rgba(33, 33, 33, 0.1);
      -moz-transition: box-shadow 0.3s ease-in-out;
  }
  100% {
      box-shadow: 0 0 0 50px transparent;
      -moz-transform: translate3d(0, 0, 0);
      -moz-transition: box-shadow 0.4s ease-in-out;
  }
}
@keyframes white-shadow {
  0% {
      /* box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8); */
      box-shadow: 0 0 0 0 rgba(33, 33, 33, 0.1);
      -webkit-transition: box-shadow 0.3s ease-in-out;
      -moz-transition: box-shadow 0.3s ease-in-out;
      transition: box-shadow 0.3s ease-in-out;
  }
  100% {
      box-shadow: 0 0 0 50px transparent;
      -webkit-transform: translate3d(0, 0, 0);
      -moz-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      -o-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      -webkit-transition: box-shadow 0.4s ease-in-out;
      -moz-transition: box-shadow 0.4s ease-in-out;
      transition: box-shadow 0.4s ease-in-out;
  }
}

/* For Switching Icons */
@-webkit-keyframes white-shadow2 {
  0% {
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
      -webkit-transition: box-shadow 0.3s ease-in-out;
  }
  100% {
      box-shadow: 0 0 0 50px transparent;
      -webkit-transform: translate3d(0, 0, 0);
      -webkit-transition: box-shadow 0.4s ease-in-out;
  }
}
@-moz-keyframes white-shadow2 {
  0% {
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
      -moz-transition: box-shadow 0.3s ease-in-out;
  }
  100% {
      box-shadow: 0 0 0 50px transparent;
      -moz-transform: translate3d(0, 0, 0);
      -moz-transition: box-shadow 0.4s ease-in-out;
  }
}
@keyframes white-shadow2 {
  0% {
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
      -webkit-transition: box-shadow 0.3s ease-in-out;
      -moz-transition: box-shadow 0.3s ease-in-out;
      transition: box-shadow 0.3s ease-in-out;
  }
  100% {
      box-shadow: 0 0 0 50px transparent;
      -webkit-transform: translate3d(0, 0, 0);
      -moz-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
      -o-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      -webkit-transition: box-shadow 0.4s ease-in-out;
      -moz-transition: box-shadow 0.4s ease-in-out;
      transition: box-shadow 0.4s ease-in-out;
  }
}
/* ##For Switching Icons */

.mat-elevation-z2 {
  /* box-shadow: 0 0 4px rgba(0, 0, 0, 0.2) !important; */
  -webkit-box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0px 8px rgba(0, 0, 0, 0.1);  
}

.circle-img {width: 20px;height: 20px;border-radius: 50px;background-color: #fff;padding: 1px;box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);}
.viewsts-ordericon {width: 20px;height: 20px;}
.fb-icon {padding: 4px;}
.mandatory-span{font-size:14px;padding:8px 16px;background-color:var(--primary-button-background);color: var(--primary-button-text);border-radius:12px;}
.customize-ft-bg {background-color: rgba(81, 45, 168, 0.1);}


/*Shadow & Gradient*/

.border-gradiant {border-color: #f3e7c8 !important;-moz-border-image: -moz-linear-gradient(45deg, #f3e7c8 0, #568e91 100%);
-webkit-border-image: -webkit-linear-gradient(45deg, #f3e7c8 0, #568e91 100%);border-image: linear-gradient(45deg, #f3e7c8 0, #568e91 100%);
border-image-slice: 1;
}

.customize-shadow {-webkit-box-shadow: 5px -7px 20px 7px rgba(0, 0, 0, 0.1);box-shadow: 5px -7px 20px 7px rgba(0, 0, 0, 0.1);}
.cart-bshadow {height: 30px;display: inline-block;position: absolute;bottom: 0;z-index: 999;left: 20px;right: 20px;
  background: -moz-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(9%, #fff), color-stop(100%, rgba(53, 54, 58, 0.1)));
  background: -webkit-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -o-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -ms-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: linear-gradient(180deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
}
/* .customize-bshadow {height: 30px;display: inline-block;position: absolute;width: 100%;bottom: 82px;z-index: 999;left: 0;
  background: -webkit-linear-gradient(top, #fff 0%, #fff 9%, rgba(53, 54, 58, 0.1) 51%, rgba(53, 54, 58, 0.1) 100%);
  background-image: -webkit-linear-gradient(top, #fff 0%, #fff 9%, rgba(53, 54, 58, 0.1) 51%, rgba(53, 54, 58, 0.1) 100%);
  background: -moz-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(9%, #fff), color-stop(100%, rgba(53, 54, 58, 0.1)));
  background: -webkit-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -o-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -ms-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: linear-gradient(180deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
} */
.customize-bshadow {height: 30px;display: inline-block;position: absolute;width: 100%;bottom: 82px;z-index: 999;left: 0;
  background: -webkit-linear-gradient(top, transparent 0%, transparent 9%, rgba(53, 54, 58, 0.15) 51%, rgba(53, 54, 58, 0.15) 100%);
  background-image: -webkit-linear-gradient(top, transparent 0%, transparent 9%, rgba(53, 54, 58, 0.15) 51%, rgba(53, 54, 58, 0.15) 100%);
  background: -moz-linear-gradient(270deg, transparent 0, transparent 9%, rgba(53, 54, 58, 0.15) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(9%, transparent), color-stop(100%, rgba(53, 54, 58, 0.15)));
  background: -webkit-linear-gradient(270deg, transparent 0, transparent 9%, rgba(53, 54, 58, 0.15) 100%);
  background: -o-linear-gradient(270deg, transparent 0, transparent 9%, rgba(53, 54, 58, 0.15) 100%);
  background: -ms-linear-gradient(270deg, transparent 0, transparent 9%, rgba(53, 54, 58, 0.15) 100%);
  background: linear-gradient(180deg, transparent 0, transparent 9%, rgba(53, 54, 58, 0.15) 100%);
}
.vieworder-bshadow {height: 30px;display: inline-block;position: absolute;bottom: 80px;z-index: 999;left: 20px;right: 20px;
  background: -moz-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(9%, #fff), color-stop(100%, rgba(53, 54, 58, 0.1)));
  background: -webkit-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -o-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -ms-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: linear-gradient(180deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
}
.bill-bshadow {height: 30px;display: inline-block;position: absolute;bottom: 60px;z-index: 999;left: 0;right: 0;
  background: -moz-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(9%, #fff), color-stop(100%, rgba(53, 54, 58, 0.1)));
  background: -webkit-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -o-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: -ms-linear-gradient(270deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
  background: linear-gradient(180deg, #fff 0, #fff 9%, rgba(53, 54, 58, 0.1) 100%);
}

.customize-fade {background-color: rgba(0, 0, 0, 0.45) !important;overflow: hidden;}
.section-fade {opacity: 0.6;overflow: hidden;}
.text-capital {text-transform: capitalize;}
.countown-b {width: 120px;padding: 5px;margin: 0 auto;border-radius: 6px;border: 6px solid;}
.valet-i {width: 30px;height: auto;}
.valet-i2 {width: 35px;height: auto;}
.pointer-none {pointer-events: none;}

.bill-top {font-size: 16px;word-spacing: 1px;opacity: 0.8;}
.bill-inner {width: 90%;padding: 10px;border-radius: 4px;background-color: #fff !important;}
.bill-inner-nopad {width: 90%;border-radius: 4px;background-color: #fff !important;}
.bill-inner1 {width: 90%;padding: 16px 20px;border-radius: 0 0 4px 4px;color: #212121;background-color: #fff !important;margin-top: -10px;}
.bill-bottom-border {border-bottom: 1px solid rgba(0, 0, 0, 0.25);width: 85%;margin-top: 20px !important;margin-bottom: 20px !important;}
.bill-bottom-border:last-child {border-bottom: 0;}
.bill_smalltext {opacity: 0.6;font-size: 12px;letter-spacing: 0.5px;}
.billlist-container {display: flex;width: 100%;}
.billlist-element {align-self: center;margin: 0 auto;}


.dot-style {position: absolute;margin-top: -6px;font-size: 15px;}
.headtext,.svg-icon {vertical-align: middle;display: inline-block;line-height: 160%;}
.display-bottom {vertical-align: bottom;display: inline-block;}
a {display: inline-block;}
a svg {display: inline-block;vertical-align: middle;}
.p-2 {font-size: 12px;color: rgba(0, 0, 0, 0.64);}
.cate-count {display:flex;align-items:flex-end;height:55px;margin:auto !important;justify-content: flex-end;}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* background: #0b0b1b; */
  overflow: hidden;
  z-index: 100;
  background: var(--body-bg) !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.preloader .pre-container {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  text-align: center;
}
.preloader .logo-circle {
  position: relative;
  width: 100px;
  height: 100px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e4e4e4;
  border-radius: 200px;
  -webkit-animation: white-shadow 1s infinite;
  -moz-animation: white-shadow 1s infinite;
  -ms-animation: white-shadow 1s infinite;
  animation: white-shadow 1s infinite;
  display: flex;
  align-items: center;
  justify-content: center;
}
.preloader-webp {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #0b0b1b;
  overflow: hidden;
  z-index: 100;
  background: var(--primary-theme-background);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.preloader-webp .pre-container {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  text-align: center;
}
.preloader-webp .logo-circle {
  position: relative;
  width: 100px;
  height: 100px;
  margin: 0 auto;
  background: #fff;
  border-radius: 200px;
  -webkit-animation: white-shadow 1s infinite;
  -moz-animation: white-shadow 1s infinite;
  -ms-animation: white-shadow 1s infinite;
  animation: white-shadow 1s infinite;
  display: flex;
  align-items: center;
  justify-content: center;
}


.bottom-button {position: absolute;bottom: 20px;width: 100%;}
.hasMoreText.itemDesc {display: block;display: -webkit-box;-webkit-box-orient: vertical;position: relative;
overflow: hidden;text-overflow: ellipsis;height: calc(1.2em * 1.2 * 2);background: transparent;text-align: left;font-size: 14px;}
.hasMoreText.itemDesc:after {content: "...more";text-align: right;bottom: 0;font-size: 14px;right: 0;display: block;position: absolute;
  height: calc(1em * 1.35);background: #fff !important;color: #222222;}
.itemDescNormal{display:block;display:-webkit-box;-webkit-box-orient:vertical;position:relative;background:transparent;text-align:left;font-size:14px;}
.itemDesc.lessText{display:block;display:-webkit-box;-webkit-box-orient:vertical;position:relative;background:transparent;text-align:left;font-size:14px;}
.itemDesc.lessText:after {content: "...less";text-align: right;bottom: 0;font-size: 14px;right: 15px;display: block;position: absolute;
  height: calc(1em * 1.35);background: #fff !important;color: #222222;}
.blur-up {-webkit-filter:blur(3px);filter: blur(3px);transition: filter 1500ms 250ms, -webkit-filter 1500ms 250ms;}
.blur-up.lazyloaded {-webkit-filter: blur(0);filter: blur(0);}
.lq-blur-up {-webkit-filter: blur(3px);filter: blur(3px);transition: filter 1500ms 250ms, -webkit-filter 1500ms 250ms;}
.adisabled {cursor: not-allowed;opacity: 0.65;}
.bg-transparent {background: transparent;}
.logo-style {width: 8%;height: auto;min-width: 100px;}
.box-shadow-custom{/*box-shadow:0 -2px 5px rgba(0, 0, 0, 0.2);*/-webkit-box-shadow:0 -10px 20px rgba(0, 0, 0, 0.1);box-shadow:0 -10px 20px rgba(0, 0, 0, 0.1);}
.pwd input::placeholder {color: rgba(0, 0, 0, 0.3) !important;font-style: normal;}
.progress-outer {color: transparent !important;}

/*Login*/
.login-btn-purple {margin: 0;padding: 10px 5px;width: 100%;font-size: 14px;background: var(--primary-button-background);color: var(--primary-button-text);
  letter-spacing: 0.05rem;border-radius: 8px;}
.login-btn-white {margin: 0;padding: .55rem .75rem;width: 100%;font-size: 15px;background: var(--white);color: var(--black);
  border:2px solid var(--primary-button-background);border-radius:14px;transition-duration:0.3s}
.login-btn-gray {margin: 0;padding: 10px 5px;width: 100%;font-size: 15px;background: var(--white);border:2px solid var(--primary-button-background);
  color:rgba(33, 33, 33, 0.34); border-radius: 14px;}
.login-btn-disable {margin: 0;padding: 10px 5px;width: 100%;font-size: 15px;background: rgba(33, 33, 33, 0.34); color: var(--white); border-radius: 14px;}
.login-input-label1 {position: absolute;top: 16px;left: 15px;background-color: transparent;z-index: 9999;font-size: 14px !important;}
.OTP-input-label1 {position: absolute;top: 11px;left: 15px;padding: 2px 0;font-size: 11px;color: #fff;z-index: 9999;border-radius: 3px;letter-spacing: 0.2rem;}
.login-label-password {position: absolute;top: 14px;right: 10px;padding: 2px 0;font-size: 11px;color: #fff;z-index: 9999;border-radius: 3px;letter-spacing: 0.2rem;}

.img-circle-login-white {border-radius: 50%;background-color: white;width: 30px;height: 30px;}
.img-circle-login-purple {border-radius: 50%;background-color: var(--primary-button-background);padding: 5px;}
.img-circle-login-disable {border-radius: 50%;background-color: white;width: 30px;height: 30px;}
.img-circle-login-disable-gray {border-radius: 50%;background: rgba(33, 33, 33, 0.64);width: 30px;height: 30px;}


.logo-fb-gray {background: url(../images/social/facebook-gray.svg);width: 20px;height: 20px;}
.logo-fb {background: url(../images/social/facebook.svg);width: 20px;height: 20px;}
.logo-email-gray {background: url(../images/social/email-gray.svg);width: 20px;height: 20px;}
.logo-email {background: url(../images/social/email.svg);width: 20px;height: 20px;}
.logo-google-gray {background: url(../images/social/google-gray.svg);width: 20px;height: 20px;}
.logo-google {background: url(../images/social/google.svg);width: 20px;height: 20px;}


.svg-grey {filter: invert(0.5);}
.svg-bg {fill: #512da8;}
.swiper-caption {position: absolute;right: 10px;bottom: 65px;z-index: 10;padding-top: 10px;color: #fff;text-align: center;}

.d-flex {display: -ms-flexbox !important;display: flex !important;}
.d-none {display: none;}
.dis-inline-block {display: inline-block !important;}
.align-items-center{align-items: center;}
.justify-content-center{justify-content: center;}
.justify-content-end{justify-content: flex-end;}
.justify-content-between{justify-content:space-between;}
.flex-column {-ms-flex-direction: column !important;flex-direction: column !important;}
.wrapper {min-height: 100%;display: flex;flex-direction: column;}
.page-header,.page-footer {flex-shrink: 0;}

.footer {text-align: center;font-size: 14px;padding-bottom: 20px;}
.footer1 {text-align: center;font-size: 14px;}
.footer2 {text-align: center;font-size: 14px;}
.footer img {vertical-align: middle;width: 80px;}

.page-body {flex-grow: 1;width: 100%;}
.preloader-content {color: white;margin-top: 50px;font-size: 16px;}

#smileys .radio-item input[type="radio"] + label:before {
  /* content: " ";
  display: inline-block;
  position: relative;
  top: 5px;width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid var(--primary-button-background);
  background-color: transparent; */
  background-color: #f5f5f5!important;
  border: 2px solid #f5f5f5!important;
  border-radius: 50% !important;
  box-sizing: content-box !important;
  content: "" !important;  
  top: -1px !important;
  left: 0 !important;
  width: 16px !important;
  height: 16px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  transform: none !important;
}

#smileys .radio-item input[type="radio"]:checked + label::before {
  /* content: " ";
  display: inline-block;
  position: relative;
  top: 5px;width: 30px;
  height: 30px;
  border-radius: 50%;
  font-weight: bold;
  border: 2px solid var(--primary-button-background);
  background-color: transparent; */
  background-color: var(--chkbox-checked-bg)!important;
border-color: var(--chkbox-checked-bg)!important;
}

#smileys .radio-item input[type=radio] + label::after {
  box-sizing: content-box !important;
  content: "" !important;    
  position: absolute !important;
  top: 50% !important;
  left: 5px !important;
  width: 10px !important;
  height: 10px !important;
  margin-top: -4px !important;
  border-radius: 50%;
  background-color: #999;
  transform: none!important;         
}


#smileys .radio-item input[type=radio]:checked + label::after {      
background-color: var(--chkbox-checked-label) !important;       
}

.theme-text {color: var(--primary-theme-text);}
.theme-btn {background: var(--white);color: var(--primary-button-text);}
/* .theme-btn:hover{background: var(--primary-button-background); color: var(--primary-button-text);} */
.theme-bg {background: var(--primary-theme-background) !important;color: var(--primary-theme-text) !important;}
.non-theme-bg {background-color: var(--body-bg) !important; color: var(--primary-theme-text) !important; border: none !important;}
.item-card-theme {background: var(--primary-card-background) !important;color: var(--primary-card-text) !important;}
.nav-back-arrow {fill: var(--primary-theme-text) !important;}
.btn-svg-theme {fill: var(--primary-button-text) !important;}
.btn-svg-stroke {fill: var(--primary-button-text) !important;stroke: var(--primary-button-text) !important;}
.btn-svg-theme-bg {fill: var(--tgray) !important;}

.mat-form-field{ font-family: 'Jost', sans-serif!important;}
.reSendBtn {
	color: var(--primary-theme-text);
	background: none;
}

.item_qt_bg.material-icons {
  font-size: 22px;
  /* background: #f5f5f5;
  border-radius: 50%; */
  /* color: #212121; */
  padding: 2px;
}

/* Change the white to any color */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}


/*Media Query*/

@media (max-width: 400px) {
  .logo-style {width: 35% !important;}
  .login .modal-dialog {width: 100%;}
}

@media (max-width: 599px) {
  .logo-style {width: 15% !important;}
  .mat-card {padding: 0 0;}
  .mat-card-cancel {padding: 0 0;}
}

@media all and (max-width: 768px),only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px),only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px),
only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px),only screen and (min-resolution: 192dpi) and (max-width: 1024px),
only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
  .modal-lg,.modal-sm {width: 95%;margin: 0 auto;top: 0;}
  .menu-list ul li p {font-size: 11.5px;}
  .center-div50 {width: 100%;}
  .scanner-bottom1 {width: 100%;}
  .center-div15 {width: 25%;}
}

@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (orientation: landscape) {
  .bottom-foot,.note-foot {position: relative; width: 100%;height: 55px;}
  #fback p {padding-right: 0;}
  .bill-foot {position: relative;width: 100%;height: 55px;}
  .bottom-text {position: relative;width: 100%;}
  #load.p-l-70 {padding-left: 350px;}
  #landscape img {width: 50%;}
  .ps-timeline .text2 {padding-left: 15px;}
  .mar-bottom {margin-bottom: 80px;}
  #chkout > .align-center {text-align: right;}
  #img-width img {width: 100%;height: 300px !important;}
}


@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation: landscape) {
  .bottom-foot,.note-foot {position: relative;width: 100%;height: 55px;}
  #fback p {padding-right: 0;}
  .bill-foot {position: relative;width: 100%;height: 55px;}
  .bottom-text {position: relative;width: 100%;}
  #load.p-l-70 {padding-left: 350px;}
  #landscape img {width: 50%;}
  .ps-timeline .text2 {padding-left: 15px;}
  .mar-bottom {margin-bottom: 80px;}
  #chkout > .align-center {text-align: right;}
  #img-width img {width: 100%;height: 300px !important;}
}


@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
  .bottom-foot,.note-foot {position: relative;width: 100%;height: 55px;}
  #fback p {padding-right: 0;}
  .bill-foot {position: relative;width: 100%;height: 55px;}
  .bottom-text {position: relative;width: 100%;}
  #load.p-l-70 {padding-left: 350px;}
  #landscape img {width: 50%;}
  .ps-timeline .text2 {padding-left: 15px;}
  .mar-bottom {margin-bottom: 80px;}
  #chkout > .align-center {text-align: right;}
  #img-width img {width: 100%;height: 300px !important;}
}



@media only screen and (min-device-width: 320px) and (max-device-height: 480px) and (-webkit-min-device-pixel-ratio: 2) {
  .center-div100 {width: 70%;}
  .bottom-text {position: relative !important;}
  .bottom-text .m-b-30 {margin-bottom: 10px !important;}
  #screenbg .pad50 {padding: 30px;}
}

@media only screen and (min-width: 320px) and (max-height: 568px) and (-webkit-min-device-pixel-ratio: 2) {
  .center-div100 {width: 70%;}
  .bottom-text .m-b-30 {margin-bottom: 10px !important;}
  .bottom-text .m-t-70 {margin-top: 20px !important;}
  .btn-link {font-size: 12px;}
  .bill-foot2 .font-12 {font-size: 10px;}
  #screenbg .pad50 {padding: 30px;}
}

@media only screen and (max-width: 360px) {
  .bottom-text {position: relative;}
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .scan-center {top: 28% !important;}
  .center-div100 {width: 70%;}
  .bottom-text {position: relative;}
  .bottom-text .m-b-30 {margin-bottom: 10px !important;}
  .scanner-bottom-text img {width: 50px;height: 50px;}
}

@media (max-width: 767px) {
  .logo-style {width: 8% !important;}
  .navbar > .container .navbar-brand,.navbar > .container-fluid .navbar-brand {margin-left: 35px;width: auto;}
  .navbar .navbar-header {display: flex;align-items: center;line-height: 0;width: calc(100% + 30px);}
  .navbar .nav > li {display: inline-block;}
  .navbar .navbar-nav {margin-top: -10px;margin-bottom: 1px;margin-left: -7px;}
  .navbar .navbar-nav .open .dropdown-menu {background-color: #fff;position: absolute;}
  .navbar .dropdown-menu {margin-left: -50px;}
  .navbar .js-right-sidebar {margin-top: 15px;}
  .dt-buttons {float: none !important;text-align: center;margin-bottom: 15px;}
  .panel-switch-btn {top: 12px;right: 0 !important;}
  }
  
  @media (max-width: 1024px) {
  .navbar > .container .navbar-brand,.navbar > .container-fluid .navbar-brand {margin-left: 35px;width: auto;}
  .navbar .navbar-header {display: flex;align-items: center;line-height: 0;width: 100%;}
  .navbar .nav > li {display: inline-block;}
  .navbar .navbar-nav {margin-top: -10px;margin-bottom: 1px;margin-left: -7px;}
  .navbar .navbar-nav .open .dropdown-menu {background-color: #fff;position: absolute;}
  .navbar .dropdown-menu {margin-left: -50px;}
  .navbar .js-right-sidebar {margin-top: 15px;}
  .dt-buttons {float: none !important;text-align: center;margin-bottom: 15px;}
  .panel-switch-btn {top: 12px;right: 0 !important;}
  .container-fluid > .navbar-header {margin-right: -15px;margin-left: -12px;}
  }
  
  @media (min-width: 768px) and (max-width: 1024px) {
  .logo-style {width: 8% !important;}
  .navbar > .container .navbar-brand,.navbar > .container-fluid .navbar-brand {margin-left: 20px;}
  .item-count {min-width: 215px;}
  }
  
  @media (min-width: 992px) and (max-width: 1169px) {
  .navbar > .container .navbar-brand,.navbar > .container-fluid .navbar-brand {margin-left: 20px;}
  }



  .text-carousel {
    position: absolute;
      top: 15px;
      width: 100%;
      text-align: left;
      font-size: 14px;
      line-height: 45px;
      height: 45px;
      color: rgba(33, 33, 33, 0.4);
  }
  .text-carousel .pre {
    position: absolute;
    top: 0;
    right: 56%;
    height: 45px;  
  }
  .text-carousel .change_outer {
    position: absolute;
    top: 0;
    left: 4%;
    text-align: left;
    height: 45px;
    overflow: hidden;
  }
  .text-carousel .change_outer .change_inner {
    position: relative;
    -webkit-animation: rotate 8s ease-in-out infinite;
            animation: rotate 8s ease-in-out infinite;
  }
  .text-carousel .change_outer .element {
    display: block;
    font-weight: 500;  
  }
  
  @-webkit-keyframes rotate {
    0%, 20% {
      transform: translateY(0);
    }
    25%, 45% {
      transform: translateY(-45px);
    }
    50%, 70% {
      transform: translateY(-90px);
    }
    75%, 95% {
      transform: translateY(-135px);
    }
    100% {
      transform: translateY(-180px);
    }
  }
  
  @keyframes rotate {
    0%, 20% {
      transform: translateY(0);
    }
    25%, 45% {
      transform: translateY(-45px);
    }
    50%, 70% {
      transform: translateY(-90px);
    }
    75%, 95% {
      transform: translateY(-135px);
    }
    100% {
      transform: translateY(-180px);
    }
  }
  

  body {
    height: 100vh;
    background: #f5f5f5;
    overflow-x: hidden;
  }

.swiper-scrollbar-drag{background:var(--black)!important}
.ins-header img{width:70px;height: auto;}

/*Safari*/
@media not all and (min-resolution:.001dpcm) { 
  body,html{letter-spacing: normal!important;}
h1,h2,h3,h4,h5,h6 {font-weight: 600;}
.font-bold500 {font-weight: 600;}
.font-weight-bold {font-weight: 600 !important;}
.text-bold {font-weight: 600;}
.btn {font-weight:600;}
.btn-primary-theme .material-icons{font-weight:600}
.card .card-inside-title small a {font-weight: 600;}
.card .header h2 {font-weight: 600;}
.card .header h2 small a {font-weight: 600;}
.menu-list ul li a p {font-weight:600}
.item-count2 {  font-weight: 600;}
.login-label {font-weight: 600;}
.alert .alert-link {font-weight: 600;}
.modal .modal-header .modal-title {font-weight: 600;}
.form-group .control-label{font-weight: 600;}
.md-checkbox label {font-weight: 600;}
#cradio input[type="radio"]:checked + label {font-weight:600}
.input-label-e {font-weight: 600;}
.input-label {font-weight: 600 !important;}
.newchkbox [type=radio] + label {font-weight: 600;}
.mat-card-title {font-weight:600!important}
.Notif_title, .Notif_button {font-weight: 600;}
.font-bold,.accordion .menu, .subhead, .label-bold,
.accordion .item .item-header h2 button.btn.acc-btn-link, .ribbon4
 {font-weight: 600!important;}
 .ins-header img{width:70px!important;height: 70px!important;}

}