/*
iPhone: 320 x 480
Nokia N-Series: 240 x 320
(Can be reversed in landscape mode)
Older Nokias: 176 x 208 to 352 x 416
Blackberries: 160 x 160 to 324 x 352

cool blue for headers: 198,206,238
juicy orange: #f90
brown: rgb(160,82,10)
awesome lilac: rgb(152,102,153)
*/

* {padding:0; margin:0}

html,body,legend {color:rgb(196,201,230); background-color:#808080} /* legend for ie8 otherwise text appears blue! */
body {padding-top:15px; max-width:1256px}

p, br, ol, ul, li, hr, dl, dt, dd, cite, blockquote, th, td, ins, del, div, small, table {
  font-size:13px;
  font-family:Verdana,Tahoma,Arial,Helvetica,sans-serif;
  margin-bottom:16px;
  line-height:20px
}
/* make last p in blockquotes have no gap below it */
blockquote p:nth-last-child(1) {margin-bottom:0}

small {font-size:11px}

form,fieldset {border:none}

input,textarea {
  border:none;
  border-radius:10px;
  padding:5px;
  opacity:0.8;
  width:97%
}
input[name="submit"], #archives input, #demos input {width:auto}
input:hover,textarea:hover {opacity:1}

#disclaimer img {margin-bottom:0}
#main ol li img, .smilie {margin:0!important; outline:none!important} /* smilies */

#quotes {margin-top:32px}

br {margin-bottom:0} /* for Firefox */

td {vertical-align:top}

#more *, #more2 * {font-size:12px}
#disclaimer * {font-size:11px}

h1,h2,h3,h4,h5,h6 {
  margin-bottom:16px;
  line-height:18px;
  font-family:Georgia,'Times New Roman',Times,serif;
  font-weight:bold;
  color:rgb(221,206,188)
}
h2 {
  font-size:24px;
  line-height:24px;
  letter-spacing:1px
}
#index h2 {line-height:30px}
body.post h2 {margin-bottom:8px}
h3 {
  clear:both;
  font-size:19px;
  text-align:center;
  background-color:#7A9B76;
  border-radius:50px;
  padding:10px
}
#main h3 {background-color:#8A3B76}
#disclaimer h3 {background-color:#7A3B76}
h4, h4 cite {font-size:18px!important}
h5 {font-size:17px}
h6 {font-size:16px}
#more h3, #more2 h3 {font-size:21px}
#more h4, #more2 h4 {font-size:19px}
#more h5, #more2 h5 {font-size:18px}
#more h6, #more2 h6 {font-size:17px}
#comments h3 {font-size:20px}
#disclaimer h3 {font-size:22px}
#design #main h3 {padding-top:16px}

#comments {clear:both}

#main ul li {margin-left:37px}
#main ol li {margin-left:40px} /* allow for numbers over 100 - search results code reduces this accordingly! */
#main ol.code li {margin-left:50px}

#main li {margin-bottom:8px}

#more ol li, #more2 ol li {margin-left:32px; margin-bottom:6px}
#more ul li, #more2 ul li {margin-left:12px; margin-bottom:6px}

blockquote, .codeblock, #comments ol li {
  margin-left:0;
  background-color:rgb(125,80,102)!important;
  border-radius:20px;
  padding:16px;
  overflow:auto
}
blockquote p {background-color:rgb(125,80,102)!important}
.codeblock code, .codeblock var, .codeblock code strong, ol.code li code, ol.code li var {font-size:12px}

/* larger size for code in text */
code, code strong, var {
  background-color:rgb(125,80,102);
  font-size:13px;
  font-family:'Lucida Console','Monaco','Courier New',Courier,monospace;
  color:#eee
}
#comments code {color:rgb(206,221,240)}
var {color:#edb}

#main ol.code li {border-bottom:1px dashed #bbb; padding:4px}
ol.nogaps li, ul.nogaps li, dl.nogaps li, #main ol.code li {margin-bottom:0}

dt {font-weight:bold; margin-bottom:0}
dd {margin-left:23px}

#main hr, #more hr, #more2 hr {
  clear:both;
  margin-top:16px;
  height:1px;
  background-color:#999;
  border:none
}

abbr {cursor:help; border-bottom:1px dotted #fff}

#column1, #column2 {
  min-width:200px;
  float:left;
  height:auto;
  padding:2%;
  margin-top:35px;
  margin-bottom:0;
  border:10px solid #bbb;
  width:44%
}

#column1 {padding:0; left:0; margin-left:3%; z-index:2}
#column2 {margin-left:-10px; padding:0; z-index:1}

#main, #main p {background-color:rgb(105,60,82)}
#main, #disclaimer, #more, #more2 {padding:6% 6% 4% 6%; margin:0}

/* #more2 {border-top:10px solid #bbb; left:780px} */

#more, #more p {background-color:rgb(75,100,82)}
/* #more2, #more2 p {background-color:rgb(60,100,182)} */

#disclaimer {border-top:10px solid #bbb}
#disclaimer, #disclaimer p {background-color:rgb(65,75,103)}

#base {clear:both}

#main #lastupdated {padding-top:16px}


/* LINKS */

:link,:visited {
  color:rgb(90,90,90);
  text-decoration:none;
  border-radius:50px 0;
  padding:2px 8px
}

