@charset "utf-8";
/*@import url("http://fonts.googleapis.com/css?family=Open Sans:300,400,400italic");
common style*/

html, body, div, span {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;/*-webkit-text-size-adjust: none; -ms-text-size-adjust: none;*/
}
img {
	border: 0;
	display: block;
	-ms-interpolation-mode: bicubic;
}
a, a img {
	border: 0;
	outline: none;
	text-decoration: none
}
.bblock {
	display: block;
	clear: both;
	margin: 0 auto;
	border: 0;
}
body, html {
	width: 100% !important;
	height: 100% !important;
}

p {
	margin-bottom: 10px;
}

#builder {
	font-family: Open Sans, Tahoma, Times, serif;
	font-weight: 400;
	color: #fff;
	line-height: 100%;
	overflow: hidden;
	background-image: none;
}
#top-barr, #gongNeng, #pageBox {
	height: 100%;
}
#top-barr {
	position:relative;
	float: left;
	width: 75px;
	z-index:3;
	/*-moz-box-shadow: 3px 0 5px rgba(0,0,0,0.1);
	-webkit-box-shadow: 3px 0 5px rgba(0,0,0,0.1);
	box-shadow: 3px 0 5px rgba(0,0,0,0.1);*/
}
#gongNeng {
	position:absolute;
	float: left;
	left:75px;
	width: 250px;
	z-index:2;
	-moz-box-shadow: 5px 0 10px rgba(0,0,0,0.15);
	-webkit-box-shadow: 5px 0 10px rgba(0,0,0,0.15);
	box-shadow: 5px 0 10px rgba(0,0,0,0.15);
}
#switcher_btn {
font-weight: bold;
padding: 50px 2px;
position: fixed;
margin-left:250px;
top: 40%;
cursor: pointer;
width: 10px;
z-index: 2;
	-moz-box-shadow: 5px 0 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 5px 0 10px rgba(0,0,0,0.2);
	box-shadow: 5px 0 10px rgba(0,0,0,0.2);
}
#tButtonImage{
background-image:url(../images/glyphicons-halflings-white.png);
background-position: -434px -72px;
background-repeat: no-repeat;
color: rgb(51, 51, 51);
cursor: pointer;
display: inline-block;
font-family: 'Open Sans', 'Lucida Grande', Verdana, Tahoma, Arial, sans-serif;
font-size: 12px;
font-style: italic;
font-weight: bold;
height: 14px;
line-height: 14px;
vertical-align: text-top;
width: 14px;
}
#tButtonImage[class=~hGn]{
background-image:url(../images/glyphicons-halflings-white.png);
background-position: -460px -72px;
}
#pageBox {
	margin-left: 325px;
	z-index:1;
}

/*shadow*/
.shadoww {
	-moz-box-shadow: 0 0 20px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.3);
	box-shadow: 0 0 20px rgba(0,0,0,0.3);
}
.shadoww1 {
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.4);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.4);
	box-shadow: 0 0 10px rgba(0,0,0,0.4);
}
#hide-iframe, #temp-iframe {
	text-align: left;
	display: none;
	height: 0;
	margin: 0 auto;
	overflow: auto;
}

/*mask*/
#mask {
	display: block;
	content: ".";
	text-align: center;
	background-color: black;
	background-color: rgba(0,0,0,0.8);
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 9006;
	margin-top: 9999px;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s;
	cursor: hand;
	cursor: pointer;
}
/*style - version4 need*/
.options { /**/
	display: none;
	position: relative;
}
.delete, .delete:hover, .clear, .clear:hover, .duplicate, .duplicate:hover {
	position: absolute;
	color: #fff;
	text-align: center;
	font-weight: 400;
	background-color: #474C5B;
	cursor: pointer;
	display: block;
	float: left;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	transition: all .6s;
	text-decoration: none;
	opacith: 0.9 !important;
}
.delete {
	left: 20px;
	top: 5px;
	width: 26px;
	height: 26px;
	font-size: 36px;
	line-height: 18px;
	border: 2px solid #000;
}
.clear {
	right: 20px;
	top: -4px;
	padding: 10px 0;
	width: 39px;
	height: 20px;
	font-size: 11px;
	line-height: 10px !important;
	border: 3px solid #000;
}
.clear br {
	line-height: 0px;
}
.duplicate {
	margin-left: 53px;
	top: 5px;
	width: 26px;
	height: 26px;
	font-size: 26px;
	line-height: 23px;
	border: 2px solid #000;
}

/*top-barr*/
#top-barr ul, #top-barr ol, #top-barr ul li, #top-barr ol li {
	padding: 0;
	margin: 0;
}
#gongNeng ul, #gongNeng ol, #gongNeng ul li, #gongNeng ol li {
	padding: 0;
	margin: 0;
}
#builderBarr ul, #builderBarr ol, #builderBarr ul li, #builderBarr ol li {
	padding: 0;
	margin: 0;
}
#infoBox ul, #infoBox ol, #infoBox ul li, #infoBox ol li {
	padding: 0;
	margin: 0;
}
#top-barr, #gongNeng, #builderBarr, #infoBox, .center, #mask1 {
	font-family: Open Sans, Tahoma, Times, serif !important;
}
#gongNengBox, #builderBarr, #infoBox, #mask1 {
	font-size: 12px !important;
}
h2 {
	font-size: 18px;
	line-height: 24px;
	margin: 15px 0 10px;
	padding: 0;
	font-weight: bold;
}
h3 {
	font-size: 14px;
	line-height: 21px;
	margin: 15px 0 10px;
	padding: 0;
	font-weight: bold;
}
#top-barr h2, #gongNeng h2, #builderBarr h2, #infoBox h2, .center h2, #mask1 h2 {
	font-size: 18px;
	line-height: 24px;
	margin: 15px 0 10px;
	padding: 0;
	font-weight: bold;
	text-transform: none !important
}
#top-barr h3, #gongNeng h3, #builderBarr h3, #infoBox h3, .center h3, #mask1 h3 {
	font-size: 14px;
	line-height: 21px;
	margin: 15px 0 10px;
	padding: 0;
	font-weight: bold;
	text-transform: none !important
}
.darkk #top-barr h2, .darkk #gongNeng h2, .darkk #builderBarr h2, .darkk #infoBox h2 {
	color: #fff;
}
.darkk #top-barr h3, .darkk #gongNeng h3, .darkk #builderBarr h3, .darkk #infoBox h3 {
	color: #fff;
}
#top-barr ol, #top-barr ul, #gongNeng ul, #gongNeng ol, #builderBarr ul, #builderBarr ol, #infoBox ul, #infoBox ol/*,#iframe ul,#iframe ol*/ {
	list-style: none;
	margin: 0;
	padding: 0;
}
#top-barr ul li, #gongNeng ul li, #builderBarr ul li, #infoBox ul li, #infoBox ol li/*,#iframe ul li,#iframe ol li*/ {
	list-style: none;
}
.lightt #builderBarr, .lightt #projectVersion {
	background-color: #4C5566;
}
.lightt #top-barr {
	background-color: #4C5566;
}
.lightt #gongNeng {
	background-color: #F3F4F6;
}
.lightt #pageBox {
	background-color:#E4E5EA;/*#65707A; #E4E5EA;*/
}
.lightt #accordion-family .in {
	background-color: #65707A;
}
.darkk #builderBarr, .darkk #projectVersion {
	background-color: #25282F;
}
.darkk #top-barr {
	background-color: #25282F;
}
.darkk #gongNeng {
	background-color: #394048;
}
.darkk #pageBox {
	background-color: #575A66;
}
.darkk #accordion-family .in {
	background-color: #575a66;
}
.lightt .gnn_content {
	background-color: #ffffff;
}
.darkk .gnn_content {
	background-color: #2E3436 !important;
	color: #fff !important;
}
#mask1, #mask2 {
	display: block;
	content: ".";
	text-align: center;
	background-color: rgba(0,0,0,0.8);
	height: 100%;
	overflow-y: auto !important;
	position: fixed;
	z-index: 9008;
	margin-top: 9999px;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s;
	cursor: hand;
	cursor: pointer;
}
#mask2 {
	margin-top: 37px;
	margin-left: 325px;
	background-color: rgba(0,0,0,0.5);
}
#mask1 div#guideInner {
	width: 90%;
	line-height: 20px;
	margin: 15px auto;
	float: none;
	text-align: left;
}/**/
#mask1 strong {
	font-style: italic;
}
#mask1 i {
	font-style: italic;
}
#mask1 img {
	max-width: 100%;
	height: auto;
}
#mask1 a:hover {
	color: #fff !important;
	text-decoration: none !important
}
#mask1 li:hover {
	background-color: #4AA2F3 !important;
	cursor: pointer !important;
}
#mask1 td {
	padding: 10px 0;
	vertical-align: top
}
#mask1 td.content {
	padding: 10px;
	vertical-align: top
}
#mask1 table {
	float: left;
	margin-right: 15px;
}
#mask1 div.content {
	display: block;
	clear: both;
}
#mask1 h2, #mask1 h3, #mask1 hr {
	display: block;
	clear: both;
}
#mask1 .ui-tabs-panel.ui-widget-content.ui-corner-bottom ul {
	margin-left: 30px;
}
#mask1.leftdiv {
	width: 325px;
}
#mask1.welcome {
	width: 250px;
}
.ui-tabs .ui-tabs-panel a {
	text-decoration: underline;
}
#mask1 .ui-tabs-panel.ui-widget-content.ui-corner-bottom a:hover {
	color: #368EE0 !important;
	text-decoration: none !important
}
#cancelTabs {
	display: block;
	clear: both;
	float: right;
	margin-bottom: 10px;
	padding: 5px 20px;
	font-size: 13px;
	color: #fff;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
