/* **** UTF8:áéíóú **** */

/**
 * THIS FILE HAS THE FOLLOWING SECTIONS:
 * 1. LINK TO STYLESHEET FOR EXERCISE TABS LOOK
 * 2. STYLES USED BY LOADER AND JS COMPONENTS
 * 3. STYLES DEFINING THE BASIC COURSE LOOK
 * 4. SECTION ICON STYLES
 * 5. UTILITY STYLES FOR SPECIFIC USEFUL ITEMS
 */

/**
 * 1. LINK TO STYLESHEET FOR EXERCISE TABS LOOK
 */
@import url(exercise-tabs-base-legacy.css);


/**
 * 2. STYLES USED BY LOADER AND JS COMPONENTS
 */

.interactive-element {
	-ms-touch-action: none; /* necesario para pc windows con pantalla táctil (evita que haga scroll y deja arrastrar el elemento) */
	touch-action: none;
}

.loader-theme .feedback-slider.popin {
	text-align: left;
	height: auto;
	margin-bottom: 5px;
}

.loader-theme .feedback-slider.popin .feedback-text {
	margin-left: 10px;
    margin-right: 10px;
}

html {
	overflow-y: scroll;
}

footer.playerFooter {
	position:fixed;
	bottom:0;
	left:0;
	right:0;
    background-color: #ccc;
    padding: 0;
    z-index:1001;
}

div[loaderapptype="exercise"] {
	margin-top: 20px;
	margin-bottom: 10px;
}

div.popinWindowContent div[loaderapptype="exercise"] {
	margin-top: 0;
}

.me-plugin {
	position:absolute;
}

input.normalBtn {
	background-image: url(images/common_exercise_assets/normalBtnBg.png);
	height: 23px;
	border: 0px;
	font-family: Arial;
	font-size: 13px;
	width: 140px;
}

input.normalBtn.enabled {
	cursor:pointer;
}

input.normalBtn.disabled {
	color:#666;
}

input.normalBtn.enabled:hover {
	background-image: url(images/common_exercise_assets/normalBtnBg2.png);
}

div.mailButton {
	float:left;
	padding-top:8px !important;
}

div.mailButton span.newMail {
	background:url(images/player/email_icon_new_mail.gif) no-repeat left center;
	padding-left: 23px;
	font-size:10px;
	height:16px;
	top:-1px;
	position:relative;
	display:inline-block;
	*display:inline;
	height:13px;
}

span.AudioButtonJS, span.VideoPlayerJS {
	display:inline-block;
	zoom:1;
	*display:inline;
}
span.VideoPlayerJS {
	background:#eee url(images/video_icon.png) no-repeat center center;
	margin-bottom: 25px;
}

div.PopinAnswers { display:none; }

div.PopinDiv { display:none; }

div.popinScroll {
	overflow:auto;
	height:250px;
	padding-right:10px;
}

div.PageContent div.Feedback {
    background-color: #FFFFFF;
    left: -30px;
    padding-left: 40px;
    position: relative;
}
div.PageContent div.exercises.rounded div.Feedback {
	background-image: url(images/exercise-tabs/tira4.gif);
	background-repeat:no-repeat;
	padding-top:20px;
}

div.AudioPlayerJS {
	display:inline-block;
	height:30px;
}

div.SlideinPage {
	margin-bottom:10px;
}

div.SlideinPage-inner {
	border:1px solid #999;
	height: 100%;
}
div.SlideinDiv-inner {
	border:1px solid #999;
	padding:10px;
	background:#eee;
}

div.SlideinTeachers-inner {
	border:1px solid #999;
	padding:10px;
	background:#ccd;
	color:#000000;
	width: 500px;
	min-height:60px;
	margin-bottom:10px;
}

div.SlideinTeachers-inner a {
	color:#000000;
}

.PopinRadioButton{
	color:#995500;
	cursor:pointer;
	border-bottom:1px inset #995500;
	z-index:9999;
}

div.Matching {
	padding-top:15px;
}
div.SentenceOrder {
	margin-top:25px;
}

div#body-content {
	padding-left:30px;
	padding-top:30px;
}

div#body-content[inline-player="true"] {
	padding-left:0px;
	padding-top:0px;
}

div#page-body-content {
	margin-left: 30px;
	margin-top: 30px;
}

div#SampleDescription {
	display:none;
}

