/* =Repeatable patterns
-------------------------------------------------------------- */
img {
  width: auto\9 ;
  height: auto;
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
}

.graphics img,
.logo img {
  margin: 0px;
  padding: 0px;
}

.graphics table h2 {
  padding-top: 5px;
}

a.logo:hover img {
  box-shadow: 0 0 10px #000;
}

.logo img {
  max-width: 240px;
}

.log {
  display: none;
}

ul.friendly,
ul.bullets,
ul.no-bullets {
  margin-left: 0px;
  margin-top: 0px;
  margin-bottom: 10px;
  padding-left: 0px;
}

li {
  margin-top: 5px;
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  line-height: 1.6;
}

li:last-child {
  margin-bottom: 0px;
}

ol {
  list-style-type: number;
  padding-left: 5px;
}

ul.bullets {
  margin-left: 20px;
}

ul.bullets > li {
  list-style-type: disc;
}

ul.no-bullets {
  list-style-type: none;
  margin-left: 0px;
}

ul.compact {
  margin: 10px 0px 15px 20px;
}

.graphics table {
  width: 100%;
}
.graphics table a:hover img {
  box-shadow: 0 0 10px #000;
}
.graphics table td {
  display: block;
  float: left;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 30px;
}
.graphics table img {
  margin: 0px;
}

.home .graphics table td {
  font-size: 18px;
}

ul.friendly {
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 5px;
  margin-bottom: 5px;
}
ul.friendly li {
  list-style-type: none;
  margin-bottom: 15px;
  padding-top: 5px;
  padding-bottom: 5px;
}

ul.bullets.compact li {
  list-style-type: disc;
  margin: 5px 0px 0px 10px;
}

ul.friendly.bullets li {
  display: list-item;
  list-style-type: disc;
  margin-left: 20px;
}

ul.friendly.expanded {
  display: block;
  padding: 0px;
  padding-top: 10px;
}
ul.friendly.expanded li {
  list-style-type: none;
  display: block;
  margin: 0px;
}

footer.entry-meta {
  display: none;
}

form {
  margin-bottom: 0px;
}

dt {
  margin-top: 15px;
}

.uppercase {
  text-transform: uppercase !important;
}

.lowercase {
  text-transform: lowercase !important;
}

.center {
  text-align: center;
}

.paddedsmall {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.widestuff.padded,
.padded {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

#mycanvas {
  width: 280px;
  height: 380px;
}

.pretty {
  font-weight: bold;
  color: #339966;
}

.emph, .ugly, .flag {
  font-weight: bold;
}

.ugly {
  color: #ff0000;
}

.flag {
  color: #880088;
}

pre,
code {
  margin-top: 15px;
  margin-bottom: 15px;
  width: auto;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-top: 3px solid #bbcccc;
  border-bottom: 3px solid #bbcccc;
  border-radius: 0px;
  border-radius: 10px;
  border-left: 3px solid #bbcccc;
  border-right: 3px solid #bbcccc;
  font-family: Courier, sans-serif, Consolas, Menlo, Monaco, Lucida Console;
  font-size: 13px;
  color: #000;
  background: #fbfbfb;
  white-space: normal;
}

blockquote {
  border-left: 5px solid #993311;
  margin-left: 5px;
  margin-top: 15px;
  padding-left: 15px;
}
blockquote p {
  font-weight: 400;
  font-size: 21px;
  line-height: 1.6;
  letter-spacing: initial;
}

blockquote#demo {
  font-size: 24px;
}

a img {
  border: 0;
}

.resize img,
img.resize {
  width: 100%;
}

.no-resize img,
img.no-resize,
.avatar {
  width: auto;
}

/* Clearing floats */
.clear:after {
  clear: both;
}

.clear:before,
.clear:after {
  display: table;
  content: "";
}

.myname {
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  white-space: nowrap;
  font-size: 18px;
  letter-spacing: 5.4px;
  padding-top: 10px;
  line-height: 1.2;
}

.site-description {
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 1.2px;
  color: #000;
  white-space: nowrap;
  padding-top: 5px;
  line-height: 1.2;
}

.writer,
.artist {
  padding-right: 3px;
}

.goof {
  white-space: nowrap;
}

.more,
footer {
  font-size: 16px;
  line-height: 1.2;
}

footer a {
  letter-spacing: 2.5px;
  padding-left: 5px;
}

.dev {
  letter-spacing: 1px;
}

.sidebar {
  clear: both;
  text-align: left;
  padding-top: 40px;
}
.sidebar h2.widget-title {
  text-transform: uppercase;
  font-size: 11px;
}

footer {
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  clear: both;
}

