/** Reset **********************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through;} table { border-collapse: collapse; border-spacing: 0; }

/** Global *********************/
.hidden, .hide, .ui-tabs-hide { display: none; }
.bg-img, .bg-img-list li a { display: block; height: 0; overflow: hidden; }
.clear { clear: left;}
a:link, a:visited { color: #7fd5f9; text-decoration: none }
a:hover, a:active { color: white }

body {
	background: #373531 url('i/elements.jpg') 0 -784px repeat-x; 
	font: normal normal 14px Arial, Helvetica, Verdana, sans-serif; color:#D3D2C8; line-height: 17px
}
#wrapper { width: 1000px; margin: 0 auto; position: relative }

/** BG Image Elements  ********/
h1, #menu a:link, #menu a:visited, #contact-info a, #featured, #bio a, #more  { 
	background: url("i/elements.jpg") no-repeat; display: block; overflow: hidden; height: 0 
}

/** Menu **********************/
#menu { height: 33px }
#menu li { float: left }
#menu a { padding-top: 33px }
#menu a.allforces:link, #menu a.allforces:visited { width: 149px; background-position: -3px -716px }
#menu a.allforces:hover, #menu a.allforces:active { background-position: -3px -750px }
#menu a.nota:link, #menu a.nota:visited { width: 95px; background-position: -157px -716px }
#menu a.nota:hover, #menu a.nota:active { background-position: -157px -750px }
#menu a.portfolio:link, #menu a.portfolio:visited { width: 122px; background-position: -253px -716px }
#menu a.portfolio:hover, #menu a.portfolio:active, #menu a.portfolio.active { background-position: -253px -750px }
#menu a.share:link, #menu a.share:visited { margin-left: 422px; width: 95px; background-position: -792px -716px }
#menu a.share:hover, #menu a.share:active, #menu a.share.active { background-position: -792px -750px }
#menu a.contact:link, #menu a.contact:visited { width: 103px; background-position: -887px -716px }
#menu a.contact:hover, #menu a.contact:active, #menu a.contact.active { background-position: -887px -750px }

/** Contact Info **************/
h1 { margin-top: 36px; padding-top: 87px; width: 494px }
#contact-info li { float: left }
#contact-info li a { padding-top: 32px; }
#c-tel:link, #c-tel:visited { width: 121px; background-position: 0 -89px }
#c-tel:hover, #c-tel:active { background-position: -491 -89px }
#c-email:link, #c-email:visited { width: 146px; background-position: -121px -89px }
#c-email:hover, #c-email:active { background-position: -612px -89px }
#c-aim:link, #c-aim:visited { width: 90px; background-position: -267px -89px }
#c-aim:hover, #c-aim:active { background-position: -758px -89px }
#c-twitter:link, #c-twitter:visited { width: 136px; background-position: -357px -89px }
#c-twitter:hover, #c-twitter:active { background-position: -848px -89px }

/** Featured *****************/
#featured { clear: left; background-position: 0 -131px; height: 500px; margin-top: 40px }
#bio { width: 227px; line-height: 1.3em }
#bio h4 { font-size: 2em; font-weight: normal; padding: 40px 0 12px 0 }
#bio p { padding-bottom: 9px; font-size: 12px }
#bio li { float: left}
#bio a { padding-top: 41px }
#m-contact:link, #m-contact:visited { width: 161px; background-position: -491px -3px }
#m-contact:hover, #m-contact:active { background-position: -491px -43px }
#m-resume:link, #m-resume:visited { width: 161px; background-position: -652px -3px }
#m-resume:hover, #m-resume:active { background-position: -652px -43px }
#m-linkedin:link, #m-linkedin:visited { width: 104px; background-position: -813px -3px; margin-left: 7px }
#m-linkedin:hover, #m-linkedin:active { background-position: -813px -43px }
#m-krop:link, #m-krop:visited { width: 72px; background-position: -917px -3px }
#m-krop:hover, #m-krop:active { background-position: -917px -43px }

/** Projects *****************/
#more { background-position: 0 -671px; padding-top: 42px; margin: 0 0 1px 0 }
#samples { line-height: 1.4em } 
#samples div { width: 250px; padding: 5px 0; margin: 25px 0 0 0; float: left }
#samples h3 { color: #fff; font-size: 14px }
#samples p { color: #9f9e9e; font-size: 12px }
#samples img { width: 239px; height: 175px }

/** Footer **********************/
#footer { background-color: #191919; padding: 25px 0; margin-top: 25px }
#footer p { color: #999999; font-size: 12px; width: 1020px; margin: 0 auto }

