html,body {-webkit-user-select: auto; }
html {
	overflow: auto;
	overflow-y: scroll;
	background: #f6f6f9;
}
body {
	font-family:helvetica, arial, sans-serif;
}
header a {color:#000!important;}
header {position:inherit;width:98%; padding:20px 1%}
label {margin:0; padding:0;}
h1 {font-size:30px;border-bottom:1px solid #eee;padding-bottom:15px;margin-bottom:0px;color:#222;}
table td {padding:5px 10px;font-size:14px;line-height:26px;vertical-align:middle;}

table label {font-size:14px;padding-top:2px;font-weight:bolder;color:#555; }
table tr.odd td {
background:#fafafa;
border-radius:4px;
}
input {
	border-style:solid;
	border-color:#ccc;
}
table tr td:first-child {text-align:left;}
a {color:#1576B4!important;}
a {color:#3C87DA!important;}
p {
	margin:10px 0;
}
#main {
	margin:0 auto;
	padding: 0 0 50px 0;
	top:10px!important;
	color:#595A5F;
	background:#fff;
	margin-bottom:46px;
	clear:both;
	border: 1px solid rgba(0,0,0,0.1);
	box-shadow: 0 24px 24px rgba(0,0,0,0.05);
}
#main .header {
	padding: 20px 30px 10px 30px;
}
#main .footer {
	padding: 30px;
}
.jscolor {
	display: inline-block;
	max-width: 96px;
}
.wrap {
	width: 960px;
	margin:0 auto;
}
.ac {
	text-align:center;
}
.generalsettings {
	width: 100%;
}
.generalsettings td {padding:8px 40px;}
.advanced-settings {display: none;}

.sync-status-link {
	font-weight: bold;
}

div.half {width:50%;float:left;}
p.text {font-size:13px; line-height:16px; width:400px;}
p.text img {padding:2px; border:1px solid #eee; margin-right:10px; float:left; width:164px; }
#options_navigation {
	background:#FFFCE5;
	background:#fafafa;
	border-bottom:1px solid #eee;
	border-top:1px solid #eee;
	margin: 0 0 48px 0;
	color:#fff;
}
#options_navigation ul {margin-left:40px;}
#tab_general {display:block; padding: 0;}
#options {min-height:500px;	height:auto !important;	height:500px;}
#tab_importexport textarea {width:100%;border:1px solid #ccc;}
#import, #export {display:none;}
#import p , #export p {font-size:16px;background:#fff;padding:5px 0px;border:0px solid #ccc;border-bottom:0;}
#options_navigation li {margin-right:20px;display:inline;}
.options_tab {display:none; padding: 0 0;}
.options_tab_link {color:#444!important; font-weight:600;font-size:15px; display: inline-block; line-height: 32px; padding: 12px 0; margin-bottom: -1px;}
.options_tab_link:hover {text-decoration:none;}
.options_tab_link.selected {border-bottom: 2px solid #222; }
.options_tab#tab_dials,
.options_tab#tab_importexport {
	padding: 20px 30px;
}
.section {font-size:20px;color:#222;margin:24px 0 0 0; }

#pages {
	width:430px;
	margin:0 auto;
	box-sizing: border-box;
}
#pages li {
	display:block;
	box-sizing: border-box!important;
}
#pages li a {
 margin:5px!important;
 box-sizing: border-box!important;
}
#pages li .thumbnail_container {
	height:220px!important;
}
#tab_sync {
	padding:20px 0 0 0!important;
	margin:0!important;
	width:100%!important;
	margin-top:-48px!important;
	min-height:500px;
	height:auto !important;
	height:500px;
	background:url('../images/options.clouds.jpg') no-repeat;
	background-size: 100%;
}
.sync_account {
	width:680px;
	margin:0px auto;
	color:#A2ACB6!important;
}
#sync_status {font-size:12px;display:block;margin:10px 0 0;}
.sync_account label {
	margin-top:30px;
	font-family:"Times new roman",serif;
	font-weight:normal;
	font-style:italic;
	color:#222;
	font-size:20px;
}
.sync_account input[type=image] {
	padding:0;
	border:0;
	box-shadow:0;
}
#options-sync-username, #options-sync-password {

	width:240px!important;
	padding:10px;
	border:1px solid #ccc;
	border-radius:3px;

}
	.sync_account .hideShowPassword-toggle {
		padding: 0 10px!important;
		margin:0!important;
		top:20%!important;
		color: #aaa;
		cursor: pointer;
		font-size: 11px;
		font-weight: normal;
		text-transform: uppercase;
	}
	.sync_account .hideShowPassword-toggle:hover {
		color:#666;
	}

