@font-face{
  font-family: sourcesans;
  src: url(../../css/fonts/SourceSansPro-Regular.ttf)
}


@font-face{
  font-family: Barlow;
  src: url(../../css/fonts/barlow-semicondensed/BarlowSemiCondensed-Regular.ttf)
}


/* Changes the Body Font*/
body{
  font-family: sourcesans;
  color: #000;
}

/* Changes Bikini Bottom*/
 .menuItemName {
    font-size:17px;
    line-height:1.8;
    font-weight: 600;
}

/* Changes Menu Group Description*/
 .MenuItemDescription {
    font-size:14px;
    line-height:1.2;
    font-weight: 400;
}

/* Changes Price*/
 .menu-item-cost {
    font-size:13px;
    font-weight: 600;
}

/* Changes Price*/
 .MenuItemCost{
    font-size:13px;
    font-weight: 600;
}

/* CHANGE - Changes the majority of the ACCENTS buttons small print details and arrow */
.positive{
  color: #ed3237;  
 }




/* MENU-------------------------------------------------------------------------
/* Changes the menu groups box */
 .MenuGroup{
   background: #f5f5f5;
}

/* Changes the menu groups arrow */
  .menu-group-box{  
    color: #ed3237;
    font-family: sourcesans;
    font-size: 22px;
    line-height:1.1;
    font-weight: 600;
}

   .menu-group-name{
    color: #333333;
    font-family: Barlow;
    font-size:24px;
    line-height:1.1;
    font-weight: 800;
    Text-transform: uppercase;
}

  .menu-group-description{  
    color: #333333;
    font-size:14px;
    line-height:1.6;
    font-weight: 600;
}


.item .item-divider{
  font-family: sourcesans;
}


/* TOP BAR-------------------------------------------------------------------------


/* Shopping cart bag and dev button in the top bar */
.bar-business .button {
}

/* Changes hover color for top bar buttons */
.bar-business .button:hover{
  color: white;
}

/* Change "To Go Menu" Button to get out of a menu item*/
.bar-dark .button.button-clear{
  text-transform: uppercase;
}


/* Changes the top bar */
.bar.bar-dark{
  background-color: #15824c;
  border-color: #15824c;
  border-width: 0px 0px 1px 0px;
  border-style: solid;
  color: black;
}



/* Changes the "Views" font color */
.bar.bar-dark .title{
  background-color: #15824c;
  color: white;
  font-family: sourcesans;
  text-transform: uppercase;
}

/* Changes color around "Views" */
.bar.bar-left{
  background-color: #15824c;
  border-width: 0px 0px 1px 0px;
    border-style: solid;
    color: #789311
}

/* Changes the border around the "Order" popout */
.bar.bar-right{
  background-color:#15824c;
  border-color: #15824c;
  border-width: 0px 0px 1px 0px;
    border-style: solid;
    color: #15824c
}

.bar.bar-dark {
    border-color: #15824c;
    background-color: #15824c;
    background-image: none;
    color: #fff;
}
;
    background-color: #15824c;
    background-image: none;
    color: #fff;
}


/*BOTTOM BAR -------------------------------------------------------------------
/* Changes the bottom bar */
.tabs-striped.tabs-business .tabs {
    color: #ccc;
}

.tabs-striped.tabs-dark .tab-item {
  color: white;
}


/* Changes the bottom bar color */
.tabs-striped.tabs-dark .tabs{
  background-color: #15824c;
}

/* Changes tab items at the bottom of screen */
.tabs-striped.tabs-business .tab-item{
    color: #CCC;
    border-top-width:1px;
}


/* Changes the active items in the bottom bar */
.tabs-striped.tabs-business .tab-item-active{
    color: #555555;
    border-top-width:1px;
}







/* DASHBOARD-------------------------------------------------------------------------

/* Changes menu group colors and tabs under "VIEWS" */
.item-divider{
  color:#222222;
}


.item-divider .item-active{
  background: #f5f5f5;
  color:#222222;
}

.row .item .item-divider .MenuGroup .activated {
  background: #f5f5f5;
  color:#222222;
}


/* DASHBOARD-------------------------------------------------------------------------


/* Changes font color of Tabs under "Views" */


