body { 
    background: url('../config/fondo.jpg') no-repeat 62% 34%;
	background-position:center;
	background-size:cover;
	background-attachment:fixed;
	height: 100vh;
	text-align:center;
    font-family: 'Roboto', sans-serif;
    /*overflow: hidden;*/ /* Hide scrollbars */
}

    input[type='radio']:after {
        width: 15px;
        height: 15px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: #d1d3d1;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid white;
    }

    input[type='radio']:checked:after {
        width: 15px;
        height: 15px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: #572364;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid white;
    }

.crear_cuenta{
    color:white;
}
.crear_cuenta:HOVER{
    color:#7b3190;
}

.mi_boton_entrar{
    padding:6px;
    padding-top:5px;
    padding-left:8px;
    padding-right:8px;
    font-size:18px;
    background-color: #7b3190;
    border: 2px solid #7b3190;
    color:white;
}
.mi_boton_entrar:hover{
    padding:6px;
    padding-top:5px;
    padding-left:8px;
    padding-right:8px;
    font-size:18px;
    cursor: pointer;
    background-color: #572266;
    border: 2px solid #572266;
    color:white;
}

.mi_boton_entrar_paciente{
    padding:6px;
    padding-top:5px;
    padding-left:8px;
    padding-right:8px;
    font-size:18px;
    background-color: #236264;
    border: 2px solid #236264;
    color:white;
}
.mi_boton_entrar_paciente:hover{
    padding:6px;
    padding-top:5px;
    padding-left:8px;
    padding-right:8px;
    font-size:18px;
    cursor: pointer;
    background-color: #0d4749;
    border: 2px solid #0d4749;
    color:white;
}
.boton_refrescar_captcha{
    background-color:#572364; 
    color: white; 
}
.boton_refrescar_captcha:HOVER{
    background-color:#524057; 
    color: white; 
}
.vertical_center {
    position: relative;
    top: 40%;
    transform: translateY(-40%);
}

a{text-decoration:none;}

.container_login {
    width: 25%;
    margin: 0 auto;
    background:rgba(0, 0, 0, 0.6);
    padding: 42px 35px;
}

input[type="text"], input[type="password"] {
    width: 88%;
    padding: 15px 0px 15px 42px;
    border: 1px solid #fff;
    outline: none;
    font-size: 14px;
    color: #fff;
    margin: 0px 0px;
    font-family: 'Roboto', sans-serif;
}

.login_email {
    background: url("../config/mail.png") no-repeat 10px 11px;
    background-size: 24px;
}
.login_password {
    background: url("../config/pass.png") no-repeat 8px 9px;
    background-size: 24px;
}
.crear_nombre {
    background: url("../config/name.png") no-repeat 8px 9px;
    background-size: 24px;
}
.crear_apellidos {
    background: url("../config/name.png") no-repeat 8px 9px;
    background-size: 24px;
}
.crear_email {
    background: url("../config/mail.png") no-repeat 8px 9px;
    background-size: 24px;
}
.crear_password {
    background: url("../config/pass.png") no-repeat 6px 6px;
    background-size: 24px;
}
.recuperar_email {
    background: url("../config/mail.png") no-repeat 8px 9px;
    background-size: 24px;
}


.container_login span {
    font-size: 16px;
    color: #fff;
    float: left;
    width: 32%;
	margin-top: 8px;
	font-family: 'Roboto', sans-serif;
}

.container_login p {
    font-size: 17px;
    color: #fff;
}

