/* if portrait */
/*@media screen and (min-device-width:768px) and (orientation:portrait) {
	#content{font-size:120%;}
	img{transform:scale(1.2);}
}
@media screen and (min-device-width:1024px){
	#content{font-size:120%;}
	img{transform:scale(1.2);}
}

@media screen and (max-device-width:860px) {
	.ex{
		width: auto !important;
		clear:both !important;
	}
	.question {
		clear: both !important;
	}
}*/

.type-bar img { transform: scale(1); }


#content{display:none;}
body#notes #content{display:block;}

@font-face {
   font-family: 'backup_font';
   src: url('file:///android_asset/fonts/DejaVuSerif.ttf'); 
}


#copyright{display:none;}


body{
	margin:0; 
	font-family: times new roman,serif;
	padding-bottom: 2em;
}

.br{
	font-family: backup_font,serif;
}
.rootsym,
.cbutton .rootsym{
	/*font-family: backup_font,serif;*/
	font-family: times new roman,serif;
}

#top {
    /*background-color: white;*/
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
	z-index: 1001;
	text-align:center;
}

#h_unit {
    /*float: left;*/
	margin-left:1%;
	vertical-align:middle;
    color: #004A8D;
    display: inline-block;
    font-size: 100%;
    font-style: italic;
	width:16%;
	display:none;
}

#h_title {
    /*background-color: #FAEBD7;*/
	background-color: rgba(250, 235, 215, 0.8);
    color: #004A8D;
	border-radius:0 0 0.5em 0.5em;
    display: inline-block;
	vertical-align: middle;
    font-size: 150%;
    text-align: center;
	width:56%;
	cursor:pointer;
}
#h_title #introlist,
#h_title #examplelist,
#h_title #questionlist
{
	visibility:hidden;margin-top:-7em;
}
#h_title.closed #introlist,
#h_title.closed #examplelist,
#h_title.closed #questionlist
{
	visibility:hidden;
	-webkit-transition: visibility 0s linear,
				margin 0.3s ease-in-out 0s;
	transition: visibility 0s linear,
				margin 0.3s ease-in-out 0s;
	margin-top:-7em;
}
#h_title.open #introlist,
#h_title.open #examplelist,
#h_title.open #questionlist
{
	margin-top:0;
	visibility:visible;
	-webkit-transition: margin 0.3s ease-in-out 0s,
				visibility 0s linear 0.3s;
	transition: margin 0.3s ease-in-out 0s,
				visibility 0s linear 0.3s;
}
#acttitle{
	min-width:20%;
	height:1.2em; 
	background-color: rgba(250, 235, 215, 0.8);
	border-radius:0 0 0.5em 0.5em;
	padding: 0.2em 0.4em;
	display: inline-block;
}


#acttitle{
	font-family: Arial,sans; 
	font-weight: bold;
	/*font-size:120%;*/
}
#acttitle.intit{
	color:black;
	font-size:100%;
	/*text-shadow: 1px 1px 1px rgba(100, 100, 100, 0.6);*/
}
#acttitle.extit{
	color:white;
	background-color:#00bce4;
	/*text-shadow: 1px 1px 1px rgba(100, 100, 100, 0.6);*/
}
#acttitle.qutit{
	color:white;
	background-color:#004a8d;
	/*text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.6);*/
}


.topbutton {
    /*background-color: burlywood;*/
    background-color: white;
    border-radius: 0 0 0.5em 0.5em;
	padding:0.1em 0;
    /*color: #FFFFFF;*/
    cursor: pointer;
    display: inline-block;
    font-family: Arial,sans-serif;
    font-size: 150%;
    text-align: center;
    width: 18%;
	height:1em;
	border:0.2em solid white;
}
.etopb{
	color:#00bce4;
	border-color:#00bce4;
}
.qtopb{
	color:#004a8d;
	border-color:#004a8d;
}

#prevbut{
	float: left;
    margin-left: 1%;
	visibility:hidden;
}
#nextbut{
	float:right;
	margin-right:1%;
}



#content {
    padding-top: 4em;
}
#intro{
	margin: 0 auto;
    width: 90%;
	font-size:90%;
}
#intro ul:first-of-type {
    margin-bottom: 3em;
}

div.general{color:#00bce4; 
	font-family:Arial sans-serif; 
	padding: 1.5em; 
	text-align:center;
	border-top: 3px solid #00bce4;
	border-bottom: 3px solid #00bce4;
	margin-top:2em;
	margin-bottom:1em;
}

#examples {
    margin-left: 1em;
	margin-right:1em;
}
#exercises {
    margin-left: 1em;
	margin-right:1.5em;
}

#examples_title, 
#exercises_title{
    border-radius: 0 0.4em 0.4em 0;
    color: #FFFFFF;
    display: inline-block;
    font-size: 150%;
    margin: 0;
    padding: 0.1em 0.5em;
	width: 10em;
	display:none;
}
#examples_title{background-color: #00BCE4; margin-top:3em;}
#exercises_title{background-color: #004A8D; }
	
