﻿

.Linea
{
    border-bottom-style: dotted; border-width: 1px; 
    border-color: #CCCCCC;
}
    
.Columna
{
    border-bottom-style: dotted; border-width: 1px; 
    border-color: #CCCCCC;
    background-color:#EEEEEE;
}
.Subtitulo
{
     font-weight:bold;
     color:#006699;        
     font-size:.99em;
} 
.SubtituloFormulario
{
    height:20px; 
    border-bottom:Solid 1px #FFFFFF; 
    background-color:#00661B;
    vertical-align:middle;
    text-align:left;
    font-weight:bold;   
    color:#FFFFFF;
    
}
.Boton
{
     background-color: #00992E;    
     color:#FFFFFF;
     font-weight:bold;
     border: 0;
     
}

.BotonLiga a {
		text-align:center;
		background-color: #00992E;
		text-decoration: none;
		color: #FFFFFF;
		vertical-align:middle;
		 
	}
.BotonLiga a:hover {
		text-align:center;
		background-color: #006699;
		text-decoration: none;
		color: #FFFFFF;
		vertical-align:middle;
	}



/****************************************/

/* forms */

fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

    fieldset legend {
        display: none;
    }
    
    fieldset ol {
        padding: 0;
        list-style: none;
    }

        fieldset ol li {
            padding-bottom: 5px;
        }

  
   
    .LabelBusqueda
    {
         font-weight:bold;
         text-align:right;
          float: left;
         width:100%;
         max-width:150px;
         

         padding-top:7px;       
        padding-right: 10px;
       
    }
     .Descripcion {
       
         text-align:left;
           float: left;
        font-size:.8em;
        	
    }

    checkbox {
        display: inline;
    }

    input[type=text],
    input[type=email],
    input[type=url],
    input[type=password],
    input, textarea {
	  width: 96%;
      border-top: 1px solid #ccc;
      border-left: 1px solid #ccc;
      border-right: 1px solid #eee;
      border-bottom: 1px solid #eee;
      background: #fff;
      padding: 8px 5px;	
      max-width:400px;
      
    }
    
    input[type=text]:focus,
    input[type=email]:focus,
    input[type=url]:focus,
    input[type=password]:focus,
    textarea:focus {
      outline: 0;
      border-color: #4697e4;
      
    }

  

    textarea {
        font-family: inherit;
       
        height:150px;
    }
    
        input:focus, textarea:focus {
            border: 1px solid #7ac0da;
        }

        input[type="checkbox"] {
            background: transparent;
            border: inherit;
            width: auto;
        }
        
    input[type="submit"],
    input[type="button"],
    button {
        background-color: #00992E; 
        
        border: 1px solid #787878;
        cursor: pointer;
        font-size: 1.2em;
        font-weight: 600;
        padding: 7px;
        margin-right: 8px;
        width: auto;
    }

    td input[type="submit"],
    td input[type="button"],
    td button {
        font-size: 1em;
        padding: 4px;
        margin-right: 4px;
    }

/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.message-success {
    color: #7ac0da;
    font-size: 1.3em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.error {
    color: #e80c4d;
}
/* styles for validation helpers */
.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}

/***********************/




/* Clearfix */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

/*TEXTO*/


p {
	margin: 0 0 1em;
}
h1, h2, h3 {
	color:#006600;  
}
h1 {
	font: 1.7em;
	line-height: 110%;
    
	
}
h3 {
	font-size: 1.5em;
	line-height: 120%;
	margin: 30px 0 20px;
	padding-top: 20px;
	border-top: double 3px #eee;
}
h4 {
	font-size: 1em;
	line-height: 120%;
	margin: 30px 0 10px;
	text-transform: uppercase;
	color:#006600;
}

figure {
	margin: 0;
}



/* responsive image */
img {
	max-width: 100%;
	height: auto;
	border: 0px;
}
@media \0screen {
  img { 
  	width: auto; /* for ie 8 */
  }
}



/* @group LAYOUT
---------------------------------------------------------------------- */
body {
	margin: 0px; 
    background-image:url('../Imagenes/Fondo.png');

    
}

#encabezadoUASLP {
    width:auto;
    max-width: 790px;
    height:90px;
    max-height:90px;
    background-image:url('../Imagenes/Encabezado_UASLP.png');
    
}
#encabezadoSLPM {
    width:auto;
    max-width: 790px;
    height:90px;
    max-height:90px;
    background-image:url('../Imagenes/Encabezado.png');
    
}