/*--responsive--*/
@media(max-width:1440px){
	.container_login {
		width: 28%;
	}
}
@media(max-width:1366px){
	.container_login {
		width: 30%;
	}
}
@media(max-width:1280px){
	.container_login {
		width: 33%;
	}
}
@media(max-width:1080px){
	.container_login {
		width: 49%;
	}
}
@media(max-width:1024px){
	.container_login {
		width: 40%;
	}
}
@media(max-width:991px){
	.container_login {
		width: 42%;
	}
}
@media(max-width:800px){
	.container_login {
		width: 51%;
	}
}
@media(max-width:768px){
	.container_login {
		width: 54%;
	}
}
@media(max-width:736px){
	.container_login {
		width: 56%;
	}
}
@media(max-width:667px){
	.container_login {
		width: 61%;
	}
}
@media (max-width: 640px){
	.container_login {
		width: 64%;
	}	
}
@media (max-width: 600px){
	.container_login {
		width: 69%;
	}
}
@media (max-width: 568px){
	.container_login {
		width: 73%;
	}
	.container_login p a {
		font-size: 17px;
	}
}
@media (max-width: 480px){
	.container_login span {
		width: 38%;
		font-size: 15px;
	}
   .container_login p {
		font-size: 16px;
		width: 105%;
	}
	.container_login p a {
		font-size: 17px;
		letter-spacing: 0px;
	}
	input[type="submit"] {
		font-size: 17px;
	}
	input[type="text"], input[type="password"] {
		width: 86%;
	}
}
@media (max-width: 414px){
	.container_login {
		padding: 34px 26px;
	}
	.container_login span {
		font-size: 15px;
		width: 41%;
		margin-top: 9px;
	}
	input[type="text"], input[type="password"] {
		width: 84%;
		padding: 13px 0px 13px 40px;
		margin: 0px 0px;
	}
	.container_login p {
		width: 95%;
		line-height: 32px;
	}
	.container_login p a {
		font-size: 16px;
		letter-spacing: 1px;
	}
	input[type="submit"] {
		margin: 45px auto 25px;
	}
}
@media (max-width: 384px){
	.container_login {
		padding: 30px 26px;
	}
	input[type="text"], input[type="password"] {
		margin: 0px 0px;
		width: 83%;
		padding: 10px 0px 10px 39px;
	}
	.login_email {
		background: url("../config/mail.png") no-repeat 9px 8px;
		background-size: 22px;
	}
	.login_password {
		background: url("../config/pass.png") no-repeat 6px 6px;
		background-size: 22px;
	}
    
    .crear_nombre {
		background: url("../config/name.png") no-repeat 8px 9px;
		background-size: 22px;
	}
    .crear_apellidos {
		background: url("../config/name.png") no-repeat 8px 9px;
		background-size: 22px;
	}
    .crear_email {
		background: url("../config/mail.png") no-repeat 8px 9px;
		background-size: 22px;
	}
    .crear_password {
		background: url("../config/pass.png") no-repeat 6px 6px;
		background-size: 22px;
	}
    .recuperar_email {
		background: url("../config/mail.png") no-repeat 8px 9px;
		background-size: 22px;
	}
    
    
	.container_login span {
		width: 44%;
		margin-top: 12px;
	}
	input[type="submit"] {
		padding: 12px 52px;
		font-size: 17px;
		letter-spacing: 1px;
		margin: 34px auto 28px;
	}
	.container_login p {
		width: 102%;
		line-height: 29px;
	}
}
@media (max-width: 375px){
	.container_login span {
		width: 45%;
		margin-top: 10px;
	}
	.container_login {
		padding: 24px 34px;
        width: 75%;
	}
	.container_login span {
		width: 100%;
	}
	input[type="submit"] {
		padding: 12px 33px;
		font-size: 15px;
		letter-spacing: 0px;
		margin: 21px auto 12px;
	}
	.container_login p {
		width: 100%;
		line-height: 28px;
	}
	input[type="text"], input[type="password"] {
		width: 82%;
	}
}
@media (max-width: 320px){
	.container_login {
		padding: 24px 28px;
		width: 76%;
	}
	input[type="text"], input[type="password"] {
		width: 81%;
		padding: 12px 0px 12px 38px;
	}
	.login_email {
		background: url("../config/mail.png") no-repeat 8px 9px;
		background-size: 23px;
	}
	.login_password {
		background: url("../config/pass.png") no-repeat 6px 6px;
		background-size: 23px;
	}
    
    .crear_nombre {
		background: url("../config/name.png") no-repeat 8px 9px;
		background-size: 23px;
	}
    .crear_apellidos {
		background: url("../config/name.png") no-repeat 8px 9px;
		background-size: 23px;
	}
    .crear_email {
		background: url("../config/mail.png") no-repeat 8px 9px;
		background-size: 23px;
	}
    .crear_password {
		background: url("../config/pass.png") no-repeat 6px 6px;
		background-size: 23px;
	}
    .recuperar_email {
		background: url("../config/mail.png") no-repeat 8px 9px;
		background-size: 23px;
	}
    
	.container_login span {
		font-size: 14px;
	}
	input[type="submit"] {
		font-size: 15px;
	}
	.container_login p {
		font-size: 15px;
	}
	.container_login p a {
		font-size: 15px;
		letter-spacing: 0px;
	}
}
/*--//responsive--*/