/*
Đại Tạng Kinh - http://daitangkinh.net
Lập trình bởi Nguyên Thuận
Mã nguồn mở, tùy ý sử dụng
*/

body
{
	margin: 0px 0px 0px 0px;
	font-family: Tahoma, Verdana, Arial, sans-serif;
	color: #000000;
	background-color: #FFFFFF;
	font-size: 23px;
	line-height:150%;
}
a:link, a:active, a:visited {
	color: #006597;
	text-decoration: none;
	transition: all 0.3s ease-out;
}
a:hover { color: black;}
select, textarea, input, submit
{
	display: inline-block;
	border-radius: 4px;
	border: solid 1px #BEBEBE;
	font-size: inherit;
	font-family: inherit;
}
#title { border-bottom: 1px dotted #BEBEBE;}
table.mark {
	border-width: 0px;
	border-spacing: 0px;
	border-style: none;
	border-color: white;
	border-collapse: collapse;
	table-layout: fixed;
}
table.mark td { border-width: 0px;}
table.max {
	width: 100%;
	border-width: 0px;
	border-spacing: 0px;
	border-style: none;
	border-color: white;
	border-collapse: collapse;
	table-layout: fixed;
}
table.max td { border-width: 0px;}
table.basic { width: 100%;}
table.basic tr:nth-child(even) { background: rgba(174,215,255,0.6);}
table.basic tr:nth-child(odd) { background: rgba(174,215,255,0.4);}
table.basic td { padding: 10px; vertical-align: top;}

table.pretty { width: 100%;}
table.pretty tr:nth-child(even) { background: #D0D8E8;}
table.pretty tr:nth-child(odd) { background: #E9EDF4;}
table.pretty tr:nth-child(1) { background: #4F81BD; font-weight: bold; color: white;}
table.pretty td { padding: 10px; vertical-align: top;}

table.simple { width:100%; border: 1px solid grey;}
table.simple td { padding: 2px; border: 1px dashed grey; vertical-align: top;}
@media print {
	div.noprint{
		display:none;
	}
}
div.spacing
{
	display: inline-block;
	margin-bottom: -10px;
	font-family: courier, monospace;
}
div.code
{ 
	font: 0.8em/1.6 Monaco, Mono-Space, courier, monospace;
	opacity: 0.7;
	line-height:110%;
}
div.popup
{
	display: none;
	position: fixed;
	top: 0%;
	left: 0%;
	width: 100%;
	background-color: white;
	height: 100%;
	overflow: auto;
	z-index: 9997;
}
div.overlay 
{
	display: none;
	position: fixed;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: white;
	z-index: 9998;
	opacity: .5;
}
div.content 
{
	display: none;
	position: fixed;
	top: 5%;
	left: 5%;
	width: 90%;
	height: 90%;
	padding: 0;
	border: 1px solid grey;
	background-color: white;
	z-index: 9999;
	overflow: auto;
	border-top-left-radius: 4px 4px;
    border-bottom-left-radius: 4px 4px;
	border-top-right-radius: 4px 4px;
    border-bottom-right-radius: 4px 4px;
	box-shadow: 2px 2px 5px 1px grey;
}
div.left 
{
	position: fixed;
	top: 0;
	left: 0;
	width: 39%;
	height: 100%;
	z-index:1001;
	overflow: auto;
}
div.right 
{
	position: fixed;
	top: 0;
	left: 40%;
	width: 60%;
	height: 100%;
	padding: 0;
	z-index:1002;
	overflow: auto;
}
div.han a
{
	color: #006597;
	cursor: pointer;
}
a.box1{
	padding:1px 5px;
	background:#FFD1B2;
	border:1px solid grey;
	border-radius:3px;
	color:#806859;
}
a.box2{
	padding:1px 5px;
	background:#EFF7D6;
	border:1px solid grey;
	border-radius:3px;
	color:#667966;
}
a.box{
	padding:1px 5px;
	background:#ffffff;
	border:1px solid #4769a4;
	border-radius:3px;
	color:#4769a4;
}
a.box:hover, a.box1:hover, a.box2:hover, a.boxc{
	color:#FFFFFF;
	border-color:#4769a4;
	background:#4769a4;
	text-decoration: none;
	border:1px solid #4769a4;
	border-radius:3px;
	padding:1px 5px;
}
a.bright {
	color:white;
	background:#E68A00;
	padding:1px 1px;
	border-radius:3px;
}
a.bright:hover {
	text-decoration: none;
	color:black;
}
a.nav{
	text-transform: uppercase;
	color: #5e7eba;
	font-size: 0.85em;
}
a.navc, a.nav:hover, a.navc:hover{
	text-transform: uppercase;
	text-shadow: 2px 2px 2px #D8D8D8;
	font-size: 0.85em;
}

strong {
	letter-spacing: 2px;
	display: inline;
	color:#4769a4;
	font: 1.7em/1.2 Baskerville, "Baskerville old face", "Hoefler Text", Garamond, "Times New Roman", serif, Verdana, Tahoma;
}
em,sup,sub{
	letter-spacing: 1px;
	font-family: courier;
}
span.headline{
	text-transform: uppercase;
	letter-spacing: 2px;
	color:#4769a4;
	font-family: Tahoma, Verdana;
}
span.verse{
	text-indent:20px;
	line-height:170%;
	display:inline-block;
	font-family: courier, monospace;
}
span.sanskrit{
	letter-spacing: 1px;
	font-family: courier, monospace;
}
span.dash{ opacity: 0.3;}
span.viet{
	text-indent:20px;
	line-height:170%;
	display:inline-block;
	color:#2D2B2A;
}
h2{ line-height:150%;}
hr { color: white;}
img { border: 0; }
img.max { height: auto; max-width: 100%; width: auto;}
img.shadow { box-shadow: 0 0 3px grey; border-radius: 5px;}
div.pic { display:inline-block; padding-right:6px; margin-bottom:10px; }
div.pic img { opacity: 1; transition: all 0.3s ease-out; border:1px solid #; border-radius: 5px;}
div.pic img:hover {opacity: 0.8; transition: all 0.3s ease-out;}


[contenteditable]:hover, [contenteditable]:focus {
  background-color: #FF9;
  border: 1px dashed #aaa;
}

span.tip
{
	border-bottom: 1px dotted #BEBEBE;
	position: relative;
}

iframe:focus {
    outline: none;
}

iframe[seamless] {
    display: block;
}

span.boxdisable 
{
	padding:1px 5px;
	background:#ffffff;
	border:1px solid #F0F0F0;
	border-radius:3px;
	color:#EBEBEB;
}
.canvas
{
	box-shadow: 0 0 3px grey;
	border-radius: 5px;
	width: 100%;
	height: 500px;
	touch-action: none;
}
.dotted
{
	border-bottom: 1px dotted #BEBEBE;
	width:100%;
	display:inline-block;
}
.blink
{
    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}
div.leftdiv
{
	float:left;
	width:50%;
}
div.rightdiv
{
	float:left;
	width:50%;
}
@media(max-width:800px)
{
	div.leftdiv, div.rightdiv
	{
		width:100%;
	}
}