/**
 * Frog CMS - Content Management Simplified. <http://www.madebyfrog.com>
 * Copyright (C) 2008 Philippe Archambault <philippe.archambault@gmail.com>
 *
 * This file is part of Frog CMS.
 *
 * Frog CMS is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * Frog CMS is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with Frog CMS.  If not, see <http://www.gnu.org/licenses/>.
 *
 * Frog CMS has made an exception to the GNU General Public License for plugins.
 * See exception.txt for details and the full text.
 */

/* Reset ------------------------------------------------------------------ */

body {background-color: #221E1E;}
html,body,div,ul,ol,li,dl,dt,dd,form,fieldset,input,select,textarea,pre,code,
h1,h2,h3,h4,h5,h6,p,blockquote,hr,table,th,td {margin: 0; padding: 0;}
h1,h2,h3,h4,h5,h6 {font-size: 100%; font-weight: normal;}
ul {list-style: none;}
html,body,a img {border: 0;}
table {border-collapse:collapse; border-spacing:0;}

/* General ---------------------------------------------------------------- */

body {
  font-size: 95%;
  font-family: "Lucida Grande", "Bitstream Vera Sans", Helvetica, Verdana, Arial, sans-serif;
  margin: 0;
  padding: 0;
  background-color: #6ad;
  color: #000;
}

img { border: 0; }
h3 { font-size: 130%; margin: 1.25em 0 .5em; }
a { color: #147; }
a:hover { text-decoration: none; }
p { margin: 1.2em 0 .6em; }
/*h1 { margin: 0 0 .5em; font-size: 2em; }*/
h1 { margin: -20px -20px 0; padding: 10px 20px; font-size: 1.5em; text-shadow: -1px 2px 3px #bbb; }
h2 { margin: 1em 0 .5em; font-size: 1.6em; }
h3, h4 { margin: .5em 0; font-size: 1.2em; font-weight: bold; }

.hidden { display: none; }
.clear { font-size: 1px; clear: both; }
.warning { color: #D42B27; }

.handle { display: none; cursor: move; }
.handle_reorder { display: none; cursor: move; }
.handle_copy { display: none; cursor: move; }

/* Header ----------------------------------------------------------------- */

#header {
  background-color: #123;
  color: #fff;
  width: 100%;
  padding-top: 1px;
  /*padding-bottom: 20px;*/
}
#header a {
  color: #fff;
  font-weight: bold;
  text-decoration: none;
}
#header a:hover,
#header a:visited:hover {
  text-decoration: underline;
}
#header #site-title {
  font-size: 150%;
  font-weight: bold;
  margin-top: 19px;
  margin-left: 20px;
  padding-bottom: 20px;
  text-shadow: -1px 2px 3px #111;
}

/* Navigation ------------------------------------------------------------- */

#mainTabs {
  margin: 0 17px 0 20px;
  height: 29px;
}
#mainTabs ul {}
#mainTabs li {
  display: inline;
  list-style: none;
  border: none;
}
#mainTabs a:link,
#mainTabs a:visited {
  float: left;
  margin-right: 3px;
  padding: 6px 8px 5px;
  font-size: 14px;
  line-height: 16px;
  font-weight: normal;
  text-decoration: none !important;
  color: #222;
  background-color: #eee;
  border-bottom: 2px solid #ccc;
}
#mainTabs a:hover {
  color: #000;
  background-color: #999;
  border-color: #777;
}

#mainTabs a:link.current,
#mainTabs a:visited.current {
  color: #123;
  background: #6ad;
  border-color: #6ad;
  font-weight: bold;
  text-decoration: none;
}
#mainTabs .right {
  float: right;
}

/* Main ------------------------------------------------------------------- */

#main {
  width: 100%;
}

/* Content ---------------------------------------------------------------- */

#content-wrapper {
  float: left;
  margin: 1%;
  width: 70%;
  font-size: 95%;
  background-color: #fff;
  border-bottom: 2px solid #58b;
}

#installation #content-wrapper,
#body_setting_index #content-wrapper,
#body_page_index #content-wrapper,
#body_page_add #content-wrapper,
#body_page_edit #content-wrapper,
#body_snippet_add #content-wrapper,
#body_snippet_edit #content-wrapper,
#body_layout_add #content-wrapper,
#body_layout_edit #content-wrapper,
#body_user_add #content-wrapper,
#body_user_edit #content-wrapper,
#body_comment_edit #content-wrapper,
#body_plugin_index #content-wrapper {
  margin-right: 0;
  width: 98%;
}

#content {
  padding: 20px;
}

/* Sidebar ---------------------------------------------------------------- */

#sidebar-wrapper {
  float: left;
  margin: 1% 0;
  width: 27%;
}

