body {
    margin: 0;
}

dl > dd {
    margin: 0;
}

ul {
    margin: 0;
    padding: 0;
}

ol, li {
    padding: 0;
}

h2, h3, h4, h5, h6 {
    margin: 0;
}

em, th, var {
    font-style: normal;
    font-weight: normal;
}

ol, ul {
    list-style: none;
}

caption, th {
    text-align: left;
}

h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}

q:before, q:after {
    content: '';
}

.clear {
    clear: both;
    height: 0;
}

.rgt {
    float: right;
}

em {
    font-style: italic;
}

#header .container {
    position: relative;
}

.container {
    width: 950px;
    margin: 0 auto;
}

#header {
    background-color: #ffffff;
    width: 100%;
    position: relative;
    padding-top: 24px;
    padding-bottom: 5px;
}

#header img {
    position: relative;
    left: 0;
    top: 0;
}

#header #logo {
    display: block;
    width: 360px;
    height: 105px;
    background: url('../img/snipplr-code2.0.png') no-repeat 0 0;
}

/* main nav in header */
#header #nav {
    position: absolute;
    right: 0;
    top: 34px;
    z-index: 100;
}

#header #nav ul {
    border-bottom: 3px solid #000000;
    color: #000000;
    display: block;
    text-align: right;
    padding: 0 0 4px 0;
    width: 550px;
}

#header #nav ul li {
    display: inline;
    padding: 0;
    margin: 0;
    font: normal small-caps bold 1.2em Arial, sans-serif;
    letter-spacing: normal;
}

body#snippets #header #nav li.snippets a, body#developer #header #nav li.developer a, body#blog #header #nav li.blog a, body#gigs #header #nav li.gigs a {
    padding: 5px 8px;
    color: #ffffff;
    margin-right: 0;
    text-decoration: none;
    border-bottom: none;
    margin-left: 0;
    background: #000000 none;
}

#header #nav ul li a {
    padding: 5px 8px;
    background: #ffffff url('../img/bg-50.png') repeat;
    color: #000000;
    margin-right: 0;
    text-decoration: none;
    border-bottom: none;
    margin-left: 0;
}

#header #nav ul a:hover {
    background: #000000;
    color: #ffffff;
}

#header #nav ul * {
    line-height: normal;
}

/* secondary nav under main nav in header */
body #header #nav ul li ul.secondary {
    display: block;
    position: absolute;
    bottom: -30px;
    right: 0;
    border: 0;
}

body #header #nav ul li ul.secondary li {
    display: inline;
    padding: 0;
    margin: 0;
    font: normal normal normal 1em Arial, sans-serif;
    letter-spacing: normal;
    word-spacing: normal;
}

body#snippets #header #nav ul li.snippets ul.secondary li a, body#developer #header #nav ul li.developer ul.secondary li a, body#blog #header #nav ul li.blog ul.secondary li a, body#gigs #header #nav ul li.gigs ul.secondary li a {
    background-color: transparent;
    color: #aaaaaa;
}

body#snippets #header #nav ul li.snippets ul.secondary li a:hover, body#developer #header #nav ul li.developer ul.secondary li a:hover, body#blog #header #nav ul li.blog ul.secondary li a:hover, body#gigs #header #nav ul li.gigs ul.secondary li a:hover {
    color: #000000;
}

/* under logo in a black bar */
#subnav {
    background-color: #000000;
    width: 100%;
    position: relative;
    color: #ffffff;
    padding: 7px 0;
}

#subnav ul li {
    display: inline;
}

#subnav ul li a {
    color: #cccccc;
    text-decoration: none;
    padding: 0 20px;
}

#subnav ul li a.first {
    padding: 0 20px 0 0;
}

#subnav ul li a:hover {
    color: #ffffff;
    text-decoration: none;
}

#stripe {
    background: #dddddd url('../img/stripe-blue.png') repeat;
    height: 95px;
    width: 100%;
    position: relative;
}

#stripe form {
    position: relative;
    top: 15px;
    margin: 0;
}

#stripe form.search input {
    width: 310px;
    background-color: #ffffff;
    margin: 0;
}

#stripe form.search input.submit {
    width: auto;
    position: relative;
    top: 12px;
    margin: 0;
    padding: 0;
    border: 0;
    background-color: transparent;
}

#stripe form.search input.submit-min {
    width: auto;
    top: -1px;
    background-color: #000000;
    color: white;
    height: 30px;
    padding: 2px 7px;
    font-size: 0.9em;
    text-transform: uppercase;
}