#page {
    width: 790px;
    max-width:96%;
    margin-left:auto;
    margin-right:auto;
    background:#fff;

    font: .8em/100% Arial, Helvetica, sans-serif;
	color: #000;
}


#main-content {
        padding-left: 20px;
       padding-top: 20px;
        padding-right:20px;
        padding-bottom:20px;
    }

#footer {

    font-size: .7em; 
    font-style: normal; 
    color: #003300; 
    text-align:center;
    background-image:url('../Imagenes/Fondo.png');
    padding-top: 10px;
}



/* @group NAVIGATION
---------------------------------------------------------------------- */

/* Basic Styles */

nav {
	height: 50px;
	width: 100%;
	background: #00661B;
	font-size: 1em;
	font-family: 'PT Sans', Arial, sans-serif;
	font-weight: bold;
	position: relative;
}
nav ul {
	padding: 0;
	margin: 0 auto;
	max-width: 790px;
	height: 50px;
}
nav li {
	display: inline;
	float: left;
    
}
nav a {
	color: #fff;
	display: inline-block;
	width: 158px;
   
    
    height:50px;
	text-align: center;
    vertical-align:middle;
	text-decoration: none;
	padding-top:13px;	
}
nav li a {
	/*border-right: 1px solid  #003309 ;*/
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
nav li:last-child a {
	border-right: 0;
}
nav a:hover, nav a:active {
	background-color: #04ADFF;
}
nav a#pull {
	display: none;
}


/*  SECTIONS  ============================================================================= */

.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  GROUPING  ============================================================================= */


.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */

/*  GRID OF FOUR   ============================================================================= */
.span_4_of_4 {
	width: 100%;
}
.span_3_of_4 {
	width: 74.6%;
}
.span_2_of_4 {
	width: 49.2%;
}
.span_1_of_4 {
	width: 23.8%;
}


/*  GRID OF THREE   ============================================================================= */

	
.span_3_of_3 {
	width: 100%; 
}

.span_2_of_3 {
	width: 66.1%; 
}

.span_1_of_3 {
	width: 32.2%; 
}

/*  GRID OF TWO   ============================================================================= */


.span_2_of_2 {
	width: 100%;
}

.span_1_of_2 {
	width: 47%;
}







/*Styles for screen 768px and lower*/
@media screen and (max-width: 900px) {
	nav { 
  		height: auto;
  	}
  	nav ul {
  		width: 100%;
  		display: block;
  		height: auto;
  	}
  	nav li {
  		width: 33.33%;
  		float: left;
  		position: relative;
  	}
  	nav li a {
		border-bottom: 1px solid #003309;
		border-right: 1px solid #003309;
	}
  	nav a {
	  	text-align: left;
	  	width: 100%;
	  	text-indent: 25px;
  	}


    
  
}


/*Styles for screen 600px and lower*/
@media screen and (max-width: 600px) {
	nav { 
  		height: auto;
  	}
  	nav ul {
  		width: 100%;
  		display: block;
  		height: auto;
  	}
  	nav li {
  		width: 50%;
  		float: left;
  		position: relative;
  	}
  	nav li a {
		border-bottom: 1px solid #003309;
		border-right: 1px solid #003309;
	}
  	nav a {
	  	text-align: left;
	  	width: 100%;
	  	text-indent: 25px;
  	}
 #encabezadoUASLP {
        width: auto;
        max-width: 600px;
        height: 83px;
        background-image: url('../Imagenes/Encabezado_UASLP_600.png');
    }
    
    #encabezadoSLPM {
        width: auto;
        max-width: 600px;
        height: 75px;
        background-image: url('../Imagenes/Encabezado_600.png');
    }

    
      input[type=text],
  input[type=email],
  input[type=url],
  input[type=password],
  textarea,
    select
   {
    width: 100%; 
    
  }
  
}



