/* CSS stylesheet for ProCV */

/* CSS Mini Reset */

html, body, div, form, fieldset, legend, label
{
 margin: 0;
 padding: 0; 
}

table
{
 border-collapse: collapse;
 border-spacing: 0;
}

th, td
{
 text-align: left;
 vertical-align: top;
}

h1, h2, h3, h4, h5, h6, th, td, caption { font-weight:normal; }

img { border: 0; }

/*
	HTML5 it!
*/
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }

/*
	FONTS
*/

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on August 8, 2010 06:45:50 AM America/New_York */
/* http://www.fontsquirrel.com/fontfacedemo/DejaVu-Sans */


@font-face {
	font-family: 'DejaVu-regular';
	src: url('../fonts/DejaVu/DejaVuSans-webfont.eot');
	src: local('☺'), 
	url('../fonts/DejaVu/DejaVuSans-webfont.woff') format('woff'), 
	url('../fonts/DejaVu/DejaVuSans-webfont.ttf') format('truetype'), 
	url('../fonts/DejaVu/DejaVuSans-webfont.svg#webfont1VsYjV21') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'DejaVu-bold';
	src: url('../fonts/DejaVu/DejaVuSans-Bold-webfont.eot');
	src: local('☺'), 
	url('../fonts/DejaVu/DejaVuSans-Bold-webfont.woff') format('woff'), 
	url('../fonts/DejaVu/DejaVuSans-Bold-webfont.ttf') format('truetype'), 
	url('../fonts/DejaVu/DejaVuSans-Bold-webfont.svg#webfonty0cMOwRz') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'DejaVu-CondensedBold';
	src: url('../fonts/DejaVu/DejaVuSansCondensed-Bold-webfont.eot');
	src: local('☺'), 
	url('../fonts/DejaVu/DejaVuSansCondensed-Bold-webfont.woff') format('woff'), 
	url('../fonts/DejaVu/DejaVuSansCondensed-Bold-webfont.ttf') format('truetype'),
	url('../fonts/DejaVu/DejaVuSansCondensed-Bold-webfont.svg#webfont8DaCTbJr') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'DejaVu-CondensedOblique';
	src: url('../fonts/DejaVu/DejaVuSansCondensed-Oblique-webfont.eot');
	src: local('☺'), url('../fonts/DejaVu/DejaVuSansCondensed-Oblique-webfont.woff') format('woff'), 
	url('../fonts/DejaVu/DejaVuSansCondensed-Oblique-webfont.ttf') format('truetype'), 
	url('../fonts/DejaVu/DejaVuSansCondensed-Oblique-webfont.svg#webfontG2LZ0Lvg') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* 
	Global Styles 
*/

html { font-family: Arial; font-size: 12px; color:#333; overflow-y: scroll; background:url("../images/body_bg_bot.png") repeat scroll 0 top #FFFFFF;}

body { background:url("../images/body_bg_top.png") repeat-x scroll 0 top transparent;} 
/* body, #print_btn { background:url(../images/squared_bg.png);} */


h1 { font-size:40px; color:#fff; font-family: DejaVu-bold, arial, helvetica; margin:0.45em 0; padding:0; line-height: 0.45em; text-shadow:0 1px 3px #000;}
h2 {
	font-size:23px;
	color:#ccc;
	font-family: DejaVu-bold, arial, helvetica;
	margin:0.78em 0;
	padding:0;
	line-height:1.05em;
	text-shadow:0 1px 3px #000000;
	text-align: center;
}
h3 { font-size:19px; color:#fff; font-family: DejaVu-regular, arial, helvetica; margin:0 0 0; padding: 0; line-height:3em;text-shadow:0 1px 3px #000000;}
h4 { font-size:14px; color:#fff; font-family: DejaVu-regular, arial, helvetica; margin:1.286em 0 0; padding: 0; line-height:1.286em;text-shadow:0 1px 3px #000000;}
a { text-decoration: none; cursor:pointer; font-family: DejaVu-regular, arial, helvetica; }
p { font-size:12px; color:#fff; line-height: 1.5em; font-family: DejaVu-regular, arial, helvetica; margin:1.5em 0 0; }

/*
	STRUCTURE
*/

#wrapper { margin:0 auto; position: relative; width: 800px;}
#sidebar { position: fixed; float:left; top:302px; width:150px;}
.page_wrap { margin-left:200px; width:600px; }


/*
	NAVIGATION
*/
nav ul { margin:18px 0 0 0; }
nav ul li { line-height:1em; list-style: none; }
nav ul li a { display:block; color:#999; font-size: 15px; margin:0.5em 0; line-height:1em; padding:4px 5px; text-shadow:0 1px 3px #000000;}
nav ul li a:hover { color:#fff;  }
nav ul li a.activeLink { color:#fff; cursor:default; }
nav ul li a:focus { user-focus: none; outline : none; -moz-user-focus: none; -moz-outline: none; }


/*
	HEADER
*/
header {  width:564px; height:95px; padding:18px 0px 0 36px; }
header p { text-align:right; color:#999; margin-top:0; float:right; clear:right; width:400px; }
header #phone { background:url(../images/icon_phone.png) no-repeat center center transparent;  }
header #email_link { background:url(../images/icon_email.png) no-repeat center center transparent;  }
header #web { background:url(../images/icon_globe.png) no-repeat center center transparent;  }
header #print { background:url(../images/icon_print.png) no-repeat center center transparent;  }
header #print_btn { background: none; color:#fff; padding:0; border:none; cursor: pointer;}
header p a { color:#999; }
header p a:hover { color:#fff; text-decoration:underline;}
hgroup { text-align: right;}


/*
	SECTIONS
*/

section { width:564px; padding:18px 0 18px 36px; text-align: justify;  }
section article p { color:#ccc; text-shadow:0 1px 3px #000000; }
section h3 { text-align:right; padding-right:60px;}
section article h4 .sub, .boxed {
 color:#fff;display:block;float:right;font-family:DejaVu-regular,arial,helvetica; font-size:11px;padding:0px 10px; opacity:0.7;}
section article .web { clear:left; }
section article ul, section article ol { margin-top:1.5em;}
section article ul li{ list-style-type: square; font-size:12px; color:#ccc; line-height: 1.5em; font-family: DejaVu-regular, arial, helvetica; text-shadow:0 1px 3px #000000; }
section article ol li { font-size:12px; color:#ccc; line-height: 1.5em; font-family: DejaVu-regular, arial, helvetica; text-shadow:0 1px 3px #000000; }
section article h4 .sub { background:#333; }

.title_about { background:url("../images/icon_speech.png") no-repeat scroll right center;}
.title_skills { background:url("../images/icon_skills.png") no-repeat scroll right center;}
.title_employment { background:url("../images/icon_employment.png") no-repeat scroll right center;} 
.title_education { background:url("../images/icon_education.png") no-repeat scroll right center;}
.title_references { background:url("../images/icon_references.png") no-repeat scroll right center;}
.title_contact { background:url("../images/icon_contact.png") no-repeat scroll right center;}

.employment_img { float:left; margin-right:18px;}

/*
	CONTACT SECTION
*/
.split_col_wrapper { overflow: hidden;}
.split_col_wrapper p { color:#ccc; text-shadow:0 1px 3px #000;}
.split_col1 { width: 240px; float:left; }
.split_col2 { width: 240px; float:right; }


/*
	EXTRAS
*/
#printed-footnote { display:none; }
p.footnote { font-size:10px; line-height:1.8em; margin:0.9em 0;}


/*
	DIVIDERS
*/
.divider    { background: url(../images/h-line.gif) no-repeat 0 0 transparent; height: 2px; margin:17px auto;}
.divider200 { background: url(../images/h-line.gif) no-repeat 0 0 transparent; width: 200px; height: 2px; margin:17px auto;}
.divider564 { background: url(../images/h-line.gif) no-repeat 0 0 transparent; width: 430px; height: 2px; margin:17px auto;}


/*
	TOP PICTURE (CSS3 DOES IT ALL FOR YOU, BUT IN WINDOZE WE USE AN IMG BACKGROUND)
*/
#pic_frame_wrapper { 
-moz-border-radius: 10px;-webkit-border-radius: 10px; border-radius: 10px;
-moz-transform:rotate(12deg) translate(0px, 0px);
/* Firefox */
-moz-transform: rotate(12deg) translate(0px, 0px);
 /* WebKit */
-webkit-transform: rotate(12deg) translate(0px, 00px);
/* Opera */
-o-transform: rotate(12deg) translate(0px, 0px);
 /* Standard */
transform: rotate(12deg) translate(0px, 0px);
background: #222; padding: 10px; position:absolute; top:55px; left:250px; z-index:10; }

#pic_frame { width:178px; height:193px; 
-moz-border-radius: 10px;-webkit-border-radius: 10px; border-radius: 10px;
-moz-transform:rotate(-12deg) translate(0px, 0px);
-moz-transform: rotate(-12deg) translate(0px, 0px);
-webkit-transform: rotate(-12deg) translate(0px, 00px);
-o-transform: rotate(-12deg) translate(0px, 0px);
transform: rotate(-12deg) translate(0px, 0px);
background:url(../images/pic.jpg) no-repeat 10px 10px white;
}


/*
	GOOGLE CHART
*/

#chart { float:right; margin-left:18px;}


/*
	SOCIAL MEDIA
*/
#flickr { background:url(../images/icon_flickr.png) no-repeat center left transparent; }
#twitter { background:url(../images/icon_twitter.png) no-repeat center left transparent; }
#facebook { background:url(../images/icon_facebook.png) no-repeat center left transparent; }
#delicious { background:url(../images/icon_delicious.png) no-repeat center left transparent; }
#reddit { background:url(../images/icon_reddit.png) no-repeat center left transparent; }
.social_media { padding-left:50px; line-height: 24px; }
.social_media a { color:#999; }
.social_media a:hover { color:#fff; text-decoration:underline;}


/*
	UTILITY
*/
.CondensedOblique { font-family: DejaVu-CondensedOblique, arial, helvetica;  }
.floatRight { float:right; }
.result {  }
.address {  }
.ref_contact {  float: right; text-align:right; font-family: DejaVu-CondensedOblique, arial, helvetica;}
.weblink { color:#999; background:url(../images/icon_globe.png) no-repeat left center transparent; padding-left:30px;  }
.weblink:hover { color:#fff; text-decoration:underline;  }
.t-center { text-align:center;}
.box-shadow {-moz-box-shadow:5px 5px 10px #888; -webkit-box-shadow: 5px 5px 10px #888; box-shadow:5px 5px 10px;}
.hidden { display: none;}

/*
	FORMS
*/
#contactform { background:#eee; padding:0 20px 20px; margin-top:18px; overflow: hidden; 
-moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px;
}
#contactform label {padding:18px 0 0; display:block; line-height:1.5em; cursor:pointer; color:#333; }
#contactform .input { background: #fff; border:solid 1px #E5E5E5; color:#555; outline: 0;}
#contactform .input:hover, #contactform .textarea:hover,  #contactform .input:focus, #contactform .textarea:focus { border-color: #C9C9C9;
-webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;}
#contactform .textfield { padding:0.75em 10px; width: 180px; font-family: DejaVu-regular, arial, helvetica; font-size: 12px; }
#contactform .textarea { padding: 0.75em 10px; width: 180px; height:126px; font-family: DejaVu-regular, arial, helvetica; font-size: 12px; }
#contactform .submit_btn { margin:1.5em 0 0; width:200px; float:right; background:#555; color:#fff; border:1px solid #ccc; cursor:pointer; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; }
#contactform .textarea, #contactform .input {  box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF)); background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);}
span.error { text-align: left; color: #f00; display:block; line-height:1.5em;}
#message { -moz-border-radius: 10px;-webkit-border-radius: 10px; border-radius: 10px; margin-top:30px; background: #222222; padding:20px;}
#message p { text-align: left; color:#fff; font-size:12px;}