@font-face{
    font-family: 'Bradley Hand ITC';
    src: url('/fonts/BRADHITC.TTF') format('truetype');
}

@font-face {
    font-family: "Unity";
    src: url("../bm-fonts/TCCC-UnityText-Regular.ttf");
}
@font-face {
    font-family: "Unity";
    src: url("../bm-fonts/TCCC-UnityText-Bold.ttf");
    font-weight: bold;
}
@font-face {
    font-family: "Unity";
    src: url("../bm-fonts/TCCC-UnityText-Italic.ttf");
    font-style: italic;
}
@font-face {
    font-family: "Unity";
    src: url("../bm-fonts/TCCC-UnityText-BoldItalic.ttf");
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: "Pepsi";
    src: url("../bm-fonts/PepsiOwners-Regular.ttf");
}

@font-face {
    font-family: "Pepsi-Extended";
    src: url("../bm-fonts/PepsiOwners-Extended.ttf");
}

@font-face {
    font-family: "Pepsi-Compressed";
    src: url("../bm-fonts/PepsiOwners-Compressed.ttf");
}

body{
  margin: 0;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;

}

.Unity {
    font-family: 'Unity';
    font-size: 13px;
}

.Pepsi {
    font-family: 'Pepsi-Extended';
    font-size: 14px;
}

.Pepsi i {
    font-size: 13px;
    font-weight: bold !important;
}


body img {max-width: 100%;}

a {
    color: black;
    text-decoration: none;
}

.header {
  display:table;
  background-color: black;
  height: 60px;
  max-height: 60px;
  width: 100%;
  top: 0;
  margin: 0;
  color: white;
  z-index: 101;
  box-sizing: border-box;
  padding: 0 10px;

  /*Need relative so z-index prevents this classes children from being overlapped*/
  /* position: relative; */
  position: fixed;
}
.header.nonav {
    position: relative;
}

.sidebar {
  display:flex;
  position:fixed;
  left: 0;
  bottom: 36px;
  top: 60px;
  background-color: #262626;
  color:white;
  padding: 20px 0 0 0;
  text-align: left;
  flex-direction: column;
  align-items:center;
  overflow-y: auto;
  box-sizing: border-box;
  overflow-x: hidden;
  z-index: 7;
}

.sidebar-item {
  margin: 10px;
  width: 165px;
  padding: 5px;
  font-size: 12px;
  white-space: nowrap;
}
.sidebar-text {
  display: inline-block;
  vertical-align: middle;
  margin-left: 10px;
}
.sidebar-icon {
  display: inline-block;
  vertical-align: middle;
  padding-left: 2px;
}

.sidebar.collapse:hover .sidebar-item {
  width: 165px; 
  text-align: left;
}
.sidebar.collapse:hover .sidebar-text {
  display: inline-block;
}
.bold {
    font-weight: bold;
}

#steps-campaign {
    width:100%;
    max-width:800px;
    box-sizing:border-box;
    margin:90px auto 0px auto;
}

#steps-campaign-login {
    width:100%;
    max-width:800px;
    box-sizing:border-box;
    margin:0px auto;
}


#before-after {
    width: 400px;
    position: relative;
    z-index: 9;
}

.tracker {
    border-collapse: collapse;
    width: 837px;
    display:table;
}


.tracker .row .table-cell:first-of-type {
    width: 315px;
    padding: 10px;
    color: black;
}

.simpleinline {
    display: inline-block;
    box-sizing: border-box;
    text-align: left;
    position:relative;
}
.inline-1-12 {
    width: 7.325%;
    margin-right: 1.1%;
    vertical-align: top;
}

.inline-2-12 {
    width: 15.75%;
    margin-right: 1.1%;
    vertical-align: top;
}
.inline-3-12 {
    width: 24.175%;
    margin-right: 1.1%;
    vertical-align: top;
}
.inline-4-12,.mobinline-4-12 {
    width: 32.6%;
    margin-right: 1.1%;
    vertical-align: top;
}
.inline-5-12 {
    width: 41.025%;
    margin-right: 1.1%;
    vertical-align: top;
}

.inline-6-12 {
    width: 49.45%;
    margin-right: 1.1%;
    vertical-align: top;
}
.inline-7-12 {
    width: 57.875%;
    margin-right: 1.1%;
    vertical-align: top;
}
.inline-8-12 {
    width: 66.3%;
    margin-right: 1.1%;
    vertical-align: top;
}
.inline-9-12 {
    width: 74.725%;
    margin-right: 1.1%;
    vertical-align: top;
}
.inline-10-12 {
    width: 83.15%;
    margin-right: 1.1%;
}
.inline-11-12 {
    width: 91.575%;
    margin-right: 1.1%;
}
.inline-12-12 {
    width: 100%;
    margin: 0;
}
.inline-1-5, .mobinline-1-5 {
    width: 19%;
    margin-right: 1.25%;
    vertical-align:top;
}
.inline-2-5 {
    width: 39.25%;
    margin-right: 1.25%;
    vertical-align:top;
}
.inline-3-5 {
    width: 57%;
    margin-right: 1.25%;
    vertical-align:top;
}
.inline-4-5 {
    width: 76%;
    margin-right: 1.25%;
    vertical-align:top;
}
.inline-5-5 {
    width: 100%;
    margin-right: 0%;
    vertical-align:top;
}

.right-desktop {
    text-align: right;
}
.left-desktop {
  text-align: left;
}
.overlay {
    z-index: 11;
    margin-top: -20px;
}


.content {
  display: inline-block;
  position: absolute;
  width: calc(100% - 215px);
  height: fit-content;
  left: 195px;
  top: 60px;
  padding: 10px;
  text-align: center;
  padding-bottom: 35px;
  /* overflow: scroll;
  height: calc(100dvh - 128px); */
  
}
.help-div-wrap ~ .content {
  top: 100px;
}
.top1, .top2 {
    top: 500px;
    
}

.top3 {
    top: 620px;
}
.top4 {
    top: 450px;
}

.postit-form {
  max-width: 1250px;
  margin: 0px auto;
}

.sidebar-item i {
  font-size: 20px;
  margin: 3px;
}
.sidebar-item img{
      height: 30px;
      width: 25px;
      object-fit: cover;
      max-width: unset;
      padding-left: 2px;
}
.sidebar a {
  text-decoration: none;
  color: white;
}
.sidebar-item.selected {
  text-align:left;
  background-color: #4C4C4C;
  border-radius: 5px;
}
.header-bm-logo {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
  text-align: left;
  min-width: 320px;
  /* width: 100%; */
}
.header-bm-logo img {
  height: 50px;
  vertical-align: middle;
  object-fit: contain;
}

.header-rep-logo {
  display: table-cell;
  height: 100%;
  font-size: 20px;
  vertical-align: middle;
  text-align: left;
}
.header-rep-logo img {
  height: 40px;
  margin-left: 5px;
}
.header-search {
display:inline-block;
width: 32%;
height: 100%;
/*  vertical-align: middle;
text-align: center;*/
}



/* .header > div {
  position:relative;
  width: 100%;
  height: 100%;
} */
  .account-dropdown {
    display: none;
    width: 250px;
    height: 200px;
    border: 1px solid #F4F2F5;
    border-radius: 5px;
    z-index: 11;
    padding: 10px;
    background-color: #F4F2F5;
    position: absolute;
    right: 0;
  }

  .header-account {
    margin-top: 60px;
    position: relative;
    display: table-cell;
    vertical-align: middle;
    text-align: right;
    font-size: 18px;
    position: relative;
    z-index: 1;
    white-space: nowrap;
    width: fit-content;
  }
  #account-div:hover .account-dropdown {
    display: block;


  }

  .dropdown-list {
    position: absolute;
    top: 0;
    text-align: left;
    font-size: 18px;
  }
 

  .red-button-center {
    background-color: #005CB4;
    position: relative;
    color: white;
    padding: 10px 35px;
    border: 1px solid #005CB4;
    border-radius: 5px;
    text-align: center;
    cursor: pointer; 
    font-family: 'Unity';
  }
  .red-button {
    background-color: #005CB4;
    position: relative;
    color: white;
    padding: 10px 70px 10px 20px;
    border-radius: 10px;
    font-family: 'Unity';
    border: 0px;
  }
  .footer-help-text .red-button {
    font-weight: bold;
    font-size: 16px;
    margin: 25px 0;
    font-family: 'Unity';
  }

  .link-wrapper {
    /* text-align: center; */
    margin: 0 auto;
    max-width: 850px;
  }
  .popup {
    width: 100%;
    height: 100%;
    background-color:rgba(0, 0, 0, 0.50);
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 103;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: translate(-50%, -50%);
  }
  .popup-window {
    text-align: center;
    z-index: 104;
    width: 95%;
    padding: 20px;
    box-sizing:border-box;
    position: absolute;
    margin: 0 auto;
    display:none;
    height: fit-content;
    box-shadow: 0 0 10px #000;
    background-color: #F4F2F5;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 100%;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    max-width: 550px;
    overscroll-behavior: contain;
  }
  .popup-window-large {
    text-align: center;
    z-index: 105;
    /*width: 100%;
    max-width: 500px;*/
    width: 1000px;
    box-sizing:border-box;
    /* padding: 5px 5px 0 5px; */
    position: absolute;
    margin: 0 auto;
    display:none;
    height: fit-content;
    box-shadow: 0 0 10px #000;
    background-color: #F4F2F5;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 100%;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    overscroll-behavior: contain;
  }
  .sidebar-overlay {
    display: none;
    opacity: .7;
    background-color: black;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 101;
  }
  #mobile-bars {
    display: none;
  }
  .mobile, .mobile-table {
    display: none;
  }
  .desktop {
    display: initial;
  }
  #sidebar-close {
    display: none;
  }

  
.login-header {
  display:table;
  background-color: #f40107;
  height: 55px;
  width: 100%;
  position: fixed;
  top: 0;
  margin: 0;
  z-index: 10;
  padding: 0 10px;
  box-sizing: border-box;
}

.login-header td {
    vertical-align:middle;
}

.login-logo {
  display:table-cell;
  text-align: left;
  /* margin: 1% 0; */
  height: 60px;
  position: relative;
  vertical-align: middle;
}
.rep-logo {
  display:table-cell;
  text-align: right;
  /* margin: 1% 0; */
  height: 100%;
  position: relative;
  vertical-align: middle;
}
.login-logo img {
  height: 50px !important;
  vertical-align: middle;
}


.login-content {
  width: 100%;
  min-height: calc(100vh - 80px);
  left: 0;
  margin-top: 40px;
  padding: 10px;
  box-sizing: border-box;
  background-color: #e1e1e1;
  padding-top: 40px;
}

.login-greybox {
  width:21%; 
  background-color: #F5F5F5;
  padding: 35px;
  box-sizing: border-box;
  margin: 0 auto;
  border-radius:10px;
  text-align: center;
  min-width: 340px;
  min-height: 520px;
}


.login-content .login-greybox {
    width: 100%;
    max-width: 987px;
    margin-top: 100px;
    background-color: white;
    min-height: auto;
    -webkit-box-shadow: 0px 0px 5px 3px rgba(166,166,166,1);
    -moz-box-shadow: 0px 0px 5px 3px rgba(166,166,166,1);
    box-shadow: 0px 0px 5px 3px rgba(166,166,166,1);
}

.red-box {
    background-color:#f40107;
    padding:10px;
    border-radius:5px;
}

.red-box-text {
    border:1px dotted white;
    padding:10px;
    color:white;
    text-align:center;
    line-height:2;
}

.login-greybox input[type=submit], .login-greybox button[type=submit], .login-header button[type=submit]{
  padding: 10px 40px;
  background-color: #005CB4;
  color: white;
  border-radius:5px;
  font-size: 14px;
  cursor: pointer;
  font-family: 'Unity';
}
.login-greybox input[type=text], .login-greybox input[type=password], .login-greybox select, .login-header input[type=text], .data-list{
  padding: 10px 15px;
  margin: 10px 0;
  font-size: 14px;
  width: 100%;
  border-radius: 5px;
  outline: none;
  border: 1px solid lightgrey;
  box-sizing: border-box;
}
.login-form {
  margin: 0 15%;
  text-align:left;
}

.login-footer {
    padding: 10px 0px;
    text-align: center;
    color: #626262;
    background-color: #e1e1e1;
    height: 40px;
    box-sizing: border-box;
}

.login-footer a {
    color: #626262;
}