#cancelTabs:hover {
	background-color: #368EE0;
}
#tabs {
	clear: both;
	display: block;
	margin: 0 auto;
}
/*top-barr*/
.menuu {
	display: block;
	width: 75px;
	height: 73px;
	background: url(../images/ui_icons.png) center center no-repeat /*#040404*/;
	cursor: pointer;
	border-bottom: 1px #222727 solid;
	opacity: 0.7;
}
#barrLogo, #barrLogo a {
	background-position: 0 0;
	cursor: pointer;
	border-bottom: 1px #6d7273 solid;
	display: block;
	width: 75px;
	height: 73px;
}
#barrSwithcher {
	background-position: 0 -74px;
}
#choose-module {
	background-position: 0 -148px;
}
#setting-color {
	background-position: 0 -222px;
}
#barrBgChang {
	background-position: 0 -296px;
}
#barrGoogleAPI {
	background-position: 0 -370px;
}
#barrDownload {
	background-position: 0 -444px;
}
#barrGuide {
	background-position: 0 -518px;
}
#barrCopyRight {
	background-position: 0 -592px;
}
.menuu img {
	margin: 2px;
}
.menuu.active {
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
	opacity: 1;
}
.menuu:hover {
	background-color: #c64848 !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
	opacity: 1;
	border-bottom-color: #c64848;
}
#top-bar-box {
	width: 75px;
	height: 100%;
	padding: 0;
}
/*list and li style*/
li.small-title {
	height: 34px !important;
	padding: 0 10px !important;
	font-size: 13px;
	line-height: 34px !important;
	text-align: left;
}
li.small-title span {
	width: 23px;
	height: 17px;
	background: url(../images/menu-icon.png) no-repeat;
	display: inline-block;
	float: right;
	margin: 9px 0 0;
}
li.menu-list {
	height: 30px !important;
	padding: 0 20px !important;
	font-size: 12px;
	line-height: 30px !important;
	text-align: left;
	cursor: pointer;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s;
}
li.menu-list span {
	width: 14px;
	height: 14px;
	background-image:url(../images/glyphicons-halflings-white.png);
	background-position: -460px -72px;
	background-repeat: no-repeat;
	display: inline-block;
	float: left;
	margin: 7px 0 0;
}
li.menu-list.last {
	background-image: none;
}
li.menu-list:hover {
	background-color: #111 !important;
}
li.menu-list.active a {
	color: #fff !important;
}
/*gongneng*/
#projectVersion {
	display: block;
	padding: 8px 10px 9px;
	font-size: 12px;
	font-weight: 400;
	line-height: 20px;
	background-color: #25282F;
	text-align: center
}
.gnn {
	width: 244px;
	margin: 3px;
}
#gongNengBox {
	overflow-x: hidden;
	overflow-y: auto;
}
.accordion { /*position:relative;******************/
	overflow: auto;
	width: 236px;
	display: inline-block;
	margin: 4px !important;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
/*screenshot and divider*/
#screenshot {
	position: absolute;
	background: #222;
	padding: 5px;
	display: none;
	color: #fff;
	width: 452px;
	border: 1px solid #13ceeb;
	z-index: 1003
}
.dividerr {
	background: url(../images/menu-divider.png) bottom repeat-x;
}
/*-----------page box------------*/
#builderBarr {
	height: 37px;
	overflow-y: hidden;
	background: url(../images/menu-divider.png) center bottom repeat-x;
