
/* uhuru.css | Uhuru Food and Pies */



legend {background: #777 !important; padding: 5px 10px !important;}


/* overrides for foundation.css */
th, table thead tr th, table thead tr td {color: #A7ABAE !important;}
table tr td {color: #F2F2F2 !important;}
input[type="file"] {width: auto !important;}
.panel, .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p, .panel li, .panel dl {color: white !important;}

/************** Typography Styles *****************/
 /*************************************************/
 
    body {
        background: url("../images/bg.jpg") center no-repeat #000;
	color: #F2F2F2;
        font-family: Trebuchet MS,Arial,Helvetica,Sans-serif;
    }

    h1 {
        font-weight: normal;
	text-transform: uppercase;
        font-size: 24px;
        letter-spacing: -1px;
        text-align: left;
	/* background-color: #ef4723; */
        color: #FFF;
	border-top: #009444 solid 8px;
	padding: 5px;
	margin-top: 0;
	margin-bottom: 30px;
    }
    
    h2 {
        font-weight: normal;
        text-transform: uppercase;
        font-size: 22px;
        text-align: left;
        color: #ddd;
    }
    h3 {
	font-weight: bold;
/*	text-transform: uppercase;*/
        font-size: 16px;
	letter-spacing: 2px;
	color: #009444;
    }
    h4 {
        font-weight: normal;
        text-transform: uppercase;
        font-size: 16px;
        text-align: center;
        color: #fff;
	letter-spacing: -0.5pt;
    }
    
    h5 {
	font-size: 80%;
        font-weight: normal;
	text-align: center;
        color: #fff;
    }
    
    h6 {
	font-weight: normal;
	text-transform: none;
        font-size: 10px;
	letter-spacing: 2px;
	color: #f2f2f2;
    }
    p {
        font-weight: normal;
	font-size: 14px;
        color: #F2F2F2;
	line-height: 1.7em;
    }
    a {
        color: #ef4723;
	text-decoration: none;
	transition: color 300ms ease-out 0s;
    }
    
    small.notthatsmall {
	font-size: 70% !important;
	
    }
    
    ul.listed {
	list-style-type: none;
	margin-left: 0px;
    }
    ul.listed li {
	font-size: 90%;
	color: #FFF;
	text-align: justify;
    }
    
    ul.listed li:before {
    content: "\0BB \020 \020";
    color: #009444;
    }
    
    /*ul.listed li:after {
    content: "\020 \020 \0AB";
    color: #009444;
    }*/
    
    /************** Global Styles *********/
    
    table {
    border-collapse:collapse;
	border: 1px solid #1a1a1a;
    background:none repeat scroll 0% 0% #1b1b1b;
    
    }
    table tr {
	border-bottom: 1px solid #2f2f2f;
    }
    table tr.even, table tr.alt, table tr:nth-of-type(2n) {
	background: none repeat scroll 0% 0% #181818;
    }
    
    thead tr {
	background-color: #070707;
	color: #A7ABAE;
    }
    
    tr td {
	padding: 0.3rem;
	font-size: 90% !important;
    }
    
    td h3, td h2 {
	font-size: 95%;
    }
    
    .stripe {
        background: url('../images/stripe-horz.png') repeat-x;
        height: 35px;
        width: 100%;
	z-index: 0;
	clear: both;
    }
    
    .invisible {
	display: none;
    }
    
    .fill {
	width: 100%;
    }
    
    .green {
	color: #009444;
    }
    
    .diamond {
	margin-top: 10px;
	margin-bottom: 10px;
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-bottom-color: #ef4723;
	position: relative; top: -10px;
	}
	
    .diamond:after {
	content: '';
	position: absolute;
	left: -10px;
	top: 10px;
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-top-color: #ef4723;
	}
    
    .thumb {
	padding: 7px;
	background-color: #1b1b1b;
	border: #2f2f2f 1px solid;
	margin: 0 auto !important;
	margin-bottom: 10px !important;
	width: 100%;
    }
    .sellerthumb img {
	width: 400px;
    }
    #seller-list .sellerthumb img {
	width: 200px !important;
	}
	
/*********************************************/    
/*************** Header Style ****************/


    header {
	background: #000;
	padding-bottom: 15px;
	text-align: center;
    }
    
    .header-links-wrapper {
	float: left;
    }
    
   a.header-links {
	display: inline-block;
	margin-top: 5px;
	font-size: 13px;
	padding: 10px 12px 10px 12px;
        color: #fff;
        text-transform: uppercase;
	text-align: center;
	transition: background-color 300ms ease-out 0s;
   }
    a.header-links:hover{
        background-color: #ef4723;
   }
   
   .slogan {
    margin-top: 20px;
   }
   .logo-wrapper {
    
    vertical-align: middle;
    display: inline-block;
   }
    .logo {
    display: inline-block;
    vertical-align: middle;
   }

/*********************************************/
/************ Navigation Style ***************/

/************top-bar*********/
   
    .topbar-wrapper {
	margin-top: -35px;
    }
  
    .top-bar-section li.hover > a:not(.button) {
      background: #ef4723;
      width: 100%;
    }
    .top-bar-section li.active:not(.has-form) a:not(.button) {
      padding: 0px 5px;
      line-height: 30px !important;
      color: white;
      width: 100%;
      }
      
      .top-bar-section ul li > a:hover {
      }
      
/********* mobile top-bar *********/

@media only screen and (max-width: 942px) {
 
    
    .top-bar ul {
        background-color: #2f2f2f;
    }
 
    
    .top-bar-section ul li > a {
        color: #fff;
    }
    
   .top-bar-section ul li:hover:not(.has-form) > a {
    background: #1b1b1b;
    color: #FF4723;
    }
 
    
    .top-bar-section ul {
        background: #1b1b1b;
    }
 
    .top-bar-section .has-dropdown > a:after {
	right: -35px;
    }
 
    } /* end media query */
    
    
/********* location dropdown *********/

    div.dropdown-box {
    text-align: center;
    color: #FFF;
    margin: 1px 0px 0 0;
    position: relative;
    height: 30px;
    text-align:left;
    z-index: 110 !important;
    text-transform: uppercase;
    width: 180px;
    }
    
    a.dropdown-top {
    text-align: center;
    font-size: 90%;
    line-height: 20px;
    color: #FFF;
    position: absolute;
    z-index: 111;
    display: block;
    padding: 11px 0 0 20px;
    margin: 0 0 0 0px;
    text-decoration: none;
    cursor:pointer;
    background-color: #ef4723;
    padding: 10px 23% 0px 12%;
    font-weight: bold;
    text-transform: uppercase;
    height: 40px;
    width: 100%;
    transition: background-color 300ms ease-out 0s;
    
    }
    
    a.dropdown-top:hover {
	background-color:#009444;
	color: #fff;
	text-decoration: none;
    }
    
    .arrow-right {
	background: url('../images/arrows.png') 0 0 no-repeat;
	height: 21px;
	width: 21px;
	position: absolute;
	right: 10px;
	top: 10px;
    }
    
    .arrow-down {
	background: url('../images/arrows.png') 0px -21px no-repeat;
	height: 21px;
	width: 21px;
	position: absolute;
	right: 10px;
	top: 10px;
    }
    
    .arrow-down-l {
	background: url('../images/arrows.png') 0px -21px no-repeat;
	height: 21px;
	width: 21px;
	position: absolute;
	margin-left: 15px;
    }
    
    div.submenu
    
    {
    background: #ef4723;
    position: absolute;
    z-index: 100;
    display: none;
    padding: 40px 0 0px;
    width: 100%;
    
    }
    
     .dropdown-box  li a {
       
	color: #FFF;
	display: block;
	font-weight: bold;
	padding: 10px 15px;
	cursor: pointer;
	text-decoration:none;
	transition: background-color 300ms ease-out 0s;
    }
    
    .dropdown-box li a:hover{
	background-color:#009444;
	color: #fff;
	text-decoration: none;
	
    }
    

    .menu-root
    {
    list-style:none;
    margin:0px;
    padding:0px;
    font-size: 11px;
    padding: 0;
    border-top:1px solid #fff;
    z-index: 110 !important;
    }
    
    
    

/*********************************************/
/************* Banner Style *****************/
 

   
    .banner-wrapper {
	margin: 20px auto 20px auto;
    }
    
    li.banner div a {
	text-transform: uppercase;
	font-weight: bold;
	transition: color 300ms ease-out 0s;
    }
    
    li.banner div {
	text-align: left;
    }
    
    li.banner div a:hover {
	color: #009444;
    }
    
    li.banner div ul {
	list-style-type: none;
	text-align: left;
	
    }
    
   li.banner div ul li:before {
    content: "\0BB \020";
    color: #009444;
    }
    
    li.banner div ul li:after {
    content: "\0AB \020";
    color: #009444;
    }
    
    li.banner div ul li {
	font-size: 90%;
	text-transform: uppercase;
	text-indent: 10px;
	
    }   

    
/************* Content Style *****************/
   .content {
	margin-top: 10px;
	padding: 20px 20px 50px;
	vertical-align: middle;
    }
    
   .content p {
	text-align: justify;
    }
    
    .panel {
    border: none;
    border-top: #2f2f2f 1px solid;
    border-bottom: #111 1px solid;
    margin-bottom: 1.25rem;
    padding: 1.25rem;
    background: none repeat scroll 0% 0% #1b1b1b;
    box-shadow: 0px 0px 10px rgba(255, 255, 225, 0.3);
    }
    .panel > h1 h2 p {
	color: #fff;
    }
    div.panel  span h2 {
	padding-top: 8px;
    }
    
    div.panel img {
	color: red;
	text-align: center;
	font-size: 80%;
        font-weight: normal;
        color: #fff;
    }
    .feature-links-wrapper {
	padding-bottom: 30px;
    }
    .feature-links {
	display: block;
	padding: 30px 0px 15px;
	font-weight: bold;
	text-transform: uppercase;
        font-size: 34px;
	letter-spacing: 2px;
	color: #fff;
	text-align: center;

    }
    
    .feature-links a{
	color: #fff;
	transition: color 300ms ease-out 0s;
    }
    
    .feature-links a:hover {

	color: #009444;
    }
    
    .feature-divider {
	border-left: dashed 2px #fff;
	width: 0px;
	height: 40px;
    }
    
    .store-select {
	margin-top: -135px;
    }
    
    .section {
    margin-bottom: 30px !important;
    }
    
 /************* Sidenav Style *****************/
 
    .sidebar {
	border-top: 1px solid #2f2f2f;
	margin-bottom: 10px;
	padding-top:10px;
	text-align: center;
    }
    #sidenav {
	margin-top: 30px;
	border-top: #009444 solid 8px;
	background-color: #1b1b1b;
	padding: 0px;
	z-index: 100 !important;
    }

    
    
    #sidenav h2 {
	text-indent: 7%;
    
    }
    #sidenav ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	
    }
    
    #sidenav ul li{
	text-align: left;
	border-bottom: 2px solid #2F2F2F;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 4%;
	margin-right: 4%;
	font-size: 80%;


    }
    #sidenav ul li a {
	text-transform: uppercase;
	color: #fff;
	-webkit-transition: font-size 0.2s ease, color 0.2s ease;
	-moz-transition: font-size 0.2s ease, color 0.2s ease;
	-o-transition: font-size 0.2s ease, color 0.2s ease;
	-ms-transition: font-size 0.2s ease, color 0.2s ease;
	transition: font-size 0.2s ease, color 0.2s ease;
    }
    #sidenav ul li a:hover {
	color: #009444;

    }

 
