body{
	font-family: "ABeeZee", sans-serif;
	font-weight: 400;
	background-color:#fafafa;
	margin:0;
	color:#424242;
}
          
.imgaction {
	border: 1px solid #fff;
}

.imgaction:hover {
	border: 1px solid #c78e3d;
}

.banner a {
	color: #c78e3d;
}

.banner-closed, .banner-open {
    width: 100%;
	height: 50px;
	text-align: center;
	vertical-align: middle;
	background: #222;
	padding: 10px 2px;
	font-size: 1.1em;
}

.banner-closed {
	background: #222;
	color: #eee;
}

.banner-open {
	background: #deaa3a;
	color: #4b4f58;
}

.myalert {
    padding:12px;
    height:50px;
}

.item:hover svg {
	fill:#444444;
}

.item button {
	background-color:#ece0d1;
	border:2px solid #c78e3d;
	padding:0.4em;
}

.item:hover button {
	border:2px solid #444;
	background-color:#ece0d1;
	
}

.footer-up {
	padding-top: 100px;
	padding-bottom: 70px;
	background-color: #252525;
}

.footer-up a {
	color: #fff;
}

.footer-up a:hover {
	color: #c78e3d;
}

.footer-down {
	text-align:center;
	padding-top: 2em;
	padding-bottom: 2em;
	background-color: #212121;
}

.offcanvas-header {
	background-color: #c78e3d;
}

.offcanvas-body {
	background-color: #f9f9f9;
}

.offcanvas-body a {
	color: #c78e3d;
}

.legal {
	color: #c78e3d; 
}

.legal p{
	color: #555;
	font-size: 0.9em;
}

.legal ul{
	color: #777;
	font-size: 0.9em;
}

footer {
    font-size:0.85em;
	vertical-align:middle;
	color: #eee;
}

footer a{
	color: #c78e3d;
}

footer a:hover{
	color: #999;
}

#header {
	position: fixed;
	top: 0;
	z-index: 999;
	width: 100%;
	height: 150px;
	background-color: #ece0d1;
	border-bottom: 2px solid #c78e3d;
}

#header-bottom {
	height: 100px;
	width: 100%;
	font-size: 1em;
	padding-top: 5px;
}

#header-bottom a {
	color: #222;
}

#header-bottom a:hover {
	color: #c78e3d
}

#page {
	margin-top:150px;
}

.content {
	padding-left: 10%;
	padding-right: 10%;
}

.back-to-top {
    position: fixed;
    bottom: 25px;
    right: 25px;
    display: none;
	background-color:#999;
	z-index: 1000;
	opacity: .6;
}

table{
	font-size:0.9em;
}
.hides {
	display:none;
}

.shows {
	display:block;
}
.totalitems{
	font-style: italic;
}
.margin{
	padding-left:1em;
	padding-right:1em;
}

#page{
	background-color:#f9f3eb;
}

.path{
	font-weight:bold;
	color:#c33;
}

.hero-image {
  background-color: #000;
  height: 100vh;
  width: 100vw;
  opacity: 0.5;
}

.hero-text {
  text-align: center;
  position: absolute;
  transform: translate(-50%, -50%);
  color: white;
  opacity: 1;
  z-index:2;
  font-family: "Advent Pro", sans-serif;
}

.buttonaction-secondary {
    color:#c78e3d !important;
    width:100%;
    border: 2px solid #c78e3d;
    border-radius:5px;
    transition: all 300ms ease;
}

.buttonaction-secondary:hover {
    background-color:#c78e3d !important;
    color:#fff !important;
    border: 2px solid #fff;
}

.buttonaction {
	background-color:#222222;
	border: 3px solid #c78e3d;
	font-family:'ABeeZee', sans-serif;
	padding:0.7em 1.5em;
	border-radius:5px;
	margin-top:1em;
	transition: all 300ms ease;
	position:relative;
	overflow: hidden;
}
.buttonaction:hover {
	border: 3px solid #c78e3d;
	background-color: #c78e3d;
}

.buttonaction:after {
  content: "";
  background: #EBB263;
  display: block;
  position: absolute;
  padding-top: 300%;
  padding-left: 350%;
  margin-left: -25px !important;
  margin-top: -120%;
  opacity: 0;
  transition: all 0.8s;
  border-radius:5px;
}

