/* Style Sheet for Toolbar Plugin for use in Assetize.com */ /****************************************************************************** * Yahoo! Reset CSS *****************************************************************************/ /* Copyright (c) 2007, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.net/yui/license.txt version: 2.3.0 */ /*body{color:#000;background:#fff;}*/body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p, blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code, dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;} h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;} sup,sub{/*line-height:-1px;*/vertical-align:text-top;}sub{vertical-align:text-bottom;}input, button, textarea, select {font-family:inherit;font-size:inherit;font-weight:inherit;} /****************************************************************************** * Toolbar *****************************************************************************/ iframe { width: 100%; height: 100%; border: none; margin: 0; padding: 0; } /* All Toolbars */ .tbToolbar { font-family: "Verdana", "sans-serif"; font-size: 10pt; overflow: hidden; background-color: #ffffff; color: #000000; } .tbToolbar div.widget { overflow: hidden; position: relative; margin-left: 2px; margin-right: 2px; } .tbToolbar div.toolbar-close { float: right; overflow: hidden; z-index: 500; cursor: pointer; width: 18px; height: 18px; margin: 9px 11px 9px 6px; background-image: url('/tb/widgets/close/close.png'); background-position: top left; background-repeat: no-repeat; } .tbToolbar div.toolbar-close:hover { background-position: bottom left; } /* Live Toolbar View */ .tbToolbar-view { width: 100%; z-index: 1200; border-left-style: none !important; border-top-style: none !important; border-right-style: none !important; } .tbToolbar-view div.dropdown { position: fixed !important; z-index: 1100; } /* Mobile Toolbar View */ .tbToolbar-mobile-view { width: 100%; z-index: 1200; } /* Static Toolbar Preview */ .tbToolbar-preview { width: 940px; border-left-width: 1px !important; border-top-width: 1px !important; border-right-width: 1px !important; border-left-style: solid !important; border-top-style: solid !important; border-right-style: solid !important; border-left-color: #313131 !important; border-top-color: #313131 !important; border-right-color: #313131 !important; } .tbToolbar-template { width: 940px; cursor:pointer; border:1px solid #313131 !important; } .tbToolbar-template:hover { border:1px solid #fff !important; } .tbToolbar-preview div.toolbar-close { cursor: auto; } .tbToolbar-preview div.toolbar-close:hover { background-position: top left; } /* Toolbar Editor Preview */ .tbToolbar-editor { border-left-width: 1px !important; border-top-width: 1px !important; border-right-width: 1px !important; border-left-style: solid !important; border-top-style: solid !important; border-right-style: solid !important; border-left-color: #313131 !important; border-top-color: #313131 !important; border-right-color: #313131 !important; } .tbToolbar-editor div.toolbar-close { cursor: auto; } .tbToolbar-editor div.toolbar-close:hover { background-position: top left; } /* Toolbar Theme Reset/Defaults .tbToolbar a:link { text-decoration: underline; font-weight: normal; font-style: normal; } .tbToolbar a:visited { text-decoration: underline; font-weight: normal; font-style: normal; } .tbToolbar a:hover { text-decoration: underline; font-weight: normal; font-style: normal; } .tbToolbar a:active { text-decoration: underline; font-weight: normal; font-style: normal; }*/ /****************************************************************************** * Mobile Top View *****************************************************************************/ #mobile-body { margin: 0px; border: none; padding: 0px; } /****************************************************************************** * Template Globals *****************************************************************************/ #tb-template {background-color: #111111; border: 2px solid #2B2B2B; color: #000000; font-family: "Arial", "sans serif"; font-size: 10pt; margin: 1em auto; width: 1000px; } #tb-content { padding: 10px 10px; text-align: left; } #tb-content h1 { font-weight: bold; font-size: 1.3em; color: #333333; line-height: 1.3em; top: 0px; right: 0px; width: auto; height: auto; font-family: 'Arial'; color: #000; } #tb-content h2 { font-weight: bold; font-size: 1.1em; color: #ffffff; } #tb-content h3, #tb-content h4, #tb-content h5, #tb-content h6 { font-weight: bold; font-size: 1em; color: #000000; } #tb-content h1, #tb-content h2, #tb-content h3, #tb-content h4, #tb-content h5, #tb-content h6 { margin-bottom: 0.8em; } #tb-content p { margin: 0.8em 0 0.8em 0; line-height: 1.3em; } #tb-content .left { float: left; } #tb-content .right { float: right; } #tb-content div.hr { height: 1px; width: 100%; margin: 3px 0; background-color: #aaa; } /****************************************************************************** * Toolbar Editor *****************************************************************************/ .tooltipx {position:absolute;background:#0099cc;height:17px;color:#fff;font-size:12px;font-weight:bold;padding:8px;-moz-border-radius:5px;-webkit-border-radius: 5px; border-radius:5px;} #incompatible { width: 100%; height: 100%; line-height: 20px; } #incompatible div { overflow: auto; } #incompatible div.browsers { margin: 10px 0px 20px 0px; } #incompatible div.browsers div.browser { width: 180px; float: left; margin: 10px; text-align: center; } #incompatible div.browsers div.browser img { width: 128px; margin: 0 26px; } #widget-staging { font-size: 10pt; overflow: hidden !important; height: 0px !important; border-style: none !important; font-family: "Verdana", "sans serif" !important;} #editor { overflow: auto; } #toolbar-preview { width: 940px; height: 36px; margin: 0px auto; padding: 0px; position: relative; } #toolbar-container { width: 980px; height: 60px; margin-bottom: 5px; background-color: transparent; position: relative; } #toolbar-preview-container { width: 980px; float: left; margin-top: 15px; } #toolbar-tools-container { width: 980px; height: 36px; float: left; } #toolbar-editor { display: none; position: absolute; z-index: 300; background-color: #aaa; width: 600px; float: left; margin: 5px; padding: 10px; overflow: hidden; line-height: 32px; background-color: #f3f3f3; border: 2px solid #aaa; } #toolbar-preview div.widget { margin-top: 0px; margin-bottom: 0px; z-index: 500; } #widget-overlay { border: 6px solid #444; position: absolute; z-index: 490; opacity: 0.6; filter:alpha(opacity=60); -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; } #toolbar-preview div.ui-resizable { } div.widget-resizable-helper { border: 2px dotted #666; opacity: 0.8; filter:alpha(opacity=80); } #toolbar-preview div.widget-placeholder { width: 1px; height: 28px; border: 1px solid #ddd; background-color: #000000; margin: 3px 3px; opacity: 0.8; filter:alpha(opacity=80); } #toolbar-preview div.widget-placeholder2 { background-color: #000000; opacity: 0.5; filter:alpha(opacity=50); } #toolbar-inner-left { height: 100%; min-width: 15px; float: left; } #toolbar-inner-right { height: 100%; min-width: 15px; float: right; } /* #toolbar-inner-left { height: 100%; min-width: 15px; float: left; background-color: #ccc; } #toolbar-inner-right { height: 100%; min-width: 15px; float: right; background-color: #ddd; } */ #toolbar-inner-left div.widget-placeholder { float: left; } #toolbar-inner-right div.widget-placeholder { float: right; } #editor-middle { background-color: #232323; overflow: auto; border: 0px solid #888; padding: 5px; } #sidebar { max-height: 536px; width: 160px; float: left; clear: left; margin: 5px 0 5px 5px; padding: 5px 0 5px 5px; overflow: hidden; } #sidebar h2 { font-size: 18px; margin: 5px 0px; font-family: "Arial"; font-weight:normal; } #sidebar div.numberedtab { padding: 0px 0px; margin: 1px 0px; overflow: visible; cursor: pointer; } #sidebar div.numberedtab span { line-height: 32px; font-size: 1.1em; font-weight: bold; color: #939393; } #sidebar div.tab { padding: 0px 12px; margin: 1px 0px; overflow: visible; cursor: pointer; } #sidebar div.tab:hover {background-color:#444; -moz-border-radius:5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; } #sidebar div.tab span { line-height: 32px; font-size: 12px; font-weight: normal; color: #939393; } #sidebar div.tab div.description { display: none; line-height: 20px; background-color: #ccd5dc; padding: 5px; font-size: 1em; color: #000000; height: 40px; } #sidebar div.selected { background-color: #d2d2d2; -moz-border-radius:5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px;} #sidebar div.selected:hover { background-color: #d2d2d2; -moz-border-radius:5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px;} #sidebar div.selected span { color: #333; font-weight: bold; } #sidebar div.toolbar-settings { margin-bottom: 1em; } #categories { margin-top: 40px; } #categories span { line-height: 32px; font-size: 1.1em; color: #FFFFFF; } #categories div.hiddenlink span { line-height: 32px; font-size: 10px; font-weight: normal; font-style:italic; color: #FFFFFF; padding-right:5px;float:right; cursor:pointer;} #categories-header {cursor:pointer;} #personalization { margin-top:10px;padding: 0px 0px; margin: 1px 0px; overflow: visible;} #personalization span { line-height: 32px; font-size: 1.1em; color: #FFFFFF; cursor:pointer;} #personalization div.hiddenlink span { line-height: 32px; font-size: 10px; font-weight: normal; font-style:italic; color: #FFFFFF; padding-right:5px;float:right; cursor:pointer;} #personalization-header {cursor:pointer;} #organization { margin-top:40px;padding: 0px 0px; overflow: visible; cursor:pointer;} #organization span { line-height: 32px; font-size: 1.1em; font-weight: bold; color: #FFFFFF; } #organization div span { line-height: 32px; font-size: 10px; font-weight: normal; color: #939393; font-style:italic;} #save { margin-top:30px;padding: 0px 0px; overflow: visible; cursor:pointer;} #save span { line-height: 32px; font-size: 1.1em; font-weight: bold; color: #FFFFFF; } #save div span { line-height: 32px; font-size: 12px; font-weight: bold; color: #939393;} #sidebar div.save-tab { line-height: 32px; font-size: 12px; font-weight: bold; color: #939393; padding: 0px 12px; margin: 1px 0px; overflow: visible; cursor: pointer;} /*original was D2D2D2 C7D6C7 FCF6D8 D6E7F7*/ #view { background-color: #D2D2D2; height: 600px; width: 770px; float: left; margin: 5px 5px 5px 0; padding: 10px; overflow: hidden; position: relative; border: 1px solid #ccc; } .template-area{ } .template-area-selected{ } #view div.page { } #toolbar-settings { padding: 10px; } /*#toolbar-settings table.table { width: 100%; }*/ #toolbar-settings table.table tr { vertical-align: top; height: 36px; line-height: 36px; } #toolbar-settings span.field-name { font-weight: bold; } #toolbar-themes { padding: 10px; } #themes-view { width: 678px; height: 478px; overflow: hidden; } #themes-view div.toolbar-theme { position: relative; float: left; overflow: hidden; width: 307px; height: 56px; margin: 4px; padding: 6px; border: 1px solid #aaa; background-color: #fdfdfd; cursor: pointer; } #themes-view div.toolbar-theme:hover { border: 1px solid #a4dd4a; box-shadow: 0px 0px 4px #444; -moz-box-shadow: 0px 0px 4px #444; -webkit-box-shadow: 0px 0px 4px #444; background-color: #fff; } #themes-view div.toolbar-theme div.top { line-height: 10px; } #themes-view div.toolbar-theme div.top img.logo { display: block; float: left; height: 48px; width: 48px; margin-right: 6px; } #themes-view div.toolbar-theme div.top span.title { font-size: 13px; font-family: 'Georgia', 'Verdana', 'san-serif'; font-weight: bold; padding: 5px; } #themes-view div.toolbar-theme div.theme-preview-container { position: absolute; padding: 0 3px; top: 24px; right: 0px; width: 308px; overflow: hidden; } #themes-view div.toolbar-theme div.theme-preview { height: 36px; width: 940px; overflow: hidden; border-left-width: 1px !important; border-top-width: 1px !important; border-right-width: 1px !important; border-left-style: solid !important; border-top-style: solid !important; border-right-style: none !important; border-left-color: black !important; border-top-color: black !important; border-right-color: black !important; } #themes-view div.toolbar-theme div.theme-preview div.theme-widget { float: left; height: 36px; margin: 0 3px; line-height: 36px; } #widget-view { } #widget-view div.view-container { width: 688px; height: 516px; margin: 5px; overflow: hidden; } #widget-view div.widget-container { float: left; width: 150px; height: 150px; margin: 10px; border: 1px solid #aaa; background-color: #fdfdfd; cursor: pointer; } #widget-view div.widget-container:hover { margin: 9px; border: 2px solid #aaa; box-shadow: 0px 0px 8px #444; -moz-box-shadow: 0px 0px 8px #444; -webkit-box-shadow: 0px 0px 8px #444; background-color: #fff; } #widget-view div.widget-container div.widget-box { height: 100%; position: relative; } #widget-view div.widget-container div.widget-box div.avatar { /* cursor: move; */ height: 64px; padding: 3px 0; text-align: center; line-height: 64px; } #widget-view div.widget-container div.widget-box div.info { height: 80px; font-size: 9pt; text-align: center; } #widget-view div.widget-container div.widget-box div.info div.name { height: 20px; line-height: 20px; font-weight: bold; overflow: hidden; } #widget-view div.widget-container div.widget-box div.info div.desc {padding: 2px 5px; height: 56px; overflow: hidden; } #widget-view div.widget-container div.widget-box div.sub { display: none; height: 24px; line-height: 24px; width: 100%; position: absolute; bottom: 0px; overflow: hidden; font-size: 8pt; text-align: center; background-color: #111; color: #fff; opacity: 0.8; filter:alpha(opacity=80); } #widgetbox-up { cursor: pointer; width: 40px; height: 22px; position: absolute; bottom: 100px; right: 31px; line-height: 20px; text-align:center;} #widgetbox-down { cursor: pointer; width: 40px; height: 22px; position: absolute; bottom: 60px; right: 30px; line-height: 20px; text-align:center;} div.button { overflow: auto; height: 36px; line-height: 36px; cursor: pointer; font-weight: bold; font-size: 1.1em; } div.button div.button_l { width: 8px; height: 36px; float: left; background: url('/tb/img/editor/button_left.png') no-repeat; } div.button div.button_m { padding: 0px 20px; float: left; background: url('/tb/img/editor/button.png') repeat-x; } div.button div.button_r { width: 8px; height: 36px; float: left; background: url('/tb/img/editor/button_right.png') no-repeat; } #widget-hover { position: absolute; z-index: 400; overflow: visible; padding: 10px 10px; margin: -10px -10px; height: 36px; } #widget-hover ul.container { z-index: 600; width: 120px; margin-top: 36px; padding: 2px; background-color: #ddd; overflow: auto; border: 2px solid #aaa; } #widget-hover ul.container li.element { height: 24px; line-height: 24px; margin: 1px; text-align: center; color: #222; } #widget-hover ul.container li.element:hover { background-color: #aaa; color: #111; cursor:pointer;} #widget-hover ul.container li.element img.icon { float: left; height: 20px; width: 20px; margin: 2px; } #widget-hover ul.container li.element div.text { float: left; margin-left: 6px; } #widget-hover ul.container li.element div.button { display: none; float: right; width: 64px; height: 18px; margin: 2px; border: 1px solid black; background-color: #ccc; } /****************************************************************************** * Widget Editor *****************************************************************************/ #weLB { z-index: 2000; width: 650px; padding: 6px; display: none; position: absolute; overflow: hidden; margin-left: 50%; left: -325px; background-color: #555; } #weLB-top { width: 650px; overflow: visible; background-color: #ddd; border-bottom: 1px solid #555; } #weLB-middle { z-index: 2100; width: 650px; overflow: hidden; background-color: #fff; border-bottom: 1px solid #555; } #weLB-bottom { width: 640px; padding: 5px; line-height: 26px; height: 26px; overflow: hidden; background-color: #ddd; } #weLB-back { z-index: 1990; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #000; opacity: 0.3; filter:alpha(opacity=30); } #weLB-top div.header { height: 80px; padding: 4px; } #weLB-top div.header div.avatar-container { float: left; text-align: center; height: 64px; min-width: 64px; padding: 8px;} #weLB-top div.header div.content { float: left; height: 40px; margin: 4px; line-height: 40px; } #weLB-top div.header div.content h1 { color: black; text-align: left; font-size: 1.5em; height: 1.5em; font-weight: bold; font-family: Georgia; } #weLB-top div.header div.content span { color: #777; font-style: italic; text-align: left; font-size: 1em; font-family: Georgia; } #weLB-top div.tabs { margin-top: 4px; padding: 0 1em; height: 36px; text-align: center; font-weight: bold; } #weLB-top div.tabs div.we-tab { position: relative; top: 1px; width: 160px; height: 34px; margin: 0px 16px; line-height: 36px; float: left; background-color: #ccc; cursor: pointer; border: 1px solid #555;} #weLB-top div.tabs div.selected { background-color: #fff; height: 35px; cursor: auto !important; z-index: 2101; border-bottom-style: none; } #weLB-middle div.we-tab { display: none; width: 640px; min-height: 100px; max-height: 350px; overflow: auto; margin: 0px; padding: 0px 5px; } #weLB-middle div.selected { display: block !important; } #weLB-middle div.we-tab div.widget-editor { overflow: auto; position: relative; width: 620px; padding: 10px; margin: 0 auto; } #weLB span.h1 { font-weight: bold; font-size: 1.2em; color: #333333; } #weLB span.h2 { font-weight: bold; font-size: 1.1em; color: #000000; } #weLB span.h3 { font-weight: bold; font-size: 1em; color: #000000; } #weLB span.title { font-weight: bold; font-size: 1.2em; color: #000000; } #weLB span.field { font-weight: bold; font-size: 1em; color: #000000; white-space: nowrap; padding: 2px 0px; } #weLB span.required:after { content: "*"; border-style: none; padding-left: 3px; font-weight: bold; color: #ff0000; } #weLB span.tooltip { cursor: help; border-bottom: 1px dotted #323b44; } div.tooltip { display: none; font-family: 'Verdana'; font-size: 10pt; background-color: #000; color: #eee; min-height: 24px; line-height: 24px; max-width: 450px; text-align: center; padding: 2px 10px; z-index: 2200; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; opacity: 0.8; filter:alpha(opacity=80); } #weLB-middle div.widget-editor div.error-tag { display: none; position: absolute; background-color: #000; overflow: hidden; font-size: 7pt; color: #eee; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; line-height: 16px; max-width: 300px; padding: 4px 8px; text-align: left; } #weLB-middle div.widget-editor img.tooltip { cursor: pointer; width: 18px; height: 18px; } #widgetform-close { float: right; overflow: hidden; cursor: pointer; width: 18px; height: 18px; margin: 9px 6px; background-image: url('/tb/widgets/close/close.png'); background-position: left top; background-repeat: no-repeat; } #widgetform-close:hover { background-position: bottom left; } #widgetform-errors { font-size: 8pt; font-weight: bold; float: right; width: 518px; padding: 0px 5px; text-align: right; height: 26px; line-height: 26px; } #widgetform-submit { float: right; font-weight: bold; height: 24px; line-height: 24px; width: 100px; padding: 0px 5px; text-align: center; border: 1px solid #444; background-color: #ccc; cursor:pointer;} #widgetform-submit:hover { background-color: #ddd; } #widgetform-submit:active { background-color: #bbb; } div.we-table-container { margin: 0 auto; } div.we-table-container table.table { width: 600px; } div.we-table-container table.inner-table { width: 100%; margin: 0 auto; } div.we-table-container tr { height: 36px; line-height: 36px; vertical-align: top; } div.we-table-container tr td { padding: 0 5px; vertical-align: top; } /* Widget Editor input elements */ /*#we-table-container table.table input { height: 22px; line-height: 22px; }*/ div.we-table-container table.table input.input-text { width: 160px; height: 22px; line-height: 22px; } div.we-table-container table.table input.input-url { width: 250px; height: 22px; line-height: 22px; } div.we-table-container table.table input.input-upload { height: 22px; line-height: 22px; } div.we-table-container table.table input.input-color { width: 50px; height: 22px; line-height: 22px; } div.we-table-container table.table button { height: 22px; line-height: 22px; padding: 5px; } div.we-table-container table.table div.input-color { width: 24px; height: 24px; margin: 5px; background-color: #fff; border: 2px solid black; float: right; } div.we-table-container table.table div.wf-list-container { width: 100%; height: 125px; overflow: hidden; background-color: #bbb; } div.we-table-container table.table div.wf-list-container div.wf-list-title { font-weight: bold; width: 100%; overflow: hidden; text-align: center; float: left; height: 24px; line-height: 24px; width: 100%; background-color: #aaa; border-bottom: 1px solid #888; } div.we-table-container table.table div.wf-list-container div.wf-list-entries { font-size: 10px; width: 100%; height: 100px; text-align: center; overflow: auto; margin: 0 auto; } div.we-table-container table.table div.wf-list-container div.wf-list-entries div.wf-list-entry { width: 100%; overflow: hidden; float: left; height: 24px; line-height: 24px; width: 100%; background-color: #ccc; border-bottom: 1px solid #888; } div.we-table-container table.table div.wf-list-container div.wf-list-entries div.wf-list-entry-placeholder { overflow: hidden; float: left; height: 5px; width: 90%; margin: 10px 5%; background-color: #888; } div.we-table-container table.table div.wf-list-container div.wf-list-c1 { overflow: hidden; float: left; height: 24px; line-height: 24px; width: 45%; } div.we-table-container table.table div.wf-list-container div.wf-list-c2 { overflow: hidden; float: left; height: 24px; line-height: 24px; width: 45%; } div.we-table-container table.table div.wf-list-container div.wf-list-c3 { overflow: hidden; float: left; height: 24px; line-height: 24px; width: 10%; } /* OAuth */ #oauth-profile { height: 40px; padding: 2px; line-height: 36px; margin: 10px 0px; } #oauth-profile div.as { float: left; height: 36px; margin-right: 6px; font-weight: bold; } #oauth-profile div.image { float: left; height: 36px; width: 36px; margin: 0px 2px; } #oauth-profile div.image img { height: 36px; width: 36px; } #oauth-profile div.name { float: left; height: 36px; margin: 0px 4px; } div #navigation h2 div { line-height:32px; height:32px; text-align: center; font-size:12px; width: 135px; cursor: pointer; border: 0px; margin: 2px; padding: 0px; float:left; background-color:#8e8e8e; color: #17381b; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } div #navigation h2 div.current { background-color: #A4DD4A; } .theme-widget { float:left; height:36px; line-height:36px; } .theme-preview { overflow:hidden; cursor:pointer; padding-right:3px; } div.export_button { font-weight: bold; display: inline-block; line-height: 20px; color: rgb(23, 56, 27); cursor: pointer; -moz-border-radius: 4px 4px 4px 4px; background-color: rgb(164, 221, 74); width: 110px; height: 20px; float: left; text-align: center; } div.export_button:hover { color: #FFFFFF; } #colorSelector {cursor:pointer;margin-top:5px;width:75px;height:25px;border:3px solid #444;} #colorSelector:hover {border:3px solid #222;} ul.imagelist li{float:left;height:38px;border:2px solid #fff;cursor:pointer;} ul.imagelist li:hover{border:2px solid #333;} ul.imagelist li.selected{float:left;height:38px;border:2px solid #01BBFF;} #toolbar-preview a:link {cursor:move;}