/************* jQuery UI Style *****************/
/**********************************************/

     .ui-widget-header {
	background-color: #272727;
	border-top: 1px solid #555;
	padding: 0px 10px;
    }
	
    .ui-widget-header {
	border:0;
    } 
    .ui-widget-content {
	color: #F2F2F2;
    }
    .ui-state-default, .ui-widget-content .ui-state-default {
	border:1px solid #2f2f2f;
    }
    .ui-state-active, .ui-widget-content .ui-state-active {
	background:#00aa33 none;
	border-bottom:1px solid #ef4723;
    }
    
    .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
    background-color: #1b1b1b;
    color: #ccc;
    }
    
    .ui-helper-hidden-accessible {
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0px;
	position: absolute;
	width: 1px;
	clip: rect(0px, 0px, 0px, 0px);
	border: 0px none;
    }
    .ui-state-default,
    .ui-widget-content .ui-state-default,
    .ui-widget-header .ui-state-default {
	    font-weight: normal;
	    transition: background-color 300ms ease-out 0ms;
	    transition: border 300ms ease-out 0ms;
    }

    .ui-state-default a,
    .ui-state-default a:link,
    .ui-state-default a:visited {
	    color: #FFF;
	    text-decoration: none;
    }
    .ui-state-hover,
    .ui-widget-content .ui-state-hover,
    .ui-widget-header .ui-state-hover,
    .ui-state-focus,
    .ui-widget-content .ui-state-focus,
    .ui-widget-header .ui-state-focus {
	    border: 1px solid #11ff44;
	    background-color: #00aa33;
	    font-weight: normal;
	    color: #fff;
    }
    .ui-state-hover a,
    .ui-state-hover a:hover,
    .ui-state-hover a:link,
    .ui-state-hover a:visited,
    .ui-state-focus a,
    .ui-state-focus a:hover,
    .ui-state-focus a:link,
    .ui-state-focus a:visited {
	    color: #fff;
	    text-decoration: none;
    }
    .ui-state-active,
    .ui-widget-content .ui-state-active,
    .ui-widget-header .ui-state-active {
	    border: 1px solid #cc3300;
	    background-color: #ef4723;
	    font-weight: normal;
	    color: #FFF;
    }
    .ui-state-active a,
    .ui-state-active a:link,
    .ui-state-active a:visited {
	    color: #FFF;
	    text-decoration: none;
    }
    
    .panel > .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
	text-align: center;
    }
    
    .panel > .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
	text-align: center;
    }
    
    div.buttonset-inline label{
	font-weight: bold;
	color: #fff;
	width: 33.33%;
	margin:0px -6px 0px 0px;
	text-align: center;
    }
    


