/*iPad in ngang*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	
}

/*iPad in doc*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	.logo .logo-box {
		position: unset;
		top: 0;
		transform: unset;
		padding-top: 10px;
	}
	
	.nav.navbar-nav{
		padding-left: 10px;
	}
	
	.info-mobile{
		margin: 10px 0;
	}
	
	.info-mobile p{
		font-weight: unset;
		padding: 5px 10px;
		margin-bottom: 0;
		font-size: 13px;
	}
	
	.content-baodem{
		min-height: auto;
		padding-bottom: 10px;
	}
}

/*iPad 3,4 in portrait & landscape ngang*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2) {
	
}


/*iPad 3,4 in portrait & landscape doc*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2) {
	
}

/*iPhone 5 & 5S in ngang*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape) {
	
}

/*iPhone 5 & 5S in doc*/
@media only screen 
and (min-device-width: 320px) 
and (max-device-width: 568px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {
	.logo .logo-box {
		position: unset;
		top: 0;
		transform: unset;
		padding-top: 10px;
	}
	
	.nav.navbar-nav{
		padding-left: 10px;
	}
	
	.info-mobile{
		margin: 10px 0;
	}
	
	.info-mobile p{
		font-weight: unset;
		padding: 5px 10px;
		margin-bottom: 0;
		font-size: 13px;
	}
	
	.content-baodem{
		min-height: auto;
		padding-bottom: 10px;
	}
	
	#slide-navbar-collapse {
		position: fixed;
		top: 0;
		left: 15px;
		z-index: 99;
		width: 85%;
		height: 100%;
		background-color: #ddd;
		overflow: auto;
	}
	.menu-overlay {
		display: none;
		background-color: #000;
		bottom: 0;
		left: 0;
		opacity: 0.5;
		filter: alpha(opacity=50);
		/* IE7 & 8 */
		position: fixed;
		right: 0;
		top: 0;
		z-index: 49;
		height: auto;
	}
	
	#myNavbar{
		background: #fff;
	}
	
	#myNavbar .navbar-header{
		position: relative;
	}
	
	#myNavbar .logo-m{
		width: 50%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	
	#myNavbar .navbar-toggle{
		float: left;
		margin-left: 15px;
	}
	
	#myNavbar .navbar-collapse{
		padding-top: 10px;
	}
	
	#myNavbar .navbar-nav{
		padding: 0 10px;
	}
	
	#myNavbar .close-menu{
		text-align: right;
		margin-bottom: 10px;
		display: block;
		width: 100%;
	}
	
	#myNavbar .navbar-nav li a{
		font-size: 100%;
		font-weight: bold;
	}
	
	#myNavbar .navbar-nav li{
		border-bottom: 1px solid #fff;
	}
	
	#myNavbar .navbar-nav li a,
	#myNavbar .list-inline li a,
	#myNavbar .close-menu i{
		color: #111;
	}
	
	#myNavbar .list-inline{
		margin-top: 10px;
	}
	
	#myNavbar .list-inline li:not(:first-child){
		margin-bottom: 10px;
	}
	
	#myNavbar .list-inline li a{
		font-size: 80%;
		font-weight: bold;
	}
	
	/* -- effect -- */	
	.bookWrap {
		width:100%;
		height:465px;
	
	}	
	.book {
		width:100%;
		height:465px;
		left:0px;
		background: url('../img/cover.jpg') no-repeat;
		background-size: 100% 465px;
		left:0px;	
	}
	.cover {
		width: 100%;
		max-width: unset;
		max-height: 465px;	
	}
	.spine {
		width: 15px;
		height: 465px;	
	}	
	.feature-body
	{
		border: none !important;
	}
	
	.footer-info p{
		font-size: 13px;
	}
/* -- effect -- */	
}	

