@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: BanglaFont;
  src: url(fonts/AdorshoLipi.ttf);
}
html,body{
	width:100%;
	height:100%;
	overflow:hidden;
	margin:0px;
}
h1,h2,h3,h4,h5,h6{
	margin:0px;
	font-size:18px;
}
#top{
	width:100%;
	height:10%;
	background-color:#00F;
	color:#FFF;
	text-align:center;
}
#storyname{
	font-size:36px;
}
#booktitle{
	display:block;
	font-family:BanglaFont;
	font-size:22px;
	font-weight:bolder;
	line-height:none;
}
#bookwriter{
	display:block;
	font-family:BanglaFont;
	font-size:18px;
	font-weight:bold;
	line-height:none;
}
#main{
	width:100%;
	height:86%;
	background-color:#FFF;
	font-family:BanglaFont;
	overflow:hidden;
}
#contains{
	width:50%;
	height:98%;
	margin-left:auto;
	margin-right:auto;
	padding:1%;
	background-color:#FFF;
	overflow-y:scroll;
	margin-top:0px;
}

#contains img{
	width:60%;
}
#cover{
	width:100%;
}
.menubt{
	display:block;
	width:100%;
	text-decoration:none;
	color:#000;
	font-size:larger;
}

.vdocontainer {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.vdoiframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#footer{
	width:100%;
	height:4%;
	background-color:#00F;
	color:#FFF;
}



@media only screen and (max-width: 600px) {
#contains{
	width:95%;
	height:98%;
	margin-left:auto;
	margin-right:auto;
	padding:1%;
	background-color:#FFF;
	overflow-y:scroll;
}
#contains img{
	width:90%;
}
#cover{
	width:100%;
}
#booktitle{
	display:block;
	font-family:BanglaFont;
	font-size:18px;
	font-weight:bolder;
	line-height:none;
}
#bookwriter{
	display:block;
	font-family:BanglaFont;
	font-size:14px;
	font-weight:bold;
	line-height:none;
}
#storyname{
	font-size:16px;
	font-weight:bold;
}
}