/************* Datepicker Style ************/
/******************************************/
 
    .ui-datepicker {
	    width: 22rem;
	    margin: 20px auto 30px;
	    padding: .2em .2em 0;
	    display: none;
	    border: none;
	    border-top: #2f2f2f 1px solid;
	    border-bottom: #111 1px solid;
	    background: none repeat scroll 0% 0% #1b1b1b;
	    box-shadow: 0px 0px 10px rgba(255, 255, 225, 0.3);
	    
    }
    .ui-datepicker .ui-datepicker-header {
	    position: relative;
	    padding: .2em 0;
    }
    .ui-datepicker .ui-datepicker-prev,
    .ui-datepicker .ui-datepicker-next {
	    position: absolute;
	    top: 2px;
	    width: 1.8em;
	    height: 1.8em;
    }
    .ui-datepicker .ui-datepicker-prev-hover,
    .ui-datepicker .ui-datepicker-next-hover {
	    
    }
    .ui-datepicker .ui-datepicker-prev {
	    left: 0px;
    }
    .ui-datepicker .ui-datepicker-next {
	    right: 0px;
    }
    .ui-datepicker .ui-datepicker-prev-hover {
	    
    }
    .ui-datepicker .ui-datepicker-next-hover {
	    
    }
    .ui-datepicker .ui-datepicker-prev span,
    .ui-datepicker .ui-datepicker-next span {
	    display: block;
	    position: absolute;
	    left: 50%;
	    left: -4px;
	    top: 50%;
	    top: -4px;
    }
    .ui-datepicker .ui-datepicker-title {
	    margin: 0 2.3em;
	    line-height: 1.8em;
	    text-align: center;
	    color: #fff;
    }
    .ui-datepicker .ui-datepicker-title select {
	    font-size: 1em;
	    margin: 1px 0;
    }
    .ui-datepicker select.ui-datepicker-month,
    .ui-datepicker select.ui-datepicker-year {
	    width: 49%;
    }
    .ui-datepicker table {
	    width: 100%;
	    font-size: .9em;
	    border-collapse: collapse;
	    margin: 0 0 .4em;
	    border: none;
    }
    
    .ui-datepicker tr {
	border: none;
    }
	
    .ui-datepicker td {
	    border: 0;
	    padding: 1px;
	    color: #fff;
	    
    }
    .ui-datepicker td span,
    .ui-datepicker td a {
	    display: block;
	    padding: .2em;
	    text-align: right;
	    text-decoration: none;
    }
    td.undefined span,
    td.undefined a {
	    color: #fff;
	    background-color: #009444;
	    border: 1px solid #006600;
    }
	    
    
    .ui-datepicker .ui-datepicker-buttonpane {
	    background-image: none;
	    margin: .7em 0 0 0;
	    padding: 0 .2em;
	    border-left: 0;
	    border-right: 0;
	    border-bottom: 0;
    }
    .ui-datepicker .ui-datepicker-buttonpane button {
	    float: right;
	    margin: .5em .2em .4em;
	    cursor: pointer;
	    padding: .2em .6em .3em .6em;
	    width: auto;
	    overflow: visible;
    }
    .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	    float: left;
    }
    
    td.ui-datepicker-unselectable span,
    td.ui-datepicker-unselectable a
    {
	background-color: #1b1b1b;
	color: #ccc;
    }
    /* with multiple calendars */
    .ui-datepicker.ui-datepicker-multi {
	    width: auto;
    }
    .ui-datepicker-multi .ui-datepicker-group {
	    float: left;
    }
    .ui-datepicker-multi .ui-datepicker-group table {
	    width: 95%;
	    margin: 0 auto .4em;
    }
    .ui-datepicker-multi-2 .ui-datepicker-group {
	    width: 50%;
    }
    .ui-datepicker-multi-3 .ui-datepicker-group {
	    width: 33.3%;
    }
    .ui-datepicker-multi-4 .ui-datepicker-group {
	    width: 25%;
    }
    .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
    .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	    border-left-width: 0;
    }
    .ui-datepicker-multi .ui-datepicker-buttonpane {
	    clear: left;
    }
    .ui-datepicker-row-break {
	    clear: both;
	    width: 100%;
	    font-size: 0;
    }
    
    .ui-icon {
	width: 16px;
	height: 16px;
    }
    .ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
    }

    .ui-icon-circle-triangle-w{
	background: url('../images/arrows.png') 0 -42px no-repeat;
	height: 21px;
	width: 21px;
	position: absolute;
	margin: 10px 0px 0px 10px;
	
    }
    
    .ui-icon-circle-triangle-e{
	background: url('../images/arrows.png') 0 0 no-repeat;
	height: 21px;
	width: 21px;
	position: absolute;
	margin: 10px 0px 0px 10px;
	
    }
    
    .ui-spinner-up {
	border: none !important;
	margin-top: -40px;
	margin-right: -25px;
	float: right;
    }
    .ui-spinner-down {
	border: none !important;
	margin-top: -20px;
	margin-right: -25px;
	float: right;
    }
    .ui-spinner-up span span.ui-icon-triangle-1-n{
	background: url('../images/arrows.png') 0 -63px no-repeat;
	height: 21px;
	width: 21px;
	
    }
    
    .ui-icon-triangle-1-s{
	background: url('../images/arrows.png') 0 -21px no-repeat;
	height: 21px;
	width: 21px;
	
    }
    
    .ui-icon-triangle-1-e{
	background: url('../images/arrows.png') 0 0 no-repeat;
	height: 21px;
	width: 21px;
	position: absolute;
	margin: 10px 0px 0px 10px;
	
    }
    
    .ui-datepicker-trigger {
	float: right;
	margin-top: -32px;
	margin-right: -32px;
    }
 
 /************* BUY PAGE Style *****************/
 
    img.seller-thumb {
       width: 100%;
       /* clip: rect(0 20rem 16rem 0);
       position: absolute;
       right: 0px;
       top: 0px; */
       padding: 10px;
       background-color: #1b1b1b;
       border: #2f2f2f 1px solid;
   }
   
   span.seller-thumb {
       margin-bottom: 16rem;
   }
   
   
   .date p {
       text-align: center !important;
       text-transform: uppercase;
       font-size: 85%;
       color: #fff;
   }
   
   input:disabled {
       background-color: transparent !important;
       width: 50px;
       border: none;
       font-size: 150%;
       height: 50px;
       overflow: visible;
   }
   
   #showDate {
       font-size: 150%;
       text-indent: 30px;
       margin-top: 10px;
       height: 50px;
       width: 100%;
       overflow: visible;
   }
       
   .meter {
	   height: 20px;
	   position: relative;
	   background: #2f2f2f;
	   -moz-border-radius: 25px;
	   -webkit-border-radius: 25px;
	   border-radius: 25px;
	   padding: 10px;
	   margin: 10px 0px 30px;
	   -webkit-box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
	   -moz-box-shadow   : inset 0 -1px 1px rgba(255,255,255,0.3);
	   box-shadow        : inset 0 -1px 1px rgba(255,255,255,0.3);
	   margin-bottom: 15px;
	   
   
   }
   div.meter h5 {
       color: #FCFAE1;
       margin-top: 15px;
       z-index: 100;
       text-transform: uppercase;
       font-size: 75%;
   
   }
   div.meter > span {
	   display: block;
	   height: 14px;
	      -webkit-border-top-right-radius: 8px;
	   -webkit-border-bottom-right-radius: 8px;
		  -moz-border-radius-topright: 8px;
	       -moz-border-radius-bottomright: 8px;
		      border-top-right-radius: 8px;
		   border-bottom-right-radius: 8px;
	       -webkit-border-top-left-radius: 16px;
	    -webkit-border-bottom-left-radius: 16px;
		   -moz-border-radius-topleft: 16px;
		-moz-border-radius-bottomleft: 16px;
		       border-top-left-radius: 16px;
		    border-bottom-left-radius: 16px;
	   background-color: #009933;
	   -webkit-box-shadow: 
	     inset 0 2px 9px  rgba(255,255,255,0.3),
	     inset 0 -2px 6px rgba(0,0,0,0.4);
	   -moz-box-shadow: 
	     inset 0 2px 9px  rgba(255,255,255,0.3),
	     inset 0 -2px 6px rgba(0,0,0,0.4);
	   position: absolute;
	   top: 3px;
	   left: 5px;
	   overflow: hidden;
	   z-index: 1;
   }
   
   .product-title h3 {
       font-weight: bold;
       font-size: 110%;
   }
   .datalist {
     margin: 20px;
     border-bottom: solid 1px #A7ABAE;
   }
    
   .datalist ul {
     list-style-type: none;
   }
    
   .datalist ul li {
     padding: 10px;
     border-top: solid 1px #A7ABAE;
   }
    
   /*.datalist ul li:hover {
     background: #1b1b1b;
     cursor: pointer;
   }*/
   
   .price {
       text-align: center;
       margin: 30px 10px 0 0 !important;
   }
   
   .addButtonWrapper {
       text-align: center;
       color: #fff;
       margin-top: 30px !important;
   }
   
   .addButton {
       color: #fff;
       background-color: #009933;
       padding: 10px 25px;
       transition: background-color 300ms ease-out 0s;
   }
 
 .addButton:hover {
    background-color: #ef4723;
 }
     div.option-dropdown-box {
    text-align: center;
    color: #FFF;
    margin: 1px 0px 0 0;
    position: relative;
    text-align:left;
    text-transform: uppercase;
    width: 95%;
    }
    
    .option-dropdown-box  li {
	font-size: 105%;
	padding: 0px !important;
    }
    .option-dropdown-box  li a {
       
	color: #FFF;
	display: block;
	font-weight: bold;
	padding: 5px;
	cursor: pointer;
	text-decoration:none;
	transition: background-color 300ms ease-out 0s;
    }
    
    .option-dropdown-box li a:hover{
	background-color:#009444;
	color: #fff;
	text-decoration: none;
	
    }

    
    a.option-dropdown {
    font-size: 80%;
    line-height: 16px;
    color: #FFF;
    display: block;
    padding: 5px 35px 5px 5px !important;
    margin: 0 0 0 0px;
    text-decoration: none;
    cursor: pointer;
    font-weight: bold;
    /* width: 90%; */
    background-color: #2f2f2f;
    border: 1px solid #3b3b3b;
    transition: background-color 300ms ease-out 0s;
    
    }
    .option-dropdown {
	
    }
    a.option-dropdown:hover {
	background-color:#009444;
	color: #fff;
	text-decoration: none;
    }
    
