@charset "UTF-8";

/************************** demos *****************************/
#learncontent-contents .demo-block .text.parbase.section p,
#learncontent-contents .demo-block .text.parbase.section > div,
#learncontent-contents .demo-block .richtext.section p,
#learncontent-contents .demo-block .richtext.section > div {
	margin-top:0;
}
@media only screen and (max-width:640px) and (max-device-width:1280px){
	#learncontent-contents .demo-block .text.parbase.section p,
	#learncontent-contents .demo-block .text.parbase.section > div,
	#learncontent-contents .demo-block .richtext.section p,
	#learncontent-contents .demo-block .richtext.section > div {
		margin-top:0;
	}
}
#learncontent-contents .demo-block .subheader2 {
	font-family: 'Open Sans Condensed', 'Arial', sans-serif;
}
.demo-block {
	padding:45px 0 0;
	height:605px;
}
.demo-block:after {
	content:"";
	display:block;
	height:0;
	overflow:hidden;
	clear:both;
}
#learncontent-contents .demo-block .richtext.section {
	font-size:12px;
	line-height:17px;
}
#learncontent-contents .demo-block .richtext.section b {
	font-weight:bold;
}
#learncontent-contents .demo-block .richtext.section i {
	font-style:italic;
}
#learncontent-contents .demo-block .richtext.section ul,
#learncontent-contents .demo-block .richtext.section ol {
	margin-top:20px;
}
#learncontent-contents .demo-block .richtext.section ul {
	list-style:outside disc;
	margin-left:1.5em;
}
#learncontent-contents .demo-block .richtext.section ol {
	list-style:outside decimal;
	margin-left:1.5em;
}
#learncontent-contents .demo-block .richtext.section:last-child > :last-child {
	margin-bottom:0;
}
.demo-block .demo-visual-area {
	float:left;
	width:615px;
	height:541px;
	font-size:0;
	position:relative;
}
.demo-block .demo-visual-area .demo-visual-backtostart {
	position:absolute;
	top:0;
	left:0;
}
.demo-block .demo-visual-area .demo-visual-inner {
	position:relative;
	display:inline-block;
	margin-top:50px;
}
.demo-block .demo-visual-main .demo-visual-main-part {
	display:none;
	position:absolute;
	top:0;
	width:100%;
}
.demo-block .demo-visual-area .richtext.section {
	margin-top:20px;
	text-align:center;
}