/*Styles for screen 480px and lower*/
@media only screen and (max-width : 480px) {
	nav {
		border-bottom: 0;
	}
	nav ul {
		display: none;
		height: auto;
	}
	nav a#pull {
		display: block;
		background-color: #00661B;
		width: 100%;
		position: relative;
	}
	nav a#pull:after {
		content:"";
		background: url('nav-icon.png') no-repeat;
		width: 30px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 15px;
		top: 10px;
	}

    #encabezadoUASLP {
    width:auto;
    max-width: 480px;
    height:83px;
    background-image:url('../Imagenes/Encabezado_UASLP_480.png');
    
    }
  #encabezadoSLPM {
    width:auto;
    max-width: 480px;
    height:60px;
    background-image:url('../Imagenes/Encabezado_480.png');
    
    }
    
    /*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */
    .col { 
		margin: 1% 0 1% 0%;
	}
	
	/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
	.span_3_of_3 {
		width: 100%; 
	}
	.span_2_of_3 {
		width: 100%; 
	}
	.span_1_of_3 {
		width: 100%;
	}
	
	.span_2_of_2 {
		width: 100%; 
	}
	.span_1_of_2 {
		width: 100%; 
	}
		
    .LabelBusqueda
    {  
          font-weight:bold;
         text-align:left;
          float: left;
         width:100%;
         max-width:150px;
             
         
         padding-top:7px;       
        padding-right: 0px;     
    }
      input[type=text],
  input[type=email],
  input[type=url],
  input[type=password],
  textarea,
    select
   {
    width: 100%; 
    
  }
     
  
}

/*Smartphone*/
@media only screen and (max-width : 320px) {
	nav li {
		display: block;
		float: none;
		width: 100%;
	}
	nav li a {
		border-bottom: 1px solid #003309;
	}

    #encabezadoUASLP {
        width: auto;
        max-width:320px;
        height: 55px;
        background-image: url('../Imagenes/Encabezado_UASLP_320.png');
       
		
		
		
    }
    
    #encabezadoSLPM {
        
		 width: auto;
        max-width: 320px;
        height: 40px;
        background-image: url('../Imagenes/Encabezado_320.png');
     
	
		
  		
    }

     
    .LabelBusqueda
    {  
          font-weight:bold;
         text-align:left;
          float: none;
         width:100%;
             
         
         padding-top:7px;       
        padding-right: 0px;     
    }
      input[type=text],
  input[type=email],
  input[type=url],
  input[type=password],
  textarea,
    select
   {
    width: 100%; 
    
  }
    
}

/* 
	Max width before this PARTICULAR table gets nasty
	This query will take effect for any screen smaller than 760px
	and also iPads specifically.
	*/
	@media 
	only screen and (max-width: 760px),
	(min-device-width: 768px) and (max-device-width: 1024px)  {
	
		/* Force table to not be like tables anymore */
		.Grid table, 
        .Grid thead, 
        .Grid tbody, 
        .Grid th, 
        .Grid td, 
        .Grid tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		.Grid thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		

		.Grid tr { border: 1px solid #ccc; }

	    .EncabezadoTabla {
	        visibility:hidden;
            height:0px;
        }

        
        



		.Grid td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee; 
			position: relative;
			padding-left: 50%; 
		}
		
		.Grid td:before { 
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%; 
			padding-right: 10px; 
			white-space: nowrap;
		}
		
		/*
		Label the data
		*/
		.Grid td:nth-of-type(1):before { content: ""; }
		.Grid td:nth-of-type(2):before { content: "Registro"; }
		.Grid td:nth-of-type(3):before { content: "Familia"; }
		.Grid td:nth-of-type(4):before { content: "Género"; }
		.Grid td:nth-of-type(5):before { content: "Especie"; }
		.Grid td:nth-of-type(6):before { content: "Autores"; }
		.Grid td:nth-of-type(7):before { content: "Estado"; }
		.Grid td:nth-of-type(8):before { content: "Localidad"; }

        .Grid tr {  border:none; }
        .Pie td { 
			/* Behave  like a "row" */
			border: none;
			
			
			
		}
		
		

        .Pie td:nth-of-type(1):before { content: ""; }
		.Pie td:nth-of-type(2):before { content: ""; }
		.Pie td:nth-of-type(3):before { content: ""; }
		.Pie td:nth-of-type(4):before { content: ""; }
		.Pie td:nth-of-type(5):before { content: ""; }
		.Pie td:nth-of-type(6):before { content: ""; }
		.Pie td:nth-of-type(7):before { content: ""; }
		.Pie td:nth-of-type(8):before { content: ""; }
		
	}
	
	/* Smartphones (portrait and landscape) ----------- */



