/*/////////////////////////////////////////////////////////*/
/*Online Menu CSS*/
/*/////////////////////////////////////////////////////////*/

/*/////////////////////////////////////////////////////////*/
/*General*/
/*/////////////////////////////////////////////////////////*/
/*Child percentage heights are a percentage of their parent
These are set to 100% as they are the top most parent elements*/
html, body
{
    height: 100%;
}

*
{
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
*:before,
*:after
{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html
{
    font-family: sans-serif;
    font-size: 10px;

    /*This allows users to zoom, but doesn't change text size*/
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;

    /*Sets highlight of link being tapped*/
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body
{
    font-family: 'Raleway', sans-serif;
    font-weight: 100;
    font-size: 13px;
    line-height: 1.42857143;
    -webkit-font-smoothing: antialiazing;
    background: grey;
}

img
{
    width: 100%;
	/*
    height: 100%;
    */
	max-width: 100% !important;

    border: 0;
    page-break-inside: avoid;
    vertical-align: middle;
}

button
{
    font: inherit;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    text-transform: none;

    margin: 0;

    color: inherit;
    overflow: visible;

    /*Remove any browser added css*/
    -webkit-appearance: button;
    cursor: pointer;
}
/*Remove some Firefox specific mark-up spacing*/
button::-moz-focus-inner
{
    padding: 0;
    border: 0;
}
button:focus
{
	outline:0;
}

a
{
    text-decoration: none;
    background: transparent;
}
a,
a:hover,
a:focus,
a:active
{
    text-decoration: none;
}

textarea
{
   resize: none;
}

b
{
	font-weight:bold;
}

/*/////////////////////////////////////////////////////////*/
/*Fonts + Glyphs*/
/*/////////////////////////////////////////////////////////*/
@font-face
{
    font-family: 'FontAwesome';
    src: url('../fonts/fa-solid-900.woff');
    font-weight: normal;
    font-style: normal;
}

.af
{
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;

    display: inline-block;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.af_mobile:before
{
    content: "\f3cd";
    font-size: 50px;
    color:white;
}

.af_shopping_bag:before
{
  content: "\f290";
  font-size: 20px;
	color: white;
}

/*
.af_home:before
{
    content: "\f015";
}

.af_profile:before
{
    content: "\f007";
}

.af_games:before
{
    content: "\f286";
}

.af_players:before
{
    content: "\f0c0";
}

.af_check:before
{
    content: "\f00c";
}

.af_ex:before
{
  content: "\f00d";
}

.af_bars:before
{
  content: "\f0c9";
  font-size: 18px;
	color: white;
}

.af_bigex:before
{
  content: "\f00d";
  font-size: 18px;
}

.af_nomessages:before
{
  content: "\f2b7";
}

.af_newmessages:before
{
  content: "\f0e0";
}
*/



/*
colors
#E34748
#fff

*/



/*/////////////////////////////////////////////////////////*/
/*Input Override*/
/*/////////////////////////////////////////////////////////*/

select
{
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    color: black;
    background-color: #fcfcfc;
}

input[type=text]
{
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    background-color: #fcfcfc;
}

input[type=password]
{
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    background-color: #fcfcfc;
}

input[type=date]
{
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    background-color: #fcfcfc;
}

input[type=time]
{
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    background-color: #fcfcfc;
}

input[type=number]
{
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    background-color: #fcfcfc;
}

input[type=radio] + label
{
	color: #ccc;
}
input[type=radio]:checked + label
{
	color: #f00;
}

/*/////////////////////////////////////////////////////////*/
/*Header*/
/*/////////////////////////////////////////////////////////*/
.header
{
    /*'display: block' elements don't allow elements to be side by side with them (unless floating)*/
    display: block;
    height: 90px;
    min-height: 90px;

    position: fixed;
    top: 0px;
    right: 0px;
    left: 0px;
    z-index: 1030;

	/*
    padding-top: 20px;
    margin-bottom: 20px;
	*/

    background: #454647;

    /*This transform is to potentially GPU to render the element smoother/faster*/
    -webkit-transform: translate3d(0, 0, 0);
       -o-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

.headercontainer
{
    height: 100%;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
@media (max-width: 1040px)
{
	.headercontainer
	{
		text-align: center;
		vertical-align: middle;
	}
}

.headerlogo
{
    width: 300px;
    position: absolute;
    left: 15px;
    top: 20px;
}
@media (max-width: 1040px)
{
	.headerlogo
	{
		display:inline-block;
		position: static;
		width: 160px;
		padding-top: 15px;
	}
}

.headermenu
{
    display: none;
    height: 100%;
    min-height: 40px;

    overflow-x: visible;
    -webkit-overflow-scrolling: touch;

    border-top: 1px solid transparent;
    border-color: #101010;

    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
}
@media (min-width: 1050px)
{
    .headermenu
    {
        display: block !important;
		/*
        height: auto !important;
        max-height: 340px;
        */
		width: auto;

        padding: 0;
        margin: 0;
        float: right !important;

        overflow: visible !important;

        border-top: 0;
        -webkit-box-shadow: none;
            box-shadow: none;
    }
}

.headermenuitem
{
    position: relative;
    display: block;
	height: 90px;
}
@media (min-width: 1040px)
{
    .headermenuitem
    {
        float: left;
    }
}
.dropdown-content
{
    display: none;
    position: absolute;
    z-index: 1;
}
.headermenuitem:hover .dropdown-content {
    display: block;
}

.headerlink
{
    position: relative;
    display: block;
	height:100%;
    padding: 35px 15px 0px 15px;
    color: #fff;

    cursor: pointer;
    -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.headerlink:hover
{
    text-decoration: none;
    background-color: transparent;
}

.underlink 
{
	padding: 15px 15px;
}

.headertoggle
{
    position: relative;
    float: right;
    width: 45px;
    height: 35px;
    padding: 9px 10px;
    margin-top: 25px;
    margin-bottom: 8px;
    background-color: grey;
    border: 1px solid grey;
    border-radius: 4px;
}
.headertoggle:hover
{
    outline: 0;
    background-color: #444;
}
@media (min-width: 1050px)
{
    .headertoggle
    {
        display: none;
    }
}
.headertogglehighlight
{
    background-color: #444;
}

.headerdropdown
{
    display: none;

    position: relative;
    width: auto;

    background: #E34748;
	color: #fff;

    padding-right: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
    margin-right: 0px;
    margin-left: 0px;

    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
.headerdropdownvisible
{
    display: block;
}

.dropdownbutton
{
    width: 100%;
    position: relative;
    display: block;
}
@media (min-width: 1040px)
{
    .dropdownbutton
    {
        display: none;
    }
}

.icon-bar
{
    display: block;
    width: 22px;
    height: 2px;

    background-color: #fff;

    border-radius: 1px;
}
.icon-bar + .icon-bar
{
    margin-top: 4px;
}

/*/////////////////////////////////////////////////////////*/
/*Log In*/
/*/////////////////////////////////////////////////////////*/

.headerlogin
{
    display: none;
    position: relative;
    overflow: auto;

    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 8px;

    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;

    background: #E34748;
}
.headerloginvisable
{
    display: block;
}
@media (max-width: 1040px)
{
    .headerlogin
    {
        display: none;
    }
}

.logintext
{
    display: inline-block;
    color: #fff;
    padding-left: 8px;
    vertical-align: center;
}

.logininput
{
    padding-right: 8px;
}

.headerloginerror
{
    display: inline-block;
    float: right;
    width: 100%;

	padding: 8px 12px 0px 0px;

    text-align: right;
    color: #fff;
}

.dropdownlogin
{
    display: none;
    height: auto;

	position: relative;

    padding-left: 12px;
    padding-right: 12px;
    padding-top: 8px;
    padding-bottom: 10px;

    border: 1px solid #fff;
	border-radius: 4px;
	background: #E34748;
}
.dropdownloginvisable
{
    display: block;
}
@media (min-width: 1040px)
{
    .dropdownlogin
    {
        display: none;
    }
}

/*/////////////////////////////////////////////////////////*/
/*Main*/
/*/////////////////////////////////////////////////////////*/

.main
{
	max-width: 100%;
	min-height: 100%;
	margin-top: 90px;
	background: white;
}
@media (max-width: 1040px)
{
    .main
    {
		display: block;
        float: none;
		width: 100%;
    }
}

.darkenall
{
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	width: 1000%;
	height: 100vh;
	background: rgba(0,0,0,.8);
}
.darkenallvisable
{
	display: block;
	z-index: 10;
}

.linetext
{
	font-size: 20px;
	font-weight: bold;
	color:#E34748;
	margin: 50px 0px 0px 0px;
}
.linetext::before
{
	content: " ";
	top: 50%;
	display: inline-block;
	height: 2px;
	background: #E34748;
	width: 40%;
}
.linetext::after
{
	content: " ";
	top: 50%;
	display: inline-block;
	height: 2px;
	background: #E34748;
	width: 40%;
}
@media (max-width: 1175px)
{
    .linetext::before
	{
		content: " ";
		top: 50%;
		display: inline-block;
		height: 2px;
		background: #E34748;
		width: 90px;
	}
	.linetext::after
	{
		content: " ";
		top: 50%;
		display: inline-block;
		height: 2px;
		background: #E34748;
		width: 90px;
	}
}

.locationtab
{
	display:block;
	width:100%;
	vertical-align: top;
	padding: 10px 5px 10px 5px;
}
@media (max-width: 1175px)
{
    .locationtab
    {
    }
}

.locationtabcontainer
{
	display:block; 
	width:100%; 
	padding:20px 40px 10px 40px;
}
@media (max-width: 1175px)
{
    .locationtabcontainer
    {
		display:block;
		width:100%;
		padding:0px 5px 0px 5px;
    }
}

.locationinfo
{
	display:inline-block; 
	float: left; 
	width:400px; 
	padding:60px 10px 15px 10px;
}
@media (max-width: 1175px)
{
    .locationinfo
    {
		display:block;
		width:100%;
		padding:0px 0px 15px 0px;
    }
}

.locationhours
{
	display:inline-block;  
	float:left; 
	padding:90px 40px;
}
@media (max-width: 1175px)
{
    .locationhours
    {
		display:block;
		width:100%;
		padding:0px 5px 0px 5px;
    }
}

.locationgooglemap
{
	display:inline-block;
	float:left;
	padding:40px 30px;
}
@media (max-width: 1175px)
{
    .locationgooglemap
    {
		display:block;
		width:100%;
		padding:5px 5px 90px 5px;
    }
}

/*/////////////////////////////////////////////////////////*/
/*Forms*/
/*/////////////////////////////////////////////////////////*/

.divwidth95
{
	width: 95%;
	height: 30px;
	display: inline-block;
}

.txtbox
{
	display:inline-block;
	width:49%;
	padding:10px 0px 10px 0px;
	overflow: visible;
}
@media (max-width: 768px)
{
	.txtbox
	{
		width:90%;
		padding:10px 10px 10px 10px;
	}
}

.txtbox2
{
	display:inline-block;
	width:32.3%;
	padding:10px;
}
@media (max-width: 768px)
{
	.txtbox2
	{
		width:90%;
	}
}

.textarea
{
	display: inline-block;
	width: 100%;
	padding: 30px 10px;
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    background-color: #fcfcfc;
}
@media (max-width: 768px)
{
	.textarea
	{
		padding:5px;
		border:1px solid #ccc;
		border-radius: 5px;
		background-color: #fcfcfc;
	}
}
/*
.txtarea
{
	display: inline-block;
	width: 100%;
	padding: 30px 10px;
}
*/

.catformcontainer
{
	display:inline-block;
	width:100%;
	padding:50px 100px 50px 100px;
}
@media (max-width: 768px)
{
	.catformcontainer
	{
		padding:5px;
	}
}

.redtxt
{
	display: inline;
	color: #e80000;
	font-size:15px;
	font-weight: bold;
}

.notfilledout
{
	background: #FFDDDD !important;
}

/*/////////////////////////////////////////////////////////*/
/*Menu*/
/*/////////////////////////////////////////////////////////*/

.menusection
{
	display: inline-block;
	cursor: pointer;
	font-size: 12px;
    margin: 0px 7px 0px 7px;
}

.menuitems
{
	display: block;
	width: 100%;
	overflow: hidden;
}
.menuitemshidden
{
	display: none;
}

.menuitem
{
	display: inline-block;
	float: none;
    border-radius: 5px;
	width: 48%; /*600px*/
	height: 150px;
	margin: 5px;
	background-color: #EFEFEF;
	cursor: pointer;
	vertical-align: top;
	overflow: hidden;
}
@media (max-width: 1125px)
{
	.menuitem
	{
		width: 96%;
		height: 100px;
	}
}

.menuitemheader
{
	display: inline-block;
	float: left;
	min-height: 150px;
	min-width: 150px;
	width: 150px;
	height: 150px;
	background-color: #EFEFEF;
}
@media (max-width: 1125px)
{
	.menuitemheader
	{
		min-height: 100px;
		min-width: 100px;
		width: 100px;
		height: 100px;
	}
}

.texttitle
{
	font-size:18px;
  color: #2A72E3;
	}
@media (max-width: 1125px)
{
	.texttitle
	{
		font-size:15px;
	}
}

.textdescription
{
  font-size:13px;
  font-style: italic;
}
@media (max-width: 1125px)
{
	.textdescription
	{
		font-size:12px;
	}
}

.menuitemprice
{
	display: inline-block;
	height: 30px;
	text-align: center;
	font-size: 18px;
	min-width: 100%;
	padding: 1px 3px 4px 3px;
	color: white;
	background: #E34748;
	line-height: 30px;
	text-align: center;
}

.menuitempricefull
{
	display: inline-block;
	height: 150px;
	text-align: center;
	font-size: 18px;
	min-width: 100%;
	padding: 1px 5px 4px 5px;
	color: white;
	background: #E34748;
	line-height: 150px;
	text-align: center;
}
@media (max-width: 1125px)
{
	.menuitempricefull
	{
		height: 100px;
		font-size: 15px;
		line-height: 100px;
	}
}

.menuitemtext
{
	display: inline-block;
	width: calc(100% - 150px); /*450px*/
	float: left;
	padding: 5px 5px 5px 5px;
	text-align: left;
}
@media (max-width: 1125px)
{
	.menuitemtext
	{
		width: calc(100% - 100px);/*250px*/
	}
}

.categoryname
{
	display: inline-block;
	font-size: 20px;
	color: white;
	background: #E34748;
	border-radius: 4px;
	width: 80%;
	text-align: center;
	cursor: pointer;
	margin: 5px 0px 0px 0px;
}

.categorybody
{
	display: inline-block;
}
@media (max-width: 768px)
{
	.categorybody
	{
		display: none;
	}
}
.categorybodytoggle
{
	display: none;
}
@media (max-width: 768px)
{
	.categorybodytoggle
	{
		display: inline-block;
	}
}

.categoryarrow
{
	color: white;
	display: inline-block;
	/*
	position: absolute;
	right: 5px;
	top: 2px;
	*/
	float: right;
	margin: 4px 8px 0px 2px;
	text-align: right;
	font-size: 16px;
}
@media (max-width: 768px)
{
	.categoryarrow
	{
		/*transform: rotate(180deg);*/
	}
}
.categoryarrowrotated
{
	transform: rotate(180deg);
}

/*/////////////////////////////////////////////////////////*/
/*Item Pages*/
/*/////////////////////////////////////////////////////////*/

.itempage
{
	max-height: 700px;
	width: 500px;
	overflow: hidden;
	background-color: #FFFFFF;
	padding: 5px;
	border-radius: 3px;
	position: fixed;
	top: 150px;
	left: calc(50% - 400px);
	z-index: 1; /* Sit on top */
	float: left;
	overflow-y: auto;
}
@media (max-width: 815px)
{
	.itempage
	{
		height: 80%;
		width: 90%;
		overflow: hidden;
		background-color: #F0F0F0;
		padding: 5px;
		border-radius: 3px;
		position: fixed;
		top: 100px;
		left: 5%;
		z-index: 1; /* Sit on top */
		float: left;
	}
}
@media (max-height: 768px)
{
	.itempage
	{
		height: 80%;
		/*width: 90%;*/
		overflow: hidden;
		background-color: #F0F0F0;
		padding: 5px;
		border-radius: 3px;
		position: fixed;
		top: 100px;
		left: 5%;
		z-index: 1; /* Sit on top */
		float: left;
	}
}

.menupagetitle
{
	display: block;
	height: 30px;
	text-align: center;
	font-size: 18px;
	min-width: 100%;
	padding: 3px 5px 3px 5px;
	color: white;
	background: #E34748;
}
@media (max-width: 768px)
{
	.menupagetitle
	{
		font-size: 14px;
	}
}

.buttonx
{
    display: -webkit-inline-box;
    -webkit-box-pack: center;
    -webkit-box-align: center;
	height: 100%;
	width: 30px;
	background: #E34748;
	float: left;
	color: white;
	font-size: 28px;
	text-align: center;
	line-height: 22px;
	cursor: pointer;
	border-radius: 4px;
}

.buttonaddtobag
{
	cursor: pointer;
	display: inline-block;
	background: #E34748;
	color: white;
	width: 150px;
	height: 40px;
	font-size: 15px;
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-radius: 6px;
}
@media (max-width: 768px)
{
	.buttonaddtobag
	{
		cursor: pointer;
		background: #E34748;
		color: white;
		width: 130px;
		height: 40px;
		font-size: 13px;
		text-align: center;
		padding: 10px 0px 10px 0px;
		border-radius: 6px;
	}
}

.bttnplusminus
{
	display: inline-block;
	cursor: pointer;
	color: grey;
	width: 40px;
	height: 40px;
	font-size: 24px;
	text-align: center;
	border-radius: 50%;
	border: 2px solid grey;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
@media (max-width: 768px)
{
	.bttnplusminus
	{
		cursor: pointer;
		background: #FFFFFF;
		color: grey;
		width: 40px;
		height: 40px;
		font-size: 24px;
		text-align: center;
		border-radius: 50%;
		border: 2px solid grey;
	}
}
.bttnplusminus:hover
{
    color: lightblue;
	border-color: lightblue;
}

.numberbox
{
	display: inline-block;
	border: 2px solid grey;
	color: grey;
	width: 60px;
	height: 40px;
	border-radius: 6px;
	font-size: 18px;
	text-align: center;
	padding: 5px 0px 5px 0px;
}
@media (max-width: 768px)
{
	.numberbox
	{
		border: 2px solid grey;
		background: #FFFFFF;
		color: grey;
		width: 60px;
		height: 40px;
		border-radius: 6px;
		font-size: 18px;
		text-align: center;
		padding: 5px 0px 5px 0px;
	}
}

.itemnotes
{
	display: inline-block;
	width: 100%;
	padding: 30px 10px;
    padding:5px;
    border:1px solid #ccc;
    border-radius: 5px;
    background-color: #fcfcfc;
	height: 80px;
}
@media (max-width: 768px)
{
	.itemnotes
	{
		padding:5px;
		border:1px solid #ccc;
		border-radius: 5px;
		background-color: #fcfcfc;
	}
}

.itempageinner
{
	display:flex;
	flex-direction:column;
	height:600px;
}
@media (max-width: 768px)
{
	.itempageinner
	{
		height:auto;
	}
}

/*/////////////////////////////////////////////////////////*/
/*Checkout*/
/*/////////////////////////////////////////////////////////*/

.addressarea
{
	display: none;
	position: fixed;
    text-align: center;
	top: 100px;
	left: 0px;
	right: 0px;
	height: calc(90% - 90px);
	width: 40%;
	padding: 5px 5px 5px 5px;
	margin: 0 auto;
	border-radius: 4px;
	background-color: #EFEFEF;
	/*box-shadow: 5px 10px 18px #888888;*/
	overflow: auto;
	z-index: 20;
}
@media (max-width: 1125px)
{
	.addressarea
	{
		width: 95%;
	}
}
.addressareavisible
{
	display: block;
}

.checkoutarea
{
	display: none;
	position: fixed;
    text-align: center;
	top: 100px;
	left: 0px;
	right: 0px;
	height: calc(90% - 90px);
	width: 90%;
	padding: 5px 5px 5px 5px;
	margin: 0 auto;
	border-radius: 4px;
	background-color: #EFEFEF;
	z-index: 20;
}
.checkoutareavisible
{
	display: block;
}

.transcompletearea
{
	display: none;
	position: fixed;
	top: 100px;
	left: 0px;
	right: 0px;
	height: calc(90% - 90px);
	width: 90%;
	padding: 5px 5px 5px 5px;
	margin: 0 auto;
	border-radius: 4px;
	background-color: white;
	z-index: 20;
}
.transcompleteareavisible
{
	display: block;
}

.cateringcheckout
{
	display: none;
	position: fixed;
    text-align: center;
	top: 100px;
	left: 0px;
	right: 0px;
	height: calc(90% - 90px);
	width: 40%;
	padding: 5px 5px 5px 5px;
	margin: 0 auto;
	border-radius: 4px;
	background-color: #EFEFEF;
	padding: 10px;
	/*box-shadow: 5px 10px 18px #888888;*/
	z-index: 20;
}
@media (max-width: 1125px)
{
	.cateringcheckout
	{
		width: 95%;
	}
}
.cateringcheckoutvisible
{
	display: block;
}

.chosenaddress
{
	background: grey;
}

.addcardbutton
{
	display: none;
	height: 40px;
}
.addcardbuttonvisible
{
	display: block;
}

.addcardform
{
	display: none;
}
.addcardformvisible
{
	display: block;
}

.addcardform
{
	display: none;
}
.addcardformvisible
{
	display: block;
}

.remembermeform
{
	display: none;
	align-self: center;
	text-align: center;
}
@media (max-width: 768px)
{
	.remembermeform
	{
		width: 95%;
	}
}
.remembermeformvisible
{
	display: block;
}

.choosecard
{
	width: auto;
	font-size: 14px;
	background: lightgrey;
	padding: 5px 5px 5px 5px;
	margin: 10px 5px 10px 5px;
}
.chosencard
{
	background: lightblue;
	border: solid;
	border-width:2px;
	border-color:#488ac7;
	border-radius: 3px;
}

.customtip
{
	height: 32px !important;
	width: 70px !important;
	margin: 5px 5px 5px 5px !important;
	position: relative !important;
	top: 2px !important;
	text-align: center !important;
}
.customtipselected
{
	border: 3px solid #488ac7 !important;
}

.quotebutton
{
	padding:2px 6px 2px 2px;
	border-radius:3px;
	float:left;
}
@media (max-width: 1040px)
{
    .quotebutton
    {
		float:none;
	}
}

.quotetext
{
	display:inline-block;
	padding:5px 5px 5px 5px;
	text-align:center;
}
@media (max-width: 1040px)
{
    .quotetext
    {
		display:block;
	}
}

/*/////////////////////////////////////////////////////////*/
/*Cart*/
/*/////////////////////////////////////////////////////////*/

.carttab
{
	margin-right: 300px;
}

.cartarea
{
	position: fixed;
	top: 90px;
	right: 0px;
	height: calc(100% - 90px);
	width: 300px;
	padding: 5px 5px 5px 5px;
	background-color: #EFEFEF;
	overflow-y: auto;
	border-left: 4px solid white;
	padding: 5px 5px 10px 5px;
}
@media (max-width: 1040px)
{
    .cartarea
    {
		display: none;
		top: 100px;
		left: 0px;
		width: 90%;
		margin: 0 auto;
		border-radius: 4px;
		border: none;
		height: calc(100% - 120px);
		padding: 10px 10px 20px 10px;
		z-index: 20;
    }
	.cartareavisible
	{
		display: block;
	}
}

.cartitem
{
	min-height: 50px;
	margin: 2px 2px 2px 2px;
	display:flex;
	flex-direction:row;
	align-items:center;
	vertical-align: middle;
}

.cartitemname
{
	display: inline-block;
	float: left;
	font-size: 12px;
	margin: 0px 10px 0px 0px;
}

.cartitemprice
{
	display:inline-block;
	float: right;
	position: static;
	font-size: 15px;
	margin: 0px 10px 0px auto;
}

.cartitemx
{
	display: inline-block;
	float: right;
	color: red;
	font-size: 13px;
	margin: 0px 10px 0px 5px;
	cursor: pointer;
}

/*/////////////////////////////////////////////////////////*/
/*Buttons*/
/*/////////////////////////////////////////////////////////*/

.buttoncheckout
{
	display:inline-block;
	cursor: pointer;
	background: #E34748;
	color: white;
	width: 180px;
	height: 40px;
	font-size: 15px;
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-radius: 6px;
	border: none;
	margin: 2px 0px 0px 0px;
}

.biggreybttn
{
	display:inline-block;
	cursor: pointer;
	background: #CCC;
	color: white;
	width: 180px;
	height: 40px;
	font-size: 15px;
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-radius: 6px;
	border: none;
	margin: 2px 0px 0px 0px;
}

.submitbttn
{
    padding:8px 20px;
    background:#ccc;
    border:0 none;
    cursor:pointer;
    border-radius: 5px;
    color: black;
	font-size: 11px;
}

.greybttn
{
    display: inline-block;
    padding:8px 20px;
    background:#CCC;
    border:0 none;
    cursor:pointer;
    border-radius: 5px;
    color: white;
    font-size: 11px;
}

.bluebttn
{
    display: inline-block;
    padding:8px 20px;
    background:#2A72E3;
    border:0 none;
    cursor:pointer;
    border-radius: 5px;
    color: white;
    font-size: 11px;
    margin-bottom: 5px;
}

.tipbttn
{
    display: inline-block;
    padding:8px 20px;
    background:#99b3ff;
    border:0 none;
    cursor:pointer;
    border-radius: 5px;
    color: white;
    font-size: 11px;
    margin: 5px 5px 5px 5px;
}
.tipbttnselected
{
	background:#2A72E3;
}

.selectedbutton
{
	border: solid;
	border-width:2px;
	border-color:#488ac7;
	border-radius: 3px;
}

.gallerybutton
{
	display:inline-block;
	cursor: pointer;
	background: #E34748;
	color: white;
	width: 100px;
	height: 40px;
	font-size: 15px;
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-radius: 6px;
	border: none;
	margin: 2px 0px 0px 0px;
}

.gallerybuttonunselected
{
	display:inline-block;
	cursor: pointer;
	background: #E34748;
	color: white;
	width: 100px;
	height: 40px;
	font-size: 15px;
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-radius: 6px;
	border: none;
	margin: 2px 0px 0px 0px;
}

.hidebutton
{
	display: none;
}

/*/////////////////////////////////////////////////////////*/
/*Profile Area*/
/*/////////////////////////////////////////////////////////*/

.mainprofile
{
	max-width: 100%;
	min-height: calc(100% - 150px);
	margin-top: 90px;
	background: #f9f9f9;
    text-align: center;
}

.profilearea
{
	margin-top: 30px;
	margin-bottom: 20px;
	display: inline-block;
	align-self: center;
	border: 1px solid #D0D0D0;
	background-color: white;
	width: 60%;
	text-align: center;
}
@media (max-width: 768px)
{
	.profilearea
	{
		margin-top: 10px;
		display: inline-block;
		align-self: center;
		border: 1px solid #D0D0D0;
		background-color: white;
		width: 95%;
		text-align: center
	}
}

.profileupdate
{
	display: none;
	position: fixed;
	top: 100px;
	left: 0px;
	right: 0px;
	height: 90%;
	width: 90%;
	padding: 5px 5px 5px 5px;
	margin: 0 auto;
	border-radius: 4px;
}
.profileupdatevisible
{
	display: block;
}

.reservationarea
{
	margin-top: 30px;
	margin-bottom: 20px;
	display: inline-block;
	align-self: center;
	border: 1px solid #D0D0D0;
	background-color: white;
	width: 60%;
	text-align: center;
}
@media (max-width: 768px)
{
	.reservationarea
	{
		margin-top: 10px;
		display: inline-block;
		align-self: center;
		border: 1px solid #D0D0D0;
		background-color: white;
		width: 95%;
		text-align: center
	}
}

/*/////////////////////////////////////////////////////////*/
/*Catering Banner*/
/*/////////////////////////////////////////////////////////*/

.banner
{
	background-color:#181818;
}
@media (max-width: 1175px)
{
    .banner
    {
        display: none;
    }
}

/*
.bannertxt
{
	border-radius: 10px;
	font-size:50px;
	text-align:center;
	position: absolute;
	top: 240px;
	left: 40%;
	transform: translate(-50%, -50%);
	opacity: .8;
	background-color: black;
	color: white;
	padding: 10px 20px 10px 20px;
}

.bannertxt2
{
	border-radius: 10px;
	font-size:50px;
	text-align:center;
	position: absolute;
	top: 240px;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: .8;
	background-color: black;
	color: white;
	padding: 10px 20px 10px 20px;
}
.bannertxt3
{
	border-radius: 10px;
	font-size:40px;
	text-align:center;
	position: absolute;
	top: 320px;
	left: 40%;
	transform: translate(-50%, -50%);
	opacity: .8;
	background-color: black;
	color: white;
	padding: 10px 20px 10px 20px;
}
@media (max-width: 1175px)
{
	.bannertxt3
	{
		border-radius: 10px;
		font-size:25px;
		text-align:center;
		position: absolute;
		top: 150px;
		left: calc(50% - 150px);
		transform: translate(-50%, -50%);
		opacity: .8;
		background-color: black;
		color: white;
		padding: 10px 15px 10px 15px;
	}
}
@media (max-width: 768px)
{
	.bannertxt3
	{
		left: 50%;
	}
}
*/

.bannertxt
{
	border-radius: 10px;
	font-size:40px;
	text-align:center;
	position: absolute;
	top: 320px;
	left: 40%;
	transform: translate(-50%, -50%);
	opacity: .8;
	background-color: black;
	color: white;
	padding: 10px 20px 10px 20px;
}
@media (max-width: 1175px)
{
	.bannertxt
	{
		border-radius: 10px;
		font-size:25px;
		text-align:center;
		position: absolute;
		top: 150px;
		left: calc(50% - 150px);
		transform: translate(-50%, -50%);
		opacity: .8;
		background-color: black;
		color: white;
		padding: 10px 15px 10px 15px;
	}
}

.mainbanner
{
	width:100%;
}
@media (max-width: 1175px)
{
	.mainbanner
	{
	}
}

.catnote
{
	width:100%;
	height:120px;
	background-color:#555555;
	font-size:25px;
	color:White;
	text-align:center;
	padding-top:20px;
}
@media (max-width: 1175px)
{
	.catnote
	{
		font-size:15px;
        color:white;
		padding:35px;
	}
}

.catserv
{
	display:inline-block;
	float:right;
	width:50%;
	padding:50px 100px 50px 100px;
}
@media (max-width: 768px)
{
	.catserv
	{
		width:100%;
		padding:20px 10px;
	}
}

.catitle
{
	font-size:25px;
	font-weight:bold;
	text-align:center;
	padding-bottom:30px;
}
@media (max-width: 768px)
{
	.catitle
	{
		font-size:20px;
		padding-bottom:10px;
	}
}

.catpricenote
{
	display: inline-block;
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	text-align: center;
	padding: 0px 20px;
	font-style: italic;
}
@media (max-width: 768px)
{
	.catpricenote
	{
		padding: 20px 20px 0px 20px;
	}
}

.greyarea
{
	width:100%;
	background-color:#F1F2F2;
	padding:20px 100px 40px 100px;
}
@media (max-width: 768px)
{
	.greyarea
	{
		padding:20px 15px 40px 15px;
	}
}

/*/////////////////////////////////////////////////////////*/
/*Catering Button Panel*/
/*/////////////////////////////////////////////////////////*/

.cateringmenu
{
	height:170px;
    background-color:#E34748;
	text-align:center;
}
@media (max-width: 1175px)
{
    .cateringmenu
    {
		display: none;
    }
}

.cateringsub
{
	display:inline-block;
	height:100%;
	width:95%;
	background-color:#E34748;
	padding:10px 20px 10px 20px;
}
@media (max-width: 1175px)
{
    .cateringsub
    {
		display:inline-block;
		height:auto;
		width:95%;
		background-color:#C8C8C8;
		padding:10px 20px 10px 20px;
    }
}

.cateringtab
{
	display:inline-block;
	float:center;
	height:100%;
	width:33%;
	vertical-align: top;
}
@media (max-width: 1175px)
{
    .cateringtab
    {
		float:none;
		height:auto;
		width:100%;
		padding:0px 0px 5px 0px;
    }
}

.cateringcentertext
{
	padding: 10px;
	display: flex;
	justify-content: center;
	flex-direction: column;
	background-color:white;
	height:100%;
    border-radius: 5px;
}

.reservationcentertext
{
	padding: 10px;
	display: flex;
	justify-content: center;
	flex-direction: row;
	background-color:white;
	height:100%;
    border-radius: 5px;
}
.cateringtabtext
{
	font-size: 20px;
	font-weight: bold;
}

.cateringtabbtn
{
	display: inline-block;
	align-self: center;
	border-radius: 5px;
	color: #ffffff;
	background: #E34748;
	padding: 10px 20px 10px 20px;
	width: 100px;
	margin: 5px 0px 0px 0px;
}

/*/////////////////////////////////////////////////////////*/
/*App and Social*/
/*/////////////////////////////////////////////////////////*/

.social
{
	display:inline-block;
	background-color:#E34748;
	height:100%;
	/*width:50%;*/
	float:left;
	padding:35px 0px 0px 0px;
	font-size:25px;
	color:white;
	/*border-left:3px solid white;*/
	height:100%;
}
@media (max-width: 768px)
{
	.social
	{
		font-size:12px;
	}
}

/*/////////////////////////////////////////////////////////*/
/*Sign Up*/
/*/////////////////////////////////////////////////////////*/

.signupinput
{
    width: 40% !important;
    background-color: grey !important;
    color: white !important;
	padding: 10px 0px 10px 10px !important;
	margin: 5px 5px 5px 5px !important;
    display: inline-block !important;
    border: 2px solid white !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    opacity: 0.7 !important;
    filter: alpha(opacity=70) !important; /* For IE8 and earlier */
}
@media (max-width: 768px)
{
	.signupinput
	{
		width: 60% !important;
		background-color: grey !important;
		color: white !important;
		padding: 10px 0px 10px 10px !important;
		margin: 5px 5px 5px 5px !important;
		display: inline-block !important;
		border: 2px solid white !important;
		border-radius: 6px !important;
		opacity: 0.7 !important;
		filter: alpha(opacity=70) !important; /* For IE8 and earlier */
	}
}

.signupcontainer
{
	display: block;
	height: 80px;
	width: 100%;
	background-color: black;
	text-align: center; margin: 0px 0px 0px 0px;
	padding: 20px 10px;
	overflow: hidden;
}

/*/////////////////////////////////////////////////////////*/
/*Blog*/
/*/////////////////////////////////////////////////////////*/
/*
.blogiconlink
{
	display:inline-block; 
	float:left; 
	margin:10px;
}

.blogiconpic
{
	width:300px; 
	height:300px;
}
*/
.blogiconlink
{
}

.blogiconpic
{
	width:90%;
	margin:10px 0px 10px 0px;
}

/*/////////////////////////////////////////////////////////*/
/*Google Map*/
/*/////////////////////////////////////////////////////////*/
.googlemap
{
	width: 600;
	height: 450;
}
@media (max-width: 768px)
{
	.googlemap
	{
		width: 250;
		height: 600;
	}
}

/*/////////////////////////////////////////////////////////*/
/*Footer*/
/*/////////////////////////////////////////////////////////*/

.footer
{
	width: 100%;
	height: 150px;
	background-color:#EFEFEF;
}

.copyright
{
	width: 100%;
	padding: 50px 0px 0px 0px;
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	color: #E34748;
}

.powered
{
	width: 100%;
	text-align: center;
	color: #4371A6;
}

/*/////////////////////////////////////////////////////////*/
/*Stripe*/
/*/////////////////////////////////////////////////////////*/
.loader
{
    text-align: center;
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #00BFFF; /* Blue */
    border-radius: 50%;
    width: 80px;
    height: 80px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    margin: 50px auto 50px auto;
}
@-webkit-keyframes spin
{
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin
{
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/*/////////////////////////////////////////////////////////*/
/*Stripe*/
/*/////////////////////////////////////////////////////////*/

/**
 * The CSS shown here will not be introduced in the Quickstart guide, but shows
 * how you can use CSS to style your Element's container.
 */
.StripeElement
{
	background-color: white;
	height: 40px;
	padding: 10px 12px;
	border-radius: 4px;
	border: 1px solid transparent;
	box-shadow: 0 1px 3px 0 #e6ebf1;
	-webkit-transition: box-shadow 150ms ease;
	transition: box-shadow 150ms ease;
}

.StripeElement--focus
{
	box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid
{
	border-color: #fa755a;
}

.StripeElement--webkit-autofill
{
	background-color: #fefde5 !important;
}