/*
	Notes: CSS ONLY FOR PRINT
*/

/*
***Reset for control "Cross Browsing"***
Adapted from YUI Yahoo!
*/
*, 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, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
center, u, b, i {margin: 0;padding: 0;border: 0;outline: 0;font-weight: normal;font-style: normal;font-size: 100%;font-family: inherit;vertical-align: baseline;}
body {line-height: 1}
:focus {outline: 0;color: #0CA8E5;text-decoration:none;}
ol, ul {list-style: none}
table {border-collapse: collapse;border-spacing: 0}
blockquote:before, blockquote:after, q:before, q:after {content: ""}
blockquote, q {quotes: "" ""}
input, textarea {margin: 0;padding: 0}
hr {margin: 0;padding: 0;border: 0;color: #000;background-color: #000;height: 1px}
strong{font-family:inherit;font-size:inherit;color:inherit;}

/* CSS DOCUMENTATION:

* GENERAL
** HEADER
*** PORTFOLIO
**** FOOTER
***** SPECIAL
****** TYPOGRAPHY
******* COLOR SCHEME

*/


/*************************************************************
* GENERAL
**************************************************************/
/*reduce the default browser font size from 16px to 10px because
we are working in em and we need a rounded measure*/
body{font-size: 55%;background-color:#e5e5e5;}
/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
	display: block;
}
.float-left{float:left;}
.float-right{float:right;}
.hidden{visibility:hidden;}
/* advanced clearfix for fix floating elements */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

.clear{clear:both;}/*basic way for clearing floats*/

#wrapper-content{
	height:auto;
	width:1020px;
	margin:0 auto;
	text-align:left;
	padding:0px;
	}
/*Using font-generator from fontsquirrel you can use any font you want. Just change this font.face declaration. And use new in body element*/
@font-face {
	font-family: 'Museo300';
	src: url('font-face-museo/museo300-regular-webfont.eot');
	src: local('☺'), url('font-face-museo/museo300-regular-webfont.woff') format('woff'), url('font-face-museo/museo300-regular-webfont.ttf') format('truetype'), url('font-face-museo/museo300-regular-webfont.svg#webfonteVq9mYG3') format('svg');
	font-weight: normal;
	font-style: normal;
}
/*When you have your new generated font just need to change it here*/
body {font-family: Palatino, Georgia, serif;font-size: .5em;#font-size: .4em;font-style: normal;background:url(../themes/theme2/bg.jpg) center no-repeat;}

/*************************************************************
* HEADER
**************************************************************/
header{position:relative;min-height:300px;padding:0px;padding:0px 0 0 0;page-break-before: always;}
h1 a{display:block;font-size:4em;#font-size:3em;line-height:1em; letter-spacing:-1.5px;width:400px;text-decoration:none;float:left;float:none\9;}/*title in the head*/
h1 strong{display:block;}
div#head-content{width:820px;margin:0 auto 0 auto;padding-top:60px;}
header p{font-size:1.7em;#font-size:1.5em;line-height:1.3em;margin-top:35px;#margin-top:-40px;padding-bottom:25px;clear:both\9;}/*text in head*/
header p small a{font-size:.7em;letter-spacing:0px;color:#e5e5e5;padding:0 25px 0 15px;background:url(../images/icons/vcard-small.png) top right no-repeat;text-decoration:none;font-style:italic;}
header p small a:hover{color:#FFF;}
header ul{display:block;width:78px;height:25px;float:right;margin:50px 10px 0 0;}
header ul li{display:block;float:left;margin-right:1px;}
header ul li a{display:block;width:25px;height:25px;text-indent:-9999px;background:url(../images/ico-social-small.png) top left no-repeat;}
header ul li.ico-twitter a{background:url(../images/ico-social-small.png) -25px 0px no-repeat;}
header ul li.ico-mail a{background:url(../images/ico-social-small.png) -50px 0px no-repeat;}
header ul li.ico-facebook a:hover{background:url(../images/ico-social-small.png) 0px -26px no-repeat;}
header ul li.ico-twitter a:hover{background:url(../images/ico-social-small.png) -25px -26px no-repeat;}
header ul li.ico-mail a:hover{background:url(../images/ico-social-small.png) -50px -26px no-repeat;}



/*************************************************************
** PORTFOLIO
**************************************************************/
section#portfolio{position:relative;min-height:770px;padding:30px 0 0 110px;}
#portfolio figure.featured{position:absolute;top:20px;left:20px;z-index:0;}
#portfolio nav{display:none;}
#portfolio .featured{display:none;}
#portfolio nav ul{position:relative;width:750px;#width:810px;height:30px;}
#portfolio nav ul#nav-works li{width:auto;height:auto;margin:4px 15px 0 0;font-size:1.7em;#font-size:1.5em;visibility:hidden;}
#portfolio nav ul#nav-works li#nav-first-child{height:auto;text-indent:10px;padding:20px 30px 20px 40px;margin:-10px -30px 0 30px;background:url(../images/icons/filter-tag.png) 10px 15px no-repeat;visibility:visible;}
#portfolio nav ul#nav-works li.fade-option{}
#portfolio nav ul#nav-works li.fade-option a{display:block;text-decoration:none;color:#1d1d1d;padding:5px;}
#portfolio nav ul#nav-works li a.current, #portfolio nav ul#nav-works li a:hover{background:#1d1d1d;color:#e5e5e5;}
#portfolio ul{position:relative;width:825px;height:690px;}
#portfolio ul li{
	position:relative;
	display:block;
	float:left;
	margin:0 1px 1px 0;
	width:160px;
	height:160px;
	}
#portfolio ul li figure{position:absolute;}
#portfolio ul li div.work-caption{
	position:absolute;
	background:url(../images/backgrounds/info-box-bg.jpg) #1d1d1d;
	width:210px;
	height:210px;
	#width:180px;
	#height:120px;
	top:-45px;
	margin-left:-45px;
	#top:0px;
	#margin-left:-60px;
	color:#FFF;
	padding:20px;
	display:none;
	z-index:1000;
	overflow:hidden;
	-moz-box-shadow: 0px 0px 14px #000;
	-webkit-box-shadow: 0px 0px 40px #000;
	box-shadow: 0px 0px 1px #000;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}
#portfolio ul li div.work-caption span,div.work-caption a {display:block;width:190px;#text-indent:-9999px;}
div.work-caption a{#text-indent:0px;}/*styles only for IE7 alternative view as result of z-index bug*/
#portfolio ul li div.work-caption h3 a.caption-title{text-transform:uppercase;font-size:2em;#font-size:2.5em;#line-height:40px;text-decoration:none;padding:0 0 10px 0;margin:10px;}
#portfolio ul li div.work-caption h3 a.caption-title{#border:none;#margin-top:55px;}/*styles only for IE7 alternative view as result of z-index bug*/
#portfolio ul li div.work-caption span.description{position:relative;font-size:1.3em;line-height:1.5em;margin:15px 0 20px 10px;height:110px;overflow:hidden;}
#portfolio ul li div.work-caption span.year{position:absolute;font-size:1.2em;text-transform:uppercase;margin:-14px 0 0 10px;}
#portfolio ul li div.work-caption span.type{position:absolute;font-size:1.2em;text-transform:uppercase;margin:0px 0 0 10px;}
#portfolio ul li div.work-caption span.magnify{position:absolute;bottom:30px;left:190px;}
#portfolio ul li div.work-caption span.magnify{#visibility:hidden;}/*styles only for IE7 alternative view as result of z-index bug*/
#portfolio ul li div.work-caption span.magnify a{
	display:block;
	width:10px;
	line-height:10px;
	padding:10px;
	font-size:1.7em;
	text-decoration:none;
	color:#e5e5e5;
	-moz-transition:background 0.2s ease-in-out, color 0.1s ease-in-out;
    -webkit-transition:background 0.2s ease-in-out, color 0.1s ease-in-out;
    -o-transition:background 0.2s ease-in-out, color 0.1s ease-in-out;
	transition:background 0.2s ease-in-out, color 0.1s ease-in-out;
	}
#portfolio ul li div.work-caption span.magnify a:hover{background:#e5e5e5;color:#181818;}
div#pagination{display:none;}
div#pagination span{font-size:2em;}
div#pagination span.arrow a{
	display:inline-block;
	width:94px;
	height:27px;
	left:0px;
	text-decoration:none;
	color:#1d1d1d;	
	padding:5px;
	text-indent:15px;
	}
div#pagination span#arrow-left a{background:url(../images/icons/btns/btn-pagination-sprite.png) left -28px no-repeat;#text-indent:15px;}
div#pagination span#arrow-left a:hover{background:url(../images/icons/btns/btn-pagination-sprite.png) -103px -29px no-repeat;}
div#pagination span#arrow-right{margin-left:7px;#margin-left:15px;}
div#pagination span#arrow-right a{height:20px;background:url(../images/icons/btns/btn-pagination-sprite.png) left 0px no-repeat;text-indent:17px;}
div#pagination span#arrow-right{position:absolute;#top:1px;#left:95px;}
div#pagination span#arrow-right a:hover{background:url(../images/icons/btns/btn-pagination-sprite.png) -103px 0px no-repeat;}
div#pagination span#shadow-arrows{display:block;width:224px;height:9px;position:absolute;top:30px;#left:15px;background:url(../images/icons/btns/pagination-shadow.png) no-repeat;}

/*************************************************************
*** FOOTER
**************************************************************/
footer{position:relative;min-height:170px;background-color:#1d1d1d;margin-top:-50px;}
footer h4{width:75px;font-size:2em;letter-spacing:-1px;padding:30px 0 20px 110px;color:#3a3a3a;}
footer ul{display:block;font-size:1.4em;#font-size:1.2em;line-height:1.5em;color:#3a3a3a;letter-spacing:0px;}
footer section{float:left\9;}
footer section#footer-contact-section{width:310px;float:left;}
footer ul#contact-info{margin:0 0 0 110px;}
footer ul#contact-info li{line-height:19px;padding-left:0px;}
footer ul#contact-info li#chat{background:url(../images/icons/btns/contact-icons.png) -1px 0px no-repeat;}
footer ul#contact-info li#mail{background:url(../images/icons/btns/contact-icons.png) -1px -17px no-repeat;}
footer ul#contact-info li#phone{background:url(../images/icons/btns/contact-icons.png) -1px -38px no-repeat;}
footer ul#contact-info li a{text-decoration:none;color:#3a3a3a;}
footer section#footer-location-section{width:200px;float:left;margin-left:70px;}
footer section#footer-location-section h4{width:100px;#width:120px;margin-left:-90px;}
footer section#footer-location-section ul{margin-left:20px;}
footer section#footer-map-section{width:200px;float:left;}
footer section#footer-map-section h4{width:200px;margin-left:-70px;}
footer section#footer-map-section ul{margin-left:40px;}
footer section#footer-map-section ul li small{display:block;#display:none;position:absolute;margin:-46px 0 0 130px;width:30px;height:30px;background:url(../images/icons/map-icon.png) no-repeat center center #474747;}

/*************************************************************
**** SPECIAL
**************************************************************/

/************THEME SWITCHER*******************/
#theme-wrapper {position: fixed;bottom: 0;z-index:10000;width:100%;display:none !important;}

/*****************CV WITH HRESUME//MICROFORMATS*******************/
/******700px grid for an easy layout*******/
.fixed{}
.col-1,.col-2,.col-3,.col-4,.col-5 {float:left;}
.col-1{width:100px;}
.col-2{width:200px;}
.col-3{width:300px;}
.col-4{width:400px;}
.col-5{width:700px;}

section#cv{
	position:relative;
	width:100%;
	min-height:700px;
	padding-bottom:15px;
	background:#000;
	color:#e5e5e5;
	z-index:2000;
	#left:0px;
	visibility:visible !important;
	display:block !important;
	}
section#cv div#wrapper-hresume{width:1020px;margin:0 auto 0 auto;padding-left:50px;}
#cv{font-size:1.5em;line-height:1.4em;#font-size:1.4em;#line-height:1.4em;color:#e5e5e5;}
#cv abbr{border:0;padding:0;}

/*personal info*/
#cv a{
	text-decoration:none;
	color:#474747;
	-moz-transition:color 0.1s ease-in-out;
    -webkit-transition:color 0.1s ease-in-out;
    -o-transition:color 0.1s ease-in-out;
	transition:color 0.1s ease-in-out;
	}
#cv a:visited{}
#cv a:hover{text-decoration:none;color:#e5e5e5;}
#cv h2{font-size:2.6em;margin:0 0 1em 0;text-transform:uppercase;margin-top:2em;letter-spacing:-1.7px;}
#cv h3.personal-tag{font-size:1em;}
#cv .contact, #cv .vcalendar, #cv .skills{padding:1em 0;overflow:hidden;}
#cv .tel, #cv span.street-address, #cv span.locality, #cv span.region, #cv span.postal-code, #cv span.country-name, #cv span.url{display:block;color:#9D9D9D;}
#cv .contact .type{display:none;}
#cv section.contact ul{list-style-type:none;padding:0;margin:0;}
#cv section.contact section section{padding:0 0 1em 0;overflow:hidden;}
#cv .contact{float:left;margin-right:100px;}

/*skills*/
#cv section.skills ul{list-style-type:none;padding:0;margin:0;color:#474747;}
#cv section.skills section{padding:.3em 0 1.5em 0;overflow:hidden;}
.tabbed{text-indent:0px;}

/*experience*/
#cv article.vcalendar{float:left;margin-right:100px;}
#cv .experience{margin:0 0 2.5em 0;overflow:hidden;}
#cv .experience .period{#font-size:.9em;color:#474747;font-style:italic;}
#cv .experience hgroup{margin:0 0 1.1em 0;}
#cv .experience hgroup h3, #cv .education hgroup h3{font-size:1.3em;line-height:1.3em;}
#cv .experience hgroup h4, #cv .education hgroup h4{font-size:0.9em;}
#cv .experience .description{padding:0 1.1em 0 0;margin-top:10px;color:#474747;}
#cv .experience .notes{color:#9D9D9D;font-style:italic;}

/*education*/
#cv .education{margin:0 0 1.1em 0;overflow:hidden;}
#cv .education .description{color:#474747;margin-top:10px;}
#cv .education .period{#font-size:.9em;color:#474747;font-style:italic;}

#cv .close-btn{display:none;}
#cv .close-btn a{display:block;font-size:1.2em;padding:5px;}
#cv .close-btn a:hover{color:#e5e5e5;}
#cv .c-btn-top{/*width:200px;margin:0 auto 0 auto;*/top:35px;right:17%;}
#cv .c-btn-bottom{bottom:50px;right:20%;}

/************COLOR SCHEME**************/

/*colors are agrouped for a better organization with theme schemes changes*/
h1 a{color:#16c6cc;}/*color for main title*/
h1 strong{color:#049c5f;}/*color for the name in main title*/
a.caption-title{color:#049c5f;border-bottom:1px dotted #049c5f;}/*color for caption in info panel on hover*/
header{background:#1d1d1d;}
header p{color:#e5e5e5;}
section#portfolio{background:#049c5f;}
div#pagination span.arrow a:hover{color:#049c5f;}