text-align:
}
#builderBarr .center {
	text-align: center;
}
#infoBox {
	height: 60px;
	overflow-y: hidden;
}
#info-content {
	margin-top:6px;
	text-align: center !important;
}
#editCL {
	display: inline-block;
	padding: 2px 0 2px 20px;
	margin-top:6px;
	float: left;
}
#editTitle {
	display: block;
	height: 12px;
	font-size: 9px;
	line-height: 12px;
	background-color: #000;
	text-align: center;
	color: #E6E8FA;
	border-bottom: #555 1px solid;
}
#editProject {
	display: inline-block;
	padding: 2px 20px 2px 0px;
	margin-top:6px;
	float: right;
}
#projectTitle {
	display: block;
	height: 12px;
	font-size: 9px;
	line-height: 12px;
	background-color: #000;
	text-align: center;
	color: #E6E8FA;
	border-bottom: #555 1px solid;
}
#editContentButton, #editLayoutButton, #saveProject, #uploadProject {
	float: left;
	height: 20px;
	line-height: 20px;
	font-size: 11px;
	letter-spacing: -0.02em;
	padding: 0 15px !important;
	text-align: center !important;
	background-color: #2E3436;
	cursor: pointer;
	color: #aaa;
}
#saveProject, #uploadProject {
	height: 20px;
	line-height: 20px;
	padding: 0 21px !important;
}/**/
#editContentButton.active, #editLayoutButton.active, #saveProject.active, #uploadProject.active {
	color: #fff;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s
}
#editContentButton:hover, #editLayoutButton:hover, #saveProject:hover, #uploadProject:hover {
	color: #fff;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s
}
#editTitle, #projectTitle {
	-moz-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
}
#editLayoutButton, #uploadProject { 
	-moz-border-radius: 0 0 0 4px;
	border-radius: 0 0 0 4px;
}
#editContentButton, #saveProject {
	-moz-border-radius: 0 0 4px 0;
	border-radius: 0 0 4px 0;
}/**/
#info-content {
	margin: 0 auto;
	margin-top:6px;
	height: 37px;
	line-height: 37px;
	text-align: center;
	font-size: 11px;
	font-weight: 300;
	display: block;
	overflow: hidden;
	padding: 0 5px;
}
.lightt #info-content {color:#333;}
#info-content span {
	color: #92eeff;
}
.lightt #info-content span {
	color: #069bfb;
}
#info-content > div {
	line-height: 18px !important;
}
#template-page-box, #frameContainer {
	width:100%;
	margin: 0 auto;
	text-align: center;
}
#iframe {
	margin: 0 auto;
	width:838px;
	overflow: auto;
	text-align: left;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
#pls-buy {
	display: box;
	width: 500px;
	margin: 150px auto 0;
}
#pls-buy div {
	padding: 10px !important;
	text-align: center !important;
	font-size: 30px !important;
	font-weight: 400;
	line-height: 40px;
	color: #ddd;
}
.this-module {
}
.ui-progressbar {
	position: relative;
}
.progress-label {
	position: absolute;
	left: 50%;
	top: 4px;
	font-weight: bold;
	text-shadow: 1px 1px 0 #fff;
}
.placehold {
	paddin: 5px;
	background-color: #09314d;
	background: url(../images/green_dust_scratch.png) repeat;
	list-style-type: none !important;
	margin: 0px !important;
	opacity: 0.8;
}
.placehold li {
	list-style-type: none;
}
.placehold ul {
	list-style-type: none;
}
/*bg radius*/
#bg-radius-box {
	display: none;/**/
}
#bg-radius-box .menu-list {
	padding: 0 10px !important;
}
#accordion-pattern, #accordion-url, #accordion-radius {
	margin-bottom: 5px;
	display: none;
}
#accordion-radius {
	background-color: #368EE0;
	display: block;/**/
}
#urlC, #patternC, #radiusC {
	cursor: pointer;
}
#accordion-url li.menu-list, #accordion-pattern li.menu-list, #accordion-radius li.menu-list {
	padding: 0 10px !important;
	overflow-x: hidden;
}
#accordion-radius li {
	cursor: pointer;
}
#accordion-radius input {
	width: 40px;
	height: 18px;
	line-height: 18px;
	border: none;
	color: #fff;
	vertical-align: top;
	background-color: transparent;
	margin: 0;
	padding: 0;
	text-align: center;
}
#accordion-radius div {
	height: 15px;
	overflow: hidden;
}
.ChangeBGnow {
	float: right;
	margin-top: 3px;
	display: inline-block;
	background: #121314;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	color: #ffffff !important;
	font-size: 12px;
	padding: 4px 8px 4px 8px !important;
	text-decoration: none;
}
.ChangeBGnow:hover {
	text-decoration: none !important;
}
#am1, #am2, #am3, #am4, #am5, #am6, #am7, #am8, #am9, #am10, #am11, #am12 {
	width: 40px;
	height: 20px !important;
	display: inline-block;
	float: right;
	margin-top: 4px;
	background-image: none;
	background-color: #111;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
#accordion-url div div {
	display: inline-block;
	width: 146px !important;
	height: 30px !important;
	float: left;
}
#accordion-url .in {
	padding-right: 5px;
	background-color: #F6A828;
}
#accordion-url input {
	background-color: #fff;
	color: #000;
	font-weight: 300;
	float: left;
	width: 100% !important;
	font-size: 12px !important;
	line-height: 30px !important;
	height: 30px !important;
	padding: 0 10px !important;
	border: none;
	border-right: #F6A828 1px solid !important;
}
/*google API setting v3.0*/
#font-setting-box {
	display: none;/**/
}
#font-setting-box .menu-list {
	padding: 0 10px !important;
}
#accordion-api, #accordion-family, #accordion-font-size {
	margin-bottom: 5px;
	display: none;
}/*v3.0*/
#accordion-api .soo {
	background-color: rgba(0,0,0,0.2);
	width: 93%;
	padding: 5px !important;
	display: block;
	margin: 5px auto;
	text-align: center;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
#accordion-font-size {
	background-color: #368EE0;
	display: block;/**/
}
#ligAPI, #ligFf, #ligFs {
	cursor: pointer;
}/*v3.0*/
#accordion-family li.menu-list, #accordion-font-size li.menu-list, #accordion-api li.menu-list {/*v3.0*/
	padding: 0 10px !important;
	overflow-x: hidden;
}
#accordion-font-size li {
	cursor: pointer;
}
#accordion-font-size input {
	width: 40px;
	height: 18px;
	line-height: 18px;
	border: none;
	color: #fff;
	vertical-align: top;
	background-color: transparent;
	margin: 0;
	padding: 0;
	text-align: center;
}
#accordion-font-size div {
	height: 15px;
	overflow: hidden;
}
.ChangeAPInow {
	float: right;
	margin-top: 3px;
	display: inline-block;
	background: #121314;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	color: #ffffff !important;
	font-size: 12px;
	padding: 4px 8px 4px 8px !important;
	text-decoration: none;
}
.ChangeAPInow:hover {
	text-decoration: none !important;
}
#am1, #am2, #am3, #am4, #am5, #am6, #am7, #am8, #am9 {
	width: 40px;
	height: 20px !important;
	display: inline-block;
	float: right;
	margin-top: 4px;
	background-image: none;
	background-color: #111;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
