* {
    padding:0;
    margin:0;    
}

body {
    font-size:100.1%;    
    font-family:verdana, tahoma, "sans serif";
    background:#120513 url(../img/bg.jpg) repeat-x;
    text-align:center;
    font-size:11px;
}


a {
    color:#F7A0FF;
    text-decoration:none;
}

a:hover {
    color:#FFCC00;    
}

p {
    color:#FFF;
    font-size:11px;    
}

h3 {
    position:relative;
    left:0px;
    height:60px;
    color:#FFD200;
    font-weight:normal;
    font-size:24px;
}

h4 {
    position:relative;
    left:0px;
    height:26px;
    color:#EEE;
    font-weight:normal;
    font-size:17px;
}

/*#para_block {
    padding:14px 7px;
    width:60%;    
}

#para_block p {
    margin-bottom:8px;
    line-height:1.3em;
}*/

/* site specific */

#container {
    width:800px;
    text-align:center;
    margin:0 auto;
    padding:0;
    background:#4C064A url(../img/bgbg.png) repeat-y;
}

#page_container {
    position:relative;
    padding:0;
    margin:0;
    overflow:hidden;
    width:765px;
    margin:0 auto;
    background:#000;  
    text-align:left;  
}

#header {
    width:765px;
    height:127px;
    background:url(../img/header.jpg);    
}

#footer {
    padding:0;
    margin:0;
    /*padding-top:90px;*/
    position:relative;
    width:765px;

    height:250px;
    left:10px;
    /*background:url(../img/footer.jpg) no-repeat 0 80px;*/    
}



#footer .box {
    position:relative;
    width:300px;
    left:47px;
    margin:0px 50px 0 0;
    top:70px;
    color:#AAA;
    line-height:1.8em; 
    float:left;
}

#footer .box.left {
    padding-top:20px;
    text-align:right;    
}

#header h1, #header h2 {
    display:none;    
}

.dialog ul li {
    color:#CCC;    
}    

#body ul li {
    margin-left:20px;
    padding:5px 0;
    line-height:1.5em;
}    

#header ul {
    z-index:10;
    position:absolute;
    top:146px;
    left:13px;
    list-style-type:none;    
}

#header ul li {
    float:left;    
}

#header ul li a {
    display:block;
    text-indent:-999px;
    overflow:hidden;
    color:white;
    height:20px;
    width:80px;
    background:url(../img/menu_sprite.png);   
}

#header ul li a#l1 { background-position:0 -28px; }
#header ul li a.selected#l1 { background-position:0 -54px; }
#header ul li a:hover#l1 { background-position:0 -81px; }

#header ul li a#l2 { background-position:-80px -28px; width:140px; }
#header ul li a.selected#l2 { background-position:-80px -54px; width:140px; }
#header ul li a:hover#l2 { background-position:-80px -81px; width:140px; }

#header ul li a#l3 { background-position:-220px -28px; width:103px;}
#header ul li a.selected#l3 { background-position:-220px -54px;}
#header ul li a:hover#l3 { background-position:-220px -81px; }

#header ul li a#l4 { background-position:-380px -28px; width:60px; }
#header ul li a.selected#l4 { background-position:-380px -54px;}
#header ul li a:hover#l4 { background-position:-380px -81px;}

#header ul li a#l5 { position:relative; margin-left:20px; background-position:-460px -28px; width:130px; }
#header ul li a.selected#l5 { background-position:-460px -54px; }
#header ul li a:hover#l5 { background-position:-460px -81px;  }

a.nextlink {
    display:block;
    text-indent:-999em;
    background:url(../img/continue_sprites.png) no-repeat;    
}

.nextlink:hover {
    cursor:pointer;    
}

#do_continue { width:250px; height:40px; background-position: -10px -12px}
#do_continue:hover { background-position: -10px -52px}

#do_samples { width:290px; height:40px; background-position: -260px -12px}
#do_samples:hover { background-position: -260px -52px}

#do_contact { width:210px; height:40px; background-position: -560px -12px}
#do_contact:hover { background-position: -560px -52px}

#do_questions { width:240px; height:40px; background-position: -760px -12px}
#do_questions:hover { background-position: -760px -52px}

/*#header ul li a:hover, #header ul li a.selected:hover {
    background-position:0 -18px;    
}

#header ul li a.selected {
    background-position:0 -37px;    
}*/