.inject-box {
  display: inline-block;
  width: 250px;
  height: 300px;
  min-width: 250px;
  min-height: 300px;
  margin: 30px;
  border: 1px solid #E0E0E0;
  border-radius: 7px;
  vertical-align: bottom;
  overflow: hidden;
  background-color: white;
}
.inject-logo {
  /* width: 100%;
  min-width: 100%;
  height: 75%; */
  /* width: 250px;
  height: 187.5px;
    min-width: 250px;
  min-height: 187.5px;
  background-color: white;
  position: relative; */
  width: 100%;
  height: 80%;
  background-color: white;
  position: relative;
}
.inject-logo img {
  /* object-fit: cover;
  /* width: 100%;
  height: 100%; 

  width: 250px;
  height: 187.5px;
  min-width: 250px;
  min-height: 187.5px; */
    object-fit: cover;
    width: 100%;
    height: 100%;

}
.inject-logo i {
  position: absolute;
  color: green;
  --fa-primary-color: #008000; 
  --fa-secondary-color: #ffffff;
  --fa-secondary-opacity: 1;
  right: 3%;
  top: 3%;
  font-size: 30px;
}
.inject-button {
  background-color: #EAEAEA;
  padding: 0;
  height: calc(20%);
  position: relative;
  cursor: pointer;
}
.inject-button button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  text-align: left;
  background-color: white;
  border: 1px solid #E0E0E0;
  padding: 5px 20px 5px 10px;
  border-radius: 7px;
  color: #6B6B6B;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  cursor: pointer;
  font-family: 'Unity';
}
.inject-button button i {
  position: absolute;
  top: 55%;
  left: 90%;
  transform: translate(-50%, -50%);
  color:#F40107;
}
.inject-window {
  width: 100%;
  height: 100%;
  font-size: 12px;
  margin-top: 28px;
  background-color: white;
}
.inject-window-logo {
  display: inline-block;
  width: 40%;
}

.inject-window-actions {
  display: inline-block;
  width: 58%;
  height: 90%;
  vertical-align:top;
  text-align: left;
  margin-top: 25px;
}
.inject-price {
  display: inline-block; 
  position: relative;
  color: #3A3A3A;
  width: 90%;
}
/* .inject-price input[type=text] {
  padding: 5px 5px 5px 15px;
  border: 1px solid #DDDDDD;
  border-radius: 5px;
  width: 100%;
} */
.inject-window input[type=text] {
  padding: 5px 5px 5px 15px;
  border: 1px solid #DDDDDD;
  border-radius: 5px;
  width: 80%;
}


.inject-window select {
  padding: 5px 5px 5px 15px;
  border: 1px solid #DDDDDD;
  border-radius: 5px;
  width: 88%;
}

.inject-window-actions #inject-now {
  padding: 10px 5px;
  width: 90%;
  border: 1px solid #CB373B;
  background-color: #F40107;
  color: white;
  border-radius: 5px;
  margin-top: 10px;
}
.injection-name {
  background-color: #E1E1E1;
  position: absolute;
  width: 100%;
  top:0;
  left:0;
  height: 45px;
}

.inject-window-logo img {
  width: 100%;
}
.inject-window.login {
  padding: 15px 0;
}
.inject-window.login .inject-window-logo img {
  width: 85%;
}

.inject-window.login .inject-window-logo {
  width: 45%;
  margin: 5px;
}
.inject-window.login .inject-window-actions {
  width: 50%;
  margin-top: 10px;
}
#external-login-form {
  width: 100%;
  font-size: 12px;
}
#external-login-form input[type=text], #external-login-form input[type=password]{
  width:82%;
  margin:0px 0px 10px 0px;
  padding: 5px 30px 5px 5px;
  border: 1px solid #D5D5D5;
  border-radius: 5px;
  color: #5B5B5B;
  outline: none;
}

.loader {
    border: 5px solid #f3f3f3;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    border-top: 5px solid #555;
    border-radius: 50%;
    width: 23px;
    height: 23px;
}
.mobile-select {
  display:none;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.edit-product-info{
  height: 100%;
  margin: 0 10px;
  max-height: 700px;
  font-family: 'Unity';
}
.edit-product-info textarea {
  width: calc(100% - 20px);
  padding: 10px;
  color: #5E5E5E;
  height: 10em;
  border: 1px solid #EFEEF0;

}

.edit-product-info input[type=text] {
  color: #5E5E5E;
  border: 1px solid #EFEEF0;
  padding: 10px 10px;
  width: 100%;
  box-sizing: border-box;
}
.edit-product-info input:focus {
  border: 1px solid #047CD2;
  box-shadow: 0 0 5px #047CD2;
  outline: none;

}
.edit-product-info textarea:focus {
  border: 1px solid #047CD2;
  box-shadow: 0 0 5px #047CD2;
  outline: none;

}
.edit-product-info select:focus {
  border: 1px solid #047CD2;
  box-shadow: 0 0 5px #047CD2;
  outline: none;

}
.edit-product-info i:active {
  box-shadow: 0 0 5px #047CD2;

}
.edit-product-info select {
  width: 100%;
  padding: 9px 10px;
  border: 1px solid #EFEEF0;
  background-color: white;
  
}
 .edit-row {
     width: 100%;
     text-align:left;
     margin: 15px 0;
 }
 .edit-cell {
     display: inline-block;
     width: 48.5%;
     margin: .75%;
 }
 .edit-cell i{
  font-size: 30px;
  vertical-align: middle;
 }
 .edit-cell-2 {
  display:inline-block;
  width: 45%;
  margin: 2%;
 }
 .edit-cell-2:nth-child(2){
  text-align:right;
 }
.edit-buttons {
  position:sticky;
  bottom: -20px;
  /* width: 540px; */
  padding: 15px 5px;
  border-top: 1px solid #EFEEF0;
  overflow:hidden;
  background-color: white;
  /* DO NOT UNCOMMENT -- SCREWS UP EDIT USER POPUP
  /*margin-left: -5px; */
  z-index: 6;
}

.edit-discard {
  padding: 8px 25px;
  width: 35%;
  margin-right: 10px;
  background-color: white;
  border: 1px solid #EFEEF0;
  cursor: pointer;

}
.edit-save {
  padding: 8px 25px;
  width: 35%;
  margin-left: 10px;
  background-color: #047CD2;
  color: white;
  border: 1px solid #EFEEF0;
  cursor: pointer;
}
.edit-save:active {
  background-color: #2196F3;
}
.edit-product-picture
{
  height: 40%;
  margin: 10px 0;
}
.edit-product-picture img {
  max-height: 300px;
}
button.product-photo-upload {
  position:relative;
  background-color: white;
  width: 100%;
  padding: 10px;
  border: 1px solid #EFEEF0;
  font-family: 'Unity';

}
button.product-photo-upload:active {
  box-shadow: 0 0 5px #047CD2;

}
button.product-photo-upload i {
  position: absolute;
  top: 30%;
  left: 5%;
  font-size: 15px;
}

.loader-wheel {
font-size: 64px;
position: relative;
height: 1em;
width: 0.55em;
padding-left: 0.45em;
animation: loader-wheel-rotate 0.5s steps(12) infinite;
overflow: hidden;
margin: 0 auto;
}

.loader-wheel i {
display: block;
position: absolute;
height: 0.3em;
width: 0.1em;
border-radius: 0.05em;
background: #333;
opacity: 0.8;
transform: rotate(-30deg);
transform-origin: center 0.5em;
}

@keyframes loader-wheel-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.product-table {
  display:table;
  width: 100%;
  border-collapse: collapse;
}
.product-table-header {
  display: table-row;
  border-bottom: 1px solid #AEAEAE;
}
.product-table-header-cell {
  display: table-cell;
  padding: 5px 10px 10px 10px;
}
.product-row {
  display:table-row;
  height: 45px;

}
.product-row:nth-child(2n) {
  background-color: white;
}
/* .product-row:first-child {
  color:red;
  margin-top:10px;
} */
.product-table input[type=text] {
  color: #5E5E5E;
  border: 1px solid #EFEEF0;
  padding: 10px 10px;
  width: 90%;
  outline: none;
}
.product-table input[type=text]:hover, .product-table input[type=text]:focus  {
  border: 1px solid #047CD2;
  box-shadow: 0 0 5px #047CD2;
}
.product-row.noalternate:nth-child(2n) {
  background-color: inherit;
}
.product-cell {
  display: table-cell;
  vertical-align: middle;
  padding: 5px 10px;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  position: relative;
}
.product-cell i {
  cursor: pointer;
}
.product-cell input[type=number],.product-cell input[type=password] {
  padding: 10px;
  border: none;
  outline: none;
  width: 80%;
}

.pepsi-login {
    margin-top: 60px;
    display: table;
    width: 100%;
}

.pepsi-login-1 {
    display:table-cell;
    width: 64%;
    background: #ffffff url(/images/pepsicomenupro-mainimage.jpg) no-repeat center center;
    position: relative;
    background-size: cover;
    height: calc(100vh - 60px);
}

#pepsi-login-1-header {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 5vh;
    font-size: 25px;
    color: white;
}

#pepsi-login-1-footer {
    position: absolute;
    bottom: 3vh;
    color: white;
    font-family: 'Unity';
    font-size: 14px;
    left: 20px;
}

#pepsi-login-1-footer a {
    color: white;
}

#pepsi-login-1-footer-mobile {
    display: none;
}

.pepsi-login-2 {
    display:table-cell;
    height: calc(100vh - 60px);
    vertical-align: middle;
    text-align: center;
}

.pepsi-login-box {
    width: 80%;
    margin: 0 auto;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.11);
    -moz-box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.11);
    box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.11);
    padding: 20px;
    box-sizing: border-box;
    background-color: white;
}

.pepsi-login-box h2, .pepsi-login-box h3 {
    margin-block-start: 0px;
    margin-block-end: 0px;
}


.pepsi-number-outer {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    text-align: center;
    display:table-cell;
    vertical-align:middle;
}

.pepsi-number {
  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 50%;
  font-size: 21px;
  color: white;
  text-align: center;
  border: 2px solid white;
  margin: 0px auto;
  font-family: 'Pepsi';
}

.pepsi-optimization {
    text-align:center;
    font-size:23px;
    margin-top:15px;
}

.pepsi-confirm {
    display: table;
    width: 100%;
}
.pepsi-img {
    display: table-cell;
    width: 50%;
    vertical-align:top;
    height: 28.11vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url('/bm/bm-images/confirmation-image.jpg')
}

.pepsi-sides {
    display:table;
    width:100%
}
.pepsi-side-img {
    display: table-cell; 
    width: 50%;
    vertical-align: middle;
    box-sizing: border-box;
}
.pepsi-side-text {
    display: table-cell; 
    width: 50%;
    background-color: black; 
    color: white;
    text-align: left;
    box-sizing: border-box;
    vertical-align: middle;
    padding: 30px;
    font-size: 24px;
}
.pepsi-side-text ul {
    font-family: "Unity";
}
.pepsi-side-img img  {
    vertical-align: middle;
    width: calc(100% - 5px);
}
@media(max-width: 1423px) {
    .pepsi-img {
        height: 400px;
    }
}


.pepsi-complete {
    display: table-cell;
    background-color: black;
    padding: 20px;
    position: relative;
    vertical-align: top;
    text-align: left;
    color: white;
}
.pepsi-complete-1 {
    font-size: 27px;
    /* max-width: 630px; */
}
.pepsi-complete-2 {
    position: absolute;
    bottom: 20px;
    left: 20px;
    max-width: 630px;
}
.pepsi-complete.middle-aligned {
    vertical-align: middle;
}
.additional-service {
    width: 31.33%;
    display: inline-block;
    margin: 10px 1%;
    box-sizing: border-box;
    border-radius: 10px;
    border: 1px solid #d4d4d4;
}

.additional-service img {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    display: block;
    margin: 0 auto;
}