.item .item-content.activated, .item .item-content.activated.item-complex>.item-content, .item .item-content.active, .item .item-content.active.item-complex>.item-content, .item-complex.activated .item-content, .item-complex.activated .item-content.item-complex>.item-content, .item-complex.active .item-content, .item-complex.active .item-content.item-complex>.item-content, .item.activated, .item.activated.item-complex>.item-content, .item.active, .item.active.item-complex>.item-content{
  background: #d9d9d9;
  /* color:#8daf3d; */
}


#splash{
  position: fixed;
  z-index: 99999999;
  padding-top: 32px;
  text-align: center;
  width: 100%;
  background-color:#fff;
  height: 10000px;
}

/*
.taptapeat{
  color:#FFFFFF;
  font-weight: 700;
}
*/

/* controls the "To Go" button when clicked */
.bar .button.back-button.activated{
  color:white;
}




/* CHANGE - checkbox when it is checked CLICKED */
.checkbox input:checked+.checkbox-icon:before{
  border-color: #ed3237;
  background: #dd2a26;
}

/* CHANGE - colors the checkbox before it is checked  */
.checkbox-square .checkbox-icon:before{
  border-color: #ed3237;
}



/* CHANGE - No lite reg extra when idle POSITIVE buttons */
.button.button-positive{
  background-color: #ed3237;
  color: white;
}

/* CHANGE - color of no lite reg extra while clicked POSITIVE */
.button.button-positive.activated{
  background-color: #ed3237;
  border-color: #ce2430;
}

/* CHANGE - Changes "Order Info" button when idle positive buttons */
.button.button-positive.button-outline{
  border-color: #ce2430;
  color: #ed3237;
  font-weight: normal;
}

/* BUTTON - Changes the "order info button when clicked */
.button.button-positive.button-outline.active, .button.button-positive.button-outline.activated{
  background-color: #ce2430;
  color: white;
  font-weight: normal;
}


/* BUTTON - Changes the add to BACK order button BALANCED*/
.button.button-balanced{
  background-color: #15824c;
}

.button.button-balanced.activated{
  background-color: #126035;
  border-color: #15824c;
}



/* CHANGE -  unsure what these are changing */
.button.button-assertive{
  background-color: #15824c; 
  color: white;
}

/* CHANGE - Unsure what this is changing */
.button.button-assertive.activated{
  background-color: #15824c;
  color: white;
}


/* CHANGE - Changes the cancel and back buttons */
.button.button-assertive.button-outline{
  border-color: #126035;
  color: #15824c;
}

.button.button-assertive.button-outline.activated{
  Background: #126035;
  color: white;
}


.button.button-positive.button-clear {
  border-color: transparent;
  background: 0 0;
  box-shadow: none;
  color: #15824c;
}


/* CHANGE - Changes the quantity number */
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
  color: #636363;
}



.ng-dirty.ng-invalid { color:#789311; display:inline; }
.ng-not-empty .ng-valid {color:#789311;}

.fw600{
  font-weight: 600;
  /* font-size: 16px; */
}
.fs12{font-size: 12px;}
.fs14{font-size: 14px;}
.fs16{font-size: 16px;}
.fs18{font-size: 18px;}
.fs20{font-size: 20px;}
.fs24{font-size: 24px;}

.taRight{
  text-align: right;
}

.customer-template{
  /* background:#A9A296; */
  background:rgba(255,254,245,.96);
  background:#DBD9C5;
  background:#FFFFFF;
}


.custom-toggle.toggle-checked{
background-color: #FFFFFF;
}
/* for the toggle Pin */
/*CHANGE - */
.custom-toggle.toggle-checked .toggle-inner{
background-color: #ed3237;
}

.pac-container{/*hides the google address complete */
}




.has-footer.has-tabs {
  bottom: 93px;
}

.sub-footer{
bottom:50px !important;
position: fixed;
}
/*hasn't fixed it yet */



.item-radio input:checked ~ .item-content {
background: #ed3237;
}


/* CHANGE - Change dot in middle of radio button */
.radio-positive .radio-icon:after{
  background: #ed3237 !important;
}

/* CHANGE - Change radio button before */
.radio-positive .radio-icon:before{
    border-color: #ed3237 !important;
}

.item-radio input:checked + .radio-content .radio-icon:after{
  -webkit-transform: scale(1);
  transform: scale(1);
}



/* CHANGE whole and half when selected - */
.circle-positive {
  border-color: #ed3237;
  background:#ed3237;
}

/* CHANGE whole and half not selected - */
.circle-negative {
  border-color:#b2b2b2;
}