/* 
*   Coded by Jeremy Caldwell of Eternalistic Designs (www.eternalistic.net)
*/

/* Font Size Percentages
----------------------------------------------- */ 
/*

Based on the YUI font sizing chart

9px	69%
10px	77%
11px	85%
12px	93%
13px	100%
14px	108%
15px	116%
16px	123.1%
17px	131%
18px	138.5%
19px	146.5%
20px	153.9%
21px	161.6%
22px	167%
23px	174%
24px	182%
25px	189%
26px	192%

*/

/* remove outline from links when clicked in FireFox
----------------------------------------------- */
:-moz-any-link:focus { outline: none; }

/* LAYOUT
----------------------------------------------- */

html {
  background: #000;
  color: #fff;
}

body {
  font-family: Arial, Helvetica, Verdana, "Bitstream Vera Sans", sans-serif;     /* web safe fonts */
  font-weight: normal;
  line-height: 160%;
}

#wrapper {
  margin: 0 auto;
  padding: 5px 0 25px 0;
  width: 918px;
}


/* TYPOGRAPHY
----------------------------------------------- */

p {
  font-size: 100%; /* 13px */
  line-height: 153.9%;
  margin: 0 0 1em 0;
}

h1 {
  color: #e71600;
  font-size: 153.9%; /* 22px */
  font-weight: bold;
  margin: 0 0 20px 0;
}

h2 {
  color: #e71600;
  font-size: 123.1%; /* 16px */
  margin: 0;
  font-weight: bold;
}

h3 {
  color: #7aa958;
  font-size: 123.1%; /* 16px */
  font-weight: bold;
  margin: 0 0 .25em 0;
}

h4 {
  color: #fff;
  font-size: 14px; 
  font-weight: bold;
  margin: -15px 0 15px 0;
}

ul {
  margin: 0 0 1em 40px;
}

ul li {
  font-size: 100%; /* 13px */
  line-height: 138.5%;
  list-style: disc;
  padding: 0 0 5px 0;
}

img {
  border: none;
}

a {
  color: #e71600;
}

.highlight {
  color: #e71600;
}

em {
	font-style:italic;
}
strong {
	font-weight: bold;
}


/* HEADER
----------------------------------------------- */

#header {
}

#header-wrapper {
  margin: 0 0 20px 0;
  position: relative;
  width: 918px;
  padding: 15px 0;
}

#logo {
}

#header-left {
  float: left;
}

#header-right {
  float: right;
}


/* PRIMARY MENU
----------------------------------------------- */

ul#primary-menu {
  margin: 25px 0 0 0;
}

ul#primary-menu li {
  display: block;
  float: left;
  margin: 0 20px 0 0;
}

/* Menu Item - Gallery */
ul#primary-menu li#menu-gallery a {
  display: block;
  width: 73px;
  height: 38px;
  background: url(../images/menu-gallery.png) no-repeat bottom;
  text-indent: -9000px;
}

ul#primary-menu li#menu-gallery a:hover,
ul#primary-menu li#menu-gallery a:focus,
ul#primary-menu li#menu-gallery a.active {
  background: url(../images/menu-gallery.png) no-repeat top;
}

/* Menu Item - Blog */
ul#primary-menu li#menu-blog a {
  display: block;
  width: 61px;
  height: 38px;
  background: url(../images/menu-blog.png) no-repeat bottom;
  text-indent: -9000px;
}

ul#primary-menu li#menu-blog a:hover,
ul#primary-menu li#menu-blog a:focus,
ul#primary-menu li#menu-blog a.active {
  background: url(../images/menu-blog.png) no-repeat top;
}

/* Menu Item - Dread */
ul#primary-menu li#menu-dread a {
  display: block;
  width: 60px;
  height: 38px;
  background: url(../images/menu-dread.png) no-repeat bottom;
  text-indent: -9000px;
}

ul#primary-menu li#menu-dread a:hover,
ul#primary-menu li#menu-dread a:focus,
ul#primary-menu li#menu-dread a.active {
  background: url(../images/menu-dread.png) no-repeat top;
}

/* Menu Item - Destroying Angels */
ul#primary-menu li#menu-destroying-angels a {
  display: block;
  width: 167px;
  height: 38px;
  background: url(../images/menu-destroying-angels.png) no-repeat bottom;
  text-indent: -9000px;
}

ul#primary-menu li#menu-destroying-angels a:hover,
ul#primary-menu li#menu-destroying-angels a:focus,
ul#primary-menu li#menu-destroying-angels a.active {
  background: url(../images/menu-destroying-angels.png) no-repeat top;
}

/* Menu Item - Merch */
ul#primary-menu li#menu-merch a {
  display: block;
  width: 60px;
  height: 38px;
  background: url(../images/menu-merch.png) no-repeat bottom;
  text-indent: -9000px;
}

ul#primary-menu li#menu-merch a:hover,
ul#primary-menu li#menu-merch a:focus,
ul#primary-menu li#menu-merch a.active {
  background: url(../images/menu-merch.png) no-repeat top;
}




/* SECONDARY MENU
----------------------------------------------- */

#secondary-menu ul {
margin: 10px 0;
padding: 0;
}

#secondary-menu ul li {
background: url(../images/list-style-cross.png) no-repeat 0 5px;
margin: 0 0 10px 0;
padding: 0 0 0 15px;
list-style: none;
font-size: 100%;
}

#secondary-menu ul li a {
text-decoration: none;
color: #ebebeb;
}

#secondary-menu ul li a:hover,
#secondary-menu ul li a:focus,
#secondary-menu ul li a.active {
text-decoration: none;
color: #E71600;
}


/* Sub menu */
#secondary-menu ul li ul {
margin: 5px 0 15px 15px;
}