#body_setting_index #sidebar-wrapper,
#body_page_index #sidebar-wrapper,
#body_page_add #sidebar-wrapper,
#body_page_edit #sidebar-wrapper,
#body_snippet_add #sidebar-wrapper,
#body_snippet_edit #sidebar-wrapper,
#body_layout_add #sidebar-wrapper,
#body_layout_edit #sidebar-wrapper,
#body_user_add #sidebar-wrapper,
#body_user_edit #sidebar-wrapper,
#body_comment_edit #sidebar-wrapper,
#body_plugin_index #sidebar-wrapper {
  display: none;
}

#sidebar h2 {
  margin: 0;
  padding: 0 0 5px 0;
  font-size: 15px;
  border-bottom: 1px solid #ddd;
  text-shadow: -1px 2px 2px #ddd;
}
#sidebar .box {
  margin-bottom: 10px;
  padding: 10px 20px;
  background: #fff;
  border-bottom: 2px solid #58b;
}
#sidebar p,
#sidebar td,
#sidebar th {
  font-size: .83em;
}
#sidebar p.button {
  margin: 0 0 10px;
  padding: 10px 20px 0;
  background: #59c;
}
#sidebar p.button img {
  margin: -10px 10px 0 -20px;
  padding: 6px 10px;
  background: #9ce;
}
#sidebar p.button a {
  color: #fff;
  text-decoration: none;
  font-weight: bold;
}
#sidebar p.button a:hover {
  color: #123;
}
#sidebar .this {
  color: #999;
}
#sidebar .optional {
  color: #666;
}

/* Footer ----------------------------------------------------------------- */

#footer {
  color: #fff;
  font-size: 80%;
  float: left;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 100%;
}
#footer p {
  padding-left: 20px;
  padding-right: 20px;
}
#footer .stats {
  margin-top: -5px;
  font-size: .9em;
  color: #def;
}

/* Site links ------------------------------------------------------------- */

#site-links {
  color: #899;
  font-size: 90%;
  margin: 0;
  position: absolute;
  right: 0;
  top: 20px;
}
#site-links a,
#site-links a:visited {
  color: #6ad;
  text-decoration: none;
}
#site-links a:hover,
#site-links a:visited:hover {
  text-decoration: underline;
}

/* Messages --------------------------------------------------------------- */

#error, #success {
  margin: -20px -20px 20px;
  padding: 10px 20px;
  text-align: left;
}
#info {
  background: #EDFE86;
}
#error {
  background: #a22;
  color: #fff;
}
#success {
  background: #cfc;
  color: #051;
}

/* Index table, list ------------------------------------------------------ */

.index-def {
  background-color: #f5f5f5;
  font-size: 90%;
  font-weight: normal;
  margin-top: 20px;
  padding: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}
.index {
  font-size: 90%;
  width: 100%;
  margin-top: 20px;
  border-bottom: 1px solid #ddd;
}
ul.index {
  margin-top: 0;
}
table.index td,
table.index th {
  text-align: left;
}
table.index th {
  background-color: #f5f5f5;
  font-size: 90%;
  font-weight: normal;
  padding: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}
table.index td, .index li {
  position: relative;
  border-top: 1px solid #ddd;
  padding: 2px 4px;
  font-weight: normal;
}
.index .node {
  font-size: 115%;
  font-weight: bold;
}
.index .node .user small {
  position: relative;
  top: 5px;
  color: #666;
  font-size: 90%;
  font-style: italic;
  font-weight: normal;
  margin-left: .5em;
}
.index .even:hover,
.index .odd:hover,
.index .even.hover,
.index .odd.hover {
  background: #f5f5f5;
}
.index .node a,
.index .node a:visited {
  position: relative;
  top: 5px;
  color: #000;
  text-decoration: none;
}
.index .node a:hover, 
.index .node a:visited:hover {
  text-decoration: underline;
}
table.index td.note {
  color: silver;
  font-size: 85%;
  font-style: italic;
  padding: 3em;
  text-align: center;
}
.index p {
  margin-top: 5px;
}
.index .remove {
  position: absolute;
  top: 7px;
  right: 10px;
}

#plugins th, #plugins td {
    text-align: center;
}
#plugins th.plugin, #plugins td.plugin {
    text-align: left;
}
#plugins .disabled td {
	color: #a22;
}
#plugins td .notes {
	padding: 2px 5px;
	border: 1px solid #ddd;
	background-color: #eee;
	font-size: .83em;
	color: #222;
}
#plugins .plugin h4 .from
{
	font-size: .83em;
	font-weight: normal;
	color: #999;
}
/* Site Map --------------------------------------------------------------- */