.additional-title {
    background-color: #f5f5f5;
    padding: 5px 0px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
    


.pepsi-steps-cell {
    display:table-cell;
    vertical-align:middle;
    padding-left:5px;
    font-size: 12px;
}

.tracker-cell {
    height: 40px;
    width: 100%;
    color: white;
    line-height: 40px;
    text-align: left;
    padding-left:30px;
    box-sizing:border-box;
}
.tracker-cell::after {
    content: "";
    height: 27px;
    width: 27px;
    position: absolute;
    transform: rotate(45deg);
    background-color: #E3E3E3;
    top: 12px;
    right: -11px;
    z-index: 5;
}
.user-table .tracker-cell.systems-track::after {
    display:none;
}
.tracker-cell::before {
    content: "";
    height: 30px;
    width: 30px;
    position: absolute;
    transform: rotate(45deg);
    background-color: white;
    top: 11px;
    left: -13px;
    z-index: 4;
}

.first-tracker {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    padding-left: 0px;
}

.last-tracker {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.first-tracker::before, .last-tracker::after {
    height: 0px !important;
}


.tracker-cell.products-track::before {
    display: none !important;
}
.tracker-cell.data-track::after {
    display: none !important;
}
.tracker-cell.systems-track, .tracker-cell.systems-track::after{
    background-color: #1A94D3;
}
.tracker-cell.products-track, .tracker-cell.products-track::after{
    background-color: #FFA000;
}
.tracker-cell.optimized-track, .tracker-cell.optimized-track::after{
    background-color: #2B3189;
}
.tracker-cell.grey-track, .tracker-cell.grey-track::after{
    background-color: #bdbdbd;
}
.tracker-cell.data-track, .tracker-cell.data-track::after{
    background-color: #004E99;
}
.product-cell:has(>.tracker-cell){
    padding: 5px 0;

}
.product-cell:has(>.tracker-cell.products-track) {
    min-width: 120px;
}

.product-row:has(> .product-cell > .tracker-cell){
    white-space: nowrap;
    position: relative;
}
.tracker-cell span.date {
    font-size: 11px;
}
.tracker-cell span.text {
    padding-top: 10px;
    display: inline-block;
}
.tracker-cell.pending, .tracker-cell.pending::after {
    background-color: #999999;
    cursor: unset !important;
}
.tracker-cell.not-applicable, .tracker-cell.not-applicable::after {
    background-color: #4B4B4B;
}
.tracker-cell.unlinked, .tracker-cell.unlinked::after {
    background-color: #777777;
}
.tracker-cell.optimized-track span.date,
.tracker-cell.data-track span.date{
    font-size: 13px;
}

.tracker-cell.optimized-track span.text-date,
.tracker-cell.data-track span.text-date  {
    font-size: 11px;
}



.greybox:has(.product-library-selection) {
  display: table !important;
}
.product-library-selection {
  display: table-cell;
  width: 33%;
}

.product-library-selection input[type="radio"] {
  height: 20px;
  width: 20px;
  vertical-align: sub;
}

.product-library-category {
  display: table-cell;
  width: 33%;
  text-align: center;
}

.product-library-category select {
  padding: 7px 45px 7px 10px;
  width: 60%;
}

.product-library-category .ms-parent {
text-align: left;
}

.product-library-csv {
  display: table-cell;
  width: 33%;
  text-align: right;

}

.product-library-csv button {
  padding: 5px 25px 5px 35px;
  margin: 0 15px;
  background-color:white;
  border-radius: 5px;
  position: relative;
  border: none;
  font-family: 'Unity';
}
.product-library-csv button:focus {
  border: 1px solid #F40107;
}
.product-library-csv button i {
  position: absolute;
  left:5%;
  top: 25%;
}
.product-library-csv > i {
cursor: pointer;
}
.product-library-csv > i:hover {
color: #F40107;
}
body .ms-choice > span {
  top: 15%;
}

.mod-group > div > div{
  padding: 10px;
} 
.mod-group:nth-child(2n + 2) {
  background-color: white;
  border: 10px solid white;
}
.mod-group:nth-child(2n + 1) {
  border: 10px solid #F4F2F5;

}
.modifier-item-icon {
  display: none !important;
}
.mod-group:hover .modifier-item-icon {
  display: inline-block !important;
}
.blue-button {
  padding: 10px 20px;
  color: white;
  background-color: #007CD0;
  border:none;
  border-radius: 5px;
  cursor: pointer;
  font-family: 'Unity';
}
.blue-button:disabled {
  background-color: lightgrey;
  border: 1px solid lightgrey;
}

.green-button {
  padding: 10px 20px;
  color: white;
  background-color: #2dae75;
  border:none;
  border-radius: 5px;
  cursor: pointer;
  font-family: 'Unity';
}

.white-button {
  padding: 10px 20px;
  color: black;
  background-color: white;
  border: 1px solid black;
  border-radius: 5px;
  cursor: pointer;
  font-family: 'Unity';
}
.white-button:disabled {
  color: darkgrey;
  border: 1px solid darkgrey;
  background-color: #ededed;
}
.black-button {
  padding: 10px 20px;
  color: white;
  background-color: #000;
  border:none;
  border-radius: 5px;
  cursor: pointer;
  font-family: 'Unity';
  border: 1px solid #000;
}
.black-button:disabled {
  background-color: grey;
  border: 1px solid grey;
}
.grey-button {
  padding: 10px 20px;
  color: black;
  background-color: #d7d7d7;
  border:none;
  border-radius: 5px;
  cursor: pointer;
  font-family: 'Unity';
  border: 1px solid #d7d7d7;
}
.grey-button:disabled {
  background-color: grey;
  border: 1px solid grey;
  color: white;
}
.action-container {
  margin: 0 auto;
  /* width: 80%; */
  text-align:center;
  max-width: 850px;
}
.action-box {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border: 1px solid #E1E1E1;
  width: 100%;
  max-width: 500px;
  display:inline-block;
  margin: 10px;
  text-align: left;
}
.action-top {
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
  border: 1px solid #E1E1E1;
  height: 35px;
  line-height: 35px;
  background-color: #E1E1E1;
  font-weight: bold;
  font-size: 15px;
  padding: 0px 10px;
  text-align: center;

  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.action-mid img {
  height: 150px;
  width: 100%;
  object-fit: cover;
  max-width: 500px;
}
.action-mid.overlap img {
  z-index: 5;
  height: 135%;
  max-height:205px;
  position:absolute;
  top: -53px;
  left: 0;

}
.action-mid {
  height: 150px;
  width: 100%;
  position: relative;
}

.elevate {
  margin-top: -36px;
}

.action-bottom {
  /* border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px; */
  border: 1px solid #E1E1E1;
  background-color: #E1E1E1;

  height: 30%;
  padding: 15px;
  background-color: #E1E1E1;
  display: table;
  width: 100%;
  box-sizing: border-box;
}
.action-bottom.dark {
  background-color: black;
  color: #ECECEC;
}
.action-bottom-text {
  display: table-cell;
  width: 69%;
  height: 100%;
  font-size: 12px;
  vertical-align: middle;
  font-family: 'Unity';
}
.action-bottom-button {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
  text-align: right;
}
.action-bottom-button button {
  float: right;
  padding: 8px 45px 8px 15px;
  position: relative;
  background-color: white;
  border: 1px solid #DEDEDE;
  border-radius: 5px;
  font-weight: bold;
  cursor: pointer;
  font-family: 'Unity';
}
.action-bottom-button button i {
  position: absolute;
  right: 10%;
  top: 31%;
  color:#F40107;
}
.grabber {
  cursor: grab;
}
#error {
  color: #F40107;
}
#success {
  color: green;
}
.textcenter {
  text-align: center;
}
.action-box.large {
  max-width: 1025px;
}
.dropdown-item {
  margin: 20px 0;
}
.dropdown-item a {
  text-decoration: none;
  color: #F40107;

}
.dropdown-list {
  margin-left: 20px;
}
.greybox {
  width:100%; 
  background-color: #F5F5F5;
  padding: 15px;
  box-sizing: border-box;
  text-align: left;

  border-radius:5px;

}
.bdy {
    padding:0px 10px;
    width:100%;
    max-width: 1620px;
    margin: 0 auto;
    box-sizing:border-box;
}


.bdy-height {
    min-height: calc(100vh - 279px);
    display:table;
    width: 100%;
}
  .header-title {
    font-size: 30px; 
    color: white;
    text-align: center;
    margin: 5px auto 15px auto;
    display: none;
  }
  .leftcell {
    display:table-cell;
    vertical-align:middle;
    padding-right: 2px;
}

.middlecell {
    display:table-cell;
    vertical-align:middle;
    padding: 0px 2px;
    text-align:-webkit-center;
}

.rightcell {
    display:table-cell;
    vertical-align:middle;
    text-align:right !important;
    text-align:-moz-right !important;
    white-space: nowrap;
    padding-left: 2px;
}

.login-right {
    display:table-cell;
    vertical-align:middle;
    text-align:right;
    white-space: nowrap;
    padding-left: 2px;
    position: relative;
}

.step {
    transform: rotate(-90deg) translateY(-50%);
    position:absolute;
    top:48%;
    left:20%;
    font-size:15px;
}
.step1 {
    transform: translateY(-50%);
    position:absolute;
    top:50%;
    right:32%;
    font-size:50px;
}
.step2 {
    transform: translateY(-50%);
    position:absolute;
    top:50%;
    right:20%;
    font-size:50px;
}

.mbm-header {
    font-size: 26px;
    line-height: 1;
    text-align: left;
}

#suggestions, .suggestions, #suggestions_outlet, .suggestions_outlet {
    position: absolute;
    background-color: white;
    display: none;
    z-index: 9999;
    text-align: left;
    width: 100%;
    font-size: 15px;
    -webkit-box-shadow: 0px 0px 13px 0px rgba(128,128,128,1);
    -moz-box-shadow: 0px 0px 13px 0px rgba(128,128,128,1);
    box-shadow: 0px 0px 13px 0px rgba(128,128,128,1);
    box-sizing: border-box;
    cursor: pointer;
    max-height: 366px;
    overflow-y: auto;
}

#suggestions::-webkit-scrollbar, .suggestions::-webkit-scrollbar, .suggestions_outlet::-webkit-scrollbar, #suggestions_outlet::-webkit-scrollbar {
    -webkit-appearance: none;
    appearance: none;
}

#suggestions::-webkit-scrollbar:vertical, .suggestions::-webkit-scrollbar:vertical, #suggestions_outlet::-webkit-scrollbar:vertical, .suggestions_outlet::-webkit-scrollbar:vertical {
    width: 11px;
}

#suggestions::-webkit-scrollbar:horizontal, .suggestions::-webkit-scrollbar:horizontal, #suggestions_outlet::-webkit-scrollbar:horizontal, .suggestions_outlet::-webkit-scrollbar:horizontal {
    height: 11px;
}

#suggestions::-webkit-scrollbar-thumb, .suggestions::-webkit-scrollbar-thumb, #suggestions_outlet::-webkit-scrollbar-thumb, .suggestions_outlet::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white; /* should match background, can't be transparent */
    background-color: rgba(0, 0, 0, .5);
}

#suggestions::-webkit-scrollbar-track, .suggestions::-webkit-scrollbar-track, #suggestions_outlet::-webkit-scrollbar-track, .suggestions_outlet::-webkit-scrollbar-track {
    background-color: #fff;
    border-radius: 8px;
}



.suggestion {
    padding: 5px;
    border-bottom: 1px solid #808080;
    cursor: pointer;

}

.suggestion:last-of-type {
    border-bottom: 0px;
} 

.suggestion:hover {
    background: #d3d3d3;
    color: white;
}

.inject-switch-top {
  height: 30px;
  min-height: 30px;
  background-color:#EAEAEA;
  padding: 10px;
}
.inject-switch-name{
  background-color: white;
  color: black;
  text-align: center;
  /* margin: 10px; */
  border-radius: 5px;
  padding: 5px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.inject-switch-bottom {
  height: 250px;
  min-height: 250px;
  text-align: center;
  font-size: 13px;
  background-color: white;
}
.inject-switch-bottom button {
  background-color: #0082DA;
  color: white;
  width: 80%;
  padding: 10px;
  border: none;
  border-radius: 10px;
  font-size: 18px;
  cursor: pointer;
  font-family: 'Unity';
}


.cancel-important {
    background: #eeeeee !important;
    color: #000000 !important;
    border: #dddddd 1px solid !important;
    font-size:16px !important;
}


.inject-switch-bottom-1 {
  height: 200px;
  min-height: 200px;
  position: relative;

}
.inject-switch-bottom-1 input, .inject-switch-bottom-1 select{
  width: 88px;
  background-color: white;
  border: 1px solid lightgrey;
  border-radius: 5px;
  outline: none;
  padding: 5px 10px;
}
.verification-box {
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
    background-color: white;
    padding: 50px;
    box-sizing: border-box;
}

#code1, #code4 {
    width: 40px;
    height:52px;
    line-height:52px;
    background-color:white;
    border:1px solid #e0e1e4;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    font-size: 36px;
    text-align:center;
    -moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
    display: inline-block;
    vertical-align:middle;
}
#code2, #code5 {
    width: 40px;
    height:52px;
    line-height: 52px;
    background-color:white;
    border:1px solid #e0e1e4;
    font-size: 36px;
    text-align:center;
    border-left: 0px;
    -moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
    display:inline-block;
    vertical-align:middle;
}
#code3, #code6 {
    width: 40px;
    height:52px;
    line-height: 52px;
    background-color:white;
    border:1px solid #e0e1e4;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-size: 36px;
    text-align:center;
    border-left: 0px;
    -moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
    display: inline-block;
    vertical-align:middle;
}
#code3 {
    margin-right: 10px;
}
#code4 {
    margin-left: 10px;
}

.settings-sidebar {
  margin-top:auto;
}
/*.logout-sidebar {
  margin-bottom: 50px;
}*/


.manage-box {
  display: inline-block;
  border-radius: 15px;
  width: 400px;
  border: 1px solid #DEDEDE;
  overflow: hidden;
  /* margin: 20px 15px; */
  text-align: left;
  box-sizing: border-box;
  max-width: 100%;
}
.manage-box.large {
  width: 600px;
}
.manage-top {
  display: table;
  height: 40px;
  width: 100%;
  max-width: 400px;
  background-color: #E1E1E1;
  
}
.large .manage-top {
  width: 600px;
  height: 60px;
  max-width: 600px;
}
.manage-title {
  display: table-cell;
  padding-left: 15px;
  font-weight: bold;
  vertical-align:middle;
}

.manage-bottom img {
    display: block;
}


.manage-button {
  display: table-cell;
  text-align: right;
  padding-right: 15px;
  vertical-align:middle;
}
.manage-button-button, .add-location-button {
  padding: 6px 40px 6px 15px;
  position: relative;
  background-color: white;
  border: 1px solid #DEDEDE;
  border-radius: 5px;
  font-weight: bold;
  cursor: pointer;
  font-family: 'Unity';
  width: 110px;
  height: 30px;
}
.manage-button-button i, .add-location-button i {
  color: #F40107;
}
.manage-button-button i {
  position: absolute;
  right: 10%;
  top: 31%;
}
.manage-button-button i.fa-loader{
  position: static;
  color: #F40107;
}
.manage-button-button:has(i.fa-loader) {
  padding: 6px 30px 6px 30px;
}

