/* Basic Structure */
body {
  margin: 0px;
  color: #000000;
  background-color: #FFFFFF;
  padding: .5em;
}

#mBody {
  clear: both;
  padding: 0 0 1em 0;
  min-width: 500px;
}

#side {
  float: left;
  width: 17%;
  min-width: 100px;
  margin-bottom: 1em;
  font-size: small;
}

#mainContent {
  margin-left: 22%;
  margin-right: 5%;
}

/* Header and Footer */

#headbar {
  background: hsla(120,100%, 25%, 1.0);
  padding: 3px;
  border-bottom: 5px solid #CCCCCC;
  margin-bottom: 1em;
}
#headbar h1 {
  margin: 0px;
  padding: 0px;
  border-width: 0px;
}
#headbar h1 a {
  display: block;
  background:       hsla(120,100%, 25%, 1.0) url(/img/DMOZ-logo.svg) no-repeat 0 0;
  background-size:  contain;
  width: 160px;
  height: 40px;
  text-indent: -700em;
  text-decoration: none;
}

img.aol {
  width: 72;
  height: 36;
  float: right;
  margin: 1px 2px;
}

div.footer {
  font-size: 90%;
  margin-top: 2em;
  padding-top: 3px;
  clear: both;
  border-top: 1px solid hsla(120,100%, 25%, 1.0);
}


/* Primary Navigation Sidebar */

.nav, .nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.nav {
  margin-bottom: 1em;
}

.navhead { /* used for un-linked menu items */
  display: block;
  padding: 2px 5px;
  color: #FFF;
  background: hsla(120,100%, 25%, 1.0);
}

.nav li {
  display: block;
  text-decoration: none;
/*
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #fff;
  border-right: 1px solid #ddd;
*/
}
.nav li a {
  display: block; 
  background: #fff;
  padding: 2px 5px;
}
.nav ul li a {
  display: block; 
  padding: 2px 5px 2px 15px;
}
.nav a:hover {
  text-decoration: underline;
}



/* Secondary navigation
   Used to link pages within multi-page documents i.e. Guidelines
   */
#nav-section h1 {
  border-bottom: 0;
}
.navsections {
  font-size: .9em;
  background: white;
  border-style: solid;
  border-color: hsla(120,100%, 25%, 1.0);
  border-width: 1px;
  margin-left: -3%;
  padding: 1em; 
}

.navsections a, .navsections span { white-space: nowrap; }



/* Page Navigation - Table of Contents <ul class="toc"> */
ul.toc { }


.wordwrap {
    /* wrap long text and urls */
    white-space: pre;            /* CSS 2.0 */
    white-space: pre-wrap;       /* CSS 2.1 */
    white-space: pre-line;       /* CSS 3.0 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    white-space: -moz-pre-wrap;  /* Mozilla */
    word-wrap:   break-word;     /* IE 5+ */
}


/* Link colors */
a { text-decoration: none;
}
a:link {
  color: hsla(120,100%, 25%, 1.0);
  font-weight: bold;
}
li a:link { 
  font-weight: normal;
}
a:visited {
  color: hsla(120,100%, 25%, 1.0);
}
a:active {
  color: #222;
}

a:hover {
  color: #222;
  text-decoration: underline;
}


