/* CSS Document */

*{
margin:0;
padding:0;
}

html,body{

margin:0px;

height:100%;
font-family: Arial, Helvetica, Verdana;
font-size: 90%;
}

 body {
	background-color: #003333;
	position: static;
}

 header{
	height:9% /*9%;*/
	
	
	
}

#texto
{
 font-size: 2.5em;
 color:#ffffff;
 /*background-color: #C1C1C1;   poner
 width:60%;
 height: 30%;*/
 margin-left:20%;
 
text-shadow:
 1px 1px 0px rgba(230,230,230,1),
 2px 2px 0px rgba(200,200,200,1),
 3px 3px 0px rgba(180,180,180,1),
 4px 4px 0px rgba(160,160,160,1),
 5px 5px 0px rgba(0,0,0,1),
 8px 8px 20px rgba(0,0,0,0.5);
  }
  header, footer{
	
/*	background-color:#C1C1C1;*/
background: linear-gradient(#323131, white);

		width: 98%;
		
		margin:auto;
	/*border: medium solid #333333;*/
   
	/*redondeaado de esquinas */
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;

}
  

/********************************************************++footer****************/
footer
{
color: #000033; /*#0000FF;*/
font-weight:bold;
    margin-bottom:2px; /*15px;*/
    padding: 5px 0; /* 25px 0;*/
	/*background-color:#FFFFFF;*/
	height:9%;
}
/*Texto de pie de pagina */
footer .textoizquierda {
   
	text-align:left;
	margin-left:20px;
	/*margin-top:2px;*/
	font:bold;
	padding:4px;
	
}
footer .textoderecha {
float:right;
margin-right:20px;
margin-top:2px;
}



#logo{
float:left;
margin-left:20px;
margin-right:5%;
padding:0px;

}
#logo img{
	width:90%; 
	height:auto;
	margin-top:2%;
}
 #contenedor
 {
 	width: 98%;
 	height:98%;
  	margin:  auto;
/*border: 2px solid red;*/
padding-top:5px;

 }

