@font-face {
    font-family: 'Open Sans';
    src: url('../../img/OpenSans.ttf');
}

body {
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	padding:10px;
	background-color:#fff;
	background-repeat:no-repeat;
	background-size:cover;
	font-family:'Opan Sans', sans-serif;
	font-size:18px;
	color:#000;
}


#canvas-container {
	position:fixed;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	background-color:#fff;
	background-repeat:no-repeat;
	background-size:453px 136px;
	background-position:center;
	background-image:url('img/t0.png');
	overflow:hidden;
	color:#fff;
}

div.button {
	position:absolute;
	right:0px;
	width:100px;
	height:100px;
	background-color:#8d8d8d;
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;
	border:3px outset #cacaca;
	cursor:pointer;
}

div.button:hover{
	border-style:inset;
}

#btnAbout {
	top:0px;
	background-image:url('img/next.png');
}

#btnEditor {
	top:106px;
	background-image:url('img/editor.png');
}

#btnBrowser {
	top:209px;
	background-image:url('img/browser.png');
}

div.window {
	display:none;
	position:absolute;
	border:1px solid #000;
	background-color:#fff;
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;
	text-align:center;
}

div.window span {
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	padding:5px;
	height:22spx;
	background-color:#000;
	border:2px outset #fff;
	color:#fff;
}

img.button-close {
	position:absolute;
	top:3px;
	right:3px;
	width:24px;
	height:24px;
	cursor:pointer;
}

#windowAbout {
	top:50px;
	right:200px;
	height:300px;
	width:400px;
	background-image:url('img/t1.png');
}

#windowEditor {
	top:100px;
	left:50px;
	height:400px;
	width:600px;
	background-image:url('img/t2.png');
}

#windowBrowser {
	top:200px;
	left:300px;
	height:600px;
	width:900px;
	background-image:url('img/t3.png');
}

#read-more {
	display:none;
	position:absolute;
	bottom:50px;
	right:50px;
	z-index:10;
	padding:10px;
	opacity:0;
	background-color:rgba(0,0,0,0.1);
	color:#424242;
	transition:opacity 1s;
}

#read-more a {
	color:#8a8a8a;
	text-decoration:none;
	border-style:solid;
	border-color:#2071a6;
	border-width:0px;
}

#read-more a:hover {
	text-decoration:none;
	border-width:0px 0px 1px 0px;
}