/* main content area of page */
#body {
    width: 100%;
    background-color: #ffffff;
    padding: 24px 0 24px 0;
    position: relative;
}

#sidecol {
    width: 270px;
    position: relative;
    float: right;
}

#sidecol form input {
    width: 210px;
}

#sidecol form input.submit {
    padding: 3px 5px 5px 5px;
    border: 0;
    background-color: #000000;
    color: #ffffff;
    text-transform: lowercase;
    width: auto;
    position: absolute;
    right: 0;
}

#sidecol ul.plugins {
    margin-left: 60px;
    position: relative;
}

#sidecol ul.plugins li {
    position: relative;
    line-height: 4em;
    margin: 1em 0;
}

#sidecol ul.plugins li img {
    position: absolute;
    left: -60px;
}

#maincol .twocol_l {
    width: 315px;
    float: left;
    margin-right: 23px;
}

#maincol .twocol_r {
    width: 315px;
    float: left;
}

#maincol .twocol_r_border {
    padding-left: 23px;
    border-left: 1px solid #000000;
    width: 315px;
    float: left;
}

#maincol.expand {
    width: 950px;
    padding: 0;
    border: 0;
}

ol.numbered li {
    margin-left: 25px;
    list-style: decimal;
}

#viewsource {
    background-color: #000000;
    color: #c5effc;
    padding: 6px;
    margin-bottom: 24px;
}

#viewsource span a {
    text-align: right;
    margin-bottom: 2px;
}

#viewsource #innersource a {
    display: inline;
    font: normal normal normal 1em courier, monospace;
    text-align: left;
    margin: 0;
}

/* nav bar above footer */
#footernav {
    background: #000000 url('../img/bg-footer.png') repeat-x top left;
    padding: 7px 0;
    border-bottom: 1px solid #ffffff;
}

#footernav ul {
    position: relative;
    top: 2px;
}

#footernav ul li {
    display: inline;
}

#footernav ul li a {
    color: #666666;
    text-decoration: none;
    padding: 0 20px 0 20px;
    font-weight: bold;
    background: none;
}

#footernav ul li a.first {
    padding: 0 20px 0 0;
}

#footernav ul li a:hover {
    color: #000000;
    text-decoration: none;
}

#footer {
    color: #eeeeee;
    padding-top: 24px;
}

#footer ul.languages {
    display: block;
    height: 200px;
    margin-top: .5em;
}

#footer ul.languages li {
    display: block;
    float: left;
    width: 150px;
    margin: .5em 0;
}

#footer ul.languages li a {
    text-decoration: none;
    color: #daedf5;
    text-transform: capitalize;
    font: normal normal normal .9em Arial, sans-serif;
}

#footer ul.languages li a:hover {
    color: #ffffff;
}

ul.languages {
    display: inline;
}

ul.languages li {
    display: inline;
    color: #aaaaaa;
    padding-bottom: 3px;
}

ul.languages li a {
    text-decoration: none;
    color: #aaaaaa;
    text-transform: lowercase;
    font: normal small-caps normal 1.2em Arial, sans-serif;
}

ul.languages li a.current {
    color: #000000;
}

ul.languages li a:hover {
    color: #000000;
}

ol.snippets {
    position: relative;
}

ol.snippets > li {
    position: relative;
    padding-left: 24px;
    margin-top: 6px;
    border-bottom: 1px solid #eff0f1;
    padding-bottom: 6px;
}

ol.snippets img.fav {
    position: absolute;
    left: 0;
    top: 5px;
}

ol.snippets img.sav {
    position: absolute;
    left: 0;
    top: 20px;
}


ol.marg img.fav {
    top: 10px;
}

ol.snippets > li {
    overflow: hidden;
}

ol.snippets h3 {
    font-size: 1.2em;
    text-transform: capitalize;
    letter-spacing: .05em;
    font-weight: bold;
}

ol.snippets h3 a {
    color: #000000;
    text-decoration: none;
    padding: 3px 0 0 0;
}

ol.snippets h3 a:hover {
    background-color: #e0f0f6;
}

.twocol_l ol.snippets, .twocol_r ol.snippets, .twocol_r_border ol.snippets {
    font-size: 90%;
}

dl.comments {
    position: relative;
    margin-left: 0;
}

dl.comments dt {
    position: relative;
    padding-left: 24px;
    margin-top: 12px;
    padding-bottom: 0;
    margin-bottom: 5px;
    background: transparent url('../img/icon_comment.png') no-repeat scroll center left;
}