/* Headers */
h1,h2,h3,h4,h5,h6,h7 { font-weight: bold; color: #000000; }

h1 {
  font-size: 1.3em;
  border-bottom: 1px solid hsla(120,100%, 25%, 1.0);
  margin-left: -3%;
}
h2 {
  font-size: 1.2em;
  border-bottom: 1px solid hsla(120,100%, 25%, 1.0);
  margin-top: 2em;
  margin-left: -2%;
}
h3 {
  font-size: 1.1em;
  border-bottom: 1px dotted hsla(120,100%, 25%, 1.0); 
  margin-top: 2em;
  margin-left: -1%;
}
h4,h5,h6,h7 { 
  font-size: 1em;
  margin: 1em 0em 0em 0em;
}


/* Definition Lists <dl> <dt> <dd> */

dt { font-weight: bold;  }
dd { margin: 0 0 2em 1em; }
dd + dd {  margin-top: -1em; }

dd p:first-child { margin-top:    0; }
dd p:last-child  { margin-bottom: 0; }

.linkbar {
  color: #999999;
  padding: 0em 0.5em;
  text-align: center;
  width: 100%;
  font-size: 90%;
  ddisplay: table;
  wwhite-space: nowrap;
}

/* Data Tables <table class="data"> */
table.data,
table.data th,
table.data td {
  border-style: solid;
  border-color: hsla(120,100%, 25%, 1.0);
  border-width: 1px;
}
table.data { border-collapse: collapse; }
table.data th, table.data td {
  padding: 1px 2px 1px 2px;
  border-color: #FFFFFF;
  border-style: solid;
  border-width: 1px;
}
table.data {
  border-color: hsla(120,100%, 25%, 1.0);
  border-width: 2px;
  border-style: double;
}
table.data th { background: #D7CD9D; }
table.data td { background: #F0F5EB; }
table.data tr.odd  td {  background: #D9E5CC; }
table.data tr.even td {  background: #F0F5EB; }

table.helpcentral th { background-color: #eee; text-align: left; }

/* Special Block Formatting */

.code { font-family: monospace;
  border: 1px solid black;
  background: #EEFFEE;
  padding: 0.2em;
}
.code em, code em {
  color: red;
  font-style: normal;
}

.example .code { margin-bottom: 1em; }


div.hilite { border: 1px solid #669933; background: #F0F0E0; }

.warning {
  background: #FFFF99;
  border: 1px solid red;
  padding: 5px;
}
.important {
  background: #E3ECDA;
  border: 3px double black;
  color: black;
  padding: 5px;
  margin: 1em;
}
.title { font-weight: bold; }

.seealso {
  border: 1px solid #999999;
  background: #F9FCAB;
  padding: 0.25em 0.5em 0.25em 0.5em;
}
.seealso ul { margin-top: 0px; margin-bottom: 0px; }

ul.faq    { padding-left: 1em; }
ul.faq li { padding: 4px 0; }
ul.faq a  { font-weight: normal; }

ul.taxonomy {
  margin: 0px;
  color: #003300;
  ffont-family: monospace;
  padding: 0.25em;
}
ul.taxonomy li    { list-style-type: none; }
ul.taxonomy li li { list-style-type: square;  }
ul.taxonomy ul { margin-left: 0em; padding-left: 2em; }

div.twocoltable { 
  display: table;
}
div.twocoltable div { display: table-row; }
ul.oneoftwo  { 
  display: table-cell;
}
ul.twooftwo { 
  display: table-cell;
}



/* Examples <div class="example"> */

.example {
  margin: 1em 3%;
  padding: .25em;
  color: black;
  border: 1px solid #000099;
  border-left-width: 3px;
  background: #F9F9FF;
}

.example.bad { 
  background: #FFF9F9;
  border-color: #990000;
  background-image: url(/css/exbad.png);
  background-position: 5px 5px;
  background-repeat: no-repeat;
  padding-left: 25px;
}
.example.good { 
  background: #F9FFF9;
  border-color: #009900;
  background-image: url(/css/exgood.png);
  background-position: 5px 5px;
  background-repeat: no-repeat;
  padding-left: 25px;
}
img.example { display: block; }

.example p:first-child,
.example ul:first-child { margin-top: 0px; }
.example p:last-child,
.example ul:last-child { margin-bottom: 0px; }


/* FAQs
   div class="faq>
   
   div class="faqq">...</div>
   div class="faqa">...</div>
   
   /div>
   */
/*
.faqq:before{
  display: inline:
  font-weight: bold;
  content: "Q: ";
}
*/
.faqq {
  margin-left: -1em;
  margin-top: 1.5em;
  font-weightt: bold;
  border: 1px solid #666666;
  background: #EEEEEE;
  padding: 0.25em;
  margin-bottom: 0.5em;
}

dl.faq {  }
dl.faq dt { 
  font-weight: normal;
  border: 1px solid #666666;
  background: #EEEEEE;
  padding: 0.25em;
  margin-bottom: 0.5em;
  margin-top: 1.5em;
}
dl.faq dd { 
  margin-bottom: 1em;
}


/* Span-level elements */
.cat {	
  bborder-top: 1px dotted hsla(120,100%, 25%, 1.0);
  bborder-bottom: 1px dotted hsla(120,100%, 25%, 1.0);
  padding: 0px;
  ffont-size: .9em;
  color: #336600;
  ffont-family: monospace;
}

kbd { background: #FFFFE5; border: 1px solid #999999; }

hr { color: #FFFFFF;
  background-color: #FFFFFF;
  height: 1px;
  border: 0;
  border-top: 1px solid hsla(120,100%, 25%, 1.0);
}

#about-more-info    { padding-left: 1em; }
#about-more-info li { padding: 0.5em 0;  }

dd i.docsIcon { padding-right: 10px; }

/*************** Small screens ***************/

@media screen and (max-width: 625px) {

    /* Documentation uses these IDs.  On mobile, hide side navigation menu. */
    #side        { display: none; }
    #mBody       { min-width: 0; }
    #mainContent { margin: 0 5%; }
}