#accordion-api div div {
	display: inline-block;
	width: 146px !important;
	height: 30px !important;
	float: left;
}
#accordion-api .in {
	padding-right: 5px;
	background-color: #F6A828;
}
#accordion-api input {
	background-color: #fff;
	color: #000;
	font-weight: 300;
	float: left;
	width: 100% !important;
	font-size: 12px !important;
	line-height: 30px !important;
	height: 30px !important;
	padding: 0 10px !important;
	border: none;
	border-right: #F6A828 1px solid !important;
}
/*switcher*/
#switcher_box {
	display: none;
}
#switcher_box div {
	overflow: auto;
}
#switcher_box ul {
	clear: both;
	display: block;
}
#switcher_box div div {
	padding: 10px !important;
}
#switcher_box div div ul li {
	display: inline-block;
	list-style: none;
	float: left;
	width: 27px;
	height: 27px;
}
#switcher_box div div ul li#li-index {
	width: 54px;
}
#layout_switcher li a {
	display: block;
	font-size: 12px;
	font-family: Open Sans, Tahoma, Times, serif;
	font-weight: 300;
	margin: 3px;
	width: 19px;
	height: 19px;
	color: #eee;
	line-height: 19px;
	text-align: center;
	border: 1px solid #666;
	opacity: 1 !important;
	background-color: #444C4F;
	cursor: hand;
	cursor: pointer
}
#layout_switcher li a:hover {
	background: #f4f4f4 !important;
	text-decoration: none !important;
	color: #111 !important;
	opacity: 1 !important;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s
}
#layout_switcher li a#index-page {
	width: 46px;
}/**/
.active_layout {
	background: #f4f4f4 !important;
	width: 23px !important;
	height: 23px !important;
	margin: 0px !important;
	line-height: 23px !important;
	color: #111 !important;
	opacity: 1 !important;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s
}
#index-page[class~=active_layout]{
	width: 50px !important;
}/**/
#theme_switcher a {
	display: block;
	float: left;
	width: 19px;
	height: 19px;
	margin: 3px;
	cursor: hand;
	cursor: pointer;
	border: 1px solid #000
}
.active_theme {
	width: 23px !important;
	height: 23px !important;
	margin: 0px !important;
	opacity: 1 !important;
	background-size: 100% 100% !important;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	transition: all .2s
}
#theme_switcher a:hover {
	text-decoration: none !important;
	opacity: 1 !important;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	transition: all .2s
}
/*theme-picker*/
   .theme1{background: url(../colorpanel/images/color-panel_101.gif); background-size:100% 100%;}
   .theme2{background: url(../colorpanel/images/color-panel_84.gif); background-size:100% 100%;}
   .theme3{background: url(../colorpanel/images/color-panel_82.gif); background-size:100% 100%;}
   .theme4{background: url(../colorpanel/images/color-panel_80.gif); background-size:100% 100%;}
   .theme5{background: url(../colorpanel/images/color-panel_79.gif); background-size:100% 100%;}
   .theme6{background: url(../colorpanel/images/color-panel_81.gif); background-size:100% 100%;}
   .theme7{background: url(../colorpanel/images/color-panel_72.png); background-size:100% 100%;}
   .theme8{background: url(../colorpanel/images/color-panel_90.gif); background-size:100% 100%;}
   .theme9{background: url(../colorpanel/images/color-panel_88.gif); background-size:100% 100%;}
   .theme10{background: url(../colorpanel/images/color-panel_86.gif); background-size:100% 100%;}
   .theme11{background: url(../colorpanel/images/color-panel_85.gif); background-size:100% 100%;}
   .theme12{background: url(../colorpanel/images/color-panel_87.gif); background-size:100% 100%;}
   .theme13{background: url(../colorpanel/images/color-panel_78.gif); background-size:100% 100%;}
   .theme14{background: url(../colorpanel/images/color-panel_96.gif); background-size:100% 100%;}
   .theme15{background: url(../colorpanel/images/color-panel_94.gif); background-size:100% 100%;}
   .theme16{background: url(../colorpanel/images/color-panel_92.gif); background-size:100% 100%;}
   .theme17{background: url(../colorpanel/images/color-panel_91.gif); background-size:100% 100%;}
   .theme18{background: url(../colorpanel/images/color-panel_93.gif); background-size:100% 100%;}
/*.theme7{background: url(../colorpanel/images/color-panel_06.gif); background-size:100% 100%;}
   .theme8{background: url(../colorpanel/images/color-panel_30.gif); background-size:100% 100%;}
   .theme9{background: url(../colorpanel/images/color-panel_117.png); background-size:100% 100%;}
   .theme10{background: url(../colorpanel/images/color-panel_127.png); background-size:100% 100%;}
   .theme11{background: url(../colorpanel/images/color-panel_121.png); background-size:100% 100%;}
   .theme12{background: url(../colorpanel/images/color-panel_136.png); background-size:100% 100%;}
   .theme13{background: url(../colorpanel/images/color-panel_115.png); background-size:100% 100%;}
   .theme14{background: url(../colorpanel/images/color-panel_121.png); background-size:100% 100%;}
   .theme15{background: url(../colorpanel/images/color-panel_116.png); background-size:100% 100%;}
   .theme16{background: url(../colorpanel/images/color-panel_122.png); background-size:100% 100%;}
   .theme17{background: url(../colorpanel/images/color-panel_117.png); background-size:100% 100%;}
   .theme18{background: url(../colorpanel/images/color-panel_123.png); background-size:100% 100%;}
   .theme19{background: url(../colorpanel/images/color-panel_118.png); background-size:100% 100%;}
   .theme20{background: url(../colorpanel/images/color-panel_124.png); background-size:100% 100%;}
   .theme21{background: url(../colorpanel/images/color-panel_119.png); background-size:100% 100%;}
   .theme22{background: url(../colorpanel/images/color-panel_125.png); background-size:100% 100%;}
   .theme23{background: url(../colorpanel/images/color-panel_120.png); background-size:100% 100%;}
   .theme24{background: url(../colorpanel/images/color-panel_126.png); background-size:100% 100%;}
   .theme25{background: url(../colorpanel/images/color-panel_127.png); background-size:100% 100%;}
   .theme26{background: url(../colorpanel/images/color-panel_133.png); background-size:100% 100%;}
   .theme27{background: url(../colorpanel/images/color-panel_128.png); background-size:100% 100%;}
   .theme28{background: url(../colorpanel/images/color-panel_134.png); background-size:100% 100%;}
   .theme29{background: url(../colorpanel/images/color-panel_129.png); background-size:100% 100%;}
   .theme30{background: url(../colorpanel/images/color-panel_135.png); background-size:100% 100%;}
   .theme31{background: url(../colorpanel/images/color-panel_130.png); background-size:100% 100%;}
   .theme32{background: url(../colorpanel/images/color-panel_136.png); background-size:100% 100%;}
   .theme33{background: url(../colorpanel/images/color-panel_131.png); background-size:100% 100%;}
   .theme34{background: url(../colorpanel/images/color-panel_137.png); background-size:100% 100%;}
   .theme35{background: url(../colorpanel/images/color-panel_132.png); background-size:100% 100%;}
   .theme36{background: url(../colorpanel/images/color-panel_138.png); background-size:100% 100%;}  */
   
   