dl.comments dd {
    position: relative;
    border-bottom: 1px solid #eff0f1;
    padding-bottom: 1px;
    padding-left: 24px;
    margin-bottom: 0;
}

dl.comments dd.last {
    position: relative;
    background: none;
    padding-bottom: 6px;
    padding-left: 24px;
}

dl.comments dd {
    overflow: auto;
}

.description ol, .description ul, dl.comments ol, dl.comments ul {
    margin-bottom: 1em;
}

.description ol li, .description ul li, dl.comments ol li, dl.comments ul li {
    margin-left: 20px;
    padding: 0;
    background: none;
}

.description ol li, dl.comments ol li {
    list-style: decimal;
}

.description ul li, dl.comments ul li {
    list-style: disc;
}

#snippetcomment {
    position: relative
}

#message {
    background: transparent url('../img/bg-white.png') repeat;
    width: 100%;
    font-size: 150%;
    text-align: center;
    padding: 120px 0 80px 0;
    position: absolute;
    z-index: 200;
    top: 0;
}

#message a {
    text-decoration: underline;
}

.snippets span.edit {
    text-transform: none;
    margin-left: 10px;
    font-size: 77%;
}

.snippets a.d:hover {
    background-color: red;
    color: #ffffff;
}

.snippets span.l a {
    color: black;
    background-color: #e8e8e8;
    padding: 2px;
}

.snippets span.f {
    color: #999999; /*color: #ff4000;*/
}

.snippets span.p {
    font-size: 77%;
    font-style: italic;
}

a {
    outline: 0;
    color: #3299c6;
    text-decoration: none;
}

.external_link {
    background: url('../images/icon_extlink.png') 99% 70% no-repeat;
    padding-right: 14px;
}

ol.numbered, p {
    margin: 0 0 1em 0;
}

h1 {
    margin: 0;
    font: normal normal bold 2em helvetica, Arial, sans-serif;
    letter-spacing: normal;
    padding: 0;
    font-size: 1.4em;
}

#sidecol h2 {
    font-size: 1.5em;
    margin-bottom: .5em;
    text-transform: uppercase;
}

h2 {
    font: normal normal normal 2em helvetica, Arial, sans-serif;
    text-transform: capitalize;
    letter-spacing: normal;
}

hr.heavy {
    background-color: #000000;
    border: 1px solid #000000;
    color: #000000;
    height: 3px;
    margin: 0 0 1.5em 0;
}

hr.marg {
    margin-bottom: 24px;
}

hr.marg2 {
    margin-bottom: 12px;
}

.marg {
    margin-bottom: 24px;
}

.marg > li {
    padding: 5px 0;
    border-bottom: dotted black;
}

form {
    margin-bottom: 48px;
    margin-top: 12px;
}

form p {
    margin: 0;
    position: relative;
}

form select {
    padding: 7px;
    border: 1px solid #000000;
    color: #055477;
    margin-bottom: 1em;
    background-color: #e5f4f9;
}

form select:focus {
    background-color: #ffffff;
}

form textarea {
    width: 662px;
    padding: 7px;
    border: 1px solid #000000;
    font: italic normal normal 1.2em georgia, serif;
    color: #055477;
    margin-bottom: 1em;
    background-color: #daedf5;
}

form textarea#source {
    font: normal normal normal 0.8em courier, monospace;
    line-height: 1.2em;
}

form div.inputplaceholder {
    padding: 8px;
    font: italic normal normal 1.2em georgia, serif;
    margin-bottom: 1em;
}

#snippetcomment textarea#comment.inactive {
    width: 98%;
    border: 1px solid #000000;
    font: italic normal normal 1.2em georgia, serif;
    color: #055477;
    margin-bottom: 1em;
    background-color: #daedf5;
}

#snippetcomment textarea#comment {
    width: 100%;
    padding: 0;
}

a.advsearch {
    color: white;
    margin-left: 10px;
    font-size: 0.9em;
}

form textarea:focus {
    background-color: #ffffff;
}

form input.checkbox {
    width: auto;
    margin: 0;
}

form input.submit {
    padding: 3px 5px 5px 5px;
    border: 0;
    background-color: #000000;
    color: #ffffff;
    font: normal small-caps normal 1.1em Arial, sans-serif;
    text-transform: lowercase;
    width: auto;
    float: right;
}

form.search input.submit {
    float: none;
}