.sidebarcontent {
  display: block;
  width: 240px;
}

.pagestuff .pagestuff {
  padding-left: 0px;
  padding-right: 0px;
}

.index .footerdetails,
.slide .footerdetails,
.category .footerdetails {
  display: none;
}
.index .sidebar footer,
.slide .sidebar footer,
.category .sidebar footer {
  display: block;
}
.index .more,
.slide .more,
.category .more {
  display: none;
}

.category.slide .wide,
.category.slide .widestuff {
  padding-left: 0px;
  padding-right: 0px;
}

.slide .sidebarcontent {
  float: none;
}

.slide .itemscope,
.category .pagestuff,
.slide .pagestuff {
  padding-left: 30px;
  padding-right: 30px;
}

.pagestuff .pagestuff {
  padding-left: 0px;
  padding-right: 0px;
}

.pagestuff {
  padding-bottom: 5px;
}

.content .widestuff,
.category .widestuff {
  padding-left: 0px;
  padding-right: 0px;
}

div.group {
  padding-top: 5px;
  padding-bottom: 15px;
}

div.group div.floater {
  padding-top: 30px;
  padding-bottom: 30px;
  float: left;
  width: 45%;
  padding-right: 5%;
}

div.iterator {
  max-width: 1024px;
  padding-top: 10px;
  padding-bottom: 15px;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 0px;
  margin: 0px;
}

div.iterator div.image {
  font-size: 15px;
  vertical-align: top;
  display: inline-block;
  width: 50%;
}

div.image a {
  padding-left: 0;
  padding-right: 16%;
  display: block;
}
div.image a:hover img {
  box-shadow: 0 0 10px #000;
}

.row-fluid [class*=span] {
  min-height: 0px;
}

.thirds {
  position: relative;
  margin: 0 auto;
  width: 100%;
}
.thirds img {
  width: 100%;
  height: 100%;
}

.thirds:hover:before, .thirds:hover:after {
  position: absolute;
  background: rgba(255, 255, 255, 0.75);
  content: "";
}

.thirds:before {
  top: 33.33%;
  left: 0;
  width: 100%;
  height: 3px;
  box-shadow: 0 15rem 0 rgba(255, 255, 255, 0.75);
}

.thirds:after {
  top: 0;
  left: 33.33%;
  width: 3px;
  height: 100%;
  box-shadow: 22rem 0 0 rgba(255, 255, 255, 0.75);
}

.site-navigation {
  padding-top: 30px;
}

div.large img {
  display: block;
  padding: 30px 0px 40px 0px;
  max-width: 700px;
}

aside, widget {
  padding: 0px;
  margin: 0px;
}

hr {
  background-color: rgba(0, 0, 0, 0.2);
  border: 0;
  height: 1px;
  margin-bottom: 23px;
}

/* Text elements */
div, section {
  margin-bottom: 0px;
  padding-bottom: 0px;
  padding-top: 0px;
}

p {
  padding-bottom: 15px;
  padding-top: 5px;
  margin-bottom: 0px;
  margin-top: 0px;
}

dt {
  font-weight: bold;
}

b, strong {
  font-weight: bold;
}

dfn, cite, em, i {
  font-style: italic;
}

mark, ins {
  background: #fff9c0;
  text-decoration: none;
}

sup,
sub {
  font-size: 75%;
  height: 0;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  bottom: 1ex;
}

sub {
  top: 0.5ex;
}

small {
  font-size: 75%;
}

big {
  font-size: 125%;
}

figure {
  margin: 0;
}

th {
  font-weight: bold;
}

table {
  padding: 0px;
  margin: 0px;
  border-collapse: collapse;
}

tr {
  vertical-align: top;
}

.keywords td, .keywords th {
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
}
.keywords table {
  width: 100%;
}
.keywords ol, .keywords ul {
  margin-left: 0px;
}
.keywords tbody tr {
  border-bottom: 1px solid #333;
}
.keywords thead th {
  cursor: pointer;
  background: #666;
  color: #fff;
  border-bottom: 2px solid #fff;
  text-align: center;
}
.keywords td {
  color: #000;
}
.keywords th {
  font-weight: bold;
}
.keywords td, .keywords th {
  display: block;
}

input#mce-EMAIL {
  width: 100%;
}

/* All input */
.button,
textarea,
select,
input,
input[type=password],
input[type=text],
input[type=email],
.menu-toggle,
input[type=submit],
input[type=button],
input[type=reset] {
  height: 30px;
  line-height: 1.6;
  padding: 6px 12px;
  margin-top: 5px;
  margin-bottom: 15px;
  display: inline-block;
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: 21px;
  color: #000;
  text-decoration: none;
}

