﻿/* CSS Document : trescalscreen.css used by every page to display on screen */

/* styles are listed in the XHTML order */


body {
	font-family: Arial, Helvetica, sans-serif;
	padding: 0;
	margin: 0;
}

body hr {
	display: none;
}

.right { /* in #text or in #boxside */
	float: right;
	margin-top: 5px;
	margin-bottom: 10px;
	margin-left: 10px;
}

.left { /* in #text or in #boxside */
	float: left;
	margin-top: 5px;
	margin-bottom: 10px;
	margin-right: 10px;
}   

.center { /* in #text or in #boxside, apply this class to the <p> container AND to the element you want to center (<img> for example)*/
	text-align: center;
	margin-left: auto;
    margin-right: auto;
}

h1 { /* title of the main content, must be included in #centercol */
	font-weight: bold;
	font-size: 20px;
	position: relative;
	margin: 5px 0 0 0;
	padding: 3px 5px;
	color: #FFFFFF;
	background-color: #0A5CA6;
}

h2 { /* 1st-level subtitle of the main content, must be included in #text */
	font-size: 18px;
	color: #0A5CA6;
	font-weight: bold;
	padding: 10px 0 0 0;
	margin: 0;
}

h3 { /* 2nd-level subtitle of the main content, must be included in #text */
	font-size: 14px;
	color: #0A5CA6;
	font-weight: bold;
	padding: 10px 0 0 0;
	margin: 0;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #0078B3;
	height: 100%;
}

table { /* must be included in #text or #boxside */
	font-size: 11px;
	width: 100%;
	padding: 3px;
	margin: 8px 0;
	border-collapse:collapse;
	border: 1px solid #CCCCCC;
	height: 164px;
}

td {
	text-align: left;
	vertical-align: top;
	padding: 3px;
	border-collapse:collapse;
	border: 1px solid #CCCCCC;
	width: 100%;
}

/* ----------------------------------------- CONTAINER ------------------------------------------------- */
#container {
	position: relative;
	width: 950px;
	margin: 142px 0 0 10px;
	padding: 0 0 20px 0;
}

/* ----------------------------------------- LEFTCOL ------------------------------------------------- 
------------------------------------------------------------------------------------------------------*/
#leftcol {
	position: relative;
	float: left;
	width: 211px;
	margin: 0 10px 0 0;
	padding: 0 0 15px 0;
}
	
/* ----------------------------------------- LOGO ------------------------------------------------- */
#logo {
	position: relative;
	text-align: center;
	margin: 0;
	padding: 12px 0 0 0;
}

#logo img {
	border: none;
}

/* ----------------------------------------- FLAG ------------------------------------------------- */
#flag {
	position: relative;
	text-align: center;
	margin: 18px 0 0 0;
	padding: 0;
}

/* ----------------------------------------- QUICK ------------------------------------------------- */
#quick {
	position: relative;
	margin: 30px 0 0 0;
	padding: 0;
}

#quick ul {
	margin: 0;
	padding: 0;
	background-image:  url(../images/quicklinks.jpg);
	background-repeat: no-repeat;
}

#quick li {
	list-style-type: none;
	display: block;
	font-size: 11px;
	font-weight: bold;
	margin: 0 0 10px 0;
	vertical-align: middle;
	line-height: 17px;
}

#quick a {
	color: #333333;
	display: block;
	height: 17px;
	text-decoration: none;
	padding: 0 0 0 5px;
}

#quick a:hover {
    background-color: #A3BBE7;
}	

.qlone {
    padding: 0 0 0 40px;
}

.qltwo {
    padding: 0 0 0 42px;
}

.qlthree {
    padding: 0 0 0 39px;
}

.qlfour {
    padding: 0 0 0 34px;
}

.qlfive {
    padding: 0 0 0 27px;
}

/* ----------------------------------------- CENTERCOL -------------------------------------------------
------------------------------------------------------------------------------------------------------*/
#centercol {
	color: #006699;
	position: relative;
	float: left;
	width: 502px;
	margin: 0 10px 0 0;
	padding: 0px 0 25px 0;
	vertical-align: top;
}

/* ----------------------------------------- TEXT ------------------------------------------------- */
.textob {
	font-size: 12px;
	position: relative;
	margin: 10px 0 0 0;
	padding: 5px;
	text-align: justify;
	font-weight: bold;
}

.texto {
	font-size: 12px;
	position: relative;
	margin: 10px 0 0 0;
	padding: 5px;
	text-align: justify;
}

.textoentrada {
	border: thin solid #C0C0C0;
	font-size: 12px;
	margin: 10px 0 0 0;
	padding: 5px;
	text-align: left;
	font-weight: normal;
}

.TablaEntrada {
	border-width: 0px;
	border-style: none;
	width: 100%;
	height: 30px
}
							 