label {
    font: normal normal normal 1.2em Arial, sans-serif;
    text-transform: capitalize;
    margin: 0;
    width: 400px;
}

form span.hint {
    font-size: .9em;
    position: absolute;
    top: 3px;
    margin-left: 10px;
}

form span.hint a {
    text-decoration: underline;
}

form span.hint2 {
    font-size: .9em;
    font-style: italic;
    position: absolute;
    top: 5px;
    right: 0;
}

form span.hint2 a {
    text-decoration: underline;
}

.twocol_l input {
    width: 301px;
}

.twocol_r input {
    width: 301px;
}

/* drag and drop tabs on settings page */
div.tabs {
    padding: 5px;
    margin-top: 0;
    border: 1px solid black;
    background-color: #ffffff;
}

p.label {
    font: normal normal bold 110% Arial, sans-serif;
}

#faq dt {
    font-weight: bold;
}

#faq dd {
    padding: 5px 0 2em 2em;
}

#innersource {
    background-color: #eeeeee;
    width: 100%;
}

#innersource a {
    text-decoration: none;
}

#innersource pre {
    color: black;
}

#viewsource #innersource {
    overflow: auto;
}

/*#viewsource #innersource * {line-height: normal;}*/
#viewsource .wrap pre {
    white-space: normal;
    padding: 0;
}

/*#viewsource .wrap pre li { min-height: 21px; }*/
#viewsource .nowrap {
    white-space: nowrap;
}

#viewsource ol {
    list-style-type: decimal;
    margin-left: 30px;
    color: black;
}

#viewsource ol li {
    margin-left: 10px;
}

#viewsource a[href ^="http://"] {
    background: none;
    padding-right: 0;
}

#viewsource .sourcenav {
    font-size: .8em;
    padding-bottom: 3px;
}

textarea.copysource {
    font-family: courier, serif;
    width: 100%;
    font-size: 9pt;
}

.noext a[href ^="http://"] {
    background: none;
    padding-right: 0;
}

.error {
    color: red;
}

.alert {
    color: green;
    font-weight: bold;
}

.small {
    font-size: .7em;
    line-height: normal;
}

.de1, .de2 {
    color: darkblue;
}

.kw1 {
    color: green;
}

.kw2 {
    color: green;
}

.kw3 {
    color: blue;
}

.kw4 {
    color: blue;
}

.co1, .co2, .coMULTI {
    color: orange;
}

.br0 {
    color: olive;
}

.st0 {
    color: red;
}

.nu0 {
    color: maroon;
}

.me0 {
    color: darkblue
}

#recommendation {
    font-size: 100%;
}

#recommendation img {
    float: left;
    margin: 0 .5em .3em 0;
}

#related ol {
    margin-bottom: 1.5em
}

div.sidebarcomments p.title {
    font-weight: bold;
    margin-bottom: 0.5em;
}

div.sidebarcomments p.comment {
    overflow: hidden;
    margin-bottom: 0.5em;
    margin-left: 15px;
    font-size: 90%;
}

div.sidebarcomments p.details {
    margin-left: 15px;
    font-size: 75%;
    font-style: italic;
}

ul.listorama {
    margin: 1em 0;
}

ul.listorama li {
    line-height: 1.5em;
    list-style-type: square;
    margin-left: 1em;
}

/* ----------------------------------------------- */
/* Snippet Description and Comment Code Formatting */
/* ----------------------------------------------- */
#maincol .description pre, #maincol dl.comments pre {
    color: #777777;
    font-size: 11px;
    font-family: Monaco, serif;
    line-height: 1.4em;
    background-color: #191919;
    margin: 18px 0 18px 0;
    padding: 10px;
    overflow: auto;
    /* fixes for IE: "overflow: auto" causes unnecessary vertical bar */
    /* corrects bottom scroll bar overlapping */
    overflow-y: hidden;
}

#maincol .description p code, #maincol dl.comments p code {
    padding: 0 2px;
    background: #cccccc;
}

/* styled block */
div.ann {
    position: relative;
    border: 1px solid #b8c5d2;
    background: #f1f3f4;
    padding: 15px;
    height: 80px;
}

div.ann .item {

}

div.ann .item-meta {
    padding-top: 20px;
}

div.ann img {
    float: left;
    margin-right: 15px;
}

div.ann .sponsor {
    position: absolute;
    top: 30px;
    right: 25px;
}

div.ann .sponsor-text {
    float: left;
}

