div.container{
	width: 1270px;
}

div.col-md-3{
	width: 22%;
}

/**/
div.divyoutube{
	position:relative;
	display: inline-block;
	margin: 10px;
	padding: 5px;
	text-align: center;
	font-size:0.8em;
	z-index:0;
}

div.divyoutube div.youtubeover{
	position:absolute;
	display: block;
	top:5px;
	left:5px;
	width:246px;
	height:138px;
	transition: 0.3s;
	z-index:1;
}

div.divyoutube div.youtubeover:hover{
	background-color:#000;
	opacity:0.5;
}

div.divyoutube img.youtubebtn{
	position:absolute;
	display: block;
	top:50%;
	left:50%;
	margin-left:-26px;
	margin-top:-31px;
	pointer-events: none;
	z-index:2;
}

/**/
ul.arrowlist {
    list-style-image: url('/images/barcode/ar2.png');
}

ul.arrowlist li{
    margin-bottom:1em;
}

/**/
div.divyoutubehq{
	position:relative;
	display: inline-block;
	margin:0;
	padding:0;
	font-size:0.8em;
	z-index:0;
	transition: 0.2s;
   	cursor:pointer;
}

div.divyoutubehq img.youtubebtn{
	position:absolute;
	display: block;
	top:50%;
	left:50%;
	margin-left:-34px;
	margin-top:-24px;
	z-index:2;
}

div.divyoutubehq span.youtubetitle{
	position:absolute;
	display: block;
	top:0;
	left:0;
	padding:0.7em;
	color:#e0e0e0;
	font-size:1.5em;
	text-shadow: 0 0 1px #555;
	z-index:4;
}

div.divyoutubehq span.youtubetitle:hover{
	color:#fff;
}

div.divyoutubehq div.divyoutubegrad{
	display: block;
	position:absolute;
	background: linear-gradient(to bottom, rgba(0,0,0,0.65), rgba(0,0,0,0));
	height:8em;
	top:0;
	left:0;
	z-index:3;
	width: 100%;
	content:' ';
}

div.divyoutubehq-cont{
	display:none;
}


/*tabs online reader*/
.tabs {
	margin:0;
	/*background:#fff;*/
	overflow:hidden;
	padding:5px;
	/*font-size:0.7em; font-family:Verdana,Arial; color:#000; font-weight:bold; font-style:normal; text-decoration:none;*/
}

ol.i-tab {
	list-style:none;
	list-style-type: none;
	overflow:hidden;
	/*height:90px;*/
	padding:3px; 
	/*background:#fff;*/
}

ol.i-tab li {
	padding:1px 1px 1px 1px;
	margin:1px;
	float:left;
    	text-align:center;
   	font-size:14px;
   	font-family:Tahoma,Verdana,Arial;
   	color:#fff;
   	font-weight:bold;
   	background:#aac;
   	cursor:pointer;
	transition: 0.1s;
}
			
ol.i-tab li:hover {
	background:#fff;
   	color:#aac;
	cursor:pointer;
	border: solid 2px #b00;
	transition: 0.1s;
}

ol.i-tab li.active {
	background:#fff;
   	color:#aac;
	border: solid 2px #b00;
}
			
ol.tab-content {
	list-style:none;
	margin:0px;
	padding:1px;
}	
			
ol.tab-content li {
	display:block;
	padding:2px;
	margin:0px;
	/*background:#fff;*/
	display:none;
}

/*sub menu title*/
h3.hsubmenu {
	border-bottom: solid 2px #bb0000;
	color:#000;
}

/*sub menu sub links*/
ul.nav.submenu li a {
	color:#2e0096;
}

ul.nav.submenu li a:hover {
	text-decoration: underline;
}

ul.nav.submenu li ul.nav-child {
	padding-left:20px;
}

ul.nav.submenu li a {
	margin:0;
	padding:0;
	height:2.3em;
	font-weight:bold;
}


/*for path way*/
div.dsbread {
	margin:0;
	background:#2e0096;
	color:#aaa;
	padding:12px 0 12px 0;
}

div.dsbread ol {
	list-style-type: none;
	padding:0;
	margin:0;
}

div.dsbread ol li {
	display: inline;
	margin-right:5px;
}

div.dsbread ol li a.pathway{
	padding-right:16px;
	background: url('/images/barcode/arrow.png') no-repeat right center; 
}

div.dsbread ol li.active{
	border-bottom: solid 2px #bb0000;
}

