body,html{
	width: 100%;
	height: 100%;
	background-color: #111;

}

@font-face{
    font-family: 'century';
    src:url(../fonts/century.ttf);
}
section{
	background-image: url(../images/img/end.jpg);
    background-position: bottom;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
/*** READ MORE ***/

	.read-less-btn{
		padding: 10px 10px;
		cursor: pointer;
	}

	.read-more-btn{
		padding: 10px 10px;
		cursor: pointer;
	}

	.read-more{
		display: none!important;
	}
/*** MODAL ***/

	.container-modal{
		font-family: var(--font-primary);
		width: 100%;
		margin: 0%;
		padding: 4%;
		position: relative;
		color: #ddd;
		background: #111;
	}

	.container-modal h2{
		font-family: var(--font-primary);
	    width: 100%;
	    margin: 0% 0% 3% 0%;
	    padding: 0% 0% 2% 0%;
	    font-size: 25px;
	    font-weight: bold;
	    color: #ddd;
	    letter-spacing: 0.5px;
	    border-bottom: 1px solid #ffc107;
	}

	.container-modal h3{
		font-family: var(--font-primary);
	    width: 100%;
	    margin: 3% 0% 3% 0%;
	    padding: 2% 0% 2% 0%;
	    font-size: 18px;
	    color: #212121;
	    letter-spacing: 0.5px;
	    border-top: 1px solid #ffc107;
	}

	.container-modal label{
		width: 100%;
		margin: 0px 0px 5px 0px;
		padding: 0px 0px 0px 0px;
		font-size: 18px;
	}

	.container-modal input{
		width: 100%;
	    margin: 0px 0px 5px 0px;
	    padding: 5px 10px;
	    font-size: 18px;
	    border: 1px solid #0000004f;
	    outline: none;
	}

	.container-modal img {
		width: 50%;
		margin: 0% 25%;
	}

	.container-modal i{
		
	}

	.container-modal ul{
		width: 100%;
		margin: 0%;
		padding: 0%;
		list-style: none;
		display: flex;
	}

	.container-modal ul>li{
		width: 49%;
	}

	.container-modal div{
		width: 100%;
		margin: 2% 0% 3% 0%;
		padding: 0% 0% 0% 0%;
		display: flex;
		justify-content: space-around;
		flex-wrap: wrap;
	}

	.container-modal div>button{
		width: 48%;
	    margin: 0%;
	    padding: 1%;
	    border: none;
	    outline: none;
	    font-size: 18px;
	    letter-spacing: 0.5px;
	    border-radius: 5px;
	}

	.btn-login-acept{
		background: #fbe16e;
		color: #111;
		font-weight: bold;
	}

	.btn-login-cancel{
		background: #ff3f3f;
    	color: #ffffff;
	}

	.btn-login-register{
		background: #343a40;
		color: #fff;
	}

	.container-modal span{
		padding: 2% 0% 0% 0%;
		cursor: pointer;
	}

	.container-modal span:hover{
		color: #ffc107;
	}

	.container-modal iframe{
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.close-modal{
		position: absolute;
		top: 10px;
		right: 15px;
		font-size: 20px;
		z-index: 5;
		cursor: pointer;
	}

/**HEADER***********/
	.header-w{
		margin: 0%;
		padding: 0%;
		width: 100%;
		display: flex;
		top: 0%;
		background-color: #0000;
		justify-content: center;
		position: fixed;
		z-index: 2;
		color: #424242;
	}
	.menu-header{
		width: 100%;
	    margin: 0% 0% 0% 0%;
	    padding: 1.5% 10%;
	    background-color: #fff;
	    box-shadow: 0px 0px 33px -13px #000;
	    display: flex;
	}

	.menu-header img{
		width: 100%;
	}
	.menu-header ul{
		list-style: none;
		display: flex;
		justify-content: space-between;
		margin: 0%;
		padding: 0%;
	}
	.menu-header li{
		text-align: center;
		margin: auto;
	}
	.menu-header p{
		padding: 7% 0% 0% 0%;
	    margin: 0%;
	    font-size: 18px;
	    letter-spacing: 1px;
	    font-weight: bold;
	}

	/*** header pt 2 ****/

		.head-2{
			position: unset;
	    	width: 100%;
	    	padding: 1% 8% 0%;
	   		color: #fff;
	    	background-color: #0000;
	    	z-index: 6;
	    	display: flex;
	    	transition: 0.3s;
	    	/*box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);*/
	    	background: #111111e6;
		}

		.head-2 ul{
			margin: 0%;
		    padding: 0%;
		    width: 80%;
		    list-style: none;
		    display: flex;
		    justify-content: flex-end;
		}

		.head-2 img {
		    width: 16%;
		    padding: 0.5% 3% 1% 0%;
		    margin: 0% 0% 0% 0%;
		    cursor: pointer;
		}

		.head-2 li{
			font-family: 'Bungee', cursive;
		    margin: auto 0%;
		    font-size: 15px;
		    cursor: pointer;
		    letter-spacing: 0.5px;
		    font-weight: normal;
		    padding-bottom: 1%;
		}

		.head-2 li:hover{
			color: #A90B30;
		}

		/*
		.opc-1 span:after{
		    position: absolute;
		    left: 40%;
		    margin-left: -8px;
		    top: 25px;
		    height: 16px;
		    width: 16px;
		    background-color: #fbe16e;
		    box-shadow: -2px -2px 2px 0 rgba(0,0,0,0.2);
		    content: "\00a0";
		    -webkit-transform: rotate(45deg);
		    -ms-transform: rotate(45deg);
		    transform: rotate(45deg);
		    transition: 150ms ease color,150ms ease background-color;
		    z-index: 0;
		    border-radius: 100%;
		}
		*/

		.head-2 button{
		    border-radius: 10px;
		    color: #fff;
		    background: #0000;
		    border: 1px solid #fff;
		    outline: none!important;
		    text-decoration: none!important;
		    margin: auto 1%;
		    padding: 3% 5%;
		    transition: 1s;
		    width: 80%;
		    font-size: 16px;

		}
		.head-2 button:hover{
			color: #111;
			border: 1px solid #fbe16e;
			box-shadow: 0 0 0 3em #fbe16e inset;
			transition: 1.2s;
		}

		.line-head{
			border: none!important;
			transition: 0.3s;
		}

	/*** dropdown-w-one ***/

		.dropdown-w-one{
			position: relative;
		}

		.dropdown-w-one div{
			position: absolute;
			width: 195px;
			top: 40px;
			padding: 0% 0% 0% 0%;
			margin: 0% 0% 0% 0%;
			background-color: #fff;
			opacity: 0;
		    visibility: hidden;
		    transition: all 0.3s ease 0s;
		    transform: translateY(15px);
		    border-radius: 3px 3px 3px 3px;
		    box-shadow: 0 0 5px rgba(0,0,0,0.5);
		}
		.dropdown-w-one div:after{
		    position: absolute;
		    left: 17%;
		    margin-left: -8px;
		    top: -8px;
		    height: 16px;
		    width: 16px;
		    background-color: #263b6e;
		    box-shadow: -2px -2px 2px 0 rgba(0,0,0,0.2);
		    content: "\00a0";
		    -webkit-transform: rotate(45deg);
		    -ms-transform: rotate(45deg);
		    transform: rotate(45deg);
		    transition: 150ms ease color,150ms ease background-color;
		    z-index: 0;
		    border-radius: 100%;
		}

		.dropdown-w-one:hover div{
			opacity: 1;
		    visibility: visible;
		    padding: 0% 0% 0% 0%;
		    transition: all 0.3s ease 0s;
		    transform: translateY(0px);
		}

		.dropdown-w-one ul{
		    display: block;
		    margin: 0% 0% 0% 0%;
		    padding: 5% 0%;
		    width: 100%;
		    background-color: #ffffffe3;
		    border-radius: 5px;
		    border: none;
		}

		.dropdown-w-one li{
			font-family: 'Bungee', cursive;
		    width: 100%;
		    padding: 5% 10%;
		    margin: 0% 0% 0% 0%;
		    color: #111;
		    text-align: left;
		    border-radius: 0px;
		}

		.active-dropdown li:hover{
			color: #fff;
			background: #27407b;
		}


		.active-dropdown{
			text-align: center;
		}

		.active-dropdown p{
			font-family: 'Bungee', cursive;
		    font-size: 18px;
		    font-weight: bold;
		    letter-spacing: 1.5px;
		    color: #333;
		    width: fit-content;
		    background-color: #0000;
		    text-align: center;
		    margin: auto;
		    margin-bottom: 15px;
		    padding: 0% 10%;
		    border-radius: 5px;
		    border: 1.5px solid #cfa54bab;
		}



/* MOBILE *******/


	.header-mobile{
		display: none;
		position: fixed;
		margin: 0%;
		top: 0;
		width: 100%;
		z-index: 11;
	}

	.header-mobile button{
		width: 100%;
		margin: 0%;
		border-radius: 0px;
		border:none;
		box-shadow: 0 0 0 0.2rem rgba(58,176,195,0)!important;
		border-bottom: 2px solid #0000;
	   	background: #111!important;
		color: #000!important;
		font-size: 25px;
		text-align: right;
	}

	.header-mobile table{
		width: 100%;
		margin: 0%;
	}

	.header-mobile td{
		width: 50%;
		margin: 0%;
		text-align: left;
	}

	.header-mobile img{
		width: 85%;
		margin: 0%;
	}

	.header-mobile div{
		width: 100%;
		padding: 0%;
		color: #fff;
	   	background: #111111e6;
		border-bottom: 1.5px solid #2e3c6169;
	}

	.header-mobile p{
		font-size: 20px;
		letter-spacing: 0.5px;
		margin-bottom: 4%;
		font-family: 'Bungee', cursive;
		padding-left: 9%;
		font-weight: 400;
	}

	.header-mobile ul{
		font-size: 20px;
	    width: 100%;
	    padding: 0% 10%;
	    left: 5px!important;
	    /* border: 2px solid #750f34!important; */
	    list-style: none;
	    margin-bottom: 4%;
	 	font-family: 'Bungee', cursive;
	}

	.header-mobile li,a{
	    color: #333;
	    margin: 2% 0%;
	    font-weight: bold;
	    text-decoration: none!important;
	    outline: none!important;
	}
	.header-mobile a {
	    color: #fff!important;
	    text-decoration: none;
	    outline-style: none;
	    font-family: 'Bungee', cursive;
	}
	.header-mobile i {
	    color: #ddd;
	    position: relative;
	    float: right;
	    font-size: 16px;
	    color: #ddd;
	}
	.boton{
	    font-family: 'Roboto Condensed', sans-serif!important;
	    border: 1px solid #000!important;
	    outline: none!important;
	    text-decoration: none!important;
	    font-size: 17px!important;
	    padding: 1% 5%!important;
	    background: #0000!important;
	    color: #0677ba!important;
	    border-radius: 50px!important;
	    width: 70%!important;
	    transition: 1s!important;
	    margin: 2% 0% 4% 0%!important;
	    text-align: center!important;
	}

	.dropdown-menu a{
		color: #740e34;
	}


/**DROPDOWN**/

	.dropdown-txt{
		outline: none!important;
		text-decoration: none;
	}
	.dropdown {
	  position: relative;
	  display: inline-block;
	  padding-top: 4%;
	}

	.dropdown-content {
	    display: none;
	    position: absolute;
	    text-align: left;
	    background-color: #FFF;
	    min-width: 350px;
	    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.63);
	    padding: 14% 20% 0% 20%;
	    margin: 1% 0% 0% 0%;
	    border-top: 3px solid #000;
	    z-index: 1;
	    border-radius: 5px;  
	}

	.dropdown:hover .dropdown-content {
	  display: block;
	}

	.bg-image-full {
	  height: 400px;
	}

	.txt-bg-image-full{
		font-family: 'Bungee', cursive;
		color: #fff;
		font-size: 40px;
		text-align: center;
	}

	.activate-2{
	    border-bottom: 4px solid #750f34;
	    display: inline-block;
	    color: #750f34!important;
	}


		.pree:hover{
			color: #fff;
			background: #ffa700!important;
		}
		.prim:hover{
			color: #fff;
			background: #00db77!important;
		}
		.secu:hover{
			color: #fff;
			background: #00a8ff!important;
		}

/******PRINCIPAL********/
	.container-sections{
		width: 100%;
		height: 100%;
		margin: 3% 0% 0% 0%;
		padding: 0% 10% 0% 10%;
		text-align: center;
	}
	
	.line{
		width: 50px;
	    height: 2px;
	    background: #202020;
	    text-align: center;
	}

	.fondo-1{
		  width: 100%;
		  height: 100%;
		  position: absolute;
		  background: rgba(0,0,0,0.40);
		  z-index: 0;
		  left: 0;
		  top: 0;
	}
/***desktop ***** mobil***/

	.desktop{
	 display: block;
	}

	.mobil{
	 display: none;	
	}


	.enable{
		display: block!important;
	}
	.disable{
		display: none!important;
	}



	.content-box{
		
	}
/***BOX - 1*****/

	.box-1{
	    width: 100%;
	    background-image: url(../images/img/fondo-2.png);
	    padding: 2.5% 9% 2.5% 10%;
	    text-align: center;
	    background-position: center;
	}

	.box-1 img{
		width: 40%;
		margin: 5%;
		transition: 0.3s;
		padding: 2%;
	}
	.box-1 h2{
		font-family: 'Bungee', cursive;
		font-size: 20px;
		font-weight: bold;
		color: #111;
		transition: 0.3s;
	}

	.box-1 p{
		font-family: 'Bungee', cursive;    
		font-size: 17px;
		color: #333;
		transition: 0.3s;
	}
	.box-1 i{
	    padding-left: 0%;
	    color: #2b4b92;
	    position: absolute;
	    left: 30%;
	    padding: 1% 0%;
	}
	.box-1 ul{
		padding: 0%;
	}
	.box-1 li{
	    font-family: 'Bungee', cursive;
	    font-size: 17px;
	    color: #333;
	    list-style: none;
	    padding-left: 40%;
	    text-align: left;
	}

	.zoom {
		transition: 0.3s;
	}
	.zoom:hover{
		transition: 0.3s;
		transform: translateY(-15px);
		display: block;
	}


	.zoom-1 {
		transition: 0.3s;
	}
	.zoom-1:hover{
		transition: 0.3s;
		transform: scale(1.03);
	}

/***CONTNET-IMAG *****/
	
	.content-1{
	background-image: url(../images/img/ent.png);
    padding: 17%;
    background-position: center;
    background-size: cover;
    border-radius: 5px;
	}

	.content-22{
	background-image: url(../images/img/content.jpg);
    padding: 17%;
    background-position: center;
    background-size: cover;
    border-radius: 5px;
	}

	.content-3{
	background-image: url(../images/img/hot.jpg);
    padding: 17%;
    background-position: center;
    background-size: cover;
    border-radius: 5px;
	}

	.content-44{
	background-image: url(../images/img/comb.jpg);
    padding: 17%;
    background-position: center;
    background-size: cover;
    border-radius: 5px;
	}

	.content-5{
	background-image: url(../images/img/ensalada.jpg);
    padding: 17%;
    background-position: center;
    background-size: cover;
    border-radius: 5px;
	}

	.content-66{
	background-image: url(../images/img/drink.png);
    padding: 17%;
    background-position: top;
    background-size: cover;
    border-radius: 5px;
	}

/****BOX -2 *****/
	.left{
		width: 65%;
	}
	.right{
		width: 35%;
	}

	.box-2{
	    width: 100%;
	    background-image: url(../images/img/fondo-2.png);
	    padding: 3% 13% 0% 13%;
	}
	.box-2 h3{	
		font-size: 25px;	
		text-align: left;
		color: #fff;
		margin-bottom: 5%;
		margin-top: 5%;
		position: relative;
		font-family: 'Permanent Marker', cursive;
		letter-spacing: 1px;
	}
	.box-2 h4{	
	    font-family: 'Bungee', cursive;
	    font-size: 40px;
	    text-align: left;
	    font-weight: bold;
	    color: #fff;
	    position: relative;
	    letter-spacing: 1px;
	    position: absolute;
	    bottom: 10%;
	}
	.box-2 p{
		font-family: 'century'; 
		font-size: 17px;
		color: #fff;
		position: relative;
	}
	.box-2 img{
		width: 80%!important;
		position: relative;
		float: right;
		right: 12%;
		border-radius: 2px;
	}
	.box-2 small{
		font-size: 18px;
		font-style: italic;
	}
	.box-2 button{
		font-family: 'Bungee', cursive;   
		border: 1px solid #2b4b92;
		outline: none!important;
		text-decoration: none!important;
		font-size: 17px;
		padding: 1% 5%;
		background: #0000;
		color: #2b4b92;
		border-radius: 50px;
		width: 30%;
		transition: 1s;
		margin: 2% 10% 4% 0%;
	}

	.box-2 button:hover{
		color: #fff;
		transition: 1.2s;
		box-shadow: 0 0 0 3em #2b4b92 inset;
	}

	.box-2 i{
	padding-left: 0%;
    color: #f1d2a8;
    /* position: absolute; */
    left: 3%;
    padding: 5% 0%;
	}
	.box-2 ul{
		padding: 0%;
		margin-bottom: 0%;
	}
	.box-2 li{
		font-family: 'Bungee', cursive;    
		font-size: 17px;
		color: #333;
		list-style: none;
		padding-left: 5%;
		cursor: pointer;
		margin: 2% 0%;
		border-bottom: 1.5px solid #dddddd24;
	}

	.box-2 li>img{
		width: 7%!important;
		float: none;
		right: 0%;
		margin: 2%;
	}

	.box-2 select{
	    width: 50%;
	    margin: auto;
	    background: #fff;
	    color: #111;
	    font-weight: bold;
	    font-size: 20px;
	    border: 1px solid #333;
	    border-radius: 4px;
	    padding: 0.5% 0%;
	    outline: none;
	    text-decoration: none;
	}

	.box-2 option{
	    background: #fff;
	    color: #111;
	    font-weight: bold;
	    outline: none;
	    text-decoration: none;		
	}

	.box-2 iframe{
		border-radius: 5px;
		margin: 2% auto;
		width: 48%;
	}

	.box-2-2 img{
		width: 60%!important;
		padding: 10%;
	}

	.mostrar{
		display: block!important;
		visibility: visible;
	}


	/***EFECT LOOP ***/
	.heading_overlay {
		display: inline-block;
		position: relative;
		height: 5px;
		border-radius: 30px;
		background-color: #3d69c4;
		width: 90px;
		margin-top: 5px;
		margin-bottom: 18px;
		overflow: hidden
	}

	.site-heading .heading_overlay:after,
	.about-heading .heading_overlay:after {
		content: '';
		position: absolute;
		left: 0;
		top: -1.1px;
		height: 7px;
		width: 8px;
		background-color: #fff;
		-webkit-animation-duration: 3s;
		animation-duration: 3s;
		-webkit-animation-timing-function: linear;
		animation-timing-function: linear;
		-webkit-animation-iteration-count: infinite;
		animation-iteration-count: infinite;
		-webkit-animation-name: MOVE-BG;
		animation-name: MOVE-BG
	}

	.heading_overlay:after {
		content: '';
		position: absolute;
		left: 0;
		top: -1.1px;
		height: 7px;
		width: 8px;
		background-color: #fff;
		-webkit-animation-duration: 3s;
		animation-duration: 3s;
		-webkit-animation-timing-function: linear;
		animation-timing-function: linear;
		-webkit-animation-iteration-count: infinite;
		animation-iteration-count: infinite;
		-webkit-animation-name: MOVE-BG;
		animation-name: MOVE-BG
	}

	@-webkit-keyframes MOVE-BG {
		from {
			-webkit-transform: translateX(0);
			transform: translateX(0)
		}
		to {
			-webkit-transform: translateX(88px);
			transform: translateX(88px)
		}
	}

	@-webkit-keyframes MOVE-BG {
		from {
			-webkit-transform: translateX(0);
			transform: translateX(0)
		}
		to {
			-webkit-transform: translateX(88px);
			transform: translateX(88px)
		}
	}

	@keyframes MOVE-BG {
		from {
			-webkit-transform: translateX(0);
			transform: translateX(0)
		}
		to {
			-webkit-transform: translateX(88px);
			transform: translateX(88px)
		}
	}

	.element img{
		width: 25%!important;
		position: absolute;
		top: 5%;
    	right: 10%;
    	display: none;
	}


	.description{
		width: 100%;
	}

	.description ul{
		padding: 0%;
	}

	.description li{
	    font-family: 'Bungee', cursive;
	    font-size: 17px;
	    color: #333;
	    list-style: none;
	    padding-left: 5%;
	    margin: 1% 0%;
	    border-bottom: 1px solid #dddddd73;
	    padding: 2% 2% 2% 0%;
	    cursor: pointer;
	}

	.description p{
		font-family: 'Bungee', cursive;
	    font-size: 17px;
	    margin: 1% 0%;
	    padding: 2% 2% 2% 0%;
	}

	.description i{
		/*padding-left: 1%; */
	    color: #3d69c4;
	    position: relative;
	    float: right;
	    /* padding-right: 0%; */
	    width: 25px;
	    height: 25px;
	    border-radius: 100px;
	    padding: 1% 12% 1% 1%;
	    font-size: 15px;
	}

	.description li>i:hover{
		color: #2b4b92;
	}

	.description-1 ul{
			padding: 0%;
		}

	.description-1 li{
	    font-family: 'Bungee', cursive;
	    font-size: 17px;
	    color: #333;
	    list-style: none;
		padding-left: 5%;
	    margin: 1% 0% 0% 0%;
	    border-bottom: none;
	    padding: 1% 2% 0% 5%;
	    cursor: pointer;

	}

	.description-1 i{
		padding: 1% 2% 0% 0%;
		color: #2b4b92;
		position: relative;
		float: left;
		left: inherit;
			    background: none;
	}

	.oculto{
		display: none;
	}


	.icons-fond{
		background-color: #f1de0f;
	    width: 100px;
	    height: 100px;
	    border-radius: 100%;
	    padding: 5%;
	    margin: auto;
	}

	.values i{
		padding-left: 0%;
		color: #2b4b92;
		padding-right: 5%;
		position: absolute;
		left: 10%;

	}
	.values ul{
		padding: 0%;
	}
	.values li{
		font-family: 'Bungee', cursive;    
		font-size: 17px;
		color: #333;
		list-style: none;
		padding-left: 15%;
	}
	
	.install{
		margin: auto;
		text-align: center;
	}
	.install img{
		width: 55%!important;
		border-radius: 100%;
		margin: auto;
		border: 12px solid #ddd;
		transition: 0.3s;
		padding: 0%;
	}

	.install img:hover{
		transition: 0.3s;
		border: 5px solid #2b4b92;
		transform: translate(1.3);	
	}

			/*** content one ***/

				.container-food{
					width: 100%;
					display: contents;
				}

				.container-food div{
					margin-top: 5px;
					padding: 0%;
					width: 100%;
					list-style: none;
					text-align: center;
				}


				.container-food h1{
				    margin: 5% 10% 5% 10%;
				    padding: 4% 2% 4% 2%;
				    color: #000c;
				    font-family: 'Raleway', sans-serif;
				    font-size: 17px;
				    letter-spacing: 1px;
				    font-weight: bold;
				    position: relative;
				    text-align: left;
				    border-bottom: 1px solid #ddd;
				}

				.more{
					position: relative;
    				float: right;
    				font-size: 15px;
				}


				.container-food p{
					width: 140px;
	   				height: 140px;
	    			margin: 1% 1% 2% 1%;
	    			display: inline-block;
	    			position: relative;
	    			background-repeat: no-repeat;
	    			background-position: center;
	    			background-size: 100% 100%;
	    			border-radius: 5px;

				}

				.container-food span{
					font-family: 'Raleway', sans-serif;
					font-size: 22px;
					margin: 0%;
					padding: 0% 0% 0% 0%;
					position: absolute;
					border-radius: 5px;
					width: 100%;
					height: 100%;
					color: #fff;
					background-color: #272a298f;
					left: 0;
					top: 0;
					line-height: 25px;
					display: flex;
				}

				.container-food a{
					margin: auto;
				}

				.btn-order{
					font-family: 'Raleway', sans-serif;
					margin: 0%;
					font-size: 15px;
					letter-spacing: 1px;
    				background-color: #00000073;
					border: none;
					outline: none!important;
					color: #fff;
					position: absolute;
					border-radius: 0px 0px 5px 5px;
					bottom: 0;
					left: 0;
					width: 100%;
					padding: 1% 0%
				}

				.btn-details{
					font-family: 'Raleway', sans-serif;
				    margin: 0% 0% 3% 0%;
				    font-size: 16px;
				    font-weight: bold;
				    letter-spacing: 0.5px;
				    background-color: #d8cf50;
				    border: none;
				    outline: none!important;
				    color: #333;
				    height: 35px;
				    border-radius: 5px;
				    width: 100%;
				    padding: 5% 0%!important;
				  }
					.content-food{
					width: fit-content!important;
					display: inline-grid;
					margin: 5px!important;
					}


/****BOX - 3 *****/
	.box-3{
	    width: 100%;
	    padding: 5% 10% 5% 10%;
	    text-align: center;
		position: absolute;
		top: 83%;
		background-image: linear-gradient(#00000029,#000000bf, #000000eb, #000);
	}
	.box-3 h3{	
		font-family: 'Bungee', cursive;
		font-size: 25px;	
		text-align: center;
		font-weight: bold;
		color: #111;
	}
	.box-3 p{
    	font-family: 'century';  
		font-size: 17px;
		color: #fff;
		margin-bottom: 1.5rem;
	}
	.box-3 img{
	width: 10%;
    border-radius: 5px;
    margin: 2% 0% 0% 0%;
    padding: 1%;
	}
	.box-3 i{
	    color: #fff;
	    font-size: 20px;
	    margin-top: 8%;
	}



	.content-1{
		display: block;
	}

	.content-2{
		display: none;
	}

	.content-3{
		display: block;
	}

	.content-4{
		display: none;
	}

	.content-5{
		display: block;
	}
	.content-6{
		display: none;
	}

	.active-1{
	    border: 1px solid #2b4b92!important;
	    box-shadow: 0px 0px 20px -10px #060606;
	    transform: scale(1.03);
	    background: #2b4b92!important;
	    color: #fff!important;
	}

	.circle{
		margin: auto;
	}
	.circle div{
		width: 150px;
		height: 150px;
		border-radius: 100%;
		background-color: #f1de0f;
		margin: auto;
	}
	.circle img{
		width: 70%!important;
		margin-top: 10%;
		padding: 5%;
	}

	.background-imag{
	    width: 100%;
	    height: 370px;
	    background-repeat: no-repeat;
	    background-position: 50% -15%;
	    background-size: 100%;
	    position: relative;
	    background-attachment: fixed;	
	}

	.background-imag h3{
		font-family: 'Permanent Marker', cursive;
	    position: absolute;
	    top: 20%;
	    left: 26%;
	}

	.object{
		padding: 2% 5%!important;
    	position: absolute;
    	top: 40%;
    	background-image: linear-gradient(#00000000,#000000bf, #000000eb, #000);
    	}

   .object div{
   	
   }

	.wor{
		width: 100%;
	}

	.box-4{
		text-align: center;
    	padding: 1% 16%;
    	background: #000000ba;
	}

	.box-4 h3{
	    font-size: 27px;
	    text-align: left;
	    color: #ddd;
	    margin: 0% 0%;
	    border-bottom: 0.5px solid #fbca3952;
	    padding: 2% 0% 2%;
	}
	.box-4 ul{
		padding: 0%;
	}
	.box-4 li{
	}

	.box-4 p{
		color: #ddd;
		text-align: left;
	}
	.box-4 label{
		display: flex;
	}

	.box-4 button{
		width: 44%;
	    display: inline-grid;
	    border-radius: 5px;
	    border: none;
	    text-decoration: none;
	    padding: 0.5% 0%;
	    outline: none;
   	}
   	.box-4 i{
		padding: 1% 2%;
	    width: 30px;
	    height: 30px;
	    border-radius: 100%;
	    color: #fbca39;
   	}

   	.box-4 input{
   		text-align: left;
   	}
   	.box-4 div{
   		padding-top: 4%;
   	}
   	.box-4 h5{
   		font-size: 1.25rem;
    	position: absolute;
   		right: 16%;
    	color: #ddd;

   	}
   	.oculto{
   		display: none;
   	}



	.fondo{
	position: relative;
    z-index: 1;
    width: 50%;
    margin: 5% auto;
	}
	
	.fondo:after{
	position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #2b4b92 none repeat scroll 0 0;
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
    z-index: -1;
    border-radius: 30px;		
	}

	.fondo-1{
	  width: 100%;
	  height: 100%;
	  position: absolute;
	  background: rgba(0,0,0,0.30);
	  z-index: 0;
	  left: 0;
	  top: 0;
  	}

	.fondo-2{
	  width: 100%;
	  height: 100%;
	  position: absolute;
	  background: rgba(0,0,0,0.80);
	  z-index: 0;
	  left: 0;
	  top: 0;
	  border-radius: 5px;
  	}

	.fondo-3{
	  width: 100%;
	  height: 100%;
	  position: absolute;
	  background: rgba(0,0,0,0.20);
	  z-index: 0;
	  left: 0;
	  top: 0;
	  border-radius: 5px;
  	}

  	.contact{
	    width: 100%;
	    background-image: url(../images/img/fondo-2.png);
	    padding: 5% 10% 5% 10%;
  	}
  	.contact iframe{
		border-radius: 5px;
		padding:  0% 5%;
  	}

		.modal-content{
			position: relative;
			background-color: #fff;
		}

		.btn-buenfin{
	    	width: 2.5%;
	    	position: absolute;
	    	right: 1%;
	    	top: 1%;
	    	border:none;
	    	z-index: 5;
	    	cursor: pointer;
		}

		.modal-content-img{
			width: 100%;
			/*border-radius: 5px;*/
		}

		.form-buenfin{
			/*position: absolute;
			top: 57%;*/
			right: 0%;
			width: 100%;
			text-align: center;
		}

		.history{
			padding: 5% 10% 7%;
			overflow-x: hidden;

		}
		.history img{
			width: 10%;
		}
		.comments{
			background: #ddd;
			border-radius: 0px 10px 10px 10px;
			padding: 2% 4%;
		}
		.comments-1{
			background: #ddd;
			border-radius: 0px 10px 10px 10px;
			padding: 2% 4%;	
		}
		.comments:after{
		    position: absolute;
		    left: 1.5%;
		    /* margin-left: -10px; */
		    top: 3px;
		    height: 16px;
		    width: 16px;
		    background-color: #ddd;
		    box-shadow: 0px 2px -2px 0px rgba(0,0,0,0.2);
		    content: "\00a0";
		    -webkit-transform: rotate(45deg);
		    -ms-transform: rotate(45deg);
		    transform: rotate(135deg);
		    transition: 150ms ease color,150ms ease background-color;
		    z-index: 0;		
		    display: none;
		}

		.comments-1:before{
		    position: absolute;
		    /*left: 1.5%;*/
		    /* margin-left: -10px; */
		    top: 3px;
		    height: 16px;
		    width: 16px;
		    background-color: #ddd;
		    box-shadow: 0px 2px -2px 0px rgba(0,0,0,0.2);
		    content: "\00a0";
		    -webkit-transform: rotate(45deg);
		    -ms-transform: rotate(45deg);
		    transform: rotate(135deg);
		    transition: 150ms ease color,150ms ease background-color;
		    z-index: 0;
		    right: 2%;
		}

		.comments p{
			font-family: 'Bungee', cursive;
			font-size: 17px;
		}

		.comments i{
			color: #ffab00;
		}
		.comments-1 p{
			font-family: 'Bungee', cursive;
			font-size: 17px;
		}

		.comments-1 i{
			color: #ffab00;
		}
		.user div{
			background: #00db778c;
		    width: 100px;
		    height: 100px;
		    border-radius: 100%;
		    margin: 20% auto;

		}
		.user p{
			font-family: 'Bungee', cursive;
			margin: auto;
		    font-size: 30px;
		    font-weight: bold;
		    padding: 25%;
		    color: #111;
		    letter-spacing: 5px;
		    margin-bottom: 0%;
		    text-align: center;
		}

		.modal-lg{
			max-width: 65%!important;
		    margin: auto;
		    top: 3%!important;
		}

		.history-1{
			padding: 0% 10%;
			background-color: #111;
		}

		.content-11 div{
			background: #fff;
			border-radius: 10px;
		}

		.content-11 i{
			color: #111;
		}


/****** FOOTER *******/
	.footer-W{
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin: 0% 0% 0% 0%;
    	padding: 2% 12% 0% 12%;
    	background-image: linear-gradient(#00000029,#000000bf, #000000eb, #000);
		text-align: center;
		justify-content: center;
		position: relative;
	}
	.footer-W div{
		justify-content: center;
		width: 100%;
	}

	.footer-W h2{
		color: #ddddddc7;
		font-size: 17px;
	}

	.footer-W ul{
		padding: 0%;
	}

	.footer-W a{
		outline: none!important;
		text-decoration: none!important;
		font-weight: 100;
	}

	.footer-W li{
		text-align: left;
		list-style: none;
		color: #dddddd87;
		margin: 4% 0%;
		padding-left: 7.5%;
		cursor: pointer;
		
	}


	.footer-W li:hover{
		color: #ddd;
		
	}

	.log img{
		position: absolute;
	    width: 7%;
	    right: 15%;
	    opacity: 0.5;
	    top: 60%;
	    transform: rotate(0deg);
	}

	.copyright-foot p{
		margin: 0%;
		padding: 0%;
		color: #fff;
	}

	.copyright-foot span{
		margin: 0%;
		padding: 0%;
		color: #ff000085;
		cursor: pointer;
	}

	.box-mob{
		padding: 3% 13% 0% 13%;
	}

	.btns-cant{
		margin: 0% 0% 0%;
		text-align: center;	
		background: #000000ba;
		padding: 5% 10%;	
	}
	.btns-cant input{
		width: 30%;
		font-size: 22px;
		text-align: center;
		margin: 0%;
		background: #0000;
    	color: #fbe16e;
    	border: none;    	
    	border-bottom: 1px solid #fbe16e;

	}

	.btns-cant span{
	    margin: 0% 10%;
	    width: 20px;
	    height: 20px;
	    background: #333;
	    color: aliceblue;
	    padding: 3%;
	    border-radius: 10px;
	}

	.btns-cant button{
		margin: 0% 0% 0% 0%;
	    width: 60%;
	    border: none;
	    border-radius: 5px;
	    padding: 2%;
	    font-size: 18px;
	    outline: none;
	    text-decoration: none;
	    color: #111;
	    background: #fbe16e;
	}

	/*** content order ***/

	.content-order{
    	margin: 2% 13%;
    	height: 70vh;
	}

	.content-order h1{
		margin: 0% 0% 5% 0%;
	    padding: 0% 0% 0% 0%;
	    color: #ddd;
	    font-size: 23px;
	    letter-spacing: 1px;
	    font-weight: bold;
	}

	.content-order table{
		width: 100%;
		text-align: left;
		font-size: 18px;
	}

	.content-order td{
		line-height: 40px;
		color: #ddd;
	}

	.content-order button{
		background-color: #0000;
		outline: none;
		border: none;
	}

	.content-order i{
		color: #ddd;
	}

	.btn-ordernow{
		background-color: #e2d84d!important;
		/*background-image: url(../images/img/lemon.png);*/
		background-size: 30%;
		background-repeat: no-repeat;
		background-position: center;
		width: 30%;
		margin: 25% 0% 5% 0%;
		padding: 0% 5%;
		font-size: 18px;
		border-radius: 5px;
		border: none;
		color: #262928;
		letter-spacing: 0px;
		font-weight: bold;
		outline: none;
	}

	.price{
		color: #fbe16e!important;
    	font-weight: bold;
   		font-size: 20px;
    	margin: 5% 0%;
	}
	input[type=checkbox] {
	    transform: scale(1.5);
	}
/******RESPONSIVE**********/

@media(max-width: 2560px){
	.box-4 p {
		font-size: 20px;
	}
	.price{
		font-size: 35px!important;
	}
	.box-2 small{
		font-size: 30px;
	}
	.obj-2 small {
		font-size: 30px;
	}
	.head-2 li{
		font-size: 19px;
	}
	.box-1 p{
		font-size: 20px;
	}
	.box-1 h2{
		font-size: 25px;
	}
	
	.box-2 p{
		font-size: 22px;
	}

	.box-2 li{
		font-size: 22px;
	}
	.box-2 h3{
		font-size: 35px;
	}
	.box-2 h4{
		font-size: 30px;
	}
	.box-3{
		top: 83%;
	}
	.box-3 h3 {
		font-size: 30px;
	}
	.box-3 p{
		font-size: 22px;
	}
	.box-2-2 img {
	    width: 50%!important;
	}

	.user p{
		font-size: 30px;

	}
	.comments p{
		font-size: 22px;
	}
	.comments-1 p{
		font-size: 22px;
	}
	.obj-1 p{
	font-size: 22px;
	}
	.obj-1 li{
	font-size: 22px;
	}
	.obj-1 h4{
	font-size: 40px;
	}

	.obj-2 p{
	font-size: 22px;
	}
	.obj-2 li{
	font-size: 22px;
	}
	.obj-2 h4{
	font-size: 40px;
	}
	.forma-1 h4 {
	font-size: 40px;
	}
	.forma-1 p{
	font-size: 22px;
	}
	.footer-W h2{
		font-size: 18px;
	}
	.footer-W li{
		font-size: 15px;
	}
	.footer-W i{
		font-size: 14px;
	}
}
@media(max-width:1440px){
.price {
    font-size: 25px!important;
}

	.box-3{
		top: 70%;
    	background-image: linear-gradient(#00000012,#000000bf, #000000eb, #000);
	}
	.head-2 button {
	width: 90%;
	}
	.head-2 img {
	    width: 17%;
	    padding: 0.5% 1% 1% 0%;
	    margin: 0% 0% 0% 0%;
	    cursor: pointer;
	}
	.box-2 small{
		font-size: 20px;
	}
	.obj-2 small {
		font-size: 20px;
	}
	.head-2 li{
		font-size: 15.5px;
	}

	.box-1 p{
		font-size: 17px;
	}
	.box-1 h2{
		font-size: 20px;
	}
	.box-2 li{
		font-size: 17px;
	}
	.box-2 h3{
		font-size: 30px;
	}
	.box-2 p{
		font-size: 17px;
	}
	.box-2 h4{
		font-size: 20px;
	}
	.box-2 h3{
		font-size: 25px;
	}
	.box-2-2 img {
	    width: 55%!important;
	}

	.obj-1 h4{
	font-size: 30px;	
	}
	.obj-1 p{
	font-size: 17px;
	}
	.obj-1 li{
	font-size: 17px;
	}

	.obj-2 h4{
	font-size: 30px;	
	}
	.obj-2 p{
	font-size: 17px;
	}
	.obj-2 li{
	font-size: 17px;
	}
	.forma-1 h4 {
	font-size: 30px;
	}

	.forma-1 p{
	font-size: 17px;
	}
	.box-3 p{
		font-size: 17px;
	}
	.footer-W h2{
		font-size: 18px;
	}
	.footer-W li{
		font-size: 13px;
	}
	.user p{
		font-size: 25px;

	}
	.comments p{
		font-size: 17px;
	}
	.comments-1 p{
		font-size: 17px;
	}	
}
@media(max-width:1024px){
.price {
    font-size: 22px!important;
}

	.box-3 {
	    top: 60%;
	}
	.box-1 p {
	    font-size: 15px;
	}
	.box-2 li {
    	font-size: 15px;
	}
	.box-2 p {
	    font-size: 15px;
	} 
	.box-2 h4 {
	    font-size: 30px;
	    font-weight: 400;
	}
	.head-2{
		padding: 1% 1% 0%;
	}
	.head-2 li {
	    font-size: 13.5px;
	}
	.head-2 button {
	    width: 110%;
	    font-size: 15px;
	}
}
@media(max-width: 990px){

	.content-logo{
		width: 50%;
		margin-right: 1%;
	}

	.header-pc{
		display: none;
	}

	.header-mobile{
		display: block;
	}
	.desktop{
	 display: none;
	}
	.mobil{
	 display: block;	
	}
	.content-order {
    	margin: 20% 5%;
	}
}
@media(max-width:768px){

	section{
	position: relative;
    top: 50%;
	}
	.head-2{
		display: none!important;
	}

	.desktop{
 		display: block;
	}
	.mobil{
	 	display: none;	
	}
	.description li {
	font-size: 14px;
	}
	.box-2 button {
	width: 50%;
	}
	.box-3 p {
	    font-size: 15px;
	}
	.box-2-2 img {
	    width: 100%!important;
	    padding: 10%;
	}
	.footer-W li {
	    font-size: 11px;
	}
	.footer-W h2 {
	    font-size: 14px;
	}
	.box-2 h3{
		margin-top: 15%;
	}
}
@media screen and (max-width: 500px) {
	section{
		top: 30%;
	}
}
@media (max-width: 425px){
	section {
		top: 265px;
	}
	.btn-ordernow{
	width: 60%;
	}
	.box-mob{
		padding: 10% 13% 0% 13%;
		margin-top: 15%;
	}

	.box-2 li>img {
	    width: 15%!important;
	}
	.box-2 iframe {
	    border-radius: 5px;
	    margin: 5% auto;
	    width: 90%;
	}
	.box-2 select {
	    width: 100%;
	}


	.box-2{
		padding: 5% 7% 0% 7%;
	}
	.box-2 h4{
		font-size: 17px;
		bottom: 40%;
	}

	.box-3{
    	width: 100%;
    	padding: 2%;
    	text-align: center;
    	position: fixed;
    	z-index: 10;
    	top: 200px;
	}

	.box-3 img{
		width: 30%;
	    border-radius: 5px;
	    margin: 0% 0% 0% 0%;
	    padding: 1%;
	}

	.head-2{
		display: none;
	}
	.head-2 ul{
		display: none;
	}
	
	.box-1 li{
		padding-left: 20%;
	}
	.box-1 i{
		left: 12%;
	}

	.box-2 button{
		width: 45%;
		margin: 2% 0% 4% 0%;
		padding: 1% 4%;
		font-size: 12px;
	}

	.obj-2:before {
		display: none;
	}
	.obj-2:after {
		display: none;
	}
	.obj-2-2:after {
		display: none;
	}
	.obj-2 li{
	    padding-left: 7%;
	}
	.obj-2 i{
		left: 5%
	}
	.obj-2 h4{
		font-size: 25px;
	}
	.obj-1 img{
		width: 75%;
	}

	.obj-1 h4{
		text-align: left;
		font-size: 25px;
	}
	.obj-1 li{
		text-align: left;
		padding-left: 7%;
		padding-right: 0%;
	}
	.obj-1 p{
		text-align: left;
		padding-right: 0%;
	}
	.obj-1 i{
		right: 0%;
		left: 5%;
	}
	.obj-2-2 img{
		text-align: center;
		width: 90%;
	}
	.desktop{
	 display: none;
	}
	.mobil{
	 display: block;	
	}
	.obj-2 {
		margin-bottom: 10%;
	}
	.footer-W{
		padding: 4% 0% 0% 0%;
	}
	.footer-W li {
    font-size: 10px;
	}
	.footer-W h2 {
	    font-size: 17px;
	    margin-top: 4%;
	}
	.log img{
		display: none;
	}
	.box-2 h3 {
		margin-top: 0%;
		font-size: 17px;
		margin-bottom: 5%;
	}
	.box-2 p{
		font-size: 11px;
		margin-bottom: 0%;
	}
	.box-3 p {
    font-size: 13px;
    margin-bottom: 2%;
	}
	.fondo{
		width: 85%;
	}
	.forma-1 button{
		width: 70%;
	}
	.user p {
    font-size: 30px;
	}
	.comments:after{
	display: none;
	}
	.comments-1:before{
	display: none;
	}
	.modal-lg{
	max-width: 95%!important;
		  margin: auto;
		  top: 3%!important;
	}
	.btn-buenfin {
    width: 7%;
   }
   .box-2-2 img {
    width: 75%!important;
   }

  	.object{
  		top: 36%;
  	}
	.box-4 {
	    text-align: center;
	    padding: 0% 5%;
	    margin: 0%;
	    padding-bottom: 0%;
	}
	.box-4 div {
	    margin: 5% 0% 0%;
	}
	.box-4 h3 {
	    font-size: 17px;
	    margin: 7% 0% 0%;
    	padding-bottom: 7%;
    	border-bottom: 1px solid #333;
	}
	.box-4 h5{
		right: 6%;
	}
	.box-4 i{
		padding: 0% 2%;
		margin-right: 2%;
		font-size: 1.1em;
	}
	.box-4 p {
    font-size: 1.1em;
	}
}
@media (max-width: 360px){
	
	section{
		top: 230px;
	}
	.box-3{
		top: 185px;
	}
	.background-imag {
    	height: 335px;
	}
	.box-4 h3 {
	    margin: 10% 0% 0%;
	    padding-bottom: 10%;
	}
	.object {
	    top: 36%;
	}
}
@media (max-width: 360px){
	.object {
	    top: 36%;
	}
}

@media (max-width: 320px){
	.object {
	    top: 42%;
	}
	.background-imag {
    	height: 350px;
	}
}