#text {
	font-size: 12px;
	position: relative;
	margin: 10px 0 0 0;
	padding: 5px;
	text-align: justify;
}

#text hr {
	display: block;
}

#text p {
    margin: 6px 0 12px 0;
}

#text ul {
    font-size: 14px;
	margin: 5px 0 10px 10px;
	padding: 0 0 0 10px;
}

#text li {
	margin: 0 0 0 10px;
	padding: 0;
	list-style-image: url(../images/sup.gif);
}

#text a {
	color: #0000FF;
	text-decoration: underline;
}

#text a:hover {
	background-color: #DFF0F8;
	text-decoration: none;
}    

#text a.email {
	color: green;
	text-decoration: underline;
} 

#text a:hover.email {
	text-decoration: none;
	background-color: #FFFFFF;
} 

/* ----------------------------------------- RIGHTCOL ------------------------------------------------- 
------------------------------------------------------------------------------------------------------*/
#rightcol {
	position: relative;
	float: left;
	width: 217px;
	margin: 0;
	padding: 0 0 15px 0;
}

/* ----------------------------------------- BOXSIDE ------------------------------------------------- */
#boxside {
	color: #333333;
	position: relative;
	width: 217px;
	z-index: 2;
	margin: 118px 0 0 0;
	padding: 0;
}

#boxside a {
	color: #0000FF;
	text-decoration: underline;
}

#boxside a:hover {
	background-color: #DFF0F8;
	text-decoration: none;
}    

#boxside a.email {
	color: green;
	text-decoration: underline;
} 

#boxside a:hover.email {
	text-decoration: none;
	background-color: #FFD6D0;
} 

#boxside td {
	border: 1px solid #999999;
}

#boxside table {
	border: 1px solid #999999;
}

#boxside dd {			
    margin: 0;
    padding: 0;
}

#boxside dt {			
    margin: 0;
    padding: 0;
}

#boxside dl {			
	font-size: 11px;
	text-align: left;
    padding: 0 0 25px 0;	
    background: url(../images/boxside_bottom.gif) repeat-y left bottom;
}

#boxside dt { /* boxside title */
	height: 18px;
	font-weight: bold;
	line-height: 17px;
	padding-left: 20px;
	background: url(../images/boxside_top.gif) top left no-repeat;
}

#boxside dd { /* boxside content */
	font-size: 11px;
	padding: 15px 15px 0px 15px;
}

#boxside p {
    margin: 0 0 10px 0;
}

/* ----------------------------------------- FOOTER ------------------------------------------------- */
#footer {
	position: relative;
	width: 950px;
	background-image: url(../images/footer.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;
	clear: both; 
}

#footer p {
	margin: 0;
	padding: 0;
}

#footer .legal {
	color: #FFFFFF;
	padding-top: 3px;
	font-size: 9px;
	text-align: center;
}

#footer .desc {
	color: #999999;
	padding-top: 8px;
	font-size: 9px;
	text-align: justify;
}

#footer a {
	color: #FFFFFF;
	text-decoration: underline;
}

#footer a:hover {
	color: #0000FF;
	background-color: #DFF0F8;
	text-decoration: none;
}

/* ----------------------------------------- BANNER ------------------------------------------------- */
#banner {
	position: absolute;
	height: 141px;
	width: 960px;
	left: 10px;
	top: 0px;
	z-index: 1;
	margin: 0;
	padding: 0;
	text-align: left;
}

#banner img {
	border: none;
}

/* ----------------------------------------- DROPD ------------------------------------------------- */
#dropd ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

#dropd {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

#dropd {
	font-size: 14px;
	font-weight: bold;
	line-height: 15px;
	background-color: #FF3300;
	position: absolute;
	left: 126px;
	top: 60px;
	z-index: 100;
}

#dropd a {
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	width: 154px; /* content width (for all browsers except IE) */
	padding: 3px;
	border-left-width: 2px;
	border-left-style: double;
	border-left-color: #FFFFFF;
}

/***************************** Box Model Hack ************************************/
* html #dropd a   /* this selector recognized by IE only */
{
  width: 162px;   /* total width (only for IE5.x/Win) */
  w\idth: 154px;  /* content width (for other IE) */
}
/*********************************************************************************/

#dropd li.sfhover {
	background-image:  url(../images/dropd_title.jpg);
	background-repeat: no-repeat;
}

#dropd li:hover {
	background-image:  url(../images/dropd_title.jpg);
	background-repeat: no-repeat;
}

#dropd a.father {
	background: url(../images/dropd_arrow.gif) no-repeat right;
}

#dropd li li.sfhover {
	background-image: url(../images/dropd_bar.gif);
	background-repeat: no-repeat;
}

#dropd li li:hover {
	background-image: url(../images/dropd_bar.gif);
	background-repeat: no-repeat;
}

#dropd li { /* all list items */
	float: left;
	width: 160px;
}