/* weglot -- DO NOT ADD VARIATIONS -- MAKE IT ALWAYS TOP RIGHT */
.wg-default {
    position: absolute !important;
    bottom: unset !important;
    top: 20px !important;
}

.wg-default .country-selector {
    position: absolute !important;
    bottom: unset !important;
    top: -10px !important;
    right: 0px !important;
}


/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* 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: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

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%;
}

.table-list {
  display: table;
  width: 100%;
  border-collapse: collapse;
}
.row-list {
  display: table-row;
}
.cell-list {
  display: table-cell;
  vertical-align: middle;
  padding: 5px;
  box-sizing: border-box;
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
.row-list-header {
  display: table-row;
  border-bottom: 1px solid #AEAEAE;
}
.header-cell {
  display: table-cell;
}
.category-title {
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: bold;
}
.row-list:nth-child(2n) {
  background-color: white;
}
.instructions-note {
  background-image: url("../bm-images/yellow-sticky.png");
  background-repeat: no-repeat;
  width: 335px;
  height: 325px;
  background-size:cover;
  text-align: left;
  display: inline-block;
  font-family: 'Unity';
  line-height: 1.6em;
  font-size: 15px;
  /* font-weight: bold; */

}
.note-text {
  margin: 20px 0;
  /* margin: 50px; */
  /* text-align: right; */
  /* width: 20%; */
}
.instructions {
  display: inline-block;
  font-family: Bradley Hand ITC;
  line-height: 1.6em;
  font-size: 18px;
  vertical-align: bottom;
  font-weight: bold;
  margin-top: -45px;
  z-index: 11;
}

.instructions-side {
  width: 900px;
  display: inline-block;
  font-family: 'Unity';
  line-height: 1.6em;
  font-size: 15px;
  /* font-weight: bold; */
 vertical-align: top;
  /* margin-top: 50px; */
}

.instructions-side-2 {
  width: 900px;
  vertical-align: middle;
  display: inline-block;
  line-height: 1.6em;
  font-size: 18px;
}

.mobi-title {
  font-size: 30px;
  font-weight: bolder;
  color: #005CB4;
  text-align: left;
  /* margin: 0 50px; */
  width: 80%;
  margin: 0 auto;
  margin-top: 10px;
}
.mobi-image {
  width: 100%;
  /*margin-top: -45px;*/
  position: relative;
}
.mobi-image img {
  width: 100%;
}
.mobi-image div {
  position: absolute;
  width: 30%;
  top: 40%;
  left: 15%;
  color: white;
  font-size: 24px;
  font-weight: bold;
}
.mobi-text {
  width: 80%;
  margin: 40px auto;
  font-size: 16px;
  text-align: left;
}
.mobi-buttons {
  width: 80%;
  text-align: left;
  margin: 20px auto;
}
.mobi-buttons-start {
  display: inline-block;
  text-align: left;
  width: 49%;
  vertical-align: middle;
}
.mobi-buttons-later {
  display: inline-block;
  text-align:right;
  width: 49%;
  vertical-align: middle;
}
#later {
  padding: 10px 30px;
  background-color: #F4F2F5;
  color: black;
  outline: none;
  border: none;
}
.action-box.steps {
  max-width: 400px;
}
.percentage {
  padding: 5px 30px 5px 10px;
  width: 50px;
  outline: none;
  border: none;
}


/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
.right-red-border {
    border-right: 1px solid #F40107;
}
/* forms */
.formrow {margin: 5px 0px;}
.formlabel {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    text-align: right;
    width: 34%;
    margin-right: 1%;
    font-weight: bold;
    line-height: 1;
    position:relative;
}
.formbox {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    text-align: left;
    width: 60%;
    line-height: 1;
    position:relative;
}
.largelabel .formlabel {
  width: 60%;
}
.largelabel .formbox {
  width: 34%;
}
.formbox p {
    line-height: 14px;
}

.formbox .ck p {
    line-height: 1;
    font-family: 'Unity';
}

.formbox input[type='text'], .formbox input[type='number'], .formbox input[type='email'], .formbox input[type='password'], .input, .niceinput {
    box-sizing: border-box;
    width: 100%;
    padding: 13px 10px;
    border-radius: 4px;
    border: 1px solid #ccc;
    font-size: 15px;
}
.formbox input[type='submit'] {
    box-sizing: border-box;
    background: #1a5522;
    border: 0;
    -webkit-appearance: none;
    color: #fff;
    border-radius: 4px;
    padding: 6px 12px;
    cursor: pointer;
}

.formbox textarea, .full-textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 5px 1.7%;
  border-radius: 4px;
  border: 1px solid #ccc;
  height: 150px;
}
.inline-container .simpleinline:last-child {margin-right: 0px;}

.help-yellow {
    display: none;
    position: absolute;
    /* border: 1px solid black; */
    z-index: 100;
    /* background-color: rgb(255, 255, 153); */
    /* padding: 5px; */
    text-align:left;
    line-height: 15px;
    font-weight: normal;
    font-size: 13px;
    max-width: 275px;
    box-sizing:border-box;


    box-shadow: rgb(0 0 0 / 25%) -8px 8px 15px 0px;
    padding: 15px;
    font-family: Unity, "Source Sans Pro", sans-serif !important;
    background-color: #FFE06C;
    border: none;
}

#percentage {
  position: absolute;
  z-index: 1;
  right: 10px;
  top: 12px;
  font-size: 20px;
  color: black;
}

.niceinput {
  box-sizing: border-box;
  width: 100%;
  padding: 13px 10px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 15px;
}
.formbox select, .niceselect {
  width: 100%;
  font-size: 15px;
  padding: 13px 45px 13px 10px;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: white;
  background-image: url(/images/select.png)!important;
  background-position: 100% 0;
  background-repeat: no-repeat no-repeat;
  border-radius: 5px;
  border: 1px solid #E4E4E8;
}
select {
  outline: none;
  /*border: none;*/
}


/* Create a custom checkbox */
.container {
    display: inline;
    position: relative;
    padding-left: 25px;
    line-height: 45px;
    cursor: pointer;
    font-size: 16px;
    color: black;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
}

.container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}


.checkmark {
  position: absolute;
  top: -3px;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: white;
  border-radius: 5px;
  border:1px solid #96989c;
}

.radiobox {
  position: absolute;
  top: -2px;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: white;
  border-radius: 50%;
  border:1px solid black;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark, .container:hover input ~ .radiobox {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark, .container input:checked ~ .radiobox {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after, .radiobox:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after, .container input:checked ~ .radiobox:after {
  display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.container .radiobox:after {
  left: 7px;
  top: 7px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background-color:white;
}



/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}


/* 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: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}


input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

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%;
}

.justmobile {
    display: none;
}

.largecheckbox {
  height: 20px;
  width: 20px;
  vertical-align: middle;
  font-size: 18px;
}
.fancy-select {
  padding: 9px 10px;
border: 1px solid #EFEEF0;
background-color: white;
min-width: 150px;
}
.search-box {
  position: relative;
  text-align: left;
  width: fit-content;
  margin:0 auto;
}
.search-box input[type=text]{
  padding: 5px 25px 5px 15px;
}
#search-icon {
  position: absolute;
  right:5px;
  top:7px
}
.add-break {
  display: none;
}

/* screwing up phone verification inputs
input[type=text], input[type=password] {
  padding: 5px 15px;
  outline: none;
  border: none;
  border-radius: 5px;
}
*/
.request-text {
  display: inline-block;
  width: 60%;
  margin: 20px 0;
  vertical-align: middle;
}
.request-button {
  display: inline-block;
  width: 39%;
  margin: 20px 0;
  text-align: right;
  vertical-align: middle;
}
.request-menu {
  max-width: 1250px;
   margin: 20px auto;
  text-align: left;
}
.link-menus-button {
  text-align: right;
  margin-top: 10px;
}
 #sortable-product-images {
  list-style-type: none;
  padding-inline-start: 0px;
}
 #sortable-product-images li {
  width: 100px;
  height: 100px;
  display: inline-block;
  margin: 5px 10px;
}
 #sortable-product-images li img {
  width: 100px;
  height: 100px;
  object-fit: cover;
}
.register_title {
  font-size: 22px;
  color: #444;
}
.popup-window:has(.register_title){
  background-color: white;
}
#step-one {
  width: 100%; 
  margin-left: 25%;
}
.footer {
    position: fixed;
    bottom: 0;
    left: 195px;
    height: 35px;
    width: calc(100% - 195px);
    text-align: center;
    background-color: white;
    border-top: 1px solid grey;
    color: grey;
    z-index: 10;
}
.footer  a {

    color: grey;
    text-decoration: none;
}
.button-box {
  display: inline-block;
  padding: 10px 10px 10px 10px;
  width: 125px;
  background-color: white;
  color: black;
  margin: 0 10px;
  vertical-align: text-bottom;
  border-radius: 10px;
  border: 1px solid lightgrey;
  position: relative;
  font-weight: bold;
  cursor: pointer;
  font-family: 'Unity';
}
.button-box i{
  position: absolute;
  right: 5%;
  color: red;
}

.button-box.selected {
  color: white;
  background-color: #262626;
}
.button-box.selected i {
  color: white;
}
.container {
  display: inline;
  position: relative;
  padding-left: 25px;
  line-height: 45px;
  cursor: pointer;
  font-size: 16px;
  color: black;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
}
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.radiobox {
  position: absolute;
  top: -5px;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: white;
  border-radius: 50%;
  border: 1px solid black;
}
.container input:checked ~ .checkmark, .container input:checked ~ .radiobox {
  background-color: #2196F3;
}
.container input:checked ~ .checkmark:after, .container input:checked ~ .radiobox:after {
  display: block;
}
.container .radiobox:after {
  left: 7px;
  top: 7px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background-color: white;
}
.checkmark:after, .radiobox:after {
  content: "";
  position: absolute;
  display: none;
}
.inject-mod-group {
  display:contents; 
  width: 100%;
  vertical-align: top;
}
.loader-ellips {
  font-size: 20px; /* change size here */
  position: relative;
  width: 4em;
  height: 1em;
  margin: 10px auto;
}

.loader-ellips__dot {
  display: block;
  width: 1em;
  height: 1em;
  border-radius: 0.5em;
  background: #555; /* change color here */
  position: absolute;
  animation-duration: 0.5s;
  animation-timing-function: ease;
  animation-iteration-count: infinite;
}

.loader-ellips__dot:nth-child(1),
.loader-ellips__dot:nth-child(2) {
  left: 0;
}
.loader-ellips__dot:nth-child(3) { left: 1.5em; }
.loader-ellips__dot:nth-child(4) { left: 3em; }

@keyframes reveal {
  from { transform: scale(0.001); }
  to { transform: scale(1); }
}

@keyframes slide {
  to { transform: translateX(1.5em) }
}

.loader-ellips__dot:nth-child(1) {
  animation-name: reveal;
}

.loader-ellips__dot:nth-child(2),
.loader-ellips__dot:nth-child(3) {
  animation-name: slide;
}

.loader-ellips__dot:nth-child(4) {
  animation-name: reveal;
  animation-direction: reverse;
}

.modifier-wrap {
  width:30%;
  margin: 0 auto;
  display:inline-block;
}

.footer-link {
  display: inline-block;
}
.footer-link:after {
  content: "\00a0 \00a0|\00a0 \00a0";
}
.footer-link:last-child:after {
  content: "";
}
.slimbox {
  width:50%; 
  margin:0 auto;
  min-width: 500px;
}
.top-right {
  position: absolute;
  top: 10px;
  right: 10px;
}
.manage-bottom img {
  width: 400px;
  height: 215px;
  object-fit:cover;
}
.manage-box.large .manage-bottom img {
  width: unset;
  height: unset;
}
.success-messsage {
  background-color:#9CEDE4;
  /* opacity: .5; */
  color: black;
  text-align: center;
  padding: 5px;
  border-radius: 5px;
}
.half-desktop {
  width: 49.5%;
  display: inline-block;
}
.desktop-right-mobile-center {
  text-align: right;
}
.ms-parent {
  text-align: left;
}
body .ms-choice {
  padding: 17px;
  /* outline: none; */
  border: 1px solid #ccc;
  border-radius: 5px;
  margin-top: 1px;
  width: 99%;
}

body .ms-choice>span {
  top: 15%;
}
.button-row-multiple {
  display: table;
  width: 95%;
  margin: 0 auto;
}
.button-row-multiple .two-button {
  display: table-cell;
  width: 50%;
}
.button-row-multiple .three-button {
  display: table-cell;
  width: 33%;
}
.google-instructions-link {
  /* font-family: Bradley Hand ITC; */
  font-size:15px;
  /* font-weight:bold; */
  margin:0 auto;
  display:inline-block;
  padding-top:100px;
}
.instructions-side div:only-child {
  vertical-align:top;
}
.instructions-side span:only-child {
  vertical-align:top;
}
.maininst {
  display: inline-block;
  padding-top: 65px;
}
.content.nonav {
  width: calc(100% - 20px);
  left: unset;
  padding-bottom: 140px;
}
.content.nonav.small-bottom {
  padding-bottom: 35px;
}
.add-menu-instructions {
  /* font-family: Bradley Hand ITC; */
  font-size:14px;
  /* font-weight:bold; */
  margin:0 auto;
  border: 1px solid #D8D8D8;
  width: calc(70% - 46px);
  padding: 20px;
  background-color: #F9F9F9;

}