/************************************************************************
* Estilos para el menu de text, grammar y wordlist, etc
************************************************************************/
#popup-control-panel{
	position: absolute;
	top: 10px;
	right: 10px;
	padding: 5px 0px;
	border: solid 1px #ccc;
	background-color: #eee;
	color: #666;
}

#popup-control-panel a {
	padding: 5px;
	font-size: 9px;
	text-decoration: none;
	color: #666;
}

#popup-control-panel a:hover {
	color: #666;
	background: #fc3;
}

.wordlistTitle {
	font-weight:bold;
}
.videoLink {
	color:#FFFFFF;
	background-color:#BBB;
	text-decoration:none;
	margin-bottom:5px;
	margin-top:-3px;
	margin-bottom:5px;
	padding:6px 3px 6px 3px;
}

/************************************************************************
* ToolTip (utilizados por el componente Tooltip.js del Loader) */
.tooltip {
	position:absolute;
	display:inline-block;
	z-index:1001;
	overflow:hidden;
	border-radius: 4px;
}
/*.tooltip-top {display:block; height:5px; overflow:hidden}*/
.tooltip-content {
	display:inline-block;
	background:#206593;
	color:#FFF;
	padding:2px 12px 3px 7px;
	position:relative;
}
/*.tooltip-bot {display:block; height:5px; overflow:hidden;}*/
/* estilos de tipo para el Tooltip */
.tooltip .correctAnswer {
	/*background-color: #2976C2;*/
}
/************************************************************************/

/* para la columna de la numeración (por ejemplo, en los Dropdowns XML) */
td.tableList {
	width:25px;
	text-align:right;
	vertical-align:top;
}
ol.paddingList li{
	padding:2px;
}

/***********************************************************************
 * TASK BOX STYLES
 */
div.TaskBorder {
	XXborder:1px solid #ddd;
	border:1px solid #aaa;
}
div.TaskBorder div.TaskHeader {
	XXbackground-color:#ddd; /* Updated to new blue look - Ciaran  */
	XXpadding:5px 10px;
	XXfont-weight:bold;
	background-color:#3399CC;
	padding:15px 10px;
	color: #FFFFFF;
	font-size:26px;
	
}
.forum {
	background: url(../images/icons/forum.png) no-repeat;
	font-weight: 200;
	padding-left:55px;
}
.written-tutorial {
	background: url(../images/icons/written-tutorial.png) no-repeat;
	font-weight: 200;
	padding-left:65px;
}
.speaking-tutorial {
	background: url(../images/icons/speaking-tutorial.png) no-repeat;
	font-weight: 200;
	padding-left:60px;
}
.net-search {
	background: url(../images/icons/net-search.png) no-repeat;
	font-weight: 200;
	padding-left:55px;
}
.language-review {
	font-weight: 200;
	font-size:22px;
}
div.TaskBorder div.TaskPadding {
	padding:10px;
}

div.TaskBorder-Tutored {
	XXborder:1px solid #fc0; /* Updated to new blue look - Ciaran  */
	border:1px solid #aaa;
}
div.TaskBorder-Tutored div.TaskHeader {
	XXbackground-color:#fc0; /* Updated to new blue look - Ciaran  */
	XXpadding:5px 10px;
	XXfont-weight:bold;
	background-color:#3399CC;
	padding:15px 10px;
	color: #FFFFFF;
	font-size:26px;
}
div.TaskBorder-Tutored div.TaskPadding {
	padding:10px;
}

div.TaskBorder-Untutored {
	border:1px solid #ddd;
}
div.TaskBorder-Untutored div.TaskHeader {
	background-color:#ddd;
	padding:5px 10px;
	font-weight:bold;
}
div.TaskBorder-Untutored div.TaskPadding {
	padding:10px;
}

span.task-tag {
	XXbackground:#fc0; /* Updated to new blue look - Ciaran  */
	XXborder:1px solid #999;
	background:#3399CC;
	color:#FFFFFF;
	font-size:11px;
	padding-left:2px;
	padding-right:2px;
	white-space:nowrap;
}

.grammar {
	border: 1px solid #ccc;
	padding: 10px 20px;
	xbackground: #eee;
	background: #F9F9F9; /* Added for experimentation along with themed border - Ciaran (26/05/16)*/
	margin-bottom: 10px;
	padding-bottom: 10px;
}

.gray {
	color:#666;
	text-decoration: none;
}


/**
 * 3. STYLES DEFINING THE BASIC COURSE LOOK
 */