#secondary-menu ul li ul li {
list-style: disc;
background: none;
margin: 0;
padding: 0;
}





/* CONTENT AREA
----------------------------------------------- */

#main {
  background: #1b1b1b url(../images/bg-main.png) repeat-y;
}

.column-inner {
  padding: 15px;
}
.column-inner-home {
  padding: 15px;
}
.column-inner-home p {
  line-height: 16px;
}


/* Column - Left */
#column-left {
  float: left;
}

/* Column - Right */
#column-right {
  float: right;
  width: 720px;
  padding-top: 10px;
}


/* New Art List */
ul#newart {
  margin: 5px 0;
}

ul#newart li {
  display: inline;
  margin: 0 5px 0 0;
}

img.homeimage {
  margin: 0 10px;
}


/* Right Image */
.rightimage {
  float: right;
  width: 185px;
  margin: 0 0 25px 25px;
  display: block;
}

.rightimage .caption {
  font-size: 77%; /* 10px */
  line-height: 110%;
  margin: 10px 0;
  display: block;
  font-family: Tahoma, Arial, sans-serif;
}

#title-dread {
  display: block;
  width: 60px;
  height: 38px;
  background: url(../images/menu-dread.png) no-repeat bottom;
  text-indent: -9000px;
}

#title-destroying-angels {
  display: block;
  width: 140px;
  height: 38px;
  background: url(../images/menu-destroying-angels.png) no-repeat bottom;
  text-indent: -9000px;
}

#title-gallery {
  display: block;
  width: 73px;
  height: 38px;
  background: url(../images/menu-gallery.png) no-repeat bottom;
  text-indent: -9000px;
}


/* Sidebar artwork */
.sidebar-artwork {
display: block;
margin: 35px 0 0 -15px;
}
.sidebar-artwork2 {
display: block;
margin: 10px 0 0 -15px;
}

/* CONTENT AREA - HOME
----------------------------------------------- */

#home h1 {
  margin: 0 0 1px 0;
}

#home #column-left {
  float: left;
  margin: 0;
}

/* Column - Right */
#home #column-right {
  float: right;
  background: #1b1b1b;
  width: 335px;
}


/* UNDERLINE
----------------------------------------------- */

.line {
  padding: 1px 0 0 0;
  margin: -8px 0 10px 0;
  background: #E0E9EF;
}


/* FOOTER
----------------------------------------------- */

#footer {
}

#footer-wrapper {
  margin: 0 auto;
  position: relative;
  width: 918px;
}

#footer-wrapper p {
  color: #fff;
  font-size: 85%; /* 12px */
  padding: 20px 0 0 0;
}

/* Footer Menu */
ul#footer-menu {
  margin: -10px 0 0 00;
  padding: 0;
  font-size: 85%;
}

ul#footer-menu li {
  display: inline;
  border-right: 1px solid #fff;
  margin: 0 5px 0 0;
  padding: 0 10px 0 0;
}

ul#footer-menu li.last {
  border-right: none;
  margin: 0;
  padding: 0;
}

ul#footer-menu li a {
  color: #fff;
  text-decoration: none;
}

ul#footer-menu li a:hover {
  text-decoration: underline;
}


/* CLEARFIX
----------------------------------------------- */

.clearfix:after {                                 /* add .clearfix class to clear floats after an element */
  clear: both;                                    /* (IE version is in ie6-fixes.css) */
  content: "."; 
  display: block; 
  font-size: 0;
  height: 0; 
  visibility: hidden;
}


/* OTHER
----------------------------------------------- */
.floatleft {
float: left;
padding: 0 10px 10px 0;
position: relative;
z-index: 5;
}
.floatright {
float: right;
padding: 10px 0 10px 10px;
}

.question {
font-style:italic;
border-bottom: 1px dotted #e71600;
margin-bottom: 18px;
margin-top: 15px;
color: #d7d7d7;
}
.answer {
margin: 0 0 10px 30px;	
}

.name {
font-size: 85%;
margin-top: 5px;
line-height: 14px;
}

.da-table {
margin: 15px 15px 30px 15px;
line-height: 16px;
}
.da {
font-weight: bold;
color: #e71600;
font-size: 108%;
}


/* FLICKR GALLERY
----------------------------------------------- */
.demo {
  position: relative;
  background: #000;
  margin: -20px 0 20px -12px;
}

.galleria_wrapper {
  margin: 40px 0 1em 0;
  position: absolute;
  right: 0;
  top: 0;
}

ul.gallery_demo {
  width: 180px;
  float: left;
  display: block;
  overflow: auto;
  height: 500px;
  padding: 0;
  margin: 0;
}

ul.gallery_demo li {
  width: 90px;
  height: 90px;
  border: 2px solid #4e4e4e;
  cursor: pointer;
}

ul.gallery_demo li.hover {
  border: 2px solid #E71600;
}

ul.gallery_demo li.active {
  border: 2px solid #f30;
}

ul.gallery_demo li div {
  left: 240px
}

ul.galleria li {
  display: block;
  width: 60px;
  height: 80px;
  overflow: hidden;
  float: left;
  margin: 0 17px 18px 0;
  padding: 0;
}


/* photo gallery
----------------------------------------------- */

#photolinks {
  margin: 0 0 1em 0;
  clear: both;
}

#photolinks #photolinks-first {
  text-align: left;
}

#photolinks #photolinks-last {
  width: 200px;
  text-align: left;
}

#photolinks a {
  text-decoration: none;
  color: #7d7d7d;
  font-size: 93%;
}

#photolinks a:hover,
#photolinks a:focus {
  color: #E71600;
  text-decoration: underline;
}

.picto {
	font-size: 93%;
	color: #ddd;
	text-align: center;
	margin-top: -20px;
}