.instruction-title {
  font-size: 18px; 
  font-weight:bold;
  margin-bottom: 20px;
  font-family: 'Unity', 'Source Sans Pro', sans-serif !important;

}
.add-menu-instructions .formlabel {

  font-family: 'Unity', 'Source Sans Pro', sans-serif !important;
}
.manage-box .warning {
  display: none;
}
.manage-box.no-product .warning {
  /* border: 1px solid yellow; */
  display: inline-block;
  width: 15px;
  height: 15px;
  /* position: relative; */
  overflow: visible;
}

.manage-box.no-product .warning i {
  /* color: #F10407; */
  position: absolute;
  top: -10px;
  left: 0;
  z-index: 9;
  font-size: 30px;
  --fa-primary-color: #ffffff; 
  --fa-secondary-color: #f10f07; 
  --fa-secondary-opacity: 1;
}
.manage-box-wrap {
  display: inline-block;
  position: relative;
  margin: 5px;
}
#new_store_id option:disabled{
  color: red;
  text-decoration: line-through;
}
.two-button-row {
  display: table;
  width: 87%;
  margin: 0 auto;
}
.two-button-row-first {
  display: table-cell; 
  width: 50%; 
  text-align: left;
}
.two-button-row-second {
  display: table-cell; 
  width: 50%; 
  text-align: right;
}
#online-link-now {
  font-weight: bold;
  text-decoration: underline;
  cursor: pointer;
  display: none;
}
.smallbox {
  margin: 10px auto;
}
.sidebar.collapse .sidebar-text {
  display: none;
}
.sidebar.collapse .sidebar-item {
  /* text-align: center; */
  width: 35px;
}
.sidebar-collapse-wrap.collapse + .content {
  left: 67px;
  width: calc(100% - 87px);
}
.footer.collapse {
  left: 67px;
  width: calc(100% - 67px);
}
.sidebar-collapse {
  display: inline-block;
  text-align: right;
}
.sidebar-expand {
  display: none;
}
.sidebar-collapse-wrap.collapse .sidebar-collapse {
  display: none;
}
.sidebar-collapse-wrap.collapse .sidebar-expand {
  display: inline-block;
}
/* .sidebar-collapse-wrap.collapse {
  width: 65px;
} */
.sidebar.collapse .sidebar-collapse {
  display: none;
}
.sidebar.collapse .sidebar-expand {
  display: inline-block;
}
.sidebar-item.collapse {
  text-align: right;
}
.sidebar-collapse-wrap {
  display: flex;
  /* position: absolute; */
  bottom: 0;
  height: 36px;
  border-top: 1px solid lightgrey;



  position: fixed;
  background-color: #262626;
  color: white;
  padding: 0 0 0 0;
  text-align: left;
  flex-direction: column;
  align-items: center;
  overflow: none;
  box-sizing: border-box;
  z-index: 7;
}
.sidebar ~ .sidebar-collapse-wrap .sidebar-item {
  width: 165px;
  margin: 0 10px;
}
.sidebar.collapse ~ .sidebar-collapse-wrap {
  padding: 0 5px;
}
.sidebar.collapse ~ .sidebar-collapse-wrap .sidebar-item {
  width: 25px;
  height: 45px;
  margin: 0 15px 0 5px;
}
.sidebar-collapse-wrap .sidebar-item a {
  color: white ;

}
.sidebar.collapse:hover ~ .sidebar-collapse-wrap .sidebar-item{
  width: 155px;
  text-align: left;
}
.error {
  color:red;
  font-weight: bold;
}
.action-box.featured {
  width: 825px;
  max-width: 825px;   
}
.action-box.featured .action-mid img {
  max-width: 825px;
}

.template-header {
  margin: 10px 0;
  text-decoration: underline;
  font-weight: bold;
  font-size: 18px;
}


.toggle-items {
  display: table-cell;
  text-align: right;
  vertical-align: middle;
}
.toggle-item {
  display: inline-block;
  margin: 0 25px;
}
.toggle-text {
  display: inline-block;
  width: 65%;
  vertical-align: middle;
}
.toggle-toggler {
  display: inline-block;
  width: 30%;
}
.add-button-text, .add-button-icon {
  display: inline-block;
  margin: 0;
  height: 35px;
  vertical-align: middle;
}
.add-button-icon {
  background-color:#2196F3;
  color: white;
  border-top: 1px solid #2196F3;
  border-bottom: 1px solid #2196F3;
  border-left: 1px solid #2196F3;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  font-size: 16px;
  padding: 0 10px;

}
.add-button-text {
  background-color: #F5F5F5;
  border-top: 1px solid lightgrey;
  border-bottom: 1px solid lightgrey;
  border-right: 1px solid lightgrey;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  font-size: 14px;
  padding: 0 15px;
}
.add-button {
  cursor: pointer;
  /* width: fit-content; */
  /* margin: 0 auto; */
}
.instructions-top {
  max-width: 1250px;
  margin: 10px auto;
  text-align: left;
  padding: 10px;
}


.mobile-inline {
  display: none;
}



.product-table.imageview {
  display: block;
  background-color: white;
  text-align: center;
}

.product-table.imageview .product-row {
  display: inline-block;
  margin: 10px;
  width: 300px;
  height: 300px;
  border: 1px solid #F5F5F5;
  margin: 0;
  position: relative;
  margin: 20px 30px;
  /* cursor: pointer; */
  vertical-align: top;
}
.product-table.imageview .product-row.spacer {
  display: block;
  width: unset;
  height: unset;
  margin: unset;
  border: none;
  /* margin-bottom: 50px; */
}
.product-category,
.product-category-first {
  display: contents;
  margin-bottom: 50px;
  background-color: #F5F5F5;
}
.imageview .product-category {
  background-color: white;
}
.product-table.imageview .noimageview {
  display: none;
}

.product-table.imageview .product-table-header {
  display: none;
}

.imageview .noimageview {
  display: none;
}

/* .imageviewonly {
  display: none;
}

.imageview .imageviewonly {
  display: inherit;
} */
.imageviewonly {
  width: 25px;
  height: 25px;
}
.imageview .imageviewonly {
  width: 300px;
  height: 270px;
}
.imageview .product-cell img {
  width: 300px;
  height: 270px;
  object-fit: cover;
  display: block;
}
.no-link .imageview .product-cell img {
  cursor: default;
}
.product-table.imageview .product-row.no-link {
  cursor: default;
}
.imageview .product-cell {
  padding: 0;
}

.imageview #image {
  background-color: white;
}

.imageview #name {
  position: absolute;
  text-align: center;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding: 5px;
  /* background-color: rgba(255, 255, 255, 0.8); */
  background-color: rgba(240, 240, 240, .5);
  bottom: 0;
}

.imageview #date {
  position: absolute;
  top: 93.5%;
  right: 5%;
}

.imageview #upc {
  /* position: absolute;
  top: 93.5%;
  left: 2%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 115px; */
  display: none;
}

.imageview .product-cell.button:nth-child(3n) {
  position: absolute;
  top: 93.5%;
  left: 60%;
}

.imageview .product-cell.button:nth-child(3n + 1) {
  position: absolute;
  top: 93.5%;
  left: 40%;
}

.imageview .product-cell.button:nth-child(3n + 2) {
  position: absolute;
  top: 93.5%;
  left: 50%;
}
.product-table.imageview .greybox {
  background-color: white;
  border: 1px solid lightgrey;
}
.imageview .category-name {
  max-width: unset;
}
.imageview .table-spacer {
  display: none;
}
.product-cell.delete {
  position: absolute;
  top: 0;
  right: 0;
}
.product-cell.edit {
  position: absolute;
  top: 0;
  left: 0;
}
.clearbox {
  width: 100%;
  background-color: white;
  padding: 15px;
  box-sizing: border-box;
  text-align: left;

  border-radius: 5px;
}
.clearshadow {
  box-sizing: border-box;
  height: 1px;
  width: calc(100% - 30px);
  background-color: #babec5;
  margin: 0 auto; 

}
.narrow-box {
  max-width: 1250px;
  margin: 0 auto;
}
.widget-instructions-products {
  margin: 0 auto;
  text-align: center;
  max-width: 1136px;
  /* padding-right: 8px; */
}
.simpleinline.inline-6-12.right-desktop.no-cancel {
  display: block;
  width: 100%;
  text-align: center;
}
.two-button-row.mobile-table {
  display: none;
}
.two-button-row.nomobile {
  display: table;
}
#agree-terms {
  display:  inline-block;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.terms-wrap {
    margin-top: 5px;
    display: block;
    width: 100%;
    text-align: center;
    font-family: 'Unity';
}

.header-bm-logo.centered {
  text-align: center;
}
#client-select {
  width: 400px;
  max-width: 400px;
}
.action-box.brand {
  width: calc(100% - 10px);
}
.user-login-list {
  display: table;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.user-login-details {
  display: table-row;
}
.user-login-icon {
  display: table-cell;
  width: 33%;
  text-align: right;
}
.user-login-input {
  display: table-cell;
  text-align: center;

}
.user-login-icon i {
  font-size: 20px;
  vertical-align: middle;
}
.user-login-details:nth-of-type(2n) {
  background-color: #f6f6f6;
}
.needs-price {
  /* position: absolute;
  top: -10px;
  right: -10px; */
  color: tomato;
  font-size: 15px;
  background-color: white;
}
.continue-later-wrap {
  width: fit-content;
  position: relative;
}
.advanced-settings-wrap {
  width: fit-content;
}
.greybox.bottom-box {
  position: fixed;
  bottom: 0;
  box-shadow: 0px -9px 7px 1px rgb(223,223,223, .5);
  z-index: 11;
  background-color: white;
}
.content:has(.bottom-box){
  padding-bottom: 140px;
}
.content:has(.bottom-button-div){
  padding-bottom: 35px;
}

.product-search ~ .inject-category {
  height: calc(100vh - 340px);
}
.external-location-table ~ .widget-header > .inject-category{
  max-height: calc(100vh - 330px);

}
.external-location-info ~ .widget-header > .inject-category {
  max-height: calc(100vh - 400px);
}
.content:has(.widget-instructions-products ~ .product-wrap .category-container) {
  padding-bottom: 120px;
}
.content .bottom-button-div.greybox {
  padding-left: 210px;
}
.content.nonav .bottom-button-div.greybox {
  padding-left: 15px;
}
.content ~ .bottom-button-div{
  padding-left: 210px;
}
.content.nonav ~ .bottom-button-div.greybox {
  padding-left: 15px;
}
.popup-help #help-frame {
  width: calc(100% - 80px);
  height: calc(100% - 85px);
  border: unset;
  /* padding-bottom: 40px; */
  box-sizing: border-box;
  min-width: 350px;
}
.popup-help .help-close {
  height: 40px;
  box-sizing: border-box;
  padding: 10px;
}
.help-div-wrap {
  display: inline-block;
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  top: 60px;
  width: 100%;
  box-sizing: border-box;
  padding-left: 195px;
}
.help-div {
  height: 45px;
  width: 300px;
  background-color: #4FDECD;
  margin: 0 auto;
  color: #1E3050;
  padding: 0 10px;
  text-align: center;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  display: table;
  box-sizing: border-box;
  cursor: pointer;
}
.help-cell {
  vertical-align: middle;
  white-space: nowrap;
}

.help-cell:nth-of-type(2) {
  display: table-cell;
  width: 30px;
  font-size: 30px;
}
.help-cell:nth-of-type(3) {
  font-weight: bold;
  text-align: left;
  display: table-cell;
  width: 115px;
}
.help-cell:nth-of-type(1) {
  text-align: right;
  display: table-cell;
  width: 95px;
}
.has-alert .help-div-wrap {
  top: 95px;
}
.help-div-float {
  display: none;
  position: fixed;
  top: 50%;
  left: 205px;
  transform: translate(0, -50%);
  font-size: 42px;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  background-color: #4FDECD;
  z-index: 9;

}