#site-map-root .node.level-0 .page,
#site-map .node.level-1 .page,
#site-map .node.level-2 .page {
  font-size: 120%;
  font-weight: bold;
}
#site-map .node.level-1 .page { margin-left: 10px; }
#site-map .node.level-2 .page { font-size: 115%; margin-left: 40px; }
#site-map .node.level-3 .page { font-size: 110%; margin-left: 70px; }
#site-map .node.level-4 .page { font-size: 105%; margin-left: 100px; }
#site-map .node.level-5 .page { margin-left: 130px; }
#site-map .node.level-6 .page { margin-left: 160px; }
#site-map .node.level-7 .page { margin-left: 190px; }
#site-map-root .node .page a,
#site-map .node .page a {
  text-decoration: none;
}
#site-map-root .page a .title,
#site-map .page a .title,
#site-map .node .page a:visited .title {
  color: #000;
  text-decoration: none;
}
#site-map .node .page .title.protected {
  color: #9eb3bf;
}
#site-map-root .node .page a:hover .title,
#site-map .node .page a:hover .title, 
#site-map .node .page a:visited:hover .title {
  text-decoration: underline;
}
#site-map .node .page .info {
  color: #9eb3bf;
  font-style: italic;
  font-weight: normal;
}
#site-map .no-children .w1 { padding-left: 23px; }
#site-map-root .page .title,
#site-map .page .title,
#site-map .page .info {
  position: relative;
  top: 5px;
}
#site-map .page img.expander {
  padding: 3px;
  padding-top: 6px;
  padding-bottom: 6px;
}
#site-map-def { margin-top: 20px; position: relative; }
#site-map-def .page {}
#site-map-def .status { position: absolute; top: 0; right: 75px; width: 70px }
#site-map-def .tag { position: absolute; top: 0; right: 375px; width: 150px; }
#site-map-def .modify { position: absolute; top: 0; right: 5px; width: 50px; }
#site-map-def div {
  padding: 2px 4px;
  font-size: 90%;
  font-weight: normal;
  background-color: #f5f5f5;
}
#site-map-root {
  font-size: 90%;
}
#site-map {
  border-bottom: 1px solid #ddd;
  font-size: 90%;
}
#site-map-root li,
#site-map li {
  padding: 2px 0;
  position: relative;
  border-top: 1px solid #ddd;
}
#site-map-root li:hover,
#site-map-root li.hover,
#site-map li:hover,
#site-map li.hover {
  background: #f5f5f5;
}
#site-map ul { list-style: none; margin:0; padding:0; background: #fff; }
#site-map .page, #site-map-root .page {}
#site-map .status, #site-map-root .status { position: absolute; top: 10px; right: 79px; width: 70px }
#site-map .modify, #site-map-root .modify { position: absolute; top: 5px; right: 9px; width: 50px }
#site-map .status { color: #9eb3bf; }
#site-map .status.draft-status { color: #c00; }
#site-map .status.published-status { color: #000; }
#site-map .status.hidden-stats { color: #0c0; }
#snippet_1 .tag, #snippets .tag { font-size:10px; position: absolute; top: 10px; right: 237px; width:300px }
/* Form Elements ---------------------------------------------------------- */

.form-area {
  background-color: #9ce;
  margin-left: -20px;
  margin-right: -20px;
  padding: 20px;
  padding-top: 15px;
  padding-bottom: 10px;
}
.form-area h3 {
  font-size: 100%;
  margin-bottom: 0;
}
.form-area p {
  margin-top: 0;
}
.form-area small {
  font-size: 75%;
}
.form-area label {
  font-weight: bold;
}
.form-area .textbox {
  font-size: 100%;
  width: 100%;
}
.form-area .title {
  margin-bottom: 0;
}
.form-area .title label {
  display: block;
}
.form-area .title .textbox {
  font-family: Georgia, Palatino, "Times New Roman", Times, serif;
  font-size: 200%;
  width: 100%;
}
.form-area .content {
  margin-top: 1em;
  margin-bottom: 1em;
}
.form-area .row {
  clear: both;
  margin-top: 1em;
}
.form-area .row p,
.form-area .row .fieldset {
  float: left;
  margin-right: 2em;
  margin-bottom: 1em;
}
.form-area .fieldset {
  margin-right: .5em;
}
.form-area .fieldset td {
  padding-right: .5em;
}
.form-area .error-with-field .error {
  color: #f00;
  display: block;
  padding: 2px;
  padding-top: 0;
}
.textbox {
  border: 1px solid #ccc;
}
#snippet_name {
	width:96.7%;
	border: 1px solid #ccc;
	font-size:200%;
	margin:10px 10px 0 20px;
}
.buttons {
  font-size: 80%;
  margin-top: 2.5em;
}
.button {
  font-size: 150%;
}
table.fieldset {
  margin-top: 20px;
  width: 100%;
}
table.fieldset td {
  background-color: white;
  border-top: 1px solid #ccc;
  padding: 6px;
}
table.fieldset td.label {
  padding-top: 10px;
  vertical-align: top;
  text-align: right;
  width: 20%;
}
table.fieldset td.label .optional {
  color: #929488;
}
table.fieldset td.field .textbox {
  width: 100%;
}
table.fieldset td.help {
  background-color: #eee;
  font-size: 80%;
  padding-left: 10px;
  width: 40%;
}
table.fieldset input {
  font-size: 100%;
}
table.fieldset .checkbox {
  display: block;
  float: left;
  padding-top: 4px;
  width: 10em;
}
table.fieldset .error-with-field small {
  color: red;
}