.sync_account a.grey {
	color:#A2ACB6!important;
	font-size:12px;
}
#setup_sync {
	width: 960px;
	margin: 0 auto;
	margin-top:0;
	padding-top:0;
	clear:both;
}
#setup_sync img {
	float:right;
	width: 480px;
	margin-top:0px;
	margin-right: 20px;
	margin-bottom:20px;
}
#setup_sync div {
	padding:80px;
	padding-top:0;
	width:350px;
}
#setup_sync div p#sync_info {
	font-size:28px;
	color:#111;
	margin-bottom:20px;
}
#setup_sync div #sync_features {
	margin:0px;
	list-style-type:circle;
	font-size:19px;
}
#setup_sync div #sync_features a{ color:#42A2E6!important; text-decoration:underline; }
#setup_sync div #sync_features li {margin:8px 0}
#setup_sync div span {

	font-weight:bold;
}
#setup_sync div p#sync_price {
	font-size:48px;
	margin-top:20px;
}

#explain_sync {
	padding:20px 80px;
	border-top:1px dotted #ccc;
	color:#666;
	font-size:14px;
	line-height:1.7em;
}
#explain_sync #left {
	width:42%;
	float:left;
}
#explain_sync #right {
	width:47%;
	float:right;
}
#explain_sync h2 {
	padding:0;
	border:0;
	margin:25px 0 20px 0;
	font-size:22px;
}
#explain_sync h3 {
	color:#222;
	margin:10px 0 5px 0;
	font-size:16px;
}

.user-account {
	position:relative;
}
.user-account .sync_account td {
	padding-top:10px;
}
.user-account .sync_account label {
	color:#999;
}
.user-account h2 {
	font-weight: normal;
	font-size:24px;
	color:#555;
	margin:4px 0;
	border:0;
	padding:0;
}
.user-account h3 {
	margin:20px 0 10px 0;
	font-size:18px;
	font-weight:bold;
	color:#222;
}
.user-account table td {
	vertical-align:top;
	padding:0;
}
.user-account .sync-status {
	width:650px;
	font-size:12px;
	color:#aaa;
	margin:140px auto 0 auto;
}
.user-account .sync-status-text {
	display:none;
	line-height:1.5em;
	margin:0 0 40px 0;
	font-size:18px;
}
.user-account .sync-status-text span {
	font-size:18px;
	display:inline;
}
.user-avatar-container {
	position:absolute;
	left:56px;
	top:60px;
}
.user-avatar {
	width:64px;
	height:64px;
	border:2px solid #fff;
	border-radius:50%;
}
h3.info {
	font-size:17px;
	color:#aaa;
	line-height:1.6em;
	font-weight:normal;
	padding:20px 0 0px 0;;
	text-align:left;
}
h3.info a {color:#86ADC1!important}
#notes {margin:0 0 40px 0;}
#notes h3 {font-size:1.4em;color:#0083EC}
#notes p {margin:15px 0;}
#notes b {font-size:1.1em;margin-bottom:5px;display:block;}
#register_account{ margin:0 auto;font-family:'times new roman', serif;font-style:italic; padding-top: 90px;font-size:26px; color:#555;width:512px;height:100px;background:url(../images/options.sync.login.png) no-repeat}
#background_file .msg {
	padding:20px 40px;
	margin:0 0 20px 0;
	text-align:center;
	background:#d1e9b8;
	color:#222;
	border:1px solid #eee;
}
#background_file p {
	font-size:18px;
}
#background_file .hide-premium {
	padding:30px 0;
}
#background_file .progress-bar {
	margin-top:20px;
}
#preview {
	height: 300px;
	position: relative;
}
#preview #pages li {
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding-bottom: 8px;
}
#preview #pages li a {
	padding:7px; padding-bottom: 0px;
}
#preview #pages li a .thumbnail_container {
	background-size: contain; background-image: url(../images/options.dial.jpg); height: 131.66666666666666px; background-position: 50% 50%;
}
#preview #pages li a .title {
	height:28px;padding:4px 3px;font-size:16px;
}
#options-corners-val {
	border:0;background:transparent;width:25px;margin-left:15px;padding:0;margin-right:0px;
}
#options-padding-val {
	border:0;background:#fff;width:25px;margin-left:15px;padding:0;margin-right:0px;
}