#body {
    position:relative;
    width:765px;
    padding:0;
    margin:0;
    /**/
    background:#000 url(../img/pagebg.jpg) no-repeat;    
}

#body .inner {
    padding:65px 35px 25px 35px;    
}

.imagebox {
    background:#222;
    padding:8px;
    border:2px solid #111;
}

.imagebox p {
    width:270px;
    color:#CCC;
    line-height:1.4em;
    margin:10px 0 0 3px;    
}

.imagebox.small p {
    width:200px;    
}


/* forms and labels */

form label {
    font-size:13px;
    float:left;
    width:130px; 
    clear:left;
    color:#CCC;
}

form input {
    width:278px;
    font-size:14px;
    padding:3px;
    font-family:georgia;
    margin-bottom:5px;
}

form input[type=submit] {
    width:100px;
    border:1px solid #333; 
    background:#888;
    color:#000;
    width:180px;
    font-size:13px; 
    font-family:tahoma;    
}

form input[type=submit]:hover {
    cursor:pointer;
    border:1px solid #777;
    background:#999;
    color:#EEE;
}




form textarea {
    width:278px;
    height:150px;
    padding:3px;
    margin-bottom:5px;
    font-family:georgia;        
}

/* portfolio boxes */

.portbox {
    
    /*border:2px solid #111;*/
    
    /*width:239px;
    height:215px;*/
    position:relative;
    /*left:-36px;
    float:left;*/
    padding:0;
    
}

.portbox .portimg {
    width:300px;
    height:180px;
    margin:0 15px 3px 15px;
    float:right;
    border-left:3px solid #555;
    border-right:3px solid #888;
    border-top:3px solid #222;
    border-bottom:3px solid #666;
        
}

.portbox .portbox_inner {
    position:relative;
    top:5px;
    left:7px;
    width:195px;
    height:155px;
    padding:0;
    margin:0;
    /*background:#ccc;*/
}

.portbox .caption {
    font-size:10px;
    color:#CCC;
    padding:11px 7px;
    line-height:1.4em;
}

/*.portbox img {
    border:1px solid #779; 
}

.portbox img:hover {
    border:1px solid #FFF;
}*/

/* dialog rounded corners */

.dialog {
 position:relative;
 margin:0px auto;
 min-width:8em;
 max-width:1400px; /* based on image dimensions - not quite consistent with drip styles yet */
 color:#fff;
 z-index:1;
 margin-left:12px; /* default, width of left corner */
 margin-bottom:0.5em; /* spacing under dialog */
}



.dialog .content,
.dialog .t,
.dialog .b,
.dialog .b div {
 background:transparent url(../img/parabg.png) no-repeat top right;
}



.dialog .content {
 position:relative;
 zoom:1;
 _overflow-y:hidden;
 /*padding:0px 12px 0px 0px;*/
 padding:12px 19px 0px 4px;
}

.dialog .t {
 /* top+left vertical slice */
 position:absolute;
 left:0px;
 top:0px;
 width:12px; /* top slice width */
 margin-left:-12px;
 height:100%;
 _height:1600px; /* arbitrary long height, IE 6 */
 background-position:top left;
}

.dialog .b {
 /* bottom */
 position:relative;
 width:100%;
}

.dialog .b,
.dialog .b div {
 height:16px; /* height of bottom cap/shade */
 font-size:1px;
}

.dialog .b {
 background-position:bottom right;
}

.dialog .b div {
 position:relative;
 width:12px; /* bottom corner width */
 margin-left:-12px;
 background-position:bottom left;
}

.dialog .hd,
.dialog .bd,
.dialog .ft {
 position:relative;
}

.dialog .wrapper {
 /* extra content protector - preventing vertical overflow (past background) */
 position:static;
 max-height:1000px;
 overflow:auto; /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */
}

.dialog h1,
.dialog p {
 margin:0px; /* margins will blow out backgrounds, leaving whitespace. */
 padding:0.2em 20px 0.8em 4px;
 line-height:1.4em;
 color:#DDD;
}

.dialog h1 {
 padding-bottom:0px;
}

/* grid */

#grid {
    z-index:99999;
    position:absolute;
    width:100%;
    height:100%; 
}

.gridbox {
    float:left;
    height:100%;
    width: 49px;
    border-right:1px solid #FFF;  
}