/**
 * Standard tag definitions
 */
html body, html table {
	font-family: 'Open Sans',Arial, Helvetica, sans-serif;
}
body, table {
	font-size: 13px;
}
table { text-align: left; }
applet { outline:none; }
i { font-style: italic; }
b { font-weight: bold; }

h1 {
	color: #999;
	font-size: 20px;
	padding: 0px;
	margin: 0px;
	margin-bottom: 0px;
}
div.PageContent h2 {
	font-size: 20px;
}

span.Parts{
	color: #999;
	font-size: 16px;
	font-weight: bold;
}

div.PageHeader {
	padding: 0px;
	padding-bottom: 0px;
	margin-bottom:20px;
}
div.PageHeader div.PageTitle {
	height:28px;
	font-size: 16px;
	color: #999;
	font-weight: bold;
}
div.PageHeader div.PageDescriptor {
	margin:0;
	padding:0;
	color:#999;
}
/*********************************************************
 ** Utilizar los estilos del PageHeader en vez de éstos **
 *********************************************************/
h1.style06 {
	padding: 0px 0px 0px 42px;
	line-height: 33px;
	font-size: 16px;
}
div.style06 {
	padding: 0px;
	padding-bottom: 0px;
	margin-bottom:20px;
}
div.style06 div.PageDescriptor {
	margin:0;
	padding:0 0 0 42px;
	color:#999;
}
/*********************************************************/

body.word-list {
	color:#ddd;
	background:#666;
	margin: 10px;
}
body.teachers {
	color:#000;
	background:#CCD;
	margin:10px 10px 10px 10px;
}
body.tape {
	background:#ccd url(../images/popups/listening.gif) no-repeat 10px 10px;
	color:#000;
	margin:10px 10px 10px 50px;
}
body.tape h1 {
    font-size: 15pt;
	font-weight:bold;
	color:#666;
}
body.text {
	background: #B1D2F0 url("../images/sections33/text.png") no-repeat scroll 10px 5px;
	color:#000;
	margin:0px;
	margin:10px 10px 10px 50px;
}
body.text h1 {
    font-size: 15pt;
	font-weight:bold;
	color:#666;
}

/* Hide the reading and transcript headings */
#reading-for { display:none }
#transcript-for { display:none }

/**
 * 4. SECTION ICON STYLES
 */
/* common items */

h1.section01, h1.section02, h1.section03, h1.section04, h1.section05,
h1.section06, h1.section07, h1.section08, h1.section09, h1.section10,
h1.section11, h1.section12, h1.section13, h1.section14, h1.section15, h1.section16, h1.section17,
h1.section-exam {
	background-repeat: no-repeat;
	margin: 0px 0px 0px 0px;
/*	font-weight: bold;    ---Ciaran: just testing a no bold look for the new player 14/03/2014 */
	
}

/* The elected style */
h1.style06 {
	padding: 0px 0px 0px 42px;
	line-height: 33px;
	font-size: 16px;
}
div.style06 div.PageDescriptor {
	margin:0;
	padding:0 0 0 42px;
	color:#999;
}
/* used only on contents pages */
.TableContents h1 img { margin-bottom: 12px; }
p.section01, p.section02, p.section03, p.section04, p.section05,
p.section06, p.section07, p.section08, p.section09, p.section10,
p.section11, p.section12, p.section13, p.section14, p.section15, p.section16, p.section17 {
	background-repeat: no-repeat;
	background-position: 0px 3px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 13px 50px;
}

/* define icons on contents pages and headers for each page */
p.section01, h1.section01 { background-image: url(../images/sections33/01start.gif); }
p.section02, h1.section02 { background-image: url(../images/sections33/02reading.gif); }
p.section03, h1.section03 { background-image: url(../images/sections33/03vocab.gif); }
p.section04, h1.section04 { background-image: url(../images/sections33/04grammar.gif); }
p.section05, h1.section05 { background-image: url(../images/sections33/05listening.gif); }
p.section06, h1.section06 { background-image: url(../images/sections33/06test.gif); }
p.section07, h1.section07 { background-image: url(../images/sections33/07chat.gif); }
p.section08, h1.section08 { background-image: url(../images/sections33/08tutorial1.gif); }
p.section09, h1.section09 { background-image: url(../images/sections33/09takeaway.gif); }
p.section10, h1.section10 { background-image: url(../images/sections33/10pron.gif); }
p.section11, h1.section11 { background-image: url(../images/sections33/11search.gif); }
p.section12, h1.section12 { background-image: url(../images/sections33/12tutorial2.gif); }
p.section13, h1.section13 { background-image: url(../images/sections33/13speak_tutorial.gif); }
p.section14, h1.section14 { background-image: url(../images/sections33/14review.gif); }
p.section15, h1.section15 { background-image: url(../images/sections33/15feedback.gif); }
p.section16, h1.section16 { background-image: url(../images/sections33/06test.gif); }
p.section17, h1.section17 { background-image: url(../images/sections33/17resources.gif); }
h1.section-exam { background-image: url(../images/sections33/00exam.gif); }

