/* RESET */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
  margin: 0;
  padding: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset,img {
  border: 0;
}
address,caption,cite,code,dfn,em,th,var {
  font-style: normal;
  font-weight: normal;
}
ol,ul {
  list-style: none;
}
caption,th {
  text-align: left;
}
h1,h2,h3,h4,h5,h6 {
  font-size: 100%;
  font-weight: normal;
}
q:before,q:after {
  content: '';
}
abbr,acronym {
  border: 0;
}
a:active,a:focus {
  outline: none;
}
.clear {
  clear: both;
}
img {
  border: 0;
}
a,
a:hover {
  color: #999;
  text-decoration: none;
}
/* TYPO */
body {
  font-size:12px;
  line-height:1.35em;
  font-family: Arial, "Helvetica Neue", Helvetica, Tahoma, sans-serif;
  color: #333;
}
/* LAYOUT */
html, body {
   height: 100%;
}
body {
  background: #000;
}
.col {
  margin: 0 auto;
  width: 738px;
  height: 100%;
  position: relative;
}
.pos {
  width: 738px;
  height: 283px;
  position: absolute;
  top: 50%;
  left: 0;
  overflow: visible;
}
.box {
  width: 738px;
  height: 283px;
  position: absolute;
  top: -50%;
  left: 0;
} 
.linkbox {
  width: 245px;
  height: 283px;
  position: absolute;
  top: 0;
}
.linkbox1 {
  left: 0px;
  border-left: 1px solid #c7650f;
}
.linkbox2 {
  left: 246px;
  border-left: 1px solid #953007;
}
.linkbox3 {
  left: 492px;
  border-left: 1px solid #990000;
}
.linkbox a {
  width: 246px;
  height: 283px;
  display: block;
  position: relative;
} 
.linkbox a:hover {
  color: #fff;
}
.linkbox1 a {
  background: url(../images/raw_artistic_sprite.png) no-repeat -232px 83px;
}
.linkbox2 a {
  background: url(../images/raw_artistic_productions_sprite.png) no-repeat -232px 118px;
}
.linkbox3 a {
  background: url(../images/raw_artistic_soul_sprite.png) no-repeat -232px 101px;
}
.linkbox1 a:hover {
  background: url(../images/raw_artistic_sprite.png) no-repeat 14px 83px;
}
.linkbox2 a:hover {
  background: url(../images/raw_artistic_productions_sprite.png) no-repeat 14px 118px;
}
.linkbox3 a:hover {
  background: url(../images/raw_artistic_soul_sprite.png) no-repeat 14px 101px;
}
.linkbox a:hover span {
  color: #fff;
}
.linkbox a:hover span {
  color: #fff;
} 
.linkbox span {
  display: block;
  height: 90px;
  padding: 164px 33px 0 14px;
  cursor: pointer;
}
span.link {
  height: 20px;
  position: absolute;
  top: 270px;
  left: 0;
  background: url(../images/arrow_off.gif) no-repeat 14px 5px;
  padding: 0 0 0 21px;
  cursor: pointer;
}
.linkbox a:hover span.link {
  background: url(../images/arrow.gif) no-repeat 14px 5px;
}