#options-fontsize,
#options-fontstyle {
	width:200px;
}
#tab_design .tabs {
	padding-left:40px;
	margin-bottom:0;
}

label[for] {
	cursor:pointer!important;
}
label[for]:hover {
	text-decoration:underline;
}

input[name=options-dropShadow],
input[name=options-titleAlign]
{
	margin-left:20px;
}
input[name=options-dropShadow]:first-child,
input[name=options-titleAlign]:first-child {
	margin:0;
}

.questionmark {
	cursor:pointer;
	background:url(../images/misc.questionmark.png) no-repeat;
	background-size:contain;
	float:right;
	width:12px;
	height:12px;
	margin:5px 0 0 0;
	opacity:0.7;
	padding:5px;
	font-weight:bold;
	font-size:16px;
}
.questionmark:hover {
	opacity:1;
}

.tab {
	padding: 20px 30px;
	min-height:500px;
	height:auto !important;
	height:500px;
}

/* --------------------------------------------------------
	Modals
	 -------------------------------------------------------- */

	/* Container */
	.modal {
		position: fixed;
		top: 100px;
		left: 50%;
		width: 50%;
		max-width: 630px;
		min-width: 320px;
		height: auto;
		z-index: 2000;
		visibility: visible;
		-webkit-transform: translateX(-50%);
	}
	.modal.state-closed {
		visibility: hidden;
		transition: all 0.3s;
	}

	/* Overlay */
	.modal-overlay {
		position: fixed;
		width: 100%;
		height: 100%;
		opacity: 1;
		visibility: visible;
		top: 0;
		left: 0;
		z-index: 1000;
		background: rgba(32,31,31,0.8);
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	.modal-overlay.state-closed {
		visibility: hidden;
		opacity: 0;
	}
	.modal .close {
		width: 24px;
		height: 24px;
		position: absolute;
		top: 20px;
		right: 20px;
		font-weight: 300;
		display: block;
		border-radius: 50%;
		text-align: center;
		line-height: 24px;
		background: rgba(0,0,0,0.15);
		color: #fff!important;
		text-decoration: none;
		transition: all .3s;
	}
	.modal .close:hover {
		background: rgba(0,0,0,0.3);
	}
	/* Content */
	.modal-content {
		color: #fff;
		background: #e74c3c;
		position: relative;
		border-radius: 3px;
		margin: 0 auto;
		opacity: 1;
		visibility: visible;
		-webkit-transform: scale(1);
		-webkit-transition: all 0.3s;
	}
	.modal.state-closed .modal-content {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: scale(0.7);
	}
	.modal-content h3 {
		margin: 0;
		padding: 0.4em;
		text-align: center;
		font-size: 1.8em;
		line-height: 2em;
		font-weight: 300;
		font-weight: 400;
		opacity: 0.8;
		background: rgba(0,0,0,0.1);
		border-radius: 3px 3px 0 0;
		border-bottom: 1px solid rgba(0,0,0,0.05);
	}
	.modal-content label {
		display: inline;
		font-size: 1em;
		cursor: pointer;
		margin: 0 16px 10px 0;
	}
	.modal-content label input {
		vertical-align: middle;
		margin:0 3px 0 0;
	}
	.modal-content p {
		margin:16px 0;
	}
	.modal-content > div {
		padding: 15px 40px 30px;
		margin: 0;
		font-weight: 300;
		font-size: 1.2em;
		line-height: 1.6em;
	}
	.modal-content h4 {
		margin-top: 16px;
		font-size:1.3em;
	}
	/* Modal types */
	.modal-info .modal-content {
		background: #fff;
		color:#222;
	}
	.modal-info ~ .modal-overlay {
		background: rgba(10,10,10,0.6);
	}

/* Payment modals */

@-webkit-keyframes progressbar {
  to {
    background-position: 80px 0;
  }
}
.modal-form {
	width: 500px;
}
.modal-form label {
	display: block;
	margin: 0;
}
.modal-form label span {
	display: block;
	text-transform: uppercase;
	font-size: 12px;
	color: #aaa;
	margin: 6px 0 4px 0;
}
.modal-form form {
	width: 400px;
	margin: 0 auto;
}
.modal-form input[type=password],
.modal-form input[type=email],
.modal-form input[type=tel] {
	width: 100%;
	border-radius:2px;
	padding: 10px;
	font-size:1.15em;
}
.modal-form form .btn {
	outline: none;
	margin: 20px 0 10px 0;
	width: 100%;
	background-color: #30c87a;
}
.modal-form form .btn:hover {
	background-color: #2EB36F;
}
.modal-form form .btn:active {
	opacity: 0.8;
}

.modal-form form .btn[disabled] {
  -webkit-animation: progressbar 1s linear infinite;
  background-repeat: repeat-x;
  background-size: 80px 80px;
  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.modal-form form .error-message {
	color: #e85c41;
	line-height: 2em;
	font-weight: bold;
	border-radius: 2px;
	display: block;
	margin: 20px 0 0;
	text-transform: none;
}

#create-user-account {
	width: 400px;
}
#create-user-account form {
	width: 300px;
	margin: 0 auto;
}

