/** FONTS**/
@font-face {
	font-family: 'gilligan';
	src: url('../myfonts/gilligan.eot');
	src: local('☺'), url('../myfonts/gilligan.woff') format('woff'), url('../myfonts/gilligan.ttf') format('truetype'), url('../myfonts/gilligan.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'markermonkey';
	src: url('../myfonts/markermonkey.eot');
	src: local('☺'), url('../myfonts/markermonkey.woff') format('woff'), url('../myfonts/markermonkey.ttf') format('truetype'), url('../myfonts/markermonkey.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'optimistic';
	src: url('../myfonts/optimistic.eot');
	src: local('☺'), url('../myfonts/optimistic.woff') format('woff'), url('../myfonts/optimistic.ttf') format('truetype'), url('../myfonts/optimistic.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: myFont;
	src: url('../myfonts/Lato-Reg.ttf');
}

@font-face {
	font-family: firstLetter;
	src: url('../myfonts/Cookie-Regular.ttf');
}

@font-face {
	font-family: myHeadingFont;
	src: url('../myfonts/HennyPenny-Regular.ttf');
}

* {
	margin: 0px;
	padding: 0px;
}

wrapper_ul {
	list-style-image:url(../images/tickDiana.jpg);
}


ol.circulo { list-style-image: url("../images/tiny_3D.png"); }

.textoAllBooks4u {
	font-size: 34px;
}
.imageAllBooks4u {
	margin-left: auto;
    margin-right: auto;
}


blockquote {
font-family: Georgia, serif;
font-size: 18px;
font-style: italic;
width: 500px;
margin: 0.25em 0;
padding: 0.25em 40px;
line-height: 1.45;
position: relative;
color: #383838;
}

blockquote:before {
display: block;
content: "\201C";
font-size: 80px;
position: absolute;
left: -20px;
top: -20px;
color: #7a7a7a;
}

blockquote cite {
color: #999999;
font-size: 14px;
display: block;
margin-top: 5px;
}

blockquote cite:before {
content: "\2014 \2009";
}

#header {
	display: block;
	margin-right: auto;
	margin-left: auto;
	width: 1300px;
}

#wrapper {
	width: 1300px;
	margin-right: auto;
	margin-left: auto;
	
}

#wrapper #left {
	width: 300px;
	text-align: center;
	float: left;
}
#wrapper #center {
	float: left;
	width: 800px;
}
#wrapper #right {
	float: left;
	width: 200px;
}

#wrapper #footer {
	clear: left;
	height: 45px;
}


#wrapperMain {
	width: 1300px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(../images/newBackground.jpg);
	background-repeat: repeat-y;
}
#wrapperMain #leftMain {
	float: left;
	width: 300px;
}
#wrapperMain #centerMain {
	float: left;
	width: 800px;
}
#wrapperMain #rightMain {
	float: left;
	width: 200px;
}

#wrapperMain #footerMain {
	clear: left;
	height: 45px;
}

/*ESTILOS GENERALES*/
p { 
	font-family: myFont, cursive;
	font-size: 20px;
	font-weight:bold;
	margin: 15px;
	text-indent: 1em;
}

p:first-letter{
	font-size: 28px;
	font-family: firstLetter, Times New Roman, Tahoma, cursive;
	color:maroon;
}

#caption{
	font-family: myFont, cursive;
	color:blue;
	font-size:30px;
	text-align:center;
}

#caption:first-letter{
	font-family: firstLetter, cursive;
	color:maroon;
	font-size:40px;
	text-align:center; 
}

h1 {
	font: bold italic 2em/2em myHeadingFont;
	margin: 0;
	padding: 0;
	color: #FE2E9A;
	border-top: solid #FE2E9A medium;
	border-bottom: dotted #FE2E9A thin;
	width: 600px;
}

/* ----------------------------------------------------------------------------------------------------------------------------
== SILVERBACK
** ---------------------------------------------------------------------------------------------------------------------------- */

#silverback                            {position:relative; z-index:0; min-width:90px; min-height:90px; 
                                        padding:120px 200px 50px; margin:20px 0 40px; font-size:2.5em; font-weight:normal; 
                                        line-height:1.2; text-align:center; background:#d3ff99 url(../images/esl/vines-back.png) -10% 0 repeat-x;}
#silverback:before,
 #silverback:after                     {position:absolute; z-index:-1; top:0; left:0; right:0; bottom:0; padding-top:100px;}
