header {
	width: 100%;
	z-index: 100000000000000000000!important;
	padding: 0 0 0px;
	overflow: visible;
	color: white;
	clear: both;
	position: fixed;
}

.logo {
	float: left;
	margin: 10px 10px 0 15px; 
}

.modal-catalogo {
	width: 250px;
	padding: 20px 30px;
	background: #333;
	color: yellow;
	text-align: center;
	text-transform: uppercase;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -100px;
	z-index: 20;
	display: none;
	opacity: 0;
}

.confirmar-canje {
	float: left;
	padding: 4px 10px;
	background: yellow;
	color: #333;
	margin-top: 15px;
	cursor: pointer;
	border: 1px solid yellow;
	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
}

.cancelar-canje {
	float: right;
	padding: 4px 10px;
	background: yellow;
	color: #333;
	margin-top: 15px;
	cursor: pointer;
	border: 1px solid yellow;	
	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
}

.confirmar-canje:hover,
.cancelar-canje:hover{
	background: #333;
	color: yellow;
	border-bottom: 1px solid yellow;
}

.modal-catalogo span {
	font-weight: 400;
	display: inline-block;
	clear: both;
}

.rotated {
    -webkit-transform: rotate(45deg);  /* Chrome, Safari 3.1+ */
    -moz-transform: rotate(45deg);  /* Firefox 3.5-15 */
    -ms-transform: rotate(45deg);  /* IE 9 */
    -o-transform: rotate(45deg);  /* Opera 10.50-12.00 */
    transform: rotate(45deg);  /* Firefox 16+, IE 10+, Opera 12.10+ */
}

.iconos i {
	margin-top: 30%;
	color: white;
	font-size:30px;
	padding: 30px 20px;
	border: 2px solid white;
	width: 40px;
	line-height: 25px;
	height: 20px;
	-webkit-border-radius: 114px;
	   -moz-border-radius: 114px;
		    border-radius: 114px;
}

.item-title {
	margin-top: 30px;
	padding-bottom: 10px;
	border-bottom: 1px solid yellow;
	margin-bottom: 10px;
	font-size: 16px;
}

.nicescroll-rails {
	z-index: 9999!important;
}

.preloader {
	position: absolute;
	top: 80px;
	left: 0;
	width: 100%;
	height: 100%;
	background: yellow;
	opacity: 0.8;
	z-index: 2;
	background: url("../img/preloader.gif") center center no-repeat yellow;
	display: none;
	opacity: 0;
}

section {
	clear: left;
	padding-top: 80px;
}

.ingrese-numero {
	float: left;
	margin: 10px 20px 0 10px;
} 

.log-item {
	float: left;
}

input#numero,
input#pass {
	float: left;
	border-radius: 0;
	border: 1px solid #333;
	width: 120px;
}
input#numero.error,
input.error {
	background: red;
}

.error-numero {
	display: none;
	opacity: 0;
	float: left;
	margin: 6px;
	color: yellow;
	margin-top: 30px;
}
.nav-catalogo {
	float: right;
	width: auto;
	padding-top: 35px;
	opacity: 0;
	display: none;
}

.nav-catalogo .nombre {
	float: left;
	margin-right: 15px;
	line-height: 30px;
	min-width: 150px;
}
.nav-catalogo .puntos {
	float: left;
	margin-right: 5px;
	padding: 4px 10px;
	text-align: center;
	width: 80px;
	background: yellow;
	color: #333;
	min-width: 100px;
	border: 1px solid #333;
}

.nav-catalogo .nav-item {
	float: left;
	padding: 4px 10px;
	background: yellow;
	color: #333;
	cursor: pointer;
	margin-right: 5px;
	border: 1px solid #333;
	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
}

.nav-catalogo .nav-item:hover,
.nav-catalogo .nav-item.active{

	border: 1px solid yellow;
	background: #333;
	color: yellow;
}


.enviar {
	float: left;
	width: 60px;
	text-align: center;
	padding: 4px 10px;
	background: yellow;
	cursor: pointer;
	color: #333;
	margin-left: 5px;
	border: 1px solid #333;
	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
    margin-top: 25px;
}

.enviar:hover {
	background: #333;
	color: yellow;
	border: 1px solid yellow;
}

.header-menu {
	height: 90px;
	background: #333;
}

.contrasena {
	font-size: 12px;
	clear: both;
	cursor: pointer;
	float: left;
	margin-top: -10px;
	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
}


.contrasena:hover {
	color: yellow;
}

.item-catalogo{
	width: 319px;
	height: 319px;
	float: left;
	position: relative;
	cursor: pointer;
}

.item-catalogo:hover .hover-item,
.hover-item.active{
	opacity: 1;
}

.hover-item {
	width: 100%;
	height: 100%;
	position: absolute;
	top:0;
	left: 0;
	opacity: 0;
	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
    text-align: center;
    color: white;
}

.hover-item .items-hover {
	position: relative;
	z-index: 2;
}

.hover-item .back-hover{
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0.8;
	position: absolute;
	top: 0;
	left: 0;
}

.imagen-item img {
	width: 100%;
}

.footer {
	height: 30px;
	width: 100%;
	background: #333;
	clear: both;
	position: fixed;
	z-index: 4;
	bottom: 0;
}

.observacion {
	text-align: center;
	color: yellow;
	line-height: 28px;
	font-size: 14px;
}

span {
	width: 60px;
	text-align: center;
	padding: 4px 10px;
	background: yellow;
	cursor: pointer;
	color: #333;
	border: 1px solid #333;
}

.olvidaste-contrasena {
	height: 0px;
	position: fixed;
	width: 100%;
	z-index: 3;
	background: #333;
	top: 90px;
	overflow: hidden;

	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
}

.olvidaste-contrasena.abierto {
	height: 220px;
}

.olvidaste-wrapper {
	position: relative;
	width: 900px;
	margin: 0 auto;
}

.olvidaste-contrasena h2 {
	color: yellow;
	border: 0;
	margin: 0;
	padding: 0;
	margin-top: 20px;
}
.olvidaste-contrasena h3 {
	color: #ccc;
}

.cerrar-olvidaste {
	position: absolute;
	top: 10px;
	right: 10px;
	color: white;
	cursor: pointer;

}

.olvidaste-contrasena .form-item {
	float: left;
	width: 220px;
	margin-right: 5px;
}

.olvidaste-contrasena .form-item label{
	color: #ccc;
}

.olvidaste-contrasena .enviar-contrasena {
	clear: both;
	float: left;
	text-align: center;
	padding: 4px 10px;
	background: yellow;
	cursor: pointer;
	color: #333;
	border: 1px solid #333;
	-webkit-transition: all 0.25s ease-out;
  	   -moz-transition: all 0.25s ease-out;
     	 -o-transition: all 0.25s ease-out;
        	transition: all 0.25s ease-out;
    margin-top: 10px;
}

.olvidaste-contrasena .enviar-contrasena:hover {
	background: #333;
	color: yellow;
	border: 1px solid yellow;
}


@media all and (max-width:720px){
	/*.item-catalogo {
		width: 100% !important;

	}*/
}