/* BODY */
html { height: 100%; }
body{
	height: 100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #003366;
	text-align:center;
	padding: 0px;
	margin: 0px;
}
* html { overflow: hidden; }  /* Con hack para IE incluido */
* html body { overflow: auto; }  /* Con hack para IE incluido */
/* NAVIGATION  */
#tab_language {	font-family:Arial, Helvetica, sans-serif;	font-size: 14px;	width:770px;	background: #f4f7fb;	margin-right:auto;	margin-left:auto;	border-top: 1px solid #e1e1f0;	border-right: 1px solid #e1e1f0;	border-left: 1px solid #e1e1f0;}
#tab_language ul               { list-style:none; margin:0; margin-left:20px; padding:0;}
#tab_language li               { border-left:1px dotted black; float:left; margin:0px; padding:1px 4px; list-style:none;}
#tab_language li.first         { border-left:1px solid white; }
#tab_language a                { display:block; text-decoration:none; padding: 2px 4px;	color: #003366;}
#tab_language a:hover          { background-color:#e1e7f0; text-decoration:underline; }
#tab_language a.selected       { font-weight: bold; }
.clear                {	clear: both;}

/* BANNER */
#banner                  {	font-family:Arial, Helvetica, sans-serif;	font-size: 14px;	width:770px;	background: #f4f7fb;	margin-right:auto;	margin-left:auto;	border-top: 1px solid #e1e1f0;	border-right: 1px solid #e1e1f0;	border-left: 1px solid #e1e1f0;	border-bottom: 1px solid #e1e1f0;}

/* SIGN UP/IN */
#sign                  { font-family:Arial, Helvetica, sans-serif; font-size: 14px; float:right;}
#sign ul               { list-style:none; margin:0px; padding:0px;}
#sign li               { border-left:1px dotted black; float:left; margin:0px; padding:1px 3px; list-style:none;}
#banner img				{padding: 2px 5px;}
#sign li.first         { border-left:1px solid white; }
#sign a                { display:block;	text-decoration:none; padding: 2px 4px; color: #003366; }
#sign a:hover          { text-decoration: underline; }
#sign_form             { visibility:hidden; }

#banner span           { margin: 0px; padding: 0px; float: left; width: 400px; text-align:left; }

/* TABMENU */
#tab_menu                  {	font-family:Arial, Helvetica, sans-serif;	font-size: 14px;	width:770px;	background: #f4f7fb;	margin-right:auto;	margin-left:auto;	border-bottom: 1px solid #e1e1f0;	border-right: 1px solid #e1e1f0;	border-left: 1px solid #e1e1f0;}
#tab_menu ul               { list-style:none; margin:0; margin-left:20px; padding:0;}
#tab_menu li               { float:left; margin:0px; padding:2px 0px 0px; list-style:none;}
#tab_menu li.first         { }
#tab_menu a                { display:block; text-decoration:none; padding: 2px 8px;	color: #003366;}
#tab_menu a:hover          { background-color:#e1e7f0; }
#tab_menu a.selected       { background-color:#A7A5D3; }