/* section title for contents pages */
.unit-section-title { font-weight: normal; font-size: 11pt; color: #777; }

img.unitImage {
	-webkit-box-shadow: #ccc 2px 2px 4px;
	-moz-box-shadow: #ccc 2px 2px 4px;
	box-shadow: #ccc 2px 2px 4px;
}

.sample {
	border: 1px solid #ccc;
	padding: 0px 20px;
	background: #eee;
	margin-bottom: 10px;
	display: table;
}
.samplelink{ color:#0000FF; text-decoration: underline;}



/**
 * 5. UTILITY STYLES FOR SPECIFIC USEFUL ITEMS
 */
div.reading-box { padding:0px; border: 1px solid #ccc;}
xdiv.reading-box { box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19);}
div.reading-box .reading-container {
	padding: 0.01em 16px;
	padding-bottom: 16px;
	width: 94%;
	font-size:14px ;
}
div.border { padding:10px; border: 1px solid #ccc; }
table.border {
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-collapse:collapse;
}
table.border > tbody > tr > td,
table.border > tbody > tr > th {
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-collapse:collapse;
}
.blueWord{color:#0000FF;}
.black-text{color:#000000;}
.font-size-10 {  font-size: 10px; /*font-family: Arial, Helvetica, sans-serif;*/ }
.phonetic { font: 14px "DejaVu Sans", "Lucida Sans Unicode", "Doulos SIL", "Charis SIL", "Gentium", "Code2000", "TITUS Cyberbit Basic", "Arial Unicode MS", "Chrysanthi Unicode"; }
.grammar-item { color:#f00}
.grey-item{color:#CCC;}
.handwriting-style {font-family: "Comic Sans MS", Arial, Helvetica, sans-serif; }
.exercise-title { font-weight: bold; margin-top: 0px; }
.exerciseTitle {  font-size: 12pt; margin-top: 0px; }
.print-rubric {	font-size: 14px; }
.sectionTitle { font-size: 12pt;  color:#999; margin-bottom:24px; line-height:20px; } 
.text-heading { font-size: 14pt; color:#AAA; }
.justify { text-align: justify; }
.lettered-list { list-style-type: lower-alpha; }
.dotted-list { list-style-type: disc; }
.color_botones { background-color: #EEEEE0; }
.align-exercise { text-align: left; background-color: #FFFFFF}
.section-title { font: bold 12pt Arial, Helvetica, sans-serif; } /* for mid-test and end-of-level test sections */
.example-text { color:#f00; }
.light-gray-text { color:#999; text-decoration: none;}
.grammar-title {font-size: 16px; font-weight:bold;}
.grammar-main-index { color:#000; font-size: 9pt; font-weight: bold }
.grammar_minor_index { font-size: 9pt }
.note {  font-size: 11px; font-family: Arial, Helvetica, sans-serif}
.note-pron {  font-size: 16px}

.rubric {
	font-size: 14px;
	margin-left: 20px; 
	margin-top: 10px;
}
.rubric span.rubric { 
	display: block; 
	margin-right: 10px; 
	border-radius: 1000px; 
	height: 10px; 
	width: 10px; 
	position:relative;
	left: -40px;
	top: 15px;
}


/*********************************************************
* Section tip box
**********************************************************/
div.exercises .tip {
    -moz-border-radius-bottomleft:5px;
	-moz-border-radius-bottomright:5px;
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
    background:#faf9de url(images/boxtip/bg.png) repeat-x scroll left top;
    border:1px solid #dcd8ad;
    color: #5d594b;
    padding:10px;

	}
/* Regla para IE */
* html .tip .content {
    height: 15px;
	padding: 0px 0px 0px 25px;
    background:transparent url(images/boxtip/bombi.gif) no-repeat scroll left top;

}
div.exercises .tip .content {
	min-height: 15px;
	padding: 0px 0px 0px 25px;
    background:transparent url(images/boxtip/bombi.gif) no-repeat scroll left top;

}

div.exercises .tip h3 {
padding: 0px;
margin: 0px;
}

/************************************************************************
* Estilos para Log.js
************************************************************************/

div.logPanel {
	position: fixed;
	border: 1px solid black;
	right: 10px;
	top: 110px;
	background-color: #fff;
	width: 580px;
	height: 300px;
	overflow-y: scroll;
	padding: 5px;
	font-size: 11px;
	z-index: 10002;
}

div.logPanel span.exception {
	color: #00EE00;
}

div.logPanel span.info {
	color: #95a5a6;
}

div.logPanel span.error {
	color: #FF0000;
}

div.logPanel span.success {
	color: #0000EE;
}

div.ExternalHeader {
	display:none;
}

/************************************************************************
* Estilos para el panel debug de SoundManager 2
************************************************************************/

#soundmanager-debug {
	position:absolute;
	left:550px;
	overflow:auto;
	height:800px;
	width:50%;
	background-color:#FFF;
	border:solid 1px;
	padding:5px;
	font-size: 10px;
}

/******************************************************************************
LHS navigation styles
******************************************************************************/

body.efk {
	background: #c33;
	color: #eee;
}

body.efk #navigation {
	white-space: normal;
}

body.efk a.back-to-contents {
	color: #eee;
}

body.efk a {
	color: #eee;
}

body.efk .current-sco {
	background-image: url(images/youarehere.gif);
}

/******************************************************************************
Modern 3D table effect
******************************************************************************/

table.modern {
	color:#666;
	text-shadow: 1px 1px 0px #fff;
	background:#eaebec;
	margin:10px;
	border:#ccc 1px solid;
	border-spacing: 0;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;

	-moz-box-shadow: 0 1px 2px #d1d1d1;
	-webkit-box-shadow: 0 1px 2px #d1d1d1;
	box-shadow: 0 1px 2px #d1d1d1;
}
table.modern th {
	text-align: center;
	padding:11px 15px 12px 15px;
	border-top:1px solid #fafafa;
	border-bottom:1px solid #e0e0e0;

	background: #ededed;
	background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb));
	background: -moz-linear-gradient(top,  #ededed,  #ebebeb);
}
table.modern th:first-child {
	text-align: left;
	padding-left:10px;
}
table.modern tr:first-child th:first-child {
	-moz-border-radius-topleft:3px;
	-webkit-border-top-left-radius:3px;
	border-top-left-radius:3px;
}
table.modern tr:first-child th:last-child {
	-moz-border-radius-topright:3px;
	-webkit-border-top-right-radius:3px;
	border-top-right-radius:3px;
}
table.modern tr {
	padding-left:10px;
}
table.modern td:first-child {
	text-align: left;
	padding-left:10px;
	border-left: 0;
}
table.modern td {
	padding:8px;
	border-top: 1px solid #ffffff;
	border-bottom:1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	background: #fafafa;
	background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa));
	background: -moz-linear-gradient(top,  #fbfbfb,  #fafafa);
	vertical-align:top;
}
table.modern tr.even td {
	background: #f6f6f6;
	background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6));
	background: -moz-linear-gradient(top,  #f8f8f8,  #f6f6f6);
}
table.modern tr:last-child td {
	border-bottom:0;
}
table.modern tr:last-child td:first-child {
	-moz-border-radius-bottomleft:3px;
	-webkit-border-bottom-left-radius:3px;
	border-bottom-left-radius:3px;
}
table.modern tr:last-child td:last-child {
	-moz-border-radius-bottomright:3px;
	-webkit-border-bottom-right-radius:3px;
	border-bottom-right-radius:3px;
}
table.diagonal-grey-background tr {
	background: url(images/common_exercise_assets/degraCua600.gif) no-repeat;
}
div.emailTop {
	background-image: url(images/email/email.png);
	background-repeat:no-repeat;
	width:582px;
}
div.emailBottom {
	width:540px;
	border: 1px solid #CCCCCC;
	padding:20px;
}

body .AaReadParagraph span[data-soso],
body .AaExerciseContainer span[data-soso] {
	background-color: #90caf9 !important;
}