.introlink,
.examplelink, 
.questionlink{
    border-radius: 0.4em;
    color: #FFFFFF;
    display: inline-block;
    margin: 0.1em;
    padding: 0.1em;
    text-align: center;
    width: 1.3em;
	cursor:pointer;
	font-family: Arial,sans-serif;
}
#introlist, #examplelist, #questionlist {
    /*display: inline-block;*/
	font-size:120%;
	text-align:left;
	margin-left:0.5em;
	margin-right:0.5em;
}
#questionlist {margin-bottom:0.5em;}
.introlink{color:black;background-color:white;}
.examplelink{background-color: #00BCE4;}
.questionlink{background-color: #004A8D;}

/*******************************************************/
/*Buttons*/

.but {
    padding-left: 2em;
}
.but span, .showbut{
	font-size:125%;
	display:inline-block; 
	cursor:pointer; 
	line-height:1em;
	font-family:Arial, sans-serif;
	font-weight:bold;
	padding:0.1em 0.2em;
}

.but .bck{border: 2px solid #8080ff; border-radius: 0.3em; background-color:#8080ff; color:yellow;}
.but .bco{color:#05A305; cursor:default;}
.but .bwr{border: 2px solid #ff0829; border-radius: 0.3em; color: #ff0829; margin-right: 0.2em;}
.but .btm,.btmh{border: 2px solid #8080ff; border-radius: 0.3em; background-color:#8080ff; color:yellow;white-space:nowrap;}
.but .btmh{visibility:hidden;}

table td[colspan] .but span,
table td[rowspan] .but span{
	font-size:100%;
}
td.but{
    text-align: left;
    width: 6em;
}

/*******************************************************/

.indent {
	padding-left: 3em;
}
.partbody p.indent {
}
.note {
    color: gray;
    font-style: italic;
}
.help {
	color: lightgrey;
}

.other{
	color:peru;
	font-style:italic;
	padding-bottom: 1em;
}
.other h3{
}
.center {
    margin: 0 auto;
}
.centerc {
    text-align: center;
}
.centerc .centerb, .indent .centerb {
    border: 1px solid black;
    display: inline-block;
    padding: 0.5em 1em;
}
.ex .centerc .centerb, .ex .indent .centerb {
	border-color:red;
}
.right {
    float: right;
}
img.right{margin-left:1em; margin-bottom:1em;}
.left {
    float: left;
}
img.left{margin-right:1em; margin-bottom:1em;}
.clear {
    clear: both;
}
.em{font-style:italic;}
div.lcol {
}
div.rcol {
}
#exercises .nob {
    border-width: 0;
}
#examples .nob {
    border-width: 0;
}


/********************** examples **************************/


.showbut {
    cursor: pointer;
    vertical-align: middle;
}
.showbut{
	border: 2px solid #FF0829; 
	border-radius: 0.3em; 
	background-color:#FF0829; 
	color:yellow;
}
#examples .parttitle {
    color: #00BCE4;
}
.example {
    padding-bottom: 1em;
    padding-top: 2em;
    position: relative;
}
.examplec {
	clear: both;
}
.show {
    display: none;
}
.show th {
    font-weight: normal;
}
.ex {
    background-color: cornsilk;
    color: red;
    cursor: default;
    margin: 0.5em 0;
    padding: 1em;
}
.exinline{
	margin:0;
	padding:0 0.3em;
	line-height:120%;
}
#examples .ex th {
    font-weight: bold;
}
#examples .partbody p {
}


/*********************** exercises ****************************/


#exercises .parttitle {
    color: #004A8D;
}
.question {
    clear: both;
	margin-bottom: 2em;
}
.qtext{padding-bottom:3em; margin-left:0em;}
.question th {
}
.qnum, .enum {
    color: #004A8D;
    float: left;
    font-size: 250%;
    margin-left: -2em;
    text-align: right;
    width: 1.5em;
	display:none;
}
.enum {
    color: #00BCE4;
}
.qnum {
    color: #004A8D;
}
.but img {
    cursor: pointer;
    vertical-align: text-top;
}
.question input {
    border: 1px solid lightgray;
    width: 3em;
	font-size:100%;
}
.question .wider {
    width: 4em;
}
.question .wider2 {
    width: 6em;
}
.parttitle {
    float: left;
	font-family:Arial,sans;
	font-weight:bold;
}
.partbody {
    padding-left: 2.5em;
}
.partdelim {
    clear: both;
    height: 3.5em;
	margin: 0.4em 0;
}
.partdelim2 {
}
.vdelim {
}
.cleard {
    clear: both;
}
.partbody p {
    margin: 5px 0;
    margin: 0.4em 0;
}
.solution {
}


/***************************************** elements *********************************************/


.question .formulac {
    background-color: white;
    color: black;
    display: inline-block;
    padding: 2px 3px;
    padding: 0.1em 0.2em;
}

sup {
    /*font-size: 11px;*/
    font-size: 80%;
}
sup.fr{
	vertical-align: top;
}
sup input {
    font-size: x-small;
    height: 1.1em;
    width: 1.5em;
}
.eq {
    padding: 0 0.3em;
}

