html, body, h1, h2, h3, h4, h5, h6, p, em, strong, abbr, acronym, blockquote, q, cite, ins, del, dfn, a, div, span, pre, hr, address, br, b, i, sub, sup, big, small, tt, table, tr, caption, thead, tbody, tfoot, col, colgroup, form, input, label, textarea, button, fieldset, legend, select, option, optiongroup, ul, ol, li, dl, dt, dd, code, var, kdb, samp, img, object, param, map, area, bdo, iframe { padding:0; margin:0; }
html {height:100%;}
body {height:100%; font:62.5%/1.6em Sofia-pro, Arial, Verdana, sans-serif; color:#5c5c5c; background:#000000;}
a {color:#136EF6; cursor:pointer;}
a:hover {text-decoration:none;}
.clear {clear:both;}
.tcenter {text-align:center;}
.tright {text-align:right !important;}
.fleft {float:left;}
.fright {float:right !important;}
h1 {font-size:2.7em;} h2 {font-size:2.3em;} h3 {font-size:1.4em;} h4 {font-size:1.2em;}
h1, h2, h3, h4 {line-height:1.2em;}
h5 {font-size:1.1em; font-weight:bold; text-align:center; color:#5c5c5c;}
li {list-style:none;}
img {border:0;}
.img {display:block;}
input {vertical-align:middle;}
input.btn {cursor:pointer;}
input.txt {font:1em Arial, Helvetica, sans-serif; color:#545454; border:1px solid #b4b4b4; padding:3px 4px; background:#fff;}
.checkbox input { margin: 0 5px 5px 0; }
textarea {font:1em sofia-pro, Arial, Helvetica, sans-serif; color:#545454; border:1px solid #b4b4b4; padding:3px 4px 2px; background:#fff;}
select {color:#545454;}
select.list {font:1em Arial, Helvetica, sans-serif; color:#545454; display: block;}
select.summary {font-family: sofia-pro, Tahoma,Arial,Verdana,sans-serif; font-weight:bold; font-size:12px; color:Gray;}
.radio-list label {margin-left: 3px;}
.wrapper {overflow:hidden; zoom:1;}
.noPadB {padding-bottom:0 !important;}
.noMargB {margin-bottom:0 !important;}
.noMargR {margin-right:0 !important;}
a.arr {padding-left:9px; background:url(../../images/harbortouch/arrow1.gif) 0 0.4em no-repeat;}
/*--------------Page-----------------*/
.t-space {height:16px;}
.b-space {height:0px;}
.all {width:960px; margin:0 auto; }
.all .t {height:4px; margin-bottom:-4px;}
.all .b {height:4px; margin-top:-4px;}
.all>.b { display:none;}
.all .tl,.all .tr,.all .bl,.all .br {height:4px; width:4px; float:left; background:url(../../images/harbortouch/corn-all.gif) no-repeat;}
.all .tr {float:right; background-position:100% 0;}
.all .bl {background-position:0 100%;}
.all .br {float:right; background-position:100% 100%;}
.all .content {padding:4px;}
.header-box { margin:0 -3px 0 -3px; height:99px; position:relative;}
.live-chart {float:right; margin:4px 13px 0 0;}
.helptext {margin:35px 0 0; font:bold 1.3em Arial, Helvetica, sans-serif; color:#136EF6; text-transform:uppercase; text-shadow:0 1px 1px #15376c; text-align:right;}
.helptext p {color:#fff;}
.logo {float:left; width:210px; height:82px; margin:0 0 0 14px; display:inline;}
.logo a {float:left; width:210px; height:82px; text-indent:-1000em; position:relative;}
.main {width:944px; margin:0 auto;}
.main .t {height:23px; background:url(../../images/harbortouch/bg_main-t.png) no-repeat; margin:0; position:relative; z-index:1;}
.main .b {height:5px; background:url(../../images/harbortouch/bg_main-b.png) no-repeat; margin:0;}
.main .content {padding:6px 21px 5px; background:url(../../images/harbortouch/bg_main-c.png) repeat-y;}

.tabs {width:945px; margin:0 auto 11px; font-size:14px; line-height:15px; background:url(../../images/harbortouch/bg_menu.png) no-repeat; overflow:hidden; zoom:1;}
.tabs li {float:left; height:33px; background:url(../../images/harbortouch/bg_menu-sep.gif) 100% 50% no-repeat; padding:7px 19px; line-height:33px;}
.tabs li a {color:#fdfdfd; text-decoration:none; line-height:15px; zoom:1; display:inline-block;}
.tabs li a:hover,.tabs li a:hover span {text-decoration:underline;}
.tabs li.act a { color:#136EF6;}
.tabs li.act a:hover,.tabs li.act a:hover span {text-decoration:none;}
.tabs li.dis a,.tabs li.dis a span {text-decoration: none; cursor: default;}
.tabs li .number {float:left; display:block; background:url(../../images/harbortouch/numberBg.png) no-repeat 0 0; height:17px; width:17px; margin:1px 8px 0 0; padding:0; text-align:center;}
.tabs li.act .number { background:url(../../images/harbortouch/numberBg.png) no-repeat 0 -17px; color:#fff; padding:0;}
.tabs li .text {float:left; display:block; margin:0; padding:0; background:none;}
.tabs li.act .text { background:none; margin:0; padding:0;}

.main h2 {color:#136EF6; border-bottom:1px solid #e1e1e1; padding-bottom:15px; margin-bottom:15px;}
.main h2 img {display:block;}
.main p {font-size:1.2em; line-height:1.6em; margin-bottom:10px;}
.main p.black { color: #000000;}
.main p span.red{ color: #ff0000;}
.main p.blackBold { color: #000000;font-weight: bold;font-size: 1.1em;}
.main .blackColor { color: #000000}
.main ul,.main ol {margin-bottom:12px;}
.main li,.main dt,.main dd,.main blockquote {font-size:1.2em;}
.main li li,.main li p,.main li dt,.main li dd,.main li blockquote {font-size:1em;}
ul.step-row {background:#f2f2f2; border:1px solid #d7d7d7; border-left:0; font-weight:bold; height:45px; margin-bottom:22px;}
ul.step-row li {height:45px; float:left; list-style:none; margin-left:0; font-size:1.1em; border-left:1px solid #d7d7d7;}
.step-row li dt {height:34px; float:left; background:#fdfdfd url(../../images/harbortouch/stepRow-arr.gif) 100% 0 no-repeat; padding:9px 16px 0 11px; font:bold 2.1em Arial; color:#e8000c;}
.step-row dd {float:left; padding:16px 24px 0 9px;}

.box-gr { background:#9b9b9b url(../../images/harbortouch/box-gr-bg.gif) repeat-x;}
.box-gr .t {height:2px; margin-bottom:-2px; background:none;}
.box-gr .b {height:2px; margin-top:-2px; background:none;}
.box-gr .tl,.box-gr .tr,.box-gr .bl,.box-gr .br {height:2px; width:2px; background-image:url(../../images/harbortouch/box-gr-corn.gif);}
.box-gr .c {padding:8px;}
.funcKeys {width:450px; margin:0 auto 26px;}
.funcKeys .keys {overflow:hidden; zoom:1; color:#373737; margin-bottom:0;}
.funcKeys .keys li {background:url(../../images/harbortouch/key-bg.gif) no-repeat; width:72px; height:72px; float:left; margin:0; list-style:none; cursor:pointer;}
.funcKeys .keys li.edit {background:url(../../images/harbortouch/key-bgA.gif) no-repeat; color:#722e31;}
.funcKeys .keys li .st {width:58px; height:58px; margin:7px 0 0 7px; float:left; display:inline;}
.funcKeys .keys dl {position:relative; width:58px; height:58px;}
.funcKeys .keys dt {font-size:11px; line-height:19px; font-weight:bold; text-align:right; padding:5px 4px 0; position:absolute; width:50px; left:0; line-height:1.2em; word-wrap:break-word;}
.funcKeys .keys dd {font-size:18px; text-align:right; padding:0 5px; position:absolute; width:48px; bottom:6px;}

.mainCrtls {margin:10px -19px -5px; background:#f2f2f2; border-top:1px solid #d7d7d7; padding:19px 17px 11px 19px; overflow:hidden; zoom:1;}
.mainCrtls a {margin:0 2px; text-decoration:none;}

.box-gr2 {background:#e9eef2; border:1px solid #d7d7d7;}
.box-gr2 .t {height:2px; background:#e9eef2;}
.box-gr2 .tl {margin:-1px 0 0 -1px; position:relative;}
.box-gr2 .tr {margin:-1px -1px 0 0; position:relative;}
.box-gr2 .b {height:1px; background:#e9eef2;}
.box-gr2 .bl {margin:0 0 -1px -1px; position:relative;}
.box-gr2 .br {margin:0 -1px -1px 0; position:relative;}
.box-gr2 .tl,.box-gr2 .tr,.box-gr2 .bl,.box-gr2 .br {height:2px; width:2px; background-image:url(../../images/harbortouch/box-gr2-corn.gif);}
.box-gr2 .content {padding:7px 11px 8px; background:#e9eef2;}
.box-gr2 h3 {font-size:1.8em; font-weight:normal; color:#e8000c; margin-bottom:3px;}
.box-gr2 h4 {padding-bottom:6px;}
.box-gr2 p {font-size:1.1em; line-height:1.46em; margin-bottom:11px; text-align:justify;}
.box-gr2 ol li { margin-left:25px; list-style:decimal;}
.box-gr2 .vision {background:#fdfdfd; margin:5px -11px 13px; padding:27px 10px 24px;}
.box-gr2 .vision img {display:block; margin:0 auto;}
.box-gr2 .btns {overflow:hidden; zoom:1; font-size:1.1em; padding-top:2px;}
.box-gr2 .btns .btn {margin-left:5px; margin-top:-2px; float:right;}

.form-create {width:600px; margin:5px auto 30px;}
.form-create .content {padding-top:18px;}
.form-create ul li {list-style:none; margin-left:0; font-size:1.1em; margin-bottom:6px;}
.form-create li label {font-weight:bold; display:block; margin-bottom:4px;}
.form-create li input.txt {width:316px;}
.form-create .sep {margin:0 -11px 9px; border-bottom:1px solid #d7d7d7; height:1px;}
.form-create li textarea.txt {width:568px;}

.form-p {padding-bottom:15px;}
.form-p .box-gr2 {margin-bottom:10px;}
.form-p .box-gr2 .content {padding:0;}
.form-p .block {padding:7px 11px 5px; font-size:12px;}
.form-p .block .h {margin:-7px -11px 8px; color:#136EF6; padding:4px 11px 6px; font-size:13px; font-weight:bold; text-transform:uppercase; border-bottom:1px solid #d7d7d7;}
.form-p .block .h label {vertical-align:middle;}
.form-p .block .h .ch input {width:13px; height:13px; margin-right:1px; margin-bottom:1px; vertical-align:bottom; display:inline-block;}
.form-p .block p,.form-p .block dt,.form-p .block dd {margin:0; font-size:12px;}
.form-p .block .descr {padding:6px 11px 9px; border-bottom:1px solid #d7d7d7; margin:-7px -11px 6px;}
.form-p .block .descr dl {overflow:hidden; zoom:1; padding-top:5px;}
.form-p .block .descr dt {float:left; margin-right:10px;}
.form-p .block .descr dd {overflow:hidden; zoom:1;}
.form-p .block .fld {margin:0 9px;}
.form-p .block .row {display:table; zoom:1; width:100%; padding:2px 0;}
.form-p .block input.txt {background:#fff; width:61px; padding:3px 3px 2px; margin:-2px 2px 0;}
.form-p .block input.txw2 {width:96px;}
.form-p .block .row-inp2 input.txt {width:26px; margin:-2px 1px 0;}

.p-help {display:inline-block; vertical-align:middle; $display:inline; zoom:1; position:relative;}
.p-help .ico-help {background:url(../../images/harbortouch/ico-help.png) no-repeat; display:inline-block; vertical-align:middle; width:16px; height:16px; margin-top:-2px;}
.p-help .pop {position:absolute; bottom:15px; left:-141px; width:298px; z-index:2; display:none;}
.p-help .pop-t {background:url(../../images/harbortouch/help-pop.png) no-repeat; width:298px; height:8px;}
.p-help .pop-b {background:url(../../images/harbortouch/help-pop.png) -902px 0 no-repeat; width:298px; height:20px;}
.p-help .pop-c {background:url(../../images/harbortouch/help-pop.png) -451px 0 repeat-y; padding:6px 13px 7px; font-size:12px; line-height:1.33;}
.p-help .pop .ico-close {float:right; background:url(../../images/harbortouch/ico-close.gif) no-repeat; width:9px; height:12px; margin:-2px -1px 0 0;}
.p-help .pop h3 {font-size:12px; color:#136EF6; padding-bottom:5px;}
.p-help .pop p {margin:0; line-height:1.33;}
.p-help .pop-txt {max-height:170px; overflow:auto;}

.cols2 {overflow:hidden; zoom:1;}
.cols2 .col1 {float:left; width:350px;}
.cols2 .col2 {float:right; width:350px;}

.header-box a {color:#333;}

.footer {padding:6px 6px 8px 6px; font-size:1.1em; color:#fff;}
.footer a {color:#fff;}
.logo-foot {margin:-2px 9px 0 0; display:inline-block; vertical-align:middle; width:100px; height:44px;}
.logo-foot img { display:none;}
.foot-nav {float:right; color:#136EF6; margin-top:10px;}
.foot-nav a {margin:0 3px;}

.shader {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; z-index:20; opacity:0.2; filter: alpha(opacity = 20);
}

.error ul li
{
	font-weight: bold;
	margin-bottom: 0;
	margin-left: 15px;
	list-style-type: inherit;
}
.contype-descr ul li
{
	margin-left: 15px;
	list-style-type: inherit;
}
.txt-error{	color: Red;}
.error span {font-weight: bold;}
.txt-step {font-size: 23px; font-weight: bold; border-bottom: 1px solid #e1e1e1; font-family: sofia-pro, Arial, Helvetica, sans-serif; color: #136EF6;padding-bottom: 15px; margin-bottom: 15px;}
.form-create dt {margin-top: 5px}
dt .field-name { float: right; font-weight: bold;float: left; width: 235px;text-align: right;font-size: 11px;}
.field-value { margin-left: 17px; font-size: 11px;}
.field-value-email {margin-left: 19px}

.radio-list li {font-size:1.1em; margin-bottom:8px; $margin-bottom:4px;}
.radio-list label {font-size:1.1em; margin-right:3px;}
.radio-list .radioL input {vertical-align:middle; position:relative; top:-2px; $top:0}
.radio-list input {vertical-align:baseline; position:relative; top:1px;}
.summary-form .radio-list input {vertical-align:middle; position:static; margin-top:-5px;}

.preloader {height:1px; width:1px; overflow:hidden; position:absolute; top:-10000em; left:-10000em;}
.preload{
	position:fixed;
	top:0;
	left:50%;
	margin-left:-49px;
	z-index:999;
}

.key-colors {overflow:hidden; zoom:1; background:#5c5c5c; color:#373737; padding:10px 5px 10px 10px; margin:0 -14px 5px;}
.key-colors li {float:left; margin:0; list-style:none; text-align:center;}
.key-colors li .prev {display:block; margin-bottom:3px;}
.key-colors li.keyB {background:url(../../images/harbortouch/key-bg.gif) no-repeat; width:72px; height:72px; float:left; margin:0 6px 0 0; list-style:none; cursor:pointer;}
.key-colors li.keyB .st {width:58px; height:58px; margin:7px 0 0 7px; float:left; display:inline;}
.key-colors li.keyB dl {position:relative; width:58px; height:58px; zoom:1;}
.key-colors li.keyB dt {font-size:11px; line-height:19px; font-weight:bold; text-align:right; padding:5px 4px 0; position:absolute; left:0; width:50px; line-height:1.2em; word-wrap:break-word;}
.key-colors li.keyB dd {font-size:18px; text-align:right; padding:0 5px; position:absolute; width:48px; bottom:6px; left:0;}

.pop-ctrls {padding:8px 0 1px; overflow:hidden; zoom:1; margin:0 -1px 0 -5px;}
.pop-ctrls a {margin:0 3px;}

.shader,.pop-keys {di splay:none;}

.keys-st1 {background:url(../../images/harbortouch/key-bg1.gif) no-repeat;}
.keys-st2 {background:url(../../images/harbortouch/key-bg2.gif) no-repeat;}
.keys-st3 {background:url(../../images/harbortouch/key-bg3.gif) no-repeat;}
.keys-st4 {background:url(../../images/harbortouch/key-bg4.gif) no-repeat;}
.keys-st5 {background:url(../../images/harbortouch/key-bg5.gif) no-repeat;}
.keys-st6 {background:url(../../images/harbortouch/key-bg6.gif) no-repeat;}
.keys-st7 {background:url(../../images/harbortouch/key-bg7.gif) no-repeat;}

/*Scroller Styles*/
/*
.jScrollPaneContainer {overflow:hidden; position:relative; z-index:1; padding-top:8px; margin-left:2px; left:10px;}
.jScrollPaneTrack {background:url(../../images/harbortouch/scrollTracker.png) no-repeat 50% 50%; bottom:0; cursor:pointer; position:absolute; width:678px; left:6px; height:18px;}
.jScrollIntervalTrack {position:absolute;}
.jScrollPaneDrag {background:url(../../images/harbortouch/scrollDrag.png) no-repeat 0 0; width:70px !important; cursor:pointer; overflow:hidden; position:absolute; height:18px;}
.jScrollPaneDragLeft {bottom:0; left:0; overflow:hidden; position:absolute;}
.jScrollPaneDragRight {bottom:0; overflow:hidden; position:absolute; right:0;}
a.jScrollArrowLeft {bottom:0; display:block; height:1px; left:0; overflow:hidden; position:absolute; text-indent:-2000px !important; width:1px; z-index:1;}
a.jScrollArrowRight {bottom:0; display:block; height:1px; overflow:hidden; position:absolute; right:0; text-indent:-2000px !important; width:1px; z-index:1;}
*/

.jspContainer {overflow:hidden; position:relative; z-index:1; padding-top:8px; margin-left:2px; left:10px;}
.jspHorizontalBar {background:url(../../images/harbortouch/scrollTracker.png) no-repeat 50% 50%; bottom:0; cursor:pointer; position:absolute; width:678px; left:6px; height:18px;left: 1px;}
.jspTrack {background:url(../../images/harbortouch/scrollTracker.png) no-repeat 50% 50%; bottom:0; cursor:pointer; position:absolute; width:678px; left:6px; height:18px;left: 1px;}

.jScrollIntervalTrack {position:absolute;}
.jspDrag {background:url(../../images/harbortouch/scrollDrag.png) no-repeat 0 0; width:70px !important; cursor:pointer; overflow:hidden; position:absolute; height:18px;}
.jspDragLeft {bottom:0; left:0; overflow:hidden; position:absolute;}
.jspDragRight {bottom:0; overflow:hidden; position:absolute; right:0;}
a.jspArrowLeft {bottom:0; display:block; height:1px; left:0; overflow:hidden; position:absolute; text-indent:-2000px !important; width:1px; z-index:1;}
a.jspArrowRight {bottom:0; display:block; height:1px; overflow:hidden; position:absolute; right:0; text-indent:-2000px !important; width:1px; z-index:1;}
a.jspArrow {display:none; }

.categories {width: 170px; height:396px; float:left; margin-left:-10px; margin-top:-7px; background-color:#F5F9FD; border-right:1px solid #D7D7D7;}
.categories ul {overflow:auto; max-height: 396px; background:#F5F9FD; }
.categories li {cursor:pointer; padding: 4px 18px;  border-bottom:1px solid #D7D7D7; color: #5D7079; background:transparent url(../../images/harbortouch/cat-arrow.gif) no-repeat scroll left center;}
.categories li.active {background:transparent url(../../images/harbortouch/cat-arrow-white.gif) no-repeat scroll left center; background-color: #136EF6; color:White}
.scroll-pane {float:left; width:702px;}
#pane1 {height: 382px; width: 702px;  _overflow: hidden; }
.scroll-pane .Row {width:2000px; height:110px; padding-bottom:8px;}
.scroll-pane .Row .CardItem {float:left; background:url(../../images/harbortouch/cardBoxBg.png) no-repeat top left; height:98px; width:153px; padding:6px; margin-right:10px;}
.scroll-pane .Row .CardItem .PopupCardBox {display:none;}
.scroll-pane .Row .CardItem:hover {position:relative;}
.scroll-pane .Row .CardItem:hover .PopupCardBox {display:block; position:absolute; background:url(../../images/harbortouch/popupCard-bg.png) no-repeat top left; width:330px; height:247px; top:-7px; left:171px; padding:7px 8px 9px 8px;}
.scroll-pane .Row .CardItem .PopupCardBox .FullsizeCard { background:url(../../images/harbortouch/cardShadow.png) no-repeat bottom left; padding:12px 12px 11px 12px;}
.scroll-pane .Row .CardItem .PopupCardBox .FullsizeCard h5 {margin-top:-3px;}

/*Card Edit*/
.upload-button {width: 110px; height: 30px;}
.backMenu {float:right; width:440px; padding-top:2px;}
.backMenu label {font-weight:bold; float:left; display:block; padding-right:7px;}
.datapicker {background:url(../../images/harbortouch/datapicker.gif) no-repeat top left; height:16px; width:29px; /*position:relative;*/ padding:6px 0 0 7px;}
.datapicker .colorSelect {width:9px; height:9px; float:left;}
.datapicker a {float:right; margin-top:-6px;}
.backMenu .datapicker {margin-right:20px; float:left;}
.backMenu .button {float:left;}
.backMenu .buttonAlone { margin:0 4px; float:left;}

.slider {float:left; height:22px; width: 160px;}
.slider .buttonMinus {display:block; float:left; height:22px; width:22px; background:url(../../images/harbortouch/btn-less.gif) no-repeat top left;}
.slider .buttonPlus {display:block; float:left; height:22px; width:22px;background:url(../../images/harbortouch/btn-more.gif) no-repeat top left;}
.slider .ui-slider-horizontal {height:20px; float:left; background:url(../../images/harbortouch/sliderBg.gif) no-repeat top left; width:46px; padding:2px 4px 0 4px;}
.slider .value {font-size:1.2em; color:#545454; vertical-align:middle; padding-left:6px;}
.slider .ui-slider-bound {height:22px; float:left; background:url(../../images/harbortouch/sliderBg.gif) no-repeat top left; width:60px;}
.ui-slider .ui-slider-handle  
{
	margin-left: 0px;
	top: 2px;
	background: url(../../images/harbortouch/sliderRunner.gif);     
	cursor: default;
    height: 18px;
    position: absolute;
    width: 6px;
    z-index: 2;
 }

.EditPictureArea {padding:7px 23px 18px; margin:10px -11px 0;}
.EditPictureArea .empty-drag-box {margin-left: auto;margin-right: auto}
.EditPictureArea .drag-box.is-dragover:not(.empty-drag-box)::after { height: 213px;border-radius:19px}
.EditPictureArea .PictureArea {width:338px; height:213px; position:relative; margin-bottom:5px; background-color:#fff; float:left; display: block;}
.EditPictureArea .PictureAreaCrop {width:336px; height:211px; overflow:hidden; position:relative; border: 1px solid rgb(0,0,0)}
/*.EditPictureArea .PictureAreaCrop {width:452px; height:294px; overflow:hidden; position:relative;}*/
/*.EditPictureArea .PictureArea .Frame {position:absolute; top:0; left:0; background:url(../../images/harbortouch/cardFrame.png) no-repeat top left; width:452px; height:294px;}*/
/*
.EditPictureArea .PictureArea .FrameT {position:absolute; top:0; left:0; background:url(../../images/harbortouch/cardFrameT.gif) repeat-x; width:452px; height:8px;}
.EditPictureArea .PictureArea .FrameR {position:absolute; top:0; right:0; background:url(../../images/harbortouch/cardFrameR.gif) repeat-y; width:8px; height:294px;}
.EditPictureArea .PictureArea .FrameB {position:absolute; bottom:0; left:0; background:url(../../images/harbortouch/cardFrameB.gif) repeat-x; width:452px; height:8px;}
.EditPictureArea .PictureArea .FrameL {position:absolute; top:0; left:0; background:url(../../images/harbortouch/cardFrameL.gif) repeat-y; width:8px; height:294px;}
*/

.EditPictureArea .PictureArea .FrameTL,.EditPictureArea .PictureArea .FrameTR,.EditPictureArea .PictureArea .FrameBL,.EditPictureArea .PictureArea .FrameBR {position:absolute; width:17px; height:17px;}
.EditPictureArea .PictureArea .FrameTL {top:0; left:0; background:url(../../images/harbortouch/cardFrameTL.png) no-repeat;}
.EditPictureArea .PictureArea .FrameTR {top:0; right:0; background:url(../../images/harbortouch/cardFrameTR.png) no-repeat;}
.EditPictureArea .PictureArea .FrameBL {bottom:0; left:0; background:url(../../images/harbortouch/cardFrameBL.png) no-repeat;}
.EditPictureArea .PictureArea .FrameBR {bottom:0; right:0; background:url(../../images/harbortouch/cardFrameBR.png) no-repeat;}
.EditPictureArea p {font-size:1.1em; line-height:1.1em; padding:7px 0; text-align:center; color:#5c5c5c; margin-bottom:0;}
.EditPictureArea .caution {width:385px; height:213px; background-color:#fff; float:right; background:url(../../images/harbortouch/caution.png) no-repeat; margin-bottom:5px;}
.caution-empty {width: 600px; background-color: #E4E4E4; margin-bottom: 5px; margin: 30px auto 0px; border-radius: 3px; border: 1px solid #d7d7d7;
                background: url(../../images/caution-ico.png) no-repeat #E4E4E4 4px 13px; font-size: 1.2em; font-weight: bold; padding: 12px 0 12px 42px; 
                    box-sizing: border-box;}
.EditPictureArea .color {width:430px; height:213px; background-color:#E9EEF2; float:right;margin-bottom: 5px; text-align: left;}
.EditPictureArea .caution p {text-align:left; line-height:1.4em; font-weight:bold; padding:27px 27px 0 83px;}

.TextDesignArea {padding:0 19px 23px 77px; position:relative; width:516px; height:auto; margin:0 auto;}
.TextDesignArea .Text {position:absolute; width:207px; height:102px; font-size:3em; font-family:sofia-pro,"Times New Roman", Times, serif; color:#fff; top:113px; left:134px; text-align:center; line-height:1.1em; border:1px dashed #b7b8c1; cursor:move;}
.divbox {width: 442px; height: 100px; margin-top: 10px; margin-bottom: 5px; padding: 5px; border-width: 1px; border-color: #202020; border-style: ridge; font-size:2em; font-family:"Trajan Pro","Times New Roman", Times, serif; overflow: auto; word-wrap: break-word} 

.TextCardArea {/*background:url(../../images/harbortouch/cardBigShadow.png) no-repeat bottom left;*/ padding:0 19px 23px 19px; position:relative; width:345px; margin:0 auto;}
.TextCardArea .Text {position:absolute; width:207px; height:102px; font-size:3em; font-family:sofia-pro,"Times New Roman", Times, serif; color:#fff; top:113px; left:134px; text-align:center; line-height:1.1em; border:1px dashed #b7b8c1; cursor:move;}
.editTextBox {width:900px; margin:0 auto;}

.TextCardArea .Text img.q-lt {position:absolute; top:-4px; left:-4px; height:7px; width:7px; display:block; cursor:nw-resize;}
.TextCardArea .Text img.q-tt  {position:absolute; top:-4px; left:50%; height:7px; width:7px; display:block; cursor:n-resize;}
.TextCardArea .Text img.q-rt  {position:absolute; top:-4px; right:-4px; height:7px; width:7px; display:block; cursor:ne-resize;}
.TextCardArea .Text img.q-lb  {position:absolute; bottom:-4px; left:-4px; height:7px; width:7px; display:block; cursor:sw-resize;}
.TextCardArea .Text img.q-bb  {position:absolute; bottom:-4px; left:50%; height:7px; width:7px; display:block; cursor:s-resize;}
.TextCardArea .Text img.q-rb  {position:absolute; bottom:-4px; right:-4px; height:7px; width:7px; display:block; cursor:se-resize;}
.TextCardArea .Text img.q-rr  {position:absolute; top:50%; right:-4px; height:7px; width:7px; display:block; cursor:e-resize;}
.TextCardArea .Text img.q-ll  {position:absolute; top:50%; left:-4px; height:7px; width:7px; display:block; cursor:w-resize;}

fieldset {border:none;}
fieldset.EditNote {padding-top:11px; padding-bottom:2px;}
fieldset.EditNote .Row {overflow:hidden; padding-bottom:5px;}
fieldset.EditNote label { font-weight:bold; font-size:1.1em; padding-bottom:3px; display:block;}
fieldset.EditNote textarea {border:1px solid #b0b0b0; width:400px; height:58px; padding:5px; font-family:Tahoma; font-size:1.1em; overflow:auto;}
fieldset.EditNote .Row .LeftBox {float:left; padding-right:4px;}
fieldset.EditNote .formSelect {border:1px solid #acacac; font-size:1.1em; font-family:Tahoma;}
fieldset.EditNote .formSelect option {padding:1px;}
fieldset.EditNote .w218 {width:216px;}
fieldset.EditNote .w90 {width:90px;}
fieldset.EditNote .w68 {width:68px;}
fieldset.EditNote .w110 {width:110px;}
fieldset.EditNote .btnTextLeft {background:url(../../images/harbortouch/btn-text-left.gif) no-repeat 0 0; width:23px; height:22px; float:left; border:none; cursor:pointer;}
fieldset.EditNote .btnTextCenter {background:url(../../images/harbortouch/btn-text-center.gif) no-repeat 0 0; width:25px; height:22px; float:left; border:none; cursor:pointer; margin-left:-1px;}
fieldset.EditNote .btnTextRight {background:url(../../images/harbortouch/btn-text-right.gif) no-repeat 0 0; width:25px; height:22px; float:left; border:none; cursor:pointer; margin-left:-1px;}
fieldset.EditNote .btnTextJustify {background:url(../../images/harbortouch/btn-text-justify.gif) no-repeat 0 0; width:23px; height:22px; float:left; border:none; cursor:pointer; margin-left:-1px;}
fieldset.EditNote .btnTextLeft:hover, fieldset.EditNote .btnTextRight:hover, fieldset.EditNote .btnTextCenter:hover, fieldset.EditNote .btnTextJustify:hover {background-position:0 -22px; position:relative;}

.box-gr2 .summary-form {padding:20px 31px 10px 21px;}
.box-gr2 .summary-form h4 {margin-bottom:6px;}
.box-gr2 .summary-form .radio-list {margin-bottom:16px;}
.box-gr2 .summary-form .radio-list li {font-size:1em; vertical-align:middle; margin-bottom:3px;}
.box-gr2 .summary-form .radio-list li input {vertical-align:middle;}
.box-gr2 .summary-form .radio-list li label {vertical-align:middle; padding-left:8px;}
.box-gr2 .summary-form table {width:100%; border-top:1px solid #d7d7d7; margin-bottom:13px;}
.box-gr2 .summary-form table td {font-size:1.1em; padding:3px 9px;}
.box-gr2 .summary-form table tr.even td {background-color:#ffffff;}
.box-gr2 .summary-form table .f-td {width:179px;}
.box-gr2 .summary-form  div.blueNote  {background-color:#d5ebff; color:#0071c7;margin-bottom:15px;}
.box-gr2 .summary-form table input,.box-gr2 .summary-form table select { font-family:sofia-pro, Tahoma, Geneva, sans-serif !important;}
.box-gr2 .summary-form table input[type="text"],.box-gr2 .summary-form table input[type="password"] { width:160px !important; border:1px solid #afafaf;}
.box-gr2 .summary-form table select { width:162px !important; border:1px solid #afafaf;}

.txt-inline {display: inline !important;}

.canvas {position:absolute; top:0;left:0;}
.dragable-canvas { cursor:move;}

div.Fader {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; z-index:20; opacity:0.2; filter: alpha(opacity = 20);}
div.fader-loading {position:absolute; top:0; left:0; width:100%; height:100%;}
div.popup-window {position: fixed;z-index:21; top:50% !important; margin-top:-180px;}
div.popup-window.loading {z-index:30;}
.pop-keys {position:relative; width:452px;z-index:100;}
.pop-keys div.caption {cursor:move;}
.pop-keys .t {background:url(../../images/harbortouch/pop-t.png) no-repeat; height:12px;}
.pop-keys .b {background:url(../../images/harbortouch/pop-b.png) no-repeat; height:14px;}
.pop-keys .content {background:url(../../images/harbortouch/pop-c.png) repeat-y; padding:11px 24px; width: 370px}
.pop-keys h2 {color:#136EF6; font-size:1.2em; margin-bottom:4px;}
.pop-keys h2 .side {float:right; margin:0 2px 2px; cursor:pointer;}
.pop-keys .sep {border-bottom:1px solid #e1e1e1; height:8px; margin-bottom:12px;}
.pop-keys p {font-size:1.2em;}
.pop-keys li {font-size:1.1em; margin-bottom:8px; $margin-bottom:4px;}
.pop-keys strong.st {color:#4d6a83;}
.pop-keys .radio-list label {font-size:1.1em; margin-right:3px;}
.pop-keys .f-rad-chkd .st {color:#136EF6;}
.pop-keys .radioL input {vertical-align:middle;}
.pop-keys .label-list {margin-top:-7px; $margin-top:-3px; margin-bottom:12px;}
.pop-keys .label-list li {clear:both; padding-top:7px; $padding-top:3px;}
.pop-keys .label-list label {display:block; font-weight:bold; margin-bottom:3px;}
.pop-keys .label-list label.radioL {display:inline; font-weight:normal;}
.pop-keys .label-list input.txt {width:163px; margin-right:7px;}
.pop-keys .label-list select {width:173px; margin-right:7px;}
.pop-keys .label-list .inf {color:#888; font-size:0.9em; line-height:1.3em; width:160px; margin-top:3px;}
.pop-keys .label-list .inf2 {margin-top:-2px;}
.pop-keys .label-list input.txt, .pop-keys .label-list select,.pop-keys .label-list .inf {float:left;}
.pop-keys p.count-note {font-size: 1.1em;}

.pop-keys .remain-keys {margin: 0 auto; font-size: 1.1em; text-align: center;}
.pop-keys .remain-keys input, .pop-keys .remain-keys select {width: 100px;}

.pop-ctrls {padding:8px 0 1px; overflow:hidden; zoom:1; margin:0 -1px 0 -5px;}
.pop-ctrls a {margin:0 3px;}

.PreviewArea {text-align:left;}
.PreviewArea .PictureArea {width:452px; min-height:294px; position:relative; margin-bottom:8px; border:1px solid #b4b4b4;}
/*
.PreviewArea .PictureArea .FrameT {position:absolute; top:0; left:0; background:url(../../images/harbortouch/cardFrameT.gif) repeat-x; width:452px; height:8px;}
.PreviewArea .PictureArea .FrameR {position:absolute; top:0; right:0; background:url(../../images/harbortouch/cardFrameR.gif) repeat-y; width:8px; min-height:294px; height:100%}
.PreviewArea .PictureArea .FrameB {position:absolute; bottom:0; left:0; background:url(../../images/harbortouch/cardFrameB.gif) repeat-x; width:452px; height:8px;}
.PreviewArea .PictureArea .FrameL {position:absolute; top:0; left:0; background:url(../../images/harbortouch/cardFrameL.gif) repeat-y; width:8px; min-height:294px; height:100%}
*/
.PreviewArea .PictureArea .FrameTL,.PreviewArea .PictureArea .FrameTR,.PreviewArea .PictureArea .FrameBL,.PreviewArea .PictureArea .FrameBR {position:absolute; width:25px; height:25px;}
/*
.PreviewArea .PictureArea .FrameTL {top:0; left:0; background:url(../../images/harbortouch/cardFrameTL.png) no-repeat;}
.PreviewArea .PictureArea .FrameTR {top:0; right:0; background:url(../../images/harbortouch/cardFrameTR.png) no-repeat;}
.PreviewArea .PictureArea .FrameBL {bottom:0; left:0; background:url(../../images/harbortouch/cardFrameBL.png) no-repeat;}
.PreviewArea .PictureArea .FrameBR {bottom:0; right:0; background:url(../../images/harbortouch/cardFrameBR.png) no-repeat;}
*/
.PreviewArea .PictureArea .FrameTL {top:0; left:0;}
.PreviewArea .PictureArea .FrameTR {top:0; right:0;}
.PreviewArea .PictureArea .FrameBL {bottom:0; left:0;}
.PreviewArea .PictureArea .FrameBR {bottom:0; right:0;}

.w-326 {width:326px;}

.messBox { width:246px; height:104px; border:1px solid #000; padding:10px 18px 10px 18px; text-align:center; overflow:hidden;}
.messBox h2 { padding:0; margin:0;font-family:sofia-prom, Tahoma, Geneva, sans-serif; font-size:21px; font-weight:normal; padding-bottom:15px; text-align:left;  }
.messBox input { padding-right:8px; border:none;}

.popup-content { margin: 20px 0; font-size: 1.2em; line-height: 1.6em; }

.timeCounter { font-weight: bold; }
table.pickerTable td{cursor: pointer; padding:0;}
table.pickerTable td span{ float:left;}
table.pickerTable td span img{ float:left;}
/*---------------------------------------Image------------------------------------------*/
.TextCardArea .ubcBack {
    background: url(../../images/harbortouch/GCBack.png) no-repeat left top;
    margin-top: 10px;
    margin-left: 2px;
    height: 213px;
    width: 338px;
    display: block
}