/******************************
 ** Mid size Monitor 
 ******************************/
.bp-mid #bdd-exp {
	padding-left: 7%;
}

.bp-mid #bdd-exp h1 {
	font-size: 4em;
}

.bp-mid #bdd-exp p {
	font-size: 1.5em;
}

.bp-mid #bdd-exp p.notice {
	font-size: 1.6em;
}

.bp-mid #bdd-exp p.ps {
	font-size: 1.3em;
}

.bp-mid #bdd-profile {
	width: 30%;
	padding: 10% 7% 5% 2%;
}

.bp-mid #bdd-reference p {
	padding: 0 10%;
}

/******************************
 ** Tablet size **
 ******************************/
.bp-tablet .bdd-logo {
	display: inline-block;
	margin-right: 70%;
}

.bp-tablet #bdd-title {
	margin-top: 58px;
	padding: 0;
}

.bp-tablet #bdd-intro {
	padding: 5% 0 0 0;
}

.bp-tablet #bdd-exp {
	padding: 0 2%;
}

.bp-tablet #bdd-exp h1 {
	font-size: 3.2em;
}

.bp-tablet #bdd-exp	 p {
	font-size: 1.2em;
}

.bp-tablet #bdd-exp	 p.notice {
	font-size: 1.1em;
}

.bp-tablet #bdd-exp	 p.ps {
	font-size: 0.9em;
}

.bp-tablet .div-app-icon img {
	width: 100px;
	height: 100px;
}

.bp-tablet .app-download {
	width: 65%;
}

.bp-tablet .app-download p {
	margin-bottom: 0;
}

.bp-tablet .download-link {
	width: 140px;	
}

.bp-tablet #bdd-profile {
	width: 30%;
	padding: 10% 0;
}

.bp-tablet #bdd-list {
	padding: 10% 8%;
}

.bp-tablet #bdd-list h1 {
	font-size: 2.5em;
	margin: 7% 0 10% 0;
}

.bp-tablet #bdd-intro::after {
	margin: 0;
}

.bp-tablet .bdd-comic-lists {
	margin: 0;
}

.bp-tablet .bdd-list-item {
	width: 200px;
	margin: 0 10px 20% 10px; 
	height: 300px;
}

.bp-tablet .pic-thumb {
	width: 75%;
	margin-bottom: 5%;
}

.bp-tablet .bdd-episode p {
	font-size: 1.2em;
}

.bp-tablet #bdd-reference {
	padding: 0 5% 10% 5%;
}

.bp-tablet #bdd-reference h1 {
	margin: 10% 0 5% 0;
	font-size: 2.8em;
}

.bp-tablet #bdd-reference p {
	font-size: 1em;
	text-align: justify;
	padding: 0 5%;
	margin: 0 5% 10% 5%;
}

.bp-tablet .ref-episode {
	margin: 3% 0;
}

.bp-tablet .ref-episode h2 {
	margin: 1% 10%;
	font-size: 1.5em;
}

.bp-tablet table.ref-list-items {
	font-size: 0.9em;
	margin-bottom: 20%;
}


/******************************
 ** Mobile Size **
 ******************************/
.bp-mobile .bdd-logo {
	display: inline-block;
	margin-right: 50%;
	height: 35px;
}

.bp-mobile .bdd-logo-img {
	height: 35px;
}

.bp-mobile .bdd-comic-panel .bdd-logo-img {
	height: 30px;
}

.bp-mobile #bdd-title {
	margin-top: 40px;
	padding: 0;
}

.bp-mobile #bdd-exp {
	width: 100%;
	padding: 2% 4%;
}

.bp-mobile #bdd-exp h1 {
	font-size: 2.5em;
	margin-top: 5px;
}

.bp-mobile #bdd-exp p {
	font-size: 1.2em;
	letter-spacing: 0.4px;
	line-height: 1.6;
}

.bp-mobile #bdd-exp p.notice {
	font-size: 1.1em;
}

.bp-mobile #bdd-exp p.ps {
	font-size: 0.9em;
}

.bp-mobile .div-app-icon {
	display: block;
	text-align: center;
	margin: auto;
	margin-top: 15%; 
}

.bp-mobile .app-download {
	display: block;
	text-align: center;
	margin: auto;
}

.bp-mobile #bdd-exp .app-download p {
	padding-bottom: 0;
	margin-top: 5%;
	margin-bottom: 0;
}

.bp-mobile .app-download .download-link {
	margin: 0 0 3% 0;
}

.bp-mobile #bdd-profile {
	display: none;
}

.bp-mobile #bdd-intro::after {
	margin: 0;
}

.bp-mobile #bdd-list h1 {
	margin: 10% 0;
	font-size: 2.5em;
}

.bp-mobile .bdd-comic-lists {
	margin: 0 20%;
}

.bp-mobile .bdd-list-item {
	display: block;
	max-width: 240px;
	width: 100%;
	margin: auto;
	height: auto;
	margin-bottom: 20%;
}

.bp-mobile .pic-thumb {
	width: 70%;
	margin-bottom: 5%;
}

.bp-mobile .bdd-episode p {
	font-size: 1.2em;
}

.bp-mobile #bdd-reference {
	padding-bottom: 20%;
}

.bp-mobile #bdd-reference h1 {
	margin: 15% 0 10% 0;
	font-size: 2.5em;
}

.bp-mobile #bdd-reference p {
	font-size: 0.9em;
	text-align: justify;
	padding: 0 5%;
	margin: 0 5% 12% 5%;
}

.bp-mobile .ref-episode {
	margin: 5% 0;
}

.bp-mobile .ref-episode h2 {
	margin: 2% 10%;
	font-size: 1.4em;
}

.bp-mobile table.ref-list-items {
	font-size: 0.8em;
	margin-bottom: 20%;
}


/***********************************
 ***********************************
 ***********************************
 *********** Comics Page ***********
 ***********************************
 ***********************************
 ***********************************/
.bp-tablet .bdd-bottom-nav {
	font-size: 1.5em;
}
.bp-tablet .bdd-arrow {
	width: 20px;
}

.bp-tablet .bottom-nav p {
	font-size: 0.8em;
}

/* Mobile */
.bp-mobile #bdd-epi-title {
	font-size: 1.8em;
}

.bp-mobile #bdd-epi-date {
	font-size: 0.9em;
}

.bp-mobile .bdd-reader-nav {
	padding: 0;
}

.bp-mobile .bdd-bottom-nav {
	font-size: 1.3em;
}
.bp-mobile .bdd-arrow {
	width: 18px;
}

.bp-mobile .bottom-nav p {
	font-size: 0.7em;
}