div.dsbread ol li a {
   	color:#fff;
}

div.dsbread ol li a:hover {
    text-decoration: underline;
}

/*form items*/
form .formitem {
	padding:2px;
	border: #aaa 1pt solid;
	color: #000 ;
	background-color: #fff;
	width:auto;
	height:auto;
}

form .sumbitbox {
	border: #aaa 1pt solid;
	color: #000000 ;
	background-color: #ddd;
	width:12em;
	height:2em;
	margin:5px;
}

form .sumbitbox:hover {
	COLOR: #fff ;
	BACKGROUND-COLOR: #2e0096;
}

/**/
.headerdiv {
	padding: 3px;
	background: #ebebff;
	font-size: 12px;
	color: #000;
	font-weight: bold;
}

.examples { margin:1em 0 0 2em; padding: 0.5em; border: solid 2px #aac; }
.examples1 { margin: 0 0 0 10px; padding:4px; border: solid 2px #aac; }
.codes1 { font-size:11px; font-family:Tahoma,Verdana,Arial; color:#000090; font-weight:normal; font-style:normal; text-decoration:none }
.codesc { font-size:11px; font-family:Verdana,Arial; color:#008000; font-weight:normal; font-style:normal; text-decoration:none }
.h1class { font-size:1.2em; font-family:Verdana,Arial; color:#000; font-weight:bold; font-style:normal; text-decoration:none; }
.h11class { font-size:1.5em; font-family:Verdana,Arial; color:#000; font-weight:bold; font-style:normal; text-decoration:none }
.v1 { font-size:1.2em; color:#fff; font-weight:bold;}
.v7 { font: bold 0.9em Tahoma, Sans-Serif; color: #888; }
.v8 { font: bold 1em Tahoma, Sans-Serif; color: #556; }
.v9 { font: bold 10pt Tahoma, Sans-Serif; color: #556; }
.v10 { font-size:0.7em; font-family:Verdana,Arial; color:#505050; font-weight:300; font-style:normal; text-decoration:none }
.v11 { font-size:1.5em; font-family:Verdana,Arial; color:#779; font-weight:bold; font-style:normal; text-decoration:none }
.v12 { font-size:0.9em; font-family:Verdana,Arial; color:#555; font-weight:300; font-style:normal; text-decoration:none }
.v14 { font-weight:bold; font-style:italic; }

blockquote {
	margin-left:2em;
	padding:0;
	background:#fff;
	border-left:none;
	font-style:normal;
}

pre {
	background:#fff;
	margin:0;
}

hr {
    border: none;
    height: 2px;
    color: #779; /* old IE */
    background-color: #779; /* Modern Browsers */
}

.hr1 {
 	background: linear-gradient(to right, red, yellow);
	height: 2px;
	width: 80%;
}

/*tables with properties*/
table.dsprops {
	background:#fff;
	border-spacing:0.2em;
	border-collapse: separate;
	font-size:0.8em;
}

table.dsprops td {
    padding:0.2em;
    background:#F0F0F0;
}

div.dspropsheader {
	padding:0.3em;
	margin-bottom:0.5em;
	background:#779;
	color:#fff;
	font-size:1.5em; font-family:Verdana,Arial; font-weight:bold;
}

.dsheader {
	padding:0.3em;
	margin-bottom:0.5em;
	background:#779;
	color:#fff;
	font-size:1em; font-family:Verdana,Arial; font-weight:bold;
}

div.olsettings {
	padding:3px;
	background:#eeeef5;
	color:#000;
}

/*div.olsettings */div.oloption {
	padding:0;
	margin-right:2em;
	color:#000;
	display:inline;
	float:left;
	font-size:0.8em; font-family:Verdana,Arial;
}

/*div.olsettings */div.oloption input {
	padding:0;
	margin:0;
}

div.orderoption {
	padding:0.3em;
	margin-right:3em;
	color:#000;
	display:inline;
float:left;
overflow: hidden;
	font-size:1em; font-family:Verdana,Arial;
background:#dfdfe5;
	border: solid 1px #ccd;
}


/*
div.olsettings div.oloption label, input{height:20px;vertical-align:middle;}
*/

/* order table */
form#ShopingCartSDKID table.dsorder {
	background:#fff;
	border-spacing:1px;
	border-collapse: separate;
	/*font-size:0.8em;*/
}

form table .hplan { width:10em; padding:0.4em; font: bold 1.5em Tahoma, Sans-Serif; color:#fff; text-align:center; border-bottom:1px solid #aaaaaf; text-shadow: 0px 1px #999;}
form table .tplan { width:10em; padding:0.2em; font: bold 1em Tahoma, Sans-Serif; border-bottom:1px solid #aaaaaf; text-align:center;}
form table .trplan { width:15em; padding:0.2em; font: bold 1em Tahoma, Sans-Serif; border-bottom:1px solid #aaaaaf; text-align:left; }

form table .edstd { background-color:#eaa004; vertical-align:middle; }
form table .edstdl { background-color:#f9f4d2; color:#eaa004; vertical-align:middle; }

form table .edpro { background-color:#717883; vertical-align:middle; }
form table .edprol { background-color:#e6e8eb; color:#717883; vertical-align:middle; }

form .plusmin {
	display:inline-block;
	width:30px;
	height:30px;
	padding:0;
	margin:0;
/*	background: url('/images/barcode/arrow.png') no-repeat right center;*/
}

form table .plantotal {
	font: bold 1.5em Verdana,Tahoma; color: #fff;
	height:3em;
	background-color:#8b8;
	text-align:center;
	text-shadow: 0px 1px #555;
}

form .buynow {
	background-color:#484;
	border: solid 1px #373;
	color:#fff;
	font: bold 1.5em Tahoma, Sans-Serif;
	text-shadow: 0px 1px #777;
	margin-top:0.5em;
	padding:0.2em 1.5em 0.2em 1.5em;
	transition: 0.3s;
}

form .buynow:hover {
	background-color:#fff;
	color:#484;
}


.dshead1 {
	display:block;
	background-color:#aac;
	border: solid 1px #99a;
	color:#fff;
	font: bold 1.5em Tahoma, Sans-Serif;
	text-shadow: 0px 1px #777;
	margin-top:0.2em;
	padding:0.2em 1.5em 0.2em 1.5em;
	transition: 0.1s;
}

.dshead1 a {color:#44b;}

.dshead1 a:hover {text-decoration:underline;color:#fff;}

.dshead2 {
	display:block;
	width:100%;
	border: solid 1px #37b;
	color:#cce;
	font: bold 1.5em Tahoma, Sans-Serif;
	margin-top:0.2em;
	padding:0.2em 1.5em 0.2em 1.5em;
	transition: 0.1s;
	background-color:#5090d0;
}

.dshead2 a {color:#fff;}

.dshead2 a:hover {text-decoration:underline;color:#fff;}

div.salecontent {
	background-color:#fff;
	width:100%;
	padding:1em;
	color:#000;
}

div.salecontent1 {
	color:#ddd;
	margin-top:1.5em;
}

div.bottombar {
	position:relative;padding:0;margin:0;
}

div.dsanimation {
	text-align:center;display:inline-block;top:30px;left:0;height:150px;width:150px;position:relative;color:#000;
}

div.dsanimation:hover{
	box-shadow: 0px 0px 0px 2px #555;
}

div.animationtext {
	top:0;right:0;display:none;height:150px;width:510px;position:absolute;color:#ccc;font-size:0.8em;
}

.dsanimationtitle {
	visibility:hidden;
	/*display:none;*/
	position:relative;
	left:3em;
}

div.allsdk {
	color:#555;
	font-size:1.1em;
}

div.allsdk ul {
	list-style:none;
	list-style-type: none;
	padding-left:0;
}

div.allsdk ul li {
	background: url('/images/barcode/ar1.gif') no-repeat left top;	
	padding-bottom:1.5em;
	padding-left:15px;
}

div.maincont {
	display:block;position:relative;width:100%;height:750px;padding:0;margin:0;
}

/*
div.maincont1 {display:block;position:absolute;top:0;left:0;width:1050px;height:700px;z-index:0;}
div.maincont2 {display:none;position:absolute;top:0;left:0px;width:1050px;height:700px;z-index:1;}
*/

div.maincont .floatpane {
	padding:0.7em;
	width:14.2em;
	height:3.8em;
	font-size:3.0em;display:none;position:absolute;left:0;top:1em;color:#a33;z-index:0;
	background-color:#118;
	color:#fff;
	opacity:0.7;
	border: solid 2px #fff;
	line-height: 1.1em;
}

div.maincont .movingtitle {
	font-size:3.0em;
	display:none;position:absolute;left:-0.5em;top:1.5em;
	color:#f5f5f5;
	z-index:1;
}

div.maincont .r1{left:0;top:2.7em;z-index:2;}

div.maincont .r2{left:0.5em;top:3.9em;z-index:3;}


div.maincont .floatpane1 {
	padding:0.7em;
	font-size:1.7em;display:none;position:absolute;color:#a33;z-index:0;
	background-color:#118;
	color:#fff;
	opacity:0.7;
	border: solid 2px #fff;
	line-height: 1.1em;
	right:-1em;bottom:-0.5em;
}

div.mainbar {
	margin:0 auto;
	display:block;
	color:#fff;
	text-align:left;
}

div.mainbar .mainbaritem{
	padding:0;
	margin:0 4px 0 0;
	display:inline-block;position:relative;
	overflow:hidden;
	background-color:#889;
}

div.mainbar .mainbaritem img{
	border-bottom: solid 4px #fff;
	position:relative;
}

div.mainbar .mainbaritemtitle{
	font-size:20px;
	font-weight:bold;
	position:block;
    	text-align:left;
	background-color:#138;
	padding:20px;
	vertical-align:middle;
	z-index:1;
}

div.mainbar .mainbaritemtitle a{color:#fff;}
div.mainbar .mainbaritemtitle a:hover{color:#aad;}

div.mainbar .mainbaritemmove{
	position:relative;
}

div.mainbar .mainbaritemadd{
	font-size:14px;
	padding:8px;
	display:none;
	height:90px;
	position:absolute;
	bottom:-90px;
	z-index:0;
}

div.mainbar .mainbaritemadd a{
	padding:5px;
	background-color:#aaa;
	border: solid 1px #bbb;
	color:#138;
}

div.mainbar .mainbaritemadd a:hover{
	padding:5px;
	background-color:#fff;
	border: solid 1px #bbb;
}

div.mainbar .mainbaritemtext a {color:#fff;}
div.mainbar .mainbaritemtext:hover a {color:#fff;text-decoration:underline;}

div#webassembly {
	position:absolute;
	left:5.5em;
	bottom:0.5em;
	padding:0.7em;
	border: solid 1px #fff;
	background-color:#118;
	color:#fff;
	opacity:0.8;
/*	box-shadow: 0 0 3px 2px #555;*/
}

div#webassembly a{
	color:#fff;
	text-decoration:underline;
}

div#webassemblytry{
	display:inline-block;
}

div#webassemblytry a{
	text-decoration:underline;
}

div#webassemblytry a:hover{
	color:#aab;
}

.blue_rect{
	background-color:#e4f0f5;
	padding:0.6em;
	padding-left:1em;
	border-left: solid 5px #3f87a6;
	font-size:1.4em;
	font-weight:bold;
}

.orange_rect{
	background-color:#fff3d4;
	padding:0.2em;
	padding-left:1em;
	border-left: solid 5px #f6b73c;
	font-size:1em;
	font-weight:bold;
}

.orange_rect1{
	background-color:#fff3d4;
	padding:0.2em;
	padding-left:1em;
	border-left: solid 5px #f6b73c;
	font-size:0.9em;
}

.orange_rect2{
	background-color:#fff3d4;
	padding:0.6em;
	padding-left:1em;
	border-left: solid 5px #f6b73c;
	font-size:1.4em;
	font-weight:bold;
}

/*FAQ*/
div.faqcontainer {
	margin:0 0 0.8em 1em;
	display:block;
	background-color:#f9f9fb;
	padding:0.3em;
	border: solid 1px #ddd;
}

div.faqcontainer .faqheader{
	color:#339;
	font-size:1.0em;
	font-weight:bold;
}

div.faqcontainer .faqheader div{
	display: inline-block;
	vertical-align:middle;
   	cursor:pointer;
}

div.faqcontainer .faqheader div:hover{
	text-decoration:underline;
}

div.faqcontainer .faqheader .faqexpand{
	width:25px;
	height:25px;
	display:inline-block;
   	cursor:pointer;
	background: url('/images/arr-down.png') no-repeat center center;
}

div.faqcontainer .faqdetails{
	margin-top:0.7em;
	display:none;
}

div.faqcontainer .faqdetails .faqquestion {
/*	margin-left:25px;*/
	background-color:#fde;
	padding:5px;
	color:#333;
	border: solid 1px #cab;
}

div.faqcontainer .faqdetails .faqresp {
	margin:1.5em 0 0 0;
	padding:0.2em;
/*	background-color:#808;*/
	color:#000;
}

.anybutton {
	display:inline-block;
	background-color:#48c;
	border: solid 1px #37b;
	color:#fff;
	font: bold 1.5em Tahoma, Sans-Serif;
	text-shadow: 0px 1px #777;
	margin-top:0.5em;
	padding:0.2em 1.5em 0.2em 1.5em;
	transition: 0.3s;
}

.anybutton:hover {
	background-color:#fff;
	color:#48c;
}

.anybutton:focus {
	background-color:#fff;
	color:#48c;
}

ul.bswisnew {
	font-size:0.9em; font-family:Verdana,Arial; color:#555; font-weight:300; font-style:normal;
	margin-left:1.5em;
	list-style-type: square;
}

ul.bswisnew li a {
	color:#339;
	margin:0;
	padding:0;
	display:inline-block;
	line-height:normal;
}

ul.bswisnew li a:hover {
	text-decoration: underline;
}

/* TABS */
div.tabback {
	background-color:#335;
	opacity:0.95;
	padding:3px;
}

div.animated {
	visibility:hidden;
}

div.tabctrl {
}

div.tabback div.dspropsheader1 a{
	color:#fff;
}

div.tabback div.dspropsheader1 a:hover{
	text-decoration: underline;
}

div.tabctrl .tabmenu .tabbtn{
	background-color:#ccd;
	transition: 0.3s;
	display: inline-block;
	position:relative;
	padding: 0.7em;
   	cursor:pointer;
	color:#778;
	text-align: center;
	/*border-top: solid 1px #999;*/
	border-left: solid 1px #ccd;
	/*line-height: 1.2em;*/
	border-right: solid 1px #999;
padding-bottom:1.5em;
}

div.tabctrl .tabmenu .tabbtn:not(.active):hover{
	transition:none;
	color:#fff;
	background-color:#bbc;
	border-top: solid 4px #c00;
/*	border-top: solid 1px #999;*/
	border-left: solid 1px #bbc;
	border-right: solid 1px #999;
   	font-weight:bold;
}

div.tabctrl .tabmenu .tabbtn .tabbtntitle{
	margin-top:5px;
	position:absolute;
	margin:0;
	bottom:0;
	left:0;
	width:100%;
	text-align:center;
}

div.tabctrl .tabmenu .active{
	color:#fff;
	background-color:#48c;
   	font-weight:bold;
	border-top: solid 4px #c00;
	border-left: solid 1px #48c;
	border-right: solid 1px #48c;
   	cursor:default;
}

div.tabctrl .tabcontent{
	background-color:#48c;
	padding: 0.7em;
	color:#fff;
	display:none;
	min-height:25em;
}
/* TABS END*/


/*help-tip*/
.help-tip{
	position: relative;
/*	top: 10px;
	left: 10px;*/
	text-align: center;
	background-color: #78c;
	border-radius: 50%;
	width: 14px;
	height: 14px;
	font-size: 10px;
	line-height: 15px;
	cursor: default;
	display:inline-block;
}

.help-tip:before{
	content:'?';
	font-weight: bold;
	color:#fff;
}

.help-tip:hover p{
	display:block;
	transform-origin: 100% 0%;

	-webkit-animation: fadeIn 0.3s ease-in-out;
	animation: fadeIn 0.3s ease-in-out;
}

.help-tip p{    /* The tooltip */
	display: none;
	text-align: left;
	background-color: #448;
	padding: 20px;
	width: 300px;
	position: absolute;
	border-radius: 8px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
	right: -4px;
	color: #FFF;
	font-size: 14px;
	line-height: 1.4;
	z-index:1;
}

.help-tip p a{
	color:#d00;
}

.help-tip p:before{ /* The pointer of the tooltip */
	position: absolute;
	content: '';
	width:0;
	height: 0;
	border:6px solid transparent;
	border-bottom-color:#448;
	right:10px;
	top:-12px;
}

.help-tip p:after{ /* Prevents the tooltip from being hidden */
	width:100%;
	height:40px;
	content:'';
	position: absolute;
	top:-40px;
	left:0;
}

div.orderpaydescr {
	font-size:0.9em;
	font-style:normal;
	font-weight:300;
	display:none;
}

.anyshadow {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 6px 0 rgba(0, 0, 0, 0.19);
}


.clearfix::after {
  content: "";
  clear: both;
  display: table;
}


/*
input.paymenttype {
	display:block;
font-size:0.5em;
}
*/

/*
.dshead1:hover {
	background-color:#fff;
}*/


/*
input[type=checkbox] {
  transform: scale(0.8);
}
*/