/*modules*/
#choose-module-box {
	display: none;/**/
	margin: 3px;
	width: 244px;
	overflow: hidden;/**/
}
#accordion-module {
	overflow: hidden;
}
#accordion-module div {
	font-size: 12px;
	/*text-align:center;*/
	padding: 10px 5px !important;
	overflow-x: hidden;/**/
	overflow-y: auto;
}
#choose-module-box #accordion-module div ul {
/*text:center;*/
}
#choose-module-box #accordion-module div li img {
	cursor: pointer;
	width: 200px;
	padding: 4px !important;
	height: auto;
}
/* pattern css */
.pattern {
	padding: 10px 10px !important;
	text-align: center;
	clear: both;
	overflow: auto;
}
.pattern li {
	display: none;
	width: 40px;
	height: 40px;
	padding: 2px !important;
	border: #6a787e 1px solid;
	margin: 1px !important;
	list-style: none;
	text-align: center;
}
.pattern li:hover, .pattern li.active {
	display: none;
	width: 40px;
	height: 40px;
	padding: 2px !important;
	margin: 1px !important;
	list-style: none;
	text-align: center;
}
.pattern li.active {
	display: none;
	width: 40px;
	height: 40px;
	padding: 2px !important;
	margin: 0px !important;
	list-style: none;
	text-align: center;
}
.patternItem div {
	width: 40px;
	height: 40px;
	cursor: pointer;
	background-image: url(../pattern/thumbnail/texture.png)
}
/*color */
#color-setting-box {
	display: none;/**/
}
#color-setting-box .menu-list {
	padding: 0 10px !important;
}
#accordion-bg li.menu-list, #accordion-title li.menu-list, #accordion-fonts li.menu-list {
	padding: 0 10px !important;
	overflow-x: hidden;
}
#accordion-bg, #accordion-title, #accordion-fonts {
	margin-bottom: 5px;
	display: none;
}
#accordion-bg {
	display: block;
}
#bbColor, #ttColor, #fsColor {
	cursor: pointer;
}
#accordion-bg input, #accordion-title input, #accordion-fonts input {
	width: 50px;
	height: 18px;
	line-height: 18px;
	border: #666666 1px solid;
	padding: 0 5px !important;
	display: inline-block;/*-webkit-border-radius:6px; border-radius:6px; text-align:center !important;*/
}
.colorPicker {
	width: 60px;
	height: 20px;
	display: inline-block;
	float: right;
	background-image: none;
	margin: auto auto;
}
.picker {
	width: 195px;
	height: 195px;
	margin: auto;
}
div#color-none, div#color-none1 {
	padding: 0 5px !important;
	line-height: 16px;
	height: 16px;
	font-size: 10px;
	display: block;
	float: right;
	margin: 7px 5px 7px 0 !important;
	text-decoration: none;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
div#color-none:hover, div#color-none1:hover {
	background-color: #111 !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}
/* download */
#download-box {
	display: none;/**/
}
#preheader-box li.menu-list {
	padding: 0 !important;
}
#googleAPI-box li.menu-list {
	padding: 0 !important;
}
#file-name-box li.menu-list {
	padding: 0 0 0 10px !important;
}
#file-name-box input {
	display: inline-block;
	background-color: #fff;
	font-family: Open Sans, Tahoma, Times, serif;
	color: #394e41;
	font-weight: 400;
	float: right;
	font-size: 12px;
	width: 148px;
	line-height: 28px;
	height: 28px;
	padding: 0 10px !important;
	border: #848F95 1px solid !important;
}
#preheader-box textarea {
	display: inline-block;
	opacity: 1;
	color: #394e41;
	font-family: Open Sans, Tahoma, Times, serif;
	font-weight: 400;
	font-size: 12px;
	width: 222px;
	line-height: 28px;
	height: 28px;
	padding: 0 10px !important;
	border: #C4CBCE 1px solid !important;
	overflow: auto;
	resize: none;
	margin: 0;
}
#preheader {
	background-color: #fff;
}
#preheader-box {
	z-index: 2005;
	opacity: 1;
	margin-bottom: 5px;
}
#code {
	margin-bottom: 5px !important;
}
#code-in {
	clear: both;
	overflow: auto;
	text-align: center;
	padding: 15px 0 !important;
}
.lightt #code-in .gnn_content.active, .darkk #code-in .gnn_content.active {
	background-color: #368EE0 !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}
#file-name-box {
	margin-bottom: 15px !important;
	background-color: #368EE0;
}
/*#download-box li.menu-list.active { background-color: #368EE0; }*/
#preheader-input {
	width: 244px;
	height: 30px;
}
#file-name-input {
	width: 150px;
	height: 20px;
	display: inline-block;
	float: right;
	background-image: none;
	margin: auto auto;
}
#inlineCSS {
	width: 65px;
	height: 65px;
	padding: 7px !important;
	display: inline-block;
	margin: 15px 1px 15px;
	float: left;
	text-align: center;
	-moz-border-radius: 60px;
	border-radius: 60px;/*border:#C4CBCE 1px solid;*/
	cursor: pointer;
	-moz-box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset;
	-webkit-box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset;
	box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset
}
#mailchimp {
	width: 65px;
	height: 65px;
	padding: 7px !important;
	display: inline-block;
	float: left;
	margin: 15px 1px 15px;
	text-align: center;
	-moz-border-radius: 60px;
	border-radius: 60px;/*border:#C4CBCE 1px solid;*/
	cursor: pointer;
	-moz-box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset;
	-webkit-box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset;
	box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset
}
#campaignmonitor {
	width: 65px;
	height: 65px;
	padding: 7px !important;
	display: inline-block;
	float: left;
	margin: 15px 1px 15px;
	text-align: center;
	-moz-border-radius: 60px;
	border-radius: 60px;/*border:#C4CBCE 1px solid;*/
	cursor: pointer;
	-moz-box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset;
	-webkit-box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset;
	box-shadow: 3px 3px 3px rgba(153,153,153,0.5) inset
}
#download-btn {
	padding: 10px 20px !important;
	width: 100px;
	float: none;
	margin: 30px auto 30px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	cursor: pointer;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
}
#download-btn:hover {
	background-color: #C64848;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	transition: all .2s
}
#Tvote {
	margin: 10px;
	width: 204px;
	padding: 10px !important;
	font-size: 12px;
	line-height: 15px;
	color: #394e41;
	border: #C4CBCE 1px solid;
	text-align: center !important;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-moz-border-radius: 15px;
	border-radius: 15px;
}
.brounded {
	-moz-border-radius: 20px;
	border-radius: 20px;
}
/* copyright */
#builder-info {
	display: none;
}
#builder-info.gnn {
	width: 204px;
	clear: both;
	padding: 20px !important;
	text-align: center !important;
	margin-top: 17px !important;
}
#copyright {
	width: 204px;
	text-align: left !important;
}
#copyright div {
	width: 164px;
	padding: 20px !important;
	font-size: 12px;
	line-height: 20px;
	color: #394e41;
	border: #C4CBCE 1px solid;
	text-align: center !important;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-moz-border-radius: 15px;
	border-radius: 15px;
	margin-bottom: 20px !important;
}
#socialB > div {
	padding: 5px !important;
}
.lightt #copyright div {
	background-color: #fff;
}
.darkk #copyright div {
	background-color: #2E3436;
	color: #fff;
}
/* guide */
#guide-box.gnn {
	width: 204px;
	clear: both;
	padding: 20px;
	text-align: center;
	margin-top: 17px !important;
}
#guideA {
	width: 204px;
}
#guideAtitle, #builderNote, #guideInfo {
	padding: 20px !important;
	font-size: 13px;
	line-height: 21px;
	color: #394e41;
	border: #C4CBCE 1px solid;
	text-align: center !important;
	margin-bottom: 15px;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-moz-border-radius: 15px;
	border-radius: 15px;
}
#builderNote, #guideInfo {
	padding: 10px 20px !important;
	margin-top: 30px;
	margin-bottom: 0;
}
#builderNote, #guideInfo {
	margin-top: 10px;
}
#guideInfo {
	font-size: 12px;
	line-height: 13px;
	padding: 10px 5px 5px !important;
	letter-spacing: -0.01em;
	border: #C4CBCE 1px solid;
	display: none;
}
#guideInfo .newItem {
	font-size: 13px;
	line-height: 18px;
	font-weight: 500;
	color: #ed7102;
}
#guideInfo .upItem {
	font-size: 13px;
	line-height: 18px;
	font-weight: 500;
	color: #06c6a9;
}
#seeGuide {
	padding: 8px 20px !important;
	display: inline-block;
	-moz-border-radius: 10px;
	border-radius: 10px;
	cursor: pointer;
}
/*#cancelGuide{
	padding:8px 20px;display:inline-block;background-color:#333;
	-moz-border-radius:10px;
	border-radius:10px; cursor:pointer;margin-left:10px;}*/
