/* Reset */
@import 'reset.css'; /* Always First */
@import '960_24_col.css';
@import 'navigation.css';

body { height:100%; background: url(../images/page-structure/body-bg-rp.jpg) repeat left  #e9e9e9;font:12px Georgia, "Times New Roman", Times, serif; color:#2c2c2c; line-height:16px; margin:0; padding:0; font-size:12px; height:100%;  }

p { padding-bottom:8px; padding-top:8px;}
hr { border-bottom:#d4d4d4 dotted 1px; border-right:0px; border-left:0px; border-top:0px; margin:10px 0px 10px 0px; height:1px; width:100%; }
input, select, textarea { padding:2px; font-family:arial; }

h1 {color:#FFF; font-size:16px; display:block; line-height:21px; padding:10px 10px 10px 20px; background: url(../images/page-structure/header-bg.png) no-repeat; background-position: center center;  margin-bottom:5px; }
h2 { font-size:16px; line-height:20px; color:#000; margin:0px 0px 13px 0px; }


table tr td { vertical-align:top;}

a:link { color:#2c2c2c; text-decoration:none;}
a:active {color:#2c2c2c; text-decoration:none;}
a:visited {color:#2c2c2c; text-decoration:none;}
a:hover {color:#2c2c2c; text-decoration: underline;}

.bg { background:url(../images/page-structure/bg.png) no-repeat bottom right; width:100%; height:100%; min-height:100%; position:absolute;}
/******
HEADER
******/

.header { height:90px; width:300px; padding:10px 0px 0px 200px;}
.header h4 { width:290px; color:#000; padding:20px 0px 20px 0px; font-size:40px; margin-bottom:0px;  }
.header h5 { width:150px; color:#000; height:19px; padding:0px 0px 0px 0px; margin-bottom:5px; font-size:10px; font-weight:normal; z-index:1000; position:relative; top:-23px; left:116px; letter-spacing:3px; }
.white {color:#FFF; background:url(../images/page-structure/logo-white.png) no-repeat;}
.black {color:#000; background:url(../images/page-structure/logo-black.png) no-repeat;}


/******
HOME PAGE
******/

#screencontainer  { overflow:hidden;}
#section-gallery { height:100%; position:relative; top:0; right:0; /*position:absolute; left:0; top:0;*/   }
#work-description { }
#section-description {padding:10px; color:#33322E;}
/*#work-description p { background-color:#78848A; color:#FFF; display: inline; padding:2px; line-height:21px;}*/

.content { height:500px; color:#FFF; width:730px; background:#121316; padding:10px; }
.tools { margin-left:0px;}
.tools ul.skills { padding:0px 0px 10px 10px; border-left:#666 dotted 1px; border-bottom:#666 dotted 1px; margin:0px 0px 1px 1px; list-style-type:none;}
.tools ul.skills li { }
.tools ul.skills li.ps { background:#E3172C;margin:1px 0px 1px 0px; padding:3px; width:90%; }
.tools ul.skills li.dw { background:#A31120; margin:1px 0px 1px 0px; padding:3px; width:70%;}
.tools ul.skills li.css-htm { background:#E3172C;margin:1px 0px 1px 0px; padding:3px; width:90%; }
.tools ul.skills li.fl { background:#A31120; margin:1px 0px 1px 0px; padding:3px; width:60%;}
.tools ul.skills li.maya { background:#E3172C;margin:1px 0px 1px 0px; padding:3px; }
.tools ul.skills li.fw { background:#A31120; margin:1px 0px 1px 0px; padding:3px;}
.tools ul.skills li.ai { background:#E3172C;margin:1px 0px 1px 0px; padding:3px; }
.tools ul.skills li.id { background:#A31120; margin:1px 0px 1px 0px; padding:3px;}

.home { background:#121316; padding:10px;}



/****** INDIVIDUAL FOLIO ITEMS ******/
.One  { position:absolute; top:100px; left:5px; padding:0px; background:#008fd6;}
.Two { position:absolute; top:150px; left:5px; padding:0px; background:#008fd6;}
.Three { position:absolute; top:200px; left:5px; padding:0px; background:#008fd6;}
/****** INDIVIDUAL FOLIO LINK STYLES ******/

ul.PortfolioItem {}
ul.PortfolioItem .link { padding:8px 0px 8px 8px; background:url(../images/page-structure/li-arrow.jpg) no-repeat right center;}
ul.PortfolioItem .Date { width:30px; border-right:#002b40 dotted 1px; float:left; font-size:20px; font-weight:bold; padding:4px 0px 4px 0px; margin:0px 5px 0px 0px;}
ul.PortfolioItem .MonthYear { width:100px; line-height:12px; font-size:11px; float:left; margin:0px 0px 0px 5px; margin:0px 5px 0px 0px; }
ul.PortfolioItem a.heading, 
ul.PortfolioItem a.heading:link,
ul.PortfolioItem a.heading:active, 
ul.PortfolioItem a.heading:visited { padding:0px; cursor:pointer; color:#FFF; text-decoration:none; text-transform:uppercase; margin:0px 5px 0px 0px;}
ul.PortfolioItem a.heading:hover {color:#2c2c2c; }
ul.PortfolioItem a.selected {color:#2C2C2C; cursor:pointer; }

/*******
AJAX LOAD
*****/
.ajax-folio { position:relative; text-align:center; margin:auto 0; width:100%; top:300px;}
.ajax-folio .loaderholder { background:#252522; width:49px; height:45px;}

/******
MORE PAGE LINKS
******/
.ScreenPages {font-size:9px;}
.ScreenPages a {color:#fff; background:#121212; text-decoration:none; padding:1px 4px 1px 4px; margin:0px;  }
.ScreenPages a:link { color:#fff; background:#5c358c; text-decoration:none;}
.ScreenPages a:active {color:#fff; text-decoration:none;}
.ScreenPages a:visited {color:#fff; text-decoration:none;}
.ScreenPages a:hover {color:#fff; background:#2c2c2c; text-decoration: none;}

/******
FOOTER
******/
.footer { color:#fff; background:url(../images/page-structure/footer-bg.jpg) no-repeat top; padding:46px 0px 10px 0px;}
.footer p {padding:10px 0px 0px 10px; }
.footer span { margin:0px 5px 0px 5px;}
.footer a {color:#fff; text-decoration:none;}
.footer a:link { color:#fff; text-decoration:none; }
.footer a:active {color:#fff; text-decoration:none;}
.footer a:visited {color:#fff; text-decoration:none;}
.footer a:hover {color: #666; text-decoration: underline;}

/******
CONTACT US PAGE
******/
.GoogleMap { padding:10px;}
.ContactUsBG { background:url(../images/page-structure/contact-us-page-bg.jpg) repeat-y;}
.ContactUsForm {}
.ContactUsForm h2 { background:url(../images/online-store/related-item-header-border.jpg) repeat-x bottom; padding:0px 0px 10px 0px;}
.ContactUsForm .LeftColumn { width:320px; border:1px solid #B2B2B2; float:left; margin-right:5px; margin-top:10px;}
.ContactUsForm .RightColumn { width:590px; float:left; border-bottom:#b2b2b2 solid 1px; margin-left:5px; margin-top:10px; }
.ContactUsForm .Form { width:590px; float:left; border-bottom:#b2b2b2 solid 1px; margin-left:5px; margin-top:10px; }


/*******
GALLERY CONTROLS
*****/
.folioarea { height:100%; width:100%; }
.folioarea .GalleryStage { margin:0 auto; width:730px; background:#121316; padding:10px;}
.folioarea .gallery { text-align:center; }
.folioarea .gallery ul { list-style:none; padding:0px;}
.latestwork { position: absolute; right:10px; top:15px; padding:5px; color:#FFF; background:#FF0000; z-index:1000; width:100px; float:right;}

.gallery-controls { overflow: auto; width:720px; background: url(../images/page-structure/header-bg.png) no-repeat; background-position: center center; margin:0px 0px 5px 0px; color:#FFF; padding:10px 10px 10px 20px;}
.gallery-controls .arrows { width:138px; padding:5px 0px 0px 0px; float:right; }
.gallery-controls .arrows a { float: left; display: block; font-size: 10px; color: #f9b000; text-decoration: none; letter-spacing: 1px; line-height: 8px;}
.gallery-controls .arrows a.next { margin: 0 0 0 5px; padding:2px 5px 2px 5px; line-height:16px; color:#FFF; float:right; text-align:right; height:16px; }
.gallery-controls .arrows a:hover.next { margin: 0 0 0 5px; color:#FFF; line-height:16px; height:16px; background:#E3172C;}
.gallery-controls .arrows a.prev { margin:0px; color:#FFF; padding:2px 5px 2px 5px; line-height:16px; float:right; text-align:right; height:16px; cursor: pointer;}
.gallery-controls .arrows a:hover.prev { margin:0px; color:#FFF; line-height:16px; height:16px; cursor: pointer; background:#E3172C;}

.gallery-controls a.button { width: 7px; height: 7px; background-color: #008fd6; text-indent: -9999px; padding:2px 0px 2px 0px; margin: 5px 2px 0px 0px;}
.gallery-controls a.button:hover, .gallery-controls a.selected {background-color: #008fd6; padding:5px 0px 5px 0px; margin:1px 2px 0px 0px; }

.gallery-controls .Description { font-size:11px; width:550px; text-align:left;}
.gallery-controls .Description .what { padding:0px; float:left; width:400px;}
.gallery-controls .Description .Date { width:60px; border-right:#666666 dotted 1px; float:left; font-size:20px; font-weight:bold; padding:4px 0px 4px 0px; margin:0px 5px 0px 0px;}
.gallery-controls .Description .MonthYear { width:50px; line-height:12px; font-size:11px; float:left;  margin:0px 5px 0px 5px; }
.gallery-controls .Description .link {padding:0px; width:300px; float:left; margin:0px;}
.gallery-controls .Description .link a,
.gallery-controls .Description .link a:link, 
.gallery-controls .Description .link a:active,
.gallery-controls .Description .link a:visited { color:#fff; text-decoration:none; padding:2px 5px 2px 5px;}
.gallery-controls .Description .link a:hover {color:#fff; background:#E3172C; text-decoration: none;}
/*******
GALLERY INDIVIDUAL BACKGROUND
*****/