* {
	margin: 0;
	padding: 0;
}

html,
body {
	height: 100%;
	overflow: hidden;
}

body {
	background-color: #222;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAGklEQVQIW2NkYGD4D8SMQAwGcAY2AbBKDBUAVuYCBQPd34sAAAAASUVORK5CYII=);
	background-repeat: repeat;

	font-family: 'Lato', Helvetica, sans-serif;
	font-size: 16px;
	color: #222;
}

a {
	color: #c2575b;
	text-decoration: none;

	-webkit-transition: 0.15s color ease;
	   -moz-transition: 0.15s color ease;
	    -ms-transition: 0.15s color ease;
	     -o-transition: 0.15s color ease;
	        transition: 0.15s color ease;
}
	a:hover {
		color: #f76f76;
	}

h1,
h2 {
	font-size: 24px;
}


/* modal */
.popup {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  width: 100vw;
  height: 100vh;
  bottom: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 2;
  visibility: hidden;
  opacity: 0;
  overflow: hiden;
  transition: .64s ease-in-out;
}
.popup-inner {

  bottom: -100vw;
  right: -100vh;
  display: flex;
  align-items: center;
  max-width: 800px;
  max-height: 620px;
  width: 60%;
  height: 100%;
  background-color: #fff;
  -webkit-transform: rotate(32deg);
          transform: rotate(32deg);
  transition: .64s ease-in-out;
	overflow: hiden;
}
.popup__photo {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  width: 40%;
  height: 100%;
  overflow: hidden;
}
.popup__photo img {
  width: auto;
  height: 100%;
}
.popup__text {
  display: flex;
  flex-direction: column;
	width: 60%;
   height: 100%;
   padding: 1rem;
 }

.popup__text h1 {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0rem;
  text-transform: uppercase;
  color: #0A0A0A;
}
.popup__text p {
  font-size: .875rem;
  color: #686868;
  line-height: 1.5;
}
.popup:target {
  visibility: visible;
  opacity: 1;
}
.popup:target .popup-inner {
  bottom: 0;
  right: 0;
  -webkit-transform: rotate(0);
          transform: rotate(0);
}
.popup__close {
  position: absolute;
  right: -1rem;
  top: -1rem;
  width: 3rem;
  height: 3rem;
  font-size: .875rem;
  font-weight: 300;
  border-radius: 100%;
  background-color: #0A0A0A;
  z-index: 4;
  color: #fff;
  line-height: 3rem;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
}

/* end modal */



/* acordeon administrador */

div.seccion{
 width:100%;
 min-height:50px;
}

div.titulo{
 width:100%;
 height:50px;
 overflow: hidden;
 border-bottom: 1px solid #008238;
}

p.titulo{
 margin:13px;
 color: #008238;
}

div.informacion{
 width:100%;
 height:0px;
 background-color: #f5f5f5;
 overflow: hidden;
 transition: 2s;
 -webkit-transiton: height 2s;
}

p.informacion{
 color:#4f4f4f;
}

div.seccion:hover div.informacion{
 height:180px;
}
div.seccion1:hover div.informacion{
 height:175px;
}

.detalles{

 padding: 5px;
 padding-left: 20px;
 padding-right: 20px;
 background-color: #008238;
 color: white;
}

a.detalles{
 text-decoration: none;
}

.cruz{
 float:right;
 margin-right:10px;
}

.detalles:hover{
 background-color: #7CBA3D;
}

.imginformacion{
 float:left;
 margin: 10px;
}

.marca{
 clear: both;
 height:2px;
 width: 100%;
 background-color: #C70039;

}
div.informacion{
 width:100%;
 height:0px;
 background-color: #f5f5f5;
 overflow: hidden;
 transition: 1s;
 -webkit-transiton: height 0s;
}

p.informacion{
 color:#4f4f4f;
}

div.seccion:hover div.informacion{
 height:315px;
}
/* end acordeon */

.left{
	float: left;
padding-left: 20px;

}
.height{
	float: right;
	padding-right: 20px;
}
#height{
	float: right;

}




#form {
  width: 250px;
  margin: 0 auto;
  height: 50px;
}

#form p {
  text-align: center;
}

#form label {
  font-size: 30px;
}