ul.pie-options-list {
    list-style:none;
    margin:0px;
    padding:0px;
    z-index: 110 !important;
}
ul.pie-options-list li {
    display: inline;
    list-style-type: none;
    margin-right: 15px;
    padding: 0px;
    border: none !important;
    white-space: nowrap;
}
a.selected, ul.pie-options-list li a:hover{
    background-color:#009444; 
    color: #fff;
    text-decoration: none;
}
ul.pie-options-list li a {
	color: #FFF;
	display: inline-block;
	margin-bottom: 10px;
	font-weight: normal;
    font-size: 16px;
	padding: 5px;
    border: 1px dashed white;
	cursor: pointer;
	text-decoration:none;
	transition: background-color 300ms ease-out 0s;
    }
input.quantity {width: 60px !important; margin-right: -20px;}


    .option-menu-root
    {
    list-style:none;
    margin:0px;
    padding:0px;
    font-size: 11px;
    border-top:1px solid #fff;
    z-index: 110 !important;
    }
    
    div.optionSubmenu {
	
    background: #1b1b1b;
    position: absolute;
    z-index: 100;
    display: none;
    padding: 0px 0 0px;
    width: 100%;
    
    }
    
    .triangle-right {
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-left: 12px solid #fff;
	border-bottom: 6px solid transparent;
	position: absolute;
	right: 7px;
	top: 7px;
	}
	
    .triangle-down {
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 12px solid #fff;
	position: absolute;
	right: 7px;
	top: 7px;
	}
	
    
    .cart {
	line-height: 0.6 !important;
	border: none !important;
	padding-bottom: 15px;
    }
    
    .cart li {
	padding: 0 !important;
	border: none !important;
	margin-left: 15px !important;
    }
    
    .cart li div div h6 {
	padding-bottom: 3px;
	margin: 0;
    }
    
    .cart li div h5 {
	text-align: left !important;
	border-top: solid 1px #009444;
	padding-top: 3px;
    }
    
    .removeButton {
	/* vertical-align: top; */
    }
    
    #cartTotal {
	height: auto;
	width: 100%;
	padding: 0;
	padding-top: 5px;
	font-size: 150%;
	text-indent: 4%;
	display: inline;
	width: 20%;
	overflow: visible;
	
    }
    
    .cartText {
	padding-left: 4%;
	font-size: 135%;
	font-weight:bold;
    }
    
 /************* Google Calendar Style *****************/
 
    .calendarWrapper {
    border: 1px solid #333;
    }
    #calendarchoose.buttonset-inline label{
	width: 25%;
    }
    
    #calendarTitle {
	margin: 0 20px;
    }
    
    #calendarchoose {
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
    }
    
    #events ul.listed li:after {
	content: '';
    }
    
    #events ul.listed li {
	clear: both;
	margin: 0 20px;
    }
    
    #events {
	max-height: 300px;
	overflow: scroll;
	padding: 0 20px;
    }
    
    #donateIngredientsList {
	max-height: 400px;
	overflow: scroll;
    }
    