.help-div-float .icon {
  margin: 4px 0px 0px 4px;
  cursor: pointer;
  height: 50px;
}
.popup-help {
  text-align: center;
  z-index: 13;
  width: 100%;
  width: 100vw;
  width: 100dvw;
  height: 100%;
  height: 100vh;
  height: 100dvh;
  box-sizing: border-box;
  position: fixed;
  margin: 0 auto;
  display: none;
  box-shadow: 0 0 10px #000;
  background-color: #F4F2F5;
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: 0;
  max-width: 1000px;
  inset: 0;
}
.left-uncover {
  /* left: unset; */
  animation-name: left-reveal;
  animation-duration: 0.1s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.top-uncover {
  /* left: unset; */
  animation-name: top-reveal;
  animation-duration: 0.1s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.help-div-float:hover .help-float-icon {
  --fa-primary-color: #1e3050; 
  --fa-secondary-color: #F5F5F5; 
  --fa-secondary-opacity: 1;
}
.help-float-icon {
  --fa-primary-color: #ffffff; 
  --fa-secondary-color: #1e3050; 
  --fa-secondary-opacity: 1;
}
.help-div-float:hover  i {
  animation-name: rotate;
  animation-duration: .5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.help-div-float .icon i {
  vertical-align: top;
}
.content.nonav ~ .help-div-float {
  left: 5px;
}
body:has(.content.nonav) .help-div-wrap {
  padding-left: unset;
}
#delivery-markup-update {
  color: green;
}
input:is([type="button"], [type="submit"], [type="reset"]), input[type="file"]::file-selector-button, button, select {
  color: black;
}
#distributor-location-text ~ div #suggestions {
  max-height: 120px;
}
.disabled-div {
  pointer-events: none;
}
.qr-link {
  max-width: 300px;
  margin: 0 auto;
}
.url-box {
  /* word-wrap: break-word; */
  /* max-width: 90%; */
  white-space: nowrap;
  display: block;
  width: calc(100% - 90px);
  margin: 0 auto;
  max-width: 320px;
  position: relative;
  padding: 10px;
  overflow-x: scroll;


}
.right-icon {
  font-size: 16px;
  display: inline-block;
  margin: 0 auto;
  cursor: pointer;
  text-decoration: underline;
}
.right-icon i {
  cursor: pointer;
}
.next-step {
  display: inline-grid;
  width: 300px;
  max-width: 100%;
  /* border: 1px solid #A3A3A3; */
  grid-template-columns: 60px 3fr;
  grid-template-rows: 1fr;
  border-radius: 10px;
  align-items: center;
  height: 50px;
  margin: 20px 25px;
  border-top-left-radius: 10px;
  color: #565557;
  font-size: 16px;
  cursor: pointer;
}
.step-icon {
  grid-column: 1 / span 1;
  grid-row: 1 / span 1;
  background-color: darkgrey;
  color: white;
  padding: 11px 0;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border: 1px solid #A3A3A3;
  border-right: unset;
  overflow: hidden;
  height: 50px;
  box-sizing: border-box;
}
.step-button {
  grid-column: 2 / span 2;
  grid-row: 1 / span 1;
  background-color: white;
  cursor: pointer;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border: 1px solid #A3A3A3;
  border-left: unset;
  height: 50px;
  box-sizing: border-box;
  font-family: 'Unity';
  align-content: center;
  font-weight: bold;
}
.step-icon i {
  font-size: 26px;
}
.next-step.complete-step .step-icon {
  background-color: #8EB383;
}
.next-step.email-step .step-icon {
  background-color: #A1A0A1;
}
.next-step-area {
  width: 750px;
  max-width: 100%;
  min-width: 250px;
  margin: 0 auto;
  font-size: 16px;
  padding: 15px;
  box-sizing: border-box;
}
.next-step-text {
  font-family: 'Unity';
}
.nex-step-sub {
  font-weight: bold;
  font-size: 18px;
  margin: 10px 0;
  font-family: 'Unity';
}
.tab-menu {

  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  margin-left: 7px;
  border-bottom: 2px solid #d7d7d7;
  margin-bottom: 3px;
}
.tab-cell {
  display: inline-block;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background-color: white;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 5px;
  padding-bottom: 7px;
  border-top: 1px solid #d7d7d7;
  border-left: 1px solid #d7d7d7;
  border-right: 1px solid #d7d7d7;
  cursor: pointer;
}
.tab-cell-selected {
  display: inline-block;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  min-height: 100%;
  background-color:#f4f4f4;
  height: 100%;
  padding:5px 15px;
  border-top: 1px solid #d7d7d7;
  border-right: 1px solid #d7d7d7;
  border-left: 1px solid #d7d7d7;
  border-bottom: 2px solid #ff2e39;
}
.tab-menu.sign-in .tab-cell {
    background-color: #F4F4F4;
    color: #868686;
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 3px;

}
.tab-menu.sign-in .tab-cell a {
    color: #868686;

}
.tab-menu.sign-in .tab-cell-selected {
    background-color: #ffffff;
    color: black;
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 3px;
}
.tab-menu.sign-in {
    margin-top: 10px;
    margin-bottom: 10px;
}
.product-review-wrap {
  text-align: left;
  width: 500px;
  max-width: 100%;
  margin: 0 auto;
  /* display: table; */
  border-collapse: collapse;

  max-height: calc(100dvh - 485px);
  overflow-y: auto;

  background-color: white;
  padding: 10px;
  border-radius: 5px;
  box-sizing: border-box;
  font-size: 14px;
}

.product-review-title {
  color: grey;
  font-size: 20px;
  font-weight: bold;
  display: table-row;
}
.product-review-store {
  display: contents;
}
.product-review-row {
  display: table-row;
  width: 100%;
  padding-left: 10px;
  box-sizing: border-box;
}
.product-review-row:nth-of-type(2) {
  border-bottom: 1px solid lightgrey;
}
.product-review-row:nth-of-type(1) {
  height: 30px;
  vertical-align: bottom;
}
.product-review-store:nth-of-type(1) .product-review-row:nth-of-type(1) {
  margin-top: 0;
}
.product-review-cell {
  display: table-cell;
  width: calc(100% - 190px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 310px;
  vertical-align: bottom;
}
.product-review-cell.count, .product-review-cell.info {
  width: 170px;
}
.product-review-cell.count {
  font-weight: bold
}
.product-review-cell.store {
  font-weight: bold
}
.product-review-cell.spacer {
  width: 20px;
}
.product-review-store:last-of-type .product-review-row:nth-of-type(2) {
  border-bottom: 1px solid transparent;
}
.product-review-cell.justmobile {
  display: none;
}
.product-count {
  font-size: 20px;
  margin: 20px 0;
}
#advanced-fields {
  /* display: table; */
  width: 100%;
}
.advanced-fields-left, .advanced-fields-right {
  display: inline-grid;
  width: 49%;
  width: calc(50% - 10px);
}
#advanced-fields .formrow {
  margin: 0;
}
#advanced-fields .formrow  input[type=text],  #advanced-fields .formrow  select {
  margin: 5px 0;
  border: 1px solid #ccc;
}
.formbox select.half-width {
  width: 160px;
}
.product-review-title img {
  height: 40px;
  vertical-align: middle;
  margin-right: 5px;
}
.whitebox {
    background-color: white;
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
    margin: 10px 0;
    border-radius: 5px;
    border: 1px solid #DBDBDB;
    text-align: center;
    cursor: pointer;
}
.task-store-name {
    font-weight: bold;
    font-family: 'Unity';

    font-size: 18px;
}
.task-store-address {
    font-size: 16px;
    font-family: 'Unity';

}
.task-header {
    font-weight: bold;
    font-size: 22px;
    font-family: 'Unity';
}
.pepsi-header-logo {
    width: 800px;
    margin-top: 10px;
    max-width: 90%;
    max-width: calc(100% - 60px);
}
.product-methods {
    display: table;
    width: 100%;
}
.product-method {
    display: table-cell;
    width: 50%;
    padding: 30px;
    box-sizing: border-box;
}
.product-method:first-of-type {
    background-color: #F5F5F5;
}
.product-method {
    background-color: #E4E4E4;
}
.popup-window-large:has(.product-method) i.fas.fa-times-circle, .popup-window-large:has(.product-method-box) i.fas.fa-times-circle{
    display: none;
}
.popup-window-large:has(.product-methods) > br {
    display: none;
}
.product-method-box {
    width: 300px;
    background-color: #050599;
    color: white;
    border-radius: 30px;
    display: table;
    margin: 0 auto;
    padding: 5px;
    font-family: 'Unity';
    cursor: pointer;
    margin-top: 20px;
    height: 50px;
}
.product-method-box.invert {
    background-color: white;
    color: #050599;
    margin: 10px 0;
    width: 275px;
}
.product-method-box.invert .product-method-title {
    color: black;
    text-align: center;
    padding-right: 20px;
}
.product-method-icon {
    display: table-cell;
    width: 50px;
    vertical-align: middle;
}
.product-method-info {
    display: table-cell;
    width: calc(100% - 50px);
    vertical-align: middle;
    line-height: 1;
}
.product-method.manual .product-method-box {
    background-color: black;

}
.product-method-icon i {
    font-size: 50px;
}
.product-method-icon i.fa-loader.fa-spin {
    font-size: 40px;
}
.product-method-title{
    font-size: 18px;
}
.product-method-text {
    font-family: 'Unity';
    font-size: 11px;
    margin-top: 10px;
}
.popup-window-large:has(.next-step-area.next-step-confirm) {
    background-color: white;
}
.next-step-bottom {
    font-family: 'Unity';
    padding: 30px 0;
    background-color: #E4E4E4;
}
.product-method-image img {
    max-height: 440px;
}
.pepsi-complete-bottom {
    font-family: 'Unity';
    color: #858585;
    margin-top: 15px;
}
.pepsi-complete-bottom a {
    color: #858585;
}
.product-method-mobile {
    display: none;
}
.language-selector {
    color: white;
    /* font-size: 40px !important;
    font-weight: 300 !important; */
    font-family: 'Unity';
    font-weight: bold;
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;
    position: relative;
}
i.language-selector {
    color: white;
    font-size: 40px !important;
    font-weight: 300 !important;
    vertical-align: middle;
}
.login-logo > a {
    vertical-align: middle;
}
.language-menu {
    display: none;
    position: absolute;
    right: 0;
    z-index: 10003;
    text-align: left;
    box-sizing: border-box;
    top: 33px;
    webkit-box-shadow: 5px 5px 6px 1px rgb(0 0 0 / 11%);
    -moz-box-shadow: 5px 5px 6px 1px rgba(0,0,0,.11);
    box-shadow: 5px 5px 6px 1px rgb(0 0 0 / 11%);
    background-color: #fff;
    cursor: default;
    color: black;
    border-radius: 5px;
    border: 1px solid #dddddd;
    width: fit-content;
    font-size: 16px;
}
.notification-item {
    padding: 10px;
    border-bottom: 1px solid #dddddd;
    font-family: 'Unity';
    cursor: pointer;
    width: 100%;

    display: grid;
    grid-auto-flow: column;
    box-sizing: border-box;
    margin-right: 15px;
    z-index: 100000;
}
.notification-item:last-of-type {
    border-bottom: 0px;
}
.notification-item i {
    font-size: 14px;
}
.notification-item:hover {
    background-color: lightgrey;
}
.notification-item:last-of-type:hover {
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
.notification-item:first-of-type:hover {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}
.notification-item.selected .language-check-icon{
    /* display: inline; */
    visibility: visible;
}
i.language-check-icon {
    text-align: right;
    visibility: hidden;

    align-self: center;
    justify-self: flex-end;
}
.language-error {
    max-width: 150px; 
    padding: 10px 10px; 
    font-family: "Unity";
    word-break: break-word;
    white-space: normal;
}
.language-display-wrap {
    width: fit-content;
    margin-left: auto;
    padding: 2px 10px 5px 10px;
    height: 32px;
    box-sizing: border-box;

        background-color: white;
        border-radius: 5px;
        color: black;
        font-size: 18px;
        line-height: 27px;
}
.language-cell {
    /* vertical-align: middle; */
    padding: 0 8px;
}
.language-cell:nth-of-type(2) {
    padding-left: 0;
    padding-right: 5px;

}
.language-cell:nth-of-type(1) {
    padding-left: 0;
    padding-right: 3px;
}
.language-cell > i.fa-angle-down {
    font-size: 18px;
}
.language-selector .icon-language-dropdown {
    font-size: 18px;
    margin-right: 5px;
    font-weight: 300 !important;
}
.mobile-menu-toggle {
    vertical-align: middle;
    padding-left: 10px;
}
.tracker-menu {
    font-family: Unity;
    display: grid;
    background-color: #f4f4f4;
    grid-auto-flow: column;
    grid-template-columns: max-content max-content auto;
    grid-gap: 20px;
    padding: 0 10px;
    border-radius: 5px;
    width: calc(100% - 10px);
    margin: 0 auto;
    box-sizing: border-box;
    align-items: center;
}
.tracker-menu-right {
    display: inline-grid;
    grid-auto-flow: column;
    margin: 5px 0;
    justify-items: flex-end;
    justify-content: end;
    grid-gap: 40px;
    align-items: center;
}
.tracker-menu-cell {
    margin: 5px 0;
    padding: 5px 15px;
}
.tracker-menu .tracker-menu-right-cell i.light {
    font-weight: normal !important;
}
.tracker-menu-cell.selected, .tracker-menu-right-cell.selected {
    background-color: white;
    border-radius: 5px;
}
.tracker-filters {
    display: none;
    padding: 10px;
    background-color: #f4f4f4;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    text-align: center;
    width: calc(100% - 10px);
    margin: 0 auto;
    box-sizing: border-box;
    border-top: 1px solid lightgrey;
    font-family: Unity;
}
.tracker-filters .qb-input {
    background-color: white;
}
.tracker-menu-right-cell {
    margin: 5px 0;
    padding: 5px 15px;
}
/* .header-account:has(.mobile-menu-toggle) .language-menu{
    right: 49px;
} */
/* .mobile-menu-toggle ~ .language-menu{
    display: none;
} */
.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
/*MBM specific*/
.content .edit-combo .combo-save {
    bottom: 35px;
}
.content .edit-combo {
    padding-bottom: 90px;
}
.center {
    text-align: center;
}
@keyframes left-reveal {
  0% {left: 0%;}
  10%{left: 5%}
  20%{left: 10%}
  30%{left: 15%}
  40%{left: 20%}
  50%{left: 25%}
  60%{left: 30%}
  70%{left: 35%}
  80%{left: 40%}
  90%{left: 45%}
  100%{left: 50%}
}
@keyframes top-reveal {
  0% {top: calc(0% + var(--top));}
  10%{top: calc(5% + var(--top))}
  20%{top: calc(10% + var(--top))}
  30%{top: calc(15% + var(--top))}
  40%{top: calc(20% + var(--top))}
  50%{top: calc(25% + var(--top))}
  60%{top: calc(30% + var(--top))}
  70%{top: calc(35% + var(--top))}
  80%{top: calc(40% + var(--top))}
  90%{top: calc(45% + var(--top))}
  100%{top: calc(50% + var(--top))}
}
@keyframes beat{
	to { transform: scale(1.4); }
}
@keyframes inwardbeat {
  to { transform: scale(0.8); }
}


@keyframes shake {
  0% {transform: rotate(0deg);}
  33% {transform: rotate(-1deg);}
  66% {transform: rotate(0deg);}
  100% {transform: rotate(1deg);}
}
@keyframes rotate {
  0% {transform: rotate(0deg);}
  12% {transform: rotate(45deg);}
  25% {transform: rotate(90deg);}
  37% {transform: rotate(135deg);}
  50% {transform: rotate(180deg);}
  62% {transform: rotate(225deg);}
  75% {transform: rotate(270deg);}
  87% {transform: rotate(315deg);}
  100% {transform: rotate(360deg);}
}

@media(max-width: 1900px) {
    .footer-top-right img {
        margin-top: -32px;
    }
}
@media(max-width: 1600px){
    .header-content{
        font-size: 16px;
    }
    .header-account {
        min-width: 130px;
    }
    .header-link {
        margin: 0 10px 10px 10px;
    }
    .footer-help-title {
        margin-top: 45px;
    }
    .footer-top-right img {
        width: 75%;
    }
    .instructions-side,.instructions-side-2 {
        width: 600px;
    }
    .remove-break2 {
        display: none;
    }
    .widget-instructions-products {
        max-width: 918px;
        /* padding-right: 12px; */
    }

}
@media(max-width: 1350px){
    .no-small-desktop {
        display: none;
    }
    .footer-top-right img {
        width: 100%;
    }
    .header-links {
        width: 68%;
    }
    /* .note-text {
        margin: 20px;
    }
    .instructions-note {
      height: 241px;
      width: 225px;
    } */
    .top4 {
        top: 370px;
    }
    .instructions-side {
        margin-top:10px;
    }
    .top2, .instructions-side-2  {
        top: 425px;
    }
    .remove-break {
        display: none;
    }
    .add-break {
        display: block;
        margin-top:40px;
    }
    .instructions-side, .instructions-side-2 {
        width: 640px;
        left: 32%;
    }
    .google-instructions-link{
        padding-top:50px;
    }
    .instructions-side div:only-child {
        margin-top: 70px;
    }
    .maininst {
        padding-top: unset;
    }
    .widget-instructions-products {
        max-width: 907px;
        padding-right: 0px;
    }
}
@media(max-width: 1150px){
    .header-content{
        font-size: 14px;
    }
    .header-links {
        width: 67%;
    }
    .widget-instructions-products {
        max-width: 790px;
        padding-right: 0px;
    }
}
@media(max-width: 1023px){
    .inline-1-12, .inline-2-12, .inline-3-12, .inline-4-12, .inline-5-12, .inline-6-12, .inline-7-12, .inline-8-12, .inline-9-12, .inline-10-12, .inline-11-12, .inline-1-5, .inline-2-5, .inline-3-5, .inline-4-5 {
        width: 100%;
        padding: 0;
        margin: 0px 0px 10px 0px;
    }
    .justmobile {
        display: block;
    }
    .nomobile, .pepsi-steps-cell {
        display: none;
    }
    .active-track .pepsi-steps-cell {
        display:table-cell;
        font-size:7.3px;
    }

    .login-footer {
        height: 98px;
    }

    .pepsi-optimization {
        font-size: 12px;
    }
    .pepsi-confirm {
        display: block;
    }
    .pepsi-img {
        display: block;
        width: 100%;
        height: 56.22vw; 
    }

    .pepsi-text, .pepsi-text-1, .pepsi-text-2 {
        display: block;
        max-width: unset;
        position: unset;
    }


    .pepsi-text-1 {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .pepsi-text-2 {
        font-size: 14px;
    }

    .pepsi-login, .pepsi-login-1, .pepsi-login-2 {
        display: block;
    }

    .pepsi-login {
        margin-top: 0px;
    }
    .pepsi-login-1 {
        width: 100%;
        height: 50vh;
        position: relative;
        z-index: 1;
    }
    #pepsi-login-1-header {
        top: 1vh;
    }

    #pepsi-login-1-footer {
        display: none;
    }

    #pepsi-login-1-footer-mobile {
        display: block;
        width: 100%;
        text-align: center;
        font-family: Unity;
        font-size: 10px;
        line-height: 2;
        color: #aaaaaa;
        margin-top: 20px;
    }

    #pepsi-login-1-footer-mobile a {
        color: #aaaaaa;
    }

    .pepsi-login-2 {
        height: unset;
        margin-top: -9vh;
        position: relative;
        z-index: 10;
    }

    .pepsi-complete-2 {
        position: unset;
    }


    .additional-service {
        width: 48%;
    }
    .additional-title {
        font-size: 9px;
    }

    #steps-campaign {
        margin-top: 70px;
    }

    .right-red-border {
        border-right: 0px solid white;
    }
    .manage-box {
        max-width: 100%;
        margin:20px 0px;
    }
    .login-content {
        min-height: calc(100vh - 153px);
        margin-top: 55px;
    }
    .Pepsi .login-content {
        margin-top: 0px;
    }
    .login-content .login-greybox {
        margin-top: 0px;
    }

    /* .login-header, .login-right {
        display: block;
        text-align:center;
        padding: 2px;

    } */

    .Pepsi .login-header {
        position: unset;
    }

    .login-logo {
        /* display: block; */
        /* text-align:center; */
        padding: 2px 2px 2px 10px;
        vertical-align: middle;
    }

    .right-desktop, .center-mobile, .left-desktop {
        text-align: center !important;
    }
    .verification-box {
        padding: 10px;
    }
    .postit-form {
        margin-top: 0px;
    }
    .no-small-desktop {
      display: initial;
    }

    #account-div:hover .account-dropdown {
      display: none;
    }
    .header-links {
      display: none;
      position: absolute;
      top: 0;
      right: 0;
      background-color: #262626;
      height: 100vh;
      margin-top: 0;
      z-index: 16;
      width: 300px;
    }
    /* .header-logo {
      width: 300px;
    } */
    .header-content {
      text-align: center;
    }
    .header-account {
        min-width: unset;
    }
    .content {
      left: 0;
      min-height: calc(100vh - 150px);
      width: unset;
    }
    .top2 {
      margin-top: 0px !important;
    }
    .manage-button-button {
        padding-right: 35px;
    }
    .header-link{
      display: block;
      margin: 20px 10px;
      padding: 20px 10px;
      /* border: 1px solid white; */
      width: 85%;
      border-radius: 5px;
    }
    .header-link.selected {
      border-bottom:none;
    }
    #mobile-bars {
      display: initial;
      font-size: 40px;
      top: 15px;
      right: 8%;
      position:absolute;
    }
    .mobile {
      display: inherit;
    }
    .desktop {
      display: none !important;
    }
    #sidebar-close {
      display: block;
      margin-top: 20px;
      text-align: left;
      margin-left: 20px;
      font-size: 30px;
    }
    .footer-top-right img {
      width: 120%;
    }

    .link-wrapper {
      width: 100%;
    }

    /* .footer-links {
      top: 30%; 
       width: 70%;
    } */

    .footer-mid img {
      margin-left: 25px;
    }
    .footer-mid {
      display: none;
    }
    /* .header-logo img {
      width: 250px;
    } */
    .action-box {
      max-width: 300px;
    }
    .action-box.brand, .action-box.brand .action-mid img {
      max-width: 500px;
    }
    
    .action-mid, .action-mid img {
      height: 110px;

    }
    /* .action-bottom {
      height: 55px;
    } */
    .action-bottom-text {
      vertical-align: top;
      height: 80%;

    }
    .header-link.selected a {
      border-bottom: 1px solid white;
    }
    .action-box.large {
      max-width: 625px;
    }
    .action-bottom-button {
      padding-left: 5px;
    }
    .header-title {
      color: #F40107;
    }
    .sidebar {
      display: none;
      /* width: 20%; */
      z-index: 106;
      height: 100%;
      top: 0;
      left: unset;
      right: 0;
    }
    .content {
      /* width: unset; */
    }
    .action-box.steps {
      max-width: 300px;
    }
    .elevate {
        margin-top: -26px;
    }

    .instructions {
      text-align: center;
    }
    
    .instructions-side, .instructions-note, .top4, .instructions-side-2{
      text-align: left;
      left: 0%;
      top: 0%;
      width: 100%;
      padding: 10px;
      box-sizing: border-box; 
      position: unset !important;
      display: block;
      transform: unset;
      height: auto;
      background-image: unset;
    }
    .content {
      text-align: center;

      left: 0%;
      top: 60px;
      width: 100%;
      padding: 10px;
      padding-bottom: 50px;
      box-sizing: border-box; 
      position: relative;
      display: block;
      transform: unset;
      height: auto;
      background-image: unset;

    }
    .content.nonav {
        top: 0;
      padding: 10px;
      padding-bottom: 130px;

    }

    .top-mobile {
      /* margin-top: 125px; */
    }

    .note-text {
        margin: 0px;
    }




    
    /* .header-bm-logo {
      width: 75%;
    } */

    /* forms */
    .formlabel, .formbox {
        width: 100%;
        text-align: left;
        padding: 0;
        margin: 0;
    }
  
    .formlabel {
        line-height: 1.2;
    }
  
    .formbox {
        margin-bottom: 15px;
        line-height: 35px;
    }
    .table-list {
        display: block;
    }
    .row-list {
        display: block;
        width:100%;
    }
    .cell-list {
        display: inline-block;
        width: 49%;
    }
    .row-list-header {
        display: none;
    }
    .edit-buttons {
        max-width: 100%;
    }
    .edit-product-info input[type="text"] {
        width: 94%;
    }
    .edit-product-info select {
        width: 94%;
    }
    .popup-window-large {
        width: 700px;
    }
    .mobi-image div {
        font-size: 18px;
    }
    .sidebar-item i {
        font-size: 30px;
    }
    .sidebar-item img {
        height: 39px;
        width: 39px;
    }
    .sidebar-item {
        margin: 20px 30px;
    }
    .request-menu {
        padding: 0 20px;
    }
    #step-one {
        margin-left: unset;
    }
    .footer {
        position: unset;
        width:100%;
    }
    .action-top {
        font-size: 18px;
    }
    .footer-link {
        display: block;
        line-height: 1.5;
    }
    .footer-link:after {
        content: "";
    }
    .mobile-select {
        display:block;
        text-align: center;
    }
    .mobile-select .niceselect {
        width: 100%;
    }
    .slimbox {
        width: 75%;
        min-width: auto;
    }
    .half-desktop {
        width: 100%;
        display: block;
    }
    .desktop-right-mobile-center {
        text-align: center;
    }
    .google-instructions-link{
        padding-top:25px;
    }
    .instructions-side div:only-child {
        margin-top: unset;
    }
    .add-break {
        margin-top:unset;
    }
    .content.nonav {
        width: 100%;
    }
    .add-menu-instructions {
        width: calc(100% - 20px);
        text-align: left;
        padding: 10px;
    }
    .extend-top {
        padding-top: 5px;
    }
    .smallbox {
        width: 100%
    }
    .sidebar-item.settings-sidebar {
        margin-top: auto;
    }
    .sidebar.collapse:hover .sidebar-item {
        width: auto; 
        text-align: center;
    }
    .sidebar.collapse:hover .sidebar-text {
        display: none;
    }
    .sidebar-collapse-wrap.collapse + .content {
        left: 0;
        width: 100%;
    }
    .sidebar.collapse .sidebar-item {
        width: 50px;
    }
    .sidebar {
        bottom: 0;
    }
    .sidebar-collapse-wrap {
        display: none;
    }
    .footer.collapse {
        width: 100%;
    }
    .sidebar.collapse .sidebar-item {
        text-align: center;
    }
    .manage-box.no-product .warning i {
        top: 5px;
        left: -10px;
    }
    .action-box.featured {
        width: 625px;
        max-width: 625px;   
    }
    .action-box.featured .action-mid img {
        max-width: 625px;
    }
    .mobile-inline {
        display: inline-block;
    }
    .product-table.imageview .product-row {
        display: inline-block;
        margin: 10px;
        width: 400px;
        height: 400px;
        border: 1px solid #F5F5F5;
        margin: 0;
        position: relative;
        border-radius: 10px;
        margin: 20px 30px;
        cursor: default;
        padding: 0;
        vertical-align: top;
    }
    .product-table.imageview .noimageview {
        display: none;
    }
    .product-table.imageview .product-table-header {
        display: none;
    }
    .imageview .noimageview {
        display: none;
    }
    .imageview .imageviewonly {
        display: inherit;
        height: 370px;
    }   
    .imageview .product-cell.imageviewonly img {
        width: 400px;
        height: 370px;
        object-fit: cover;
    }
    .imageview .product-cell {
        padding: 0;
    }
    .imageview #image {
        background-color: white;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        margin: 0;
    }
    .imageview #name {
        position: absolute;
        text-align: center;
        width: 100%;
        left: 0;
        margin: 0;
    }
    .imageview #date {
        position: absolute;
        top: 93.5%;
        right: 1%;
        text-align: right;
    }
    .imageview #upc {
        position: absolute;
        top: 93.5%;
        left: 1%;
        text-align: left;
    }
    .imageview .product-cell.button:nth-child(3n) {
        position: absolute;
        top: 93.5%;
        left: 60%;
        width: unset;
    }
    .imageview .product-cell.button:nth-child(3n + 1) {
        position: absolute;
        top: 93.5%;
        left: 40%;
        width: unset;
    }
    .imageview .product-cell.button:nth-child(3n + 2) {
        position: absolute;
        top: 93.5%;
        left: 50%;
        width: unset;
    }
    .imageview .mobile-inline {
        display: none;
    }
    .product-row {
        display: block;
        height: fit-content;
        padding: 10px 5px;
    }
    .product-cell {
        display: inline-block;
        width: 30%;
        padding: 5px;
        margin: 5px;
        vertical-align: top;
    }
    .product-cell:has(.tracker-cell) {
        display: table-cell;
        width: auto;
    }

    .product-cell.imageviewonly {
        display: block;
        width: 100%;
        text-align: center;
    }
    .product-cell.imageviewonly img {
        height: 75px;
        width: 75px;
    }
    .product-table-header {
        display: none;
    }
    .widget-instructions-products {
        max-width: 555px;
        padding-right: 0px;
    }
    .header-bm-logo {
        /* text-align: center; */
    }
    #client-select {
        width: calc(100% - 20px);
    }
    .continue-later-wrap {
        margin: 0 auto; 
        padding-left: 20px;
    }
    .advanced-settings-wrap {
        margin: 0 auto; 
    }
    .content:has(.bottom-box){
        padding-bottom: 160px;
    }
    .external-location-table ~ .widget-header > .inject-category{
        max-height: calc(100vh - 370px);
    }
    .external-location-info ~ .widget-header > .inject-category {
        height: calc(100vh - 330px);
    }
    .content:has(.widget-instructions-products ~ .product-wrap .category-container) {
        padding-bottom: 150px;
    }
    .content .bottom-button-div.greybox, .content ~ .bottom-button-div {
        padding-left: 15px;
    }
    .help-div-wrap {
        padding-left: unset;
    }
    .help-div-wrap ~ .content {
        margin-top: 105px;
    }
    .help-div-float {
        left: 5px;
    }
    input, body, button, .content {
        font-size: 16px;
    }
    .content.nonav {
        /* padding-bottom: 30px; */
    }
    .manage-button-button i.fa-loader {
        vertical-align: top;
    }
    .action-bottom-text {
        font-size: 14px;
    }
    .help-yellow {
        font-size: 16px;
    }
    .greybox.bottom-box {
        padding: 10px;
    }
    #agree-terms {
        font-size: 12px;
    }
    .edit-save {
        padding: 8px 10px;
    }
    #distributor-location-text ~ div #suggestions {
        max-height: 165px;
    }
    .suggestion {
        line-height: 25px;
    }
    .product-method {
        display: block;
        width: 100%;
        padding: 10px;
    }
    .product-method-box {
        width: 310px;
        max-width: 100%;
    }
    .product-method-title {
        font-size: 18px;
    }
    .product-method-image img {
        max-height: 440px;
        width: 250px;
        margin: 0 auto;
    }
    .pepsi-sides{
        display: block;
        width: 100%;

    }
    .pepsi-side-text {
        display: block;
        width: 100%;
        text-align: center;


    }
    .pepsi-side-text .product-method-box.invert{
        margin: 0 auto;
    }
    .pepsi-side-img img  {
        width: 100%;
    }
    .pepsi-side-img{
        display: block;
        width: 100%;
    }
    .pepsi-side-text ul {
        font-family: "Unity";
        max-width: fit-content;
        margin: 0 auto;
        text-align: left;
    }
    .mobile-extend {
        width: calc(100% + 20px);
        margin-left: -10px;
        box-sizing: border-box;
    }
    .product-method-mobile {
        display: block;
    }
    .product-method-desktop {
        display: none;
    }
}
  @media(max-width: 800px) {
    .footer-top-right {
      width: 40%;
    }
    .footer-top-left {
      width: 40%;
    }
    /* .header-logo {
      width: 250px;
    } */

    .footer-mid img {
      margin-left: 0;
    }
    .header-link {
      margin: 5px;
    }
    .footer-top-right img {
      width: 100%;
    }
    .popup-window-large {
      width: 475px;
    }
    .mobi-image div {
      font-size: 14px;
    }
    .sidebar-item {
      margin: 20px 35px;
    }
    /* .inject-mod-group {
      width: 100%;
    }
    .inject-mod-group:nth-child(2n) {
      margin: 20px 0;
    } */
    .content {
      min-height: calc(100vh - 90px);
  }
  .modifier-wrap {
    width:70%;
  }

  }
  @media(max-width: 667px) {
    /* .footer-links {
      width: 60%;
      top: 15%;
    } */

    .popup-window{
      width: 450px;
    }
    .edit-cell {
      width: 100%;
  }
  .sidebar {
    padding: 10px;
}
.sidebar-item {
  margin: 20px 25px;
}
.request-text {
  width: 100%;
}
.request-button {
  width: 100%;
  text-align: center;
}
.link-menus-button {
  text-align: center;
}
.edit-product-info {
  padding-bottom: 50px;
}
.slimbox {
  width: 95%;
}

.manage-box {
  /* display: inline-block; */
  border-radius: 15px;
  width: 100%;
  box-sizing: border-box;
  height: 185px;
  border: 1px solid #DEDEDE;
  overflow: hidden;
  margin: 10px 0px;
}
.manage-box-wrap {
  width: 100%;
  margin: 0;
}
.manage-top {
  /* display: block; */
  height: 45px;
  width: 100%;
  background-color: #E1E1E1;
  max-width: 100%;
}


.manage-title {
  /* display: inline-block; */
  margin-top: 5px;
  width: 50%;
  margin-left: 5px;
  font-weight: bold;
  word-break: none;
  vertical-align: middle;
}


.manage-button {
  /* display: inline-block; */
  width: 45%;
  text-align: right;
  margin-right: 3px;
  vertical-align: middle;
  margin-top: 2px;
}

.manage-bottom img {
  width: 100%;
  height: 155px;
}
.manage-box.large .manage-bottom img {
  width: unset;
  height: unset;
}
.manage-button-button {
  padding: 4px 30px 4px 10px;
  position: relative;
  background-color: white;
  border: 1px solid #DEDEDE;
  border-radius: 5px;
  font-weight: bold;
  cursor: pointer;
}
.manage-box.large {
  width:400px;
  height: unset;
}
.large .manage-top{
  width: 400px;
}
#eye {
  right: 15px;
}
.two-button-row {
  display: block;
  width: 100%;
  margin: 0 auto;
}
.two-button-row-first,
.two-button-row-second {
  display: block;
  width: 100%;
  margin: 10px auto;
  text-align: center;
}
.action-box.featured {
  width: 425px;
  max-width: 425px;   
}
.action-box.featured .action-mid img {
  max-width: 425px;
}
.action-box.featured {
  width: 425px;
  max-width: 425px;   
}
.action-box.featured .action-mid img {
  max-width: 425px;
}
.widget-instructions-products {
  max-width: 425px;
  padding-right: 0px;
}
.two-button-row.mobile-table {
  display: table;
}
.two-button-row.nomobile {
  display: none;
}
.tab-menu.sign-in .tab-cell, .tab-menu.sign-in .tab-cell-selected {
    padding-left: 10px;
    padding-right: 10px;

}
.mobi-title {
    font-size: 24px;
}
  }
  @media(max-width: 475px) {
    .footer-top-right {
      width: 50%;
    }
    .footer-top-left {
      width: 40%;
    }
    .footer-help-text button {
      position: absolute;
      left: 45%;
      top: 65%;
      padding: 5px 40px 5px 10px;
    }
    .footer-help-text button i {
      right: 5%;
      top: 15%;
      font-size: 20px;
    }
    .footer-help-title {
      margin: 20px 0 0 0;
    }
    .footer-help-text {
      margin: 0 0 15px 0;
    }
    .footer-mid img {
      /* width: 200px; */
      width: 150px;
      margin-bottom: 20px;
    }

    .footer-mid {
      height: 150px;
    }

    #mobile-bars {
      right: 2%;
    }

    .popup-window{
      width: 350px;
      max-width: calc(100vw - 6px);
    }
    /* .action-bottom {
      height: 70px;
    } */
    .popup-window-large {
      width: calc(100vw - 6px);
    }
    .mobi-image div {
      font-size: 14px;
    }
    .header-bm-logo > img {
      /* height: 30px; */
      max-width: 170px; /*parent set this + 20px*/
      max-height: 50px;
      object-fit: contain;
    }
    .header-rep-logo > img {
      height: 30px;
    }
    .header-bm-logo {
      min-width: 190px;
      text-align: left !important;
    }

    .content {
      min-height: calc(100vh - 115px);
    }
    .manage-box.large {
      width:300px;
      height: unset;
    }
    .large .manage-top{
      width: 300px;
    }
    #eye {
      right: 5px;
    }
    .action-box.featured {
      width: 300px;
      max-width: 300px;   
    }
    .action-box.featured .action-mid img {
      max-width: 300px;
    }
    .product-table.imageview .product-row {
      width: 300px;
      height: 300px;
      margin: 15px 5px;
  }

  .imageview .product-cell img {
      width: 300px;
      height: 270px;
      object-fit: cover;
  }

  .imageview #date {
      right: 1%;
      top: 92%;
  }

  .imageview #upc {
      left: 0%;
      top: 92%;
  }

  .imageview .product-cell.button:nth-child(3n) {
      top: 92%;
      left: 57%;
  }

  .imageview .product-cell.button:nth-child(3n + 1) {
      top: 92%;
      left: 36%;

  }

  .imageview .product-cell.button:nth-child(3n + 2) {
      top: 92%;
      left: 47%;

  }

  .imageview #name {

      /* top: 80%; */

  }
    .imageview .product-cell.imageviewonly img {
      width: 300px;
      height: 270px;
      object-fit: cover;
  }
  .imageview .imageviewonly 
  {
    height: 270px;
  }
  .action-box.featured {
    width: 100%;
    max-width: 300px;   
  }
  .action-box.featured .action-mid img {
    max-width: 100%;
  }
  .content:has(.bottom-box){
    padding-bottom: 180px;
  }
  .product-search ~ .inject-category {
    height: calc(100vh - 310px);
  }
  .content.nonav.small-bottom:has(.external-location-table) {
    padding-bottom: 30px;
  }
  .content.nonav.small-bottom:has(.external-location-info) {
    padding-bottom: 30px;
  }
  .external-location-info ~ .widget-header > .inject-category {
    height: calc(100vh - 270px);
  }
  .content:has(.widget-instructions-products ~ .product-wrap .category-container) {
    padding-bottom: 160px;
  }
  .content .bottom-button-div.greybox div:nth-of-type(2) {
    margin-top: 5px;
}
.login-logo {
  text-align: left;
}
.pepsi-header-logo {
    /* max-width: calc(100% - 40px); */
    width: 420px;
}
  }
  @media(max-width: 400px) {
    .mobi-title {
        width: 90%;
    }
    .mobi-image {
        margin-top: -25px;
    }
    .footer-help-text button {
      position: absolute;
      left: 55%;
      top: 55%;
      padding: 5px 40px 5px 10px;
    }


    .action-bottom-button button {
      max-width: 100px;
      margin-bottom: 10px;
      vertical-align: bottom;
      float: none;
    }

    .sidebar-item {
      margin: 20px 15px;
    }
    .link-box {
      width: 100%;
    }
    .imageview .product-cell.imageviewonly img {
      width: 250px;
      height: 225px;
      object-fit: cover;
  }
    .product-table.imageview .product-row {
      width: 250px;
      height: 250px;
      margin: 15px 5px;
  }

  .pepsi-header-logo {
    /* max-width: calc(100% - 40px); */
    max-width: 100%;
    width: 350px;
}
  }