/* CONTENT*/
#content {	height: 100%; min-height: 100%; font-family:Arial, Helvetica, sans-serif;	font-size: 14px;	width:770px;	margin-right:auto;	margin-left:auto; padding-bottom: 30px;}
* html #content { heiht: 100%; }   /* Con hack para IE incluido */
#content .title {	font-weight: bold;	background: #e1e7f0;	text-align: left;	padding: 1px 4px;	border-bottom: 1px solid #e1e7f0;}
#content .left { float: left; width:150px; }
#content .right { float: right; width:600px;}
#content .error {	width: 768px;	margin: 5px 0px;	border: 1px solid #FF0000;	text-align:center;}
#content .error .title {	font-weight: bold;	background: #FFD9D9;	text-align: left;	padding: 1px 4px;	border-bottom: 1px solid #FF0000;}
#content .exercise {	width: 768px;	margin: 5px 0px 40px;	border: 1px solid #e1e1f0;}
#content .exercise .title {	font-weight: bold;	background: #e1e7f0;	text-align: left;	padding: 1px 4px;	border-bottom: 1px solid #e1e7f0;}
#content .exercise .content .resources {	float: left; width: 100px; padding: 15px 5px;}
#content #button_download_pdf, #content  #button_download_mp3 {	font-weight: bold;		font-size: 14px;	border: 1px solid #003366;	color: #003366;	background: #e1e7f0;		width: 218px;	text-decoration: none;	margin: 0px;	padding: 0px;	display: block;}
#content #button_download_pdf:hover, #content #button_download_mp3:hover {	color: #709df1;	background: #ffffff;		}
#content .exercise .content .description {	float: right; width: 520px;  padding: 15px 5px; text-align: left;}
#content .exercise .content .description h1 {	font-size: 14px; 	font-weight: bold;}
#content .exercise .content .description p {	padding: 0px 0px 5px; margin: 0px;	font-size: 14px;	}
#content .exercise .content .description .texts {	height: 100%;}
#content .exercise .content .description .buttons {	padding: 5px;}
#content .exercise .content .description .calification {	display: block;	margin: 2px;	padding: 5px;	border: 1px solid #e1e1f0;	background: #F4f7fb;	}
#content .exercise .content .description .exercise_input {	background: #FFFFCC;	border: 1px solid #FFFFCC;	margin: 0px;	padding: 0px;}
#content .exercise .content .description .exercise_input_wrong {	background: #FFD9D9;	border: 1px solid #FF0000;	margin: 0px;	padding: 0px;}
#content .exercise .content .description .exercise_input_right {	background: #b3FFb3;	border: 1px solid #00FF00;	margin: 0px;	padding: 0px;}
#content .exercise .content .classroom { float: left; width: 100px; border: 1px solid #e1e1f0; margin: 5px;}
#content .exercise .content .classroom h1 { font-size: 12px; font-weight: bold; margin: 0px; padding: 0px;}


#content .exercise_middle { width: 768px;	margin: 5px 0px;	border: 1px solid #e1e1f0; text-align:center;}
#content .exercise_middle .exercise_pic { width: 115px; float: left; padding: 6px;}
#content .exercise_middle .exercise_pic img { width:115px; height:190px; border: 0px;}

#content .exercise_middle .title {	font-weight: bold;	background: #e1e7f0;	text-align: left;	padding: 1px 4px;	border-bottom: 1px solid #e1e7f0; }
#content .exercise_middle .content .resources {	float: left; width: 100px; padding: 5px; }
#content .exercise_middle .content .resources img{	border: 0px;}
#content .exercise_middle .content .description { float: right; width: 640px; padding: 5px; text-align: left; }
#content .exercise_middle .content .description h1 { text-align:left; font-size: 14px; font-weight: bold;}
#content .exercise_middle .content .description p { text-align:left;	padding: 0px 0px 5px; margin: 0px;}

#content .exercise_small {	float: left;	width: 370px;	height: 180px;	margin: 5px 5px;	border: 1px solid #e1e1f0;}
#content .exercise_small .title {	font-weight: bold;	background: #e1e7f0;	text-align: left;	padding: 1px 4px;	border-bottom: 1px solid #e1e7f0;}
#content .exercise_small .content .resources {	float: left; width: 100px; padding: 5px;}
#content .exercise_small .content .resources img{	width:90px; height:150px; border: 0px;}
#content .exercise_small .content .description {	float: right; width: 240px; padding: 5px; text-align: left; }
#content .exercise_small .content .description h1 { 	font-size: 14px; 	font-weight: bold; }
#content .exercise_small .content .description p { 	padding: 0px 0px 5px; margin: 0px;}

#content .listexercises { 	font-weight: bold;	background: #e1e7f0;	text-align: left;	padding: 1px 4px;	border-bottom: 1px solid #e1e7f0;}

