/*CSS CODES*/
html {
scroll-behavior: smooth;
}
body {
font-family: 'Roboto', sans-serif;
font-size: 14px;
font-weight: 400;
color: #000000;
padding: 0;
margin: 0;
position: relative;
height: 100vh;
}
.orders-manager{
height: auto;
}
.orders-manager footer.site-footer {
position: fixed;
}
.w70{width: 70%}
.w10{width: 10%}
.w20{width: 20%}
.h37{
height: 37px;
}
button.swal-button.swal-button--confirm {
background: #ee0a58;
}
.content-wrapper{
width: 700px;
margin: auto;
}
.btn, .btn:focus{
outline: none;
box-shadow: none;
}
.btn-fetch{
background: #EE0A58;
color: #fff;
font-size: 16px;
padding: 14px 47px;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border: 1px solid #ee0a58;
}
.btn-fetch.btn-line{
background: transparent;
color: #EE0A58;
border: 1px solid #EE0A58;
}
.btn-fetch.btn-white{
background: #fff;
border-color: #fff;
color: #111;
}
.btn-fetch.btn-alt{
background: #E0E0E0;
color: #EE0A58;
border: 1px solid #E0E0E0;
color:#000;
}
.btn-fetch:hover{
color: #fff;
background: #000;
border-color: #000;
}
.btn-fetch.btn-line:hover{
background: #EE0A58;
color: #fff;
border: 1px solid #EE0A58;
}
.btn-fetch.btn-bold{
font-weight: 700;
font-family: "Lato", sans-serif;
}
.btn-fetch.btn-white:hover{
background: transparent;
border-color: #fff;
color: #fff;
}
.btn-fetch.btn-line.btn-alt {
border-color: #04D3CB;
color: #04D3CB;
}
.btn-fetch.btn-line.btn-alt:hover {
background: #04D3CB;
color: #fff;
}
.btn-fetch img{
margin-right: 20px;
position: relative;
top:-1px;
}
.btn-fetch.sm{
padding-top: 9px!important;
padding-bottom: 9px!important;
}
.btn-fetch.xs {
padding-top: 6px;
padding-bottom: 6px;
}
.btn-fetch.xr {
padding: 2px 15px;
font-size: 12px;
font-weight: 600;
}
.btn-fetch .img-right {
margin-right: 0;
margin-left: 30px;
}
.form-control:focus{
box-shadow: none;
}
.page-content, .page-header-content{
padding-left: 0px;
background: #fff;
position: relative;
margin-top: -3px;
}
.page-content{
background: #EFEFEF;
}
.page-header{
padding: 25px 0px;
}
.page-header h1{
font-size: 24px;
font-weight: 500;
}
.page-header p{
font-weight: 300;
font-size: 14px;
margin-bottom: 0px;
}
.sec__header_alt{
font-weight: 500!important;
color: #696969!important;
font-size: 15px!important;
}
.pl40{
padding-left: 40px;
}
.pr40{
padding-right: 40px;
}
.mt30{
margin-top: 30px;
}
.page-title{
padding: 20px 0px;
border-bottom: 2px solid #D7D7D7;
}
.page-title h3{
font-size: 18px;
font-weight: 500;
margin-bottom: 0;
}
.order-dash .page-title h3 {
font-weight: 500;
color: #696969;
font-size: 15px;
}
.page-main-content{
padding-top: 55px;
padding-bottom: 55px;
}
.ib .checkbox-container {
display: inline-block;
margin-right: 5px;
}
.ib{
display: none;
}
.ib.active{
display: block;
}
.checkbox-container {
display: block;
position: relative;
padding-left: 30px;
margin-bottom: 12px;
cursor: pointer;
font-size: 14px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.checkbox-container input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkmark {
position: absolute;
top: 1px;
left: 0;
height: 20px;
width: 20px;
background-color: #fff;
border: 2px solid #BABABA;
}
.checkbox-container:hover input ~ .checkmark {
background-color: #ccc;
}
.checkbox-container input:checked ~ .checkmark {
}
.checkmark:after {
content: "";
position: absolute;
display: none;
}
.checkbox-container input:checked ~ .checkmark:after {
display: block;
}
.checkbox-container .checkmark:after {
left: 6px;
top: 2px;
width: 5px;
height: 11px;
border: solid #EE0A58;
border-width: 0 2px 2px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.checkbox-container[disabled] {
pointer-events: none;
opacity: .4;
}
.radio-container {
display: inline-block;
position: relative;
padding-left: 30px;
margin-bottom: 0px;
cursor: pointer;
font-size: 16px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/* Hide the browser's default radio button */
.radio-container input {
position: absolute;
opacity: 0;
cursor: pointer;
}
/* Create a custom radio button */
.radio-checkmark {
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
background-color: #eee;
border-radius: 50%;
}
/* On mouse-over, add a grey background color */
.radio-container:hover input ~ .radio-checkmark {
background-color: #ccc;
}
/* When the radio button is checked, add a blue background */
.radio-container input:checked ~ .radio-checkmark {
background-color: #ee0b58;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.radio-checkmark:after {
content: "";
position: absolute;
display: none;
}
/* Show the indicator (dot/circle) when checked */
.radio-container input:checked ~ .radio-checkmark:after {
display: block;
}
/* Style the indicator (dot/circle) */
.radio-container .radio-checkmark:after {
top: 6px;
left: 6px;
width: 8px;
height: 8px;
border-radius: 50%;
background: white;
}
select {
background: url(../images/icon-arrow-down.png);
background-repeat: no-repeat;
background-position: right 15px center;
-webkit-appearance: none;
}
/* The switch - the box around the slider */
.switch {
position: relative;
display: inline-block;
width: 50px;
height: 20px;
}
/* Hide default HTML checkbox */
.switch input {
opacity: 0;
width: 0;
height: 0;
}
/* The slider */
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}
.slider:before {
position: absolute;
content: "";
height: 14px;
width: 14px;
left: 4px;
bottom: 3px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}
input:checked + .slider {
background-color: #ee0b58;
}
input:focus + .slider {
box-shadow: 0 0 1px #ee0b58;
}
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
/* Rounded sliders */
.slider.round {
border-radius: 34px;
}
.slider.round:before {
border-radius: 50%;
}
.group-input{}
.group-input input{}
.group-input input ~ label{}
.group-input {
position: relative;
}
.group-input input ~ label, .group-input select ~ label, .group-input textarea ~ label{
position: absolute;
font-size: 20px;
font-weight: 300;
color: #6c747c;
top: 12px;
/*transform: translateY(-50%);
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);*/
left: 30px;
transition: .3s ease all;
pointer-events: none;
}
.group-input input:focus ~ label,
.group-input input:valid ~ label,
.group-input input:disabled ~ label,
.group-input input[type=email]:invalid ~ label,
.group-input input[type=date]:invalid ~ label,
.group-input input[type=datetime-local]:invalid ~ label,
.group-input input[type=time]:invalid ~ label {
top: 1px;
font-size: 12px;
}
.group-input input[type=email]:invalid ~ label {
color: red;
}
/*HEADER SECTION*/
.site-header {
background-image: url(../images/border.png);
background-repeat: no-repeat;
background-position: bottom left;
background-size: 100% 8px;
padding: 10px;
padding-bottom: 18px;
position: fixed;
width: 100%;
top: 0;
background-color: #fff;
z-index: 10;
}
.site-header-dashboard{
background-image: url('../images/border.png');
background-repeat: no-repeat;
background-position: bottom left;
background-size:100% 8px;
padding: 15px 0px;
padding-bottom: 23px;
background-color: #fff;
position: fixed;
width: 100%;
z-index: 10;
}
.site-header-dashboard .navbar-brand img{
height: 28px;
}
.navbar-left {
margin-left: 100px;
}
.navbar-left .nav-item {
font-size: 19px;
font-weight: 300;
color: #333;
}
.navbar-left .nav-item .nav-link {
color: #333;
font-weight: 500;
font-size: 16px;
}
.navbar-righta#navbarDropdown {}
.navbar-right .nav-item.dropdown {}
.navbar-right .nav-item.dropdown .nav-link.dropdown-toggle {
color: #EE0A58;
font-size: 14px;
font-weight: 300;
position: relative;
padding-right: 35px;
}
.navbar-right .nav-item.dropdown .nav-link.dropdown-toggle img {
margin-right: 20px;
}
.navbar-right .nav-item.dropdown .nav-link.dropdown-toggle::after {
content: '';
background-image: url(../images/icon-arrow-down.png);
border: 0;
margin: 0;
position: absolute;
height: 11px;
width: 19px;
right: 0;
top: 15px;
}
/*SECTION*/
section.main{
display: flex;
height: 100%;
}
section.main-dashboard {
padding-top: 98px;
height: 100%;
overflow: scroll;
background: #EFEFEF;
}
section.main-dashboard.users{
height: auto;
overflow: auto;
padding-bottom: 60px;
}
.expandedOrder section.main-dashboard {
overflow: hidden;
}
.section-content {
padding-top: 100px;
padding-bottom: 100px;
}
.section-content h1 {
font-size: 70px;
font-weight: 900;
line-height: 1.1;
}
.section-content p {
font-size: 20px;
font-weight: 300;
line-height: 1.3;
margin-top: 60px;
margin-bottom: 60px;
}
.section-content .btn{
border-radius: 24px;
-moz-border-radius: 24px;
-webkit-border-radius: 24px;
}
/*FOOTER SECTION*/
.site-footer{
background: #EE0A58;
padding: 20px;
color: #fff;
position: fixed;
width: 100%;
bottom: 0;
z-index: 10;
}
.site-footer p{
margin-bottom: 0px;
}
/*SIGNUP FORM*/
.signup-form{
margin-top: 60px;
height:350px;
overflow: hidden;
opacity: 1;
}
.signup-form{
transition: .5s ease opacity;
}
.signup-form .form-step{
min-height: 245px;
transition: .5s ease all;
}
.signup-form .form-step.not-active{
max-height: 0;
min-height: 0;
opacity: 0;
pointer-events: none;
}
.signup-form .active{
opacity: 1;
pointer-events: all;
}
.signup-form .form-step .step-title{
font-size: 20px;
font-weight: 900;
line-height: 1.1;
margin-bottom: 20px;
margin-top: 0px;
}
.signup-form .form-step .step-subtext{}
.signup-form .form-step .form-control,
.login-form .form-control{
padding: 10px 15px;
height: auto;
font-size: 20px;
font-weight: 300;
color: #111;
border-radius: 0;
-moz-border-radius: 0;
-webkit-border-radius: 0;
}
.signup-form .form-step select.form-control:invalid,
.login-form select.form-control:invalid{
color: #6d757d;
}
.signup-form .form-step .form-control:focus,
.login-form .form-control:focus{
border: 1px solid #707070;
}
p.form-step-count {
font-size: 20px;
font-weight: 900;
margin-top: 20px;
margin-bottom: 0;
}
.signup-form .form-group {
margin-bottom: 9px;
}
.signup-form .form-group .col-sm-6:first-child, #user__modal .form-group .col-sm-6:first-child, #user__add__modal .form-group .col-sm-6:first-child{
padding-right: 4px;
}
.signup-form .form-group .col-sm-6:last-child, #user__modal .form-group .col-sm-6:last-child, #user__add__modal .form-group .col-sm-6:last-child{
padding-left: 5px;
}
.signup-form #sendBtn{
display: none;
}
/*VENUE PAGE CSS*/
.single-venue-item {
min-height: 300px;
padding: 15px;
overflow:hidden;
}
.single-venue-item-inner{
background: #EE0A58;
min-height: 300px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.venue-items .has-item .single-venue-item-inner{
background: transparent;
}
.single-venue-item .btn-fetch{
font-family: "Roboto", sans-serif;
}
.single-venue-item{
width: 25%;
}
/*CREATE VENUE*/
.create-venue-tab, .build-menu-tab {
width: 750px;
background: #fff;
border: 1px solid #b7b7b7;
pointer-events: none;
opacity: 0;
position: relative;
}
.create-venue-tab:after {
content: 'Sync in progress...';
background-color: #fff;
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-image: url(../images/loader.gif);
background-repeat: no-repeat;
background-position: center;
background-size: 100px;
opacity: 0;
pointer-events: none;
transition: .3s ease-in opacity;
text-align: center;
font-size: 18px;
font-weight: 600;
color: #111;
padding-top: 180px;
}
.create-venue-tab.menuSyncing:after {
pointer-events: all;
opacity: 1;
}
.venue-builder.isVisible .create-venue-tab, .menu-builder.isVisible .build-menu-tab{
opacity: 1;
pointer-events: all;
}
.build-menu-tab{
width: 100%;
height: auto;
margin-bottom: 50px;
min-height: 550px;
position: relative;
}
.build-menu-tab:before{
content: '';
content: '';
position: absolute;
height: 100%;
width: 100%;
background: #fff;
z-index: 2;
opacity: 0;
pointer-events: none;
transition: .3s ease;
}
.build-menu-tab.editing:before{
opacity: .7;
pointer-events: all;
}
.build-menu-tab-content {
position: relative;
}
.build-menu-tab-content:before {
content: '';
position: absolute;
height: 100%;
width: 100%;left: 0;
top: 0;
background: #fff;
z-index: 2;
opacity: 0;
pointer-events: none;
}
.build-menu-tab-content.editing:before {
opacity: .7;
pointer-events: all;
}
.create-venue-tab-header, .build-menu-tab-header {
padding: 15px 30px;
font-size: 20px;
font-weight: 300;
border-bottom: 1px solid rgba(112,112,112, .5);
position: relative;
}
.create-venue-tab-content, .build-menu-tab-content {
display: flex;
}
.create-venue-tab-content #autocomplete, .build-menu-tab-content #autocomplete{
background: #E6E6E6;
}
.create-venue-tab-content .tab-header, .build-menu-tab-content .tab-header {
width: 200px;
padding: 0;
list-style: none;
color: #333;
font-size: 14px;
font-weight: 400;
margin-bottom: 0px;
}
.create-venue-tab-content .tab-header {
margin-bottom: 60px;
}
.create-venue-tab-content .tab-header-wrapper {
background: #efefef;
}
.create-venue-tab-content .tab-header li, .build-menu-tab-content .tab-header li {
padding: 25px 0px;
background: #EFEFEF;
border-top: 1px solid rgba(112,112,112,.05);
border-bottom: 1px solid rgba(112,112,112,.05);
padding-left: 30px;
position: relative;
cursor: pointer;
}
.tab-header.editing{
position: relative;
z-index: 3;
}
.build-menu-tab-content .tab-header li{
position: relative;
}
.build-menu-tab-content .tab-header.editing li{
pointer-events: all;
padding-left: 40px;
}
.build-menu-tab-content .tab-header li:after{
content: '';
position: absolute;
top: 26px;
left: 15px;
height: 18px;
width: 18px;
background-image: url(../images/sort-menu-icon.png);
background-repeat: no-repeat;
background-size: 100% 100%;
opacity: 0;
transition: .3s ease;
cursor: move;
pointer-events: all;
}
.build-menu-tab-content .tab-header.editing li:after{
opacity: 1;
}
.create-venue-tab-content .tab-header li.not-available {
opacity: .5;
pointer-events: none;
cursor: not-allowed;
}
.build-menu-tab-content .tab-header li.active{
font-weight: 900;
}
.create-venue-tab-content .tab-header li:first-child,
.build-menu-tab-content .tab-header li:first-child{
border-top: 0px;
}
.create-venue-tab-content .tab-header li:last-child,
.build-menu-tab-content .tab-header li:last-child{
border-bottom: 0px;
}
.create-venue-tab-content .tab-header li.active,
.build-menu-tab-content .tab-header li.active {
pointer-events: all;
background: #fff;
}
.create-venue-tab-content .tab-header li.active:before,
.build-menu-tab-content .tab-header li.active:before {
opacity: 1;
}
.create-venue-tab-content .tab-header li:before,
.build-menu-tab-content .tab-header li:before {
content: '';
height: 100%;width: 8px;
background: #ee0a58;
position: absolute;
left: 0px;top: 0px;
opacity: 0;
}
.create-venue-tab-content .tab-content,
.build-menu-tab-content .tab-content {
width: calc(100% - 200px);
padding-left: 50px;
padding-top: 30px;
padding-right: 60px;
}
.create-venue-tab-content .tab-content-wrapper{
height: 400px;
overflow: hidden;
}
.build-menu-tab-content .tab-content-wrapper{
height: auto;
}
.venue-builder .tab-content-step .form-group {
margin-bottom: 1rem;
}
.tab-content-step > .form-group{
margin-bottom: 0;
}
.create-venue-tab-content .tab-content-step,
.build-menu-tab-content .tab-content-step{
transition: .5s ease all;
min-height: 245px;
}
.create-venue-tab-content .tab-content-step.not-active,
.build-menu-tab-content .tab-content-step.not-active{
max-height: 0;
min-height: 0;
opacity: 0;
pointer-events: none;
overflow: hidden;
}
.create-venue-tab-content .tab-content-step.active,
.build-menu-tab-content .tab-content-step.active{
max-height: auto;
opacity: 1;
pointer-events: all;
}
.tab-content-step.active.sorting{
position: relative;
z-index: 5;
}
.create-venue-tab-content .tab-content .form-control,
.build-menu-tab-content .tab-content .form-control,
.report-wizard .form-control,
.password-box .form-control,
.input__modal .form-control,
.sm-style.form-control,
#sqLoc.form-control{
padding: 10px 15px;
height: auto;
font-size: 14px;
font-weight: 300;
color: #111;
border-radius: 0;
-moz-border-radius: 0;
-webkit-border-radius: 0;
}
.build-menu-tab-content .tab-content .form-control.description{
height: 300px;
}
.create-venue-tab-content .tab-content .group-input input ~ label,
.create-venue-tab-content .tab-content .group-input select ~ label,
.build-menu-tab-content .tab-content .group-input input ~ label,
.build-menu-tab-content .tab-content .group-input select ~ label,
.build-menu-tab-content .tab-content .group-input textarea ~ label,
.report-wizard input ~ label,
.report-wizard select ~ label,
.report-wizard textarea ~ label,
.password-box input ~ label,
input[type="text"].sm-style ~ label,
input[type="password"].sm-style ~ label,
.input__modal input ~ label,
.pw_forgot__modal input ~ label{
font-size: 14px;
}
.create-venue-tab-content .tab-content .group-input input:focus ~ label,
.create-venue-tab-content .tab-content .group-input input:disabled ~ label,
.create-venue-tab-content .tab-content .group-input input:valid ~ label,
.create-venue-tab-content .tab-content .group-input input[type=email]:invalid ~ label,
.create-venue-tab-content .tab-content .group-input select:focus ~ label,
.create-venue-tab-content .tab-content .group-input select:valid ~ label,
.build-menu-tab-content .tab-content .group-input input:focus ~ label,
.build-menu-tab-content .tab-content .group-input input:valid ~ label,
.build-menu-tab-content .tab-content .group-input input[type=email]:invalid ~ label,
.build-menu-tab-content .tab-content .group-input select:focus ~ label,
.build-menu-tab-content .tab-content .group-input select:valid ~ label,
.build-menu-tab-content .tab-content .group-input textarea:focus ~ label,
.build-menu-tab-content .tab-content .group-input textarea:valid ~ label,
.build-menu-tab-content .tab-content .group-input.valid input ~ label,
.report-wizard input:focus ~ label,
.report-wizard.group-input input:valid ~ label,
.report-wizard .group-input input[type=email]:invalid ~ label,
.report-wizard .group-input select:focus ~ label,
.report-wizard .group-input select:valid ~ label,
.report-wizard .group-input select ~ label,
select.sm-style ~ label,
input[type="text"].sm-style:valid ~ label,
input[type="text"].sm-style:focus ~ label,
#sqLoc ~ label {
top: 1px!important;
font-size: 12px!important;
}
.create-venue-tab-content .tab-content select.form-control:invalid,
.build-menu-tab-content .tab-content select.form-control:invalid {
color: #6d757d;
}
.create-venue-tab-content .tab-content .form-control:focus,
.build-menu-tab-content .tab-content .form-control:focus{
border: 1px solid #707070;
}
.create-venue-tab-content .tab-content .tab-step-info .btn-fetch,
.build-menu-tab-content .tab-content .tab-step-info .btn-fetch {
padding: 7px 25px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
padding-left: 40px;
}
.create-venue-tab-content .tab-content .tab-step-info .btn-fetch:hover,
.build-menu-tab-content .tab-content .tab-step-info .btn-fetch:hover{
color: #333;
background: #EE0A58;
}
.tab-step-info .tab-step-data {
background: #F0F0F0;
border-radius: 13px;
padding: 10px 15px;
position: absolute;
top: 0;
left: -52px;
height: 100%;
border: 1px solid #f0f0f0;
font-weight: 900;
}
.tab-step-info-inner {
position: relative;
}
.create-venue-tab-content .tab-content-step > .info,
.build-menu-tab-content .tab-content-step > .info{
margin-bottom: 30px;
}
.create-venue-tab-content .tab-content-step > .info > p,
.build-menu-tab-content .tab-content-step > .info > p{
margin-bottom: 3px;
color: #111;
font-weight: 400;
}
.create-venue-tab-content .tab-content-step > .info .small,
.build-menu-tab-content .tab-content-step > .info .small {
font-size: 11px;
line-height: 1.1;
}
.add-item-wrapper .form-group .col-sm-6:first-child,
.tab-content-wrapper .form-group .col-sm-6:first-child{
padding-right:4px;
}
.add-item-wrapper .form-group .col-sm-6:last-child,
.tab-content-wrapper .form-group .col-sm-6:last-child{
padding-left:4px;
}
.add-item-wrapper .form-group .col-sm-6:last-child input ~ label,
.tab-content-wrapper .form-group .col-sm-6:last-child select ~ label,
.tab-content-wrapper .form-group .col-sm-6:last-child input ~ label,
#user__modal .form-group .col-sm-6:last-child input ~ label,
#user__add__modal .form-group .col-sm-6:last-child input ~ label{
left: 20px;
}
.add-item-wrapper .form-group .col-sm-9 input ~ label,
.tab-content-wrapper .form-group .col-sm-9 input ~ label{
left: 20px;
}
.add-item-wrapper .form-group .col-sm-3,
.tab-content-wrapper .form-group .col-sm-3{
padding-right:4px;
}
.add-item-wrapper .form-group .col-sm-9,
.tab-content-wrapper .form-group .col-sm-9{
padding-left:5px;
}
.add-item-wrapper .checkbox-container{
font-size: 14px;
}
.search-text-box.group-input input ~ label{
left: 45px;
}
.add-order-type {
color: #EE0A58;
display: flex;
line-height: 25px;
text-decoration: none;
}
.add-order-type:hover{
color: #EE0A58;
text-decoration: none;
}
.add-order-type .icon {
height: 21px;
width: 21px;
background: #EE0A58;
margin-right: 10px;
background-image: url(../images/plus.png);
background-repeat: no-repeat;
background-position: center;
background-size: 12px;
}
.files-upload{
margin: 0 15px;
}
.files-upload .previewFileUpload{
height: 150px;
width: 100%;
object-fit: cover;
background-position: center;
}
.file-uploader {
position: relative;
overflow: hidden;
display: inline-block;
margin-top: 15px;
}
.file-uploader #fileInput {
position: absolute;
top: 0;
left: 0;
height: 100%;
opacity: 0;
cursor: pointer;
}
.add-item-wrapper .files-upload {
border: 1px dashed #707070;
margin: 0 15px;
padding: 20px;
}
.add-item-wrapper .files-upload, .add-item-wrapper .files-upload div{
width: 100%;
}
.add-item-wrapper .files-upload h1{
font-size: 30px;
font-weight: 300;
}
.add-item-wrapper .files-upload p{
font-size: 18px;
font-weight: 300;
}
.pac-container {font-family: "Roboto", sans-serif;}
.pac-item {
padding: 3px 4px;
}
.pac-item-query {
color: #EE0A58;
}
.pac-logo:after {
display: none;
}
.search-text-box {
position: relative;
margin-bottom: 10px;
}
.search-text-box:before {
content: '';
background-image: url(../images/icon-search.png);
position: absolute;
top: 0;
left: 15px;
height: 100%;
width: 20px;
background-repeat: no-repeat;
background-position: center;
}
.search-text-box .form-control{
padding-left: 45px!important;
}
/*VENUES*/
.venue-items .has-item{}
.venue-items .single-venue-item.has-item {
display: block;
}
.venue-items .single-venue-item.has-item .venue-header {
width: 100%;
position: relative;
overflow: hidden;
min-height: 250px;
}
.venue-items .single-venue-item.has-item .venue-header:before {
content: '';
height: 100%;
width: 100%;
position: absolute;
top: 0;
right: 0;
background: rgba(0,0,0,.66);
opacity: 0;
}
.venue-items .single-venue-item.has-item .venue-header img {
height: 250px;
width: 100%;
object-fit: cover;
object-position: center;
}
.venue-items .single-venue-item.has-item .venue-details {
background: #fff;
padding: 10px 20px;
width: 100%
}
.venue-items .single-venue-item.has-item .venue-header a.btn,
.venue-items .single-venue-item.has-item .venue-header .btn {
position: absolute;
left: 50%;
top: 10%;
transform: translate3d(-50, -50%, 0px);
-moz-transform: translate3d(-50%, -50%, 0px);
-webkit-transform: translate3d(-50%, -50%, 0px);
opacity: 0;
width: 200px;
}
.venue-items .single-venue-item.has-item .venue-header .links {
list-style: none;
padding: 0;
margin: 0;
position: absolute;
top: 15px;
right: -115px;
opacity: 0;
display: none;
}
.venue-items.single-venue-item.has-item .venue-header .links a{
color: #fff;
font-size: 12px;
font-weight: 700;
font-family: "Lato", sans-serif;
}
.venue-items .single-venue-item.has-item .venue-header:before,
.venue-items .single-venue-item.has-item .links,
.venue-items .single-venue-item.has-item a.btn,
.venue-items .single-venue-item.has-item .btn{
transition: .3s ease all;
}
.venue-items .single-venue-item.has-item:hover .venue-header:before,
.venue-items .single-venue-item.has-item:hover .links,
.venue-items .single-venue-item.has-item:hover a.btn,
.venue-items .single-venue-item.has-item:hover .btn{
opacity: 1;
}
.venue-items .single-venue-item.has-item:hover a.btn,
.venue-items .single-venue-item.has-item:hover .btn{
top: 50%;
}
.venue-items .single-venue-item.has-item:hover .links{
right: 15px;
}
.venue-items .single-venue-item.has-item a.btn:hover{
background: #fff;
border-color: #fff;
}
.venue-items .single-venue-item.has-item .venue-header .links a.has-drowdown {
background-image: url(../images/icon-arrow-down-white.png);
background-repeat: no-repeat;
background-position: right top 5px;
padding-right: 20px;
text-decoration: none;
color: #fff;
}
.venue-items .single-venue-item.has-item .venue-details .name {
font-size: 18px;
font-weight: 300;
white-space: nowrap;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.venue-items .single-venue-item.has-item .venue-details .completion {
font-size: 12px;
font-weight: 300;
color: #EE0A58;
margin: 0;
}
.single-venue-item.has-item .btn-fetch{
font-family: "Lato", "Roboto", sans-serif;
}
/*SINGLE VENUE*/
.single-venue .page-main-content {
position: relative;
padding-left: 235px;
}
.single-venue:before {
content: '';
height: 100%;
width: 220px;
background: #505050;
position: absolute;
}
.venue-menu {
position: absolute;
width: 220px;
top: 0;
left: 0px;
background:#505050;
}
.venue-menu ul {
list-style: none;
padding: 0;
margin: 0;
margin-top: 30px;
}
.venue-menu ul li {
font-size: 18px;
font-weight: 400;
padding-left: 50px;
border-top: 1px solid #3E3939;
padding-top: 7px;
padding-bottom: 7px;
position: relative;
}
.venue-menu ul li:last-child{
border-bottom: 1px solid #3E3939;
}
.venue-menu ul li > img {
position: absolute;
left: 30px;
top: 12px;
}
.venue-menu ul li a {
color: #fff;
text-decoration: none;
}
.venue-menu ul li.menu-sep {
height: 30px;
position: relative;
}
.venue-menu ul li.menu-sep:before {
height: 1px;
background: #989898;
top: 15px;
position: absolute;
width: 100%;
left: 0px;
content: '';
}
.menu-builder .create-link-list{
transition: .6s ease;
overflow: hidden;
max-height: none;
}
.menu-builder .create-link, .menu-builder .create-sub-category-link{
background: #EFEFEF;
padding: 0px 15px;
cursor: pointer;
overflow: hidden;
}
.menu-builder .create-link a, .menu-builder .create-sub-category-link a{
color: #EE0A58;
font-size: 18px;
font-weight: 900;
cursor: pointer;
padding: 15px 0px;
display: block;
pointer-events: none;
}
.menu-builder .create-sub-category-link{
max-height: 55px;
transition: .3s ease all;
padding: 0 20px;
}
.menu-builder .create-sub-category-link input{
border-left-width: 1px;
}
.menu-builder .create-sub-category-link.active-sub-create{
max-height: 120px;
}
.menu-builder .create-sub-category-link a{
pointer-events: all;
text-decoration: none;
position: relative;
top: 0px;
transition: .3s ease all;
}
.menu-builder .create-sub-category-link.active-sub-create a{
top: -50px;
}
.menu-builder .create-link:last-child{
background: #fff;
border-bottom: 1px solid #dfdfdf;
padding-bottom: 0px;
}
.add-item-wrapper {
width: 100%;
max-height: 0px;
transition: .6s;
overflow: hidden;
position: relative;
}
.add-item-wrapper:before{
position: absolute;
height: 100%;
width: 100%;
opacity: 0;
background: #fff;
top: 0;
left: 0;
content: '';
z-index: 5;
pointer-events: none
}
.add-item-wrapper.editing:before{
opacity: .7;
pointer-events: all;
}
.add-item-wrapper.active{
max-height: auto;
}
.add-item-wrapper {
width: 530px;
}
.accordion-header {
background: #EFEFEF;
font-weight: 900;
font-size: 18px;
padding: 20px;
cursor: pointer;
position: relative;
margin-bottom: 15px;
}
.accordion-header:before{
background-image: url(../images/accordion-arrow.png);
content: '';
position: absolute;
right: 20px;
height: 100%;
width: 30px;
background-repeat: no-repeat;
background-position: center right;
top: 0;
transform: rotate(-90deg);
transition: .3s ease;
}
.accordion-header.active:before{
transform: rotate(0deg);
}
.accordion-content {
padding: 0px;
padding-left: 20px;
background-color: #fff;
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease-out;
}
.menu-builder .files-upload{
width: calc(100% - 20px);
margin: 0px;
margin-left: auto;
}
.add-item-wrapper .save-item{
align-items: center;
padding-left: 20px;
margin-top: 30px;
}
.add-item-wrapper .save-item .checkbox-container {
margin-bottom: 0px;
height: 25px;
display: flex;
align-items: center;
}
.add-item-wrapper .save-item .checkmark {
border: 2px solid #000;
border-radius: 3px;
top: 2px;
}
.build-menu-tab-content .tab-header li {
overflow: hidden;
}
.build-menu-tab-content .tab-header li.disable{
max-height: 0px;
padding:0;
border: 0;
}
.build-menu-tab-content .tab-header.editing li.disable {
max-height: 90px;
padding: 25px 0px;
background: #EFEFEF;
border-top: 1px solid rgba(112,112,112,.05);
border-bottom: 1px solid rgba(112,112,112,.05);
padding-left: 40px;
font-weight: 400;
}
.build-menu-tab-content .tab-header.editing li:before {
opacity: 0;
}
.active-header-li {
margin-bottom: 0;
padding-left: 20px;
border-left: 8px solid #EE0A58;
border-bottom: 1px solid #b7b7b7;
display: flex;
justify-content: space-between;
align-items: center;
}
#active-header-li-text{
font-weight: 900;
margin-bottom: 0px;
padding: 15px 0px;
margin: 10px 0px;
border-color: transparent;
pointer-events: none;
transition: .3s ease padding;
border-width: 1px;
box-shadow: none;
outline: none;
width: calc(100% - 400px);
}
#active-header-li-text.editable{
pointer-events: all;
border-color: #000;
padding-left: 15px;
padding-right: : 15px;
pointer-events: auto;
width: 160px;
}
#active-header-li-text.editable ~ .button-list {
opacity: .4;
pointer-events: none;
}
#active-header-li-text.editable:focus, #active-header-li-text.editable:active{
border-width: 1px;
box-shadow: none;
outline: none;
}
.active-header-li{
padding-right: 80px;
position: relative;
overflow: hidden;
}
.active-header-li .button-list,
.sub-category-header .button-list,
.modifier-options .single-options .button-list{
position: relative;
}
.active-header-li .button-list .btn,
.sub-category-header .button-list .btn,
.modifier-options .single-options .button-list .btn{
padding-left: 55px;
position: relative;
font-size: 11px;
font-weight: 700;
font-family: "lato", "Roboto", sans-serif;
text-transform: uppercase;
padding-right: 40px;
}
.modifier-options .single-options .button-list .btn{
background: #c1c1c1;
border-color: #c1c1c1;
}
.modifier-options .single-options .button-list .btn:hover{
background: #ee0a58;
border-color: #ee0a58;
color: #fff;
}
.active-header-li .button-list .btn:before,
.sub-category-header .button-list .btn:before,
.modifier-options .single-options .button-list .btn:before{
content: '';
height: 16px;
width: 16px;
top: 50%;
left: 15px;
position: absolute;
transform: translateY(-50%);
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
.active-header-li .button-list .btn#edit-link:before,
.sub-category-header .button-list .btn.edit-link:before,
.modifier-options .single-options .button-list .btn.edit-link:before{
background-image: url(../images/edit-icon.svg)
}
.active-header-li .button-list .btn#delete-link:before,
.sub-category-header .button-list .btn.delete-link:before,
.modifier-options .single-options .button-list .btn.delete-link:before{
background-image: url(../images/delete-icon.svg)
}
.modifier-options .single-options .button-list{
display: flex;
align-items: center;
}
.modifier-options .single-options .button-list .delete-link{
margin-left: 5px;
}
.active-header-li #close-form{
height: 56px;
width: 56px;
background-image: url(../images/close_icon.png);
background-position: center;
background-repeat: no-repeat;
display: none;
cursor: pointer;
position: relative;
z-index: 4;
}
.alertbox {
position: absolute;
height: 72px;
width: 100%;
background: #fff;
top: -21px;
left: 0;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
transform: translateY(-50px);
-moz-transform: translateY(-50px);
-webkit-transform: translateY(-50px);
pointer-events: none;
opacity: 0;
transition: .3s ease all;
}
.sub-category-header .alertbox{
background: #efefef;
}
.single-modifier .modifier-options .button-list .alertbox{
top: 0px;
}
.alertbox.active{
transform: translateY(0px);
-moz-transform: translateY(0px);
-webkit-transform: translateY(0px);
pointer-events: all;
opacity: 1;
}
.alertbox > p {
margin-bottom: 0;
}
.alertbox-link{
color: #ee0a58;
font-weight: 900;
text-transform: uppercase;
margin-top: 5px;
}
.alertbox-link span{
display: inline-block;
margin: 0px 5px;
cursor: pointer;
}
.active-header-li .item-edit-button {
color: #ee0a58;
list-style: none;
display: flex;
position: absolute;
padding: 0;
margin: 0;
text-transform: uppercase;
font-size: 11px;
font-family: "Lato", "Roboto", sans-serif;
font-weight: 700;
opacity: 0;
pointer-events: none;
left: 0px;
transition: .3s ease all;
}
.active-header-li .item-edit-button li{
cursor: pointer;
}
.active-header-li .item-edit-button li:last-child{
margin-left: 5px;
}
.item-modifier{
margin-left: -20px;
position: relative;
}
.item__modifier:before {
content: '';
position: absolute;
height: 100%;
width: 100%;
background: #fff;
pointer-events: none;
background: rgba(255,255,255,.5);
opacity: 0;
}
.item__modifier.editing:before {
opacity: 1;
pointer-events: all;
z-index: 2;
}
.item-header .item-modifier{
margin-left: 0px;
margin-bottom: 10px;
}
.single-modifier .modifier {
display: flex;
justify-content: space-between;
padding: 10px 20px;
align-items: center;
background: #EFEFEF;
}
.single-modifier{
position: relative;
}
.single-modifier .modifier, .modifier-options .single-options{
position: relative;
overflow: hidden;
}
.single-modifier .modifier .item-edit-button, .modifier-options .single-options .item-edit-button,
#allowSortMenuOrder ~ .item-edit-button{
color: #ee0a58;
list-style: none;
display: flex;
position: absolute;
padding: 0;
margin: 0;
text-transform: uppercase;
font-size: 11px;
font-family: "Lato", "Roboto", sans-serif;
font-weight: 700;
opacity: 0;
pointer-events: none;
left: 0px;
transition: .3s ease all;
top: 50%;
transform: translateY(-50%);
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
.single-modifier .modifier .item-edit-button li, .modifier-options .single-options .item-edit-button li,
#allowSortMenuOrder ~ .item-edit-button li{
cursor: pointer;
}
.single-modifier .modifier .item-edit-button li:last-child, .modifier-options .single-options .item-edit-button li:last-child,
#allowSortMenuOrder ~ .item-edit-button li:last-child{
margin-left: 5px;
}
#allowSortMenuOrder ~ .item-edit-button{
left: auto;
right: 75px;
height: 100%;
background: #fff;
display: flex;
align-items: center;
font-size: 14px;
}
.single-modifier .modifier > .item-modifer-group-title {
font-weight: 900;
font-size: 18px;
margin: 0;
background: transparent;
border: 0;
box-shadow: none;
outline: none;
pointer-events: none;
opacity: 0;
transition: .3s all;
}
.single-modifier .modifier > .item-modifer-group-title.editable {
pointer-events: all;
border-bottom: 1px solid;
padding-top: 15px;
padding-bottom : 15px;
padding-right : 15px;
width: 150px;
opacity: 1;
}
.single-modifier .modifier .links, .modifier-options .single-options .links{
list-style: none;
padding: 0;
display: flex;
margin-bottom: 0;
align-items: center;
}
.single-modifier .modifier input.editable ~ .links, .modifier-options .single-options input.editable ~ .links{
opacity: .2;
pointer-events: none;
}
.single-modifier .modifier .links .edit, .modifier-options .single-options .links .edit{
background-image: url(../images/edit-icon.svg);
background-position: left 17px center;
}
.single-modifier .modifier .links .delete, .modifier-options .single-options .links .delete{
background-image: url(../images/delete-icon.svg);
}
.single-modifier .modifier .links li, .single-modifier .modifier .links .delete, .modifier-options .single-options .links li{
height: 35px;
width: 50px;
background-color: #BEBEBE;
background-repeat: no-repeat;
background-position: center;
border-radius: 9px;
cursor: pointer;
}
.single-modifier .modifier .links li:first-child,
.modifier-options .single-options .links li:first-child{
margin-right: 10px;
}
.modifier-options .single-options{
overflow: hidden;
}
.single-modifier .modifier .alertbox, .modifier-options .single-options .alertbox {
top: 0;
height: 100%;
background: #efefef;
}
.single-modifier .modifier .alertbox {
top: -18px;
height: calc(100% + 30px);
background: #efefef;
}
.single-modifier .modifier-options {
padding: 0;
margin: 0;
}
.modifier-options .single-options {
display: flex;
justify-content: space-between;
padding: 15px 20px;
border-bottom: 1px solid #dbd5d5;
}
.modifier-options .single-options > input {
font-size: 18px;
font-weight: 300;
margin:0;
border: 0;
padding: 0;
box-shadow: none;
outline: none;
pointer-events: none;
transition: .3s ease all;
}
.modifier-options .single-options > input.editable{
pointer-events: all;
border-bottom: 1px solid;
padding: 15px;
padding-left: 0px;
width: 140px;
}
.modifiers-add-link {
list-style: none;
padding: 0;
margin: 0;
margin-left: -20px;
display: block;
margin-bottom: 20px;
}
.modifiers-add-link li {
font-size: 18px;
font-weight: 900;
padding: 20px 15px;
border-bottom: 1px solid #dbd5d5;
}
.modifiers-add-link li:last-child {
border-bottom: 0px solid #dbd5d5;
background: #EFEFEF;
margin-top: 10px;
}
.modifiers-add-link li a {
color: #ee0a58;
}
.main .modifier-options .single-options {
background: #fff;
}
.main .modifier-options .single-options .info {}
.main .modifier-options .single-options .info .name {
font-size: 18px;
font-weight: 700;
margin-bottom: 0px;
}
.main .modifier-options .single-options .info .type {
font-size: 12px;
font-weight: 700;
color: #9F9F9F;
margin-bottom: 0;
}
.main .modifier-options .single-options .info .price {
font-size: 18px;
font-weight: 400;
color: #000;
margin-bottom: 0;
}
.main .modifier-options .single-options .links {
align-items: center;
}
.main .single-modifier .modifier .links li,
.main .single-modifier .modifier-options .links li {
height: auto;
width: auto;
padding-left: 55px;
padding-right: 35px;
font-size: 12px;
font-weight: 700;
font-family: "Lato", "Roboto", sans-serif;
color: #fff;
padding-top: 6px;
padding-bottom: 6px;
border-radius: 25px;
background-color: #ee0a58;
}
.main .single-modifier .modifier-options .links li {
background-color: #C1C1C1;
}
.main .single-modifier .modifier .links li.edit,
.main .single-modifier .modifier .links li.delete,
.main .single-modifier .modifier-options .links li.delete{
background-position: left 17px center;
}
.item-header{
overflow: hidden;
}
.tab-header-wrapper{
width: 200px;
overflow: hidden;
}
.tab-header-wrapper .add-new{
padding-left: 30px;
background: #EE0A58;
color: #fff;
padding-top: 20px;
padding-bottom: 20px;
margin: 0;
font-weight: 400;
text-decoration: none;
display: block;
position: relative;
opacity: 1;
top: -72px;
transition: .3s ease all;
cursor: pointer;
}
.new-item-active .add-new{
opacity: 0;
top: 0px;
pointer-events: none;
}
.main .single-modifier .modifier.modifier {
}
.single-modifier-add {
font-size: 18px;
font-weight: 900;
padding: 20px 15px;
border-bottom: 1px solid #dbd5d5;
color: #ee0a58;
text-decoration: none;
display: block;
}
.single-modifier-add:hover {
color: #ee0a58;
text-decoration: none;
}
.create-modifier-textbox input,
.create-group-modifier-textbox input {
width: 100%;
padding: 15px 30px;
border-radius: 0px;
box-shadow: none;
border: 1px solid #dbd5d5;
outline: none;
box-shadow: none;
border-top: 0px;
}
.single-modifier-add-item, .group-modifier-add-item {
height: 57px;
overflow: hidden;
}
.single-modifier-add-item .single-modifier-add,
.single-modifier-add-item .create-modifier-textbox,
.group-modifier-add-item .create-group-modifier-textbox{
position: relative;
transition: .3s ease all;
}
.single-modifier-add-item .create-modifier-textbox,
.group-modifier-add-item .create-group-modifier-textbox{
top: -68px;
pointer-events: none;
opacity: 0;
left: -200px;
}
.group-modifier-add-item{
transition: .3s ease left;
}
.group-modifier-add-item.edit-item-active {
padding: 0;
}
.group-modifier-add-item .create-group-modifier-textbox{
top: -27px;
border: 1px solid #dbd5d5;
padding: 7px 0px;
background: #fff
}
.create-group-modifier-textbox input{
border: 0px solid #dbd5d5;
}
.single-modifier-add-item .single-modifier-add,
.group-modifier-add-item .group-modifier-add{
left: 0;
}
.single-modifier-add-item.edit-item-active .create-modifier-textbox,
.group-modifier-add-item.edit-item-active .create-group-modifier-textbox{
left: 0;
opacity: 1;
pointer-events: all;
}
.single-modifier-add-item.edit-item-active .single-modifier-add,
.group-modifier-add-item.edit-item-active .group-modifier-add{
left: 250px;
opacity: 0;
pointer-events: none;
}
.group-modifier-add-item {
background: #efefef;
margin-left: -20px;
padding: 0 15px;
height: 67px;
margin-bottom: 20px;
}
.group-modifier-add-item .group-modifier-add {
color: #ee0a58;
font-size: 18px;
font-weight: 900;
text-decoration: none!important;
position: relative;
top: 20px;
transition: .3s ease all;
}
.group-modifier-add-item .create-group-modifier-textbox{
transition: .3s ease left;
}
.menu-builder .tab-content{
padding-top: 0px;
padding-bottom: 50px;
}
.category-new-item-box, .create-sub-category-textbox {
background: #efefef;
border-top: 1px solid #e8e8e8;
padding: 0px 0px;
opacity: 0;
position: relative;
top: -72px;
pointer-events: none;
transition: .3s ease all;
}
.create-sub-category-textbox{
top:-150;
pointer-events: none;
opacity: 0;
z-index: 3;
}
.create-sub-category-link.active-sub-create .create-sub-category-textbox {
top: -35px;
opacity: 1;
pointer-events: all;
}
.create-sub-category-textbox:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
background: #000;
z-index: 2;
cursor: not-allowed;
opacity: .2;
display: none;
}
.create-sub-category-textbox.ntAllowed:before {
display: block;
}
.category-new-item-box input, .create-sub-category-textbox input{
width: 100%;
padding: 25px 30px;
border-radius: 0px;
box-shadow: none;
border: 1px solid #dbd5d5;
border-left: 0px solid #dbd5d5;
}
.category-new-item-box input ~ label, .create-sub-category-textbox input ~ label{
font-size: 14px;
top:25px;
}
.category-new-item-box .link,
.create-sub-category-textbox .link,
.create-modifier-textbox .link,
.create-group-modifier-textbox .link {
list-style: none;
padding: 0;
margin: 0;
display: flex;
position: absolute;
right: 15px;
bottom: 5px;
font-size: 11px;
font-family: "Lato", "Roboto", sans-serif;
font-weight: 600;
color: #ee0a58;
}
.category-new-item-box .link li,
.create-modifier-textbox .link li,
.create-group-modifier-textbox .link li{
cursor: pointer;
}
.category-new-item-box .link li:last-child,
.create-sub-category-textbox .link li:last-child,
.create-modifier-textbox .link li:last-child,
.create-group-modifier-textbox .link li:last-child{
margin-left: 10px;
}
.category-new-item-box input:focus,
.category-new-item-box input:active,
.create-sub-category-textbox input:focus,
.create-sub-category-textbox input:active{
outline: none;
box-shadow: none;
}
.new-item-active .category-new-item-box {
opacity: 1;
top: 0px;
pointer-events: all;
z-index: 3;
}
.sub-category-title{
margin-bottom: 0px;
padding: 15px 0px;
margin: 10px 0px;
border-color: transparent;
pointer-events: none;
transition: .3s ease padding;
border-width: 1px;
box-shadow: none;
outline: none;
width: calc(100% - 400px);
background: transparent;
font-weight: 900;
font-size: 18px;
margin: 0;
}
.sub-category-title.editable {
pointer-events: all;
border-color: #000;
padding-left: 15px;
padding-right: 15px;
pointer-events: auto;
width: 300px;
}
.sub-category-title.editable ~ .button-list{
pointer-events: none;
opacity: .3;
}
.sub-category-header{
position: relative;
overflow: hidden;
}
.sub-category-header .item-edit-button {
color: #ee0a58;
list-style: none;
display: flex;
position: absolute;
padding: 0;
margin: 0;
text-transform: uppercase;
font-size: 11px;
font-family: "Lato", "Roboto", sans-serif;
font-weight: 700;
opacity: 0;
pointer-events: none;
left: 0px;
transition: .3s ease all;
}
.sub-category-header .item-edit-button li{
cursor: pointer;
}
.sub-category-header .item-edit-button li:last-child{
margin-left: 5px;
}
#navbar.menu-visible{
}
.site-header-dashboard .navbar-toggler{
outline: none;
box-shadow: none;
}
.navbar-toggler-icon{
display: inline-block;
cursor: pointer;
}
.navbar-toggler-icon .bar1, .navbar-toggler-icon .bar2, .navbar-toggler-icon .bar3 {
width: 27px;
height: 4px;
background-color: #ee0a58;
margin: 7px 0;
transition: 0.4s;
border-radius: 50px;
}
.active.navbar-toggler-icon .bar1 {
-webkit-transform: rotate(-45deg) translate(-9px, 6px);
transform: rotate(-45deg) translate(-8px, 7px);
}
.active.navbar-toggler-icon .bar2 {opacity: 0;}
.active.navbar-toggler-icon .bar3 {
-webkit-transform: rotate(45deg) translate(-8px, -8px);
transform: rotate(45deg) translate(-8px, -8px);
}
#successMsg{
padding: 25px 0;
display: flex!important;
width: 100%;
justify-content: space-between;
align-items: center;
overflow:hidden;
max-height: 0;
pointer-events: none;
transition: .3s ease all;
opacity: 0;
border-top: 1px solid #eae9e9;
border-bottom: 1px solid #eae9e9;
}
#successMsg span {
display: inline-block;
font-size: 18px;
margin-right: 15px;
color: #000;
border-left: 3px solid #ee0b58;
padding-left: 15px;
}
#successMsg {
}
#msgSignup{
overflow:hidden;
padding: 7px 15px;
display: inline-block;
background: #ee0b58;
color: #fff;
border-left: 5px solid #000;
max-height: 0;
pointer-events: none;
transition: .3s ease all;
opacity: 0;
}
.signup-form{
position: relative;
}
.signup-form:before{
position: absolute;
content: '';
height: 100%;
width: 100%;
background-image: url('../images/loader.gif');
background-position: center;
top: 0;
left: 0;
background-repeat: no-repeat;
background-color: #fff;
opacity: 0;
pointer-events: none;
transition: .3s ease all;
z-index: 1;
}
.signup-form.loading:before{
opacity: 1;
pointer-events: all;
}
/*PAYMENT MODAL*/
.payment-modal {
position: fixed;
height: 100vh;
width: 100vw;
z-index: 20;
background: rgba(0,0,0,.5);
display: flex;
justify-content: center;
align-items: center;
overflow-y: scroll;
transition: .5s ease;
opacity: 0;
pointer-events: none;
}
.payment-modal.active-modal{
opacity: 1;
pointer-events: all;
}
.payment-modal-inner {
width: 800px;
background: transparent;
padding: 100px;
text-align: center;
border: 20px solid rgba(254, 254, 254, .5);
position: relative;
transition: .3s ease all;
transform: translateY(-500px);
}
.payment-modal.active-modal .payment-modal-inner{
transform: translateY(0);
}
.payment-modal-inner:before{;
content: '';
height: 100%;
width: 100%;
top: 0;
left: 0;
position: absolute;
background: #fff;
z-index: -1;
}
.payment-modal-content{
position: relative;
}
.payment-modal-content:before{
content: '';
height: 100%;
width: 100%;
background-image: url(../images/loader.gif);
position: absolute;
z-index: 1;
top: 0;
left: 0;
background-color: #fff;
background-size: 100px;
background-repeat: no-repeat;
background-position: center;
opacity: 0;
pointer-events: none;
transition: .3s ease;
}
.payment-modal-content.isLoading:before{
opacity: 1;
pointer-events: all;
}
.payment-modal-content h1 {
color: #f02062;
font-family: "Roboto";
font-weight: 900;
overflow: hidden;
max-height: none;
transition: .3s ease;
}
.payment-modal-content h3 {
color: #f02062;
margin-bottom: 40px;
font-weight: 900;
font-size: 22px;
transition: .3s ease;
max-height: 0;
overflow: hidden;
}
.modal-text-wrapper{
font-size: 18px;
font-weight: 300;
color: #000;
}
.payment-modal-content .modal-text{
position: relative;
transition: .3s ease;
max-height: 500px;
overflow: hidden;
}
.payment-modal-content .modal-text:nth-child(2){
opacity: 0;
max-height: 0;
}
.modal-c-continue{
transition: .3s ease;
max-width: 0;
overflow: hidden;
max-height: 0;
padding: 0;
opacity: 0;
border: 0;
}
.payment-modal-content .modal-button {
margin-top: 35px;
}
.payment-modal-inner .modal-close{
background-image: url(../images/close_icon.png);
position: absolute;
right: 15px;
top: 10px;
height: 50px;
width: 50px;
background-size: 100%;
background-position: center center;
cursor: pointer;
}
/*LOGIN FORM*/
.login-form{
margin-top: 50px;
position: relative;
}
.login-form:before {
content: '';
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
background-color: #fff;
z-index: 1;
background-image: url(../images/loader.gif);
background-size: 40px;
background-repeat: no-repeat;
background-position: center;
opacity: 0;
pointer-events: none;
transition: .3s ease all;
}
.login-form.isLoading:before{
opacity: 1;
pointer-events: all;
}
.login-form > label{
font-size: 18px;
margin-bottom: 25px;
}
.login-form .f-pass{
color: #a6a6a6;
text-decoration: none;
font-weight: 400;
}
#login-msg{
color: red;
font-weight: 600;
font-size: 15px;
padding: 0px 15px 14px 15px;
display: inline-block;
max-height: 0;
opacity: 0;
pointer-events: none;
transition: .3s ease max-height;
overflow: hidden;
}
#login-msg.active{
opacity: 1;
pointer-events: auto;
max-height: initial;
}
#login-msg.not-active{
max-height: 0;
opacity: 0;
pointer-events: none;
}
.inner-dropdown {
list-style: none;
padding: 0;
height: auto;
width: 100%;
position: absolute;
background: #fff;
padding: 0px;
box-shadow: 0px 0px 20px rgba(0,0,0,.09);
font-size: 15px;
font-weight: 300;
border-top: 0px solid #ee0b58;
transform: translateY(10px);
max-height: 0;
pointer-events: none;
overflow: hidden;
opacity: 0;
transition: .3s ease;
}
.dropdown-active ~ .inner-dropdown{
opacity: 1;
max-height: initial;
pointer-events: all;
border-top: 3px solid #ee0b58;
padding: 15px;
}
.inner-dropdown li {
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
}
.inner-dropdown li a{
color: #ee0b58;
text-decoration: none;
cursor: pointer;
}
.form-control.invalid {
border-color: #ee0b58;
background-color: #ee0b580d;
}
#dropContainer > img.hasImage{
height: 150px;
width: auto;
}
.single-options.singModiOp{
padding-bottom: 15px;
position: relative;
}
.single-options.singModiOp.editing{
padding-bottom: 50px;
}
.isAdmin .single-options.singModiOp.editing{
padding-bottom: 75px;
}
.singModiOp .modifierItemPrice{
position: absolute;
bottom:15px;
left: 18px;
max-height: 0;
transition: .3s ease;
overflow: hidden;
}
.isAdmin .singModiOp .modifierItemPrice{
bottom:43px;
}
.singModiOp .modifierItemPrice.editable{
max-height: 30px;
}
.singModiOp .modifierItemPrice input ~ a {
color: #ee0b58;
font-weight: 500;
font-size: 12px;
pointer-events: none;
display: none;
}
.singModiOp .modifierItemPrice input, .singModiOp .itemKcal input{
border: 0px;
font-weight: 300;
margin: 0;
background: transparent;
border: 0;
box-shadow: none;
outline: none;
pointer-events: none;
transition: .3s all;
width: 50px;
padding: 0px;
}
.singModiOp .modifierItemPrice.editable input, .singModiOp .modifierItemPrice.editable ~ .itemKcal input{
pointer-events: all;
border-bottom: 1px solid;
width: 100px;
}
.singModiOp .itemKcal {
pointer-events: none;
position: absolute;
bottom: 13px;
opacity: 0;
}
.singModiOp .modifierItemPrice.editable ~ .itemKcal {
pointer-events: all;
position: absolute;
opacity: 1;
}
.singModiOp .modifierItemPrice{
cursor: pointer;
}
.single-modifier .specialOpt {
background: transparent;
margin-bottom: -12px;
padding-left: 20px;
padding-right: 20px;
padding-top: 20px;
display: flex;
position: absolute;
width: 100%;
z-index: 0;
left: 0;
right: 15px;
top: 85px;
left: -250px;
opacity: 0;
transition: .3s ease;
}
.single-modifier.gModEditing .specialOpt{
left: 0px;
opacity: 1;
z-index: 7;
}
.single-modifier .isModiGroupActive {
position: absolute;
top: 70px;
right: 24px;
z-index: 7;
opacity: 0;
pointer-events: none;
}
.single-modifier.gModEditing .isModiGroupActive {
opacity: 1;
pointer-events: all;
}
.item__modifier .modifier.item-modifier-header {
padding-bottom: 20px;
transition: .3s;
}
.item__modifier .gModEditing .modifier.item-modifier-header {
padding-bottom: 85px;
}
.single-modifier .specialOpt label:last-child{
margin-left: 15px;
}
.single-options.singModiOp .itemDef {
position: absolute;
left: 140px;
bottom: 2px;
max-height: 0;
overflow: hidden;
transition: .3s ease;
width: 103px;
}
.isAdmin .single-options.singModiOp .itemDef {
bottom: 25px;
}
.single-options.singModiOp .item__attr_link {
position: absolute;
bottom: 2px;
left: 20px;
color: #ee0a58;
font-size: 12px;
font-weight: 500;
cursor: pointer;
max-height: 30px;
overflow: hidden;
transition: .3s ease;
}
.single-options.singModiOp.editing .itemDef{
max-height: 30px;
pointer-events: all;
opacity: 1;
}
.single-options.singModiOp.editing .item__attr_link {
max-height: 0px;
pointer-events: none;
opacity: 0;
}
.alertbox.text-center.active ~ .item__attr_link {
opacity: 0;
pointer-events: none;
}
body::after{
content: '';
background-color: #fff;
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-image: url(../images/loader.gif);
background-repeat: no-repeat;
background-position: center;
background-size: 100px;
opacity: 0;
pointer-events: none;
transition: .9s ease-in;
}
body.isloading::after{
opacity: 1;
pointer-events: all;
z-index: 1;
}
body.order__web_view{
background: #efefef;
}
.tab-content, #sq_loc__modal .modal-content, .order__reject_modal .modal-content, #user__modal .modal-content, #user__add__modal .modal-content, #attr__modal .modal-content{
position: relative;
}
.tab-content:after,
#sq_loc__modal .modal-content:after,
#order__reject_modal .modal-content:after,
#business_hours_modal .modal-content:after,
#loading__modal .modal-content:after,
#order__modal .modal-content:after,
#pw_forgot__modal .modal-content:after,
#order__stockOut_modal .modal-content:after,
#user__modal .modal-content:after,
#user__add__modal .modal-content:after,
#attr__modal .modal-content:after,
.users-list-container:after{
content: '';
position: absolute;
height: 100%;
width: 100%;
background-color: #fff;
top: 0;
left: 0;
background-image: url(../images/loader.gif);
background-repeat: no-repeat;
background-position: center;
background-size: 50px;
opacity: 0;
pointer-events: none;
}
.tab-content.isLoading:after,
#sq_loc__modal.isloading .modal-content:after,
#order__reject_modal.isloading .modal-content:after,
#business_hours_modal.isloading .modal-content:after,
#loading__modal.isloading .modal-content:after,
#order__modal.isloading .modal-content:after,
#pw_forgot__modal.isloading .modal-content:after,
#order__stockOut_modal.isloading .modal-content:after,
#user__modal.isloading .modal-content:after,
#user__add__modal.isloading .modal-content:after,
#attr__modal.isloading .modal-content:after,
.users-list-container.isloading:after{
opacity: 1;
pointer-events: all;
}
.users-list-container:after{
background-color: rgba(255,255,255,.5);
}
.mod__group_header > p {
font-weight: 900;
font-size: 18px;
display: inline-block;
margin-bottom: 0;
}
.mod__group_header .mandLable{
opacity: 0;
pointer-events: none;
}
.mod__group_header .mandLable i {
font-style: normal;
color: #ee0b58;
}
.mod__group_header {
padding: 20px;
position: relative;
position: absolute;
top:0px;
width: 100%;
z-index: 1;
pointer-events: none;
}
.mod__group_header .status-show-icons{
display: flex;
position: absolute;
top: 20px;
right: 143px;
}
.mod__group_header .mult-select-icon {
height: 22px;
width: 45px;
background-image: url(../images/multi-tick.png);
background-size: 100% 100%;
opacity: 0;
display: none;
pointer-events: none;
}
.mod__group_header .visible-icon {
height: 25px;
width: 30px;
background-image: url(../images/not-visible.png);
background-size: 100% 100%;
opacity: 0;
pointer-events: none;
margin-right: 5px;
display: none;
}
.itemInitDetail .modiItemStatus {
position: absolute;
display: flex;
right: 8px;
top: 2px;
}
.itemInitDetail .tick-select-icon {
height: 22px;
width: 25px;
background-image: url(../images/tick.png);
background-size: 100% 100%;
opacity: 0;
display: none;
pointer-events: none;
margin-left: 5px;
}
.itemInitDetail .eye-visible-icon {
height: 25px;
width: 30px;
background-image: url(../images/not-visible.png);
background-size: 100% 100%;
opacity: 0;
display: none;
pointer-events: none;
}
.d-v{
opacity: 1!important;
pointer-events: all!important;
display: initial!important;
}
.itemInitDetail {
position: absolute;
width: calc(100% - 160px);
font-size: 18px;
font-weight: 100;
top: 19px;
}
.itemInitDetail span.p__ {
font-size: 82%;
color: #aa9d9d;
margin-left: 5px;
}
.itemInitDetail span.p__::before {content: '(';}
.itemInitDetail span.p__::after {content: ')';}
.single-options.singModiOp .isModiItemActive{
position: absolute;
bottom: 15px;
right: 25px;
}
.single-options.singModiOp .itemInitDetail ~ input, .single-options.singModiOp .isModiItemActive{
opacity: 0;
pointer-events: none;
}
.single-options.singModiOp .itemInitDetail ~ input.editable, .single-options.singModiOp .itemInitDetail ~ input.editable ~ .isModiItemActive{
opacity: 1;
pointer-events: all;
}
.single-options.singAttrItem .itemInitDetail ~ input.editable{
width: 100%;
}
.singModiOp.editing .itemInitDetail {
opacity: 0;
pointer-events: none;
}
.outletAttr.singModiOp.editing .itemInitDetail{
opacity: 1;
font-size: 13px;
}
.outletAttr.singModiOp.editing .itemInitDetail .p__{
opacity: 0;
}
.publish__venue {
position: absolute;
right: 25px;
display: flex;
top: 15px;
align-items: center;
font-size: 15px;
color: #8e8e8e;
font-weight: 400;
}
.create-venue-tab-header{
position: relative;
}
.publish__venue > p {
margin-bottom: 10px;
margin-right: 10px;
}
.inStock {
color: #b3b3b3;
margin-top: 12px;
}
.inStock > .switch {
margin-right: 5px;
}
/*REPORT*/
.report-wizard {
}
.report-wizard.step{
width: 490px;
background: #fff;
padding: 30px;
border: 1px solid #b7b7b7;
}
.rpt-wiz-btn {
display: flex;
justify-content: space-between;
}
.wizard-inner {
width: 100%;
}
.wizard-inner .single-wizard {
opacity: 0;
pointer-events: none;
height: 0;
transition: .3s ease;
}
.single-wizard.active{
opacity: 1;
pointer-events: all;
height: auto;
}
.wizard-inner .single-wizard .radio-container {
font-weight: 300;
margin-right: 10px;
}
.wizard-inner .single-wizard p {
padding: 0px 15px;
font-size: 16px;
font-weight: 700;
font-family: 'Roboto',sans-serif;
margin-bottom: 7px;
width: 100%;
}
.sd-ed .col-sm-6.left{
padding-right: 7px;
}
.sd-ed .col-sm-6.right {
padding-left: 8px;
}
.sd-ed .col-sm-6.right input ~ label,
.sd-ed .col-sm-6.right select ~ label{
left: 24px;
}
input.dt {
background: #F1F1F1;
pointer-events: none;
}
.single-wizard .mail__address,
.report-box .mail__address {
background: #f1f1f1;
padding: 15px;
color: #b3acac;
font-weight: 300;
font-size: 14px;
border: 1px solid #ced4da;
}
.single-wizard span.add_email,
.report-box span.add_email{
font-size: 13px;
font-weight: 900;
color: #ee0b58;
display: inline-block;
margin-top: 7px;
}
.date-range ul {}
.date-range {
margin: 0;
padding: 0;
list-style: none;
display: flex;
flex-wrap: wrap;
}
.date-range li {
background: transparent;
border: 1px solid #BFBFBF;
border-radius: 15px;
padding: 2px 10px;
font-size: 13px;
font-weight: 600;
color: #ACACAC;
margin-right: 5px;
cursor: pointer;
transition: .2s ease;
}
.date-range li:hover {
background: #ee0b58;
color: #fff;
border-color: #fff;
}
.date-range li.active {
background: #ee0b58;
color: #fff;
border-color: #ee0b58;
}
.report-box{
border: 1px solid #b7b7b7;
padding: 30px;
background: #fff;
align-self: flex-start;
}
.report-box .form-group > p {
padding: 0px 15px;
font-size: 16px;
font-weight: 700;
font-family: 'Roboto',sans-serif;
margin-bottom: 7px;
width: 100%;
}
.report-box .radio-container{
margin-right: 10px;
}
.box-in, .box-sc{
max-height: 0;
opacity: 0;
transition: .3s ease;
}
.box-in.active, .box-sc.active{
opacity: 1;
max-height: 600px;
}
.report-box.main-box {
margin-right: 20px;
position: relative;
}
.report-box.main-box:before {
content: '';
background: #ee0b58;
height: 30px;
width: 30px;
position: absolute;
right: -13px;
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
background-image: url(../images/icon-right.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 8px auto;
}
.box-sc .selected-freq {
color: #acacac;
margin-top: 5px;
font-weight: 600;
font-size: 13px;
}
.dtValidError, .scValidError, .validError{
padding: 7px 15px;
margin-left: 15px;
color: #ee0b58;
font-weight: 700;
border: 1px solid;
margin-top: 7px;
max-height: 0px;
overflow: hidden;
padding-top: 0px;
padding-bottom: 0px;
opacity: 0;
transition: .3s ease;
}
.dtValidError.active, .scValidError.active, .validError.active{
max-height: 40px;
padding-top: 7px;
padding-bottom: 7px;
opacity: 1;
}
.scReportList{
background: #fff;
border: 1px solid #b7b7b7;
padding: 30px;
overflow-x: auto;
}
.scReportList > .table{
border: 1px solid #dee2e6;
min-width: 500px;
}
.formScEditLink {
display: inline-block;
}
#staffTable{
overflow: hidden;
max-height: 0;
transition: .3s ease;
pointer-events: none;
}
#staffTable.active{
margin-top: 15px;
margin-bottom: 15px;
max-height: 97px;
pointer-events: all;
overflow-y: scroll;
}
form.formStaffEditLink {
display: inline-block;
float: left;
margin-right: 5px;
}
#allowSortMenuOrder{
position: absolute;
right: 75px;
top: 20px;
font-size: 15px;
font-weight: 600;
text-transform: uppercase;
color: #000;
background-image: url(../images/list-alt.png);
background-size: 24px;
background-repeat: no-repeat;
padding-left: 30px;
padding-top: 2px;
cursor: pointer;
}
.modifier.sub-category-header {
position: relative;
}
.modifier.sub-category-header:before {
content: '';
position: absolute;
top: 26px;
left: -10px;
height: 24px;
width: 24px;
background-image: url(../images/sort-menu-icon.png);
background-repeat: no-repeat;
background-size: 100% 100%;
opacity: 0;
transition: .3s ease;
}
.modifier.sub-category-header{
transition: .3s ease;
}
.tab-content-step.active.sorting .modifier.sub-category-header {
padding-left: 45px;
cursor: grab;
}
.tab-content-step.active.sorting .modifier.sub-category-header:before {
left: 15px;
opacity: 1;
}
.tab-content-step.active.sorting .button-list{
opacity: 0;
pointer-events: none;
}
.menu-builder .tab-content-step.active.sorting .create-link, .menu-builder .tab-content-step.active.sorting .create-sub-category-link a, .tab-content-step.active.sorting .create-sub-category-link{
opacity: .5;
pointer-events: none;
}
.menu-builder .main .modifier-options .single-options{
position: relative;
}
.menu-builder .tab-content-step.active .single-options{
transition: padding .3s ease ;
}
.menu-builder .tab-content-step.active.sorting .single-options {
padding-left: 45px;
cursor: grab;
}
.menu-builder .main .modifier-options .single-options:before{
content: '';
position: absolute;
top: 17px;
left: -10px;
height: 18px;
width: 18px;
background-image: url(../images/sort-menu-icon.png);
background-repeat: no-repeat;
background-size: 100% 100%;
opacity: 0;
transition: .3s ease;
}
.menu-builder .tab-content-step.active.sorting .main .modifier-options .single-options:before{
left: 18px;
opacity: 1;
}
.tab-content-step.active.sorting .inStock{
opacity: .5;
pointer-events: none;
}
.menu-builder .tab-content .item-modifier{
transition: max-height .3s ease;
}
.menu-builder .tab-content.sc-dragging .item-modifier{
max-height: 79px;
overflow:hidden;
}
.tab-content-step.active.sorting .item-modifier{
-ms-user-select: none; /* IE 10+ */
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
user-select: none;
}
.staffBox {
border: 1px solid #b7b7b7;
padding: 30px;
background: #fff;
align-self: flex-start;
}
.staffBox .form-group > p {
padding: 0px 15px;
font-size: 16px;
font-weight: 700;
font-family: 'Roboto',sans-serif;
margin-bottom: 7px;
width: 100%;
}
#staffList {
border: 1px solid #b7b7b7;
padding: 30px;
background: #fff;
margin-left: 20px;
}
#staffList table{
margin-bottom: 0px;
}
#staffList .isLoading{
background-image: url(../images/loader.gif);
background-size: 24px;
background-repeat: no-repeat;
background-color: #fff;
background-position: center center;
}
/*ORDER PAGE*/
.order-summary-info {
position: relative;
margin-bottom: 50px;
}
.order-summary-info::after{
content: '';
background-color: #fff;
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-image: url(../images/loader.gif);
background-repeat: no-repeat;
background-position: center;
background-size: 100px;
opacity: 0;
pointer-events: none;
}
.order-summary-info.isloading::after{
opacity: 1;
pointer-events: all;
}
.order-summary-info .order-summary p {
font-size: 14px;
font-weight: 500;
font-family: 'Roboto',sans-serif;
margin-bottom: 0px;
width: 100%;
color: #C0C0C0;
}
.order-summary-info .order-summary {
background: #fff;
padding: 37px 15px 37px 20px;
border-radius: 15px;
}
.order-summary-info .order-summary h1 {
font-weight: 600;
color: #000;
font-size: 34px;
letter-spacing: -1px;
margin-bottom: 0px;
position: relative;
}
.order-summary-info .order-summary h1 span {
position: absolute;
font-size: 22px;
right: 0;
bottom: 3px;
}
.order-summary-info .order-summary h1 span.increase {
color: #34A951;
}
.order-summary-info .order-summary h1 span.decrease {
color: #D54C4C;
}
.order-in-progress {
}
.order-in-progress .single-order {
background: #fff;
padding: 0px;
margin-bottom: 30px;
border-radius: 10px;
overflow: hidden;
}
.order-in-progress.grid-view-order .in-progess-orders .single-order .grid-view,
.order-in-progress.grid-view-order .ready_to_serve-orders .single-order .grid-view{
padding-top: 50px;
}
.list-view-order .single-order {
margin-bottom: 0px;
}
.grid-view-order .single-order {
height: 330px;
position: relative;
cursor: pointer;
}
.grid-view-order .single-order::after, #edit-item-form::after ,#create-item-form::after {
content: '';
height: 100%;
width: 100%;
background-color: rgba(0,0,0,.5);
position: absolute;
top: 0;
left: 0;
z-index: -1;
background-image: url(../images/loader_round.gif);
background-size: 30px 30px;
background-repeat: no-repeat;
background-position: center;
opacity: 0;
pointer-events: none;
}
#edit-item-form::after, #create-item-form::after {
background-color: rgba(255,255,255,.5);
pointer-events: all;
}
#edit-item-form.isSpin, #create-item-form.isSpin{
pointer-events: none;
}
.grid-view-order .single-order.isSpin::after, #edit-item-form.isSpin::after, #create-item-form.isSpin::after {
opacity: 1;
pointer-events: all;
z-index: 2;
}
.single-order .more-item-button {
position: absolute;
height: 30px;
background: #e0e0e0;
bottom: 0;
width: 100%;
text-align: center;
line-height: 0px;
display: none;
cursor: pointer;
text-indent: -9999px
}
.single-order .more-item-button:before{
content: '';
position: absolute;
height: 20px;
width: 20px;
background-image: url(../images/expand.png);
left: 50%;
top: 12px;
background-repeat: no-repeat;
}
.single-order .more-item-button.expand{
}
.single-order .more-item-button.expand:before{
background-image: url(../images/collapse.png);
}
.single-order.hasMoreItem.isFloatActive {
position: absolute;
width: calc(100% - 30px);
height: auto;
z-index: 13;
padding-bottom: 30px;
}
.grid-view-order .single-order.hasMoreItem .more-item-button{
display: block;
}
.single-order .list-view{
display: none;
}
.list-order-view .list-view{
display: block;
}
.info {}
.order-in-progress .single-order .info,
.modal-body .single-order .info{
overflow: hidden;
}
.modal-body .single-order .info .basic,
.order-in-progress .single-order .info .basic {
float: left;
}
.order-in-progress .single-order .info .btn.btn-fetch.xr{
float: right;
display: inline-block;
}
.modal-body .single-order .info select{
width: auto;
float: right;
display: inline-block;
font-size: 13px;
background-size: 12px;
padding-right: 30px;
}
.order-in-progress .single-order .info .basic p,
.modal-body .single-order .info .basic p {
font-size: 14px;
color: #8e8e8e;
font-weight: 500;
margin-bottom: 5px;
}
#order__modal th.row {
margin: 0;
margin-right: 15px;
}
table.total__order_value {
width: 100%;
border-top: 1px solid #d9d9d9;
margin-top: 10px;
}
table.total__order_value tr td {
padding-top: 10px;
}
.modal-body .single-order .data{
border: 0;
padding: 0px 0px;
border-radius: 0px;
margin-top: 10px;
border-top: 1px solid #d9d9d9;
margin-top: 15px;
padding-top: 5px;
}
.modal-body .single-order table{
margin-bottom: 0;
}
.modal-body .single-order .table td, .modal-body .single-order .table th,
.single-order .grid-view .table td, .single-order .grid-view .table th {
border-top: 0;
padding: 7px 0px;
}
#order__modal .total__order_value p {
font-size: 17px;
font-weight: 400;
}
#order__modal .total__order_value p b {
font-weight: 700;
}
.modal-body .single-order .table tr {
border-bottom: 0px solid #dee2e6;
}
.order-in-progress .single-order .stat {overflow: hidden;margin-top: 15px}
.order-in-progress .single-order .stat .single-stat {
width: 50%;
float: left;
border: 1px solid #e4e4e4;
padding: 15px;
}
.order-in-progress .single-order .stat .single-stat:last-child {
border-left: 0;
}
.order-in-progress .single-order .stat .single-stat p {
font-weight: 500;
margin-bottom: 3px;
}
.order-in-progress .single-order .stat .single-stat h3 {
color: #ee0a58;
font-size: 22px;
margin-top: 5px;
margin-bottom: 0;
}
.order-in-progress .single-order .stat .single-stat h3.time {
color: #6ceb4c;
}
.order-seg {
padding-top: 40px;
padding-bottom: 5px;
}
section.main-dashboard.order-dash {
}
.order-filter-list {
list-style: none;
padding: 0;
margin: 0;
display: inline-block;
background: #E7E7E7;
width: auto;
border-radius: 25px;
padding: 5px;
font-size: 13px;
position: absolute;
right: 0;
bottom: 0px;
}
ul.order-filter-list.freq-sort {
bottom: -8px;
}
.order-filter-list li {
float: left;
padding: 3px 15px;
border-radius: 50px;
font-weight: 400;
cursor: pointer;
}
.order-filter-list li.active {
background-color: #777777;
color: #fff;
}
.order__web_view .page-header-content {
background: transparent;
}
.order__web_view .page-header-content .page-header.toggleActiveQ {
background: #fff;
padding: 30px;
border-radius: 15px;
margin-top: 15px;
margin-bottom: 15px;
}
.order__web_view .page-header-content .page-header.toggleActiveQ .p-black {
font-weight: 600;
font-size: 15px;
letter-spacing: .2px;
}
.order__web_view .isTakingOrder {
font-weight: 500;
}
.order__web_view .isTakingOrder .switch {
top: 1px;
}
.single-attr-add {
font-size: 18px;
font-weight: 900;
padding: 20px 15px;
border-bottom: 1px solid #dbd5d5;
color: #ee0a58;
text-decoration: none;
display: block;
padding-left: 0;
text-decoration: none;
}
.single-attr-add:hover {
color: #ee0a58;
text-decoration: none;
}
.item-modifier.modifier-options.item__attr {
border-top: 1px solid #ddd;
}
.create-attr-box .group-input{
width: 50%;
float: left;
}
.create-attr-box .group-input:first-child{
padding-right: 3px;
}
.create-attr-box .group-input:last-child{
padding-left: 3px;
}
.create-attr-box .group-input input{
padding: 15px;
}
.create-attr-box .group-input input ~ label{
left: 15px;
}
.item__attr ~.single-modifier-add-item {
margin-left: -15px;
}
.single-options.singAttrItem.singModiOp.editing {
padding-bottom: 30px;
}
#attr__modal .item__attr {
margin: 0;
border-top: 0;
}
#attr__modal .single-modifier-add-item {
margin: 0;
}
#attr__modal .create-attr-box .group-input input ~ label {
font-size: 14px;
}
#attr__modal .create-modifier-textbox.create-attr-box {
background: #fff;
overflow: hidden;
}
/*Provider Attributes*/
.zonal-provider-header {
background: #EFEFEF;
font-weight: 900;
font-size: 18px;
padding: 20px;
cursor: pointer;
position: relative;
}
.zonal-modifier-add-item {
overflow: hidden;
margin-left: -15px;
}
.isSubCatActive {
position: absolute;
right: 300px;
top: 30px;
}
.isMainCatActive {
position: absolute;
right: 361px;
top: 26px;
}
.tab-content-step.active.sorting .isSubCatActive{
opacity: 0;
}
#orders-container{
position: relative;
}
#orders-container:before {
content: '';
background-color: rgba(0,0,0,.6);
position: fixed;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-repeat: no-repeat;
background-position: center;
opacity: 0;
pointer-events: none;
z-index: 12;
}
body.expandedOrder #orders-container:before {
opacity: 1;
pointer-events: all;
}
body.expandedOrder #orders-container.f-screen{
overflow: hidden;
}
#orders-container.f-screen {
position: fixed;
width: 100vw;
height: 100vh;
top: 0;
z-index: 11;
padding: 0 30px;
overflow-x: scroll;
}
.page-load-status {
display: none; /* hidden by default */
padding-top: 20px;
border-top: 1px solid #DDD;
text-align: center;
color: #777;
}
.toast{
max-width: 100%;
}
p.modalModiData {
font-size: 95%;
color: #000;
font-weight: 500;
margin-bottom: 0;
}
p.mainItem {
font-weight: 700;
font-size: 17px;
margin-bottom: 0;
}
.item__price {
text-align: revert;
padding-right: 0px!Important;
font-size: 17px;
}
/*ORDERSV*/
.list-view-order{
margin-left: 0px;
margin-right: 0;
border-radius: 10px;
padding: 0 30px;
background: #fff;
}
.list-view-order .grid-view {
display: none;
}
.list-view-order .order-wrapper {
width: 100%!important;
flex: 0 0 100%;
max-width: 100%;
}
.list-view-order .single-order > .list-view {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
.list-view-order .single-order > .list-view .left__ {
flex-basis: 33.33%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
.list-view-order .single-order > .list-view .right__ {
flex-basis: 33.33%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
.list-view-order .single-order > .list-view .right__ .single__item:nth-child(1) {
flex-basis: 33.33%;
}
.list-view-order .single-order > .list-view .right__ .single__item {
}
.list-view-order .single-order > .list-view .left__ .order, .list-view-order .single-order > .list-view .left__ .name {
font-weight: 400;
margin-bottom: 0;
font-size: 15px;
margin-bottom: -4px;
}
.list-view-order .single-order > .list-view .left__ .name{
font-weight: 700;
}
.list-view-order .single-order > .list-view .single__item p {
margin: 0;
}
.list-view-order .single-order > .list-view .single__item p.item_count, .list-view-order .single-order > .list-view .single__item p.item_price, .list-view-order .single-order > .list-view .single__item p.picked {
font-weight: 700;
}
.list-view-order .single-order > .list-view .left__ .single__item:nth-child(1) {
flex-basis: 60%;
}
.list-view-order .single-order > .list-view .single__item p.placed {
color: #808080;
font-size: 13px;
font-weight: 400;
}
.list-view-order .single-order {
padding: 15px 0px;
border-bottom: .5px solid #dcdcdc;
border-radius: 0;
}
.list-view-order .order-wrapper:last-child .single-order {
border-bottom: 0px;
}
.list-view-order .single-order > .list-view .right__ .single__item:nth-child(2), .list-view-order .single-order > .list-view .right__ .single__item:nth-child(3) {
text-align: center;
}
.list-view-order .single-order > .list-view .single__item p {
margin: 0;
}
.list-view-order .single-order > .list-view .single__item .btn-fetch {
font-weight: 300;
font-size: 14px;
width: 115px;
}
.list-view-order .single-order > .list-view .single__item .btn-fetch.btn-alt {
font-weight: 600;
}
.list-view-order .single-order > .list-view .single__item p.right-arrow {
background-image: url(../images/arrow-right-grey.png);
display: block;
height: 18px;
background-repeat: no-repeat;
background-position: right;
width: 25px;
background-size: auto 100%;
}
#order__modal .close-btn {
text-indent: -9999px;
height: 30px;
width: 30px;
background-color: #a2a2a2;
border-radius: 3px;
background-size: 12px;
background-repeat: no-repeat;
background-position: center center;
margin-left: -17px;
background-image: url(../images/close_white_icon.png);
}
#order__modal .info {display: flex;flex-wrap: wrap;align-content: center;justify-content: space-between;align-items: flex-start;}
#order__modal .modal-body .single-order .info .basic .cust-name, #order__modal .modal-body .single-order .info .order-info .pick-time span {
font-size: 17px;
font-weight: 700;
letter-spacing: -.05em;
}
.single-order .info .order-info .pick-time{
font-size: 17px;
}
#order__modal .modal-body .single-order .info p {
color: #000;
font-weight: 400;
margin-bottom: 0;
}
#order__modal .modal-content {
padding: 40px;
}
#order__modal .modal-body .single-order .info p.visit-info {
background: #F2CDDD;
color: #ee0a58;
padding: 3px 20px;
border-radius: 7px;
margin-top: 4px;
font-weight: 600;
font-size: 13px;
display: none;
}
#order__modal .modal-body .single-order .item__qty, .single-order .grid-view .item__qty{
width: 30px;
height: 30px;
background: #B7B7B7;
display: block;
text-align: center;
line-height: 30px;
color: #fff;
border-radius: 6px;
}
#order__modal .btn-save-attr {
margin-left: 15px;
margin-right: 15px;
border-radius: 10px;
font-weight: 500;
font-size: 15px;
padding: 15px 15px;
}
.toggleLinks li {
width: 50px;
height: 20px;
background-repeat: no-repeat;
background-position: center;
background-size: 13px;
transition: .3s ease-in;
}
#toggleFullScreen{
background-image: url(../images/full-screen.png);
}
#toggleFullScreen.f-screen{
background-image: url(../images/exit-full-screen.png);
}
#toggleGridView{
background-image: url(../images/grid-view.png);
}
#toggleGridView.active{
background-image: url(../images/grid-view-white.png);
}
#toggleListView{
background-image: url(../images/list-view.png);
}
#toggleListView.active{
background-image: url(../images/list-view-white.png);
}
.grid-view-order .info.banner-order {
background: #E0E0E0;
padding: 15px;
}
.grid-view-order .info.banner-order .__left {
flex-basis: 30%
}
.grid-view-order .info.banner-order .__right {
text-align: right;
flex-basis: 70%;
}
.grid-view-order .info.banner-order .basic {
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.grid-view-order .info.banner-order .basic p{
color: #000;
font-size: 14px;
font-weight: 400;
margin-bottom: 0px;
}
.grid-view-order .info.banner-order .basic p.cust-name,.grid-view-order .info.banner-order .basic p.pick-time span {
font-size: 16px;
font-weight: 700;
}
.grid-view-order .info.banner-order .basic p.cust-name,.grid-view-order .info.banner-order .basic p.pick-time{
margin-bottom: -3px;
}
.grid-view-order .info.banner-order .basic p.pick-time{
font-size: 16px;
}
.grid-view .order-data {
padding: 10px 10px;
}
.single-order .grid-view .table {
margin: 0;
}
#order-progress{
overflow: hidden;
margin-bottom: 61px;
}
#order-progress.grid-view-order{
padding-top: 15px;
}
#order-progress.grid-view-order{
min-height: 600px;
}
.orders-list{
width: 100%;
display: none;
flex-direction: row;
flex-wrap: wrap;
align-content: flex-start;
}
#orderToggleStat {
list-style: none;
margin: 0;
padding: 0;
pointer-events: none;
}
#orderToggleStat li {
font-size: 15px;
font-weight: 500;
float: left;
margin-right: 30px;
position: relative;
cursor: pointer;
}
#orderToggleStat li:before {
content: '';
position: absolute;
height: 2px;
width: 100%;
background: #ee0a58;
bottom: -10px;
opacity: 0;
}
#orderToggleStat li.active {
color: #ee0a58;
}
#orderToggleStat li.active:before {
opacity: 1;
}
.grid-view-order .highlighted .info.banner-order {
background: #ee0a58;
}
.grid-view-order .highlighted .info.banner-order .basic p {
color: #fff;
}
ul.orderStatBtn {
list-style: none;
margin: 0;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
background: #ffff;
width: 100%;
position: absolute;
top: 0px;
left: 0;
padding: 10px;
box-shadow:0px 0px 15px rgba(0,0,0,.07);
cursor: default;
}
ul.orderStatBtn li{
display: flex;
font-weight: 600;
flex-wrap: nowrap;
align-items: center;
cursor: pointer;
}
ul.orderStatBtn .icon{
height:30px;
width:30px;
border-radius:50%;
background-size: 18px 18px;
background-repeat: no-repeat;
background-position: center center;
}
ul.orderStatBtn .rejectOrder .icon{
background-color:#EC1C1C;
background-image: url(../images/cross.png);
background-size: 22px 22px;
margin-left: 7px;
}
ul.orderStatBtn .completeOrder .icon{
background-color:#29CF55;
background-image: url(../images/complete.png);
margin-right: 7px;
}
.single-order .grid-view .rejectOrder {
}
#order__modal .modal-header-btn {
display: flex;
justify-content: space-between;
}
#itemRanStock .main-item {
border: 1px dashed #ddd;
padding:7px 15px;
margin-bottom: 10px;
}
#itemRanStock .main-item .child-items {
margin-left: 32px;
}
#outStockIcon{
background-image: url(../images/out_stock.png);
height: 70px;
width: 70px;
background-size: 60%;
background-repeat: no-repeat;
background-position: center;
position: relative;
top: 3px;
cursor: pointer;
position: fixed;
top: 40%;
left: 10px;
background-color: #fff;
border-radius: 50%;
box-shadow: 0px 7px 15px rgb(0 0 0 / 10%);
z-index: 12;
}
#outStockIcon span {
position: absolute;
bottom: -6px;
background: #ee0b58;
height: 18px;
width: 18px;
border-radius: 50px;
text-align: center;
line-height: 18px;
font-weight: 700;
color: #ffffff;
right: 7px;
font-size: 11px;
}
#outStockIcon span.hide{
opacity: 0;
}
#order__stockOut_modal .checkbox-container {
margin-bottom: 0px;
}
.pink-background-class {
border: 2px solid #bd0357!important;
}
.red-background-class {
border: 2px dashed #bd0357!important;
}
.businessHrsTable, .orderSlotsTable{
width: auto;
margin-right: 15px;
}
.businessHrs .form-group,
.orderSlots .form-group{
margin-bottom: 0;
}
.business_hr_del_icon, .order_slot_del_icon {
position: absolute;
right: -20px;
top: 10px;
background-color: #ee0b58;
width: 20px;
height: 20px;
background-image: url(../images/close_white_icon.png);
background-repeat: no-repeat;
background-position: center;
border-radius: 50%;
background-size: 50%;
cursor: pointer;
}
.addBusinessHrsMoreBtn, .addOrderSlotsMoreBtn, .addOutletOrderTypeLocationBtn {
font-weight: 600;
color: #ee0b58;
cursor: pointer;
}
.businessHrs .form-group .form-control,
.orderSlots .form-group .form-control{
padding: 5px 15px;
text-align: center;
font-size: 14px;
}
#order_slots_modal .modal-dialog{
max-width: 600px;
}
.errorPwMsg{
height: 0;
overflow: hidden;
transition: .3s ease-in max-height;
color: red;
font-weight: bold;
opacity: 0;
margin: 0;
}
.errorPwMsg.vs{
max-height: 30px;
opacity: 1;
padding-bottom: 15px;
height: auto;
}
.pp-box{
position: relative;
}
.report-box.main-box.pp-box:before{
content: '';
position: absolute;
background-color: #fff;
height: 100%;
width: 100%;
z-index: 1;
border-radius: 0;
left: 0;
right: 0;
background-image: url(../images/loader.gif);
background-size: 50px;
opacity: 0;
pointer-events: none;
transition: .3s ease;
}
.report-box.main-box.pp-box.active:before{
opacity: 1;
pointer-events: all;
}
button.btn.btn-fetch.xs.btn-reject {
font-size: 13px;
padding-left: 15px;
padding-right: 15px;
font-weight: 500;
margin-right: -15px;
padding: 0px 15px;
}
#authSqrBtn, #uploadMenuBtn{
display: none;
pointer-events: none;
}
#norMalMenu.disable{
display: none;
pointer-events: none;
}
#authSqrBtn.enable{
display: inline-block;
pointer-events: all;
}
#revokeAuth, #btnSquareLocation, #syncSqMenu, #configAttr{
display: none;
pointer-events: none;
}
#revokeAuth.enable, #uploadMenuBtn.enable, #btnSquareLocation.enable, #syncSqMenu.enable, #configAttr.enable{
display: block;
pointer-events: all;
}
#menu__modal .modal-content:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
background-color: #fff;
z-index: 1;
background-image: url(../images/loader.gif);
background-repeat: no-repeat;
background-size: 80px;
background-position: center;
opacity: 0;
pointer-events: none;
transition: .3s ease;
}
#menu__modal.loading .modal-content:before {
opacity: 1;
pointer-events: all;
}
button.owl-dot button {}
button.owl-dot {
height: 15px;
width: 15px;
border-radius: 50%;
margin: 3px;
border: 3px solid #EE0A58!important;
}
button.owl-dot.active {
background-color: #ee0b58!important;
}
.owl-dots {
text-align: center;
padding-top: 10px;
}
/*SHIMMER EFFECT*/
.shimmer-div{
width: 100%;
margin-top: 30px;
margin-bottom: 30px;
}
.grid-view-order .shimmer-div{
margin-top: 0px;
}
.shine {
background: #f6f7f8;
background-image: linear-gradient(to right, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
background-repeat: no-repeat;
background-size: 1920px 300px;
display: inline-block;
position: relative;
-webkit-animation-duration: 1s;
-webkit-animation-fill-mode: forwards;
-webkit-animation-iteration-count: infinite;
-webkit-animation-name: placeholderShimmer;
-webkit-animation-timing-function: linear;
}
.grid-view-order .shine {
background-color: #ffffff;
background-image: linear-gradient(to right, #ffffff 0%, #eeeeee 20%, #ffffff 40%, #ffffff 100%);
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
.photo {
display: block!important;
width: 100%;
height: 60px;
margin-bottom: 15px;
}
.grid-view-order .photo {
display: block!important;
height: 300px;
margin-bottom: 15px;
float: left;
margin-right: 15px;
margin-left: 15px;
}
.photo:last-child {
margin-bottom: 0px;
}
@-webkit-keyframes placeholderShimmer {
0% {
background-position: -468px 0;
}
100% {
background-position: 468px 0;
}
}
/*SEARCH FORM*/
.search-field {
width: 400px;
position: absolute;
left: 50%;
top: 5px;
transform: translateX(-50%) translateX(20px);
background: #d7d7d7;
padding: 2px;
border-radius: 50px;
pointer-events: none;
}
.search-field .form-control {
border: 0px;
border-radius: 50px;
padding-left: 15px;
padding-right: 15px;
font-size: 14px;
padding: 19px 30px;
font-weight: 500;
color: #000;
}
.search-field .close__icon_search {
height: 41px;
width: 41px;
background: #ee0b58;
position: absolute;
right: 0;
top: 0;
border-top-right-radius: 50px;
border-bottom-right-radius: 50px;
background-image: url(../images/close_white_icon.png);
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
#noSearchMatch{
width: 100%;
padding: 15px;
text-align: center;
background: #fff;
font-size: 17px;
font-weight: 600;
color: #ee0b58;
display: none;
pointer-events: none;
}
#noSearchMatch.enable{
display: block;
max-height: 55px;
}
.loadCorderMore {
margin-top: 10px;
margin-bottom: 10px;
width: 100%;
display: block;
text-align: center;
}
h1.text-center.noResFound {
width:100%;
font-size:24px;
font-weight:bold;
color:#ee0b58;
}
/*RESPONSIVE*/
@media (min-width: 640px){
.order-wrapper{
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.grid-view-order .photo {
width: calc(50% - 30px);
}
}
@media (min-width: 980px){
.order-wrapper{
-ms-flex: 0 0 33.33%;
flex: 0 0 33.33%;
max-width: 33.33%;
}
.grid-view-order .photo {
width: calc(33.33% - 30px);
}
}
@media (min-width: 1120px){
.order-wrapper{
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.grid-view-order .photo {
width: calc(25% - 30px);
}
}
@media (min-width: 1366px){
.order-wrapper{
-ms-flex: 0 0 20%;
flex: 0 0 20%;
max-width: 20%;
}
.grid-view-order .photo {
width: calc(20% - 30px);
}
}
@media (min-width: 1920px){
.order-wrapper{
-ms-flex: 0 0 16.66%;
flex: 0 0 16.66%;
max-width: 16.66%;
}
.grid-view-order .photo {
width: calc(16.66% - 30px);
}
}
@media (min-width: 2200px){
.order-wrapper{
-ms-flex: 0 0 14.28%;
flex: 0 0 14.28%;
max-width: 14.28%;
}
.grid-view-order .photo {
width: calc(14.28% - 30px);
}
}
@media (min-width: 2500px){
.order-wrapper{
-ms-flex: 0 0 12.25%;
flex: 0 0 12.25%;
max-width: 12.25%;
}
.grid-view-order .photo {
width: calc(12.25% - 30px);
}
}
@media (min-width: 3000px){
.order-wrapper{
-ms-flex: 0 0 11.11%;
flex: 0 0 11.11%;
max-width: 11.11%;
}
.grid-view-order .photo {
width: calc(11.11% - 30px);
}
}
@media (min-width: 3500px){
.order-wrapper{
-ms-flex: 0 0 10%;
flex: 0 0 10%;
max-width: 10%;
}
.grid-view-order .photo {
width: calc(10% - 30px);
}
}
@media screen and (min-width: 640px) {
.login-form{
width: 400px;
margin: auto;
margin-top: 50px;
}
}
@media screen and (max-height: 750px) {
}
@media screen and (max-width: 1200px) {
.single-venue-item {
width: 50%;
}
.order-summary-info .order-summary h1 small {
float: none;
display: block;
text-align: center;
}
.order-summary-info .col-lg-3:nth-child(1),
.order-summary-info .col-lg-3:nth-child(2){
margin-bottom: 30px;
}
.search-field {
top: 45px;
}
.order-seg {
margin-top: 40px;
}
}
@media screen and (max-width: 991px) {
#navbar{
text-align: center;
}
.site-header-dashboard .navbar-nav{
margin: 0;
display: inline-block;
}
.site-header-dashboard .navbar-nav.navbar-left{
display: block;
width: 100%;
}
#navbar{
transition: .3s;
}
.navbar-collapse {
}
.collapse:not(.show) {
}
.payment-modal-inner{
width: 700px;
}
.modal-button .btn{
clear: both;
}
}
@media screen and (max-width: 767px) {
.tab-step-info{
margin-top: 20px;
margin-bottom: 30px;
}
.create-venue-tab, .build-menu-tab{
width: 100%;
}
.pl40{
padding-right: 40px;
}
.create-venue-tab-content{
position: relative;
}
.create-venue-tab-content:after,
.build-menu-tab-content:after{
content: '';
height: 100%;
width: 100%;
position: absolute;
top: 0;
left:0;
background: #fff;
z-index: 0;
opacity: 0;
pointer-events: none;
transition: .3s ease all;
}
.mobile-menu-active .create-venue-tab-content:after,
.mobile-menu-active .build-menu-tab-content:after{
z-index: 3;
opacity: .5;
pointer-events: all;
}
.create-venue-tab-content .tab-header-wrapper, .build-menu-tab-content .tab-header-wrapper{
position: absolute;
transform: translateX(-200px);
transition: .3s ease;
overflow: visible;
z-index: 5;
box-shadow: 3px 0px 30px rgba(0,0,0,.07);
height: 100%;
background: #efefef;
}
.create-venue-tab-content .tab-header{
height: 100%;
overflow-y: scroll;
}
.build-menu-tab-content .tab-header{
height: calc(100% - 74px);
overflow-y: scroll;
}
.mobile-menu-active .tab-header-wrapper {
transform: translateX(0px);
}
.create-venue-tab-content .tab-content, .build-menu-tab-content .tab-content{
width: 100%;
padding-right: 15px;
padding-left: 15px;
padding-top: 60px;
}
.create-venue-tab-content{
position: relative;
overflow: hidden;
}
.create-venue-tab-content .tab-header-wrapper .tab-header-menu-icon,
.build-menu-tab-content .tab-header-wrapper .tab-header-menu-icon{
background: #ee0a58;
height: 35px;
width: 35px;
right: -35px;
top: 0px;
position: absolute;
}
.create-venue-tab-content .tab-header-wrapper .tab-header-menu-icon:before,
.build-menu-tab-content .tab-header-wrapper .tab-header-menu-icon:before{
content: '';
height: 100%;
width: 100%;
background-image: url(../images/icon-right.png);
position: absolute;
top: 0;
left: 0;
background-repeat: no-repeat;
background-position: center;
transition: .6s ease;
}
.mobile-menu-active .create-venue-tab-content .tab-header-wrapper .tab-header-menu-icon:before,
.mobile-menu-active .build-menu-tab-content .tab-header-wrapper .tab-header-menu-icon:before{
transform: rotate(-180deg);
}
.site-footer{
position: relative;
}
.create-venue-tab-content .tab-content-wrapper{
height: auto;
}
.create-venue-tab-content .tab-header li{
padding: 12px 0px;
padding-left: 20px;
}
.files-upload{
width: 100%;
}
.tab-content-wrapper .form-group .col-sm-6:first-child,
.tab-content-wrapper .form-group .col-sm-6:last-child,
.tab-content-wrapper .form-group .col-sm-9,
.tab-content-wrapper .form-group .col-sm-3{
padding-left: 15px;
padding-right: 15px;
}
.tab-content-wrapper .form-group .col-sm-6:last-child{
margin-top: 1rem;
}
.tab-content-wrapper .form-group .col-sm-9:last-child{
margin-top: 1rem;
}
.tab-content-wrapper .form-group .col-sm-9 input ~ label,
.tab-content-wrapper .form-group .col-sm-6:last-child input ~ label {
left: 30px;
}
.single-venue-item {
width: 100%;
}
.tab-header-wrapper .add-new {
top: -60px;
}
.build-menu-tab {
min-height: 0;
}
.build-menu-tab-content{
overflow: hidden;
}
.active-header-li{
padding-right: 15px;
flex-wrap: wrap;
padding-bottom: 25px;
}
.active-header-li .alertbox{
text-align: left!important;
}
.active-header-li #active-header-li-text{
width: 100%;
}
.active-header-li #active-header-li-text.editable{
width: 160px;
}
.active-header-li #active-header-li-text.editable ~ .button-list{
opacity: 0;
}
.active-header-li .button-list{
width: 100%;
}
.menu-builder .tab-content-wrapper{
width: 700px;
}
.tab-content{
overflow-x: scroll;
}
#close-form{
margin-left: auto;
}
.venue-menu .menu-toggler{
background: #ee0a58;
height: 35px;
width: 35px;
right: -35px;
top: 0px;
position: absolute;
}
.venue-menu .menu-toggler:before{
content: '';
height: 100%;
width: 100%;
background-image: url(../images/icon-right.png);
position: absolute;
top: 0;
left: 0;
background-repeat: no-repeat;
background-position: center;
transition: .6s ease;
}
.venue-menu{
transform: translateX(-220px);
-moz-transform: translateX(-220px);
-webkit-transform: translateX(-220px);
transition: .3s ease all;
}
.single-venue:before{
transform: translateX(-220px);
-moz-transform: translateX(-220px);
-webkit-transform: translateX(-220px);
transition: .3s ease all;
}
.mobile-menu-active .venue-menu{
transform: translateX(0px);
-moz-transform: translateX(0px);
-webkit-transform: translateX(0px);
}
.single-venue.mobile-menu-active:before{
transform: translateX(0px);
-moz-transform: translateX(0px);
-webkit-transform: translateX(0px);
}
.mobile-menu-active .venue-menu .menu-toggler:before{
transform: rotate(-180deg);
-moz-transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
}
.payment-modal{
align-items: baseline;
}
.payment-modal-inner{
width: 600px;
}
.modal-button{
display: flex;
flex-wrap: wrap;
justify-content: center;
flex-direction: column;
}
.modal-button > .btn{
margin-bottom: 15px;
}
.report-box.main-box {
margin-right: 0px;
margin-bottom: 25px;
}
.report-box.main-box:before {
right: auto;
bottom: -15px;
top: auto;
transform: translateY(0px) translateX(-50%) rotate(90deg);
left: 50%;
}
#allowSortMenuOrder{
position: relative;
display: flex;
width: 100%;
left: 0;
margin-bottom: 20px;
}
.search-field.venue-items{
position: relative;
margin-top: 20px;
margin-bottom: -46px;
}
.search-field {
transform: translateX(-50%) translateX(0px);
}
}
@media screen and (max-width: 640px) {
.create-venue-tab-content .tab-content-step{
min-height: auto;
}
.btn-fetch {
padding: 14px 25px;
}
.section-content h1 {
font-size: 48px;
}
.section-content .btn {
margin-top: 15px;
}
.section-content p {
font-size: 18px;
margin-top: 30px;
margin-bottom: 30px;
}
.section-content{
padding-left: 15px;
padding-right: 15px;
}
.page-header{
padding-left: 0;
padding-right: 0;
}
.venue-builder{
padding-left: 15px;
padding-right: 15px;
}
.page-main-content{
padding-left: 15px;
padding-right: 15px;
}
.payment-modal-inner{
width: 500px;
padding: 30px;
padding-top: 70px;
}
.modal-c-continue {
padding: 0;
}
.venue-items .single-venue-item.has-item .venue-header:before,
.venue-items .single-venue-item.has-item .links,
.venue-items .single-venue-item.has-item a.btn,
.venue-items .single-venue-item.has-item .btn{
opacity: 1!important;
}
.venue-items .single-venue-item.has-item a.btn,
.venue-items .single-venue-item.has-item .btn{
top: 50%!important;
}
.venue-items .single-venue-item.has-item .venue-header .links{
right: 15px;
}
.date-range li {
margin-bottom: 5px;
}
#btn_toggles {
text-align: center;
}
#btn_toggles .toggleLinks {
position: relative;
display: inline-block;
margin: 0 auto;
margin-top: 15px;
margin-bottom: 15px;
right: auto;
}
#btn_toggles ul#orderToggleStat {
display: inline-block;
}
#btn_toggles h3 {
text-align: center;
}
.search-field {
top: 77px;
}
.order-seg {
margin-top: 0px;
}
}
@media screen and (max-width: 580px) {
body {
height: auto;
}
section.main {
display: flex;
height: auto;
}
.content-wrapper{
width: 100%;
}
.section-content{
margin-top: 100px;
}
.signup-form .form-group .col-sm-6:last-child,
.signup-form .form-group .col-sm-6:first-child {
padding-left: 15px;
padding-right: 15px;
}
.signup-form .form-group .col-sm-6:last-child{
margin-top: 9px;
}
.signup-form {
margin-top: 60px;
height: auto;
}
.single-venue-item {
width: 100%;
}
.files-upload h1{
font-size: 24px;
padding: 0 15px;
}
.payment-modal-inner{
width:100%;
padding:15px;
padding-top: 55px;
}
.payment-modal{
align-items: baseline;
}
}
@media screen and (max-width: 575px) {
.col-sm-6.group-input.left {
padding-right: 15px;
}
.col-sm-6.group-input.right {
padding-left: 15px;
margin-top: 16px;
}
.sd-ed .col-sm-6.right input ~ label, .sd-ed .col-sm-6.right select ~ label {
left: 30px;
}
.order-summary-info .col-lg-3:nth-child(3){
margin-bottom: 30px;
}
.order__web_view .isTakingOrder {
margin-top: 10px;
}
.publish__venue {
position: relative;
margin-left: 25px;
margin-bottom: 15px;
}
}
@media screen and (max-width: 500px) {
#btn_toggles ul#orderToggleStat{
}
ul#orderToggleStat li {
float: none;
margin: 15px 0px;
padding: 0 15px;
}
ul#orderToggleStat li.active:before {
opacity: 0;
}
ul#orderToggleStat li.active {
border-left: 2px solid;
border-right: 2px solid;
}
#btn_toggles .toggleLinks {
margin-top: 5px;
box-shadow: 0px 2px 10px rgb(0 0 0 / 15%);
margin-bottom: 25px;
}
.search-field {
top: 167px;
width: 300px;
}
.order-seg {
padding-right: 15px;
padding-left: 15px;
}
}
@media screen and (max-width: 360px) {
.active-header-li .button-list .btn{
margin-top: 5px;
}
}
.ezdz-dropzone {
position: relative;
text-align: center;
width: 100%;
height: 200px;
overflow: hidden;
}
.ezdz-dropzone .imageDelete {
position: absolute;
top: 5px;
right: 5px;
background: #fff;
height: 30px;
width: 30px;
border-radius: 50%;
text-align: center;
line-height: 30px;
font-weight: 600;
/* text-transform: uppercase; */
color: #ee0b58;
}
.ezdz-dropzone div {
/* */
}
.ezdz-dropzone span {
background: black;
background: rgba(0,0,0,0.7);
color: white;
font-size: 13px;
font-weight: normal;
max-width: 90%;
vertical-align: middle;
padding: 4%;
line-height: 10px;
display: inline-block;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.ezdz-dropzone img:not(.dropImage) {
border-radius: 5px;
width: 280px;
height: 210px;
object-fit: cover;
vertical-align: middle;
}
.ezdz-dropzone [type="file"] {
cursor: pointer;
position: absolute;
width: 100%;
height: 100%;
opacity: 0;
margin: 0;
padding: 0;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
@media screen and (max-width: 1023px) {
.list-view-order .single-order > .list-view .left__ {
flex-basis: 40%;
}
.list-view-order .single-order > .list-view .right__ {
flex-basis: 40%;
}
}
@media screen and (max-width: 800px) {
.list-view-order .single-order > .list-view .left__ .single__item:nth-child(1) {
flex-basis: 40%;
}
.list-view-order .single-order > .list-view .left__ {
flex-basis: 40%;
}
.list-view-order .single-order > .list-view .right__ {
flex-basis: 50%;
}
}
@media screen and (max-width: 700px) {
.list-view-order .single-order > .list-view .left__ .single__item:nth-child(1) {
flex-basis: 40%;
}
.list-view-order .single-order > .list-view .left__ {
flex-basis: 100%;
}
.list-view-order .single-order > .list-view .right__ {
flex-basis: 100%;
margin-top: 15px;
}
}
/*TIMEPICKER*/
.ui-timepicker-wrapper {
overflow-y: auto;
max-height: 150px;
width: 175px;
background: #fff;
border: 1px solid #ddd;
-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2);
-moz-box-shadow:0 5px 10px rgba(0,0,0,0.2);
box-shadow:0 5px 10px rgba(0,0,0,0.2);
outline: none;
z-index: 10052;
margin: 0;
text-align: center;
}
.ui-timepicker-wrapper.ui-timepicker-with-duration {
width: 13em;
}
.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-30,
.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-60 {
width: 11em;
}
.ui-timepicker-list {
margin: 0;
padding: 0;
list-style: none;
}
.ui-timepicker-duration {
margin-left: 5px; color: #888;
}
.ui-timepicker-list:hover .ui-timepicker-duration {
color: #888;
}
.ui-timepicker-list li {
padding: 3px 0 3px 5px;
cursor: pointer;
white-space: nowrap;
color: #000;
list-style: none;
margin: 0;
}
.ui-timepicker-list:hover .ui-timepicker-selected {
background: #fff; color: #000;
}
li.ui-timepicker-selected,
.ui-timepicker-list li:hover,
.ui-timepicker-list .ui-timepicker-selected:hover {
background: #1980EC; color: #fff;
}
li.ui-timepicker-selected .ui-timepicker-duration,
.ui-timepicker-list li:hover .ui-timepicker-duration {
color: #ccc;
}
.ui-timepicker-list li.ui-timepicker-disabled,
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
color: #888;
cursor: default;
}
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
background: #f2f2f2;
}
.jumbErrorMsg{
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border: 2px solid #EE0A58;
}
/*USERS PAGE*/
.users-list-container {
position: relative;
background: #fff;
padding: 30px;
border-radius: 15px;
box-shadow: 0px 0px 16px rgba(0,0,0,.03);
}
#userTable.dataTable thead th, #userTable.dataTable thead td {
padding: 10px;
border-bottom: 1px solid #ddd;
}
#userTable.dataTable thead th {
text-align: center;
font-size: 14px;
color: #333;
font-weight: 500;
vertical-align: middle;
}
#userTable span.isYes{
background-image: url(../images/yes_icon.svg);
height: 24px;
width: 24px;
display: block;
background-size: 100%;
margin: 0 auto;
}
#userTable span.isNo{
background-image: url(../images/no_icon.svg);
height: 24px;
width: 24px;
display: block;
background-size: 100%;
margin: 0 auto;
}
#userTable a.userLinks img {
width: 14px;
margin-right: 5px;
}
#userTable a.userLinks {
display: inline-block;
float: left;
display: inline-block;
float: left;
color: #EE0A58;
font-weight: 700;
font-size: 12px;
text-decoration: none;
}
#userTable a.userLinks:first-child {
margin-right: 7px;
}
#userTable tbody td {
color: #8F8F8F;
font-size: 14px;
font-weight: 500;
padding-top: 15px;
padding-bottom: 15px;
}
#userTable_filter {
float: left;
}
#userTable_filter input[type='search'] {
width: 330px;
border: 0px;
background: #F5F5F5;
font-size: 14px;
font-weight: 500;
color: #333;
padding: 20px;
outline: none;
}
#userTable_wrapper > .top{
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
align-items: flex-end;
margin-bottom: 20px;
}
#userTable_wrapper.dataTables_wrapper .dataTables_length select {
width: 70px;
background-size: 15px;
border: 1px solid #E1E1E1;
border-radius: 0px;
padding: 6px 8px;
outline: none;
margin-left: 5px;
}
.dataTables_length label {
color: #c5c3c3;
font-size: 14px;
font-weight: 500;
}
.users-list-container .dataTables_wrapper .dataTables_paginate .paginate_button {
color: #ee0a58 !important;
font-weight: 500;
padding: 10px 10px;
cursor: pointer;
text-decoration: none;
}
.users-list-container .dataTables_wrapper .dataTables_paginate .paginate_button.disabled{
color: #adadad !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
background: transparent!important;
border: 1px transparent!important;
}
.users-list-container .dataTables_wrapper .dataTables_paginate .paginate_button:hover{
background: transparent!important;
color: #c1c7c2 !important;
border: 1px solid transparent;
}
#userTable_wrapper .bottom {
text-align: center;
overflow: hidden;
margin-top:10px;
}
div#userTable_paginate {
margin: 0 auto;
display: inline-block;
/* text-align: center; */
float: none;
}
#userTable.dataTable.no-footer {
border-bottom: 0px;
}
#userTable .actTh{
width: 130px!important;
}
#user__modal .form-control, #user__add__modal .form-control {
background-color: #F5F5F5;
border-color: #F5F5F5;
}
#user__modal .permission_container,
#user__add__modal .permission_container {
background: whitesmoke;
padding: 10px 15px;
}
#user__modal .permission_container > p ,
#user__add__modal .permission_container > p {
font-weight: 300;
color: #000;
}
#user__modal .permission_container #permission_list,
#user__add__modal .permission_container #permission_list_ad {
overflow: hidden;
}
#user__modal .permission_container #permission_list .checkbox-container,
#user__add__modal .permission_container #permission_list_ad .checkbox-container {
float: left;
display: inline-block;
margin-right: 20px;
font-size: 13px;
color: #6C747C;
margin-bottom: 15px;
}
#user__modal .modal-title, #user__add__modal .modal-title {
font-size: 14px;
color: #767272;
position: relative;
top: 3px;
}
#user__modal .modal-header, #user__add__modal .modal-header {
padding: 20px 0px;
padding-top: 0;
}
#user__modal .close-btn, #user__add__modal .close-btn {
text-indent: -9999px;
height: 30px;
width: 30px;
background-color: #a2a2a2;
border-radius: 3px;
background-size: 12px;
background-repeat: no-repeat;
background-position: center center;
margin-left: -17px;
background-image: url(../images/close_white_icon.png);
}
#user__modal .modal-content, #user__add__modal .modal-content {
padding: 25px;
}
#user__modal .modal-body, #user__add__modal .modal-body {
padding: 20px 0px;
padding-bottom: 0;
}
#user__modal .modal-footer,
#user__add__modal .modal-footer{
border: 0px;
padding: 0;
margin-top: 15px;
}
.search-field.venue-items{
pointer-events: all;
width: 300px;
left: auto;
right: 15px;
transform: translateX(0);
top: -5px;
}
body.venuesList {
background: #efefef;
}
.outSelMsg{
font-size: 18px;
font-weight: 600;
color: #ee0a58;
margin-top: 15px;
}
.multiselect-container.dropdown-menu.show {
width: 300px;
}
.multiselect-container .multiselect-filter>input.multiselect-search {
margin-left: 0!important;
}
.custom-select:focus{
border-color: transparent;
box-shadow: 0px 0px 0px;
}
.singleOrderType{}
.singleOrderType .checkbox-container{
display: inline-block;
}
#user__add__modal .validError{
margin-left: 0;
margin-bottom: -7px;
}
#user__add__modal .validError.active{
margin-bottom: 15px;
height: auto;
}
.single-help {
margin-bottom: 20px;
}
.single-help h2 {
font-size: 20px;
font-weight: 700;
color: #141414;
}
.single-help p {
font-size: 14px;
color:#333;
margin-top:15px;
}
.single-help a {
font-size: 13px;
color:#ee0d59;
margin-top:15px;
font-weight:600;
}
button.btn.btnOrderCanDetail {
background: #fff;
font-weight: 700;
font-size: 13px;
padding: 3px 15px;
margin-top: 10px;
}
button.deleteImage {
position: absolute;
z-index: 2;
text-indent: -9999px;
height: 30px;
width: 30px;
box-shadow: none;
border: 0;
background-color: #ee0a58;
border-radius: 50%;
left: 35px;
background-image: url(../images/close_white_icon.png);
background-repeat: no-repeat;
background-position: center center;
background-size: 12px;
}
a.btn.btn-fetch.xs.image-link {
padding-left: 25px;
padding-right: 25px;
margin-right: 10px;
background: #ee0a58;
border-color: #ee0a58;
}
.itemImageContainer img {
height: 100px;
width: 100px;
object-fit: cover;
}