.become-pro {
	padding: 10px 30px;
	font-style: normal!important;
	font-size:20px!important;
}

#themes {
	margin: 20px 0 0 0;
	position:relative;
}

#themes td {padding:0 2%;border-right:0px solid #eee;font-size:14px;font-size:12px;}
#themes a {color:#0FA5DE;}

.theme-option {
	margin: 1%;
	width: 18%;
	width: 31.333%;
	margin: 1%;
	display:inline-block;
	cursor:pointer;
	position: relative;
}
.theme-option > div {
	vertical-align: top;
	border:1px solid #ccc;
	width:100%;
	height: 200px;
}
.themes-confirm {
	position: fixed;
	z-index: 999;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 36px 0;
	background: #fff;
	box-shadow: -2px 0 30px rgba(0,0,0,0.2);
	text-align: center;
	transform: translateY(200%);
	transition: transform .2s cubic-bezier(0.175,.885,.32,1.075);
}
.themes-confirm.show {
	transform: translateY(0%);
}
.themes-confirm .container {
	margin: 0 auto;
}
.themes-confirm-customize {
	display: inline-block;
	font-size: 18px;
	font-weight: normal;
	margin-right: 36px;
	padding-right: 36px;
	border-right: 1px solid #eee;
}
.themes-confirm-customize input {
	margin: 0 0 0 12px;
	padding: 18px;
	width: 140px!important;
}
.themes-unlock {
	display: none;
	position: relative;
	background: #ebf1f5;
	border-radius: 4px;
	margin: 40px 10px;
	border: 1px solid #eee;
	padding: 60px;
	text-align: center;

	max-height: 780px;
	overflow: hidden;
}
.themes-unlock:after {
	display: block;
	position: absolute;
	bottom: 0;
	height: 200px;
	left: 0;
	right: 0;
	content: "";
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(235,241,245,1) 100%);
}
.themes-unlock .lead {
	font-size: 1.25em;
	line-height: 1.7;
}
.themes-unlock h3 {
	font-size: 26px;
	margin: 0 0 30px 0;
}
.theme-option:hover > div {
	border-color: #999;
}
.theme-option span {
	display: block;
	margin: 6px 0 0;
	color: #999;
}
.theme-option.theme {
	width: 31.333%;
	margin: 1%;
}
.theme-option.pattern {
	display: inline-block;
	background-size: contain;
}
.theme-option.featured {
	display: inline-block;
	opacity: 1;
}
.footer-legal {
	color: #999;
	text-align: center;
}
.footer-legal a {
	color: #666!important;
}
.footer-cta {
	min-height: 120px;
}
.footer-cta ul {
	margin: 0px;
	font-size: 16px;
	line-height: 1.5em;
}
.page-statistics {
	margin: 0 auto;
	width: 960px;
	padding: 40px!important;
}
.facebook-like-box {
	background: #fff;
	width: 390px!important;
	float: right; border-radius: 4px; padding: 20px; border: 2px solid #eee;
}
@media (min-width: 1280px) {
	.wide .wrap {
		width: 1160px;
	}
	.wide .user-avatar-container {
		position:absolute;
		left:136px;
		top:60px;
	}
	.wide #sync_account {
		width: 900px;
	}
	.wide #options-sync-username, .wide #options-sync-password {
		width: 320px!important;
	}
}
.speed-dial-pro {
	 text-align: center;
}
.speed-dial-pro h1 {
	font-size: 26px;
	font-weight: 100;
	margin: 20px 0 0 ;
}
.speed-dial-badge {
	display: inline-block;
	width: 64px!important;
	height: 64px!important;
	border-radius: 64px;
	background: url('../icon32.png') #fff center no-repeat;
}
.translation-credit {
	float:right;
	text-align: right;
	max-width: 300px;
	padding: 0 30px;
}