.eqt td {
    vertical-align: text-bottom;
    white-space:nowrap;
}
.eqt .lside {
    text-align: right;
}
.eqt .cside {
    text-align: center;
}
.eqt .comment {
    padding-left: 3em;
    white-space:normal;
}
#examples .eqt {
    margin-bottom: 0.4em;
    margin-top: 0.4em;
}
.flash {
    overflow: hidden;
}
.type-rel {
    margin: 0 0.3em;
    vertical-align: middle;
    border:2px solid white;
}
.uppoint {
    background: url("uppoint.png") no-repeat scroll 0 0 transparent;
}
.example .uppoint {
    background: url("uppointb.png") no-repeat scroll 0 0 transparent;
}
.ex .uppoint {
    background: url("uppointr.png") no-repeat scroll 0 0 transparent;
}
.question .uppoint {
    background: url("uppointb.png") no-repeat scroll 0 0 transparent;
}
.solution .uppoint {
    background: url("uppoint.png") no-repeat scroll 0 0 transparent;
}
.rootsym {
/*    padding-bottom: 0.6ex;
    vertical-align: middle;*/
    padding-bottom: 0.1em;
    vertical-align: bottom;
    display: inline-block;
}
.root {
    border-top: 1px solid;
}
.rootr {
    font-size: x-small;
    vertical-align: super;
}
.rootb {
    background: url("fracsq.png") no-repeat scroll 0 0 transparent;
    display: inline-block;
    padding-left: 13px;
    padding-left: 1em;
}
.rbbody {
    border-top: 1px solid black;
    display: inline-block;
}
.question .rootb {
    background: url("fracsqbq.png") no-repeat scroll 0 0 transparent;
}
.question .rbbody {
    border-top: 1px solid blue;
}
.ex .rootb {
    background: url("fracsqr.png") no-repeat scroll 0 0 transparent;
}
.ex .rbbody {
    border-top: 1px solid red;
}
.ilpic {
    vertical-align: middle;
}
.ls {
    display: inline-block;
}
.rs {
    display: inline-block;
}
.wrop .e {
    text-align: right;
}

.br{display:inline-block; vertical-align:middle;line-height:120%;}

.cbutton{display:inline-block; 
	vertical-align:middle; 
	width:22px; 
	height:22px; 
	line-height:22px;
	font-size:14px;
	font-family:sans-serif,Arial;
	text-align: center;
	background:url("cbut.png") no-repeat;
}
.cbutton2{display:inline-block; 
	vertical-align:middle; 
	width:36px; 
	height:36px; 
	line-height:36px;
	font-size:16px;
	font-family:sans-serif,Arial;
	text-align: center;
	margin:0 0.3em;
	background:url("cbut2.png") no-repeat;
}
.example .cbutton{background:url("cbutr.png") no-repeat;}
.example .cbutton2{background:url("cbut2r.png") no-repeat;}


table.calculation{ border-collapse:collapse; }
table.calculation td{ text-align:right; width: 0.8em;}
table.calculation tr.line td{ border-bottom:1px solid black; }
.ex table.calculation tr.line td{ border-bottom-color: red; }



.w{	background-color:tomato; }
.fractioni.w{background-color:white;}
.fractioni.w input{background-color:tomato;}

/* tables */
.simpletable, 
.simpletable_nob{margin:0 auto 1em auto; border-collapse:collapse;}
.simpletable td, 
.simpletable_nob td{border-left:1px solid black;border-right:1px solid black;padding: 0.3em 0.5em; text-align:center;}
.simpletable td{border:1px solid black; }
.simpletable td.h, 
.simpletable_nob td.h{text-align:left;}
.simpletable_nob td.h{border:1px solid black;}
.simpletable_nob .h td{border:1px solid black;}
.simpletable .nob{}

/* finput */
.finput{
	border:1px solid gray;
	padding: 0.1em 0.2em;
	min-height: 1em;
	min-width:3em;
	cursor: text;
	vertical-align: middle;
	display:none;
}

/* ul */
.type-ul{display:inline-block;}
.ul{cursor:pointer; display: inline-block; padding:0 0.1em; border:0px solid transparent; border-bottom-width: 3px;}
.type-ul .ul { color: #004a8d; font-family: Arial,sans-serif; margin-bottom: 0.1em; }
/*.ul:hover{border-color:#bbdde4;}*/
.uls{border-color:#004A8D;}
/*.uls:hover{border-color:#65a5b3;}*/
.ul .fractioni{display: inline-block;}

/* pch */
.type-pch{display:inline-block;}
.pchimg{vertical-align: middle;}
.pch{cursor:pointer; display: inline-block; vertical-align: middle; border:1px solid lightgray; width:1em; height:1em;}
.pch .fractioni{display: inline-block;}

/* dnd */
.dndarea{position:relative;}
.dndobj, 
.dndobj_pos, 
.dndobj_hl{position:absolute;}