@import url('https://fonts.googleapis.com/css2?family=Happy+Monkey&family=Poppins&display=swap'); 

body {
	background: transparent;
	font-family: 'Poppins', sans-serif !important;
}

nav#main-nav {
    background: #212020;
}

.navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav>li>a {
	color: #FFDE00 !important;
}

.navbar-nav > li > a:hover, .navbar-nav > li > a:focus {
	background: #0065a4 !important;
	color: #fff !important;
}



.office-info  {
	margin-top: -1px;
	background: linear-gradient(rgb(255 222 0 / 21%), rgb(0 101 164 / 48%)), url(uploads/bg_3.jpg) no-repeat;
	background-size: cover !important;
	background-attachment: fixed !important;
	background-position: 0 -60px !important;
    
} 

.office-info .logo img {
    width: 228px;
}


.office-info .desk-top-title {
    font-family: 'Poppins', sans-serif !important;
}

#estimated-time {
	color: #ffde00;
}

.pn-Advancer {
    background-color: #4440 !important;
}

.pn-Advancer_Icon {
    fill: #ffde00 !important;
}

#menu {
    box-shadow: 3px 10px 30px -25px rgba(0, 0, 0, 0.75);
    background-color: #212020!important;
}

#menu ul li a {
	color: #ffde00 !important;
	font-size: 12px !important;
	text-transform: uppercase;
	font-family: 'Poppins', sans-serif !important;
	letter-spacing: .2em;
}

#menu ul li a:hover, #menu ul li:hover > a {
    background: #0065a4 !important;
}

#menu-cont > #menu > #menu-ul > li > a.menu-active {
    font-weight: 600;
    color: #ffde00;
    border-bottom: none !important;
     background: #0065a4 !important;
}

.menu-item {
   background: linear-gradient(rgb(255 255 255), rgb(255 255 255 / 90%)), url(uploads/bg_4.jpg);
   background-attachment: fixed;
   background-size: cover;
   background-position: center;
   padding: 20px 0px 50px 0px;
   box-shadow: inset 0 0px 20px -100px #0065a4;
}

#menu-items h1 {
	/* text-transform: uppercase; */
	font-family: 'Poppins';
	color: #fff!important;
	padding: 15px;
	/* text-align: center; */
	background: #212020;
	font-size: 35px;
	letter-spacing: 1px;
}

#menu-items .item-title {
	width: 100%;
	text-align: center;
	text-transform: capitalize;
	color: #ffde00 !important;
	font-family: 'Poppins', sans-serif !important;
	padding: 20px;
}

#menu-items .item-price {
	font-family:  'Poppins', sans-serif !important;
	color: #ffde00;
}

span.dollar-sign {
    /* color: #ba9463; */
}

.item-icons {
    filter: invert(90%) sepia(84%) saturate(2010%) hue-rotate(304deg) brightness(78%) contrast(82%);
}

.item-description {
    text-align: center;
    text-transform: capitalize;
    color: #fff !important;
}

 #menu-items ul li.group, 
 #menu-items ul li.single {
    padding: 10px;
    border: 1px #ffde00 solid !important;
    background: #212020 !important;
}  

span.menu-item-outofstock {
   display: flex;
   justify-content: center;
}

 #menu-items ul li.single:hover,
#menu-items ul li.group:hover {
	border: 1px #0065a4 solid !important;
}


.single,
#menu-items .group {
     border:  none !important;
}

#displayDeals h2{
	text-transform: uppercase;
	font-family: 'Poppins', sans-serif !important;
	color: #000 !important;
	padding: 15px;
	text-align: center;
}

.section {
    text-transform: uppercase;
    color: #000 !important;
    font-family: 'Poppins', sans-serif !important;
}

#displayDeals {
    font-family: 'Poppins', sans-serif !important;
}

.modal-header > h4 {
    font-family: 'Poppins', sans-serif !important;
}

label {
	font-family: 'Poppins', sans-serif !important;
}

p {
	font-family: 'Poppins', sans-serif !important;
}

.popup-current-toppings #current-toppings-hd, .popup-extra-toppings #extra-toppings-hd, .item-option-radio p {
    font-family: 'Poppins', sans-serif !important;
}

input#modal-addbtn {
    font-family: 'Poppins', sans-serif !important;
    text-transform: uppercase;
}

input {
	text-transform:uppercase;
	font-family: 'Poppins', sans-serif !important;
}

input:checked+.input-group-label {
    background: #0065a4 !important;
}

.input-group-label:hover {
    background: #4daae982 !important;
}

