/* CONTENT */
html
{
	height:100%;
	width:100%;
	outline: medium none;
}

body
{	
	margin: 40px auto;
	font-family: 'Swiss721BT-LightCondensed',Arial, tahoma, helvetica ,sans-serif;
	font-size:14px;
	line-height:20px;
	/*background-color:#00b8f0;*/
	background: linear-gradient(135deg, rgba(0,123,196,1) 0%, rgba(223,213,255,1) 100%);
	height:100%;
	width:75%;
	color: #444;
	/*overflow-y:hidden;*/
	background-repeat: no-repeat;
        background-attachment: fixed;
}



a.menu 
{	
	margin:4px;
	padding:10px;
	font-family: Arial, tahoma, helvetica ,sans-serif;
	font-size:14px;
	font-color:#ffffff;
	line-height:40px;
	color:#FFFFFF;
	height:100;
        position:relative; 
}
a.menu:link {
       font-family: Arial, tahoma, helvetica ,sans-serif;
       font-size:14px;
       font-color:#ffffff;
       color: #ffffff;
       text-decoration: none;
}



h1,h2,h3,h4,.BlueBox
{
	font-family: 'Swiss721BT-LightCondensed','Arial';
	font-weight: normal; 
	font-style: normal;
        /*COLOR: #007da4;*/
        COLOR: #007bc4;
}
ul{
    border-radius: 3px 3px 3px 3px;
    list-style: disc outside none;
    padding:10px;
}
li {
   padding:10px;  
}
TR.odd {background-color:#eeeeee}
TR.even {background-color:#dddddd}

TD {
	font-size: 14px; 
	color: #666666; 
	font-family: "Trebuchet MS", Tahoma, Verdana;
}

a:link {
	/*COLOR: #007da4;*/
	COLOR: #007bc4;
	text-decoration: none;
}

a:visited {
	COLOR:  #007da4;
}

a:hover {
	COLOR: #999999
	text-decoration: underline;
}

a:active {
	COLOR: #000000
}

.content {
	font-family: "Trebuchet MS", Tahoma, Verdana;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333333;
}

P.expl {
  font-size:10px;

}

UL {
	font-size: 14px; 
	list-style-type: circle;
	padding-left: 1px; 
	color: #333333;
	line-height: normal; 
	font-family: "Trebuchet MS", Tahoma, Verdana;
}
 
OL {
	font-size: 14px; 
	list-style-type: number;
	color: #333333;
	line-height: normal; 
	font-family: "Trebuchet MS", Tahoma, Verdana;
}

LI {
	font-size: 14px; 
	margin: 6px 0px 0px; 
	padding-right: 8px; 
	color: #333333;
	line-height: normal; 
	font-family: "Trebuchet MS", Tahoma, Verdana;
}


.header1 {

	font-family: "Trebuchet MS", Tahoma, Verdana;
	font-size: 20px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #FF6600;
}

 
.header2 {
	FONT-SIZE: 16px;
	COLOR: #FF6600;
	FONT-FAMILY: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-weight: bold;

}

.header3 {

	FONT-SIZE: 14px;
	COLOR: #FF6600;
	FONT-FAMILY: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-weight: bold;
}




.bordered {
  font-size: 12px;
    border: solid #ccc 1px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 1px 1px #ccc; 
    -moz-box-shadow: 0 1px 1px #ccc; 
    box-shadow: 0 1px 1px #ccc;         
}
 

.bordered tr:hover {
    font-size: 12px;
    background: #fbf8e9;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;     
}    
    
.bordered td, .bordered th {
    font-size: 12px;
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 5px;
    text-align: left;    
}

.bordered th {
    font-size: 12px;
    background-color: #dce9f9;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
    background-image: -webkit-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:    -moz-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:     -ms-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:      -o-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:         linear-gradient(top, #ebf3fc, #dce9f9);
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset; 
    -moz-box-shadow:0 1px 0 rgba(255,255,255,.8) inset;  
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;        
    border-top: none;
    text-shadow: 0 1px 0 rgba(255,255,255,.5); 
}


input[type="button"],  input[type="submit"], input[type="reset"], button {
	-moz-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	box-shadow:inset 0px 1px 0px 0px #bee2f9;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #63b8ee), color-stop(1, #468ccf) );
	background:-moz-linear-gradient( center top, #63b8ee 5%, #468ccf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#63b8ee', endColorstr='#468ccf');
	background-color:#63b8ee;
	-webkit-border-top-left-radius:2px;
	-moz-border-radius-topleft:2px;
	border-top-left-radius:2px;
	-webkit-border-top-right-radius:2px;
	-moz-border-radius-topright:2px;
	border-top-right-radius:2px;
	-webkit-border-bottom-right-radius:2px;
	-moz-border-radius-bottomright:2px;
	border-bottom-right-radius:2px;
	-webkit-border-bottom-left-radius:2px;
	-moz-border-radius-bottomleft:2px;
	border-bottom-left-radius:2px;
	text-indent:0;
	border:1px solid #3866a3;
	display:inline-block;
	color:#14396a;
	font-family:Verdana;
	font-size:12px;
	font-weight:bold;
	font-style:normal;
	height:30px;
	line-height:30px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #7cacde;
}
buttom:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #468ccf), color-stop(1, #63b8ee) );
	background:-moz-linear-gradient( center top, #468ccf 5%, #63b8ee 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#468ccf', endColorstr='#63b8ee');
	background-color:#468ccf;
}.buttom:active {
	position:relative;
	top:1px;
}
  /* el menú en si mismo */
  .mi-menu  {
    border-radius: 5px;
    list-style-type: none;
    margin: 0 ; /* si queremos centrarlo */
    padding: 0;
    /* la altura y su ancho dependerán de los textos */
    height: 40px; 
    width: 600px;
    /* el color de fondo */
    background: #000099;
  }

  /* si es necesario, evitamos que Blogger de problemas con los saltos de línea cuando escribimos el HTML */
  .mi-menu  br { display:none; }

  /* cada item del menu */
  .mi-menu  li {
    display: block;
    float: left; /* la lista se ve horizontal */
    height: 40px;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
  }
  .mi-menu li a {
    border-left: 0px solid #000;
    border-right: 0px solid #666;
    color: #EEE;
    display: block;
    font-family: Tahoma;
    font-size: 13px;
    font-weight: bold;
    line-height: 28px;
    padding: 0 14px;
    margin: 6px 0;
    text-decoration: none;
    /* animamos el cambio de color de los textos */
    -webkit-transition: color .2s ease-in-out;
    -moz-transition: color .2s ease-in-out;
    -o-transition: color .2s ease-in-out;
    -ms-transition: color .2s ease-in-out;
    transition: color .2s ease-in-out;
  }
  /* eliminamos los bordes del primer y el último */
  .mi-menu li:first-child a { border-left: none; }
  .mi-menu li:last-child a{ border-right: none; }
  /* efecto hover cambia el color */
  .mi-menu li:hover > a { color: Crimson; }

  /* los submenús */
  .mi-menu ul {
    border-radius: 0 0 5px 5px;
    left: 0;
    margin: 0;
    opacity: 0; /* no son visibles */
    position: absolute;
    top: 40px; /* se ubican debajo del enlace principal */
    /* el color de fondo */
    background: #000099;
    /* animamos su visibildiad */
    -moz-transition: opacity .25s ease .1s;
    -webkit-transition: opacity .25s ease .1s;
    -o-transition: opacity .25s ease .1s;
    -ms-transition: opacity .25s ease .1s;
    transition: opacity .25s ease .1s;
  }
  /* son visibes al poner el cursor encima */
  .mi-menu li:hover > ul { opacity: 1; }

   /* cada un ode los items de los submenús */
  .mi-menu ul li {
    height: 0; /* no son visibles */
    overflow: hidden;
    padding: 0;
    /* animamos su visibildiad */
    -moz-transition: height .25s ease .1s;
    -webkit-transition: height .25s ease .1s;
    -o-transition: height .25s ease .1s;
    -ms-transition: height .25s ease .1s;
    transition: height .25s ease .1s;
  }
  .mi-menu li:hover > ul li {
    height: 36px; /* los mostramos */
    overflow: visible;
    padding: 0;
  }
  .mi-menu ul li a {
    border: none;
    border-bottom: 1px solid #111;
    margin: 0;
    /* el ancho dependerá de los textos a utilizar */
    padding: 5px 20px;
    width: 100px;
  }
  /* el último n otiene un borde */
  .mi-menu ul li:last-child a { border: none; }