.entry-content input, .entry-content textarea {
  width: 95%;
}

select {
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: 21px;
  height: 40px;
}

.styled-select option {
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: 21px;
}

.error {
  color: #993311;
}

.button,
input[type=submit],
input[type=button],
input[type=reset] {
  width: auto;
  height: auto;
  font-weight: normal;
  color: #555;
  background-color: #e6e6e6;
  background-repeat: repeat-x;
  background-image: -moz-linear-gradient(top, #f4f4f4, #e6e6e6);
  background-image: -ms-linear-gradient(top, #f4f4f4, #e6e6e6);
  background-image: -webkit-linear-gradient(top, #f4f4f4, #e6e6e6);
  background-image: -o-linear-gradient(top, #f4f4f4, #e6e6e6);
  background-image: linear-gradient(top, #f4f4f4, #e6e6e6);
  border: 1px solid #888888;
  text-decoration: none;
  border-radius: 3px;
}

.button:hover,
button:hover,
input[type=submit]:hover,
input[type=button]:hover,
input[type=reset]:hover {
  color: #000;
  text-decoration: none;
  background-color: #ddd;
  background-repeat: repeat-x;
  background-image: -moz-linear-gradient(top, #ccc, #ddd);
  background-image: -ms-linear-gradient(top, #ccc, #ddd);
  background-image: -webkit-linear-gradient(top, #ccc, #ddd);
  background-image: -o-linear-gradient(top, #ccc, #ddd);
  background-image: linear-gradient(top, #ccc, #ddd);
}

button:active,
input[type=submit]:active,
input[type=button]:active,
input[type=reset]:active {
  color: #757575;
  background-color: #e1e1e1;
  background-repeat: repeat-x;
  background-image: -moz-linear-gradient(top, #ebebeb, #e1e1e1);
  background-image: -ms-linear-gradient(top, #ebebeb, #e1e1e1);
  background-image: -webkit-linear-gradient(top, #ebebeb, #e1e1e1);
  background-image: -o-linear-gradient(top, #ebebeb, #e1e1e1);
  background-image: linear-gradient(top, #ebebeb, #e1e1e1);
}

/* Reset non-text input types */
input[type=checkbox],
input[type=radio],
input[type=file],
input[type=hidden],
input[type=image],
input[type=color] {
  border: 0;
  border-radius: 0;
  padding: 0;
}

textarea {
  overflow: auto;
  /* Removes default vertical scrollbar in IE6/7/8/9 */
  padding: 10px;
  vertical-align: top;
  /* Improves readability and alignment in all browsers */
  width: 95%;
}

#infovis {
  position: relative;
  margin: auto;
  overflow: hidden;
  height: 500px;
}

a {
  color: #007788;
  cursor: pointer;
  font-weight: 600;
  text-decoration: none;
}

p, section, li, .itemscope {
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
}

h1 > a, h2 > a, h3 > a, h4 > a, h5 > a, ul > a, p > a, section > a, li > a {
  text-decoration: none;
}

h1 > a, h2 > a, h3 > a, h4 > a, h5 > a, p > a, section > a, li > a {
  text-decoration: none;
}
h1 > a:hover, h2 > a:hover, h3 > a:hover, h4 > a:hover, h5 > a:hover, p > a:hover, section > a:hover, li > a:hover {
  text-decoration: underline;
}

a:visited {
  color: #007788;
}

a:hover,
a:focus,
a:active {
  color: #000000;
  text-decoration: none;
}

a div,
a img {
  border: none;
}

a.button {
  color: #555;
}

/* Alignment */
.alignleft {
  display: inline;
  float: left;
  margin-right: 24px;
  margin-right: 2.4rem;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 24px;
  margin-left: 2.4rem;
}

.aligncenter {
  clear: both;
  display: block;
  margin: 0 auto;
}

/* Text meant only for screen readers */
.assistive-text {
  clip: rect(1px 1px 1px 1px);
  /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
}

/* =Structure
----------------------------------------------- */
html, body, #wrapper {
  height: auto !important;
  -webkit-overflow-scrolling: touch;
  width: auto !important;
  overflow-x: hidden !important;
  margin: 0px;
  padding-right: 0px;
  padding-left: 0px;
  font-size: 21px;
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
  line-height: 1.6;
  color: #555;
}

.widestuff {
  max-width: 1024px;
}

.colorstuff {
  max-width: 900px;
}

.colors.body {
  background-color: #fafafa;
}

.colors #nav {
  padding-top: 3px;
  padding-bottom: 3px;
}

.colors #description::first-letter {
  text-transform: capitalize;
}

#wrapper {
  position: relative;
  min-width: 280px;
}

body,
button,
input,
select,
textarea {
  font-weight: 400;
}

img.slide,
.slide img {
  padding: 0px;
  margin: 0px;
  margin-top: 10px;
}

.site-info {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1.8461538461;
  margin: 0 4.85436893%;
  padding: 24px 0;
  padding: 2.4rem 0;
}

.social ul {
  width: 264px;
  margin-top: 5px;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 10px;
  padding: 0px;
}
.social ul li {
  margin: 0px;
  display: inline-block;
  width: 20%;
  padding: 0px;
  line-height: 1.2;
}
.social ul a img {
  width: 26px;
  height: 26px;
}
.social ul a:hover {
  opacity: 0.7;
}

.red {
  color: #993311;
}

.orange {
  color: #cF9911;
}

.home a.navhome,
.sales a.navsales,
.colors a.navcolor,
.colorpage a.navcolor,
.design a.navdesign,
.blog a.navblog,
.technology a.navtechnology,
.photos a.navphotos,
.drawings a.navdrawings,
.writing a.navwriting,
.paintings a.navpaintings {
  font-weight: 600;
  color: #000;
  border-left: 8px solid #cF9911;
}

.mainnavigation {
  width: 100%;
  margin: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  display: block;
  position: fixed;
  z-index: 9999998;
  top: 0px;
  background: #fff;
  border-bottom: 3px solid #ccc;
}
.mainnavigation ul {
  margin-left: 0px;
  padding-left: 0px;
  width: 100%;
  max-width: 1114px;
  margin: 0px auto;
  display: table;
  list-style: none;
  padding-top: 9px;
  padding-bottom: 9px;
}
.mainnavigation li {
  width: 33%;
  display: block;
  float: left;
  margin: 0px;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: center;
  letter-spacing: 1px;
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  font-size: 12px;
  line-height: 1;
}
.mainnavigation a, .mainnavigation a:visited, .mainnavigation a:link {
  font-weight: 600;
  display: inline-block;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  padding-right: 0px;
  padding-bottom: 0px;
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  font-size: 12px;
  line-height: 12px;
  letter-spacing: 1px;
  padding-top: 0px;
  padding-left: 5px;
  margin-left: 3px;
}

.colornavigation {
  width: 100%;
  display: block;
}
.colornavigation ul {
  margin-left: 0px;
  padding-left: 0px;
  width: 100%;
  display: table;
  list-style: none;
  margin: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}
.colornavigation li {
  padding-top: 0px;
  padding-bottom: 5px;
  padding-right: 12px;
  margin: 0px;
  display: block;
  float: left;
  text-align: center;
  line-height: 1;
}
.colornavigation a, .colornavigation a:visited, .colornavigation a:link {
  font-weight: 600;
  display: inline-block;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  padding-right: 0px;
  padding-bottom: 0px;
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  font-size: 9.5px;
}

h1, h2, h3, h4, h5, h6 {
  clear: both;
  padding-top: 25px;
  padding-bottom: 5px;
  margin: 0px;
  font-weight: 400;
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
  color: #111;
  line-height: 1.2;
  font-size: 28px;
}

h1 {
  font-size: 40px;
}

h2.site-title {
  font-size: 35px;
}

h3, h4, h5, h6 {
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
  padding-top: 20px;
  color: #111;
  font-size: 21px;
}

h3 {
  font-size: 24px;
}

h5,
.friendly h2 {
  font-size: 24px;
}

h5, .friendly h2 {
  display: block;
  font-weight: normal;
  color: default;
  padding: default;
  font-family: default;
}

.monsters.verysmall {
  font-size: 40px;
}

.monsters.smallest {
  font-size: 50px;
}

.monsters.small {
  font-size: 80px;
}

.monsters.large {
  font-size: 120px;
}

nav.breadcrumbs {
  padding-bottom: 10px;
}
nav.breadcrumbs p::first-letter {
  text-transform: uppercase;
}

h2.subtitle {
  margin-top: 0px;
  padding-top: 0px;
  font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: 19px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  display: block;
  line-height: 18px;
}
h2.subtitle a {
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  text-decoration: none;
  font-size: 0.7em;
  font-weight: 600;
}

h2.large {
  padding-top: 0px;
  font-size: 2em;
}

.topics {
  margin: 20px 0px 20px 0px;
  padding: 0px 150px 0px 0px;
}

.content .narrow {
  background-color: transparent;
}

.color a:hover {
  color: #007788;
  text-decoration: none;
}
.color a:hover.boxlink {
  border: 1px solid #bbb;
}
.color .boxlink {
  font-weight: 600;
  color: #000;
  width: 130px;
  height: 140px;
  border: 1px solid #bbb;
  padding: 0px;
  background-color: #ffffff;
}
.color .boxlink .box {
  border: none;
  border-bottom: 1px solid #bbb;
  padding: 0px;
  margin: 0px;
  height: 65px;
  width: auto;
}
.color .boxlink .hex,
.color .boxlink .name {
  line-height: 14px;
  font-size: 14px;
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  letter-spacing: 0px;
  padding: 5px 5px 0px 10px;
}
.color .boxlink .hex {
  display: block;
}
.color .boxlink .name {
  clear: left;
  display: block;
}
.color .boxlink .quality {
  clear: left;
  display: block;
  padding-top: 5px;
}

.special-hover.boxlink {
  box-shadow: 0 0 10px #fff;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 20px;
}

.special-hover.boxlink:hover {
  box-shadow: 0 0 10px #aaa;
}

.special-hover a img {
  box-shadow: 0 0 10px #000;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 20px;
  margin-right: 20px;
}

.special-hover a img:hover {
  box-shadow: 0 0 10px #fff;
}

.special-hover a img {
  box-shadow: 0 0 10px #000;
  /*
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;
  */
}

.special-hover a img:hover {
  box-shadow: 0 0 10px #fff;
}

.border {
  border: 1px solid #ccc;
}

.shaded {
  background-color: #ddd;
  font-weight: 600;
  padding: 9px 30px;
  margin: 5px 0px;
}

.centered {
  margin: 0px auto;
  text-align: center;
}
.centered img {
  margin: 0px auto;
}

.toggler {
  padding: 0 20px;
  max-width: 550px;
}

.twitter-32, .youtube-32, .wordpress-32, .vimeo-32, .pinterest-32, .paypal-32, .linkedin-32, .instagram-32, .googleplus-32, .flickr-32, .facebook-32, .email-32 {
  background: url(/images/icons/32x32/sprites.png) no-repeat;
  display: inline-block;
}

.twitter-32 {
  background-position: 0 0;
  width: 32px;
  height: 32px;
}

.youtube-32 {
  background-position: -35px -2px;
  width: 32px;
  height: 32px;
}

.wordpress-32 {
  background-position: -69px -1px;
  width: 32px;
  height: 32px;
}

.vimeo-32 {
  background-position: -104px -2px;
  width: 32px;
  height: 32px;
}

.pinterest-32 {
  background-position: -140px -1px;
  width: 32px;
  height: 32px;
}

.paypal-32 {
  background-position: -174px -1px;
  width: 32px;
  height: 32px;
}

.linkedin-32 {
  background-position: -208px -2px;
  width: 32px;
  height: 32px;
}

.instagram-32 {
  background-position: -243px 0;
  width: 32px;
  height: 32px;
}

.googleplus-32 {
  background-position: -276px 0;
  width: 32px;
  height: 32px;
}

.flickr-32 {
  background-position: -310px 0;
  width: 32px;
  height: 32px;
}

.facebook-32 {
  background-position: -378px -2px;
  width: 32px;
  height: 32px;
}

.email-32 {
  background-position: -344px -2px;
  width: 32px;
  height: 32px;
}

.hide-text {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

/* IE7 */
.break {
  clear: both;
}

.perfect-padding {
  margin: 0px 20px 20px 0px;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

footer {
  margin-bottom: 100px;
}

.bottoms {
  vertical-align: bottom;
}

textarea {
  height: 100px;
}

textarea.code {
  font-family: Courier, sans-serif, Consolas, Menlo, Monaco, Lucida Console;
  margin-bottom: 10px;
  background-color: #eee;
  overflow: auto;
  width: auto;
  padding: 5px;
  font-size: 11px;
}

img.typekit-badge {
  display: none;
}

.icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  background-image: url("/images/glyphicons-halflings.png");
  background-position: 14px 14px;
  background-repeat: no-repeat;
  opacity: 1;
}

.icon-map-marker {
  background-position: -24px -72px;
}

.icon:hover {
  background-image: url("/images/glyphicons-halflings-hover.png");
}

.simple {
  background: #fff;
}

.bonnevie_logo {
  cursor: pointer;
}

body.descendants {
  font-size: 18px;
}

body.ancestors {
  color: #666;
  background: url("/bonnevie/backgrounds/wallpaper2-back.jpg");
  padding: 20px;
}

b, strong {
  font-weight: 600;
}

li a.here {
  text-decoration: none;
  color: #000000;
}

ol.navextra {
  padding-bottom: 20px;
}

.addthis_toolbox {
  margin: 10px 0px 20px;
}

div.form {
  margin: 30px 0px;
}

div.wpcf7-response-output {
  margin: 0px !important;
}

img.ajax-loader {
  width: 16px;
  height: 16px;
}

.watercolors #content img {
  max-width: 400px;
}

.celtic {
  color: #000;
}

a:link .celtic,
a:link .monsters,
a:visited .celtic,
a:visited .monsters {
  color: #000000;
}
a:link .red,
a:visited .red {
  color: #993311;
}

a:hover .celtic,
a:hover .monsters,
a:focus .celtic,
a:focus .monsters,
a:active .celtic,
a:active .monsters {
  color: #007788;
}

em {
  font-style: italic;
}

.caption,
.mousetype {
  display: block;
  font-size: 19px;
  padding-top: 5px;
  padding-bottom: 15px;
  font-style: italic;
}

#chart-1001 {
  margin: 0px auto;
}

.bonnevie .main-body {
  background-color: transparent;
}

.simple .main-body {
  padding: 10px;
  margin-top: 32px;
}

.main-body {
  position: relative;
  margin: 0px auto;
  word-wrap: break-word;
  text-align: left;
}

.clearer {
  clear: both;
}

.box {
  width: 100px;
  height: 100px;
  display: block;
  border: 2px solid #bbb;
  padding: 0px 0px 0px 0px;
  margin-right: 10px;
}

/*
.color {
  width: auto;
  display: block;
  margin-bottom: 20px;
}
*/
a.mypalette {
  text-decoration: none;
  font-size: 14px;
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  letter-spacing: 0px;
  float: left;
  padding: 0px;
  display: block;
  width: 14.28%;
}
a.mypalette:hover .palettebox {
  opacity: 0.9;
  color: #007788;
  text-decoration: none;
}
a.mypalette {
  color: #000000;
}
a.mypalette span {
  margin: 0px;
  padding: 10px;
  padding-top: 5px;
  display: none;
}
a.mypalette .palettebox {
  height: 100px;
  width: 100%;
  padding: 0px;
  margin: 0px;
  display: block;
}

a .box,
a:hover .box {
  cursor: pointer;
}

.boxlink {
  width: 100px;
  height: 180px;
  display: block;
  float: left;
  position: relative;
  padding: 0px 20px 20px 0px;
}
.boxlink img_label {
  font-size: 14px;
}

.element {
  background: #fff;
  width: 110px;
  height: 170px;
  margin: 0px 10px 5px 0px;
  padding: 0px;
  float: left;
  position: relative;
  color: #333;
  font-size: 20px;
  line-height: 20px;
}

.metabox {
  margin: 10px 10px 5px 0px;
  padding: 10px;
  color: #333;
  font-size: 15px;
  line-height: 17px;
}

.img_label {
  display: block;
  letter-spacing: 0.5px;
  line-height: 1;
  font-size: 14px;
  font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
  padding: 10px 0px 20px 3px;
  text-decoration: none !important;
}

a:hover div.img_label {
  text-decoration: none !important;
}

* html .thumb-container {
  height: 1px;
}

.break {
  clear: both;
}

.square {
  height: 120px;
  width: 75px;
  float: left;
  margin: 0px 5px;
  padding: 3px;
  text-align: center;
  font-size: 10px;
}

.img, img {
  vertical-align: middle;
  border: none;
}

.share {
  float: left;
  padding-left: 20px;
}

.num-images {
  float: right;
  padding-right: 20px;
}

.float-right {
  float: right;
}

.float-left {
  float: left;
}

.widead {
  float: left;
  width: 180px;
  padding-right: 10px;
}

.sociable ul li a img {
  width: 64px;
  height: 64px;
}

.sociable-hovers {
  float: left;
  padding: 0px 0px 0px 0px;
  border: none;
  margin: 10px 10px 0px 0px;
}

.emphasis {
  color: #cc8800;
}

.highlight {
  font-weight: bold;
  color: #cc8800;
}

.boxtitle {
  padding: 0px 15px 35px 0px;
}

.crumb {
  position: relative;
  float: left;
  padding: 4px 0px 5px 0px;
}

.youarehere {
  padding: 3px 0px 0px 0px;
}

.small {
  font-size: 10px;
}

.verysmalltitle {
  position: relative;
  float: left;
  padding: 4px 0px 5px 0px;
}

li.subhead {
  font: 130% "Trebuchet MS", Trebuchet, Arial, Verdana, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  padding: 20px 20px 0px 0px;
  text-decoration: none;
  border-bottom: 1px solid #ffcc00;
  text-decoration: none;
  font-weight: bold;
  text-align: left;
}

.inset {
  width: 216px;
}

.narrowinset {
  width: 216px;
}

ul.bullet, ul.bullet li {
  list-style-type: disc;
  margin: 10px 10px 10px 0px;
}

.transcript {
  font-size: 16px;
  padding-left: 30px;
}

.rightside {
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.standard {
  width: 100%;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.on {
  background-color: #00404A;
}

.off {
  background-color: #00505A;
}

.emphasis {
  text-decoration: none;
  font-weight: bold;
}

u {
  text-decoration: none;
}

a.note:hover {
  text-decoration: none;
  color: red;
}

.break {
  clear: both;
}

.add {
  font-weight: bold;
  color: #115533;
  padding: 0px 10px 10px 0px;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
  border-color: 666666;
}

#wrapper {
  margin: 0px;
  width: auto;
}

.swipe {
  position: relative;
  display: block;
}

.swipe a:hover {
  color: #ffcc00;
}

img.design {
  width: 100%;
  max-width: 220px;
}

.about {
  margin-bottom: 60px;
}

ul.portfolio li {
  width: 25%;
}

ul.demos {
  width: 100%;
}
ul.demos li {
  padding-left: 5px;
  padding-right: 5px;
}

.technology #container {
  height: 350px;
}

ul.portfolio, ul.demos, ul.category-nav, ul.nav {
  width: auto;
  display: block;
  position: relative;
  list-style: none;
}
ul.portfolio li, ul.demos li, ul.category-nav li, ul.nav li {
  list-style: none outside none;
  float: left;
  text-align: center;
  margin: 0;
  padding: 0;
}
ul.portfolio li a, ul.demos li a, ul.category-nav li a, ul.nav li a {
  margin: 0px auto;
  display: block;
}

ul.category-nav {
  padding: 0px;
  margin: 0px;
  font-size: 100%;
}
ul.category-nav li:first-child {
  padding-right: 30px;
}

ul.demos {
  max-width: 800px;
  margin: 0;
  padding: 0;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.folder {
  text-transform: lowercase;
}

.tablet {
  display: none;
}

.demos ul li {
  width: 20%;
  text-align: left;
}

.desktop {
  display: none;
}

audio, canvas {
  display: block;
}

.notdesktop {
  display: block;
}

.widedesktop {
  display: none;
}

.screen {
  display: none;
}

.text,
.sidebar,
.pagestuff,
.itemscope {
  max-width: 700px;
}

div.comment {
  padding-top: 5px;
  padding-bottom: 15px;
}

img.slide,
.widestuff img {
  display: block;
  margin: 0px auto;
}

img.slide {
  width: 100%;
  max-width: fit-content;
}

.strip {
  position: relative;
  display: block;
  width: 100%;
  height: 150px;
}

.stripbox {
  display: block;
  height: 150px;
}

.strip,
.stripbox {
  margin-top: 60px;
}

.colorpage .strip {
  background: #00cccc;
}

.home .strip {
  background-image: url("/images/widestrip0.jpg");
}

.photos .strip {
  background-image: url("/images/widestrip2.jpg");
}

.paintings .strip {
  background-image: url("/images/widestrip3.jpg");
}

.drawings .strip {
  background-image: url("/images/widestrip4.jpg");
}

.writing .strip {
  background-image: url("/images/widestrip9.jpg");
}

.technology .strip {
  background-image: url("/images/widestrip10.jpg");
}

.design.colors .strip {
  background-image: none;
}

.design.colornames .strip,
.design .strip {
  background-image: url("/images/widestrip5.jpg");
}

.bonnevie .strip {
  background: url("/images/wallpaper6-back.jpg");
}

.widestrip7 {
  background-image: url("/images/widestrip7.jpg");
}

.widestrip8 {
  background-image: url("/images/widestrip8.jpg");
}

.widestrip9 {
  background-image: url("/images/widestrip9.jpg");
}

.widestrip10 {
  background-image: url("/images/widestrip10.jpg");
}

.widestrip11 {
  background-image: url("/images/widestrip11.jpg");
}

.widestrip12 {
  background-image: url("/images/widestrip12.jpg");
}

.widestrip13 {
  background-image: url("/images/widestrip13.jpg");
}

.widestrip14 {
  background-image: url("/images/widestrip14.jpg");
}

.widestrip15 {
  background-image: url("/images/widestrip15.jpg");
}

.widestrip16 {
  background-image: url("/images/widestrip16.jpg");
}

.widestrip17 {
  background-image: url("/images/widestrip17.jpg");
}

.widestrip18 {
  background-image: url("/images/widestrip18.jpg");
}

.widestrip19 {
  background-image: url("/images/widestrip19.jpg");
}

.widestrip20 {
  background-image: url("/images/widestrip20.jpg");
}

.widestrip21 {
  background-image: url("/images/widestrip21.jpg");
}

@media screen and (min-width: 400px) {
  .strip,
.stripbox {
    margin-top: 30px;
  }

  #mycanvas {
    width: 380px;
  }

  .mainnavigation li {
    text-align: center;
    width: 25%;
  }
}
@media screen and (min-width: 500px) {
  ul.bullets,
ul.no-bullets {
    margin-left: 0px;
    padding-left: 0px;
  }

  div.iterator div.image {
    width: 33%;
  }
}
@media screen and (min-width: 600px) {
  ul.friendly.expanded > li {
    list-style-type: none;
  }

  .dev {
    display: inline-block;
  }

  .fold {
    clear: left;
  }

  .non-tablet {
    display: none;
  }

  .swipe {
    display: block;
  }

  .ui-content ul {
    width: 100%;
    max-width: 1024px;
  }
}
@media only screen and (min-width: 700px) {
  a.mypalette span {
    display: block;
  }

  .graphics table {
    display: table;
    width: 100%;
  }
  .graphics table td {
    display: table-cell;
    float: none;
    padding-top: 0px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
  }
  .graphics table img {
    margin: 0px auto;
  }

  .home .graphics table td {
    text-align: center;
    width: 33%;
  }

  .fonts .graphics table td:first-child {
    width: 170px;
  }

  .friendly section,
section.friendly {
    clear: both;
    padding-bottom: 15px;
  }

  h5,
.friendly > h2 {
    font-size: 21px;
    color: #111;
    font-family: Palatino, Garamond, Georgia, Cambria, "Times New Roman", Times, serif;
    display: inline;
    clear: both;
    padding: 0px;
    margin: 0px;
  }

  h5:after,
.friendly > h2:after {
    content: ".";
  }

  ul.friendly,
.friendly > ul {
    margin: 0px;
    padding: 0px;
    display: inline;
  }
  ul.friendly > li,
.friendly > ul > li {
    display: inline;
    list-style-type: none;
  }

  div.iterator div.image {
    width: 25%;
  }
}
@media only screen and (max-width: 767px) {
  .index .content,
.slide .content {
    width: auto;
  }
}
@media only screen and (min-width: 768px) {
  .mainnavigation li {
    width: 12.5%;
  }

  .strip,
.stripbox {
    margin-top: 0px;
  }

  .keywords .top {
    display: none;
  }
  .keywords td, .keywords th {
    padding-left: 0px;
    padding-right: 10px;
  }
  .keywords td:first-child,
.keywords th:first-child {
    padding-left: 20px;
  }
  .keywords td:last-child,
.keywords th:last-child {
    padding-right: 20px;
  }
  .keywords thead th {
    text-align: left;
  }
  .keywords thead {
    display: table-header-group;
  }
  .keywords tr {
    display: table-row;
  }
  .keywords td, .keywords th {
    display: table-cell;
  }

  .text {
    padding-left: 30px;
    padding-right: 30px;
  }

  .sidebar {
    padding-top: 30px;
  }

  .category .pagestuff {
    padding-left: 30px;
    padding-right: 30px;
  }

  .pagestuff .pagestuff {
    padding-left: 0px;
    padding-right: 0px;
  }

  .index .footerdetails,
.category .footerdetails {
    display: block;
  }

  .slide .more,
.slide .footerdetails {
    display: none;
  }
  .slide .sidebar footer {
    display: block;
  }

  .category .widestuff {
    padding-left: 30px;
    padding-right: 30px;
  }

  .pagestuff .widestuff,
.widestuff .widestuff {
    padding-left: 0px;
    padding-right: 0px;
  }

  .tablet {
    display: block;
  }

  .desktop,
.screen {
    display: block;
  }

  .notdesktop {
    display: none;
  }

  #wrapper {
    margin: 0px auto;
  }
}
@media only screen and (min-width: 800px) {
  .widestuff,
div.iterator,
.itemscope,
.pagestuff {
    margin: 0px auto;
  }

  #free {
    display: table;
  }

  div.image a {
    padding-left: 8%;
    padding-right: 8%;
  }
}
@media only screen and (min-width: 900px) {
  div.iterator div.image {
    width: 20%;
  }
}
@media only screen and (min-width: 1024px) {
  .widedesktop {
    display: block;
  }

  h2.site-title {
    font-size: 1.1em;
  }
}
@media only screen and (min-width: 1084px) {
  div.iterator {
    margin: 0px auto;
  }
}

/*# sourceMappingURL=style.css.map */