整理demo+UI

author: chengsir <[email protected]> 2019-10-30 18:02:09 +0800
committer: chengsir <[email protected]> 2019-10-30 18:02:09 +0800
commit: dcf1065c044cc0d5b7ba87c69cc6d6f01d0fa431 (patch)
tree: 5e9ffb58069e7dcc5e73095601ba6e176dc2d779 /demo/resources/css
parent: 48ae81c20ed8e8c6d17cd4a08d3d35ba30dffae7 (diff)
26 files changed, 1934 insertions, 0 deletions
diff --git a/demo/resources/css/axure_rp_page.css b/demo/resources/css/axure_rp_page.css
new file mode 100644
index 0000000..c1e37f6
--- /dev/null
+++ b/demo/resources/css/axure_rp_page.css
@@ -0,0 +1,292 @@
+/* so the window resize fires within a frame in IE7 */
+html, body {
+    height: 100%;
+}
+
+.mobileFrameCursor div * {
+    cursor: inherit !important;
+}
+
+a {
+    color: inherit;
+}
+
+p {
+    margin: 0px;
+    text-rendering: optimizeLegibility;
+    font-feature-settings: "kern" 1;
+    -webkit-font-feature-settings: "kern";
+    -moz-font-feature-settings: "kern";
+    -moz-font-feature-settings: "kern=1";
+    font-kerning: normal;
+}
+
+ul {
+    margin:0px;
+}
+
+iframe {
+    background: #FFFFFF;
+}
+
+/* to match IE with C, FF */
+input {
+    padding: 1px 0px 1px 0px;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+}
+
+input[type=text]::-ms-clear {
+    width: 0;
+    height: 0;
+    display: none;
+}
+
+textarea {
+    margin: 0px;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+}
+
+.focused:focus, .selectedFocused:focus {
+    outline: none;
+}
+
+div.intcases {
+    font-family: arial; 
+    font-size: 12px;
+    text-align:left; 
+    border:1px solid #AAA; 
+    background:#FFF none repeat scroll 0% 0%; 
+    z-index:9999; 
+    visibility:hidden; 
+    position:absolute;
+    padding: 0px;
+    border-radius: 3px;
+    white-space: nowrap;
+}
+
+div.intcaselink {
+    cursor: pointer;
+    padding: 3px 8px 3px 8px;
+    margin: 5px;
+    background:#EEE none repeat scroll 0% 0%; 
+    border:1px solid #AAA;
+    border-radius: 3px;
+}
+
+div.refpageimage {
+    position: absolute;
+    left: 0px;
+    top: 0px;
+    font-size: 0px;
+    width: 16px;
+    height: 16px;
+    cursor: pointer;
+    background-image: url(images/newwindow.gif);
+    background-repeat: no-repeat;
+}
+
+div.annnoteimage {
+    position: absolute;
+    left: 0px;
+    top: 0px;
+    font-size: 0px;
+    /*width: 16px;
+    height: 12px;*/
+    cursor: help;
+    /*background-image: url(images/note.gif);*/
+    /*background-repeat: no-repeat;*/
+    width: 13px;
+    height: 12px;
+    padding-top: 1px;
+    text-align: center;
+    background-color: #138CDD;
+    -moz-box-shadow: 1px 1px 3px #aaa;
+    -webkit-box-shadow: 1px 1px 3px #aaa;
+    box-shadow: 1px 1px 3px #aaa;
+}
+
+div.annnoteline {
+    display: inline-block;
+    width: 9px;
+    height: 1px;
+    border-bottom: 1px solid white;
+    margin-top: 1px;
+}
+
+div.annnotelabel {
+    /*position: absolute;
+    left: 0px;
+    top: 0px;*/
+    font-family: Helvetica,Arial;
+    white-space: nowrap;
+    
+    padding-top: 1px;
+    background-color: #fff849;
+    font-size: 10px;
+    font-weight: bold;
+    line-height: 14px;
+    margin-right: 3px;
+    padding: 0px 4px;
+    color: #000;
+
+    -moz-box-shadow: 1px 1px 3px #aaa;
+    -webkit-box-shadow: 1px 1px 3px #aaa;
+    box-shadow: 1px 1px 3px #aaa;
+}
+
+div.annnote {
+    display: flex;
+    position: absolute;
+    cursor: help;
+    line-height: 14px;
+}
+
+.annotation {
+    font-size: 12px;
+    padding-left: 2px;
+    margin-bottom: 5px;
+}
+
+.annotationName {
+    /*font-size: 13px;
+    font-weight: bold;
+    margin-bottom: 3px;
+    white-space: nowrap;*/
+
+    font-family: 'Trebuchet MS';
+    font-size: 14px;
+    font-weight: bold;
+    margin-bottom: 5px;
+    white-space: nowrap;
+}
+
+.annotationValue {
+    font-family: Arial, Helvetica, Sans-Serif;
+    font-size: 12px;
+    color: #4a4a4a;
+    line-height: 21px;
+    margin-bottom: 20px;
+}
+
+.noteLink {
+    text-decoration: inherit;
+    color: inherit;
+}
+
+.noteLink:hover {
+    background-color: white;
+}
+
+/* this is a fix for the issue where dialogs jump around and takes the text-align from the body */
+.dialogFix {
+    position:absolute;
+    text-align:left;
+    border: 1px solid #8f949a;
+}
+
+
+@keyframes pulsate {
+  from {
+    box-shadow: 0 0 10px #15d6ba;
+  }
+  to {
+    box-shadow: 0 0 20px #15d6ba;
+  }
+}
+
+@-webkit-keyframes pulsate {
+  from {
+    -webkit-box-shadow: 0 0 10px #15d6ba;
+    box-shadow: 0 0 10px #15d6ba;
+  }
+  to {
+    -webkit-box-shadow: 0 0 20px #15d6ba;
+    box-shadow: 0 0 20px #15d6ba;
+  }
+}
+ 
+@-moz-keyframes pulsate {
+  from {
+    -moz-box-shadow: 0 0 10px #15d6ba;
+    box-shadow: 0 0 10px #15d6ba;
+  }
+  to {
+    -moz-box-shadow: 0 0 20px #15d6ba;
+    box-shadow: 0 0 20px #15d6ba;
+  }
+}
+
+.legacyPulsateBorder {
+    /*border: 5px solid #15d6ba;
+    margin: -5px;*/
+    -moz-box-shadow: 0 0 10px 3px #15d6ba;
+    box-shadow: 0 0 10px 3px #15d6ba;
+}
+
+.pulsateBorder {
+  animation-name: pulsate;
+  animation-timing-function: ease-in-out;
+  animation-duration: 0.9s;
+  animation-iteration-count: infinite;
+  animation-direction: alternate;
+  
+  -webkit-animation-name: pulsate;
+  -webkit-animation-timing-function: ease-in-out;
+  -webkit-animation-duration: 0.9s;
+  -webkit-animation-iteration-count: infinite;
+  -webkit-animation-direction: alternate;
+
+  -moz-animation-name: pulsate;
+  -moz-animation-timing-function: ease-in-out;
+  -moz-animation-duration: 0.9s;
+  -moz-animation-iteration-count: infinite;
+  -moz-animation-direction: alternate;
+}
+
+.ax_default_hidden, .ax_default_unplaced{
+    display: none;
+    visibility: hidden;
+}
+
+.widgetNoteSelected {
+    -moz-box-shadow: 0 0 10px 3px #138CDD;
+    box-shadow: 0 0 10px 3px #138CDD;
+    /*-moz-box-shadow: 0 0 20px #3915d6;
+    box-shadow: 0 0 20px #3915d6;*/
+    /*border: 3px solid #3915d6;*/
+    /*margin: -3px;*/
+}
+
+
+.singleImg {
+    display: none;
+    visibility: hidden;
+}
+
+#ios-safari {
+    overflow: auto;
+    -webkit-overflow-scrolling: touch;
+}
+
+#ios-safari-html {
+    display: block;
+    overflow: auto;
+    -webkit-overflow-scrolling: touch;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+}
+
+#ios-safari-fixed {
+    position: absolute;
+    pointer-events: none;
+    width: initial;
+}
+
+#ios-safari-fixed div {
+    pointer-events: auto;
+}
+\ No newline at end of file
diff --git a/demo/resources/css/default.css b/demo/resources/css/default.css
new file mode 100644
index 0000000..7004872
--- /dev/null
+++ b/demo/resources/css/default.css
@@ -0,0 +1,1044 @@
+body {
+    font-family: 'Source Sans Pro', 'Trebuchet MS', Arial;
+    font-size: 14px;
+    color: #2c2c2c;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+    -webkit-font-feature-settings: "kern";
+    -moz-font-feature-settings: "kern";
+    -moz-font-feature-settings: "kern=1";
+    font-feature-settings: "kern" 1;
+    font-kerning: normal;
+    overflow: hidden;
+}
+
+a {
+  cursor: pointer;
+}
+
+input[type="radio"], input[type="checkbox"] {
+    margin: 0px 9px 0px 0px;
+    vertical-align: bottom;
+}
+
+input {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+
+input[type=text]::-ms-clear {
+    width: 0;
+    height: 0;
+    display: none;
+}
+
+#outerContainer {
+    position: absolute;
+    width:1000px;
+    height:1500px;
+    overflow: hidden;
+    display: flex;
+}
+
+#mobileControlFrameContainer {
+    position: absolute;
+    width: 100%;
+    pointer-events: none;
+}
+
+.splitbar {
+    display: none;
+    position: absolute;
+    top: 0px;
+    width: 3px;
+    height: 100%;
+    cursor: ew-resize;
+    z-index: 5;
+    user-select: none;
+}
+
+.splitbar:hover, .splitbar.active {
+    background: #cccccc;
+}
+
+#lsplitbar {
+    border-right: 1px solid #cccccc;
+}
+
+#rsplitbar {
+    border-left: 1px solid #cccccc;
+}
+
+#mainPanel {
+    background-color: #d8d8d8;
+    opacity: 0; 
+    flex: 1;
+    overflow: hidden;
+}
+
+#clippingBounds {
+    width: 100%;
+    overflow: hidden;
+    pointer-events: none;
+    position: absolute;
+    z-index: 1;
+}
+
+#clippingBounds div {
+    pointer-events: auto;
+}
+
+#clippingBoundsScrollContainer {
+    position: absolute;
+    pointer-events: none;
+}
+
+#browserOutOfDateNotification {
+    width: 100%;
+    height: 289px;
+    background-color: #e36154;
+    padding-top: 40px;
+    color: #FFFFFF;
+}
+    .mobileMode #browserOutOfDateNotification {
+        padding-top: 15px;
+    }
+
+#supportedBrowsersListContainer {
+    border-radius: 5px;
+    line-height: 1.64;
+    background-color: #c3463a;
+    padding-top: 4px;
+    width: 255px;
+    margin: auto;
+}
+
+.browserName {
+    display: inline-block;
+    width: 55%;
+    font-weight: bold;
+    margin-left: 18px;
+}
+
+.browserSupportedVersion {
+    display: inline-block;
+    font-style: italic;
+}
+
+#browserOutOfDateNotificationButtons {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 28px;
+}
+    .mobileMode #browserOutOfDateNotificationButtons {
+        margin-top: 8px;
+    }
+
+#updateBrowserButton {
+    display: inline-block;
+    width: 330px;
+    height: 35px;
+    margin-left: auto;
+    line-height: 35px;
+    text-decoration: none;
+    text-align: center;
+    border-radius: 9px;
+    border: solid 1px #FFFFFF;
+    color: #FFFFFF;
+}
+
+#continueToPrototypeButton {
+    display: inline-block;
+    text-align: center;
+    line-height: 37px;
+    text-decoration: underline;
+}
+
+#topPanel {
+    z-index: 1;
+    height: 36px;
+    background-color: #f2f2f2;
+    border-bottom: 1px solid #cccccc;
+    user-select: none;
+}
+
+.leftPanel, .rightPanel, .mobileOnlyPanel {
+    position: relative;
+    background-color: #f2f2f2;
+    overflow: hidden;
+    width: 0px;
+    flex-shrink: 0;
+}
+
+
+.popup, .leftPanel.popup {
+    position: absolute;
+    z-index: 20000;
+    display: none;
+    background-color: #f2f2f2;
+    border: solid 1px #bdbcbc;
+    position: absolute;
+    box-shadow: 0 1px 2px 0 rgba(87, 87, 87, 0.5);
+}
+
+.leftPanel.popup .sitemapHeader, .leftPanel.popup #searchDiv {
+    display: none;
+}
+
+#clipFrameScroll {
+}
+
+.splitterMask {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    background-image: url(../images/transparent.gif);
+    z-index: 10000;
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+#maximizePanelContainer {
+  font-size: 4px;
+  overflow: hidden;
+  z-index: 1000;
+  display: none;
+}
+
+#maximizePanel {
+    background-color: #f2f2f2;
+    cursor: pointer;
+}
+
+#maximizePanelContainer, #maximizePanelOver, #maximizePanel {
+  position:absolute;
+  left: 0px;
+  top: 0px;
+  width: 28px;
+  height: 36px;
+}
+
+#interfaceControlFrameMinimizeContainer {
+    font-size: 2px; /*for IE*/
+    text-align: right;
+    z-index: 100;
+    height: 36px;
+    width: 28px;
+    border-right: solid 1px #cbcbcb;
+}
+#interfaceControlFrameMinimizeContainer a {
+    display: inline-block;
+    width: 28px;
+    height: 100%;
+    font-size: 2px;
+    text-decoration: none;
+}
+
+#interfaceControlFrame {
+    height: 100%;
+    display: flex;
+    opacity: 0;
+}
+
+#interfaceControlFrameCloseContainer {
+    display: none;
+    font-size: 9px;
+    font-weight: bold;
+    letter-spacing: 1px;
+    z-index: 100;
+    width: 55px;
+    background-color: #62666b;
+    text-align: center;  
+}
+#interfaceControlFrameCloseContainer a {
+    display: inline-block;
+    width: 55px;
+    color: #ffffff;
+    padding: 5px 0px;
+}
+#inspectControlFrameHeader li {
+    float: left;
+    display: block;
+    width: 42px;
+    height: 36px;
+    padding: 4px 5px 4px 5px;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+
+#inspectControlFrameHeader li a {
+    height: 100%;
+    width: 32px;
+    display: block;
+    text-align: center;
+    outline: none;
+    text-decoration: none;
+    white-space: nowrap;
+    background-color: transparent;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+
+.hashover #inspectControlFrameHeader li a:hover {
+    border-radius: 3px;
+    background-color: #e6e6e6;
+}
+
+/*#inspectControlFrameHeader li a.selected, #inspectControlFrameHeader li a.selected:hover {
+    background-color: inherit;
+}*/
+
+#inspectControlFrameHeaderContainer {
+    overflow: visible;
+}
+
+#inspectControlFrameHeader {
+    position: relative;
+    list-style: none;
+    z-index: 50;
+    letter-spacing: 1px;
+    display: flex;
+}
+
+#projectControlFrameHeaderContainer {
+    overflow: visible;
+}
+
+#projectControlFrameHeader {
+    position: relative;
+    list-style: none;
+    font-size: 8px;
+    z-index: 50;
+    font-weight: bold;
+    letter-spacing: 1px;
+}
+
+#projectControlFrameHeader li {
+    float: left;
+    display: block;
+    width: 28px;
+    height: 28px;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+
+#projectControlFrameHeader li a {
+    display: block;
+    height: 100%;
+    width: 32px;
+    outline: none;
+    margin: auto;
+    text-decoration: none;
+    color: #ffffff;
+    white-space: nowrap;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+
+.hashover #projectControlFrameHeader li a:hover {
+    border-radius: 3px;
+    background-color: #e6e6e6;
+}
+
+/*#projectControlFrameHeader li a.selected, #projectControlFrameHeader li a.selected:hover {
+    background-color: inherit;
+}*/
+
+#handoffControlFrameHeaderContainer {
+    display: none;
+}
+
+#handoffControlFrameHeader li {
+    float: left;
+    display: block;
+    width: 44px;
+    height: 36px;
+    margin: 0px 3.5px 0px 3.5px;
+    padding: 4px 6px 4px 6px;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+
+#handoffControlFrameHeader li.selected {
+    padding: 0px;
+    border-bottom: 2px solid #008dcb;
+}
+
+#handoffControlFrameHeader li a {
+    float: left;
+    height: 100%;
+    width: 32px;
+    display: block;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+
+.hashover #handoffControlFrameHeader li a:hover {
+    border-radius: 3px;
+    background-color: #e6e6e6;
+}
+
+#handoffControlFrameHeader li a.selected {
+    width: 100%;
+    /*background-color: inherit;*/
+}
+
+#publishContainer {
+    display: none;
+    margin: 6px 20.5px 5px;
+    width: 150px;
+    height: 25px;
+    border-radius: 10px;
+    background-color: #008dcb;
+}
+
+
+#publishContainer.preview {
+    display: block;
+}
+
+#overflowBtn {
+    order: 5;
+}
+
+#overflowMenuButton {
+    background: url('../images/overflow-icon.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+#overflowMenuButton.selected {
+    background: url('../images/overflow_icon_off.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+
+.overflowOptionCheckbox, #projectOptionsHotspotsCheckbox {
+    position: relative;
+    border: solid 1px #8c8c8c;
+    display: inline-block;
+}
+    .overflowOptionCheckbox {
+        width: 10px;
+        height: 10px;
+        margin-right: 14px;
+        top: 1px;
+    }
+    #projectOptionsHotspotsCheckbox {
+        width: 16px;
+        height: 16px;
+        margin-right: 25px;
+        margin-left: 21px;
+        top: 2.5px;
+    }
+
+.overflowOptionCheckbox.selected, #projectOptionsHotspotsCheckbox.selected {
+    background: url('../images/overflow_checkmark.svg') no-repeat center center, linear-gradient(transparent,transparent);
+    background-color: #20bba6;
+    border: solid 1px #20bba6;
+    background-size: contain;
+}
+
+#overflowMenuContainer {
+    display: none;
+    flex-direction: column;
+    top: 36px;
+    right: 80px;
+    width: 171px;
+    border-radius: 2px;
+}
+
+#overflowMenuContainer.popup {
+    display: flex;
+}
+
+.showOption {
+    font-size: 14px;
+	padding: 9px 0px 0px 15px;
+    color: #3B3B3B;
+}
+
+.showOption:hover {
+	cursor: pointer;
+}
+
+#signInButton {
+    padding: 0px 20px 0px 20px;
+    width: 50.8px;
+    height: 16px;
+    font-size: 12px;
+    text-align: center;
+    line-height: 22px;
+}
+
+#accountLoginContainer {
+    display: none;
+    right: 220px;
+}
+
+.accountOption {
+    font-size: 12px;
+    padding: 7px;
+    line-height: 1.83;
+}
+
+/* temporary sign in css (borrowed from feedback9.css*/
+.feedbackGreenBtn_Player {
+    background-color: #74BC68;
+    border-radius: 2.5px;
+    box-shadow: inset 0 -1px 0 0 rgba(137, 137, 137, 0.58);
+    color: #FFFFFF;
+    cursor: pointer;
+    font-size: 12px;
+    height: 25px;
+    line-height: 25px;
+}
+
+    .feedbackGreenBtn_Player:hover {
+        background-color: #58964E;
+    }
+/* Axure Commenter Login w/out pin */
+.axureLoginBubble_Player {
+    background-color: #F2F2F2 !important;
+}
+
+.axureLoginBubbleContainer_Player {
+    padding: 5px;
+}
+
+    .axureLoginBubbleContainer_Player input {
+        width: 100%;
+        padding: 0 5px;
+        margin-bottom: 10px;
+        height: 30px;
+        font-size: 14px;
+    }
+
+    .axureLoginBubbleContainer_Player span {
+        margin: 0;
+    }
+
+div.axClearMsgBubble_Player {
+    padding: 10px;
+    max-width: 300px;
+    text-align: center;
+}
+
+    div.axClearMsgBubble_Player span {
+        margin: 2px;
+        white-space: pre-wrap;
+        white-space: -moz-pre-wrap; /* Firefox */
+        white-space: -pre-wrap; /* Opera <7 */
+        white-space: -o-pre-wrap; /* Opera 7 */
+        word-wrap: break-word; /* IE */
+    }
+
+
+#publishButton {
+    display: block;
+    width: 95px;
+    margin: auto;
+    font-size: 14px;
+    line-height: 26px;
+    color: #ffffff;
+}
+
+.maximizeCaret {
+    width: 5px;
+    height: 5px;
+    object-fit: contain;
+    border-right: solid 1.5px #525252;
+    border-top: solid 1.5px #525252;
+    margin: auto;
+}
+.caret {
+    width: 9px;
+    height: 7px;
+    background: url('../images/caret_down.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+.selected .caret {
+    background: url('../images/caret_down_off.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+.upCaret {
+    transform: rotate(-45deg);
+}
+.leftCaret {
+    transform: rotate(-135deg);
+}
+.downCaret {
+    transform: rotate(-225deg);
+}
+.rightCaret {
+    transform: rotate(-315deg);
+}
+
+#pageSelectDropdown, #adaptiveViewsDropdown {
+    display: inline-block;
+    margin-left: 8px;
+}
+
+.minimizeIcon, .maximizeIcon {
+    transition: .25s linear;
+    position: absolute;
+    height: 36px;
+    width: 28px;
+}
+
+#minimizeX {
+    background: url('../images/close_x_minimize.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+
+#minimizeArrow {
+    opacity: 0;
+    transform: rotate(270deg);
+    background: url('../images/caret_down.svg') no-repeat center center, linear-gradient(transparent,transparent);
+} 
+
+#maximizeButton {
+    transform: rotate(-270deg);
+    background: url('../images/caret_down.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+
+.collapseHovered #minimizeX {
+    transition: .25s linear;
+    opacity: 0;
+    transform: rotate(-90deg);
+}
+
+.collapseHovered #minimizeArrow {
+    transition: .25s linear;
+    opacity: 1;
+    transform: rotate(90deg);
+}
+
+#maximizeButton.rotated {
+    transition: .20s linear;
+    transform: rotate(-90deg);
+}
+
+.expandHovered #minimizeX {
+    opacity: 0;
+}
+
+.expandHovered #minimizeArrow {
+    opacity: 1;
+}
+
+#separatorContainer {
+    display: none; 
+    line-height: 24px;
+    height: 36px;
+}
+
+#separatorContainer.hasLeft {
+    display: block;
+}
+
+.separator {
+    display: block;
+    width: 0px;
+    height: 100%;
+    border: solid 0.5px #c4c4c4;
+}
+
+#interfacePageNameContainer {
+    float: left;
+    cursor: pointer;
+}
+
+#sitemapControlFrameContainer{
+    display: flex;
+    margin: 4px 6px;
+}
+
+.hashover #sitemapControlFrameContainer:hover {
+    border-radius: 3px;
+    background-color: #e6e6e6;
+}
+
+/*.hashover #sitemapControlFrameContainer.selected:hover {
+    background-color: inherit;
+}*/
+
+#interfaceOverflowMenuContainer {
+    position: absolute;
+    display: none;
+    width: 220px;
+    background-color: #f2f2f2;
+    right: 240px;
+}
+
+.pageNameHeader {
+    float: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 175px;
+    margin-left: 10px;
+    margin-right: 6px;
+}
+
+#interfaceAdaptiveViewsContainer {
+    display: none;
+    margin: 4px 0px 4px 30.5px;
+    padding: 0px 6px;
+    cursor: pointer;
+}
+#interfaceAdaptiveViewsContainer:hover {
+    border-radius: 3px;
+    background-color: #e6e6e6;
+}
+
+.adaptiveViewHeader {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+#interfaceAdaptiveViewsButton {
+    float: left;
+    max-width: 145px;
+}
+
+#interfaceAdaptiveViewsIconButton {
+    display: none;
+    float:left;
+    width: 16px;
+    margin-right: 6px;
+    background: url('../images/views-icon.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+
+#interfaceScaleContainer {
+    line-height: 36px;
+    padding: 0px 10px;
+    cursor: pointer;
+}
+
+.scaleHeader {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+#overflowMadeWith {
+    line-height: 36px;
+    margin: 0px 12px;
+}
+
+#axureLogo {
+    display: inline-block;
+    width: 56px;
+    height: 36px;
+    padding-top: 1px;
+    background: url('../images/axure9_logo.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+
+#overflowMenuContainer > #overflowMadeWith {
+    line-height: 24px;
+    border-top: 1px solid #ccc;
+    margin-top: 7px;
+    padding-top: 7px;
+}
+
+#interfaceControlFrameContainer {
+    overflow: hidden;
+    height: 36px;
+    display: flex;
+}
+
+#interfaceControlFrameLeft {
+    flex: 1;
+    display: flex;
+    font-size: 14px;
+    line-height: 29px;
+    color: #3b3b3b;
+}
+
+#interfaceControlFrameRight {
+    flex: 1;
+    display: flex;
+    justify-content: flex-end;
+}
+
+#interfaceControlFrameLogoContainer {
+    overflow: hidden;
+    margin-left: auto;
+    margin-right: auto;
+    height: 100%;
+    display: flex;
+}
+
+#interfaceControlFrameLogoCaptionContainer {
+    text-align: center;
+    margin: 5px 10px 0px 10px;
+    font-size: 14px;
+    color: #4a4a4a;
+    font-weight: bold;
+    line-height: 30px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+#previewNotice {
+    font-size: 14px;
+    line-height: 36px;
+    display: none;
+}
+
+#logoImage {
+    margin: 12px;
+    max-width: 150px;
+    max-height: 12px;
+}
+
+.emptyStateContainer {
+    text-align: center;
+    padding: 0px 10px;
+    margin-top: 32px
+}
+
+.emptyStateTitle {
+    margin: 0px 0px 9px 0px;
+    font-weight: bold;
+}
+
+.emptyStateContent {
+    line-height: 22px;
+}
+
+.dottedDivider {
+    height: 2px;
+    margin: 15px 0px 15px 0px;
+    background: url('../images/divider.png') no-repeat center center;
+    background: url('../images/divider.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+
+.mobileMode .dottedDivider {
+    display: none;
+}
+
+.nondottedDivider {
+    height: 2px;
+    margin: 9px 0px 9px 0px;
+}
+
+.lineDivider {
+    height: 2px;
+    margin: 10px 12px 20px 12px;
+    border-bottom: solid 1px #e7e7e7;
+}
+
+.pluginNameHeader {
+    font-size: 14px;
+    font-weight: bold;
+    color: #6d6d6d;
+}
+
+.mobileMode .pluginNameHeader {
+    margin: 14px 12px 13px 12px;
+    font-size: 18px;
+    color: #6d6d6d;
+}
+
+#projectOptionsHost {
+    display: flex;
+    flex-direction: column;
+}
+
+#projectOptionsScrollContainer {
+    overflow: auto;
+    width: 100%;
+    -webkit-overflow-scrolling: touch;
+    flex: 1;
+}
+
+div.mobileSubHeader {
+    font-size: 18px;
+    font-weight: bold;
+    color: #4a4a4a;
+    margin: 0px 12px 11px 15px;
+}
+
+div.mobileText, span.mobileText {
+    font-size: 16px;
+    color: #4a4a4a;
+}
+
+.nativeMenuText {
+    height: 20px;
+    font-size: 14px;
+    text-align: center;
+    color: #ffffff;
+    margin-top: 6px;
+    margin-bottom: 13px;
+    text-decoration: none;
+}
+
+#refreshText, #exitText {
+    margin-top: 6px;
+}
+
+#returnText {
+    margin-top: 7px;
+}
+
+#refreshIcon {
+    height: 20px;
+    object-fit: contain;
+    background: url('../images/refresh.svg') no-repeat center center, linear-gradient(transparent,transparent);
+    margin-top: 14px;
+}
+
+#exitIcon {
+    height: 19px;
+    object-fit: contain;
+    background: url('../images/exit.svg') no-repeat center center, linear-gradient(transparent,transparent);
+    margin-top: 14px;
+}
+
+#returnIcon {
+    height: 46px;
+    object-fit: contain;
+    background: url('../images/return.svg') no-repeat center center, linear-gradient(transparent,transparent);
+}
+
+
+.nativePrototypeButton {
+    width:50%;
+    margin-left:auto;
+    margin-right:auto;
+}
+
+.circleBackground {
+    border-radius: 50%;
+    behavior: url(PIE.htc);
+    margin: auto;
+    box-shadow: 3px 3px 3px 0 rgba(55, 55, 55, 0.5);
+}
+
+#returnBackground {
+    width: 46px;
+    height: 46px;
+    background-color: #ffffff;
+}
+
+#closeBackground {
+    width: 61px;
+    height: 61px;
+    background-color: #f2f2f2;
+}
+
+.closeIconSlash {
+    width: 35px;
+    height: 5px;
+    background-color: #9b9b9b;
+    position: relative;
+    margin: auto;
+}
+#forwardSlash{
+    top: 28px;
+    transform: rotate(-45deg);
+}
+#backwardSlash{
+    transform: rotate(90deg);
+}
+
+.mobilePrototypeControlFrame {
+    position: absolute;
+    display: none;
+    width: 100%;
+    min-width: 310px;
+    bottom: 0px;
+    z-index: 2;
+    pointer-events: auto;
+}
+
+#nativeMenuBlueBackground {
+    height: 72px;
+    width: 100%;
+    background-color: #008fe0;
+}
+
+#mHideSidebar {
+    position: absolute;
+    width: 10000px;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.5);
+    top: 0px;
+    z-index: 2;
+    display: none;
+    left: -60px;
+}
+
+/*@media (max-width: 419px) {*/
+    .mobileMode #topPanel {
+        display: none;
+    }
+
+    .mobileMode #mainPanel {
+        -webkit-overflow-scrolling: touch;
+    }
+
+    .mobileMode .leftPanel, .mobileMode .rightPanel, .mobileMode .mobileOnlyPanel {
+        box-shadow: 0 5.5px 5px 0 rgba(0, 0, 0, 0.24), 0 9px 18px 0 rgba(0, 0, 0, 0.18);
+        top: 45px;
+        left: 100px;
+    }
+
+    .mobileMode .leftPanel, .mobileMode .rightPanel, .mobileMode .mobileOnlyPanel {
+        float: left;
+    }
+
+    .mobileMode .rightPanel {
+        margin-left: 13px;
+    }
+
+    .mobileMode #maximizePanelContainer {
+        display: none;
+    }
+/*}*/
+
+@media (max-width: 850px) {
+    #overflowMenuContainer {
+        right: 0px;
+    }
+
+    #overflowMadeWith, #publishContainer.preview, #separatorContainer, #separatorContainer.hasLeft {
+        display: none;
+    }
+
+    #interfaceControlFrameLogoCaptionContainer {
+        display: none;
+    }
+
+    #interfaceControlFrameContainer {
+        justify-content: flex-end;
+    }
+
+    #interfaceAdaptiveViewsButton {
+        display: none;
+    }
+
+    #interfaceAdaptiveViewsIconButton {
+        display: block;
+    }
+
+    #interfaceAdaptiveViewsContainer {
+        padding-left: 8px;
+    }
+}
+
+@media (max-width: 700px) {
+    #interfacePageNameContainer {
+        display: none;
+    }
+}
+
diff --git a/demo/resources/css/images/images.html b/demo/resources/css/images/images.html
new file mode 100644
index 0000000..668c2a3
--- /dev/null
+++ b/demo/resources/css/images/images.html
@@ -0,0 +1,25 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
+<html>
+	<head>
+		<title></title>
+	</head>
+	<body>
+	<p>
+	    <img border="0" src="note.gif" width="1" height="1">
+        <img border="0" src="newwindow.gif" width="1" height="1">
+        <img border="0" src="ui-bg_flat_0_aaaaaa_40x100.png" width="1" height="1">
+        <img border="0" src="ui-bg_glass_55_fbf9ee_1x400.png" width="1" height="1">
+        <img border="0" src="ui-bg_glass_65_ffffff_1x400.png" width="1" height="1">
+        <img border="0" src="ui-bg_glass_75_dadada_1x400.png" width="1" height="1">
+        <img border="0" src="ui-bg_glass_75_e6e6e6_1x400.png" width="1" height="1">
+        <img border="0" src="ui-bg_glass_75_ffffff_1x400.png" width="1" height="1">
+        <img border="0" src="ui-bg_highlight-soft_75_cccccc_1x100.png" width="1" height="1">
+        <img border="0" src="ui-bg_inset-soft_95_fef1ec_1x100.png" width="1" height="1">
+        <img border="0" src="ui-icons_222222_256x240.png" width="1" height="1">
+        <img border="0" src="ui-icons_2e83ff_256x240.png" width="1" height="1">
+        <img border="0" src="ui-icons_454545_256x240.png" width="1" height="1">
+        <img border="0" src="ui-icons_888888_256x240.png" width="1" height="1">
+        <img border="0" src="ui-icons_cd0a0a_256x240.png" width="1" height="1">
+   </p>
+   </body>
+</html>
+\ No newline at end of file
diff --git a/demo/resources/css/images/newwindow.gif b/demo/resources/css/images/newwindow.gif
new file mode 100644
index 0000000..7b14cb0
--- /dev/null
+++ b/demo/resources/css/images/newwindow.gif
diff --git a/demo/resources/css/images/note.gif b/demo/resources/css/images/note.gif
new file mode 100644
index 0000000..a8c2762
--- /dev/null
+++ b/demo/resources/css/images/note.gif
diff --git a/demo/resources/css/images/touch.cur b/demo/resources/css/images/touch.cur
new file mode 100644
index 0000000..01355e8
--- /dev/null
+++ b/demo/resources/css/images/touch.cur
diff --git a/demo/resources/css/images/touch.svg b/demo/resources/css/images/touch.svg
new file mode 100644
index 0000000..9903c7f
--- /dev/null
+++ b/demo/resources/css/images/touch.svg
@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
+    <title>touch_update</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <circle id="path-1" cx="859" cy="783" r="24"></circle>
+        <filter x="-26.0%" y="-26.0%" width="152.1%" height="152.1%" filterUnits="objectBoundingBox" id="filter-2">
+            <feMorphology radius="0.5" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
+            <feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"></feComposite>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+        <filter x="-41.7%" y="-41.7%" width="183.3%" height="183.3%" filterUnits="objectBoundingBox" id="filter-3">
+            <feGaussianBlur stdDeviation="7.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
+            <feOffset dx="5" dy="8" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
+            <feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
+            <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 0.356034873 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Sitemap-expanded" transform="translate(-827.000000, -751.000000)" fill-rule="nonzero">
+            <g id="touch_update">
+                <use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
+                <use fill-opacity="0.236894248" fill="#E4DEDE" fill-rule="evenodd" xlink:href="#path-1"></use>
+                <use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
+                <use stroke-opacity="0.225798234" stroke="#CACACA" stroke-width="1" xlink:href="#path-1"></use>
+            </g>
+        </g>
+    </g>
+</svg>
+\ No newline at end of file
diff --git a/demo/resources/css/images/ui-bg_flat_0_aaaaaa_40x100.png b/demo/resources/css/images/ui-bg_flat_0_aaaaaa_40x100.png
new file mode 100644
index 0000000..5b5dab2
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_flat_0_aaaaaa_40x100.png
diff --git a/demo/resources/css/images/ui-bg_glass_55_fbf9ee_1x400.png b/demo/resources/css/images/ui-bg_glass_55_fbf9ee_1x400.png
new file mode 100644
index 0000000..ad3d634
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_glass_55_fbf9ee_1x400.png
diff --git a/demo/resources/css/images/ui-bg_glass_65_ffffff_1x400.png b/demo/resources/css/images/ui-bg_glass_65_ffffff_1x400.png
new file mode 100644
index 0000000..42ccba2
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_glass_65_ffffff_1x400.png
diff --git a/demo/resources/css/images/ui-bg_glass_75_dadada_1x400.png b/demo/resources/css/images/ui-bg_glass_75_dadada_1x400.png
new file mode 100644
index 0000000..5a46b47
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_glass_75_dadada_1x400.png
diff --git a/demo/resources/css/images/ui-bg_glass_75_e6e6e6_1x400.png b/demo/resources/css/images/ui-bg_glass_75_e6e6e6_1x400.png
new file mode 100644
index 0000000..86c2baa
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_glass_75_e6e6e6_1x400.png
diff --git a/demo/resources/css/images/ui-bg_glass_75_ffffff_1x400.png b/demo/resources/css/images/ui-bg_glass_75_ffffff_1x400.png
new file mode 100644
index 0000000..e65ca12
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_glass_75_ffffff_1x400.png
diff --git a/demo/resources/css/images/ui-bg_highlight-soft_75_cccccc_1x100.png b/demo/resources/css/images/ui-bg_highlight-soft_75_cccccc_1x100.png
new file mode 100644
index 0000000..7c9fa6c
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_highlight-soft_75_cccccc_1x100.png
diff --git a/demo/resources/css/images/ui-bg_inset-soft_95_fef1ec_1x100.png b/demo/resources/css/images/ui-bg_inset-soft_95_fef1ec_1x100.png
new file mode 100644
index 0000000..0e05810
--- /dev/null
+++ b/demo/resources/css/images/ui-bg_inset-soft_95_fef1ec_1x100.png
diff --git a/demo/resources/css/images/ui-icons_222222_256x240.png b/demo/resources/css/images/ui-icons_222222_256x240.png
new file mode 100644
index 0000000..b273ff1
--- /dev/null
+++ b/demo/resources/css/images/ui-icons_222222_256x240.png
diff --git a/demo/resources/css/images/ui-icons_2e83ff_256x240.png b/demo/resources/css/images/ui-icons_2e83ff_256x240.png
new file mode 100644
index 0000000..09d1cdc
--- /dev/null
+++ b/demo/resources/css/images/ui-icons_2e83ff_256x240.png
diff --git a/demo/resources/css/images/ui-icons_454545_256x240.png b/demo/resources/css/images/ui-icons_454545_256x240.png
new file mode 100644
index 0000000..59bd45b
--- /dev/null
+++ b/demo/resources/css/images/ui-icons_454545_256x240.png
diff --git a/demo/resources/css/images/ui-icons_888888_256x240.png b/demo/resources/css/images/ui-icons_888888_256x240.png
new file mode 100644
index 0000000..6d02426
--- /dev/null
+++ b/demo/resources/css/images/ui-icons_888888_256x240.png
diff --git a/demo/resources/css/images/ui-icons_cd0a0a_256x240.png b/demo/resources/css/images/ui-icons_cd0a0a_256x240.png
new file mode 100644
index 0000000..2ab019b
--- /dev/null
+++ b/demo/resources/css/images/ui-icons_cd0a0a_256x240.png
diff --git a/demo/resources/css/jquery-ui-themes.css b/demo/resources/css/jquery-ui-themes.css
new file mode 100644
index 0000000..ddd5e9f
--- /dev/null
+++ b/demo/resources/css/jquery-ui-themes.css
@@ -0,0 +1,412 @@
+/*
+* jQuery UI CSS Framework
+* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
+* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
+*/
+
+/* Layout helpers
+----------------------------------*/
+.ui-helper-hidden { display: none; }
+.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
+.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
+.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
+.ui-helper-clearfix { display: inline-block; }
+/* required comment for clearfix to work in Opera \*/
+* html .ui-helper-clearfix { height:1%; }
+.ui-helper-clearfix { display:block; }
+/* end clearfix */
+.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
+
+
+/* Interaction Cues
+----------------------------------*/
+.ui-state-disabled { cursor: default !important; }
+
+
+/* Icons
+----------------------------------*/
+
+/* states and images */
+.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
+
+
+/* Misc visuals
+----------------------------------*/
+
+/* Overlays */
+.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }/* Accordion
+----------------------------------*/
+.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
+.ui-accordion .ui-accordion-li-fix { display: inline; }
+.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
+.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em 2.2em; }
+.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; }
+.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; }
+.ui-accordion .ui-accordion-content-active { display: block; }
+
+/* Datepicker
+----------------------------------*/
+.ui-datepicker { width: 17em; padding: .2em .2em 0; }
+.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
+.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
+.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
+.ui-datepicker .ui-datepicker-prev { left:2px; }
+.ui-datepicker .ui-datepicker-next { right:2px; }
+.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
+.ui-datepicker .ui-datepicker-next-hover { right:1px; }
+.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px;  }
+.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
+.ui-datepicker .ui-datepicker-title select { float:left; font-size:1em; margin:1px 0; }
+.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
+.ui-datepicker select.ui-datepicker-month, 
+.ui-datepicker select.ui-datepicker-year { width: 49%;}
+.ui-datepicker .ui-datepicker-title select.ui-datepicker-year { float: right; }
+.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
+.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0;  }
+.ui-datepicker td { border: 0; padding: 1px; }
+.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
+.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
+.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
+.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
+
+/* with multiple calendars */
+.ui-datepicker.ui-datepicker-multi { width:auto; }
+.ui-datepicker-multi .ui-datepicker-group { float:left; }
+.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
+.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
+.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
+.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
+.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
+.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
+.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
+.ui-datepicker-row-break { clear:both; width:100%; }
+
+/* RTL support */
+.ui-datepicker-rtl { direction: rtl; }
+.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
+.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
+.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
+.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
+.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
+.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
+.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
+.ui-datepicker-rtl .ui-datepicker-group { float:right; }
+.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
+.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
+
+/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
+.ui-datepicker-cover {
+    display: none; /*sorry for IE5*/
+    display/**/: block; /*sorry for IE5*/
+    position: absolute; /*must have*/
+    z-index: -1; /*must have*/
+    filter: mask(); /*must have*/
+    top: -4px; /*must have*/
+    left: -4px; /*must have*/
+    width: 200px; /*must have*/
+    height: 200px; /*must have*/
+}
+
+/* Dialog
+----------------------------------*/
+.ui-dialog { position: relative; padding: 0px; width: 300px;}
+.ui-dialog .ui-dialog-titlebar { padding: .3em .3em .1em .8em; font-size:.7em; position: relative; background-image: none; }
+.ui-dialog .ui-dialog-title { float: left; margin: .1em 0 .2em;     
+                              font-family: 'Trebuchet MS';
+    font-size: 15px;
+    font-weight: normal;
+    color: #ffffff;} 
+.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .1em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
+.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }
+.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { /*padding: 0;*/ }
+.ui-dialog .ui-dialog-content { border: 0; padding: .5em .2em; background: none; overflow: auto; zoom: 1; background-color: #ffffff;}
+.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }
+.ui-dialog .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; padding: .2em .6em .3em .6em; line-height: 1.4em; width:auto; overflow:visible; }
+.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }
+.ui-draggable .ui-dialog-titlebar { cursor: move; background-color: #8f949a; border-bottom: 1px solid #d9d9d9;}
+
+/* Progressbar
+----------------------------------*/
+.ui-progressbar { height:2em; text-align: left; }
+.ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; }/* Resizable
+----------------------------------*/
+.ui-resizable { position: relative;}
+.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;}
+.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
+.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0px; }
+.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0px; }
+.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0px; height: 100%; }
+.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0px; height: 100%; }
+.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; }
+.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; }
+.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; }
+.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}/* Slider
+----------------------------------*/
+.ui-slider { position: relative; text-align: left; }
+.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; }
+.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; }
+
+.ui-slider-horizontal { height: .8em; }
+.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }
+.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
+.ui-slider-horizontal .ui-slider-range-min { left: 0; }
+.ui-slider-horizontal .ui-slider-range-max { right: 0; }
+
+.ui-slider-vertical { width: .8em; height: 100px; }
+.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }
+.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }
+.ui-slider-vertical .ui-slider-range-min { bottom: 0; }
+.ui-slider-vertical .ui-slider-range-max { top: 0; }/* Tabs
+----------------------------------*/
+.ui-tabs { padding: .2em; zoom: 1; }
+.ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: .2em .2em 0; }
+.ui-tabs .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; margin: 0 .2em -1px 0; padding: 0; }
+.ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: .5em 1em; }
+.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 0; }
+.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
+.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
+.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border-width: 0; background: none; }
+.ui-tabs .ui-tabs-hide { display: none !important; }
+/*
+* jQuery UI CSS Framework
+* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
+* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
+* To view and modify this theme, visit http://jqueryui.com/themeroller/
+*/
+
+
+/* Component containers
+----------------------------------*/
+.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; }
+.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; }
+.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(images/ui-bg_glass_75_ffffff_1x400.png)/*{bgImgUrlContent}*/ 0/*{bgContentXPos}*/ 0/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }
+.ui-widget-content a { /*color: #222222*//*{fcContent}*/; }
+.ui-widget-header { border: none /*1px solid #aaaaaa*//*{borderColorHeader}*/; background: #D3D3D3/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 0/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; color: #000000/*{fcHeader}*/; font-weight: bold; }
+.ui-widget-header a { color: #222222/*{fcHeader}*/; }
+
+/* Interaction states
+----------------------------------*/
+.ui-state-default, .ui-widget-content .ui-state-default { border: none /*1px solid #d3d3d3*//*{borderColorDefault}*/; /*background: #e6e6e6*//*{bgColorDefault}*/ /*url(images/ui-bg_glass_75_e6e6e6_1x400.png)*//*{bgImgUrlDefault}*/ /*0*//*{bgDefaultXPos}*/ /*50%*//*{bgDefaultYPos}*/ /*repeat-x*//*{bgDefaultRepeat}*/ font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; outline: none; }
+.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #555555/*{fcDefault}*/; text-decoration: none; outline: none; }
+.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border: none /*1px solid #999999*//*{borderColorHover}*/; /*background: #dadada*//*{bgColorHover}*/ /*url(images/ui-bg_glass_75_dadada_1x400.png)*//*{bgImgUrlHover}*/ /*0*//*{bgHoverXPos}*/ /*50%*//*{bgHoverYPos}*/ /*repeat-x*//*{bgHoverRepeat}*/ font-weight: normal/*{fwDefault}*/; color: #212121/*{fcHover}*/; outline: none; }
+.ui-state-hover a, .ui-state-hover a:hover { color: #212121/*{fcHover}*/; text-decoration: none; outline: none; }
+.ui-state-active, .ui-widget-content .ui-state-active { border: 1px solid #aaaaaa/*{borderColorActive}*/; background: #ffffff/*{bgColorActive}*/ url(images/ui-bg_glass_65_ffffff_1x400.png)/*{bgImgUrlActive}*/ 0/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcActive}*/; outline: none; }
+.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #212121/*{fcActive}*/; outline: none; text-decoration: none; }
+
+/* Interaction Cues
+----------------------------------*/
+.ui-state-highlight, .ui-widget-content .ui-state-highlight {border: 1px solid #fcefa1/*{borderColorHighlight}*/; background: #fbf9ee/*{bgColorHighlight}*/ url(images/ui-bg_glass_55_fbf9ee_1x400.png)/*{bgImgUrlHighlight}*/ 0/*{bgHighlightXPos}*/ 50%/*{bgHighlightYPos}*/ repeat-x/*{bgHighlightRepeat}*/; color: #363636/*{fcHighlight}*/; }
+.ui-state-highlight a, .ui-widget-content .ui-state-highlight a { color: #363636/*{fcHighlight}*/; }
+.ui-state-error, .ui-widget-content .ui-state-error {border: 1px solid #cd0a0a/*{borderColorError}*/; background: #fef1ec/*{bgColorError}*/ url(images/ui-bg_inset-soft_95_fef1ec_1x100.png)/*{bgImgUrlError}*/ 0/*{bgErrorXPos}*/ 50%/*{bgErrorYPos}*/ repeat-x/*{bgErrorRepeat}*/; color: #cd0a0a/*{fcError}*/; }
+.ui-state-error a, .ui-widget-content .ui-state-error a { color: #363636/*{fcError}*/; }
+.ui-state-error-text, .ui-widget-content .ui-state-error-text { color: #cd0a0a/*{fcError}*/; }
+.ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
+.ui-priority-primary, .ui-widget-content .ui-priority-primary { font-weight: bold; }
+.ui-priority-secondary, .ui-widget-content .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }
+
+/* Icons
+----------------------------------*/
+
+/* states and images */
+.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; }
+.ui-widget-content .ui-icon {background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; }
+.ui-widget-header .ui-icon {background-image: url(images/ui-icons_454545_256x240.png)/*{iconsHeader}*/; }
+.ui-state-default .ui-icon { background-image: url(images/ui-icons_888888_256x240.png)/*{iconsDefault}*/; }
+.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_222222_256x240.png)/*{iconsHover}*/; }
+.ui-state-active .ui-icon {background-image: url(images/ui-icons_454545_256x240.png)/*{iconsActive}*/; }
+.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_2e83ff_256x240.png)/*{iconsHighlight}*/; }
+.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_cd0a0a_256x240.png)/*{iconsError}*/; }
+
+/* positioning */
+.ui-icon-carat-1-n { background-position: 0 0; }
+.ui-icon-carat-1-ne { background-position: -16px 0; }
+.ui-icon-carat-1-e { background-position: -32px 0; }
+.ui-icon-carat-1-se { background-position: -48px 0; }
+.ui-icon-carat-1-s { background-position: -64px 0; }
+.ui-icon-carat-1-sw { background-position: -80px 0; }
+.ui-icon-carat-1-w { background-position: -96px 0; }
+.ui-icon-carat-1-nw { background-position: -112px 0; }
+.ui-icon-carat-2-n-s { background-position: -128px 0; }
+.ui-icon-carat-2-e-w { background-position: -144px 0; }
+.ui-icon-triangle-1-n { background-position: 0 -16px; }
+.ui-icon-triangle-1-ne { background-position: -16px -16px; }
+.ui-icon-triangle-1-e { background-position: -32px -16px; }
+.ui-icon-triangle-1-se { background-position: -48px -16px; }
+.ui-icon-triangle-1-s { background-position: -64px -16px; }
+.ui-icon-triangle-1-sw { background-position: -80px -16px; }
+.ui-icon-triangle-1-w { background-position: -96px -16px; }
+.ui-icon-triangle-1-nw { background-position: -112px -16px; }
+.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
+.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
+.ui-icon-arrow-1-n { background-position: 0 -32px; }
+.ui-icon-arrow-1-ne { background-position: -16px -32px; }
+.ui-icon-arrow-1-e { background-position: -32px -32px; }
+.ui-icon-arrow-1-se { background-position: -48px -32px; }
+.ui-icon-arrow-1-s { background-position: -64px -32px; }
+.ui-icon-arrow-1-sw { background-position: -80px -32px; }
+.ui-icon-arrow-1-w { background-position: -96px -32px; }
+.ui-icon-arrow-1-nw { background-position: -112px -32px; }
+.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
+.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
+.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
+.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
+.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
+.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
+.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
+.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
+.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
+.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
+.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
+.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
+.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
+.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
+.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
+.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
+.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
+.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
+.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
+.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
+.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
+.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
+.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
+.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
+.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
+.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
+.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
+.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
+.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
+.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
+.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
+.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
+.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
+.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
+.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
+.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
+.ui-icon-arrow-4 { background-position: 0 -80px; }
+.ui-icon-arrow-4-diag { background-position: -16px -80px; }
+.ui-icon-extlink { background-position: -32px -80px; }
+.ui-icon-newwin { background-position: -48px -80px; }
+.ui-icon-refresh { background-position: -64px -80px; }
+.ui-icon-shuffle { background-position: -80px -80px; }
+.ui-icon-transfer-e-w { background-position: -96px -80px; }
+.ui-icon-transferthick-e-w { background-position: -112px -80px; }
+.ui-icon-folder-collapsed { background-position: 0 -96px; }
+.ui-icon-folder-open { background-position: -16px -96px; }
+.ui-icon-document { background-position: -32px -96px; }
+.ui-icon-document-b { background-position: -48px -96px; }
+.ui-icon-note { background-position: -64px -96px; }
+.ui-icon-mail-closed { background-position: -80px -96px; }
+.ui-icon-mail-open { background-position: -96px -96px; }
+.ui-icon-suitcase { background-position: -112px -96px; }
+.ui-icon-comment { background-position: -128px -96px; }
+.ui-icon-person { background-position: -144px -96px; }
+.ui-icon-print { background-position: -160px -96px; }
+.ui-icon-trash { background-position: -176px -96px; }
+.ui-icon-locked { background-position: -192px -96px; }
+.ui-icon-unlocked { background-position: -208px -96px; }
+.ui-icon-bookmark { background-position: -224px -96px; }
+.ui-icon-tag { background-position: -240px -96px; }
+.ui-icon-home { background-position: 0 -112px; }
+.ui-icon-flag { background-position: -16px -112px; }
+.ui-icon-calendar { background-position: -32px -112px; }
+.ui-icon-cart { background-position: -48px -112px; }
+.ui-icon-pencil { background-position: -64px -112px; }
+.ui-icon-clock { background-position: -80px -112px; }
+.ui-icon-disk { background-position: -96px -112px; }
+.ui-icon-calculator { background-position: -112px -112px; }
+.ui-icon-zoomin { background-position: -128px -112px; }
+.ui-icon-zoomout { background-position: -144px -112px; }
+.ui-icon-search { background-position: -160px -112px; }
+.ui-icon-wrench { background-position: -176px -112px; }
+.ui-icon-gear { background-position: -192px -112px; }
+.ui-icon-heart { background-position: -208px -112px; }
+.ui-icon-star { background-position: -224px -112px; }
+.ui-icon-link { background-position: -240px -112px; }
+.ui-icon-cancel { background-position: 0 -128px; }
+.ui-icon-plus { background-position: -16px -128px; }
+.ui-icon-plusthick { background-position: -32px -128px; }
+.ui-icon-minus { background-position: -48px -128px; }
+.ui-icon-minusthick { background-position: -64px -128px; }
+.ui-icon-close { background-position: -80px -128px; }
+.ui-icon-closethick { background-position: -96px -128px; }
+.ui-icon-key { background-position: -112px -128px; }
+.ui-icon-lightbulb { background-position: -128px -128px; }
+.ui-icon-scissors { background-position: -144px -128px; }
+.ui-icon-clipboard { background-position: -160px -128px; }
+.ui-icon-copy { background-position: -176px -128px; }
+.ui-icon-contact { background-position: -192px -128px; }
+.ui-icon-image { background-position: -208px -128px; }
+.ui-icon-video { background-position: -224px -128px; }
+.ui-icon-script { background-position: -240px -128px; }
+.ui-icon-alert { background-position: 0 -144px; }
+.ui-icon-info { background-position: -16px -144px; }
+.ui-icon-notice { background-position: -32px -144px; }
+.ui-icon-help { background-position: -48px -144px; }
+.ui-icon-check { background-position: -64px -144px; }
+.ui-icon-bullet { background-position: -80px -144px; }
+.ui-icon-radio-off { background-position: -96px -144px; }
+.ui-icon-radio-on { background-position: -112px -144px; }
+.ui-icon-pin-w { background-position: -128px -144px; }
+.ui-icon-pin-s { background-position: -144px -144px; }
+.ui-icon-play { background-position: 0 -160px; }
+.ui-icon-pause { background-position: -16px -160px; }
+.ui-icon-seek-next { background-position: -32px -160px; }
+.ui-icon-seek-prev { background-position: -48px -160px; }
+.ui-icon-seek-end { background-position: -64px -160px; }
+.ui-icon-seek-first { background-position: -80px -160px; }
+.ui-icon-stop { background-position: -96px -160px; }
+.ui-icon-eject { background-position: -112px -160px; }
+.ui-icon-volume-off { background-position: -128px -160px; }
+.ui-icon-volume-on { background-position: -144px -160px; }
+.ui-icon-power { background-position: 0 -176px; }
+.ui-icon-signal-diag { background-position: -16px -176px; }
+.ui-icon-signal { background-position: -32px -176px; }
+.ui-icon-battery-0 { background-position: -48px -176px; }
+.ui-icon-battery-1 { background-position: -64px -176px; }
+.ui-icon-battery-2 { background-position: -80px -176px; }
+.ui-icon-battery-3 { background-position: -96px -176px; }
+.ui-icon-circle-plus { background-position: 0 -192px; }
+.ui-icon-circle-minus { background-position: -16px -192px; }
+.ui-icon-circle-close { background-position: -32px -192px; }
+.ui-icon-circle-triangle-e { background-position: -48px -192px; }
+.ui-icon-circle-triangle-s { background-position: -64px -192px; }
+.ui-icon-circle-triangle-w { background-position: -80px -192px; }
+.ui-icon-circle-triangle-n { background-position: -96px -192px; }
+.ui-icon-circle-arrow-e { background-position: -112px -192px; }
+.ui-icon-circle-arrow-s { background-position: -128px -192px; }
+.ui-icon-circle-arrow-w { background-position: -144px -192px; }
+.ui-icon-circle-arrow-n { background-position: -160px -192px; }
+.ui-icon-circle-zoomin { background-position: -176px -192px; }
+.ui-icon-circle-zoomout { background-position: -192px -192px; }
+.ui-icon-circle-check { background-position: -208px -192px; }
+.ui-icon-circlesmall-plus { background-position: 0 -208px; }
+.ui-icon-circlesmall-minus { background-position: -16px -208px; }
+.ui-icon-circlesmall-close { background-position: -32px -208px; }
+.ui-icon-squaresmall-plus { background-position: -48px -208px; }
+.ui-icon-squaresmall-minus { background-position: -64px -208px; }
+.ui-icon-squaresmall-close { background-position: -80px -208px; }
+.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
+.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
+.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
+.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
+.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
+.ui-icon-grip-diagonal-se { background-position: -80px -224px; }
+
+
+/* Misc visuals
+----------------------------------*/
+
+/* Corner radius */
+.ui-corner-tl { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-tr { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-bl { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-top { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-bottom { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-right {  -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-left { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; }
+.ui-corner-all { -moz-border-radius: 0px/*{cornerRadius}*/; -webkit-border-radius: 0px/*{cornerRadius}*/; }
+
+/* Overlays */
+.ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ none/*{bgImgUrlOverlay}*/ 0/*{bgOverlayXPos}*/ 0/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; }
+.ui-widget-shadow { margin: -4px/*{offsetTopShadow}*/ 0 0 -4px/*{offsetLeftShadow}*/; padding: 4px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ none/*{bgImgUrlShadow}*/ 0/*{bgShadowXPos}*/ 0/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .35;filter:Alpha(Opacity=35)/*{opacityShadow}*/; -moz-border-radius: 4px/*{cornerRadiusShadow}*/; -webkit-border-radius: 4px/*{cornerRadiusShadow}*/; }
+\ No newline at end of file
diff --git a/demo/resources/css/previewfonts.css b/demo/resources/css/previewfonts.css
new file mode 100644
index 0000000..03a1b80
--- /dev/null
+++ b/demo/resources/css/previewfonts.css
@@ -0,0 +1,12 @@
+@font-face {
+  font-family: 'Source Sans Pro';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url('previewfonts/SourceSansPro-Regular.woff2') format('woff2'), url('previewfonts/SourceSansPro-Regular.woff') format('woff');
+}
+@font-face {
+  font-family: 'Source Sans Pro Semibold';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), url('previewfonts/SourceSansPro-Semibold.woff2') format('woff2'), url('previewfonts/SourceSansPro-Semibold.woff') format('woff');
+}
+\ No newline at end of file
diff --git a/demo/resources/css/previewfonts/SourceSansPro-OpenFontLicense.txt b/demo/resources/css/previewfonts/SourceSansPro-OpenFontLicense.txt
new file mode 100644
index 0000000..72d81ab
--- /dev/null
+++ b/demo/resources/css/previewfonts/SourceSansPro-OpenFontLicense.txt
@@ -0,0 +1,93 @@
+Copyright 2010, 2012, 2014 Adobe Systems Incorporated (http://www.adobe.com/), with Reserved Font Name ‘Source’.
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/demo/resources/css/previewfonts/SourceSansPro-Regular.woff2 b/demo/resources/css/previewfonts/SourceSansPro-Regular.woff2
new file mode 100644
index 0000000..0dd3464
--- /dev/null
+++ b/demo/resources/css/previewfonts/SourceSansPro-Regular.woff2
diff --git a/demo/resources/css/previewfonts/SourceSansPro-Semibold.woff2 b/demo/resources/css/previewfonts/SourceSansPro-Semibold.woff2
new file mode 100644
index 0000000..2526d2e
--- /dev/null
+++ b/demo/resources/css/previewfonts/SourceSansPro-Semibold.woff2
diff --git a/demo/resources/css/reset.css b/demo/resources/css/reset.css
new file mode 100644
index 0000000..8970d76
--- /dev/null
+++ b/demo/resources/css/reset.css
@@ -0,0 +1,24 @@
+html,body,div,span,
+applet,object,iframe,
+h1,h2,h3,h4,h5,h6,p,blockquote,pre,
+a,abbr,acronym,address,big,cite,code,
+del,dfn,em,font,img,ins,kbd,q,s,samp,
+small,strike,strong,sub,sup,tt,var,
+dd,dl,dt,li,ol,ul,
+fieldset,form,label,legend,
+table,caption,tbody,tfoot,thead,tr,th,td {
+	margin: 0;
+	padding: 0;
+	border: 0;
+}
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+ol,ul {
+	list-style: none;
+}
+q:before,q:after,
+blockquote:before,blockquote:after {
+	content: "";
+}
+\ No newline at end of file
author	chengsir <[email protected]>	2019-10-30 18:02:09 +0800
committer	chengsir <[email protected]>	2019-10-30 18:02:09 +0800
commit	dcf1065c044cc0d5b7ba87c69cc6d6f01d0fa431 (patch)
tree	5e9ffb58069e7dcc5e73095601ba6e176dc2d779 /demo/resources/css
parent	48ae81c20ed8e8c6d17cd4a08d3d35ba30dffae7 (diff)