@charset "utf-8";


/*ESTILS DE POSICIONAMENT DELS ELEMENTS*/

/*Cada div conté el label i el input o select*/

div.ognfc {
}


/* Section headers */
div.ognfc div.ognlegend{
    float:left;
    padding:0px;
    width:100%;
    border:1px solid blue;
}
/* Tenim dos classes de div: el long, que ocupa el 100%...*/

div.ognfc div.long {
   clear:both;
   width:100%;
   padding-bottom:20px;  
   float:left;
} 

/*... i el short que només n'ocupa una part (50% 2 columnes, 33% 3 columnes etc etc). Per a que els shorts segueixin un fluxe d'esquerra a dreta, els fem flotar a l'esquerra*/

div.ognfc div.short {
   float:left;
   width:50%;
   padding-bottom:20px;  
}

div.ognfc div.short div.first {
   clear:left;
}

div.ognfc div.short div.second label{
    text-align:right;
}

/*Per poder assegurar l'alineació dels labels de diferents línees els hi donarem una amplada fixa. Per poder donar-los una amplada han de ser elements en block, però com que no volem que impliquin un salt de línea els hi posem display: inline-block */

div.ognfc label  {
   display: -moz-inline-stack; /*Firefox no implementa bé el display: inline-block. La solució més neta és utilitzar aquesta regla que només interpreta ell*/
   display: inline-block;
}

div.ognfc div.content {
   display: -moz-inline-stack;
   display:inline-block;
   zoom:1; /*Aquestes dues sentències horribles són per a que funcioni en IE6, ja q tan sols accepta inline-block per a elements natius inline*/
   *display:inline;
   vertical-align:bottom;
}

/*Definim les amplades dels labels, amb alineació horitzontal: Width_label_short = Width_label_long * (Width_div_long / Width_div_short) */

div.ognfc div.long label {
   width:20%;
   padding-right:1%;
}

div.ognfc div.long div.content label {
   width:75%;
}

div.ognfc div.short label {
   width:40%;
    padding-right:2%;
}

/*La diferència fins a 100 s'hauria de reservar per l'amplada de l'imput o el select. Degut a la mala implementació dels navegadors no hem d'arribar a 100 sinó salta de línea. Pel cas dels checkboxs és millor no donar-li una amplada a l'input, pq sinó en algún navegador label i input apareixen molt separats*/

div.long div.content {
   width:77%;
}

div.short div.content {
   width:54%;
}

div.long div.content input, div.long div.content select, div.short div.content input, div.short div.content select {
    width:100%;
}
/*El textarea és l'únic amb el label al damunt i no al costat. Donant-li una llarga amplada ens assegurem que salti a baix. Per a que surti alineat horitzontalment amb els inputs i els selects llargs, li restem tan com hem restat abans.*/

div.ognfc textarea {
   width:99%;
   margin:auto;
}

/*Pel cas dels butons introduim, tan un long button com un short button mostraran un butó a l'esquerra, però un segon short button després d'un altre short button, mostrarà un segon butó sotá la següent columna de formulari. Introdueixo també una classe buttonright per si volem que aparegui a la dreta".*/

div.buttonright {
   float:right;
}


/***
* OGN
*/

div.ognfc div.spacer{
	clear:both;
	height:1.5em;
}

div.ognfc div.closer{
	border-top:1px dotted #4C575F;
    padding-top:5px;
    text-align:center;
    clear:both;
}

div.ognfc div.closer2{
    text-align:center;
    clear:both;
}

/* Upload tool*/
div.ognfc div.uploadtool img{
    border:1px solid #222;
}

/* Geocoder */
div.ognfc div.geocoder div#map{
    width:100%;
    height:300px;
}

div.ognfc div.geocoder div#mapcontrol{
    text-align:right;
}

.errorbox{
    display:none;
    border:1px solid #E4166A;
    background-color: #FFCFCF;    
    padding:1em 1.5em;
    margin:1em auto;
    font-weight:bold;
    color:#E4166A;
    text-align:center;
    width:70%;
    clear:both;
}

.errorboxok{
    border: 1px solid #4C575F;
    background-color: #CFEbCF;    
    color:#4C575F;
}



div.ognfc div.checkitem{
	float:left;
}
div.ognfc div.checkitem label{
    width:80%;
}
div.ognfc div.checkitem input{
    float:left;
    width:20%;
    border:0;
}

/* VALIDACION */

input.empty,textarea.empty,select.empty{
    border:1px solid #E4166A;
    color:#E4166A;
}
input.empty:hover,textarea.empty:hover,select.empty:hover{
    border:1px solid #E4166A;
    color:#E4166A;
}