.demo-block.type-hotspot .demo-visual-area {
	text-align:center;
}
.demo-block.type-hotspot .demo-visual-btn ul {
	font-size:0;
}
.demo-block.type-hotspot .demo-visual-btn li {
	position:absolute;
	margin:-30px 0 0 -30px;
	width:59px;
	height:59px;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips {
	position:absolute;
	background-color:#fff;
	padding:8px;
	width:180px;
	text-align:left;
	box-shadow:0 0 3px 0 rgba(0,0,0,0.4);
	-webkit-box-shadow:0 0 3px 0 rgba(0,0,0,0.4);
	-moz-box-shadow:0 0 3px 0 rgba(0,0,0,0.4);
	-o-box-shadow:0 0 3px 0 rgba(0,0,0,0.4);
	-ms-box-shadow:0 0 3px 0 rgba(0,0,0,0.4);
	-pie-box-shadow:0 0 3px 0 #666;
	border-radius:3px;
	-pie-border-radius:3px;
	behavior: url(/etc/designs/panasonic/common-clientlibs/css/PIE.htc);
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.left {
	left:0;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.right {
	right:0;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.top {
	top:65px;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.bottom {
	bottom:65px;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.top:before {
	content:"";
	display:block;
	position:absolute;
	width:20px;
	height:13px;
	top:-13px;
	background:url(/etc/designs/panasonic/productpage-clientlibs/images/img-demos-tooltips.png) no-repeat;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.bottom:after {
	content:"";
	display:block;
	position:absolute;
	width:20px;
	height:13px;
	bottom:-13px;
	background:url(/etc/designs/panasonic/productpage-clientlibs/images/img-demos-tooltips.png) no-repeat -24px 0;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.left:before,
.demo-block.type-hotspot .demo-visual-btn li .tooltips.left:after {
	left:20px;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips.right:before,
.demo-block.type-hotspot .demo-visual-btn li .tooltips.right:after {
	right:20px;
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips > span.text {
	font-family: 'Open Sans Condensed', 'Arial', sans-serif;
	font-size:16px;
	font-weight:bold;
	line-height:23px;
	color:#1f1f1f;
	display:block;
	/*margin-right:15px;*/
}
.demo-block.type-hotspot .demo-visual-btn li .tooltips > span.arrow {
	display:none;
	/*width:12px;
	height:10px;
	background:url(/etc/designs/panasonic/productpage-clientlibs/images/img-demos-tooltips.png) no-repeat -48px 0;
	position:absolute;
	bottom:8px;
	right:8px;*/
}

.demo-block.type-thumbs .demo-visual-main {
	text-align:center;
}
.demo-block.type-thumbs .demo-visual-btn {
	margin-top:20px;
}
.demo-block.type-thumbs .demo-visual-btn ul {
	font-size:0;
	text-align:center;
}
.demo-block.type-thumbs .demo-visual-btn li {
	display:inline-block;
	width:123px;
	vertical-align:top;
}
.demo-block.type-thumbs .demo-visual-btn li a {
	display:inline-block;
}
.demo-block.type-thumbs .demo-visual-btn li img {
	width:100%;
	height:auto;
}
.demo-block.type-thumbs .demo-visual-btn li span {
	font-size:12px;
	font-weight:bold;
	color:#1f1f1f;
	display:inline-block;
	margin-top:8px;
}
.style-dark .demo-block.type-thumbs .demo-visual-btn li span {
	color: #fff;
}
.demo-block.type-thumbs .demo-visual-btn li a:hover span,
.demo-block.type-thumbs .demo-visual-btn li a.selected span {
	color:#0041c0;
}
.style-dark .demo-block.type-thumbs .demo-visual-btn li a:hover span,
.style-dark .demo-block.type-thumbs .demo-visual-btn li a.selected span {
	color:#00a0c6;
}
.demo-block .demo-copies-area {
	float:right;
	width:312px;
	margin-top:50px;
}
.demo-block .demo-copies-area .instruction {
}
.demo-block .demo-copies-area .demo-copy {
	display:none;
}
.demo-block .demo-copies-area h3,
.demo-block .demo-copies-area .demo-image,
.demo-block .demo-copies-area .richtext.section {
	margin-bottom:20px;
}
.demo-block .demo-copies-area .richtext.section:last-child {
	margin-bottom:0;
}

@media only screen and (max-width:640px) and (max-device-width:1280px){
		
	.demo-block {
		padding:15px 10px 0;
		height:auto;
	}
	#learncontent-contents .demo-block .richtext.section {
		font-size:0.625rem;
		line-height:0.875rem;
	}
	#learncontent-contents .demo-block .richtext.section ul,
	#learncontent-contents .demo-block .richtext.section ol {
		margin-top:10px;
	}
	#learncontent-contents .demo-block .richtext.section:last-child > :last-child {
		margin-bottom:0;
	}
	.demo-block .demo-visual-area {
		float:none;
		width:auto;
		height:auto;
		margin-bottom:15px;
	}
	.demo-block .demo-visual-area .demo-visual-inner {
		display:block;
		height:auto;
		margin-top:0;
	}
	.demo-block .demo-visual-area .demo-visual-main {
		height:auto;
	}
	.demo-block .demo-visual-area .demo-visual-backtostart {
		margin-bottom:10px;
		position:static;
		width:32px;
		height:32px;
	}
	.demo-block .demo-visual-area .richtext.section {
		margin-top:15px;
	}
	
	.demo-block.type-hotspot .demo-visual-btn li {
		width:40px;
		margin:-20px 0 0 -20px;
	}
	
	.demo-block.type-thumbs .demo-visual-btn {
		margin-top:15px;
	}
	.demo-block.type-thumbs .demo-visual-btn ul {
		white-space:nowrap;
	}
	.demo-block.type-thumbs .demo-visual-btn li {
		width:19.999%;
	}
	.demo-block.type-thumbs .demo-visual-btn li img {
		display:block;
	}
	.demo-block.type-thumbs .demo-visual-btn li span {
		font-size:0.625rem;
		margin-top:5px;
	}
	.demo-block .demo-copies-area {
		float:none;
		width:auto;
		margin-top:0;
	}
	.demo-block.type-thumbs .demo-copies-area {
		margin-top:30px;
	}
	.demo-block .demo-copies-area .demo-copy h3 {
		margin-bottom:20px;
	}
	.demo-block .demo-copies-area .demo-image {
		margin-bottom:10px;
		text-align:center;
	}
	.demo-block .demo-copies-area .richtext.section {
		margin-bottom:10px;
	}
	.demo-block .demo-copies-area .richtext.section:last-child {
		margin-bottom:0;
	}
}