#seeGuide:hover {
	background-color: #C64848;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	transition: all .2s
}
/*#cancelGuide:hover{background-color:#888;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	transition: all .2s}*/
/* device */
#browser {
	display: block;
	margin: 0 100px !important;
	height: 37px;
	line-height: 37px;
	float: left;
	font-size: 11px;
	color: #eee
}
.ie7 #browser, ie8 #browser {
	display: block;
	margin: 0 100px !important;
}/**/
.ie7 #show-device, .ie8 #show-device {
	display: none !important;
	visibility: hidden !important
}/**/
li#show-device {
	display: inline-block;
	margin: 0 auto;
	height: 37px;
	paddin: 0;
	overflow-y: hidden;/**/
}
#show-device ol#device-list li {
	float: left
}
#show-device ol li.title {
	background-image: url(../images/ui-icons.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	padding: 0 9px 0 11px !important;
	color: #B9B9B9;
	font-size: 12px;
	height: 37px;
	line-height: 37px;
	max-width: 160px
}
#show-device ol#device-list li a {
	display: block;
	text-indent: -9999px;
	background-image: url(../images/ui_icons.png);
	background-repeat: no-repeat
}
a.pc {
	width: 46px;
	height: 36px;
	background-position: 0 -666px;
	opacity: 0.6;
}
a.pc:hover, a.pc.active {
	opacity: 1;
	background-color: #575A66;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}
.lightt a.pc:hover, .lightt a.pc.active {
	background-color: #65707A;
}
a.ipad {
	width: 46px;
	height: 36px;
	background-position: 0 -846px;
	opacity: 0.6;
}
a.ipad:hover, a.ipad.active {
	opacity: 1;
	background-color: #575A66;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}
.lightt a.ipad:hover, .lightt a.ipad.active {
	background-color: #65707A;
}
a.ipad-landscape {
	width: 46px;
	height: 36px;
	background-position: 0 -666px;
	opacity: 0.6;
}
a.ipad-landscape:hover, a.ipad-landscape.active {
	opacity: 1;
	background-color: #575A66;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}
.lightt a.ipad-landscape:hover, .lightt a.ipad-landscape.active {
	background-color: #65707A;
}
a.iphone {
	width: 46px;
	height: 36px;
	background-position: 0 -702px;
	opacity: 0.6;
}
a.iphone:hover, a.iphone.active {
	opacity: 1;
	background-color: #575A66;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}
.lightt a.iphone:hover, .lightt a.iphone.active {
	background-color: #65707A;
}
a.mobile-360 {
	width: 46px;
	height: 36px;
	background-position: 0 -774px;
	opacity: 0.6;
}
a.mobile-360:hover, a.mobile-360.active {
	opacity: 1;
	background-color: #575A66;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}
.lightt a.mobile-360:hover, .lightt a.mobile-360.active {
	background-color: #65707A;
}
a.iphone-landscape {
	width: 46px;
	height: 36px;
	background-position: 0 -738px;
	opacity: 0.6;
}
a.iphone-landscape:hover, a.iphone-landscape.active {
	opacity: 1;
	background-color: #575A66;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}
.lightt a.iphone-landscape:hover, .lightt a.iphone-landscape.active {
	background-color: #65707A;
}
a.mobile-360-landscape {
	width: 46px;
	height: 36px;
	background-position: 0 -810px;
	opacity: 0.6;
}
a.mobile-360-landscape:hover, a.mobile-360-landscape.active {
	opacity: 1;
	background-color: #575A66;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}
.lightt a.mobile-360-landscape:hover, .lightt a.mobile-360-landscape.active {
	background-color: #65707A;
}
/* list */

li#barrPurchase {
	float: right;
	display: inline-block;
	height: 20px;
	padding: 8px 10px 7px !important;
	text-align: right !important;
	background: none !important;
}
#container {
	display: none;
	margin-left: 0px;
	padding: 5px 10px 0 !important;
	position: fixed;
	width: 690px;
	margin-top: -1px;
	border-top: 0 !important;
	background-color: rgba(0,0,0,0.85);
	font-size: 12px;
	font-weight: bold;
	border: 1px #595B60 solid;
	border-top: none;
	z-index: 1003;
}
.center ul li ul {
	width: 230px;
	overflow: auto;
	padding: 0 0;
	float: left;
}
.center ul li ul li {
	border-bottom: 1px #333 dotted;
	font-size: 12px;
	font-weight: 400 !important;
	vertical-align: middle;
	height: 20px;
	line-height: 20px;
	padding: 8px 0 !important;
	text-align: left;
	position: relative;
	overflow: hidden;
	cursor: pointer
}
.center ul li ul li a {
	display: inline-block;
	width: 230px;
	color: #B9B9B9;
	float: left;
	overflow: hidden;
	cursor: pointer
}
.center ul li ul li a:hover {
	color: #fff !important;
	text-decoration: none !important;
}
li#chooseTheme {
	display: inline-block;
	float: right;
	height: 20px;
	font-size: 12px;
	color: #B9B9B9;
	line-height: 20px;
	padding: 0 10px !important;
	text-align: right !important;
}
li#lightt, li#darkk, li#bluee, li#orangee, li#teall, li#redd{
	display: inline-block;
	float: right;
	width: 18px;
	height: 18px;
	margin: 0 5px 0 0 !important;
	border: #8d8d8d 2px solid !important;
	-moz-border-radius: 10px;
	border-radius: 10px;
	cursor: pointer
}
li#darkk {
	background-color: #000000;
}
li#lightt {
	background-color: #dce2e4;
}
li#lightt:hover, li#lightt.active {
	border: #fff 2px solid !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
li#darkk:hover, li#darkk.active {
	border: #fff 2px solid !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
li#bluee:hover, li#orangee:hover, li#teall:hover, li#redd:hover,li#bluee.active, li#orangee.active, li#teall.active, li#redd.active{
	border: #fff 2px solid !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
li#purchase {
	padding: 1px 15px !important;
	display: block;
	float: right;
	height: 20px;
	line-height: 20px;
	font-size: 12px;
	color: #010101;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
li#purchase:hover {
	background-color: #368EE0;
}
li#purchase a {
	color: #fff;
	text-decoration: none !important;
}
#browser {
	display: none;
	margin: 0 3px;
	height: 37px;
	line-height: 37px;
	float: left;
	font-size: 11px;
	color: #eee
}
.darkk li#template {
	display: inline-block;
	font-size: 12px;
	color: #919396;
	float: left;
	text-align: left
}
.lightt li#template {
	display: inline-block;
	font-size: 12px;
	color: #fff;
	float: left;
	text-align: left
}
li#template a:hover {
	text-decoration: none !important;
}
a#template-list {
	margin-left: 0px;
	background: url(../images/switch.png) 100% 100%;
	width: 230px;
	display: block;
	padding: 0 10px 0 10px !important;
	color: #B9B9B9;
	font-size: 12px;
	font-weight: 400;
	height: 37px;
	line-height: 37px;
	position: relative;
	text-decoration: none;
}
a#template-list:hover, #template-list:active, .highlighted {
	color: #fff !important;
}
a#template-list.noc {
	background-image: none;
}
.id {
	float: left;
	display: inline-block
}
.newItem {
	color: #ff7800;
	font-style: italic;
}
.upItem {
	color: #08e8c6;
	font-style: italic;
}
span.category {
	position: relative;
	display: inline-block;
	float: right !important;
	font-size: 10px !important;
	line-height: 18px;
	background-color: #222;
	color: #ddd;
	padding: 1px 5px !important;
	border: 1px solid #333;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;/**/
}
.center ul li ul li span.newLab {
	color: #fff;
	font-size: 10px !important;
	background-color: #ff7800
}
.center ul li ul li span.upLab {
	color: #fff;
	font-size: 10px !important;
	background-color: #08c6a9
}
.center ul li ul li span.landing {
	color: #111;
	font-size: 10px;
	margin-right: 10px !important;
	background-color: #39a878;
}
.center ul li ul li span.email1 {
	color: #111;
	font-size: 10px;
	margin-right: 10px !important;
	background-color: #13ceeb;
}
.center ul li ul li span.email2 {
	color: #111;
	font-size: 10px;
	margin-right: 10px !important;
	background-color: #f57481;/*text-shadow:0 1px 1px #53e3f9;*/
}
.center ul li ul li span.wordpress {
	color: #111;
	font-size: 10px;
	margin-right: 10px !important;
	background-color: #e84d5c;
}
.center ul li ul li span.htmlsite {
	color: #111;
	font-size: 10px;
	margin-right: 10px !important;
	background-color: #ed7c0d;
}
/* farbtastic*/