.buttonaction:active:after {
  padding: 0;
  margin: 0;
  opacity: 1;
  transition: 0s
}

.hero-category {
	background-color: #000;
	height: 100%;
	width: 100%;
	opacity: 0.6;
	z-index:3;
	position:relative;
	bottom:0;
	left:0;
}

.hero-category-text {
	position:relative;
	left:0;
	top:-190px;
	z-index:4;
}

.jumbocategory {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
	border:4px solid #fff;
	height: 270px;
}

.jumbocategory:hover {
	border: 4px solid #c78e3d;
}

.jumbocategory button:hover {
	border: 1px solid #c78e3d;
	background-color: #c78e3d;
}

.active {
	color: #c78e3d;
}

#ordernow {
	width:50%;
	min-width:300px;
	background-color:#d5ad76;
	padding:4em 4em;
	margin-left:40%;
	margin-right:10%;
	position:relative;
	z-index:3;
}

#slidetitle {
font-size:50px;font-weight:600;
}

.categoryitem {
	color:#fff;
	padding: 0.8em 1em;
	font-size:1.2em;
	display: block-inline;
}

.categoryitem:hover {
	color:#222;
	padding: 0.8em 1em;
	font-size:1.2em;
}

.itemproduct {
	width:20%;
	display:block;
	padding: 0.5rem;
}

.itemproductimg{
	width:100%;
	border: 2px solid #c78e3d;
	box-shadow: 6px 6px 3px #999;
	transition: all 0.2s;
}

.itemproductimg:hover{
	width:100%;
	border: 2px solid #c78e3d;
	box-shadow: 9px 9px 8px #999
}

.concordance {
    background-color:#edeeef;
}
.concordance-text {
    color:#474F59;
}
.concordance-text:hover {
   box-shadow: 1px 1px 7px #D9C341 !important;
}
.emphasis {
    background-color:#e3dd81;
}
.maincolor {
    color: #4182d8;
}
.secondarycolor {
    color: #D9B641;
}
 
@media screen and (max-width:455px){
	.menuitemvisible {
		padding: 1rem 0  !important;
	}
	#header-bottom {
		padding-right:0;
		padding-left:0;
	}
	#ordernow {
		padding-right:2em;
		padding-left:2em;
	}
	#slidetitle {
		font-size: 30px;
	}
	.buttonaction {
		padding: 0.7em 0.7em;
	}
}

.modal-backdrop
{
    opacity:0.7 !important;
}

@media screen and (min-width:456px){
	.menuitemvisible {
		padding:1rem  !important;
	}
	#header-bottom {
		padding-right:1.5rem;
		padding-left:1rem;
	}
	#slidetitle {
		font-size: 30px;
	}
	.buttonaction {
		padding: 0.7em 0.7em;
	}
}

@media screen and (max-width:768px){
	.footer-up h2 {
		padding-top: 2em;
	}
	#ordernow {
		width:90%;
		margin:0 5%;
	}
}

@media screen and (max-width:707px){
    .myalert {
        padding:8px;
        line-height:20px;
    }
}

@media screen and (max-width:610px){
    .myalert {
        padding: 0;
        line-height:22px;
    }
    #header {
        height:200px !important;
    }
}

@media screen and (max-width:420px){
    .myalert {
        height:80px;
        line-height:20px;
    }
    #header {
        height:230px !important;
    }
}

@media screen and (min-width:1200px){
	.col-xl-2-5 {
		flex: 0 0 auto;
		width: 20%;
	}
	#slidetitle {
		font-size: 50px;
	}
	.buttonaction {
		padding: 0.7em 1.5em;
	}
}

@media screen and (min-width:769px) and (max-width: 939px){
	#ordernow {
		width:70%;
		margin:0 15%;
	}
}


@media screen and (max-width:940px){
	.menubig {
		display:none !important;
	}
	.menumovil {
		display:block;
	}
	figure video{
		width:100%;
	}
    
}

@media screen and (min-width:941px){
	.menubig {
		display:block;
	}
	.menumovil {
		display:none !important;
	}
}