#dropd li ul {
	font-size: 11px;
	font-weight: normal;
	line-height: 12px;
	background-color: #FFFFFF;
	border: 2px solid #0A5CA6;
	position: absolute;
	width: 160px;
	left: -999em;
}

#dropd li ul a {
	color: #0A5CA6;
	border-width: 0px;
}

#dropd li ul a:hover {
	color: #FF3300;
	background-color: #CEDEED;
}

#dropd li ul ul {
	margin: -16px 0 0 156px;
}

#dropd li.sfhover ul ul {
	left: -999em;
}

#dropd li:hover ul ul {
	left: -999em;
}

#dropd li li.sfhover ul {
	left: auto;
}



#dropd li.sfhover ul {
	left: auto;
}



#dropd li li:hover ul {
	left: auto;
}



#dropd li:hover ul {
	left: auto;
}



/***************************************************************************************************
                             Here are the styles only used by the homepage
****************************************************************************************************/

/* ----------------------------------------- LINKCOM ------------------------------------------------- */
#linkcom {
	font-size: 13px;
    position: relative;
	margin: 30px 0 0 0;
	text-align: center;
}

#linkcom a {
	color: #0000FF;
	font-weight: bold;
	text-decoration: underline;    
}

#linkcom a:hover {
	background-color: #DFF0F8;
	text-decoration: none;
}    

/* ----------------------------------------- INTRO ------------------------------------------------- */
#intro {
	font-size: 12px;
	font-weight: bold;
	color: #333333;
	position: relative;
	width: 490px;
	margin: 0;
	padding: 0;
}

/* ----------------------------------------- PIC ------------------------------------------------- */
#pic {
	position: relative;
	width: 490px;
    margin: 10px 0 0 0;
}

/* ----------------------------------------- BXHM1 ------------------------------------------------- */
#bxhm1 {
    position: relative;
	float: left;
    margin: 15px 0 0 0;
}

#bxhm1 dl { /* small-width box */
    width: 168px;		
}

#bxhm1 dt {
	background:  url(../images/boxhome_top_s.gif) top left no-repeat;
}

#bxhm1 dd {
	background:  url(../images/boxhome_middle_s.gif) top left;
}

#bxhm1 dl {
	background:  url(../images/boxhome_bottom_s.gif) bottom left no-repeat;
}

/* ----------------------------------------- BXHM2 ------------------------------------------------- */
#bxhm2 {
    position: relative;
    margin: 15px 0 0 201px;
}

#bxhm2 dl { /* large-width box */
    width: 284px;		
}

#bxhm2 dt {
	background:  url(../images/boxhome_top_l.gif) top left no-repeat;
}

#bxhm2 dd {
	background:  url(../images/boxhome_middle_l.gif) top left;
}

#bxhm2 dl {
	background:  url(../images/boxhome_bottom_l.gif) bottom left no-repeat;
}

/* ----------------------------------------- BXHM3 ------------------------------------------------- */
#bxhm3 {
    position: relative;
    margin: 78px 0 0 0;
}

#bxhm3 dl { /* medium-width box */
    width: 213px;		
}

#bxhm3 dt {
	background:  url(../images/boxhome_top_m.gif) top left no-repeat;
}

#bxhm3 dd {
	background:  url(../images/boxhome_middle_m.gif) top left;
}

#bxhm3 dl {
	background:  url(../images/boxhome_bottom_m.gif) bottom left no-repeat;
}

/* ----------------------------------------- BXHM2 ------------------------------------------------- */
#bxhm4 {
    position: relative;
    margin: 15px 0 0 0;
}

#bxhm4 dl { /* medium-width box */
    width: 213px;		
}

#bxhm4 dt {
	background:  url(../images/boxhome_top_m.gif) top left no-repeat;
}

#bxhm4 dd {
	background:  url(../images/boxhome_middle_m.gif) top left;
}

#bxhm4 dl {
	background:  url(../images/boxhome_bottom_m.gif) bottom left no-repeat;
}

/* ----------------------------------------- BOXHOME ------------------------------------------------- */

dd.boxhome {			
    margin: 0px;
}

dt.boxhome {			
    margin: 0px;
}

dl.boxhome {	
	color: #006699;
	font-size: 11px;
	text-align: left;
    padding: 0 0 20px 0;
	margin: 0;	
}

dt.boxhome { /* boxhome title */
	height: 28px;
	color: #FFFFFF;
	font-weight: bold;
	padding: 0 0 0 17px;
	line-height: 26px;
}

dd.boxhome { /* boxhome content */
	padding: 5px 15px 0 15px;
}

p.boxhome {
    margin: 0px;
}

a.boxhome {
	color: #0000FF;
	text-decoration: underline;
}

underline;
}

a:hover.boxhome {
	background-color: #DFF0F8;
	text-de