/*iPhone 6 in ngang*/
@media only screen 
and (min-device-width : 360px) 
and (max-device-width : 768px) 
and (orientation : landscape) {
	#slide-navbar-collapse {
		position: fixed;
		top: 0;
		left: 15px;
		z-index: 99;
		width: 85%;
		height: 100%;
		background-color: #ddd;
		overflow: auto;
	}
	.menu-overlay {
		display: none;
		background-color: #000;
		bottom: 0;
		left: 0;
		opacity: 0.5;
		filter: alpha(opacity=50);
		/* IE7 & 8 */
		position: fixed;
		right: 0;
		top: 0;
		z-index: 49;
		height: auto;
	}
	
	#myNavbar{
		background: #fff;
	}
	
	#myNavbar .navbar-header{
		position: relative;
	}
	
	#myNavbar .logo-m{
		width: 50%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	
	#myNavbar .navbar-toggle{
		float: left;
		margin-left: 15px;
	}
	
	#myNavbar .navbar-collapse{
		padding-top: 10px;
	}
	
	#myNavbar .navbar-nav{
		padding: 0 10px;
	}
	
	#myNavbar .close-menu{
		text-align: right;
		margin-bottom: 10px;
		display: block;
		width: 100%;
	}
	
	#myNavbar .navbar-nav li a{
		font-size: 100%;
		font-weight: bold;
	}
	
	#myNavbar .navbar-nav li{
		border-bottom: 1px solid #fff;
	}
	
	#myNavbar .navbar-nav li a,
	#myNavbar .list-inline li a,
	#myNavbar .close-menu i{
		color: #111;
	}
	
	#myNavbar .list-inline{
		margin-top: 10px;
	}
	
	#myNavbar .list-inline li:not(:first-child){
		margin-bottom: 10px;
	}
	
	#myNavbar .list-inline li a{
		font-size: 80%;
		font-weight: bold;
	}
}

/*iPhone 6 in doc*/
@media only screen 
and (min-device-width: 375px) 
and (max-device-width: 667px) 
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) { 
	.logo .logo-box {
		position: unset;
		top: 0;
		transform: unset;
		padding-top: 10px;
	}	
	.nav.navbar-nav{
		padding-left: 10px;
	}	
	
	.info-mobile{
		margin: 10px 0;
	}
	
	.info-mobile p{
		font-weight: unset;
		padding: 5px 10px;
		margin-bottom: 0;
		font-size: 13px;
	}
	
	.content-baodem{
		min-height: auto;
		padding-bottom: 10px;
	}
	
	.ug-thumb-image{
		width: auto !important;
	}
	
	#slide-navbar-collapse {
		position: fixed;
		top: 0;
		left: 15px;
		z-index: 99;
		width: 85%;
		height: 100%;
		background-color: #ddd;
		overflow: auto;
	}
	.menu-overlay {
		display: none;
		background-color: #000;
		bottom: 0;
		left: 0;
		opacity: 0.5;
		filter: alpha(opacity=50);
		/* IE7 & 8 */
		position: fixed;
		right: 0;
		top: 0;
		z-index: 49;
		height: auto;
	}
	
	#myNavbar{
		background: #fff;
	}
	
	#myNavbar .navbar-header{
		position: relative;
	}
	
	#myNavbar .logo-m{
		width: 50%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	
	#myNavbar .navbar-toggle{
		float: left;
		margin-left: 15px;
	}
	
	#myNavbar .navbar-collapse{
		padding-top: 10px;
	}
	
	#myNavbar .navbar-nav{
		padding: 0 10px;
	}
	
	#myNavbar .close-menu{
		text-align: right;
		margin-bottom: 10px;
		display: block;
		width: 100%;
	}
	
	#myNavbar .navbar-nav li a{
		font-size: 100%;
		font-weight: bold;
	}
	
	#myNavbar .navbar-nav li{
		border-bottom: 1px solid #fff;
	}
	
	#myNavbar .navbar-nav li a,
	#myNavbar .list-inline li a,
	#myNavbar .close-menu i{
		color: #111;
	}
	
	#myNavbar .list-inline{
		margin-top: 10px;
	}
	
	#myNavbar .list-inline li:not(:first-child){
		margin-bottom: 10px;
	}
	
	#myNavbar .list-inline li a{
		font-size: 80%;
		font-weight: bold;
	}
	
	.bookWrap {
		width:100%;
		height:465px;
	
	}	
	.book {
		width:100%;
		height:465px;
		left:0px;
		background: url('../img/cover.jpg') no-repeat;
		background-size: 100% 465px;
		left:0px;	
	}
	.cover {
		width: 100%;
		max-height: 465px;	
		max-width: unset;
	}
	
	.footer-info p{
		font-size: 13px;
	}
}