input[type="radio"] {
  display: none;
}

label {
  color: grey;
}

.clasificacion {
  direction: rtl;
  unicode-bidi: bidi-override;
}

label:hover,
label:hover ~ label {
  color: #aa113d;
}

input[type="radio"]:checked ~ label {
  color: #aa113d;
}



.pedido{
	float: right;
	display: flex;
	position: absolute; top:2; right:  15px;
}
.desc{
padding-right: 151px;
	float: left;
	display: block;

}
des1{
	padding-right: 25px;




}

.pedir{

}
.des{
	float: right;

}
.recibo2{
	border: 0px solid #000000;

	display: block;
	justify-content: center;
	align-items: center;
	width: 80%;
	position: absolute; top:1; left: 150px;
	clear:both;
	padding: 5px;
}
.thumbnail{
	clear:both;
}

.impre{
	float: right;
}
.recibo{

	border: 1px solid #000000;
background:#FFFFFF;
	display: flex;
  justify-content: center;
  align-items: center;
	width: 80%;
	position: relative; top:1; left: 150px;
}

.reci{

 margin-bottom: 25px;
padding: 5px;
	border: 0px solid #000000;
	 background: #DAF7A6;
 border-radius: 4px;
	display: flex;
  justify-content: left;
  align-items: center;
	width: 100%;
	position: relative; top:0; left: 0px;
}
.row5{

 width: 80%;
}

.button {
    background-color: #aa113d; /* Green */
		height: 50px;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}
#fin{
	padding: 15px;
}

.meny {
	display: none;
	padding: 20px;
	overflow: auto;
	background: #000000;
	color: #eee;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
	.meny ul {
		margin-top:10px;
	}
		.meny ul li {
			display: inline-block;
			width: 200px;
			list-style: none;
			font-size: 20px;
			padding: 10px 10px;
		}
			.meny ul li:before {
				content: '';
				margin-right: 45px;
				color: rgba( 255, 255, 255, 0.2 );
			}

/**
 * Hint graphic that appears while menu is inactive
 */
.meny-arrow {
	position: absolute;


	border: 10px solid transparent;

	-webkit-transition: opacity 0.4s ease 0.4s;
	   -moz-transition: opacity 0.4s ease 0.4s;
	    -ms-transition: opacity 0.4s ease 0.4s;
	     -o-transition: opacity 0.4s ease 0.4s;
	        transition: opacity 0.4s ease 0.4s;
}
	.meny-left .meny-arrow {
		left: 14px;
		top: 50%;
		margin-top: -16px;
		border-left: 16px solid #333;
	}
	.meny-right .meny-arrow {
		right: 14px;
		top: 50%;
		margin-top: -16px;
		border-right: 16px solid #333;
	}
	.meny-top .meny-arrow {
		left: 50%;
		top: 14px;
		margin-left: -16px;
		border-top: 16px solid #333;
	}
	.meny-bottom .meny-arrow {
		left: 50%;
		bottom: 14px;
		margin-left: -16px;
		border-bottom: 16px solid #333;
	}
	.meny-active .meny-arrow {
		opacity: 0;

		-webkit-transition: opacity 0.2s ease;
		   -moz-transition: opacity 0.2s ease;
		    -ms-transition: opacity 0.2s ease;
		     -o-transition: opacity 0.2s ease;
		        transition: opacity 0.2s ease;
	}

/**
 * Main contents area
 */
 .container-fluid{
	 	background: #000000;


 }
.contents {
	background: #eee;
	padding: 1px 1px;
	width: 100%;
	height: 100%;
	overflow-y: auto;

	-webkit-overflow-scrolling: touch;
	-webkit-transform-style: preserve-3d;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
	.contents>article {
		max-width: 400px;
	}
	.contents p {
		margin: 10px 0 10px 0;
		font-size: 16px;
		line-height: 1.32;
	}
	.contents small {
		display: block;
		margin-top: 10px;
		padding-top: 10px;
		color: #333;
		font-size: 0.85em;
		border-top: 1px dashed #ccc;

		-webkit-text-size-adjust: none;
	}
	.contents .sharing {
		position: absolute;
		bottom: 20px;
	}


	.row1{

	  display:inline-block
	  padding: 50px;

	}