:link {background-color:rgb(178,208,166)!important}
:visited {background-color:rgb(218,176,188)!important}
:link:hover, :visited:hover {background-color:rgb(148,196,218)!important}

/*
:link, :link * {background-color:rgb(178,208,166)!important}
:visited, :visited * {background-color:rgb(218,176,188)!important}
:link:hover, :link:hover *, :visited:hover, :visited:hover * {background-color:rgb(148,196,218)!important}
*/

/* MENU */

#topmost {height:10px; width:auto}

#menu {text-align:center; padding:5px 10px}
#menu div {display:inline; text-align:right; letter-spacing:3px}
#menu div :link, #menu div :visited {
  border-radius:0;
  padding:5px 12px;
  color:#eee;
  background-color:#999!important
}
#menu div, #menu {margin-bottom:0}

#menu * {
  font-family:Verdana,Tahoma,Arial,Helvetica,sans-serif;
  font-size:14px;
  text-decoration:none
}

/* style link to match page */
#index #menu1 :link, #index #menu1 :visited, #demos #menu2 :link, #demos #menu2 :visited, #archives #menu3 :link, #archives #menu3 :visited, #portfolio #menu4 :link, #portfolio #menu4 :visited, #links #menu5 :link, #links #menu5 :visited {
  color:#666;
  background-color:#ccc!important;
  padding-top:10px;
  padding-bottom:10px
}

#menu :link:hover, #menu :visited:hover {color:#ccc; background-color:#666!important}

a abbr {text-decoration:none} /* for Firefox */

#main .bigbutton {
  margin:32px auto;
  text-align:center
}


/* CLASSES ETC */

.advert {font-size:11px}

.center {text-align:center}

.clear {clear:both!important}

.columns img {width:100%!important; max-width:200px}
.columns {clear:both}

.date, .postdate, #lastupdated {color:#96c6c6}
#main .date, #main .postdate, #main #lastupdated {color:#d6a6b6}

.desc :link, .desc :visited, .desc, .description, .description cite {
  font-family:Georgia,'Times New Roman',Times,serif;
  font-size:16px
}
.desc, .description {font-style:italic; color:rgb(231,198,216)}

.indent {margin-left:15px}

a img {border:none!important; margin-bottom:0}
:link:hover img, :visited:hover img {border:none!important}

.floatallowance {margin-bottom:-16px} /* for floated columns to line up when floated above each other in a narrow width */

.floatleft {float:left}
.floatright {float:right}

/* fix */

.image, .imagefloatright, .gap, .gapfloatright {
  float:left;
  margin:3px 18px 16px 0;
  display:inline-block;
  padding:0
}
.imagefloatright, .gapfloatright {
  float:right;
  margin:3px 0 16px 18px
}

.inlinelist li {
  list-style-type:none;
  display:inline-block;
  margin-left:10px!important
}

/* must set width or height for above code to work */
.thumb70x47 {width:70px; height:47px}
.thumb70x53 {width:70px; height:53px}
.thumb70x62 {width:70px; height:62px}
.thumb70x66 {width:70px; height:66px}
.thumb70x70 {width:70px; height:70px}
.thumb70x108 {width:70px; height:108px}

.thumb100x40 {width:100px; height:40px}
.thumb100x65 {width:100px; height:65px}
.thumb100x65 {width:100px; height:65px}
.thumb100x69 {width:100px; height:69px}
.thumb100x75 {width:100px; height:75px}
.thumb100x80 {width:100px; height:80px}
.thumb100x100 {width:100px; height:100px}
.thumb100x109 {width:100px; height:109px}
.thumb100x116 {width:100px; height:116px}

.thumb130x75 {width:130px; height:75px}

.thumb200x95 {width:200px; height:95px}
.thumb200x141 {width:200px; height:141px}
.thumb200x150 {width:200px; height:150px}
.thumb200x160 {width:200px; height:160px}
.thumb200x285 {width:200px; height:285px}

.thumb473x371 {width:473px; height:371px}



/* .gallery {margin:0 auto; margin-left:5%} */

.leftside, .rightside {
  float:left;
  width:44%;
  padding:3%;
  max-width:200px;
  font-size:12px
}
.rightside {float:right}

.nobottommargin {margin-bottom:0}

.nobullet {list-style-type:none}

.noborder {border:none}

.nommargin {margin:0}

.overflow {overflow:auto}

.stretch {width:100%; height:auto}  /* USE FOR LARGE IMAGES IN POSTS! */

/* code indents */
#column1 #main li.s1 {padding-left:20px}
#column1 #main li.s2 {padding-left:40px}
#column1 #main li.s3 {padding-left:60px}
#column1 #main li.s4 {padding-left:80px}
#column1 #main li.s5 {padding-left:100px}
#column1 #main li.s6 {padding-left:120px}


/* LASTLY */

#archives form, #demos form {margin-bottom:16px}

#autoquotes-demo .q {background-color:#5A55C7}
#autoquotes-demo .lit {background-color:#C84A97}

#demos-browsers h4#any, #demos .linkstodemos, #archives .linkstoposts {margin-top:32px}

#pastlayouts .imagebox {float:left; width:150px; height:150px; margin-left:10px}

#results #foundtext {margin-bottom:24px}

#sidelinks #sidelinkstable td {padding:4px; background-color:#000}
#sidelinks #sidelinkstable th {padding-right:4px}