#silverback:before                     {content:url(../images/esl/peterMonkey.png); padding-left:3%; text-align:left;
                                        background:transparent url(../images/esl/vines-mid.png) 10% 0 repeat-x;}
#silverback:after                      {content:url(../images/esl/peterMonkeyLeft.png); padding-right:3%; text-align:right;
                                        background:transparent url(../images/esl/vines-front.png) 10% 0 repeat-x;}



#warning {
	 border-color: red;
	border-style: solid;
}

#imagenIndex {
	padding-top: 2px;
	padding-left: 2px;
	float: left;
	padding-right: 2px;
	padding-bottom: 0px;
}


#imgLeft p {
    margin: 0;
    text-align: center;
    padding: 4px 0;
		font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight:bold;
}

/* MATH & TERMINATOR */
#wrapperMainMathTerminator {
	width: 1400px;
	margin-right: auto;
	margin-left: auto;
}
#wrapperMainMathTerminator #leftMainMathTerminator {
	width: 600px;
	text-align: center;
	float: left;
}

#wrapperMainMathTerminator #centerMainMathTerminator {
	float: left;
	width: 800px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding: 5px 0 5px 0;
}

/* MATH */

#wrapperMainMath {
	width: 1300px;
	margin-right: auto;
	margin-left: auto;
}
#wrapperMainMath #leftMainMath {
	width: 300px;
	text-align: center;
	float: left;
}

#wrapperMainMath #centerMainMath {
	float: left;
	width: 800px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding: 5px 0 5px 0;
}

#wrapperMainMath #rightMainMath {
	width: 200px;
	text-align: left;
	float: left;
}

#wrapperMainMath #footerMainMath {
	clear: left;
	height: 45px;
}

#imagenMath{
	clear:both;
	margin: 10px;
	padding: 10px;
}

#imgLeft{
	float: left;
	margin: 10px;
	width: 150px;
	padding-top: 10px;
	padding-right: 25px;
	padding-bottom: 10px;
	padding-left: 25px;
}

/* Reading */
#wrapperMainReading {
	width: 1300px;
	margin-right: auto;
	margin-left: auto;
}
#wrapperMainReading #leftMainReading {
	width: 300px;
	text-align: center;
	float: left;
}

#wrapperMainReading #centerMainReading {
	float: left;
	width: 800px;
	margin-top: 1px;
	margin-bottom: 1px;
	padding: 1px 0 1px 0;
}

#wrapperMainReading #rightMainReading {
	width: 200px;
	text-align: left;
	float: left;
}

#wrapperMainReading #footerMainReading {
	clear: left;
	height: 45px;
}


#slideshowContainer {
	width: 600px;
	margin: 10px auto 0 auto;
	position:relative;
}
.slideshow {
	height: 600px;
}
.slideshow img {
	padding: 5px;
	border: 1px solid #ccc;
	background-color: #eee;
}
#nav {
	list-style-type:none;
	z-index:150;
}
#nav li a {
	display:block;
	width:70px;
	height:120px;
	text-indent:-9999px;
	outline:none;
}
#prev a {
	background:url(../images/imagesReading/left.png);
	width:70px;
	height:120px;
	position:absolute;
	top:220px;
	left:-70px;
}
#next a {
	background:url(../images/imagesReading/right.png);
	width:70px;
	height:120px;
	position:absolute;
	top:220px;
	right:-90px;
}

pre { margin: 0; }
pre.LineNumbers {
    float: left;
    padding-right:2px;
    border-right: solid 1px black;
    margin-right:7px;
  }

div.CodeBox {
    border: solid 2px navy;
    padding:2px;
    background-color: #BFD1E4;
}

.MyGradientClass
{
background: #b4e391; /* Old browsers */
background: -moz-linear-gradient(top,  #b4e391 0%, #61c419 50%, #b4e391 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b4e391), color-stop(50%,#61c419), color-stop(100%,#b4e391)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* IE10+ */
background: linear-gradient(to bottom,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4e391', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
}

.greydout {
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
-webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -ms-transition: all 3s ease;
  -o-transition: all 3s ease;
  transition: all 3s ease;
}

.greydout:hover {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}

#wrapperIndex {
	width: 1000px;
	height: 800px;
	margin-right: auto;
	margin-left: auto;
	position:relative;
	background-size: 1000 px 800px;
}

/*Estilos de la Tabla de Contenidos*/
#toc {
    list-style:none;
    margin:0 0 1em 15px;
    padding: 0;
}

#toc li {
	line-height:1.3em;
	margin: .25em 0;
    	padding: 0 0 0 15px;
	background:url(../images/arrow.png) no-repeat 0 3px;
}