/************* Form Style *****************/
 /******************************************/


    form div div.columns {
	padding: 0;
	margin: 0;
    }
    
    input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea {
	background-color: #3c3c3c;
	font-family: inherit;
	border: 1px solid #1b1b1b;
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5) inset;
	color: #fff;
	display: block;
	font-size: 0.875rem;
	margin: 0px 0px 0rem;
	padding: 0.5rem;
	height: 2.0rem;
	width: 100%;
	box-sizing: border-box;
	transition: box-shadow 0.45s ease 0s, border-color 0.45s ease-in-out 0s;
    }
    
    input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus {
	color: #1b1b1b;
    }
    
    input[type="submit"] {
	background-color: transparent;
	border: none;
    }
    
    
    select {
	background-color: #2f2f2f; 
	background-position: 100% center;
	background-repeat: no-repeat;
	border: 0 none;
	padding: 0.5rem;
	font-size: 0.875rem;
	color: #FCFAE1;
	line-height: normal;
	border-radius: 0px;
	height: 2.3125rem;
	-webkit-appearance: none;
	border-bottom: 3px solid #1b1b1b;
	box-shadow: -2px -2px 3px rgba(0, 0, 0, 0.5) inset, 3px 3px 7px rgba(0, 0, 0, 0.7)inset;
    }
    select:hover {
	color: #2f2f2f;
	border-bottom: #2f2f2f 1px solid;
    }
    
    .selectable {
	margin: 0;
    }
    
    .selectable li {
	font-size: 90%;
	display: inline;
    }
    
    label {
    width:100%;
    display: block;
   /* background:#1b1b1b;
    border-top:1px solid #2f2f2f;
    border-bottom:1px solid #182925; */
    padding: 3px;
    text-align: left;
    text-indent: 9px;
    color: #ddd;
    }
    
    .has-tip {
	color: #009444;
    }
    
    .tooltip {
	background: #2f2f2f;
	border: 1px solid #3c3c3c;
    }
    message{
    padding:7px 7px;
    width:350px;
    background:#262626;
    border-bottom: 1px double #171717;
    border-top: 1px double #171717;
    border-left:1px double #333333;
    border-right:1px double #333333;
    overflow:hidden;
    height:150px;
    }
    
    div.error input {
	border: solid 1px #E71814;
    }
    
    .error {
	margin-bottom: 0 !important;
    }
    .styled-select {
	width: 100%;
       overflow: hidden;
       background: #F8F8F8;
       border: 0 none;
       height: 30px;
       border-radius:2px;
     }
     
    span.styled-select select {
      width: 100%;
      border: 0 none;
      line-height: 1.5;
      -webkit-appearance: none;
      -moz-appearance: none;
      text-indent: 0.01px;
      text-overflow: '';
      appearance: none;
      background: transparent url("../images/arrows.png") no-repeat 0 -21px;
    }
    
    
    div#deliverychoose label:first-of-type {
	color: #fff;
    }
    
    span.nextsection button {
	width: 50%;
	 margin: 0px auto;
	 font-weight: bold;
    }
    
    
	/* Styled Checkbox */
	.styledcheck input[type=checkbox] {
	    visibility: hidden;
    }
    .styledcheck {
	    width: 20px;	
	    margin: 10px auto;
	    position: relative;
    }
    
    .styledcheck label {
	    cursor: pointer;
	    position: absolute;
	    width: 20px;
	    height: 20px;
	    top: 0;
	    border-radius: 4px;
    
	    -webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
	    -moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
	    box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
    
	    background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
	    background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
	    background: -o-linear-gradient(top, #222 0%, #45484d 100%);
	    background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
	    background: linear-gradient(top, #222 0%, #45484d 100%);
	    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
    }
    
    .styledcheck label:after {
	    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	    filter: alpha(opacity=0);
	    opacity: 0;
	    content: '';
	    position: absolute;
	    width: 15px;
	    height: 9px;
	    background: transparent;
	    top: 4px;
	    left: 3px;
	    border: 3px solid #fcfff4;
	    border-top: none;
	    border-right: none;
    
	    -webkit-transform: rotate(-45deg);
	    -moz-transform: rotate(-45deg);
	    -o-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	    transform: rotate(-45deg);
    }
    
    .styledcheck label:hover::after {
	    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	    filter: alpha(opacity=30);
	    opacity: 0.3;
    }
    
    .styledcheck input[type=checkbox]:checked + label:after {
	    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	    filter: alpha(opacity=100);
	    opacity: 1;
    }

/********************************************/
/************* Footer Style *****************/


    footer {
        clear:both;
        display: block;
        height: 35px;
        width: 100%;
	z-index: 10;
	text-align: center;
	margin: auto;
    }
    .links-wrapper {
/*	max-width: 400px;*/
	margin: -5px auto 0px
    }
    
    p.footer {
	text-transform: uppercase;
	font-size: 70%;
	letter-spacing: 1pt;
	margin: 30px auto;
    }
    
    .footer-links {
        font-size: 70%;
        color: #fff;
        text-transform: uppercase;
	padding-top: 15px !important;
   }
    .footer-links:hover{
        background-color: #ef4723;
   }
   
   
   /*******************************************/
  /************* Mobile Styles *****************/
  
   .ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper {
    background-color: #000;
    border-color: #2f2f2f;
    color: #f2f2f2;
    text-shadow: 0px 1px 0px #1b1b1b;
}


/* mark's prototype overrides so form inputs are not 100% width */
.labeledinput label {
  display: inline-block;
  width: 250px;
  font-weight: bold;
}
.reportheads {background-color: #CCCCCC; color: black;}
.labeledinput input, .labeledinput select {
  display: inline-block;
  /* width: 300px !important;*/
}
.alt label {
  padding: 0 !important;
}
.alt select, .alt input {
  width: auto !important;
  margin: 0 !important;
}
input.submit, .alt .button {
  display: inline-block;
  background-color: orange;
  width: auto !important;
  color: black;
  margin: 10px 10px 10px 0;
  padding: 4px 6px;
  border: 1px solid white;
  border-radius: 4px;
}
table.layout td, table.layout tr {vertical-align: top;} 
.inputhelp {font-style: italic;}