/* FOOTER */
#footer                  {
	position: fixed;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 25px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align:center;
	padding: 0px;
	margin: 0px;
}
* html #footer { position: absolute; }   /* Con hack para IE incluido */
#footer span{
	display:block;
	width: 770px;
	height: 20px;	
	margin-right:auto;
	margin-left:auto;
	padding-top: 5px;
	background: #f4f7fb;	
}
/* BOTONERA */
#buttons		{
	position: fixed;
	bottom: 30px;
	left: 0px;
	width: 100%;
	height: 35px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align:center;
	margin-top: 10px;
}
* html #buttons { position: absolute; }   /* Con hack para IE incluido */
#buttons span{
	display:block;
	width: 770px;
	height: 33px;	
	margin-right: auto;
	margin-left: auto;
	padding-top: 5px;
	background: #f4f7fb;	
	border: 1px solid #e1e1f0;		
}
#buttons #button_correct, #buttons #button_hint {
	font-weight: bold;	
	font-size: 14px;
	border: 1px solid #003366;
	color: #003366;
	background: #e1e7f0;	
	width: 50px;
	text-decoration: none;
	margin-top:0px;
	margin-left: 5px;
	padding-top: 0px;
	padding-left: 5px;
	padding-right: 5px;
}
#buttons #button_correct:hover, #buttons #button_hint:hover {
	color: #709df1;
	background: #ffffff;		
}


#buttons embed {
	padding-right:20px;
}


/* AYUDA */
span.left{
	float:left;
}
span.right{
	float:right;
}

form { font-family:Arial, Helvetica, sans-serif; padding: 5px;}
form div { clear:left; display:block; margin: 5px 0 0 0; padding: 1px 3px;}
form div label{ display:block; float:left; width:140px; padding: 3px 5px; text-align:right}
form div input{ float:left; width: 250px; padding: 1px 3px; margin: 0px;}
form div select{ float:left; width: 250px; padding: 1px 3px; margin: 0px;}
form div textarea{ float:left; width: 350px; padding: 1px 3px; margin: 0px;}
form div input.button { width: 60px;}
form img.designer { 	z-index: 1;	overflow:visible; max-width: 200px; float:right;	position: inherit;	left: -5px; top: 5px; border: 1px solid #666633;}
form img.normal { 	z-index: 1;	overflow:visible; width: 200px; float:right;	position: inherit;	left: -5px; top: 5px; border: 1px solid #666633;}
form img.small { z-index: 2; overflow:visible;	width: 100px; float:right;	position: inherit;	left: -5px; top: 220px; border: 1px solid #666633;}

/** TABLAS **/
table{
	border-spacing:1px;
	background:#F4F7FB;
	color:#003366;
	border: thin solid #003366;
}
caption{
	border:#666666;
	border-bottom:2px solid #666666;
	text-transform:uppercase;
	padding:10px;
	font-style:italic;
	font-weight:bold;
}
td, th{
	padding:1px;
}
thead {
	text-align:center;
	background:#e1e7f0;
	color:#003366;
	border:1px solid #ffffff;
	text-transform:uppercase;
}
tbody th{font-weight:bold;}
tbody tr{background:#EBF8FE;text-align:left;}
tbody tr.odd{background:#ffffff;border-top:1px solid #ffffff;}
tbody th a:link, tbody th a:visited{
	color:#666666;
	padding:1px 0px 0px 18px;
}
tbody th a:hover{color:#009900;}
tbody tr td{height:10px;background:#F4F7FB;border:1px solid #ffffff;}
tbody tr.impar td{background:#ffffff;border-top:1px solid #ffffff;}
tbody tr:hover td, tbody tr.impar:hover td {background-color: #CAFEC5;}
table td a:link, table td a:visited{color:#666666;text-decoration:none;font-weight: bold;}
table td a:hover{color:#009900;text-decoration:underline;font-weight: bold;}
tfoot th, tfoot td{padding:10px;text-align:center;font-style:italic;font-weight:bold;border-bottom:3px solid #cccccc;border-top:1px solid #DFDFDF;}
.table_pager{
	text-align: center;
	color: #003366;
}
.table_pager a{ color:#666666;text-decoration:none; }