.item-add-buttons .btn-primary {
    background-color: #0065a4 !important;
    border-color: #0065a4 !important;
}

.btn-primary:hover {
    background-color: #0065a4bd !important;
    border-color: #0065a4bd !important;
}

@media (max-width: 1366px) and (max-height: 768px){
	.office-info {
		background-position: 0% 20% !important;
	} 

	#menu-items ul li.group:hover {
		background-position: 35% -9%;
	}
}

@media screen and (min-width: 1025px){
	.office-info .desk-top-title {
		color: #000;
	}

    .store-info {
        margin-left: 0px; 
    }

    .office-info p, #h-address a {
	    color: #000;
	}

	.menu-item {
		margin-bottom: 0px !important;
	}

	#menu-items h1 {
        font-size: 35px !important;
        letter-spacing: 1px;
        background: transparent !important;
        color: #0065a4 !important;
        text-align: center !important;
    }

	#menu-desc-header, #menu-desc-footer {
		text-align: center;
	}

	#menu-items .group .item-title {
        width: 100% !important;
     }

	#menu-items .item-title {
		width: 100% !important;
	}

    #menu-items .item-price {
		width: 100% !important;
		text-align: center !important;
		background: #0065a4 !important;
	}
}

@media (max-width: 1024px){
	#menu-desc-header, #menu-desc-footer {
        text-align: center;
    }
    #menu ul li a {
	color: #ffde00 !important;
	font-size: 12px !important;
	text-transform: uppercase;
	font-family: 'Poppins', sans-serif !important;
	letter-spacing: .2em;
    }
    #menu-cont > #menu > #menu-ul > li > a.menu-active {
    	color: #fff !important;
    }
    #menu-items {
    	padding: 0 !important;
    }
    #menu-items h1 {
    	background: none !important;
    	color: #0065a4 !important;
    }
    #menu ul li {
    	background #212020 !important;
    }
}


/* @media only screen and (min-width: 769px){
	#menu ul li a:hover, #menu ul li:hover > a {
		color: #fff !important;
		background: #212020 !important;
		font-weight: 600;
	}
} */

@media (max-width: 768px){
	#menu-cont > #menu > #menu-ul > li > a.menu-active {
        background-color: #212020 !important;
        color: #fff  !important;
        background: #0065a4 !important;
    }

    #menu ul li a {
        padding: 14px !important;
        background-color: #fff0 !important;
    }

	#menu-items {
        padding: 2px !important;
    }

	#menu-items h1 {
        background-color: #e2e2e200 !important;
        font-size: 30px !important;
/*         padding: 21px !important; */
        font-weight: 700 !important;
        letter-spacing: 1px;
        text-align: center;
    }

    #menu-items ul li.group, #menu-items ul li.single {
        padding: 20px;
        margin-bottom: 10px;
    }

    .menu-item .item-thumb img {
    	height: 120px !important;
    	width: 140px !important;
    }
}

@media (max-width: 540px) {
	.menu-item .item-thumb img {
		height: 120px !important;
		width: 130px !important;
	}
}

@media (min-height: 600px) and (max-height: 600px) and (min-width: 1024px) and (max-width: 1024px) {
	#menu-items .modal {
		overflow-y:scroll !important;
    }
}

@media only screen and (max-width: 540px) and (min-width: 540px) {
	#menu-items .modal {
		overflow-y:scroll !important;
    }
}

@media (max-width: 480px){
	#menu-cont > #menu > #menu-ul > li > a.menu-active {
        color: #fff  !important;
    }
    
	.menu-item {
		padding: 10px !important;
	}
    #menu-items h1 {
    	text-align: center;
    }
	#menu-items ul li.group:hover {
		background-position: 38% -5%;
		background-size: 50px;
	}

	#menu-items .item-title {
		width: 100% !important;
	}

	#menu-items .item-price {
		width: 100% !important;
		text-align: center !important;
	}
}

@media (max-width: 414px) {
	#menu-items h1 {
		font-size: 24px !important;
	}
}

@media (max-width: 411px) {
	#menu-items h1 {
		font-size: 24px !important;
	}
}

@media (max-width: 375px) {
	#menu-items h1 {
		font-size: 22px !important;
/* 		padding: 5px !important; */
	}
}

@media (max-width: 320px) {
	#menu-items h1 {
		font-size: 22px !important;
		padding: 10px !important;
	}
}

@media (max-width: 280px){
	#menu-items h1 {
		font-size: 26px !important;
	}	    
}