@charset "utf-8";
/* CSS Document */

body {
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000000;
	background-color: #ebebeb;
}

p {margin:5px 0;
}

/*table main layout*/

.container  {
	background-color:#FFF;
	width:900px;
	margin:0 auto;
	border: 0;
	border-spacing:0;
	padding: 20px;
}

/*cover*/
.cover  {
	background-color:#FFF;
	width:900px;
	margin:0 auto;
	border: 0;
	border-spacing:0;
	height:1215px;
	background-image:url(images/img0_1.jpg);
}

/*editorial*/

.editorial {margin: 20px auto; font-size:14px; border:1px solid #000; border-spacing:0; padding:12px; }
.editorial th {border-right: 1px solid #000; padding-right: 20px; text-align:right; vertical-align:top;}
.editorial td {padding-left: 20px;}


/*titles*/
.book {
	color: #777;
	width:450px;
	margin: 400px auto;
	font-family:"Times New Roman", Times, serif;
	font-size: 46px;
	font-weight:bold;
	text-align:center;}

.title {font-family:"Comic Sans MS", cursive; font-size: 28px; font-style:italic; font-weight:bold;}	
.subtitle {font-family:"Comic Sans MS", cursive; font-size: 18px; font-style:italic; font-weight:bold;}	
.chapter {font-size: 40px; text-shadow: 2px 2px 2px rgba(150, 150, 150, 1);}
.title_n {font-family:"Comic Sans MS", cursive; font-size: 24px; font-style:italic; font-weight:normal;}	

.chest_l { background: url(images/chest.jpg) no-repeat 0 center; padding: 10px 0 0 80px; height:70px; width: 330px; margin: 0px auto;}
.chest_r { background: url(images/chest.jpg) no-repeat right center; padding: 10px 80px 0 0px; height: 70px; width: 330px; margin: 0px auto;}
.activity{font-weight:bold; font-size:20px; margin-top:20px}
.user{ background: url(images/user.jpg) no-repeat; padding: 30px 0 0 120px; height:50px;}
.discuss_b { font-size: 26px; font-family:"Comic Sans MS", cursive; font-weight:bold; font-style:italic; border-bottom: 5px dotted #577bbc; margin-right: 240px; margin-bottom:10px; }
.discuss_g { font-size: 26px; font-family:"Comic Sans MS", cursive; font-weight:bold; font-style:italic; border-bottom: 5px dotted #a7ce39; margin-right: 240px; margin-bottom:10px;}


.f12 {font-size:12px; }

.act_expl{font-family:"Comic Sans MS", cursive; font-style:italic;}

/*colors*/
.yellow { color:#ffcb06;}
.blue {color:#0096D7;}
.d_blue {color:#577bbc;}
.emerald { color:#35a88e;}
.maroon {color:#b12e16;}
.orange {color: #f7941d;}
.green {color: #a7ce39; }
.grey {color: #818284; }

/*list*/

.flower_b li { 
	background:url(images/flower_b.jpg) no-repeat;
    list-style-type: none; 	
	margin: 0;
    padding-left:28px;
	padding-bottom:5px;
}
.flower_g li { 
	background:url(images/flower_g.jpg) no-repeat;
    list-style-type: none; 	
	margin: 0;
    padding-left:28px;
	padding-bottom:5px;
}



.flower_b li li, .flower_g li li { 
	background: none;
    list-style-type: circle; 	
	padding-left:10px;
	padding-bottom:0px;
}
.flower_b table, .flower_g table { font-size:12px;
} 

 

/*paddings*/
.pad20{padding:0 20px;}
.pad40{padding:0 40px;}
.pad60{padding:0 60px;}
.pad80{padding:0 80px;}
.pad100{padding: 10px 10px 10px 100px; display:block;}
.pad200{padding: 10px 10px 10px 200px; display:block;}
.pad100x{padding:0 100px;}

.width80 {width: 80%;}
.width70 {width: 70%;}
.width60 {width: 60%;}
.width50 {width: 50%;}
.width40 {width: 40%;}
.width30 {width: 30%;}


/*floats*/
.fleft {float: left;}
.fright {float:right;}


/*align*/
.left {text-align: left;}
.right {text-align: right;}
.center {text-align: center;}

/*position*/
.pos_r {right:0;}
.pos_l {left:0;}
.pos_b {position:absolute; bottom:0;}
.pos {position:relative;}

/*section*/
.theatre {
	background-image:url(images/theatre_element.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 55px;
	width: 840px;
	margin: 0 auto;
	border-bottom: 3px dashed #999;
	position: relative;}

.theatre span {padding:10px 10px 10px 100px; font-weight: bold; position: absolute; bottom:0;}

/*boxes*/
.y_box {width: 230px; padding:10px; background-color:#ffcb06; margin: 10px 0px;}
.gr_box {width: 230px; padding:10px; background-color:#a7ce39; margin: 10px 0px;}
.tag {
	background-image:url(images/tag.jpg);
	background-repeat: no-repeat;
	height: 210px;
	width: 310px;
	padding: 50px 40px 0 200px;
	text-align:left;
}
	
.text_rotate {
    -webkit-transform: rotate(-9deg);
    -moz-transform: rotate(-9deg);
    -o-transform: rotate(-9deg);
    writing-mode: rl-tb;

}

.note_b { background:url(images/note_b.jpg) no-repeat; height: 950px; padding:90px 150px 100px 90px; width:600px; margin:0 auto; font-size:14px;}
.note_g { background:url(images/note_g.jpg) no-repeat; height: 950px; padding:90px 150px 100px 90px; width:600px; margin:0 auto; font-size:14px;}
.note_p { background:url(images/note_p.jpg) no-repeat; height: 950px; padding:90px 150px 100px 90px; width:600px; margin:0 auto; font-size:14px;}
.note_gy_sm { background:url(images/note_gy_small.jpg) no-repeat; height: 518px; padding:50px 150px 90px 60px; width:600px; margin:0 auto; font-size:14px;}
.note_gy { background:url(images/note_gy.jpg) no-repeat; height: 600px; padding:75px 150px 100px 90px; width:600px; margin:0 auto; font-size:14px;}

.note_b span, .note_g span,.note_p span,.note_gy_sm span,.note_gy span,.note_e span, .note_b_sm span, .note_p_th span, .note_gy_z6 span, .note_gy_me span, .note_g_sm span, .note_p_sm span 
{
padding-left: 250px;
}

/*headers*/

/*YELLOW*/

.yr {
	background-image:url(images/puzzle_element.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	height: 37px;
	width: 840px;
	margin: 0;
	border-bottom: 2px solid #ffcb06;
	position: relative;
	}
.yr span { background-color:#ffcb06; color:#fff; padding:10px; font-weight: bold; position: absolute; bottom:0; }

.yl {
	background-image:url(images/puzzle_element.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 37px;
	width: 840px;
	margin: 0 auto;
	border-bottom: 2px solid #ffcb06;
	position: relative;
	}
.yl span { background-color:#ffcb06; color:#fff; padding:10px; font-weight: bold; position: absolute; bottom:0; right:0; }

/*GREEN*/

.gnr {
	background-image:url(images/puzzle_element.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	height: 37px;
	width: 840px;
	margin: 0;
	border-bottom: 2px solid #a7ce39;
	position: relative;
	}
.gnr span { background-color:#a7ce39; color:#fff; padding:10px; font-weight: bold; position: absolute; bottom:0; }

.gnl {
	background-image:url(images/puzzle_element.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 37px;
	width: 840px;
	margin: 0 auto;
	border-bottom: 2px solid #a7ce39;
	position: relative;
	}
.gnl span { background-color:#a7ce39; color:#fff; padding:10px; font-weight: bold; position: absolute; bottom:0; right:0; }




/*** CTI ***/
.puzzle {
	background-image:url(images/puzzle_element.jpg);
	background-repeat: no-repeat;
	height: 37px;
	width: 840px;
	margin: 0 auto;
	position: relative;
}
/*_class_horizontal*/
.zone_r {
	background-position: left top;
	border-bottom: 2px solid;
	text-align:right;
}

.zone_r span { 
	padding:10px; 
	font-weight: bold; 
	bottom:0; 
	right:0;
}

.zone_l {
	background-position: right top;
	border-bottom: 2px solid #ffcb06;
	text-align:left;
	margin:0;
}

.zone_l span { 
	padding:10px; 
	font-weight: bold; 
	bottom:0; 
	left:0;
}


/*_class_tiled*/
.class_box_title {
	width:160px;
	height:70px;
	position:absolute;
	bottom:0px;
	text-align:center;
}

.class_box_title span {
	display: block;
	padding:3px 15px;
}

.class_l {
	background-position: right top;
	border-bottom: 2px solid;
	text-align:left;
	margin-top: 80px;
}

.class_r {
	background-position: left top;
	border-bottom: 2px solid;
	text-align:right;	
	margin-top: 80px;
}




.class_box {
/*	padding:30px 30px 0 90px;*/
	margin:-63px 0 0 0;
	width:250px;
	height:100px;
	position:relative;
}

/*colors*/
.ybrd {
	border-color: #ffcb06;
}

.gbrd {
	border-color: #a7ce39;
}

.gbg {	
	background:#a7ce39;
	}
	
.ybg {
		background:#ffcb06;
}

.l_bluehl {background-color:#3399FF; color:#fff; font-size:1.35em }
.bluehl {background-color:#008DD2; color:#fff; font-size:1.35em }
.yellowhl {background-color:#FFCC33; color:#008DD2; font-size:1.35em }
.blueh2 {background-color:#008DD2; color:#fff; font-size:0.9em }
.yellowh2 {background-color:#FFCC33; color:#008DD2; font-size:0.9em }

.l_purpleh1 {background-color:#A36891; color:#fff; font-size:1.35em }
.purpleh1 {background-color:#86346C; color:#fff; font-size:1.35em }


.tagsmall {
	background-size: contain;
	padding: 55px 0px 0px 200px;
	height: 195px;
}

.clr {
	clear:both;
}



.f14 {font-size:14px; }

.tag_frame {
	background-image:url(images/img9_08.jpg);
	background-repeat: no-repeat;
	padding: 45px 40px 130px 40px;
	text-align:left;
}

.text_rotate_frame {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    writing-mode: rl-tb;
}

.tag_frame_b {
	background-image:url(images/img11_03b.jpg);
	background-repeat: no-repeat;
	padding: 55px 80px 80px 50px;
	text-align:left;
	
	
}

.text_rotate_frame_b {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    writing-mode: rl-tb;
}

.tag_frame_c {
	background-image:url(images/img11_03c.jpg);
	background-repeat: no-repeat;
	padding: 50px 50px 100px 75px;
	text-align:left;
}
	
	
.text_rotate_frame_c {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    writing-mode: rl-tb;
}


.tag_frame_d {
	background-image:url(images/img11_03d.jpg);
	background-repeat: no-repeat;
	padding: 55px 90px 80px 60px;
	text-align:left;
	
	
}

.text_rotate_frame_d {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    writing-mode: rl-tb;
}
/*position*/
.pos_rlv {position:relative; z-index:-1}

.note_p {}

/*section*/
.theatre_nar {
	background-image:url(images/theatre_element.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 55px;
	width: 700px;
	margin: 0 auto;
	border-bottom: 3px dashed #999;
	position: relative;}

.theatre_nar span {padding:10px 10px 10px 100px; font-weight: bold; position: absolute; bottom:0;}

/*boxes*/
.y_box_long {width: 280px; padding:10px; background-color:#ffcb06; margin: 10px 0px;}
.y_box_vlong {width: 360px; padding:10px; background-color:#ffcb06; margin: 10px 0px;}
.gr_box_long {width: 360px; padding:10px; background-color:#a7ce39; margin: 10px 0px;}
.gr_box_medium {width: 300px; padding:10px; background-color:#a7ce39; margin: 10px 0px;}
.ly_box_long {width: 250px; padding:10px; background-color:#FFC; margin: 10px 0px;}


/*colors*/
.purple { color:#86346C;}

.purpleh2 {background-color:#A36891; color:#fff; font-size:0.9em }
.greenh2 {background-color:#a7ce39; color:#fff; font-size:0.9em }


.note_p_sm { background:url(images/note_p_small.jpg) no-repeat; height: 500px; padding:90px 150px 100px 100px; width:600px; margin:0 auto; font-size:14px;}
.note_gy_me { background:url(images/note_gy_medium.jpg) no-repeat; height: 518px; padding:60px 150px 90px 65px; width:600px; margin:0 auto; font-size:14px;}
.note_e { background:url(images/note_e.jpg) no-repeat; height: 900px; padding:90px 150px 90px 85px; width:600px; margin:0 auto; font-size:14px;}
.note_g_me { background:url(images/note_g_me.jpg) no-repeat; height: 500px; padding:90px 150px 100px 100px; width:590px; margin:0 auto; font-size:14px;}

.table_first_col {padding-right: 10px; text-align:left; vertical-align:top;}
.align_r {text-align:right;}

.dotted_frame {border-style:dashed; border-width:3px; border-color:#a7ce39; padding-left: 10px}

.notepad{
	border-bottom: 1px solid #000;}
	
/*paddings*/
.pad_l_60{padding-left: 60px;}


/*list*/

.flower_p li { 
	background:url(images/flower_p.jpg) no-repeat;
    list-style-type: none; 	
	margin: 0;
    padding-left:28px;
	padding-bottom:5px;
}



.b_border
{
 border-style:solid;
 border-color:#0096D7;
}

.gy_border
{
 border-style:solid;
 border-color:#A0A0A0;
}

.note_g_sm { background:url(images/note_g_small.jpg) no-repeat; height: 500px; padding:80px 150px 100px 90px; width:600px; margin:0 auto; font-size:14px;}

.arrow li { 
	background:url(images/arrow.jpg) no-repeat;
    list-style-type: none; 	
	margin: 0;
    padding-left:28px;
	padding-bottom:5px;
}

.y_box_x_long {width: 460px; padding:10px; background-color:#ffcb06; margin: 10px 0px;}
.gr_box_x_long {width: 460px; padding:10px; background-color:#a7ce39; margin: 10px 0px;}

.purple {color: #86346c;}
.turquoise {color: #00d1b1;}

.ribbons { background:url(images/ribbons.jpg) no-repeat; height: 500px; padding:70px 150px 20px 96px; width:500px; margin:0 auto; font-size:14px;}

.activity_simple{font-size:20px; margin-top:20px}

.o_box
{
 padding:10px;
 background-color:#e6e6a3;
}

.l_o_box
{
 padding:10px;
 background-color:#F5F9E8;
}

.y_g_box
{
 padding:10px;
 background-color:#FFEEBD;
}

.gy_box
{
 padding:10px;
 background-color:#e8e8e8;
}

.null_li { 
	background:url(images/null.jpg) no-repeat;
    list-style-type: none; 	
	margin: 0;
    padding-left:166px;
	padding-bottom:0px;
}

.null_box
{
 padding:200px;
}

.note_b_sm { background:url(images/note_b_sm.jpg) no-repeat; height: 518px; padding:75px 150px 100px 90px; width:600px; margin:0 auto; font-size:14px;}
.note_p_th { background:url(images/note_p_th.jpg) no-repeat; height: 950px; padding:90px 150px 100px 90px; width:570px; margin:0 auto; font-size:14px;}
.note_gy_z6 { background:url(images/note_gy_z6.jpg) no-repeat; 518px; padding:40px 150px 90px 85px; width:640px; margin:0 auto; font-size:14px;}

.contents_tb td {border-bottom:dotted #000 2px;}


.text_rotate_z4 {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    writing-mode: rl-tb;
	frame:1px #FF9933 box;
	font-size:12px;
	padding:5px 10px 10px;
}
.text_rotate_z4 span{
	border-bottom:1px #ff9933 solid;
	
}

.or_border
{
 box-shadow:-9px -8px 10px #999;
 border-style:solid;
 border-color:#ff9933;
 background-color:#fff;
}

.z12_1 {
	background-image:url(images/img12_02.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 450px; 
	padding:75px 70px 70px 80px; 
	width:650px; 
	margin:0 auto; 
	font-size:14px;
	}

.z12_2 {
	background-image:url(images/img12_031.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 200px; 
	padding:65px 70px 70px 65px; 
	width:550px; 
	margin:0 auto; 
	font-size:14px;
	}

.z12_3 {
	background-image:url(images/img12_061.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 220px; 
	padding:60px 70px 70px 60px; 
	width:200px; 
	margin:0 auto; 
	font-size:14px;
	}


.z14_1 {
	background-image:url(images/img14_031.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 200px; 
	padding:65px 70px 70px 65px; 
	width:200px; 
	margin:0 auto; 
	font-size:14px;
	}
	
.z14_2 {
	background-image:url(images/img14_061.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 140px; 
	padding:50px 70px 70px 50px; 
	width:250px; 
	margin:0 auto; 
	font-size:14px;
	}
.z14_3 {
	background-image:url(images/img14_062.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 200px; 
	padding:60px 70px 70px 50px; 
	width:250px; 
	margin:0 auto; 
	font-size:14px;
	}
.z14_4 {
	background-image:url(images/img14_063.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 200px; 
	padding:50px 70px 70px 50px; 
	width:250px; 
	margin:0 auto; 
	font-size:14px;
	}
	
	.z14_5 {
	background-image:url(images/img14_121.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 600px; 
	padding:90px 70px 70px 100px; 
	width:680px; 
	margin:0 auto; 
	font-size:14px;
	}