/* --------------------------------------------------------
	Tooltip, popover
   --------------------------------------------------------	*/

.tooltip {
	position: absolute;
	font-family:sans-serif;
	z-index: 1020;
	display: block;
	visibility: visible;
	padding: 5px;
	font-size: 11px;
	opacity: 0;
}
.tooltip.in {
	opacity: 0.8;
}
.tooltip.top {
	margin-top: -2px;
}
.tooltip.right {
	margin-left: 2px;
}
.tooltip.bottom {
	margin-top: 2px;
}
.tooltip.left {
	margin-left: -2px;
}
.tooltip.top .tooltip-arrow {
	bottom: 0;
	left: 50%;
	margin-left: -5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #000000;
}
.tooltip.left .tooltip-arrow {
	top: 50%;
	right: 0;
	margin-top: -5px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid #000000;
}
.tooltip.bottom .tooltip-arrow {
	top: 0;
	left: 50%;
	margin-left: -5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #000000;
}
.tooltip.right .tooltip-arrow {
	top: 50%;
	left: 0;
	margin-top: -5px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid #000000;
}
.tooltip-inner {
	max-width: 200px;
	padding: 5px 8px 7px 8px;
	color: #ffffff;
	text-align: center;
	text-decoration: none;
	background-color: #000000;
	border-radius: 4px;
}
.tooltip-arrow {
	position: absolute;
	width: 0;
	height: 0;
}

.popover {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1010;
	display: none;
	padding: 5px;
}
.popover.top {
	margin-top: -5px;
}
.popover.right {
	margin-left: 5px;
}
.popover.bottom {
	margin-top: 5px;
}
.popover.left {
	margin-left: -5px;
}
.popover.top .arrow {
	bottom: 0;
	left: 50%;
	margin-left: -5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #000000;
}
.popover.right .arrow {
	top: 50%;
	left: 0;
	margin-top: -5px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid #000000;
}
.popover.bottom .arrow {
	top: 0;
	left: 50%;
	margin-left: -5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #000000;
}
.popover.left .arrow {
	top: 50%;
	right: 0;
	margin-top: -5px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid #000000;
}
.popover .arrow {
	position: absolute;
	width: 0;
	height: 0;
}
.popover-inner {
	padding: 1px;
	width: 280px;
	overflow: hidden;
	background: #aaa;

	box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
}
.popover-title {
	padding: 9px 15px;
	line-height: 1;
	background-color: #f5f5f5;
	border-bottom: 1px solid #eee;
}
.popover-content {
	padding: 14px;
	background-color: #ffffff;
	background-clip: padding-box;
}
.popover-content p {
	margin-top:0;
}
.popover-content p, .popover-content ul, .popover-content ol {
	margin-bottom: 0;
}