.farbtastic {
	position: relative;
}
.farbtastic * {
	position: absolute;
	cursor: crosshair;
}
.farbtastic, .farbtastic .wheel {
	width: 195px;
	height: 195px;
}
.farbtastic .color, .farbtastic .overlay {
	top: 47px;
	left: 47px;
	width: 101px;
	height: 101px;
}
.farbtastic .wheel {
	background: url(../images/wheel.png) no-repeat !important;
	width: 195px;
	height: 195px;
}
.farbtastic .overlay {
	background: url(../images/mask.png) no-repeat !important;
}
.farbtastic .marker {
	width: 17px;
	height: 17px;
	margin: -8px 0 0 -8px;
	overflow: hidden;
	background: url(../images/marker.png) no-repeat !important;
}
/*.cke{left:345px;right:20px;margin:0 !important;padding:0 !important;}
 media */
#uploadFilebox, #saveProjectbox {
	display: none;
	width: 310px;
	border-radius: 3px;
	position: fixed;
	top: 80px;
	float: right;
	right: 18px !important;
	z-index: 3009;
	overflow-y: auto;
	overflow-x: hidden;
}
#upload, #saveprojectForm {
	font-family: 'Open Sans', sans-serif;
	background-color: #373a3d;
	background-image: -webkit-linear-gradient(top, #373a3d, #313437);
	background-image: -moz-linear-gradient(top, #373a3d, #313437);
	background-image: linear-gradient(top, #373a3d, #313437);
	width: 250px;
	padding: 30px !important;
	border-radius: 3px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
#drop, #PjF {
	background-color: #2E3436;
	padding: 20px 10px !important;
	margin-bottom: 30px;
	border: 10px solid rgba(0, 0, 0, 0.8);
	border-radius: 3px;
	border-image: url('../images/border-image.png') 25 repeat;
	text-align: center;
	/*text-transform: uppercase;*/
	font-size: 16px;
	font-weight: bold;
	color: #7f858a;
}
#PjF {
	margin-bottom: 0px;
}
#drop a, #PjF a {
	padding: 8px 20px;
	display: inline-block;
	-moz-border-radius: 10px;
	border-radius: 10px;
	cursor: pointer;
	color: #fff;
	font-size: 12px;
	display: inline-block;
	margin-top: 12px;
	line-height: 1;
	font-weight: 400;
	text-decoration: none !important;
}
#drop a:hover, #PjF a:hover {
	background-color: #C64848;
	color: #fff !important;
	text-decoration: none !important;
}
/*#drop input{
    display:none;
}*/
#PjF input {
	background-color: #000;
	padding: 12px 15px;
	width: 100px;
	color: #E6E8FA;
	text-align: center;
	font-size: 13px;
	border-radius: 2px;
	border: #555 1px solid;
	/*border:none;*/
	cursor: text;
	display: inline-block;
	margin-top: 12px;
	line-height: 1;
	text-decoration: none !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
#PjF input:hover, #PjF input:focus {
	background-color: #E6E8FA;
	color: #000;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
#drop span, #PjF span {
	display: block;
	margin-top: 10px;
	font-size: 12px;
	line-height: 18px;
	font-weight: 400;
}
#upload ul {
	list-style: none;
	margin: 0 -30px;
	border-top: 1px solid #2b2e31;
	border-bottom: 1px solid #3d4043;
}
#upload ul li {
	background-color: #333639;
	background-image: -webkit-linear-gradient(top, #333639, #303335);
	background-image: -moz-linear-gradient(top, #333639, #303335);
	background-image: linear-gradient(top, #333639, #303335);
	border-top: 1px solid #3d4043;
	border-bottom: 1px solid #2b2e31;
	padding: 15px;
	height: 52px;
	position: relative;
}
#upload ul li input {
	display: none;/**/
}
#upload ul li p {
	width: 190px;
	overflow: hidden;
	white-space: nowrap;
	color: #EEE;
	font-size: 14px;
	font-weight: bold;
	position: absolute;
	top: 10px;
	left: 100px;
}
#upload ul li.error p {
	width: 190px;
	font-size: 14px;
	top: 15px;
	left: 30px;
}
#upload ul li i {
	font-weight: normal;
	font-style: normal;
	color: #9f9f9f;
	display: block;
}
#upload ul li canvas {
	top: 15px;
	left: 30px;
	position: absolute;
}
#upload ul li span {
	width: 15px;
	height: 12px;
	background: url('../images/icons.png') no-repeat;
	background-position: 0 0;
	position: absolute;
	top: 34px;
	right: 33px;
	cursor: pointer;
}
#upload ul li.working span, #upload ul li.error span {
	height: 16px;
	background-position: 0 -12px;
}
#loading {
	overflow: hidden;
	padding: 20px;
	margin: 0 auto;
	position: fixed;
	z-index: 9999;
}
div.l {
	margin: 20px 20px 0 0;
	position: relative;
}
canvas {
	display: block;
}
.fileinput-button {
	position: relative;
	overflow: hidden;
}
.fileinput-button input {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	opacity: 0;
	-ms-filter: 'alpha(opacity=0)';
	font-size: 200px;
	direction: ltr;
	cursor: pointer;
}