/** Share **********************/
#share-div, #contact-div, #resume-div, #close, #share-div a, form.sendRichMail .input-error, form.sendRichMail input.submit, form.sendRichMail .msg-status  { 
	background-image: url('i/share.png'); background-repeat: no-repeat; display: block; overflow: hidden; height: 0
}
#share-div { position: absolute; top: 5px; left: 547px; display: none; width: 328px; height: 469px;  background-position: 0 10px; color: #454541 }
#share-div h2 { color: #454541; text-align: center; padding: 34px 0 32px 0;  font-size: 16px }
#share-div h2.email-title { padding-top: 10px }
#share-div ul { padding-left: 29px}
#share-div li { float: left; padding-bottom: 5px }
#facebook a:link, #facebook a:visited { width: 148px; padding-top: 35px; background-position: -349px -302px }
#facebook a:hover, #facebook a:active { background-position: -349px -366px }
#twitter a:link, #twitter a:visited { width: 121px; padding-top: 35px; background-position: -497px -302px }
#twitter a:hover, #twitter a:active { background-position: -497px -366px }
#stumbleupon { clear: left }
#stumbleupon a:link, #stumbleupon a:visited { width: 44px; padding-top: 29px; background-position: -349px -337px }
#stumbleupon a:hover, #stumbleupon a:active { background-position: -349px -401px }
#google a:link, #google a:visited { width: 44px; padding-top: 29px; background-position: -393px -337px }
#google a:hover, #google a:active { background-position: -393px -401px }
#digg a:link, #digg a:visited { width: 45px; padding-top: 29px; background-position: -437px -337px }
#digg a:hover, #digg a:active { background-position: -437px -401px }
#delicious a:link, #delicious a:visited { width: 46px; padding-top: 29px; background-position: -482px -337px }
#delicious a:hover, #delicious a:active { background-position: -482px -401px }
#embed a:link, #embed a:visited { width: 88px; padding-top: 29px; background-position: -528px -337px }
#embed a:hover, #embed a:active { background-position: -528px -401px }
#embeded { clear: left; font-size: 12px; padding-top: 5px; text-align: center }
/** Contact **********************/
#contact-div { position: absolute; top: 5px; left: 657px; width: 328px; height: 302px; background-position: -328px 10px; display: none }
#contact-div h2 { color: #454541; text-align: center; padding: 34px 0 32px 0; width: 322px; font-size: 16px }
/** Resume **********************/
#resume-div { position: absolute; top: 245px; left: 280px; width: 328px; height: 302px; background-position: -328px 10px; display: none }
#resume-div h2 { color: #454541; text-align: center; padding: 34px 0 32px 0; width: 322px; font-size: 16px }
/** Form **********************/
#close { position: absolute; top: 0; right: 0; width: 29px; padding-top: 29px;  background-position: -487px -430px }
form.sendRichMail label { display: none }
form.sendRichMail p { padding-bottom: 6px }
form.sendRichMail input, form.sendRichMail textarea {
	background-color: #DBDAD8;color: #333333; font: normal normal 13px Arial, Verdana, sans-serif; 
	border: 1px solid #B3B3B3; -moz-border-radius: 6px; -webkit-border-radius: 6px; padding: 5px 20px; margin-left: 30px
}
form.sendRichMail input.textfield { width: 150px }
form.sendRichMail textarea.textarea { width: 225px; height: 60px }
form.sendRichMail input.submit { 
	width: 66px; padding: 28px 0 0 0; border: none; background-color: transparent; 
	background-position: -349px -431px; cursor: pointer }
form.sendRichMail input.submit:hover, form.sendRichMail input.submit:active{ background-position: -419px -431px }
form.sendRichMail .input-error { background-position: -636px -439px; height: auto }
form.sendRichMail .msg-status { 
	 margin: 6px 0 0 30px; width: 242px; height: 20px; 
	-moz-border-radius: 6px; -webkit-border-radius: 6px; padding: 3px 0 0 25px; font-size: 12px; font-weight: bold
}
form.sendRichMail .loading-img{ background: url('i/loading.gif') no-repeat 3px 2px }
form.sendRichMail .error-img{ background-position: -634px -376px; no-repeat 3px 0 }
form.sendRichMail .success-img{ background-position: -634px -301px; no-repeat 3px 0 }

/** Browser Not Supported **************/
#browsernotsupported { background: white; width: 763px; height: 243px; padding-top: 50px; line-height: 1.5em }
#browsernotsupported h2 { width: 474px; margin: 0 auto; font-size: 22px; text-align: center; padding: 25px 0 }
#browsernotsupported p { width: 474px; margin: 0 auto; text-align: center; font-size: 16px }
#browsernotsupported a { font-weight: bold; margin-right: 6px }