#toc a{
	margin: .25em 0;
    	padding: 0 0 0 15px;
	
}

/* Single-direction drop shadow */
		
hr.style-one {
    border: 0;
    height: 1px;
    background: #333;
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:    -moz-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:     -ms-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:      -o-linear-gradient(left, #ccc, #333, #ccc); 
}

#list2 { width:720px; }
#list2 ol { font-style:italic; font-family:Georgia, Times, serif; font-size:24px; color:#bfe1f1;  }
#list2 ol li { }
#list2 ol li p { padding:8px; font-style:normal; font-family:Arial; font-size:20px; color:#000; border-left: 1px solid #999; }
#list2 ol li p em { display:block; }

#rounded {
	background-color: #666;
	color: #fff;
	font-weight: bold;
	padding: 10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px; }

.sexy_line { 
    margin: 25px 0;
    height: 1px;
    background: black;
    background: -webkit-gradient(linear, 0 0, 100% 0, from(white), to(white), color-stop(50%, black));
}

body#pag1 a#menu-pag1, body#pag2 a#menu-pag2
{
	
	background:aquamarine;
	color: #222;
    text-shadow: 0px 2px 3px #555;
}

	#navigationBorder
{
text-decoration:center;
list-style: none;
}

#navigationBorder li{
  display: inline;
}

.lyl-alert .lyl-box-content {
background: url(../images/alert.png) no-repeat scroll 13px 13px #F5F5F8;
border: 1px solid #cc9999;
color: #333333;
min-height: 50px;
}
.lyl-box-content {
min-height: 35px;
padding: 16px 20px 8px 75px;
text-shadow: 1px 1px 1px #ffffff;
margin-bottom:10px;
}
.lyl-note .lyl-note-content {
background: url(../images/dialog_information.png) no-repeat scroll 13px 13px #F5F5F8;
border: 1px solid #cccc66;
color: #333333;
min-height: 50px;
}
.lyl-note-content {
min-height: 35px;
padding: 16px 20px 8px 75px;
text-shadow: 1px 1px 1px #ffffff;
margin-bottom:10px;
}

.lyl-terminator .lyl-terminator-content {
background: url(../images/terminator/robotSmall.png) no-repeat scroll 13px 13px #F5F5F8;
border: 1px solid #cccc66;
color: #333333;
min-height: 50px;
}
.lyl-terminator-content {
min-height: 35px;
padding: 16px 20px 8px 75px;
text-shadow: 1px 1px 1px #ffffff;
margin-bottom:10px;
}


div.expandable_note_box {
		width: 250px;
		height: 440px;
		background-image: url("../images/top.png");
		background-position: top left;
		background-repeat: no-repeat;
		padding-top: 30px;
		font-size: 80%;
	}
	
	div.expandable_note_box div.middle {
		width: 250px;
		height: 450px;
		background-image: url("../images/middle.png");
		background-position: center;
		background-repeat: repeat-y;
	}
	
	div.expandable_note_box div.inside {
		width: 250px;
	}

	pre { 
      font-style: normal; 
      color: black;
      background-color: grey;
      font-family: courier, fixed;
      border: 2px solid black;
      padding: 5px;
      margin-left: 0%;
    }

    #fixed1 { position: fixed; top: 100px; right: 100px; width: 600px; height: 440px; }
#dialog { 
   width: 576px;
    	margin: 0 auto;
		padding: 10px 20px;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #000;
		background: #ccc;
		box-shadow: inset 0 2px 3px #555;
		height: 250px;
		overflow: hidden;
		overflow-y: scroll;
  }
  #inText{
  width: 606px;
		height: 40px;
		outline: none;
		border: 0;
		color: #000;
		padding: 5px;
		font-size: 23px;
  }
  span.orden{
    color: blue;
    font-style: oblique;
  }
  span.resultado{
    color: red;
    font-style: oblique;
  }

  #tituloLibro{
  	color: #808080;
  }

 .libro h4{
	text-align:center;
	font-family: optimistic, cursive;
	font-size: 20px;
	background-color:#dbeaba;
	margin:12px;
	height:44px;
	padding:6px;
}

.borde {
	border:solid 7px #dbeaba;
	border-radius:360px;
	margin-left:15px;
	-webkit-box-shadow: 4px 4px 7px -2px #777;
   	  -moz-box-shadow: 4px 4px 7px -2px #777;
      box-shadow: 4px 4px 7px -2px #777;
}