/* Fixes for IE < 8 */
@media screen\9 {
.fileinput-button input {
	filter: alpha(opacity=0);
	font-size: 100%;
	height: 100%;
}
}
#minFbox, #minPbox {
	display: block;
	position: absolute;
	left: 5px;
	top: 5px;
	font-size: 10px;
	line-height: 12px;
	height: 12px;
	padding: 0 5px 2px;
	font-weight: 300;
	color: #DDD;
	border: #9f9f9f 1px solid;
	cursor: pointer;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
#minFbox:hover, #minPbox:hover {
	color: #000;
	border: #9f9f9f 1px solid;
	background-color: #ddd;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
.progress {
	overflow: hidden;
	height: 8px;
	margin-bottom: 20px;
	background-color: #000;
	border-radius: 6px;
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
	box-shadow: inset 0 1px 2px rgba(0,0,0,.1)
}
.progress-bar {
	float: left;
	width: 0;
	height: 100%;
	font-size: 8px;
	line-height: 8px;
	color: #fff;
	text-align: center;
	background-color: #428bca;
	-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
	box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
	-webkit-transition: width .6s ease;
	transition: width .6s ease
}
.progress.active .progress-bar {
	-webkit-animation: progress-bar-stripes 2s linear infinite;
	animation: progress-bar-stripes 2s linear infinite
}
/*v3.0*/
.fieldset {
	margin: 0 !important;
	padding: 2px !important;
	border: 0 !important;
}
.fieldset h5 {
	font-weight: 400;
	font-size: 12px;
	line-height: 12px;
	padding: 15px 5px 5px !important;
	color: #fff;
	clear: both;
	margin: 0 !important;
}
.fieldset hr {
	clear: both;
	margin: 0 !important;
	background: none;
	border: none;
}
#accordion-family li.menu-list, #accordion-api li.menu-list {
	height: 40px !important;
	font-size: 11px;
	line-height: 20px !important;
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}
#accordion-api li.menu-list {
	height: 120px !important;
}
#accordion-family div.in {
	overflow: hidden;
}
xmp {
	word-wrap: break-word;
	font: 300 12px/20px 'Open Sans', arial, Tahoma;
	padding: 4px;
	background-color: rgba(0,0,0,0.6);
	margin: 10px 0;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
.dropdown, .dropdown1 {
	margin: 0px 2px 5px;
	display: inline-block !important;
	float: left;
	padding: 0px !important;
}
.dropdown {
	clear: right;
}
/* PREFIXED CSS */
.dropdown, .dropdown div, .dropdown li, .dropdown1, .dropdown1 div, .dropdown1 li {
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-ms-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}
/* WRAPPER */

.dropdown, .dropdown1 {
	position: relative;
	width: 225px;/**/
	border: 1px solid #ccc;
	cursor: pointer;
	background: #fff;
	border-radius: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}
.dropdown.s {
	width: 138px;
}
.dropdown1 {
	width: 82px;
}
.dptag {
	position: relative;
	border: 1px solid #ccc;
	background: #141619;
	border-radius: 4px;
	display: inline-block;
	font-size: 10px;
	line-height: 12px;
	color: #000;
	padding: 4px !important;
	margin: 5px 2px 10px;
	float: left;
	color: #ccc;
	text-align: center;
}
.dptag.g {
	width: 74px;
}
.dptag.s {
	width: 14px;
}
.dropdown div, .dropdown1 div {
	z-index: 2;
}
.dropdown:hover, .dropdown1:hover {
	box-shadow: 3px 3px 3px rgba(0,0,0,.35);
}
/* CARAT */

.dropdown .carat, .dropdown1 .carat {
	position: absolute;
	right: 4px;
	top: 66%;
	margin-top: -4px;
	border: 4px solid transparent;
	border-top: 6px solid #000;
	-webkit-transition: -webkit-transform .4s ease;
	-moz-transition: -moz-transform .4s ease;
	-o-transition: -o-transform .4s ease;
	-ms-transition: -ms-transform .4s ease;
	transition: transform .4s ease;
}
.dropdown.open .carat, .dropdown1.open .carat {
	position: absolute;
	top: 66%;
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}
/* SELECTED FEEDBACK ITEM */ 
.dropdown .selected, .dropdown li, .dropdown1 .selected, .dropdown1 li {
	display: block;
	font-size: 11px;
	line-height: 14px;
	color: #000;
	padding: 8px 5px !important; /*overflow-x: hidden;*/
	white-space: wrapall;
}
/* DROP DOWN WRAPPER */
.dropdown div, .dropdown1 div {
	position: absolute;
	height: 0;
	left: -1px;
	right: -1px;
	top: 100%;
	margin-top: -1px;
	background: #fff;
	border: 1px solid #ccc;
	border-top: 1px solid #eee;
	border-radius: 0 0 3px 3px;
	overflow: hidden;
	height: 200px;
	max-height: 200px;
	word-wrap: break-word;
	display: none;
}
.dropdown .selected, .dropdown1 .selected {
	overflow: hidden;
	word-wrap: break-word;
	line-height: 11px;
	padding: 4px 5px !important;
	height: 22px;
	vertical-align: middle
}
.dropdown .selected::after, .dropdown1 .selected::after {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 15px;
	border-radius: 0 2px 2px 0;
	box-shadow: inset -35px 0 35px -5px #fff;
}
/* Height is adjusted by JS on open */
.dropdown.open div, .dropdown1.open div {
	opacity: 1; /*z-index: 2;*/
}
/* DROP DOWN LIST */
.dropdown ul, .dropdown1 ul {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	list-style: none;
	overflow-y: scroll;
	overflow-x: hidden;
	z-index: 3;
}
/* DROP DOWN LIST ITEMS */
.dropdown li, .dropdown1 li {
	list-style: none;
	padding: 8px 5px !important;
}
/* .focus class is also added on hover */
.dropdown li:hover, .dropdown li.active, .dropdown1 li:hover, .dropdown1 li.active {
	color: #fff;
}

@media only screen and (max-width:1320px) {
li#chooseTheme {
	display: none;
}
}

@media only screen and (max-width:1210px) {
li#lightt, li#darkk {
	display: none;
}
}

@media only screen and (max-width:1144px) {
li#show-device ol li.title {
	display: none;
}
}

@media only screen and (max-width:1090px) {
li#orangee,li#bluee,li#redd,li#teall {
	display: none;
}
}

@media only screen and (max-width:1054px) {
li#show-device ol li.title {
	display: none;
}
}

@media only screen and (max-width:1024px) {
li#show-device ol li a.ipad {
	display: none !important;
}
}

@media only screen and (max-width:1024px) {
li#show-device ol li a.ipad {
	display: none !important;
}
}

@media only screen and (max-width:888px) {
li#show-device ol li a.mobile-360-landscape {
	display: none !important;
}
}

@media only screen and (max-width:838px) {
li#show-device ol li a.mobile-360 {
	display: none !important;
}
}

@media only screen and (max-width:800px) {
li#template {
	display: none !important;
}
}
