@import url('https://fonts.googleapis.com/css?family=Oswald&display=swap');

@font-face {
  font-family: 'BebasNeue Thin'; /* Name your custom font family */
  src: url('https://ecatalogfiles.blob.core.windows.net/files/survey/font/BebasNeue Thin.otf') format('opentype'); /* Font file and format */
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'BebasNeue Light'; /* Name your custom font family */
  src: url('https://ecatalogfiles.blob.core.windows.net/files/survey/font/BebasNeue Light.otf') format('opentype'); /* Font file and format */
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'BebasNeue Bold'; /* Name your custom font family */
  src: url('https://ecatalogfiles.blob.core.windows.net/files/survey/font/BebasNeue Bold.otf') format('opentype'); /* Font file and format */
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'BebasNeue-Regular'; /* Name your custom font family */
  src: url('https://ecatalogfiles.blob.core.windows.net/files/roadster/CustomFont/Avenir%20Book.ttf') format('opentype'); /* Font file and format */
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'AvenirRoman'; /* Name your custom font family */
  src: url('https://ecatalogfiles.blob.core.windows.net/files/roadster/CustomFont/AvenirRoman.ttf') format('opentype'); /* Font file and format */
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'AvenirHeavy'; /* Name your custom font family */
  src: url('https://ecatalogfiles.blob.core.windows.net/files/roadster/CustomFont/AvenirHeavy.ttf') format('opentype'); /* Font file and format */
  font-weight: normal;
  font-style: normal;
}

body, .tabs, .tab, .dropbtn, .dropdown-content, #menuitemstabs, .overlay{
	font-family: 'AvenirHeavy' !important;

}
.menu-item-name, .menu-item-detail-name, .subcategory-title{
	font-family: 'BebasNeue-Regular'!important;
	color: #444!important;
}
.menu-item-price, .menu-item-detail-price{
	font-family: 'AvenirHeavy'!important;
	color: #D09336!important;
}
.menu-item-description, .menu-item-detail-description{
	font-family: 'AvenirRoman'!important;
	color: #444!important;
}

/* INCREASING BANNER HEIGHT */
body{
	overflow-y: hidden;
}
.carousel-inner .carousel-item.categories{
	height: 150px;
}

#banner{
	height: 150px;
}

#menu-title{
	top: 115px;
}

@media (max-width: 820px)
.menu-items {
    height: calc(100vh - 193px) !important; 
}

@media (max-width: 768px)
.menu-items {
    height: calc(100vh - 210px) !important;
}

.menu-items {
    display: none;
    height: calc(100vh - 193px) !important; 
    overflow-y: auto;
}
/* END INCREASING BANNER HEIGHT */

@media (max-width: 820px) {

    .image-container .image {
        flex: unset !important;
        margin: 20px !important;
        width: 100% !important;
    }

    .menu-items {
        height: calc(100vh - 143px);
    }

    .menu-item {
        display: flex !important;
        /* margin: 0px 0px 0px 0px !important; */
        /* border-bottom: 1px solid #ddd !important; */
        border: 1px solid #ddd !important;
        padding: 0px 0 10px 0 !important;
        flex-direction: column !important;
        width: unset !important;
        float: unset !important;
        height: unset !important;
    }

    .menu-item-image {
        margin-right: 0px !important;
        border-radius: 0px !important;
    }

    .menu-item-info {
        margin: 10px 15px 5px 15px !important;
    }
}


.menu-item-name, .tab {
	text-transform: uppercase;
}

/** Start Tab headers scroll */
.dropdown {
    display: none !important;
}

.tabs-container {
    overflow-x: auto !important;
}

.tabs {
    overflow-x: auto !important;
}

.tab {
    display: block !important;
}


/** End Tab headers scroll */


@media (max-width: 820px) {
    .category-page {
        overflow-x: hidden;
        overflow-y: auto;
        position: relative;
        left: 0px;
        top: 0px;
    }

    .category-page-header {
        height: 53px;
        background-color: #111111;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        border-bottom: 4px solid #8d0000;
    }

    .category-page-item {
        height: 130px;
        background-color: #8d0000;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        border-bottom: 4px solid #8d0000;
        width: unset !important;
        float: unset !important;
        margin-left: unset !important;
        margin-right: unset !important;
        border-radius: unset !important;
        margin-top: unset !important;
    }

    .category-page-item-span {
        top: 15px;
        left: 20px;
        color: white !important;
        justify-content: unset !important;
        margin: unset !important;
        position: absolute;
    }

    .category-page-item-image {
        border-radius: 0px !important;
    }

    .category-page-item-overlay {
        opacity: 0.2 !important;
    }

    .category-page-back-button-label, .back-button-label {
        left: 50px;
        /*text-shadow: -0.5px 0.5px 2px black;*/
        display: block;
    }
}



/* START DOCK MENU TO THE TOP OF THE PAGE */

.tabs.sticky {
  position: fixed;
  top: 0px!important;
  z-index: 99999;
}
.menu-items.sticky {
  margin-top: 43px;
}

#menuitemspage{
	overflow-y: auto!important;
}
body{
	overflow-y: auto!important;
}
.menu-items{
    height: unset!important;
}
/* END DOCK MENU TO THE TOP OF THE PAGE */



/* Start Dark Mode */
body, .content{
    background-color: #111 !important;
}
h5.title, .catalog-title {
    color: #eee !important;
}

.tabs, .tab, .dropbtn, .dropdown-content, .menu-item, 
.menu-items, .overlay, .carousel-item, 
.category-page-back-button-label, .back-button-label, 
.category-page-item-span {
    background-color: #111 !important;
}
.tabs, .tab, .dropbtn, .dropdown-content, .menu-item, 
.menu-items, .overlay, .carousel-item, 
.category-page-back-button-label, .back-button-label, 
.category-page-item-span {
    color: #eee !important;
}
.menu-item-name, 
.menu-item-price, 
.menu-item-description,
.menu-item-detail-name,
.menu-item-detail-price,
.menu-item-detail-description,
.subcategory-title {
    color: #eee!important;
}

.menu-item {
    border: 1px solid #777 !important;
}
.subcategory-title {
	border-bottom: 1px solid #777 !important;
}
.tab.selected-tab{
    background-color: #F7B731 !important;
	color: #111 !important;
}

/* End Dark Mode */