#contendatos,#contendatos1
{
	height: 78%;
	width: 98%;
	margin: auto;
	margin-top:2px;
	margin-bottom:2px;
	border: medium  solid #333333;

	background-color:#fff;
	/*redondeaado de esquinas */
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
#contendatos{height:78%;}
#contendatos1{height:75%;} /*cuando tiene menu*/
 /**************************************************** menu ***********************************/ 
.menu_container {
    padding:0;
    position:relative;
    height: 30px;
    border-top: 4px solid #FFAE00;
    z-index: 400;
	margin:auto;
	width:98%;
    background-image: -webkit-gradient(linear, top, bottom, color-stop(0, #FFF9ED), color-stop(1, #BDBDBD));
    background-image: -ms-linear-gradient(top, #FFF9ED, #BDBDBD);
    background-image: -o-linear-gradient(top, #FFF9ED, #BDBDBD);
    background-image: -moz-linear-gradient(top, #FFF9ED, #BDBDBD);
    background-image: -webkit-linear-gradient(top, #FFF9ED, #BDBDBD);
    background-image: linear-gradient(to bottom, #FFF9ED, #BDBDBD);

}


.menu{

}
ul, ol, li { 
				list-style:none; /* aquitar los cuadrados izquierdos */
			}
.menu > li {
				float:left; /*coloca los elementos del menu */
				margin-top:10px;
			}			
.menu ul {
	min-width: 160px;
}
.menu li ul {
				display:none; /*oculta los submenus */
				position:absolute; /* para que el submenu se coloque en el menu correspondiente */
				min-width:160px;
				outline:0;
				
			
				
				color: #D5D5D5;
    padding: 0px 15px 15px 15px;
	text-decoration: none;
    font-family: 'Oswald', sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: normal;
				
				
				
				
				
			}
/* First Level - Menu Primary */

.menu li a { /* primer menu */
    color: #121212;
    padding: 9px 15px 5px 15px; /*13 en vez de 8 */
	text-decoration: none;
    font-family: 'Oswald', sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: normal;
    text-shadow: 0 1px 0 #fff;
    margin: 0 2px 0 0;

}

	.menu li:hover > ul {
				display:block; /*para que aparezca el submenu correspondiente */
				
			}
.menu li ul li { 
				position:relative;/* para que el segundo submenu aparezca al lado */
			/*	 padding:150px; /*ancho de los submenus */
			/*	 padding-right:25px;*/
 				top:12px;/*posicion desde la barra principal de la altura los submenus */
				padding: 0px;
				margin: 0px;
				
			}
.menu li a:hover, .menu li a:active, .menu li a:focus, 
.menu li:hover > a{
    color: #fff;
    outline: 0;
    text-shadow: 0 1px 0 #b86700;
    background-image: -webkit-gradient(linear, top, bottom, color-stop(0, #FFAE00), color-stop(1, #FE8401));
    background-image: -ms-linear-gradient(top, #FFAE00, #FE8401);
    background-image: -o-linear-gradient(top, #FFAE00, #FE8401);
    background-image: -moz-linear-gradient(top, #FFAE00, #FE8401);
    background-image: -webkit-linear-gradient(top, #FFAE00, #FE8401);
    background-image: linear-gradient(to bottom, #FFAE00, #FE8401);
	
}

.menu li ul li ul { /*posicion de segundo submenu */
				right:-140px;
				top:0px; /*para que se mantenga la seleccion del submenu */
				z-index: 2;
				
			}
/* Child Levels - Menu Primary */

.menu li li a {
	color: #000; /*color del texto */
    text-transform: none;
    background: #FE8701;
	padding:10px 15px;
    margin: 0;
    border: 0;
    font-weight: normal;
    text-shadow: 0 1px 0 #b86700;
	
}
.menu li ul li a{
	display:block;
	width: 150px; /*anchura de los submenus */
}
/***************************** generales *************/
.titulo
{

	width:70%;
	font-size:28px;
	color:#2C2FBD;
	font-weight:bold;
	text-decoration:underline;
	text-align:center;

	margin:auto;

}

.boton
 {  /*boton enviar */
        font-size:12px;
        font-family:Verdana,Helvetica;
        font-weight:bold;
        color:white;
        background-color:#638cb5;
		text-align:center;
		
        border:0px;
        width:150px;
        height:35px;
		
		
		
		border:8px outset #CCCCCC;
/*redondeaado de esquinas*/
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px; 
		
		
   }
.contenboton
{
	width:50%;
	text-align:center;
	margin:auto;
	padding:2%;
	
}




/**************************************************************************************/
#cajadatos
{
 top:200px;
 z-index=400; 
 position: absolute;
 margin: 0 30%;
  background-color: #999999; /*#CCCCCC; #99FFCC; #999999;*/
  width:40%;
  height:30%;
 
  display:none;
	border: medium solid  #0000FF;
   
	/*redondeaado de esquinas */
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
#cajadatos #titulo
{
  display:block;
  text-align:center;
  margin-top:10%;
  font-size: 18px;/* 24px;*/
  color:#0000FF;
  font-weight:bold;
  
}

 #cajadatos .boton, #cajadatos .botonsolo
{
float:left;
width:30%;
margin:0 10% 0 10%;
text-align:center;

        font-size:12px;
        font-family:Verdana,Helvetica;
        font-weight:bold;
        color:white;
        background-color:#638cb5;
		text-align:center;
		
      
		
		
		
		border:8px outset #CCCCCC;
/*redondeaado de esquinas*/
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px; 
		
		
   }
#cajadatos .botonsolo{width:40%; margin-left:30%;}

/***************************************** login **************************************/
#login
{
/*font-size:18px;*/

background-color:#C1C1C1;/*#85929E;*/
margin:10% auto;
padding-top:20px;
width:25%;
height:auto;
text-align:center;
/*redondeaado de esquinas */
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	
}
h1{font-size:24px; padding-bottom:10px;}
.usuario_login{padding:4%; }
.usuario_login input{width:70%;}
#login #enviar{width:50%;margin:2% auto;}

/******************************************++ principal ****************************************++*/
#principal_imagen{

				background-image:url(../images/fondo.jpg);
				-webkit-background-size: cover;
				-moz-background-size: cover;
				-o-background-size: cover;
				background-size: cover;
			height: 95%;
			width: 98%;
			text-align: center;
			//border: medium solid #333333;
			margin:1%;
			//margin-right:1%;
			///*padding-top: 20px;*/
			margin-top: 0px;
			background-repeat: no-repeat;
			background-position: center center;
}

#principal_datos
{
	width:60%;
	height: 60%;
	margin:auto;
	margin-top: 8%;
}
/************************************************ altas medicos *********************************/
 .bloqueado, .bloqueado2{
 	visibility:hidden; 
 }
#medicos_datos{
		/*border:2px solid blue;*/
		height:91%;
		width:80%;
		margin:2% auto;
		 background:#DBDBDB ;
		 /*redondeaado de esquinas*/
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px; 
		
	}
  .izq{
  	float:left;
  	margin:1% 5% ;
  	text-align: right;
  	width:40%;
  }
  .der{
  	margin: 1% 5%;/* 1% superior inferior 5% izq der*/
  	text-align: right;
  	} 
  .elemento{
  	margin: 1% 3% 1% 5%;
  	text-align: right;
  	width:20%;float:left;
  }
  #tabla_medicos{
  	height: 90%;
  	width: 100%;
  	
  }
  #form_alta_medicos,#form_alta
  {
  	width: 100%;
  	height: 100%;
  	padding-top: 2%;
  }
/****************************************************
/*************** alta abono medicos********************/
#form_alta_abono_medico{ height:90%; width:95%;margin:auto;}
#ab_m_tabla_datos{width:90%; height:10%;margin:auto;}
#ab_m_tabla_abonos{width:90%; height:85%;margin:1% auto; border:4px solid #12079F;padding: 2%;}
#ab_m_observaciones{text-align:left;}

/*************** baja abono medicos********************/
#baja_abonos{width:90%; height:70%;margin:1% auto; border:4px solid #12079F;}

.caja{
  float:left;
  width:10%;
  border:1px solid red;
  text-align: center;
}
#numlin{
  width:50%;
  margin:1% auto;
  border:2px solid #8E8B8B;
  height: 10%;
  background: #8E8B8B;
}
.cajap{
	width="4%"
}
.cajag{
	width="7%"
}



  /******************************+ SOCIOS **********************************/
  
.linea
{
 /* border:2px solid red; */
  width:96%;
  margin:3% auto;
  height:5%;"
}
#socios_datos
{
  width:95%;
  height:85%;
  border:2px solid blue;
  margin:auto;
  background: #DFDDDD;
}
.socios_apelnom{width:50%;float:left;}
#cuotas_linea1{width:96%;margin:3% auto;height: 3%; }
#div_numsocio{width:25%;float:left;}
/********************************** beneficiarios ********************/
  .beneficia_caja
  {
    float:left;
    padding-left: 1%;
  }
  .bloqueado1
  {
    visibility: hidden;
    
    width:98%;
    margin:auto;
    padding-top: 1%;
    height: 30%;
    background:#989191;

   
  }
.beneficia_linea
{
	width:96%;
	margin:1% auto;
	height: 3%; 
	text-align: center;"
}
.beneficia_apelnom{width:50%;float:left;}
#alta_datos{width:100%; height: 45%; margin: 2% auto;}
style=" background: #888585;height:55%;border:1px solid blue;padding-top:2% ;width:98%;"
#contentabla{width:100%; overflow: auto;height: 65%;}
 
#beneficia_observa{width:100%;margin-top: 2%;padding-left: 1%;}
#beneficia_alta_datos{background: #888585;height:55%;border:1px solid blue;padding-top:2% ;width:98%;}
 /*socios gastos comprobacion */
 .fecha{
 	width:20%;
   float:left;
   text-align: center;
   margin-left:10%;
     margin-top:1%;
   }  
   #total_gastos,#total_abonos,#total_retencion
   {
   	text-align:right;
   	margin-right: 3%;
   	color:red;font-size: 14px;
   	 font-weight: bold;
   	}
   	#total_gastos{margin-left:10%;}
/*************************************** USUARIOS *************************/
#usuarios_datos
{
	width:40%;
	height: 50%;
	margin:auto;
	margin-top:2%;
	background: #CBC5C5;
	padding-top: 5%;
		 /*redondeaado de esquinas*/
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
#datos_baja_usuario{width:70%;margin:auto;margin-top:5%;}
#boton_baja_usuario{margin:auto;width:30%;margin-top:10%;}
/**************************** utilidades ******************/
#utilidades_datos
{
	width:85%; 
	margin:auto;
	margin-top:6%;
	background: #B5B1B1;
	padding-top: 2%;
}
/*********************************** impresion ******************/
#imprime_datos
{
	width:80%;
	border:1px solid red;
	height:50%;
	margin:auto;
	margin-top:8%;
}
/**************************** cuotas ***********************/

 .cuotas_caja
 {
  margin: 2%;
  /*clear: both;*/
  width:25%;
  float:left;

 
  text-align: center;
 }
 .cuotas_texto
 {
   width: 40%;
   float:left;
 }
/***************************otros gastos*****************************************/
#otros_gastos_datos{
		/*border:2px solid blue;*/
		height:95%;
		width:80%;
		margin:1% auto;
		 background:#DBDBDB ;
		 /*redondeaado de esquinas*/
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px; 
		
	}
 
.boton_personalizado{
    text-decoration: none;
    padding: 2px;
    font-weight: 600;
    font-size: 14px;
    color: #ffffff;
    background-color: #1883ba;
    border-radius: 6px;
    border: 2px solid #0016b0;
  }
  .boton_personalizado:hover{
    color: #1883ba;
    background-color: #ffffff;
  }
  .boton_enviar{
    text-decoration: none;
    padding: 12px;
    font-weight: 600;
    font-size: 14px;
    color: #ffffff;
    background-color: #1883ba;
    border-radius: 6px;
    border: 2px solid #0016b0;
  }
  
/**************************************************************************** querys *******************************************/
@media screen and (max-width: 768px){

    
    #texto{font-size:2em;width:100%;margin-left:0;text-align:center;}
    #logo {display:none;}
	#login{width:100%;}

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

    
    #texto{font-size:1.5em;width:100%;margin-left:0;text-align:center;  }
    

}