/* Reset */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,figure { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,th { font-size: 1em; font-weight: normal; font-style: normal; }
fieldset,iframe { border: none; }
caption,th { text-align: left; }
table { border-collapse: collapse; border-spacing: 0; }
article, aside, footer, header, hgroup, nav, section, figure, figcaption { display: block; }
/* General */
html { overflow-y: hidden; }
body { height: 100%; background-color: #fff;}
body,
input,
textarea { font-family: "Lucida Sans", "Verdana", sans-serif; font-size: 12px; color: #222; }
img { border: 0; }
object { outline: 0; }
#flash { width: 100%; height: 100%; visibility: hidden; }
#flash div { position: absolute; top: 50%; left: 50%; width: 400px; height: 200px; margin: -100px 0 0 -200px; text-align: center; font-size: 17px; line-height: 28px; color: #999999; }
#flash div a { color: #c51d1d; text-decoration: none; border-bottom: 1px dotted #c51d1d; }
.advice { position: absolute; z-index: 6; display: none; }
#adv1 { height: 86px; width: 125px; background-image: url(/images/adv1.gif); top: 36px; left: 0; }
#adv2 { height: 86px; width: 160px; background-image: url(/images/adv2.gif); top: 36px; left: 152px; }
#adv3 { height: 86px; width: 160px; background-image: url(/images/adv3.gif); top: 36px; left: 152px; }
#adv4 { height: 108px; width: 185px; background-image: url(/images/adv4.gif); top: 36px; left: 0; }
#adv5 { height: 80px; width: 221px; background-image: url(/images/adv5.gif); top: 160px; right: 6px; }
#adv6 { height: 108px; width: 266px; background-image: url(/images/adv6.gif); top: 6px; right: 28px; }
.advice span { font-size: 10px; color: #666; display: block; text-align: center; }
.advice-close { cursor: pointer; height: 14px; width: 13px; position: absolute; top: 35px; right: 7px; }
.advice-skip { background-color: #bbb; -moz-border-radius: 6px; border-radius: 6px; bottom: 8px; cursor: pointer; font-size: 10px; padding: 0 6px; position: absolute; right: 8px; }
input.submit { padding: 4px 8px; }
p.help { font-size: 11px; color: #999; font-style: italic; }
.centre { text-align: center; }
.table { display: table; table-layout: fixed; width: 100%; }
.table label { display: table-cell; text-align: center; }
.table input { margin-bottom: 6px; }
.table2 label { display: block; line-height: 24px; }
a.help { display: block; float: right; margin-top: 3px; width: 13px; height: 13px; overflow: hidden; text-indent: -999px; background-image: url(/images/help.gif); background-repeat:no-repeat; background-position: center; }
/* POPUPS */
#popup-fader { position: absolute; width: 100%; height: 100%; top: 0; display: none; background-color: #000; }
#popup-container { position: absolute; width: 100%; height: 100%; top: 0; display: none; z-index: 6; }
#popup { position: relative; top: 120px; width: 360px; margin: auto; background-color: #fff; border: 3px solid #777; -moz-border-radius: 12px; border-radius: 12px; }
#popup .inner { margin: 2px 0px; padding: 10px; overflow: auto; position: relative; }
#popup h1 { font-size: 16px; font-weight: bold; margin-bottom: 1em; margin-top: 0.5em; }
#popup h1 span { float: right; cursor: pointer; border-bottom: 1px dotted #999; margin-top: 6px; }
#popup p { /* margin-bottom: 4px; margin-top: 18px; */ margin-top: 1em; margin-bottom: 0.5em; }
#popup .inner span { font-size: 11px; color: #999; }
#popup .close { position: absolute; top: -14px; right: -14px; width: 27px; height: 28px; cursor: pointer; background-image: url(/images/popup-close.png); }
#popup.help { width: 720px; background-color: #efefef; }
#popup.help .content { float: left; width: 486px; padding: 10px 10px 0 10px; background-color: #fff; margin-left: 10px; border: 1px solid #ccc; max-height: 401px; overflow: auto; -moz-border-radius: 6px; border-radius: 6px;}
#popup.help .menu { float: left; width: 180px; }
#popup.help .menu div { display: block; padding: 10px; border: 1px solid #ccc; color: #C51D1D; text-decoration: none; cursor: pointer; margin-bottom: 10px; background-color: #fff; -moz-border-radius: 6px; border-radius: 6px; }
#popup.help .menu div:hover { background-color: #f4f4f4; }
#popup.help .menu div.selected { background-color: #C51D1D; color: white; }
#popup.help img { float: right; margin: 0 0 15px 15px; }
#popup.help p { line-height: 21px; margin: 0 0 2em 0; }
#popup.help li { margin-bottom: 16px; }
#popup ul.media { list-style: none; margin: 0; padding: 0; margin-top: 20px; }
#popup ul.media li { margin-bottom: 22px; height: 36px; line-height: 36px; }
#popup ul.media li a { font-size: 14px; font-weight: bold; display: block; cursor: pointer; position: relative; padding: 4px 12px 4px 44px; border: 1px solid #bbb; }
#popup ul.media li img { position: absolute; top: 6px; left: 6px; }
#popup ul.media li span { font-size: 10px; color: #666; float: right; text-decoration: none; }
#popup .keyboard p { width: 380px; line-height: 38px; margin: 0; }
#popup .keyboard h2 { font-size: 16px; }
#popup .keyboard p.norm { width: auto; line-height: 22px; }
#popup .keyboard p span { color: #aaaaaa; }
#popup .keyboard p.kb { width: 120px; float: left; }
#popup .keyboard p.kb span { color: #000000; background-color: #eeeeee; border-color: #cccccc #aaaaaa #888888 #bbbbbb; border-style: solid; border-width: 2px 4px 5px 3px; padding: 5px 8px 5px 8px; }
#popup .keyboard p.kb span.small { border-width: 1px 3px 4px 2px; padding: 3px 6px 3px 6px; margin-right: 3px; }
#popup .keyboard p.kb img { float: none; margin: 0; }
#popup .media-title { height: 36px; line-height: 36px; font-size: 14px; -moz-border-radius: 6px; border-radius: 6px; font-weight: bold; margin-top: 8px; padding: 4px 12px 4px 44px; position: relative; }
#popup .media-title img { position: absolute; top: 6px; left: 6px; }
#popup .media-title span { font-size: 10px; color: #666; float: right; text-decoration: none; display: block; }
#popup .media-title.item { border: 1px solid #BBB; cursor: pointer; }
#popup .media-title.top { border: 1px solid #CCC; cursor: default; }
#popup .media-title.item:hover { background-color: #EEE; }
#popup .form { line-height: 25px; font-weight: bold; margin-top: 16px; }
#popup .form input { border: 1px solid #bbb; width: 230px; padding: 4px; float: right; }
#popup .submit input { width: auto; padding: 6px 12px; margin: 18px 0; float: right; cursor: pointer; }
#popup .colours { border: 1px solid #808080; padding: 2px 12px 12px 12px; display: block; margin: auto; width: 169px; }
#popup .colours h2 { margin: 10px 0 6px 0; font-size: 12px; font-weight: bold; }
#popup .colours div { border: 1px solid #fff; cursor: pointer; line-height: 20px; background-color: #f2f2f2; text-align: center; border: 1px solid #c5c5c5; margin-bottom: 5px; }
#popup .colours .palette { border-collapse: collapse; border-left: 1px solid #666; border-bottom: 1px solid #666; border-top: 1px solid #666; }
#popup .colours .palette td { border-right: 1px solid #666; width: 18px; height: 18px; cursor: pointer; }
#popup .colours td.sel { background-image: url(/images/palette-selected.gif); background-repeat: no-repeat; background-position: center; }
#popup .colours div.sel { background-image: url(/images/palette-selected2.gif); background-repeat: no-repeat; background-position: 4px center; }
#popup form p { margin-top: 10px; line-height: 25px; font-weight: bold; }
#popup form p input { border: 1px solid #bbb; width: 230px; padding: 4px; float: right; }
#popup form p.submit input { border: 2px inset; width: auto; padding: 3px 6px; float: none; display: block; margin: auto; background-color: #ddd; cursor: pointer; }
#o-container { width: 90%; margin: auto; overflow: hidden; color: #fff; font-weight: bold; font-family: Calibri, "Lucida Sans", Verdana, sans-serif; }
#o-container ul { margin: 0; padding: 0; list-style: none; position: relative; }
#o-container li { position: absolute; cursor: default; display: block; overflow: hidden; }
#o-container div { padding: 0 8px; -moz-border-radius: 4px; border-radius: 4px; cursor: pointer; overflow: hidden; line-height: 23px; float: left; height: 23px; }
#o-container.sides { background-image: url(/images/nodeorder-bg.gif); background-repeat: no-repeat; background-position: center; min-height: 71px; }
#o-container.sides li { width: 50%; }
#popup .order-help { background-color: #FFF; z-index: 1; top: 50%; margin-top: -36px; border: 2px solid; color: #999; padding: 8px; position: absolute; right: 18px; text-align: center; width: 120px; -moz-border-radius: 12px; border-radius: 12px; }
/* TOP */
#top { height: 30px; width: 100%; white-space: nowrap; border-bottom: 1px solid #797979; position: absolute; top: 0; left: 0; background-color: #dddddd; background-image: url(/images/top-bg.gif); z-index: 4; }
#top > div { position: relative; height: 30px; width: auto; }
#top .group1 { float: left; border-right: 1px solid #b8b8b8; }
#top .group2 { position: absolute; border-right: 1px solid #b8b8b8; border-left: 1px solid #b8b8b8; display: none; }
#top .group3 { float: right; display: none; }
#top input { float: left; margin: 5px; width: 160px; border: 1px solid #CCCCCC; padding: 1px 2px; height: 16px; line-height: 17px; }
#top .spacer { float: left; width: 2px; height: 30px; border-left: 1px solid #b8b8b8; }
#top .button { border-left: 1px solid #b8b8b8; height: 30px; float: left; cursor: pointer; background-position: top; }
#top .button#b-logo { background-image: url('/images/logo.gif'); width: 129px; border-left: none; height: 29px; }
#top .button#b-present { background-image: url('/images/spr/sprite-map-top-present.png'); width: 94px; }
#top .button#b-selftest { background-image: url('/images/spr/sprite-map-top-test.png'); width: 65px; }
#top .button#b-layout { background-image: url('/images/spr/sprite-map-top-layout.png'); width: 82px; }
#top .button#b-download { background-image: url('/images/spr/sprite-map-top-download.png'); width: 95px; }
#top .button#b-share { background-image: url('/images/spr/sprite-map-top-share.png'); width: 71px; }
#top .button#b-help { background-image: url('/images/btn-help.gif'); width: 32px; }
#top .button#b-search { background-image: url('/images/btn-search.gif'); width: 32px; }
#top .button#b-addnode { background-image: url('/images/btn-add.gif'); width: 32px; }
#top .button#b-addnode-confirm { background-image: url('/images/btn-finish.gif'); width: 32px; }
#top .button#b-addnode-cancel { background-image: url('/images/btn-end.gif'); width: 32px; }
#top .button#b-deletenode { background-image: url('/images/btn-delete.gif'); width: 32px; }
#top .button#b-cutnode { background-image: url('/images/btn-cut.gif'); width: 32px; }
#top .button#b-pastenode { background-image: url('/images/btn-paste.gif'); width: 32px; }
#top .button#b-nodesettings { background-image: url('/images/btn-settings.gif'); width: 32px; }
#add-nodes { display: none; background-color: #fff; border: 1px solid #ADADAD; left: 166px; top: 32px; position: absolute; }
#add-nodes > div { padding: 8px; height: 16px; line-height: 20px; cursor: pointer; width: 148px; }
#add-nodes > div:first-child { border-bottom: 1px solid #ADADAD; }
#add-nodes > div:hover { background-color: #eee; }
#add-nodes img { float: left; margin-right: 8px; height: 16px; width: 16px; }
#title-div { float: left; height: 22px; padding: 4px; border-right: 1px solid #b8b8b8; border-left: 1px solid #b8b8b8; }
#title-div #selected-node { width: 150px; height: 14px; font-size: 11px; margin-top: 1px; }
/* MAP */
#map { position: absolute; top: 31px; left: 0; bottom: 0; z-index: 3; overflow: hidden; }
#map-mode { position: absolute; cursor: default; display: none; background-color: #eee; z-index: 3; top: 9px; right: 9px; border: 1px solid #bbb; padding: 4px 6px 4px 23px; color: #555; -moz-border-radius: 4px; border-radius: 4px; }
#map-mode div { position: absolute; height: 12px; padding: 5px; cursor: pointer; width: 12px; left: 1px; top: 0px; background-image: url(/images/map-close-mode.png); background-repeat: no-repeat; background-position: center; }
/* SEARCH */
#search { position: absolute; top: 31px; left: 0; bottom: 0; width: 200px; border-right: 3px solid #adadad; background-color: #fff; z-index: 5; display: none; }
#search .bar { position: absolute; top: 25px; left: 0; right: 0; height: 3px; background-color: #adadad; }
#search input { position: absolute; left: 0; right: 0; border: none; line-height: 23px; height: 24px; margin: 1px 0; padding: 0 3px 0 20px; background-image: url(/images/search.png); background-position: 4px center; background-repeat: no-repeat; }
#searchresults { position: absolute; overflow: auto; bottom: 0; top: 28px; list-style-type: none; padding: 0; margin: 0; width: 100%; }
#searchresults > li { background-color: #fff; line-height: 28px; }
#searchresults > li.alt { background-color: #f3f7fb; }
#searchresults > li:hover { background-color: #d2e5f9; }
#searchresults ul { padding-left: 22px; font-size: 11px; line-height: 20px; padding-bottom: 4px; }
#searchresults a { display: block; text-decoration: none; color: #222; padding-left: 6px; }
#searchresults .noresults { text-align: center; font-style: italic; line-height: 18px; padding: 6px; }
#searchresults .tip { text-align: center; font-style: italic; color: #aaa; line-height: 18px; padding: 6px; }
#searchresults .loading { text-align: center; padding: 32px; background-image: url(/images/loading.gif); background-repeat: no-repeat; background-position: center; background-color: #fff !important; }
/* RHS */
#RHS { position: absolute; background-color: #f2f2f2; top: 31px; right: 0; bottom: 0; width: 172px; border-left: 1px solid #adadad; overflow: auto; z-index: 3; overflow-x: hidden; } /* */
#RHS.drag { border-color: #666666; }
#RHS h2 { border-top: 1px solid #adadad; cursor: pointer; position: relative; color: #666; font-size: 12px; line-height: 30px; height: 30px; text-indent: 4px; font-weight: bold; margin: 0; clear: both; }
#RHS h2:first-child { border-width: 0; }
#RHS h2:last-child { }
#RHS h2.small { }
#RHS h2.small > div { display: inline-block; }
#RHS h2.small input { position: absolute; font-size: 12px; border: none; border-left: 1px solid #ddd; right: 0; top: 0px; height: 30px; line-height: 30px; text-indent: 4px; }
#RHS h2.heading { font-size: 14px; text-align: center; background-color: #D4D4D4; }
#RHS .add-resource { float: right; margin: 6px 0 0 0; }
#RHS .delete-resource { float: right; margin: 6px 4px 0 0; }
#RHS .right-collapser { width: 21px; height: 17px; background-image: url(/images/spr/right-collapse.png); background-position: -21px 0; position: absolute; top: 6px; left: 4px; }
#RHS .text-settings { background-image: url(/images/rhs-text-settings4.gif); position: absolute; right: 2px; top: 0px; width: 32px; height: 30px; display: none; }
#RHS .media { padding-top: 5px; border-bottom: 1px solid #f2f2f2; }
#RHS .media a { border-bottom: 1px dotted #666; color: #666; text-decoration: none; }
#RHS .media div.none { position: relative; width: 144px; border: 1px solid #ddd; padding: 4px; margin: 8px auto 16px auto; text-align: center; }
#RHS .media div.section { float: left; width: 158px; border: 0px solid #ddd; margin: 0 6px 6px 6px; }
#RHS .media div.section > div { width: 144px; margin: 0 6px 6px 6px; padding: 0; position: relative; border: 0px solid #ddd; }
#RHS .media div.section > div.title { font-size: 18px; margin-top: 6px; }
#RHS .media div.section div > div { position: relative; background-repeat: no-repeat; background-position: top center; border: 1px solid #222; }
#RHS .media div.section div > div span { display: block; position: absolute; left: 0; top: -23px; text-align: center; width: 144px; margin: 0; padding: 4px 0; }
#RHS .media div.section div > div a { display: block; position: absolute; bottom: 0; left: 0; background-color: #000; width: 144px; text-align: center; padding: 2px 0; color: #fff; border-bottom: 0; }
#RHS .media div.image,
#RHS .media div.video { cursor: pointer; }
#RHS .media div.section div.delete { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; }
#RHS .media div.section span.delete { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; cursor: pointer; background-image: url(/images/btn-resource-deleter.gif); background-position: center; background-repeat: no-repeat; }
#RHS .text { margin: 0; padding: 0 3px 3px 3px; position: relative; }
#RHS .text .editable { font-size: 12px; line-height: 18px; border: 1px solid #ddd; min-height: 1em; background-color: #fff; overflow: auto; padding: 4px; }
#RHS .text .editable ol,
#RHS .text .editable ul { padding-left: 24px; margin: 6px 0; }
#RHS .assignment { text-align: center; }
#RHS .assignment input { margin: 7px; }
#RHS .assignment input:first-child { font-weight: bold; }
#RHS .editor-popup { position: absolute; background-color: #fff; right: 3px; top: 2px; padding: 4px; border: 1px solid #D5D5D5; text-indent: 0; z-index: 5; }
#RHS .editor-actions input { height: 19px; width: 20px; float: left; background-image: url(/images/spr/right-text-edit-01.png); }
#RHS .editor-actions .editor-img1 { background-position: 0 0; }
#RHS .editor-actions .editor-img2 { background-position: -20px 0; }
#RHS .editor-actions .editor-img3 { background-position: -40px 0; }
#RHS .editor-actions .editor-img4 { background-position: -60px 0; }
#RHS .editor-actions .editor-img5 { background-position: -80px 0; }
#RHS .editor-actions .editor-img6 { background-position: -100px 0; }
#RHS .editor-colours { display: none; line-height: 11px; }
#RHS .editor-colours button { height: 16px; width: 16px; float: left; margin: 1px; border: 1px solid black; cursor: pointer; }
#right-resize { position: absolute; background-image: url(/images/blank.png); width: 5px; bottom: 0; top: 31px; z-index: 99; cursor: e-resize; }
/* COLLABORATION */
#start-collaboration { position: absolute; bottom: 0; left: 0; z-index: 4; cursor: pointer; width: 95px; height: 25px; background-image: url('/images/btn-collaborate.gif'); }
#start-chat { position: absolute; bottom: 0; left: 95px; z-index: 4; cursor: pointer; width: 50px; height: 25px; background-image: url('/images/btn-chat.gif'); }
#collab-chat { position: absolute; z-index: 6; bottom: 25px; left: 0; height: 207px; width: 191px; background-color: #ffffff; border-top: 2px solid #adadad; border-right: 2px solid #adadad; display: none; -moz-border-radius: 0px 5px 0px 0px; border-radius: 0px 5px 0px 0px; }
#collab-chat-title { height: 22px; background-color: #adadad; color: #ffffff; font-size: 16px; font-weight: bold; padding-left: 4px; }
#collab-chat-text { height: 160px; overflow: auto; margin: 1px; bottom: 26px; position: absolute; top: 23px; width: 100%; }
#collab-chat-bottom { height: 23px; border-top: 1px solid #adadad; position: absolute; bottom: 0px; width: 100%; }
#collab-chat-message { border: 0; height: 18px; left: 2px; position: absolute; right: 53px; }
#collab-chat-send { width: 49px; height: 20px; margin: 0; border: 1px solid #adadad; position: absolute; right: 1px; top: 1px; }
#collab-chat-mover-top { cursor: n-resize; height: 3px; left: 0px; position: absolute; top: -2px; width: 100%; }
#collab-chat-mover-right { cursor: e-resize; height: 100%; position: absolute; right: -2px; top: 0px; width: 4px; }
#collaboration-bar { position: absolute; left: 0; bottom: 0; height: 24px; padding-top: 1px; line-height: 24px; width: 100%; display: none; background-image: url(/images/bottom-bg.gif); z-index: 3; }
#collaboration-bar .inner { padding: 0 8px; margin-left: 95px; }
#collaboration-bar .inner a { color: #006666; }
#collaboration-bar-inner { display: inline; }
/* LIGHTBOX */
#lightbox-cover { background-color: #000; z-index: 10; position: absolute; height: 100%; width: 100%; top: 0; left: 0; }
#lightbox-content { background-color: #fff; z-index: 11; position: relative; display: none; margin: auto; padding: 10px; }
#lightbox-content img { border: 1px solid #ccc; }
#lightbox-close { background-image: url(/images/popup-close.png); cursor: pointer; height: 28px; width: 27px; position: absolute; right: -14px; top: -14px;}