input.empty,textarea.empty,select.empty,tr.empty{
    background:#FFCFCF;
}

label.empty, p.empty{
  color:#E4166A;
}
p.empty{
  display:none;	
}


/* FIN VALIDACION */

/*ESTILS DE PRESENTACIÓ*/

form {
padding-top: 15px;	
background:transparent none repeat scroll 0 0;
color:#4C575F;
height:auto;
position:relative;
}

fieldset {
	padding:1em 1em 0.5em 1em;
}

label {
   color:#4C575F;
   font-size:1.0em;
   font-weight:bold;
   line-height:1.5em;
   text-align:left;
}

label.content_login {
	color:#4C575F;
	font-size:12px;
	/* [disabled]font-weight:bold; */
	line-height:1.5em;
	text-align:left;
}

label.top {
   vertical-align:top;
}

input {
	/* [disabled]-moz-border-radius-bottomleft:0.4em; */
	/* [disabled]-moz-border-radius-bottomright:0.4em; */
	/* [disabled]-moz-border-radius-topleft:0.4em; */
	/* [disabled]-moz-border-radius-topright:0.4em; */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding:0.15em;
	border: 1px solid #D5D5D5;
}

input:hover, input:focus {
	background:#F6F6F6 none repeat scroll 0 0;
	/* [disabled]border-color:#C5C5C5; */
}

input[type=submit]:hover, input[type=submit]:focus {
	background:#666666 none repeat scroll 0 0;
	border: 1px solid #666666;
}


.dato {
margin-top:1em;
padding-left:1%;
position:relative;
text-align:left;
}

.submit, .submitblanco, .multiplelist_add, .multiplelist_remove {
display:inline;
padding:4px 25px;
margin: 0px 10px;
cursor:pointer !important;
width:auto;
font-size:1.2em;
}

.submit {
background:#E4166A none repeat scroll 0 0;
border:1px solid #E4166A;
color:#FFFFFF;
margin-bottom: 20px;
}


.submitblanco, .multiplelist_add, .multiplelist_remove {
border:1px solid #4C575F;
color:#4C575F;
background-color:#FFF;
}

.submit:hover {
	background:#666666 none repeat scroll 0 0;
	border-color:#666666;
	color:#FFF;
}

.multiplelist_add, .multiplelist_remove {
    margin-left:92px;
    margin-bottom:5px;
}

.multiplelist_add {
 margin-top:45px;
 }

.submitblanco:hover, .multiplelist_add:hover, .multiplelist_remove:hover {
background:#FFFFFF none repeat scroll 0 0;
border-color:#E4166A;
color:#E4166A;
}

select:hover, select:focus {
background:#F6F6F6 none repeat scroll 0 0;
border-color:#C5C5C5;
}

.listbox {
height:9.6em;
width:100%;
}

select {
-moz-border-radius-bottomleft:0.4em;
-moz-border-radius-bottomright:0.4em;
-moz-border-radius-topleft:0.4em;
-moz-border-radius-topright:0.4em;
background:#FAFAFA none repeat scroll 0 0;
border:1px solid #DDDDDD;
padding:0.15em;
width:100%;
}

select, input, button, textarea {
-x-system-font:none;
font-family:verdana,arial,helvetica,clean,sans-serif;
font-size:90%;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:normal;
line-height:normal;
}

select, input, button {
cursor: pointer;	
}


textarea{
    padding:0.15em;
    width:100%;*width:98%;
    height:6.1538em;*height:6.01em;
    border:1px solid #ddd;
    background:#fafafa;
    -moz-border-radius:0.4em;
    -khtml-border-radius:0.4em;
    *margin-left:-20px;
    
}

/*

.error_msg {
    border:1px solid #E4166A;
    background-color: #FFCFCF;    
    padding:1em 1.5em;
    font-weight:bold;
    color:#E4166A;
    text-align:center;
    width:auto;
}
	*/

div.uploadtool {
   margin:0;
}

div.imgwrapper {
   width:300px;
   clear:none;
   float:left;
}

div.img_info {
   width:40%;
   float:left;
   padding:1em;
   
}

div.img_buttons {
   clear:left;
}

#uploadlogoestabliment {
	display:block;
}

.descripcion{
  font-size:0.9em;
}

#loginForm label {
	/*padding-left:38px;*/	
	width: 30px;
}

/*#loginForm input {
	width:120px;	
}*/
.uploadbutton {
	margin-left: 0px;
	margin-right: 0px;
}