/*NEW HEX CODES
Pink - ef207d	
Green - 4cbf9e
Black - 231f21

 */



 @font-face{
    font-family: Body;
    src: url(../../css/fonts/SourceSansPro-Regular.ttf)
  }
  
  
  @font-face{
    font-family: Heading;
    src: url(../../css/fonts/SourceSansPro-SemiBold.ttf)
  }
  
  @font-face{
      font-family: Description;
      src: url(../../css/fonts/palatino-linotype/pala.ttf)
  }
  
  /* Changes the Body Font*/
  body{
    font-family: Body;
    color: #231f21;
    letter-spacing: .5px;
    font-weight: 400;
  }
  
  /* CHANGE - Changes the majority of the ACCENTS buttons small print details and arrow */
  .positive{
    color: #f2bf24;
   }
  
  /* MENU-------------------------------------------------------------------------
  /* Changes the menu groups box */
   .MenuGroup{
     background: #f2f3f4;
     /* was f5f5f5*/
  }
  
  /* Changes the menu groups arrow */
    .menu-group-box{
      color: #0075C9;
      font-family: Heading;
      font-size: 22px;
      line-height:1.1;
      font-weight: 800;
      letter-spacing: 2.5px;
  }
  
     .menu-group-name{
      color: #0075C9;
      font-family: Heading;
      font-size:24px;
      line-height:1.1;
      font-weight: 900;
      Text-transform: uppercase;
      letter-spacing: 0px;
  }
  
    .menu-group-description{
      color: #231f21;
      font-size:13px;
      font-family: Body;
      line-height:1.6;
      font-weight: 600;
      letter-spacing: 1px;
  }
  
  /* Changes Bikini Bottom*/
   .menuItemName {
    color:#231f21;
      font-size:17px;
      font-weight: 600;
      line-height: 95%;
      margin-bottom: 10px;
      position: static;
      
      

      /*position: absolute;
      top: 0;*/
  }
  
  /* Changes Menu Group Description*/
   .MenuItemDescription {
      font-size:14px;
      line-height:1.2;
      font-weight: 400;
      position: static;
      padding-top: 10px;
      padding-bottom:10px;
      color: #636363;
      font-family: Body;
  }

  .item p{
    color:#636363;
  }
  
  /* Changes Price*/
   .menu-item-cost {
      font-size:15px;
      font-weight: 600;
  }
  
  /* Changes Price*/
   .MenuItemCost{
      font-size:13px;
      font-weight: 600;
  }
  
  .item .item-divider{
    font-family: Heading;
  }

  /* TOP BAR-------------------------------------------------------------------------
  
  
  /* Changes the Shopping Cart Icon change the color code below */
  .bar-dark .button.button-icon{
      color: #ffffff;
  }

  .bar-dark .button.button-icon:hover{
      color: #f2f3f4;
  }
  
  /* Changes hover color for top bar buttons */
  .bar-business .button:hover{
    color: #ffffff;
  }
  
  /* Change "To Go Menu" Button to get out of a menu item*/
  .bar-dark .button.button-clear{
    text-transform: uppercase;
    font-family: Heading;
    letter-spacing: 4px;
    font-weight: 900;

  }
  
  
  /* Changes the top bar */
  
  
  
  .bar.bar-dark{
    background-color: #0075C9;
    border-color: #0075C9;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
    color: #ffffff;
    font-family: Heading;
    letter-spacing: 4px;
    font-weight: 900;



  }
  
  
  
  /* Changes the "Views" font color */
  .bar.bar-dark .title{
    background-color: #0075C9;
    Color: #ffffff;
    font-family: Heading;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 4px;

  }
  
  /* Changes color around "Views" */
  .bar.bar-left{
    background-color: #0075C9;
    border-width: 0px 0px 1px 0px;
      border-style: solid;
      color: #ffffff;
      letter-spacing: 4px;
      font-family: Heading;
      font-weight: 900;


  }
  
  /* Changes the border around the "Order" popout */
  .bar.bar-right{
    background-color:#0075C9;
    border-color: #0075C9;
    border-width: 0px 0px 1px 0px;
      border-style: solid;
      color: #ffffff;
      letter-spacing: 4px;
      font-family: Heading;
      font-weight: 900;

  }
  
  /* Might be the one that actually changes the top bar color etc.*/
  .bar.bar-dark {
      border-color: #0075C9;
      background-color: #0075C9;
      border-width: 0px 0px 1px 0px;
      border-style: solid;
      background-image: none;
      color: #ffffff;
      font-family: Heading;
      font-weight: 900;
      letter-spacing:4px;
  }
  
  .button.back-button.buttons.button-clear.header-item{
    color:#ffffff
  }
  
  /*BOTTOM BAR -------------------------------------------------------------------
  /* Changes the bottom bar */
  .tabs-striped.tabs-business .tabs {
      color: #0075C9;
  }
  
  .tabs-striped.tabs-dark .tab-item {
    color: #ffffff;
  }
  
  
  /* Changes the bottom bar color */
  .tabs-striped.tabs-dark .tabs{
    background-color: #0075C9;
  }
  
  /* Changes tab items at the bottom of screen */
  .tabs-striped.tabs-business .tab-item{
      color: #ffffff;
      border-top-width:1px;
  }
  
  
  /* Changes the active items in the bottom bar */
  .tabs-striped.tabs-business .tab-item-active{
      color: #ffffff;
      border-top-width:1px;
  }
  
  .tabs-striped.tabs-dark .tab-item.activated, .tabs-striped.tabs-dark .tab-item.active, .tabs-striped.tabs-dark .tab-item.tab-item-active {
     margin-top: -2px;
     color: #ffffff;
     border-style: solid;
     border-width: 2px 0 0 0;
     border-color: #ffffff;
  }
  
  
  /*Location Card*/

  .title-restaurant.ng-binding{
    color:#231f21;
  }

  .center.col.location-information{
    color:#231f21;
  }
  
  
  /* DASHBOARD-------------------------------------------------------------------------
  
  /* Changes menu group colors and tabs under "VIEWS" */
  .item-divider{
    color:#231f21;
  }
  
  
  .item-divider.item.active{
    background: #d9d9d9;
    color:#231f21;
  }
  
  .row .item .item-divider .MenuGroup .activated {
    background: #f5f5f5;
    color:#231f21;
  }
  
  
  /* 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;
  }
  */
  
  
  /*
  MENU ITEM PAGES—--------------------
  
  
  /* 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: #f2bf24;
    background: #f2bf24;
  }
  
  /* CHANGE - colors the checkbox before it is checked  */
  .checkbox-square .checkbox-icon:before{
    border-color: #f2bf24;
  }
  
  /* NO YES XTRA Buttons*/
  .button.button-small.button-stable.button-positive{
      background-color: #f2bf24;
      color:#fff;
      border-color: #f2bf24;
  }

  .button.button-small.button-positive.lvl-0-button{
    color:#ffffff;
  }

  .fw600.ng-binding{
    color:#000000;
  }
  
  
  /* CHANGE - No lite reg extra when idle POSITIVE buttons */
  .button.button-positive{
    background-color: #0075C9;
    color: #ffffff;
  }
  
  /* CHANGE - color of no lite reg extra while clicked POSITIVE */
  .button.button-positive.activated{
    background-color: #0075C9;
    border-color: #0075C9;
    color:#ffffff;
  }
  
  /* CHANGE - Changes "Order Info" button when idle positive buttons */
  .button.button-positive.button-outline{
    border-color: #0075C9;
    color: #0075C9;
    font-weight: normal;
  }
  
  /* BUTTON - Changes the add to BACK order button BALANCED*/
  .button.button-balanced{
    background-color: #0075C9;
    color:#ffffff;
  }
  
  .button.button-balanced.activated{
    background-color: #0075C9;
    border-color: #0075C9;
    color: #ffffff;
  }

  .button.button-outline.button-balanced{
      border-color:#0075C9;
      color: #ffffff;
  }

  .button.button-block.button-positive.button-outline{
      border-color:#0075C9;
      color:#0075C9;
  }
  
  /* BUTTON - Changes the "order info button when clicked */
  .button.button-positive.button-outline.active, .button.button-positive.button-outline.activated{
    background-color: #0075C9;
    color: #ffffff;
    font-weight: normal;
  }
  
  
  
  /* CHANGE -  unsure what these are changing */
  .button.button-assertive{
    background-color: #f2bf24;
    color: white;
  }
  
  /* CHANGE - Unsure what this is changing */
  .button.button-assertive.activated{
    background-color: #f2bf24;
    color: white;
  }
  
  
  /* CHANGE - Changes the cancel and back buttons */
  .button.button-assertive.button-outline{
    border-color: #f2bf24;
    color: #f2bf24;
  }
  
  .button.button-assertive.button-outline.activated{
    Background: #f2bf24;
    color: #ffffff;
  }
  
  
  .button.button-positive.button-clear {
    border-color: transparent;
    background: 0 0;
    box-shadow: none;
    color: #f2bf24;
  }

  .button-clear.button-positive.fw600::after{
    color:#ffffff;
}

.col.center.button.button-block{
  border: #0075C9;
  border-style: solid;
  border-width: thin;


}

.col.center.button.button-block.ion-chevron-right{
  border:none;
}
.col.center.button.button-block.ion-chevron-left{
  border:none;
}
  
  /* 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: #333333;
  }
  
  
  
  .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: #f2bf24;
  }
  
  .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: #f2bf24;
  }
  
  
  /* CHANGE - Change dot in middle of radio button */
  .radio-positive .radio-icon:after{
    background: #f2bf24 !important;
  }
  
  /* CHANGE - Change radio button before */
  .radio-positive .radio-icon:before{
      border-color: #f2bf24 !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: #f2bf24;
    background:#f2bf24;
  }
  
  /* CHANGE whole and half not selected - */
  .circle-negative {
    border-color:#b2b2b2;
  }