/* CSS Document - Warped Drawings */

html {
height:100%; max-height:100%; padding:0; margin:0; border:0; background:#fff; font-size:80%; font-family:arial, tahoma, verdana, sans-serif; 
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow:hidden; /*get rid of scroll bars in IE */
/* */
}

body { height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0; }

#bodycontainer { display:block; height:100%; max-height:100%; overflow:auto; text-align:center; position:relative; z-index:1; }

#container { width:700px; min-height:700px; text-align:left; position:relative; margin-left:auto; margin-right:auto; background-image: }

*html #container { height:700px; }

#header { width:750px;  text-align:left; margin:10px 0px 20px 0px; padding:0px 0px 0px 0px; }

#nav { margin:0px 0px 0px 380px; padding:0px 0px 0px 0px; }

#content { width:350px; text-align:justify; margin:0px 0px 0px 380px; }

#content img { border:0px solid #ffffff; margin:10px; 0px; 10px; -5px;}

#sampleblock { margin:10px 0px 0px 0px; padding:0px 0px 0px 0px;}


#footer { height:100px; width:100%; background-image:url(../images/footerbg1.gif); background-repeat:repeat-x; text-align:center; position:absolute; bottom:0px; right:18px; z-index:3; }

#footercontainer{ text-align:center; width:800px; height:60px; background-color:#0099FF; margin-left:auto; margin-right:auto; position:absolute; botom:0px; }

.pad2 { display:block; height:100px; }

#portfolio_image img{ border:3px solid #000000; }

.portfolionav { margin:0px 0px 10px 0px; }


/* text & colours */



h1{ color:#000000; font-size:22px; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; }

#header h1{ margin:10px 0px 0px 380px; padding:0px 0px 0px 0px; font-family:Arial Black, Arial, Helvetica, sans-serif; font-size:23px;}

a { color:#000000; font-size:12px; text-decoration:none; font-weight:bold; }

a:hover {text-decoration:underline; }

#content a { color:#000000; font-size:14px; text-decoration:none; font-weight:bold; }


p { margin:2px 0px 6px 0px; padding:0px 0px 0px 0px; }



#footer h1{ background-repeat:repeat-x; text-align:left; position:absolute; bottom:20px; left:100px; z-index:4; color:#FFFFFF; font-family:Arial Black, Arial, Helvetica, sans-serif; font-size:17px; }

#footer p{ background-repeat:repeat-x; text-align:left; position:absolute; bottom:14px; left:100px; z-index:4; color:#FFFFFF; font-size:10px; margin:0px 0px 0px 0px; padding: 0px 0px 0px 0px; }



/* background images */

#bg_home { background-image:url(../images/bg_homepage.gif);  position:absolute; top:0px; left:0px; width:400px; height:500px;  background-repeat:no-repeat; }

#bg_about { background-image:url(../images/bg_about.jpg); position:absolute; top:0px; left:-70px; width:456px; height:512px;  z-index:-1; background-repeat:no-repeat; }

#bg_portfolio { background-image:url(../images/bg_portfolio.gif); position:absolute; top:0px; left:-50px; height:474px; width:387px;  background-repeat:no-repeat; }

#bg_caricatures { background-image:url(../images/bg_caricatures.gif); position:absolute; top:0px; left:-20px;  width:400px; height:558px; z-index:-1; background-repeat:no-repeat; }

#bg_cards { background-image:url(../images/bg_cards.gif); position:absolute; top:0px; left:-20px;  width:354px; height:342px; z-index:-1; background-repeat:no-repeat; }


/* portfolio */


#product_container { width:650px; margin:40px 0px 5px 120px; padding:0px 0px 0px 10px; float:left; position:absolute; top:200px;  }

.product_row { width:650px; margin:0px 0px 5px 0px; padding:0px 0px 0px 0px; float:left;  }

.product_item { width:150px; height:150px; margin:0px 0px 0px 4px; padding:0px 0px 0px 0px; float:left;  }

.product_item img{ border:5px solid #000000; }

.product_item img a{ border:0px solid #000000; color:#000000; text-decoration:none;margin:10px 0px 0px 5px; float:left; background-color:#000000; }