* { margin: 0; padding: 0; list-style: none; font-family: Arial, Helvetica, sans-serif; } html { height: 100%; overflow: hidden; } body { height: 100%; background: #ccdef3; } /** * Actions/Buttons */ .ajaxActions { position: absolute; bottom: 5px; right: 15px; text-align: right; } #TreeActions { background: #eee; border-bottom: 1px solid #ccc; float: left; width: 100%; } #TreeActions li { float: left; } .ajaxActions input, .actions input, button.action, div.Actions input, input.action, li.action input, li.action button { cursor: pointer; background-image: url(../images/textures/ToolBar.png); color: #333; overflow: visible; width: auto; border-color: #CCCCCC rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204); border-style: double; margin: 1px; padding: 2px; font-size: 11px; } .ajaxActions input, #TreeActions li.action input { float: left; height: 25px; padding: 0 10px; font-weight: bold; } #TreeActions li.action input { font-weight: normal; } .ajaxActions input:active { background: #F4F4F4 none repeat scroll 0%; border-color: #999999 rgb(204, 204, 204) rgb(204, 204, 204) rgb(153, 153, 153); } .ajaxActions input:hover, div.Actions input:hover, input.action:hover, button.action:hover, li.action input:hover, li.action button:hover { background: #fff; } input.delete:hover, button.delete:hover, .actionparams input.delete:hover { background: #ce0000; color: #fff; } input.loading { padding-left: 16px; background: #fff url(../images/network-save.gif) no-repeat center left; } /* Overrides - TODO Find a better place to put them */ form#Form_EditForm fieldset { height: 100%; } body.stillLoading select { display: none; } /** 3-PANEL LAYOUT **/ #top { font-size: 14px; height: 33px; background: #474855 url(../images/mainmenu/top-bg.gif) top left repeat-x; color: #fff; overflow: hidden; } #left { position: absolute; top: 45px; left: 3px; width: 205px; height: 91%; z-index: 50; border: 1px solid #acbbcc; background: #fff; } #right, #rightbottom { position: absolute; left: 208px; top: 45px; height: 91%; width: 600px; overflow: auto; z-index: 50; border: 1px solid #acbbcc; background: #eee; margin-right: 3px; } #rightbottom { height: 30%; } #separator { position: absolute; top: 51px; left: 205px; height: 92%; width: 3px; cursor: e-resize; } /** * Hidden left-hand panel */ #left.hidden form, #left.hidden .title, #left.hidden #TreeActions { display: none; } #left.hidden { width: 18px; display: block; } #separator.hidden { display: none; } #left div.title, #right div.title, #rightbottom div.title { border-top: 1px solid #77BBEE; height: 22px !important; background: #0075C9 url(../images/texture/obar.gif) repeat-x 0 0; } #rightbottom div.light { background-image: url(../images/textures/obar-light.png) !important; } #left div.title div, #right div.title div, #rightbottom div.title div { font-size: 14px; font-weight: bold; color: #fff; padding: 2px 0 0 4px; background-position: 2px 2px; background-repeat: no-repeat; padding-left: 20px; border-top: 1px solid #77BBEE; } #left h2, #contentPanel h2 { background-image:url(../images/textures/obar-18.gif); height: 18px; line-height: 18px; color: #fff; font-size: 12px; padding-left: 3px; } /** TOP PANEL **/ #top #MainMenu { margin: 0 0 0 6px; } #top #MainMenu li { margin: 0 4px; float: left; height: 33px; cursor: pointer; } #top #MainMenu a { display: block; height: 33px; float: left; padding: 0 6px; font-size: 14px; letter-spacing: -0.1px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: normal; line-height: 32px; color: #fff; text-decoration: none; } #top #MainMenu a:hover { text-decoration: none; background: #6a7580 url(../images/mainmenu/hover.gif) repeat-x left top; } #top #MainMenu .current { background: #ccdef3 url(../images/mainmenu/current.gif) repeat-x left top; border-bottom : none; } #top #MainMenu .current a:hover { background: #cddef3 url(../images/mainmenu/currentHover.gif) repeat-x left top; } #top #MainMenu .current a:link, #top #MainMenu .current a:visited { color : #2f383f; } #top #Logo { float: right; } #top #Logo a { margin: 0; display: block; font-size: 14px; text-decoration: none; height: 26px; line-height: 22px; position: absolute; top: 5px; right: 8px; padding-right: 34px; background: url(../images/mainmenu/logo.gif) right top no-repeat; color: #fff; } html > body #top #Logo { padding-bottom: 0; } #bottom { width: 100%; position: absolute; bottom: 0; left: 0; height: 23px; overflow: hidden; background: #4d4e5a url(../images/textures/footerBg.gif) repeat-x left top; } #bottom .holder { text-align: center; padding: 5px 6px 0 3px; font-size: 10px; color: #fff; } #bottom #logInStatus { float: right; } #bottom #logInStatus a, #bottom #logInStatus a:hover { color: #fff; background: none; } #bottom #logInStatus a { text-decoration: underline; } #bottom #logInStatus a:hover { text-decoration: none; } #bottom #logInStatus #LogoutLink { background: url(../images/logout.gif) no-repeat right top; padding-right: 20px; padding-bottom: 3px; } #bottom #switchView { float: left; } #bottom #switchView a { background: none; } #bottom .bottomTabs a { color: #fff; } #bottom .bottomTabs div.blank { display: block; float: left; cursor: pointer; background-color: transparent; padding-right: 4px; font-weight: bold; line-height: 13px; font-size: 11px; padding-left: 2px; color: #fff; } #bottom .bottomTabs a.current { cursor: auto; } #bottom .bottomTabs a:hover { text-decoration: none; } /** LEFT PANEL **/ #sitetree_holder { height: 80%; width: 100%; overflow-y: auto; overflow-x: hidden; } #sitetree { margin-top: 2px; width: 500px; /* IE's chocking right now */ } html>body #sitetree { width: auto; } div.spacer, li.spacer { float: none; clear: both; background-color: transparent; border-style: none; margin: -1px 0 0 0; height: 1px; font-size: 1px; width: auto; } /** RIGHT PANEL **/ .mceToolbarExternal { background-color: #eee; display: block; } .mceToolbarExternal a { text-decoration: none; border: 0 !important; } .mceToolbarExternal a img { border: none; } #right form#Form_EditorToolbarLinkForm, #right form#Form_EditorToolbarImageForm, #right form#Form_EditorToolbarFlashForm { background: #eee; border-bottom: 1px solid #ccc; display: none; margin: 1px 0 0 0; padding: 5px; /* * HACK IE (all versions): container needs to be higher stacking order * than any DOM-elemnt under it. * @see http://www.aplus.co.yu/lab/z-pos/ */ /*overflow: hidden;*/ z-index: 1001; } #right form#Form_EditorToolbarLinkForm ul.optionset { height: 1em; } #right form#Form_EditorToolbarLinkForm ul.optionset li { float: left; } .thumbnailstrip { overflow: auto; white-space: nowrap; width: 100%; float: left; border: 1px solid #aaa; } .thumbnailstrip li { float: left; margin-right: 4px; } /* CMS specific icons for the tree */ ul.tree li.Root span.Root span.c a { background-image: url(../../cms/images/treeicons/root.png) !important; } .TreeDropdownField { background: #ff0; } /* Misc Styling */ iframe { border: none; } /* Content Panel Design * This is our new right hand pane for inserting images and links etc */ #contentPanel { background-color: #fff; width: 205px; position: absolute; border: 1px solid #ACBBCC; top: 45px; padding: 0; margin-right: 10px; overflow:hidden; font-size: 12px; } #contentPanel div, #contentPanel p#TargetBlank { margin-left: 0; } #contentPanel div.TreeDropdownField span.items { width: 162px; background: #fff; font-size: 12px; border:1px solid #A7A7A7; border-right: none; } #contentPanel .thumbnailstrip { width: 195px; border: none; } #contentPanel fieldset { padding: 5px; } #contentPanel h2 { margin: -5px -5px 0 -5px; } #contentPanel select { width: 186px; padding: 1px 0; font-size: 12px; } #contentPanel option { font-size: 12px; } #contentPanel span.middleColumn { background:#E9E9E9 none repeat scroll 0%; display:block; padding:3px; width:98%; } #contentPanel input.text { border:1px solid #A7A7A7; padding:3px; width: 179px; } #contentPanel #Dimensions span { background: none; } /* Image height and width inputs. We need to position them in the right places */ #contentPanel input#Form_EditorToolbarImageForm_Width, #contentPanel input#Form_EditorToolbarFlashForm_Width { width: 30px; } #contentPanel input#Form_EditorToolbarImageForm_Height, #contentPanel input#Form_EditorToolbarFlashForm_Height { width: 30px; } #Form_EditorToolbarImageForm #Image, #Form_EditorToolbarFlashForm #Flash { margin: 5px; } #Form_EditorToolbarImageForm fieldset label.left, #Form_EditorToolbarFlashForm fieldset label.left, #Form_EditorToolbarLinkForm fieldset label.left { float:left; margin-left:0px; color: #666; line-height: 18px; font-size: 11px; width:120px; } #Form_EditorToolbarImageForm fieldset span, #Form_EditorToolbarFlashForm fieldset span, #Form_EditorToolbarLinkForm fieldset span { float: left; } #Form_EditorToolbarLinkForm fieldset li span, #Form_EditorToolbarFlashForm fieldset li span, #Form_EditorToolbarImageForm fieldset li span { float: none; } #Form_EditorToolbarImageForm_Width, #Form_EditorToolbarImageForm_Height, #Form_EditorToolbarFlashForm_Width, #Form_EditorToolbarFlashForm_Height { outline: 3px solid #E9E9E9; } #Form_EditorToolbarImageForm #Image img { border: 2px solid #e4e3e3; } #contentPanel div.Actions { margin: 2px 0 0 5px; } #contentPanel #Image a.selectedImage img { border: 2px solid #222; } /* going to use this */ #BlankImage { text-indent: -9000px; }