* {
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
}
html,
body {
  width: 100%;
  height: 100%;
  background-image: url(../img/bg.jpg);
  background-size: cover;
  font-family: 'Just Another Hand', cursive;
  font-weight: 200;
  background-color: #FFF;
  background-position: center;
  overflow-x:hidden;
}
.login {
  max-width: 550px;
  display: table;
  background-image: url(../img/cuadro_textura.png);
  background-size:100%;
  width: 100%;
  font-family: 'Just Another Hand', cursive;
  -webkit-box-shadow: -20px 20px 90px -20px rgba(119,119,119,1);
  -moz-box-shadow: -20px 20px 90px -20px rgba(119,119,119,1);
  box-shadow: -20px 20px 90px -20px rgba(119,119,119,1);
  left:50%;
  transform:translate(-50%);
  position:absolute;
  top: 12%;
}
#logo {
    width: 100%;
    max-width: 225px;
    margin: 40px;
}
.legend {
    position: relative;
    width: 100%;
    display: block;
    color: #503B3A;
    font-size: 57px;
    text-align: center;
    font-family: 'Just Another Hand', cursive;
	margin-bottom: -20px;
}
fieldset {
    padding: 5% 0% 5% 0% !important;
}
.input {
  position: relative;
  width: 90%;
  margin: 0px auto;
  border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  font-family: 'Just Another Hand', cursive;
  max-width: 630px;
}
.input p {
    position: relative;
    display: block;
    color: #503B3A;
    font-size: 40px;
    left: 10px;
	margin-bottom: -5px;
}
.input input {
  	width: 100%;
    padding-left: 15px;
    display: block;
    border: 1px solid #503B3A;
    color: #503B3A;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-size: 34px;
    background: rgba(255,255,255,0.35);
}
.input input:focus {
  padding-left: 15px;
  outline: 0;
}
.submit {
	height: 65px;
    display: block;
    background: #DB0A5B;
    color: #FFF;
    font-size: 55px;
    cursor: pointer;
    box-shadow: none;
    transition: 0.2s ease-out;
    border: none;
    outline: none;
    max-width: 225px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    line-height: 60px;
    width: 100%;
    float: right;
    position: relative;
    margin-right: 40px;
}
.submit:hover,
.submit:focus {
  background: #FFF;
  color: #DB0A5B;
}

#olvidar{
	color: #DB0A5B !important;
    font-size: 25px;
    text-align: left;
    margin: 0px auto;
    width: 90%;
    max-width: 630px;
}

#olvidar a{
	color: #DB0A5B !important;
}

#ayuda{
	position: absolute;
    left: 30px;
    bottom: 15px;
    font-size: 30px;
}

.modal-title{
	font-family: 'Amatic SC' !important;
	font-size: 33px;
}

.modal-body {
    height: 380px;
}

.modal-footer {
	display:none;
}

@media (max-width: 1150px) {
  	.login {
    	top: 200px;
	}
}

@media (max-width: 632px) {
  	.login {
    	top: 120px;
	}
	#ayuda {
    	position: relative;
    	width: 90%;
    	top: 0px;
    	left: 25px;
	}	
	.legend {
    	margin-bottom: 10px;
	}
	#logo {
    	width: 100%;
    	max-width: 175px;
    	margin: 10px;
	}
}