div.ann h4.sponsor-logo {
    display: block;
    background: url(../img/codecanyon-logo-mini.png);
    width: 33px;
    height: 29px;
    text-indent: -9999px;
    float: right;
    margin-top: 5px;
    margin-left: 10px;
}

div.ann a {
    color: #000000;
    background: none;
    padding: 0;
}

div.ann h3.title {
    font-size: 17px;
}

div.ann p.meta {
    font-size: 11px;
}

div.ann p.primary {
    font-size: 15px;
}

div.ann p.secondary, div.ann p.secondary a {
    font-size: 12px;
    color: #9c9c9c;
}

div.ann p.primary, div.ann p.secondary {
    font-style: italic;
    margin: 3px;
    text-align: right;
}

.darkbtn {
    background-color: #000000;
    border: 0 none;
    color: #ffffff;
    font: small-caps 1.1em Arial, sans-serif;
    padding: 3px 5px 5px;
    text-transform: lowercase;
    width: auto;
}

.choices {
    width: 662px;
}


ul.share-buttons {
    list-style: none;
    padding: 0;
}

ul.share-buttons li {
    display: inline;
}

ul.share-buttons .sr-only {
    position: absolute;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

ul.share-buttons img {
    width: 32px;
}

body {
    font: 13px Arial, "Helvetica Neue", Helvetica, sans-serif;
    *font-size: small;
    background-color: #000000;
    font-size: 0.9em;
    letter-spacing: normal;
}

#header .container {
    position: static;
}

.container-fluid {
    min-width: 950px;
}

#maincol.expand {
    margin-right: 0;
    padding: 0;
    border: 0;
    width: auto;;
}


#maincol #frontright.twocol_r_border {
    width: 45%;
}

#maincol #frontleft.twocol_l {
    width: 45%;
}

/*#snippetcomment textarea#comment.inactive {width: 50%;}
#snippetcomment textarea#comment {width: 50%;}*/

h2 {
    font-size: 1.3em;
    font-weight: bold;
}

#header {
    padding-bottom: 5px;
    padding-top: 10px;
}

#header #logo {
    display: block;
    width: 186px;
    height: 53px;
    background: url('../img/snipplr-code2.0.gif') no-repeat 0 0;
}

#header #nav ul {
    width: 720px;
}

#sidecol h2 {
    font-size: 1.4em;
}

ul.languages {
    display: block;
    margin-bottom: 4px;
}

ul.languages li a {
    font-size: 1.0em;
}

#header #nav {
    font-size: 0.9em;
    right: 30px;
    top: 20px;
}

#footernav {
    font-size: 0.9em;
}

body #header #nav ul li ul.secondary {
    bottom: -24px;
}

body #header #nav ul li ul.secondary li {
    font-weight: bold;
}

#subnav {
    font-size: 0.9em;
}

#footernav ul li a,
#subnav ul li a {
    padding: 0 10px;
}

#footernav ul li a.first,
#subnav ul li a.first {
    padding-right: 10px;
}

form div.inputplaceholder {
    padding: 2px 5px;
    margin-bottom: 9px;
    font-size: 1em;
}

form select {
    padding: 2px 5px;
}

form input.submit {
    padding: 2px;
}

#sidecol form input {
    width: 188px;
}

#stripe form {
    top: 0;
}

#stripe p {
    position: static;
}

#stripe {
    height: auto;
    background-position: 0 100%;
}

#stripe {
    padding: 10px 0 14px;
    background: url('../img/stripe-blue.png') repeat-x 0 100%;
}

#stripe form.search input.submit-min {
    width: auto;
    top: -1px;
    background-color: #000000;
    height: 22px;
    padding: 2px 7px;
    font-size: 0.8em;
    text-transform: uppercase;
    font-style: normal;
}

/*#stripe form.search input.submit {
	top: 7px;
	width: 25px;
	height: 25px;
}*/
#footer ul.languages li {
    margin: 0;
}

#advsearch {
    width: 400px;
}

#advsearch form input {
    width: 100%;
    padding: 2px 0;
}

#advsearch form input.submit {
    width: auto;
    padding: 2px;
}

#advsearch form input.checkbox {
    width: auto;
    margin: 0;
}

#answerdiv label {
    display: block;
}

#addwatch {
    width: 450px;
}

label {
    font-size: 1.1em;
}

/* Source code view */
/*------------------*/
/*
	TODO Do more to minify the source code view.
*/
#innersource {
    width: auto;
    font-size: 14px;
}

#maincol .marg,
#sidecol .marg {
    margin-bottom: 10px;
}