@import url(http://fonts.googleapis.com/css?family=Droid+Sans);
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab);
* {
  
  /*with these codes padding and border does not increase it's width.Gives intuitive style . */
     
  -moz-box-sizing: border-box; 
}

body {
   margin:0;
   padding:0;
  font-family: 'Droid Sans', sans-serif;
  }
div#envelope{
	width:50%;
	margin: 10px 30% 10px 25%;
	background-color:#f2f4fb;
	padding:10px 0;
	border:1px solid gray;
	border-radius:10px;
	} 
	
form{
width:50%;
margin:0 29%;
max-width: 55%;
max-height: 33%;
margin-top: 100px;
padding: 1px;
}  

form header {
  text-align:center;
  font-family: 'Roboto Slab', serif;
  }

/* Makes responsive fields.Sets size and field alignment.*/
input[type=text] {
    margin-bottom: 20px;
    margin-top: 10px;
    padding: 5px;
    border-radius: 5px;
    margin-left: -1px;
    padding-left: -10%;
    /*border: 1px solid #1e73be;*/
}

input[type=password] {
    margin-bottom: 20px;
    margin-top: 10px;
    padding: 5px;
    border-radius: 5px;
    /*border: 1px solid #1e73be;*/
}

input[type=submit]
{
margin-bottom: 20px;
  width:30%;
  padding: 5px;
  border-radius:5px;
  /*margin-left: 61%;*/
  border:1px solid #4697e4;
  background-color:#fff;
}
textarea {
    width: 100%;
    padding: 0px;
    margin-top: 10px;
    border: 1px solid #1e73be;
    /*border:1px solid #7ac9b7;*/
    border-radius: 5px;
    margin-bottom: 20px;
    resize: none;
}
 
input[type=text]:focus,
textarea:focus {
  border-color: #4697e4;
}

.modal-header {
  padding-right: 100px;
  color:white;
}

 div#logo{
    float: right; 
    padding-top: 60px;
    margin: -15px 0 0 -18px;
	}

  div#mensajeConfirm{
    float: left; 
    padding-top: 70px;
    padding-left: 55px;
    padding-bottom: 15px;
    margin: -15px 0 0 -18px;
	}

 h3{color:white}
/* By using @ media form can have different layout for screen, mobile phone, tablet.*/

/* Sets the form layout for mobile phone, tablet*/

@media screen and (max-width: 1059px) and (min-width : 755px) {
.modal-header {
  padding-right: 0px;
}

 div#logo{
display: none;
	} 

}

@media screen and (max-width: 756px){

@import url(http://fonts.googleapis.com/css?family=Droid+Sans);
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab);
* {
  
  /*with these codes padding and border does not increase it's width.Gives intuitive style.*/
    
  -moz-box-sizing: border-box; 
}

body {
   margin:0;
   padding:0;
  font-family: 'Droid Sans', sans-serif;
  
  }
div#envelope{
	width:50%;
	margin: 10px 30% 10px 25%;
	background-color:#f2f4fb;
	padding:10px 0;
	border:1px solid gray;
	border-radius:10px;
	}

div#imageModal{
display: inline-block;
	} 

form{
width:80%;
height:auto;
margin:0 5% 0 5%;
max-width: 90%;
margin-top: 140px;
}  

form header {
  text-align:center;
  font-family: 'Roboto Slab', serif;
  }
 

/* Makes responsive fields.Sets size and field alignment.*/
    input[type=text] {
        margin-bottom: 20px;
        margin-top: 10px;
        width: 100%;
        padding: 5px;
        border-radius: 5px;
        /*border: 1px solid #1e73be;*/
    }

    input[type=password] {
        margin-bottom: 20px;
        margin-top: 10px;
        width: 100%;
        padding: 5px;
        border-radius: 5px;
        /*border: 1px solid #1e73be;*/
    }

    input[type=submit] {
        margin-bottom: 20px;
        width: 30%;
        padding: 5px;
        border-radius: 5px;
        border: 1px solid #1e73be;
        /*border:1px solid #7ac9b7;*/
        margin-left: 61%;
        background-color: rgb(164, 230, 219);
    }
    textarea {
        width: 100%;
        padding: 15px;
        margin-top: 10px;
        border: 1px solid #1e73be;
        /*border:1px solid #7ac9b7;*/
        border-radius: 5px;
        margin-bottom: 20px;
        resize: none;
    }
 
input[type=text]:focus,
textarea:focus {
  border-color: #4697e4;
}

img { 
max-width: 310px;
} 

.modal-header {
  padding-right: 0px;
  padding-top: 0px;
  color: #0088cc;
}

div#logo{
        display: none;
        visibility: hidden;
    max-width: 3px;
    max-height: 1px;
    width: 1px;
    padding: 0px;
    /*position:absolute;float: right; margin: -15px 0 0 -18px;*/
}

div#form{
    width: 380px;
    /*position:absolute;float: right; margin: -15px 0 0 -18px;*/
}

div#imageModal{
    display: none;
    visibility: hidden;
}



 
 h3{color: #08c}  

}

/*msolana Cambio Logo Farmacia La Paz 2021-01-12*/

#HeaderModalLogin {
    /* Ubicación de la imagen */
    background-image: url(/Images/header_login.png);
    /*background-image: url(../Images/background-Agro_1_o2.jpg);*/
    /* Para dejar la imagen de fondo centrada, vertical y horizontalmente */
    background-position: center center;
    /* Para que la imagen de fondo no se repita */
    background-repeat: no-repeat;
    /* La imagen se fija en la ventana de visualización para que la altura de la imagen no supere a la del contenido */
    /*background-attachment: fixed;*/
    /* La imagen de fondo se reescala automáticamente con el cambio del ancho de ventana del navegador */
    background-size: cover;
    /* Se muestra un color de fondo mientras se está cargando la imagen de fondo o si hay problemas para cargarla */
    /*background-color: #66999;*/
}

#logo {
    text-align: center;
    vertical-align: middle;
}

#logo #imagenlogo {
    vertical-align: middle;
    text-align:center;
}

#imagenlogo{
    max-height: 200px;
}