/* Tabs ------------------------------------------------------------------- */

.tabs {
  float: left;
  width: 100%;
  margin-top: 10px;
  margin-right: -4px;
}
.tabs .tab {
  display: inline-block;
  font-size: 100%;
  text-align: left;
  margin-right: 3px;
  padding: 15px;
  padding-top: 6px;
  padding-bottom: 4px;
  text-decoration: none;
  text-transform: none;
  background-color: #ddd;
  color: #000;
}
.tabs .tab.here {
  background-color: #fff;
  font-weight: bold;
}
.tab_toolbar {
  float: right;
  margin-top: .28em;
}
.tab_toolbar img { padding-bottom: 2px; }
.pages {
  background-color: #fff;
  width: 100%;
  clear: both;
}
.pages .page {
  padding: 20px;
}
.pages label {
  font-size: 85%;
  font-weight: normal;
}

#meta-pages td {
  background-color: #fff;
  padding: 6px;
}
#meta-pages td.label {
  padding-top: 10px;
  vertical-align: top;
  text-align: right;
  width: 20%;
}
#meta-pages td.label .optional {
  color: #929488;
}
#meta-pages #div-title,
#meta-pages #div-metadata {
  padding: 20px;
  margin-top: .30em;
  margin-bottom: 20px;
}
#meta-pages #div-metadata #page_description {
  height: 40px;
}

#content textarea {
  padding: 3px 0;
  width: 100%;
  height: 280px;
  border: 1px solid #ccc;
  font-family: Monaco, "Courier New", Courier, monospace;
  font-size: 85%;
}

/* Popups ----------------------------------------------------------------- */

#content .popup {
  background-color: white;
  border: 5px solid silver;
  padding: 2em;
  padding-top: 1em;
  padding-bottom: .5em;
}
#content .popup .busy {
  float: right;
}
#content .popup h3 {
  margin-top: 0;
}
#content .popup .close-link {
  font-size: 85%;
  color: #999;
}

/* Calendar (Date picker) ------------------------------------------------- */

.dpDiv {
  border: 1px solid #ccc;
  background-color: #eee;
}

/* the table (within the div) that holds the date picker calendar */
.dpTable {
  text-align: center;
  color: #333;
}

.dpTable td {
  padding: 2px 3px;
  border-bottom: 1px solid #eee;
}

/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {}

/* the top table row that holds the month, year, and forward/backward buttons */
.dpTitleTR {
  background-color: #6ad;
  color: #fff;
}

/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTR {}

/* the bottom table row, that has the "This Month" and "Close" buttons */
.dpTodayButtonTR {
  background-color: #eee;
}

/* a table cell that holds a date number (1-31) */
.dpTD {
  background: #fff;
}
.dpTDempty {
}

/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */
.dpDayHighlightTD {
}

/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */
.dpTDHover {
  background-color: #6ad;
  cursor: pointer;
  color: #fff;
}


/* the table cell that holds the name of the month and the year */
.dpTitleTD {
}

/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD button {
  border: 0;
  background: #47a;
  color: #fff;
  cursor: pointer;
}


/* the table cell that holds the "This Month" or "Close" button at the bottom */
.dpTodayButtonTD {
  background: #ddd;
}


/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTD {
  background-color: #ddd;
  color: #666;
  border-bottom: 1px solid #ccc;
}


/* additional style information for the text that indicates the month and year */
.dpTitleText {
  font-weight: bold;
}


/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */ 
.dpDayHighlight {
  color: #47a;
  font-weight: bold;
  background: #fff;
}


/* the forward/backward buttons at the top */
.dpButton {
  font-size: 10px;
  color: #fff;
  background: #47a;
  font-weight: bold;
  cursor: pointer;
}


/* the "This Month" and "Close" buttons at the bottom */
.dpTodayButton {
  font-size: 10px;
  background: transparent;
  border: none;
  color: #666;
  cursor: pointer;
}